:root{--dark:#091a1a;--darker:#071313;--ink:#122523;--mint:#9bffdc;--paper:#f3f4ed;--sub:#4d625b;--line:#cbd5cc}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--paper);color:var(--ink)}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:3px solid #21a88a;outline-offset:5px}button{font:inherit}h1,h2,h3,p{margin:0}.wrap{width:min(1240px,calc(100% - 100px));margin:auto}.skip,.sr{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.skip:focus{clip-path:none;width:auto;height:auto;padding:12px;background:white;z-index:5}header,.hero,footer{background:var(--darker);color:#f3faf5}.nav{height:83px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #27413c}.brand{display:inline-flex;align-items:center;gap:12px;font-size:15px;font-weight:900;letter-spacing:.12em}.brand small{display:block;font-size:9px;letter-spacing:.32em;margin-top:4px;color:var(--mint)}.mark{display:block;width:44px;height:44px;object-fit:contain;flex:none}nav{display:flex;gap:32px;font-size:14px;color:#c5d6d1}nav a:hover,footer a:hover{color:var(--mint)}.hero{background:radial-gradient(ellipse at 76% 48%,#143b33,var(--darker) 66%)}.hero-grid{min-height:580px;display:grid;grid-template-columns:1.04fr 1fr;align-items:center;gap:8px}.hero-art{display:grid;place-items:center;width:100%;aspect-ratio:1.08;background:radial-gradient(ellipse at center,#b8803426,transparent 66%)}.eyebrow,.index,.eyebrow{display:flex;align-items:center;gap:10px;color:#26654f;margin-bottom:20px}.hero .eyebrow,.founder .eyebrow{color:var(--mint)}.eyebrow i{width:7px;height:7px;background:currentColor;display:inline-block;border-radius:50%}h1{font-size:clamp(60px,7.45vw,110px);line-height:.94;letter-spacing:-.085em}h1 em{font-style:normal;color:var(--mint)}.intro{color:#c1d1ca;max-width:420px;font-size:19px;line-height:1.6;margin:28px 0 30px}.button{display:inline-flex;gap:26px;align-items:center;background:var(--mint);color:#0a2b23;font-weight:800;padding:15px 19px;border-radius:5px}.button:hover{background:#d0ffeb}.portfolio,.stakeholders{padding:100px 0}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:26px}.section-head p{max-width:320px;color:var(--sub);line-height:1.65}h2{font-size:clamp(44px,6.3vw,86px);line-height:.98;letter-spacing:-.072em}.filters{display:flex;flex-wrap:wrap;gap:8px;margin:30px 0 20px}.filters button{border:1px solid #9eb0a4;background:transparent;color:var(--ink);border-radius:24px;padding:9px 15px;cursor:pointer;font-size:13px}.filters button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.cards article{min-height:280px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;display:flex;flex-direction:column;align-items:flex-start}.cards article[hidden]{display:none}.cards article:hover{border-color:#268c6c}.index{color:#416356}.glyph{display:grid;place-items:center;background:#d9f8e8;width:54px;height:54px;border-radius:12px;font-size:32px;margin:24px 0 18px}.cards h3{font-size:29px;letter-spacing:-.055em;margin-bottom:8px}.cards p{font-size:15px;line-height:1.55;color:var(--sub);margin-bottom:18px}.cards a,.text-link{font-size:14px;font-weight:800;border-bottom:1px solid currentColor;padding-bottom:4px;margin-top:auto}.founder{background:#112825;color:#f1faf4;padding:88px 0}.founder-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:9%;align-items:center}.dot,.role{color:var(--mint)}.role{font-weight:700;margin:22px 0 12px}.founder-copy{max-width:460px;color:#c4d7ce;line-height:1.7;margin-bottom:24px}.stakeholders ul{padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);margin:36px 0 0;border-block:1px solid var(--line)}.stakeholders li{padding:26px 15px 26px 0;font-size:clamp(17px,2.1vw,28px);font-weight:800;letter-spacing:-.04em}.stakeholders li span{display:block;font:700 11px monospace;color:#416356;margin-bottom:12px}footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:26px 0;font-size:13px;color:#c5d6d1}
@media(max-width:900px){.wrap{width:calc(100% - 48px)}.cards{grid-template-columns:repeat(2,1fr)}.hero-grid{min-height:460px}h1{font-size:clamp(50px,8vw,88px)}}@media(max-width:620px){.wrap{width:calc(100% - 36px)}.nav{height:auto;min-height:76px;gap:12px;flex-wrap:wrap;padding:15px 0}nav{gap:13px;font-size:12px}.hero-grid,.founder-grid{grid-template-columns:1fr}.hero-copy{padding-top:55px}.hero-art{max-width:470px;margin:auto}.section-head{display:block}.section-head p{margin-top:16px}.portfolio,.stakeholders,.founder{padding:60px 0}.cards{grid-template-columns:1fr}.cards article{min-height:0}.founder-grid{gap:35px}.stakeholders ul{grid-template-columns:1fr}.stakeholders li+li{border-top:1px solid var(--line)}footer .wrap{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.hero .eyebrow,.hero h1 em,.brand small{color:#f1c26d}.hero .button{background:#f1c26d;color:#211608}.hero .button:hover{background:#ffdb93}

.founder-portrait{margin:0;max-width:440px;width:100%;overflow:hidden;border:1px solid #c19254;border-radius:8px}
.founder-portrait img{display:block;width:100%;height:auto}
.countries{padding:74px 0;background:#e8eee5}
.countries ul{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:0;margin:28px 0 0;list-style:none}
.countries li{padding:18px 16px;border:1px solid #a9b9ae;border-radius:6px;font-weight:700}
@media(max-width:620px){.countries{padding:54px 0}.countries ul{grid-template-columns:repeat(2,1fr)}nav{flex-wrap:wrap}}

/* Crest and contact accents use the gold of the official X. */
.hero-grid{padding-block:24px}
.crest{position:relative;display:grid;place-items:center;width:min(100%,470px);aspect-ratio:1}
.crest img{display:block;width:72%;height:auto;filter:drop-shadow(0 22px 36px #000a)}
.crest-stars{position:absolute;inset:0}
.crest-stars i{position:absolute;left:var(--x);top:var(--y);width:clamp(6px,1vw,12px);aspect-ratio:1;transform:translate(-50%,-50%);filter:drop-shadow(0 0 5px #ffc666)}
.crest-stars i::after{content:"";display:block;aspect-ratio:1;clip-path:polygon(50% 0,61% 37%,100% 50%,61% 63%,50% 100%,39% 63%,0 50%,39% 37%);background:radial-gradient(circle,#fff9da 10%,#e5ac55 65%,#a86c31);animation:crest-glint 4.5s var(--phase) ease-in-out infinite alternate}
.crest-stars i:nth-child(3n){width:clamp(4px,.7vw,8px)}
@keyframes crest-glint{from{opacity:.56;transform:scale(.82)}to{opacity:1;transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.crest-stars i::after{animation:none}}
.countries li{display:flex;align-items:center;gap:10px;background:#fffdf6}
.flag{font:clamp(28px,4.3vw,52px)/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.stakeholders ul{gap:14px;border:0}
.stakeholders li{display:grid;gap:12px;padding:0;color:var(--ink)}
.stakeholders li+li{border-top:0}
.stakeholders li>span{font:700 15px/1.4 Arial,sans-serif;letter-spacing:0;color:var(--ink)}
.stakeholder-logo{display:grid;place-items:center;min-height:132px;padding:20px;background:#fff;border:1px solid var(--line);border-radius:8px}
.stakeholder-logo img{width:100%;max-width:225px;max-height:100px;height:auto;object-fit:contain}
.bridge-wordmark{align-content:center;gap:6px;color:#171d1c;font:700 14px/1.2 Arial,sans-serif;letter-spacing:.12em}
.bridge-wordmark small{font-size:9px;letter-spacing:.32em}
.bridge-mark{width:44px;height:20px;display:flex;align-items:end;gap:4px;border-bottom:2px solid #9a703a;margin-bottom:3px}
.bridge-mark b{flex:1;height:68%;border:2px solid #171d1c;border-bottom:0;border-radius:12px 12px 0 0}
.bridge-mark b:nth-child(2){height:100%}
.contact{padding:65px 0;background:#102823;color:#fffaf0}
.contact-grid{display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px}
.contact h2{font-size:clamp(34px,5vw,65px)}
.contact-links{display:flex;align-items:flex-start;flex-direction:column;gap:15px;font-weight:700}
.contact-links>a:first-child{color:#f4d6a0;text-decoration:underline;text-underline-offset:4px}
.contact .button{background:#f1c26d;color:#211608}
.contact .button:hover{background:#ffdb93}
@media(max-width:620px){.hero-grid{padding-top:0}.contact-grid{grid-template-columns:1fr}.countries li{gap:7px;padding-inline:10px}.stakeholder-logo{min-height:112px}}

/* Layered light and stars give the opening scene a continuous, film-like drift. */
.hero{position:relative;isolation:isolate;overflow:hidden;background:#080c0d}
.hero-grid{position:relative;z-index:1;min-height:clamp(620px,81svh,850px);perspective:1050px}
.hero h1{font-size:clamp(52px,7.2vw,108px)}
.hero h1 em{background:linear-gradient(105deg,#fff1bb,#d69238 76%);color:transparent;background-clip:text}
.hero-scene,.hero-stars{position:absolute;inset:0;pointer-events:none}
.hero-scene{overflow:hidden;background:radial-gradient(ellipse at 77% 51%,#463323 0,transparent 49%),linear-gradient(140deg,#05090a 18%,#101b1a 72%,#130d0a)}
.hero-scene::before,.hero-scene::after{content:"";position:absolute;inset:-30%}
.hero-scene::before{background:conic-gradient(from 0deg at 67% 53%,transparent 10%,#c688412c 16%,transparent 24%,transparent 44%,#caab6738 50%,transparent 57%,transparent 76%,#5fab9547 82%,transparent 91%);filter:blur(28px);animation:light-sweep 19s ease-in-out infinite alternate}
.hero-scene::after{inset:0;background:radial-gradient(ellipse at var(--light-x,72%) var(--light-y,43%),#e9a95724,transparent 44%),linear-gradient(90deg,#060b0cd9 4%,#070c0c8c 36%,transparent 70%);box-shadow:inset 0 -75px 125px #050a0c}
.hero-stars i{position:absolute;left:var(--x);top:var(--y);width:var(--size);aspect-ratio:1;border-radius:50%;background:#fff0c5;box-shadow:0 0 8px 1px #ffd782a8;opacity:.55;animation:sky-twinkle var(--period) var(--phase) infinite}
.hero-art{background:none;perspective:850px}
.crest{transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .38s cubic-bezier(.2,.7,.2,1)}
.crest::before{content:"";position:absolute;inset:6%;border-radius:50%;border:1px solid #fdd79a43;box-shadow:0 0 44px #e0a2533b,inset 0 0 65px #e0a25321}
.crest::after{content:"";position:absolute;inset:1%;border-radius:50%;border:1px solid #e9be7629;border-top-color:#ffe0a2b0;border-bottom-color:#ffe0a264;animation:orbit 23s linear infinite;pointer-events:none}
.crest img{animation:crest-float 6s ease-in-out infinite;filter:drop-shadow(0 25px 24px #000a) drop-shadow(0 0 21px #d58a4c41)}
.crest-stars i::after{animation:gold-flash 2.7s var(--phase) ease-in-out infinite}
.hero-copy{animation:hero-in .85s cubic-bezier(.16,1,.3,1) both}
.motion-toggle{position:absolute;z-index:2;right:max(24px,calc((100% - 1240px)/2));bottom:20px;color:#f7dca7;border:1px solid #f7dca74d;border-radius:20px;background:#111814c9;padding:8px 12px;cursor:pointer;font-size:12px}
.motion-toggle:hover{background:#30261b}
.cards article,.countries li,.stakeholder-logo{background-image:radial-gradient(circle at var(--light-x,70%) var(--light-y,0%),#edb45a38,transparent 65%);background-size:100% 100%;transition:transform .26s ease,box-shadow .26s ease,border-color .26s ease}
.cards article .glyph,.countries li .flag,.stakeholder-logo img,.bridge-wordmark .bridge-mark,.button{transition:transform .28s ease}
.cards article:focus-within,.countries li:hover,.stakeholder-logo:hover{border-color:#a66a2a}
@media(hover:hover) and (pointer:fine){
  body:not(.motion-paused) .cards article:hover,body:not(.motion-paused) .countries li:hover,body:not(.motion-paused) .stakeholder-logo:hover{transform:perspective(620px) translateY(-8px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));box-shadow:0 18px 32px #22291e25;border-color:#a66a2a}
  body:not(.motion-paused) .cards article:hover .glyph,body:not(.motion-paused) .countries li:hover .flag,body:not(.motion-paused) .stakeholder-logo:hover img,body:not(.motion-paused) .bridge-wordmark:hover .bridge-mark{transform:translateY(-3px) scale(1.1)}
  body:not(.motion-paused) .button:hover{transform:translateY(-3px)}
}
.section-arrive{animation:section-in .65s ease-out both}
@keyframes light-sweep{from{transform:rotate(-14deg) scale(1)}to{transform:rotate(15deg) scale(1.14)}}
@keyframes sky-twinkle{0%,100%{opacity:.13;transform:scale(.68)}55%{opacity:.91;transform:scale(1.18)}}
@keyframes gold-flash{0%,100%{opacity:.24;transform:scale(.68)}60%{opacity:.82}75%{opacity:1;transform:scale(1.48)}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes crest-float{50%{transform:translateY(-11px) scale(1.025)}}
@keyframes hero-in{from{opacity:.15;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes section-in{from{opacity:.6;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.motion-paused .hero *,.motion-paused .hero-scene::before,.motion-paused .crest::after,.motion-paused .crest-stars i::after,.motion-paused .section-arrive{animation:none!important}
.motion-paused .crest{transform:none}
@media(max-width:620px){.hero-grid{min-height:0;padding-bottom:62px}.hero-copy{padding-top:48px}.hero-art{aspect-ratio:1.05}.hero-scene::after{background:linear-gradient(#060b0cb0,transparent 80%)}}
@media(prefers-reduced-motion:reduce){.hero *,.hero-scene::before,.crest::after,.crest-stars i::after,.section-arrive{animation:none!important;transition:none!important}}
