/* UMBORALIS V2 — website, sections 01–06 (local build, not published).
   Faithful port of the approved V2 design boards:
   Hero + Section 02 (Main.dc.html, S02.dc.html, s02.css), Section 03 V2-09b (S03Final.dc.html),
   Section 04 V2-11 (S04.dc.html), Section 05 V2-13 (S05.dc.html), Section 06 V2-16 (S06.dc.html). Values are copied from those files; additions are marked "PREVIEW:". */

@font-face { font-family: 'Geist'; font-weight: 100 900; font-style: normal; font-display: swap; src: url(assets/fonts/geist-latin.woff2) format('woff2'); }
@font-face { font-family: 'Geist Mono'; font-weight: 100 900; font-style: normal; font-display: swap; src: url(assets/fonts/geistmono-latin.woff2) format('woff2'); }

html { background: #010204; scroll-behavior: smooth; }
body { margin: 0; background: #010204; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* PREVIEW: skip link */
.skip { position: absolute; left: 16px; top: -64px; z-index: 100; padding: 12px 18px; background: #f2f1ed; color: #0a0f16; font: 400 14px/1 'Geist', Arial, sans-serif; letter-spacing: .08em; text-decoration: none; border-radius: 2px; }
.skip:focus { top: 16px; outline: 2px solid #a9d4ff; outline-offset: 3px; }

/* ===== 01 HERO — dark (Main.dc.html) ===== */
.hero { position: relative; height: 900px; overflow: hidden; background: #03060b; color: #eaf2fb; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; }
.hero *, .hero *::before, .hero *::after { box-sizing: border-box; }
.hero h1, .hero p { margin: 0; font-weight: 200; }
.hero button { font-family: inherit; }
.hero a:focus-visible, .hero button:focus-visible { outline: 2px solid #a9d4ff; outline-offset: 4px; }
/* PREVIEW: the image scales with the viewport (122.22vw = the board's 1760px at 1440px) so the focal point and the reveal origin stay aligned */
.hero-bg { position: absolute; inset: 0; background-image: url(assets/img/hero.jpg); background-repeat: no-repeat; background-size: 122.222vw auto; background-position: 0 50%; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,6,11,.64) 0%, rgba(3,6,11,.28) 42%, rgba(3,6,11,0) 64%), linear-gradient(180deg, rgba(3,6,11,.5) 0%, rgba(3,6,11,0) 24%); }
.hero-reveal { position: absolute; inset: 0; background: radial-gradient(circle at 86.7% 57.7%, rgba(3,6,11,0) calc(11.25vw * var(--k)), rgba(3,6,11,.97) calc(39.4vw * var(--k))); animation: reveal 6.5s cubic-bezier(.3,.1,.2,1) both; pointer-events: none; }
/* PREVIEW: the board scales a 180%-size overlay (its hard edge shows during the first seconds); here the same circular reveal is drawn by animating the gradient radius instead. Same focal point, timing and easing. */
@property --k { syntax: '<number>'; inherits: false; initial-value: 2.6; }
@keyframes reveal { from { --k: .22; opacity: 1; } 80% { opacity: 1; } to { --k: 2.6; opacity: 0; } }
.hero-fog { position: absolute; left: 0; right: 0; bottom: 0; height: 430px; background: linear-gradient(to bottom, rgba(242,241,237,0) 0%, rgba(242,241,237,.05) 28%, rgba(242,241,237,.36) 60%, rgba(242,241,237,.86) 88%, #f2f1ed 100%); }
.hero-top { position: absolute; top: 0; left: 0; right: 0; padding: 36px 56px; display: flex; justify-content: space-between; align-items: center; z-index: 5; }
.sig { display: flex; align-items: baseline; text-decoration: none; }
.sig-a { font-size: 13px; letter-spacing: .42em; font-weight: 300; color: #eaf2fb; }
.sig-b { font-size: 10px; letter-spacing: .5em; font-weight: 300; color: #9fc9f4; margin-left: 14px; }
.menu-btn { width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(200,225,255,.32); background: rgba(4,7,12,.18); display: grid; place-items: center; cursor: pointer; color: #eaf2fb; transition: background .4s ease, border-color .4s ease; }
.menu-btn:hover, .menu-btn[aria-expanded="true"] { background: rgba(4,7,12,.5); border-color: rgba(200,225,255,.6); }
.hero-copy { position: absolute; left: 120px; top: 258px; z-index: 3; max-width: 720px; }
.eyebrow { font-size: 12px; letter-spacing: .34em; color: #9fc9f4; font-weight: 400; margin-bottom: 34px; }
.hero h1 { font-size: 68px; line-height: 1.1; letter-spacing: .07em; text-transform: uppercase; color: #f4f8fd; }
.hero h1 span { display: block; }
.hero .hero-p { font-size: 21px; line-height: 1.55; color: rgba(226,238,252,.82); font-weight: 300; margin-top: 36px; max-width: 420px; }
.cta { display: inline-flex; align-items: center; gap: 18px; margin-top: 46px; color: #fff; text-decoration: none; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; font-weight: 400; }
.cta-ring { width: 50px; height: 50px; border-radius: 50%; border: 1px solid rgba(169,212,255,.72); display: grid; place-items: center; box-shadow: 0 0 30px rgba(130,190,255,.28); transition: background .5s ease, box-shadow .5s ease; }
.cta:hover .cta-ring { background: rgba(169,212,255,.14); box-shadow: 0 0 44px rgba(130,190,255,.45); }

/* PREVIEW: minimal accessible navigation panel (the approved hero only shows a menu button) */
.nav-panel { position: absolute; top: 94px; right: 56px; z-index: 6; min-width: 300px; padding: 10px 0; background: rgba(4,7,12,.94); border: 1px solid rgba(169,212,255,.26); border-radius: 4px; box-shadow: 0 24px 60px rgba(0,0,0,.5); }
.nav-panel[hidden] { display: none; }
.nav-panel ul { list-style: none; margin: 0; padding: 0; }
.nav-panel a { display: block; padding: 15px 24px; color: #eaf2fb; text-decoration: none; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; font-weight: 400; }
.nav-panel a:hover { background: rgba(169,212,255,.1); color: #fff; }
.nav-panel a:focus-visible { outline: 2px solid #a9d4ff; outline-offset: -2px; }
.nav-panel .n { color: #9fc9f4; margin-right: 14px; }

/* ===== 02 PEOPLE · IDEAS · OPPORTUNITIES — light (S02.dc.html + s02.css) ===== */
/* wrapper: the board's .s2 section without the bottom padding (section 03's own soft-white tail takes over) */
.s2 { position: relative; background: #f2f1ed; color: #0a0f16; padding: 70px 0 0; text-align: center; }
.s2 .s2x-root { width: 100%; background: #f2f1ed; color: #0a0f16; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; padding-bottom: 8px; }

.pl-people { background-image: url(assets/img/p01-people.png); }
.pl-ideas  { background-image: url(assets/img/p02-ideas.png); }
.pl-opps   { background-image: url(assets/img/p03-opportunities.png); }

.s2x { --sw: #f2f1ed; --ink: #0a0f16; --ink-2: #4f5a66; --ice: #6fb0f2; --warm: #c8915e; --stageH: 720px;
  font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; color: var(--ink); text-align: left; -webkit-font-smoothing: antialiased; }
.s2x *, .s2x *::before, .s2x *::after { box-sizing: border-box; }
.s2x button { font-family: inherit; }

.s2x-head { max-width: 1440px; margin: 0 auto; padding: 40px 72px 0; display: grid; grid-template-columns: 7fr 4fr; column-gap: 48px; align-items: end; }
.s2x-title { margin: 0; font-size: 88px; line-height: 1.02; font-weight: 200; letter-spacing: -.02em; color: var(--ink); }
.s2x-side { padding-bottom: 14px; }
.s2x-rule { width: 40px; height: 1px; background: var(--warm); margin-bottom: 22px; }
.s2x-lead { margin: 0; font-size: 20px; line-height: 1.6; font-weight: 300; color: var(--ink-2); max-width: 30ch; }

.s2x-stage { position: relative; display: flex; gap: 10px; height: var(--stageH); margin: 80px auto 0; padding: 0 24px; max-width: 1440px; }
.s2x-horizon { position: absolute; left: 0; right: 0; top: 53.2%; height: 1px; z-index: 5; pointer-events: none;
  background: linear-gradient(90deg, rgba(169,212,255,0) 0%, rgba(111,176,242,.55) 18%, rgba(169,212,255,.9) 50%, rgba(111,176,242,.55) 82%, rgba(169,212,255,0) 100%); }
.s2x-panel { position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; border-radius: 4px; background: #c9d3dc;
  transition: flex-grow 1.4s cubic-bezier(.65,0,.35,1); }

.s2x-img { position: absolute; inset: 0; background-repeat: no-repeat; background-color: #c9d3dc;
  transform: scale(1.04); transform-origin: 50% 53.2%; filter: saturate(.7);
  transition: transform 1.8s cubic-bezier(.22,.61,.36,1), filter 1.4s ease, background-position 1.4s cubic-bezier(.65,0,.35,1); }
.s2x-panel[data-on="true"] .s2x-img { transform: none; filter: none; }
.pl-people, .pl-ideas { background-size: auto 100%; }
.pl-opps { background-size: auto 105.6%; }
.pl-people { background-position: 22% 0; }
.pl-ideas  { background-position: 36% 0; }
.pl-opps   { background-position: 4% 5%; }
.s2x-panel[data-on="true"] .pl-people { background-position: 30% 0; }
.s2x-panel[data-on="true"] .pl-ideas  { background-position: 35% 0; }
.s2x-panel[data-on="true"] .pl-opps   { background-position: 50% 5%; }

.s2x-veil { position: absolute; inset: 0; background: rgba(242,241,237,.40); transition: opacity .6s ease; pointer-events: none; z-index: 2; }
.s2x-panel[data-on="true"] .s2x-veil { opacity: 0; }
.s2x-panel:hover .s2x-veil, .s2x-panel:focus-within .s2x-veil { opacity: .45; }
.s2x-panel[data-on="true"]:hover .s2x-veil { opacity: 0; }

.s2x-scrim { position: absolute; left: 0; right: 0; bottom: 0; height: 46%; z-index: 3; pointer-events: none;
  background: linear-gradient(to top, rgba(4,7,12,.72) 0%, rgba(4,7,12,.34) 45%, rgba(4,7,12,0) 100%); }

.s2x-tab { position: absolute; inset: 0; z-index: 4; width: 100%; background: transparent; border: 0; cursor: pointer; padding: 0; color: #f4f8fd; }
.s2x-tab:focus-visible { outline: 2px solid #ffffff; outline-offset: -6px; box-shadow: inset 0 0 0 8px rgba(111,176,242,.65); }
.s2x-panel[data-on="true"] .s2x-tab { cursor: default; }
.s2x-vlabel { position: absolute; left: 50%; bottom: 40px; transform: translateX(-50%) rotate(180deg); writing-mode: vertical-rl;
  font-size: 13px; letter-spacing: .42em; text-transform: uppercase; font-weight: 500; color: #f4f8fd; text-shadow: 0 1px 8px rgba(0,0,0,.45); transition: opacity .6s ease; }
.s2x-panel[data-on="true"] .s2x-vlabel { opacity: 0; }
.s2x-label { position: absolute; left: 48px; bottom: 44px; font-size: 14px; letter-spacing: .42em; text-transform: uppercase; font-weight: 500;
  color: #f4f8fd; text-shadow: 0 1px 10px rgba(0,0,0,.4); opacity: 0; transform: translateY(8px); transition: opacity .9s ease .4s, transform .9s ease .4s; }
.s2x-label::after { content: ""; display: block; width: 36px; height: 1px; margin-top: 14px; background: rgba(169,212,255,.9); }
.s2x-panel[data-on="true"] .s2x-label { opacity: 1; transform: none; }
/* V2-62: small disclosure on the People image only; non-interactive, wraps inside narrow collapsed panels */
.s2x-ai { position: absolute; top: 12px; left: 12px; z-index: 5; max-width: calc(100% - 24px); padding: 4px 8px; border-radius: 2px; background: rgba(10,15,22,.72); color: #f4f8fd; font-size: 12px; line-height: 1.3; letter-spacing: .02em; pointer-events: none; }
/* V2-63: below 1200 px the collapsed People strip is narrower than the one-line label, so the label runs vertically along the strip, as the existing vertical tab labels do */
@media (min-width: 761px) and (max-width: 1199px) { .s2x-panel[data-on="false"] .s2x-ai { writing-mode: vertical-rl; max-width: none; max-height: calc(100% - 24px); padding: 8px 4px; } }

.s2x-tabs { display: none; }

@media (prefers-reduced-motion: reduce) {
  .s2x-panel, .s2x-img, .s2x-veil, .s2x-vlabel, .s2x-label { transition: none !important; }
}

@media (max-width: 1100px) {
  .s2x { --stageH: 600px; }
  .s2x-head { padding: 32px 40px 0; column-gap: 32px; }
  .s2x-title { font-size: 68px; }
  .s2x-stage { margin-top: 64px; padding: 0 16px; gap: 8px; }
  .s2x-label { left: 32px; bottom: 32px; }
}
@media (max-width: 900px) {
  .s2x { --stageH: 560px; }
  .s2x-head { grid-template-columns: 1fr; row-gap: 24px; }
  .s2x-title { font-size: 56px; }
  .s2x-vlabel { font-size: 12px; letter-spacing: .34em; bottom: 28px; }
}
@media (max-width: 760px) {
  .s2x-head { padding: 20px 24px 0; }
  .s2x-title { font-size: 46px; line-height: 1.05; }
  .s2x-lead { font-size: 18px; }
  .s2x-stage { display: block; margin-top: 44px; padding: 0; }
  .s2x-panel { position: absolute; inset: 0; border-radius: 0; opacity: 0; visibility: hidden; transition: opacity 1.1s ease, visibility 0s linear 1.1s; }
  .s2x-panel[data-on="true"] { opacity: 1; visibility: visible; z-index: 1; transition: opacity 1.1s ease; }
  .s2x-veil, .s2x-vlabel { display: none; }
  .s2x-tab { pointer-events: none; }
  .s2x-img { transform: none !important; filter: none !important; }
  .pl-people, .s2x-panel[data-on="true"] .pl-people { background-position: 17% 0; }
  .pl-ideas,  .s2x-panel[data-on="true"] .pl-ideas  { background-position: 30% 0; }
  .pl-opps,   .s2x-panel[data-on="true"] .pl-opps   { background-position: 8% 5%; }
  .s2x-label { left: 24px; bottom: 28px; }
  .s2x-tabs { display: flex; justify-content: center; gap: 4px; padding: 16px 12px 0; }
  .s2x-tabs button { min-height: 44px; padding: 0 12px; background: transparent; border: 0; border-bottom: 2px solid transparent;
    font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: #5c6670; cursor: pointer; }
  .s2x-tabs button:hover { color: var(--ink); }
  /* V2-21 A3: the active underline uses the site blue #2f6fb6 (4.57:1 on the soft white); keyboard focus uses the ink colour so the two states stay distinct */
  .s2x-tabs button[aria-pressed="true"] { color: var(--ink); border-bottom-color: #2f6fb6; }
  .s2x-tabs button:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
}

/* ===== 03 THE CHALLENGE DECIDES THE FORM — dark (S03Final.dc.html, V2-09b) ===== */
.s3f { width: 100%; overflow: hidden; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.s3f *, .s3f *::before, .s3f *::after { box-sizing: border-box; }
.s3f h2, .s3f p { margin: 0; }
.s3f-tail { height: 190px; background: #f2f1ed; }
.s3f-dark { position: relative; margin-top: -110px; text-align: center; color: #f4f8fd;
  border-radius: 50% 50% 0 0 / 110px 110px 0 0;
  background: linear-gradient(180deg, #050a12 0%, #03070c 34%, #020407 70%, #010204 100%);
  box-shadow: 0 -1px 0 rgba(169,212,255,.7), 0 -26px 90px rgba(130,190,255,.2);
  padding: 176px 0 0; overflow: hidden; }
.s3f-grain { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .06; mix-blend-mode: screen; pointer-events: none; }
.s3f-head { position: relative; z-index: 2; }
.s3f-title { font-weight: 200; font-size: clamp(56px, calc((100vw - 100px) / 10.45), 88px); line-height: 1.1; letter-spacing: .07em; text-transform: uppercase; color: #f4f8fd; padding: 0 40px; }
.s3f-title > span { display: block; }
.s3f-title .l2a, .s3f-title .l2b { display: inline; }
.s3f .s3f-lead { margin: 48px auto 0; max-width: 540px; padding: 0 24px; font-size: 24px; line-height: 1.58; font-weight: 300; color: rgba(228,239,252,.9); text-align: center; text-wrap: balance; }
.s3f-field { position: relative; height: 480px; margin-top: -150px; }
.s3f-haze { position: absolute; inset: 0; background: radial-gradient(ellipse 62% 52% at 50% 58%, rgba(86,150,220,.2) 0%, rgba(40,90,150,.1) 38%, rgba(0,0,0,0) 72%); }
.s3f-band { position: absolute; left: 0; right: 0; height: 110px; background: linear-gradient(180deg, rgba(150,200,255,0), rgba(150,200,255,.045), rgba(150,200,255,0)); }
.s3f-arc { position: absolute; inset: 0; width: 100%; height: 100%; display: block; transition: opacity 2.8s ease 1.1s; }
.s3f-plane { position: absolute; left: 0; right: 0; top: 291px; bottom: 0; background: linear-gradient(180deg, rgba(120,180,240,.15) 0%, rgba(120,180,240,.05) 26%, rgba(120,180,240,0) 62%); transition: opacity 2.6s ease .6s; }
.s3f-glow { position: absolute; left: 50%; top: 232px; width: 980px; height: 120px; margin-left: -490px; background: radial-gradient(ellipse at center, rgba(130,195,255,.34) 0%, rgba(130,195,255,.1) 46%, rgba(130,195,255,0) 72%); transition: opacity 2.6s ease .3s; }
.s3f-warm { position: absolute; left: 50%; top: 285px; width: 300px; height: 12px; margin-left: -150px; background: radial-gradient(ellipse at center, rgba(255,214,170,.5) 0%, rgba(255,214,170,0) 70%); filter: blur(3px); transition: opacity 2.6s ease 1.4s; }
.s3f-horizon { position: absolute; left: 0; right: 0; top: 290px; height: 1px; transform-origin: 50% 50%;
  background: linear-gradient(90deg, rgba(169,212,255,0) 0%, rgba(111,176,242,.5) 20%, rgba(215,235,255,.95) 50%, rgba(111,176,242,.5) 80%, rgba(169,212,255,0) 100%);
  transition: transform 3s cubic-bezier(.22,.61,.36,1), opacity 1.6s ease; }
.s3f .s3f-forms { position: absolute; left: 0; right: 0; top: 352px; z-index: 2; display: flex; justify-content: center; align-items: center; gap: 34px; font-size: 17px; line-height: 1; letter-spacing: .44em; text-transform: uppercase; font-weight: 400; color: rgba(222,238,252,.88); }
.s3f-forms span { display: inline-block; padding-left: .44em; transition: opacity 2s ease, transform 2.4s cubic-bezier(.22,.61,.36,1); }
.s3f-forms i { font-style: normal; color: rgba(169,212,255,.7); letter-spacing: 0; transition: opacity 2s ease; }
.s3f-forms .w2 { transition-delay: .5s; } .s3f-forms .w3 { transition-delay: 1s; }
.s3f-end { position: relative; height: 120px; background: linear-gradient(180deg, rgba(1,2,4,0), #010204 100%); }
.s3f-end::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, rgba(169,212,255,0), rgba(169,212,255,.22) 50%, rgba(169,212,255,0)); }
.s3f[data-in="false"] .s3f-horizon { transform: scaleX(.06); opacity: 0; }
.s3f[data-in="false"] .s3f-glow, .s3f[data-in="false"] .s3f-warm, .s3f[data-in="false"] .s3f-plane, .s3f[data-in="false"] .s3f-arc { opacity: 0; }
.s3f[data-in="false"] .s3f-forms span { opacity: 0; transform: translateY(8px); }
.s3f[data-in="false"] .s3f-forms i { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .s3f *, .s3f *::before, .s3f *::after { transition: none !important; } }
@media (max-width: 760px) {
  .s3f-tail { height: 130px; }
  .s3f-dark { margin-top: -70px; border-radius: 50% 50% 0 0 / 70px 70px 0 0; padding-top: 124px; }
  .s3f-title { font-size: 38px; line-height: 1.14; letter-spacing: .06em; padding: 0 20px; }
  .s3f-title .l2a, .s3f-title .l2b { display: block; }
  .s3f .s3f-lead { margin-top: 34px; max-width: 320px; font-size: 19px; line-height: 1.58; }
  .s3f-field { height: 350px; margin-top: -96px; }
  .s3f-arc { height: 100%; }
  .s3f-plane { top: 210px; }
  .s3f-glow { top: 163px; width: 560px; margin-left: -280px; height: 100px; }
  .s3f-warm { top: 203px; width: 200px; margin-left: -100px; }
  .s3f-horizon { top: 209px; }
  .s3f .s3f-forms { top: 246px; flex-direction: column; gap: 17px; font-size: 14px; letter-spacing: .42em; }
  .s3f-forms span { padding-left: .42em; }
  .s3f-forms i { display: none; }
  .s3f-end { height: 96px; }
}

/* ===== 04 IDEAS ARE JUST THE BEGINNING — light, static (S04.dc.html, V2-11) =====
   The board's 88px black strip is not repeated: section 03's own ending (.s3f-end + hairline) is the seam. */
.s4 { width: 100%; overflow: hidden; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.s4 *, .s4 *::before, .s4 *::after { box-sizing: border-box; }
.s4 :where(h2, p, ol, li) { margin: 0; padding: 0; }
.s4-sheet { background: #f2f1ed; color: #0b1018; padding: 104px 96px 80px; }
.s4-title { font-weight: 200; font-size: 100px; line-height: 1.06; letter-spacing: .045em; text-transform: uppercase; color: #05080d; }
.s4-title .l1, .s4-title .l2 { display: block; }
.s4-grid { display: grid; grid-template-columns: 372px 1fr; grid-template-rows: auto 1fr; column-gap: 92px; margin-top: 72px; }
.s4 .s4-lead { grid-column: 1; grid-row: 1; font-size: 22px; line-height: 1.55; font-weight: 300; color: #2a3340; text-wrap: pretty; }
.s4-stages { grid-column: 2; grid-row: 1 / 3; list-style: none; }
.s4-st { position: relative; padding: 16px 0 18px; border-top: 1px solid rgba(47,111,182,.3); }
.s4-st .nm { display: block; text-transform: uppercase; line-height: 1; letter-spacing: .04em; }
.s4-st .ds { display: block; margin-top: 10px; font-size: 18px; line-height: 1.4; letter-spacing: .005em; }
.s4-st:first-child { padding-top: 0; border-top: 0; }
.s4-st.k1 { margin-left: 0; }
.s4-st.k1 .nm { font-weight: 200; font-size: 54px; color: #4d5764; }
.s4-st.k1 .ds { font-weight: 300; color: #4d5764; }
.s4-st.k2 { margin-left: 46px; border-top-color: rgba(47,111,182,.5); }
.s4-st.k2 .nm { font-weight: 300; font-size: 58px; color: #313b48; }
.s4-st.k2 .ds { font-weight: 300; color: #3a4552; }
.s4-st.k3 { margin-left: 92px; border-top: 1.5px solid rgba(47,111,182,.76); }
.s4-st.k3 .nm { font-weight: 400; font-size: 62px; color: #161e2a; }
.s4-st.k3 .ds { font-weight: 400; color: #28323f; }
.s4-st.k4 { margin-left: 138px; border-top: 2px solid #2f6fb6; }
.s4-st.k4 .nm { font-weight: 500; font-size: 66px; color: #05080d; }
.s4-st.k4 .ds { font-weight: 400; color: #101823; }
.s4-dec { grid-column: 1; grid-row: 2; align-self: end; }
.s4-dec .rule { display: block; width: 28px; height: 2px; background: #d49a55; margin-bottom: 18px; }
.s4-dec .set { font-family: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace; font-weight: 500; font-size: 14px; line-height: 1.5; letter-spacing: .2em; text-transform: uppercase; color: #121923; }
.s4-dec .set i { font-style: normal; color: #2f6fb6; letter-spacing: 0; padding: 0 .55em 0 .35em; }
.s4-dec .set b { font-weight: 500; }
.s4 .s4-dec .why { margin-top: 12px; font-size: 17px; line-height: 1.45; font-weight: 300; color: #2a3340; }

@media (max-width: 1359px) {
  .s4-sheet { padding: 96px 56px 80px; }
  .s4-title { font-size: clamp(64px, 8vw, 100px); }
  .s4-grid { display: block; margin-top: 60px; }
  .s4 .s4-lead { max-width: 520px; }
  .s4-stages { margin-top: 52px; }
  .s4-st.k1 .nm { font-size: clamp(38px, 4vw, 54px); }
  .s4-st.k2 { margin-left: 30px; }
  .s4-st.k2 .nm { font-size: clamp(41px, 4.3vw, 58px); }
  .s4-st.k3 { margin-left: 60px; }
  .s4-st.k3 .nm { font-size: clamp(44px, 4.6vw, 62px); }
  .s4-st.k4 { margin-left: 90px; }
  .s4-st.k4 .nm { font-size: clamp(47px, 4.9vw, 66px); }
  .s4-dec { margin-top: 48px; }
}
@media (max-width: 760px) {
  .s4-sheet { padding: 56px 20px 48px; }
  .s4-title { font-size: 41px; line-height: 1.1; letter-spacing: .05em; }
  .s4-title .l1, .s4-title .l2 { display: inline; }
  .s4-title .x1, .s4-title .x4 { display: block; }
  .s4-grid { display: block; margin-top: 30px; }
  .s4 .s4-lead { font-size: 18px; line-height: 1.55; max-width: 340px; }
  .s4-stages { margin-top: 40px; }
  .s4-st { padding: 16px 0 17px; }
  .s4-st .ds { margin-top: 9px; font-size: 16px; }
  .s4-st.k1 .nm { font-size: min(31px, 7.95vw); }
  .s4-st.k2 { margin-left: 9px; }
  .s4-st.k2 .nm { font-size: min(33px, 8.47vw); }
  .s4-st.k3 { margin-left: 18px; }
  .s4-st.k3 .nm { font-size: min(35px, 8.98vw); }
  .s4-st.k4 { margin-left: 27px; }
  .s4-st.k4 .nm { font-size: min(37px, 9.49vw); }
  .s4-dec { margin-top: 38px; }
  .s4-dec .rule { margin-bottom: 15px; }
  .s4-dec .set { font-size: 13px; letter-spacing: .17em; }
  .s4 .s4-dec .why { font-size: 16px; margin-top: 10px; }
}


/* ===== 05 UMBORALIS — flat black, static (S05.dc.html, V2-13) =====
   The board's 96px soft-white strip stands in for the end of section 04; it is not repeated here. */
.s5 { width: 100%; overflow: hidden; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.s5 *, .s5 *::before, .s5 *::after { box-sizing: border-box; }
.s5 :where(h2, p) { margin: 0; padding: 0; }
.s5-sheet { background: #010204; color: #f4f8fd; padding: 80px clamp(40px, 6.67vw, 96px) 56px; }
.s5-id { font-family: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace; font-weight: 500; font-size: 13px; line-height: 1; letter-spacing: .32em; text-transform: uppercase; color: #9fc9f4; }
.s5-name { margin-top: 34px; font-weight: 200; font-size: clamp(56px, 13.9vw, 200px); line-height: .95; letter-spacing: .045em; text-transform: uppercase; color: #f4f8fd; white-space: nowrap; margin-left: -.04em; }
.s5 .s5-pos { margin-top: 26px; font-size: 30px; line-height: 1.25; font-weight: 300; color: rgba(228,239,252,.92); letter-spacing: .005em; text-wrap: balance; }
.s5-grid { display: grid; grid-template-columns: 330px 1fr; column-gap: clamp(48px, 8.5vw, 124px); margin-top: 84px; align-items: start; }
.s5 .s5-scope { grid-column: 1; grid-row: 1; padding-top: 14px; font-size: 18px; line-height: 1.62; font-weight: 300; color: rgba(214,228,246,.76); text-wrap: pretty; }
.s5 .s5-scope em { font-style: normal; font-weight: 400; color: #a9d4ff; }
.s5-own { grid-column: 2; grid-row: 1; }
.s5-own .rule { display: block; width: 28px; height: 2px; background: #e0a869; margin-bottom: 26px; }
.s5 .s5-first { font-size: 60px; line-height: 1.08; font-weight: 300; letter-spacing: -.005em; color: #f4f8fd; max-width: 760px; text-wrap: balance; }
.s5 .s5-collab { margin-top: 34px; font-size: 19px; line-height: 1.55; font-weight: 300; color: rgba(190,208,232,.62); max-width: 500px; text-wrap: pretty; }
@media (max-width: 1099px) {
  .s5-grid { display: block; margin-top: 72px; }
  .s5 .s5-scope { max-width: 460px; padding-top: 0; }
  .s5-own { margin-top: 56px; }
  .s5 .s5-first { font-size: clamp(40px, 6vw, 60px); }
}
@media (max-width: 760px) {
  .s5-sheet { padding: 64px 22px 40px; }
  .s5-id { font-size: 11px; letter-spacing: .28em; }
  .s5-name { margin-top: 30px; font-size: 14.4vw; letter-spacing: .04em; }
  .s5 .s5-pos { margin-top: 22px; font-size: 21px; }
  .s5-grid { margin-top: 48px; }
  .s5 .s5-scope { font-size: 16px; line-height: 1.6; max-width: 340px; }
  .s5-own { margin-top: 44px; }
  .s5-own .rule { margin-bottom: 20px; }
  .s5 .s5-first { font-size: 36px; line-height: 1.12; }
  .s5 .s5-collab { margin-top: 24px; font-size: 16px; max-width: 330px; }
  }

/* ===== 06 THE ADDRESS — flat black, static (V2-16, layout refined in V2-19) =====
   Desktop and tablet: the invitation on the left, the address on the right, vertically centred on each other; a hairline separates the footer, whose
   two groups sit on the same two columns. Mobile: stacked. */
.s6 { width: 100%; overflow: hidden; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.s6 *, .s6 *::before, .s6 *::after { box-sizing: border-box; }
.s6 :where(h2, p) { margin: 0; padding: 0; }
.s6-sheet { background: #010204; color: #f4f8fd; padding: 88px clamp(40px, 6.67vw, 96px) 48px; }
.s6-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: clamp(48px, 6vw, 96px); align-items: center; max-width: 1248px; }
.s6-main { grid-column: 1; }
.s6-side { grid-column: 2; }
.s6-head { font-size: clamp(30px, 2.78vw, 40px); line-height: 1.12; font-weight: 300; letter-spacing: -.005em; color: #f4f8fd; text-wrap: balance; }
.s6 .s6-sub { margin-top: 16px; max-width: 430px; font-size: 19px; line-height: 1.55; font-weight: 300; color: rgba(214,228,246,.78); text-wrap: balance; }
.s6-act { display: inline-flex; align-items: center; gap: 18px; min-height: 56px; color: #f4f8fd; text-decoration: none; }
.s6-addr { font-size: clamp(24px, 3.06vw, 48px); line-height: 1.2; font-weight: 300; letter-spacing: -.005em; white-space: nowrap; text-decoration: underline; text-decoration-color: #a9d4ff; text-decoration-thickness: 2px; text-underline-offset: .2em; }
.s6-arrow { flex: none; width: 26px; height: 26px; display: block; transition: transform .35s ease; }
.s6-act:hover .s6-addr { text-decoration-color: #d7ebff; text-decoration-thickness: 3px; }
.s6-act:hover .s6-arrow { transform: translateX(4px); }
.s6-act:focus-visible { outline: 2px solid #a9d4ff; outline-offset: 8px; border-radius: 2px; }
@media (prefers-reduced-motion: reduce) { .s6-arrow { transition: none; } .s6-act:hover .s6-arrow { transform: none; } }
.s6-foot { margin-top: 80px; padding-top: 28px; border-top: 1px solid rgba(169,212,255,.18); max-width: 1248px; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: clamp(48px, 6vw, 96px); font-family: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace; font-weight: 400; font-size: 12px; line-height: 1.9; letter-spacing: .14em; text-transform: uppercase; color: rgba(222,238,252,.64); }
.s6-foot-id, .s6-foot-reg { display: flex; flex-wrap: wrap; gap: 4px 36px; }
.s6-foot .web { text-transform: none; letter-spacing: .06em; font-size: 13px; }
@media (max-width: 760px) {
  .s6-sheet { padding: 56px 22px 36px; }
  .s6-grid { display: block; }
  .s6-head { font-size: 30px; line-height: 1.16; }
  .s6 .s6-sub { margin-top: 14px; max-width: 320px; font-size: 17px; }
  .s6-side { margin-top: 24px; }
  .s6-act { gap: 14px; }
  .s6-arrow { width: 22px; height: 22px; }
  .s6-addr { font-size: calc((100vw - 22px - 22px - 14px - 22px) / 9.8); }
  .s6-foot { display: block; margin-top: 44px; padding-top: 22px; letter-spacing: .12em; line-height: 1.95; }
  .s6-foot-id, .s6-foot-reg { gap: 2px 24px; }
}

/* PREVIEW: hero at intermediate widths (the board defines only 1440 and 390) */
@media (max-width: 1279px) and (min-width: 761px) {
  .hero-copy { left: clamp(40px, 8.3vw, 120px); }
  .hero h1 { font-size: clamp(46px, 4.72vw, 68px); }
}

/* ===== HERO — mobile (Main.dc.html, max-width 760px) ===== */
@media (max-width: 760px) {
  .hero { height: 900px; }
  .hero-bg { background-size: auto 100%; background-position: 64% 50%; }
  /* V2-21 A1: a soft local darkening behind the text block (mobile only) lifts the text above AA contrast over the photo */
  .hero-shade { background: radial-gradient(ellipse 150% 95px at 40% 480px, rgba(3,6,11,.3) 0, rgba(3,6,11,.2) 45%, rgba(3,6,11,0) 100%), linear-gradient(180deg, rgba(3,6,11,.55) 0%, rgba(3,6,11,0) 20%, rgba(3,6,11,0) 44%, rgba(3,6,11,.82) 66%, rgba(3,6,11,.7) 80%); }
  .hero-fog { height: 300px; }
  .hero-reveal { background: radial-gradient(circle at 86.7% 57.7%, rgba(3,6,11,0) calc(80px * var(--k)), rgba(3,6,11,.97) calc(280px * var(--k))); }
  .hero-top { padding: 24px 24px; }
  .hero-copy { left: 28px; right: 28px; top: auto; bottom: 232px; max-width: none; }
  .eyebrow { font-size: 10px; margin-bottom: 20px; letter-spacing: .3em; color: #d7ebff; }
  .hero h1 { font-size: min(38px, 9.75vw); letter-spacing: .06em; }
  .hero .hero-p { font-size: 17px; margin-top: 22px; }
  .cta { margin-top: 28px; }
  .s2 { padding: 30px 0 0; }
  .nav-panel { right: 24px; top: 80px; min-width: 0; left: 24px; }
}

/* PREVIEW: the hero reveal is a one-time entrance; reduced motion shows the finished image at once */
@media (prefers-reduced-motion: reduce) {
  .hero-reveal { display: none; }
  .menu-btn, .cta-ring { transition: none; }
}

/* ===== Footer links to privacy.html and legal.html in section 06 ===== */
.s6-foot a { display: inline-block; padding: 6px 0; margin: -6px 0; color: inherit; text-decoration: underline; text-decoration-color: #a9d4ff; text-decoration-thickness: 1px; text-underline-offset: .3em; }
.s6-foot a:hover { color: #f4f8fd; text-decoration-color: #d7ebff; }
.s6-foot a:focus-visible { outline: 2px solid #a9d4ff; outline-offset: 4px; border-radius: 2px; }
.s6-foot-links { display: inline-flex; gap: 0 36px; white-space: nowrap; }
@media (max-width: 760px) { .s6-foot-links { gap: 0 24px; } }

/* ===== Legal pages privacy.html and legal.html — flat black like sections 05 and 06 ===== */
.lg-page { background: #010204; color: #f4f8fd; font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.lg-page *, .lg-page *::before, .lg-page *::after { box-sizing: border-box; }
.lg-top { padding: 28px clamp(22px, 6.67vw, 96px) 0; }
.lg-home { display: inline-block; padding: 10px 0; font-family: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace; font-size: 12px; line-height: 1.5; letter-spacing: .28em; text-transform: uppercase; color: rgba(222,238,252,.78); text-decoration: none; }
.lg-home:hover { color: #f4f8fd; }
.lg-home:focus-visible, .lg a:focus-visible, .lg-foot a:focus-visible { outline: 2px solid #a9d4ff; outline-offset: 4px; border-radius: 2px; }
.lg { padding: 40px clamp(22px, 6.67vw, 96px) 72px; }
.lg-sheet { max-width: 760px; }
.lg-title { margin: 0 0 12px; font-size: clamp(34px, 3.6vw, 52px); line-height: 1.1; font-weight: 300; letter-spacing: -.005em; color: #f4f8fd; text-wrap: balance; }
.lg p.lg-meta { max-width: none; margin: 0 0 44px; font-family: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace; font-size: 12px; line-height: 1.6; letter-spacing: .14em; text-transform: uppercase; color: rgba(222,238,252,.64); }
.lg h2 { margin: 44px 0 14px; font-size: 22px; line-height: 1.25; font-weight: 400; color: #f4f8fd; }
.lg h3 { margin: 0 0 10px; font-size: 17px; line-height: 1.4; font-weight: 400; color: #f4f8fd; }
.lg p, .lg li, .lg dd { font-size: 17px; line-height: 1.65; font-weight: 300; color: rgba(222,234,248,.88); max-width: 68ch; }
.lg p { margin: 0 0 14px; }
.lg strong { font-weight: 400; color: #f4f8fd; }
.lg ul { margin: 0 0 14px; padding-left: 22px; }
.lg li { margin-bottom: 8px; }
.lg-card { margin: 0 0 8px; padding-top: 16px; border-top: 1px solid rgba(169,212,255,.18); }
.lg-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 28px; margin: 0 0 18px; }
.lg-facts dt { font-family: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace; font-size: 12px; line-height: 2.2; letter-spacing: .14em; text-transform: uppercase; color: rgba(222,238,252,.64); }
.lg-facts dd { margin: 0; }
.lg a { color: #f4f8fd; text-decoration: underline; text-decoration-color: #a9d4ff; text-decoration-thickness: 1.5px; text-underline-offset: .2em; }
.lg a:hover { text-decoration-color: #d7ebff; text-decoration-thickness: 2.5px; }
.lg-foot { display: flex; flex-wrap: wrap; gap: 4px 36px; padding: 28px clamp(22px, 6.67vw, 96px) 48px; border-top: 1px solid rgba(169,212,255,.18); font-family: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace; font-weight: 400; font-size: 12px; line-height: 1.9; letter-spacing: .14em; text-transform: uppercase; color: rgba(222,238,252,.64); }
.lg-foot a { display: inline-block; padding: 6px 0; margin: -6px 0; color: inherit; text-decoration: underline; text-decoration-color: #a9d4ff; text-decoration-thickness: 1px; text-underline-offset: .3em; }
.lg-foot a:hover { color: #f4f8fd; text-decoration-color: #d7ebff; }
.lg-foot a[aria-current="page"] { color: #f4f8fd; }
@media (max-width: 760px) {
  .lg-top { padding: 20px 22px 0; }
  .lg { padding: 28px 22px 56px; }
  .lg-title { font-size: 34px; }
  .lg h2 { margin-top: 36px; font-size: 20px; }
  .lg p, .lg li, .lg dd { font-size: 16px; }
  .lg-facts { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .lg-facts dd { margin-bottom: 14px; }
  .lg-foot { padding: 24px 22px 40px; gap: 2px 24px; letter-spacing: .12em; line-height: 1.95; }
}
