/* World: framed picture and three theses that lead to their sections. */
.world-section { padding-block:var(--section-y); }
.world-layout { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:clamp(40px,5vw,140px); margin-top:clamp(40px,4.4vw,100px); }
.world-picture { --corner-gap:12px; --corner-size:clamp(22px,1.6vw,40px); position:relative; margin:0; aspect-ratio:16 / 11; border:1px solid var(--line-gold); }
.world-picture img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(1.08) translate(calc(var(--tilt-x,0) * -10px),calc(var(--tilt-y,0) * -8px)); transition:transform 1s var(--ease); }
.world-picture::before { content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,transparent 35%,#0b0b17e8 100%),radial-gradient(circle at var(--spot-x,50%) var(--spot-y,40%),#ead8a61c,transparent 40%); pointer-events:none; }
.world-picture-copy { position:absolute; left:clamp(20px,2.4vw,64px); bottom:clamp(20px,2.2vw,60px); z-index:2; display:grid; gap:6px; }
.world-picture-copy strong { font:400 clamp(44px,2.4vw + 22px,110px)/1 var(--serif); color:#f3e7d6; }
.world-picture-copy>span:last-child { color:var(--text-soft); }
.picture-coordinate { position:absolute; right:14px; top:14px; z-index:2; writing-mode:vertical-rl; font:600 var(--fs-micro)/1 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:#e6d6c4cc; }
.world-picture { overflow:clip; overflow-clip-margin:calc(var(--corner-gap) + 2px); }
@supports (animation-timeline:view()) {
  /* The art drifts inside its frame while the frame crosses the viewport. */
  .js-motion .world-picture img { animation:world-drift linear both; animation-timeline:view(); }
  @keyframes world-drift { from { object-position:50% 70%; } to { object-position:50% 25%; } }
}

.world-features { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.feature { border-bottom:1px solid var(--line); }
.feature>a { position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:clamp(14px,1.4vw,32px); padding:clamp(20px,1.8vw,40px) clamp(4px,.8vw,20px); transition:background-color var(--t-mid); }
.feature>a::before { content:''; position:absolute; left:0; top:-1px; bottom:-1px; width:2px; background:var(--gold); scale:1 0; transform-origin:top; transition:scale var(--t-mid) var(--ease); }
.feature>a:hover,.feature>a:focus-visible { background:linear-gradient(90deg,#e2bb7b10,transparent 70%); }
.feature>a:hover::before,.feature>a:focus-visible::before { scale:1; }
.feature-number { font:500 clamp(20px,.7vw + 14px,40px)/1.2 var(--serif); color:var(--gold-5); }
.feature-copy { display:grid; gap:8px; }
.feature-copy strong { font:500 var(--fs-h3)/1.15 var(--serif); transition:color var(--t-fast); }
.feature-copy>span { color:var(--muted); max-width:36em; }
.feature>a:hover strong { color:var(--gold-bright); }
.feature-glyph .ui-icon { width:clamp(26px,1vw + 16px,44px); height:auto; color:var(--gold); transition:transform var(--t-mid) var(--ease-spring); }
.feature>a:hover .feature-glyph .ui-icon { transform:translateY(-3px) rotate(-8deg); }
@media (max-width:1099.98px) { .world-layout { grid-template-columns:1fr; } }
@media (max-width:560px) { .world-picture { aspect-ratio:4 / 3.4; } .feature-glyph { display:none; } .feature>a { grid-template-columns:auto minmax(0,1fr); } }