/* ════════════════════════════════════════════
   TRIMBOLI — ATLAS OF TWO
   night skies · dawn sand · gold & coral light
   ════════════════════════════════════════════ */
:root{
  --night:#141C33;--navy:#1B2440;--navy-2:#24305A;
  --cream:#F6F1E6;--sand:#EEE3CC;--dune:#E9D5B2;
  --gold:#C9A55A;--gold-l:#E6C277;--coral:#E07B62;--coral-s:#E9A88F;--slate:#6F7280;
  --paper:#F6F1E6;--bone:#EEE3CC;
  --glow-gold:0 0 0 1px rgba(201,165,90,.28),0 24px 60px -28px rgba(201,165,90,.55);
  --card-light:rgba(255,253,247,.62);
  --card-line:rgba(201,165,90,.28);
}
body{background:var(--cream)}
::selection{background:var(--coral);color:#fff}
/* cursor: a point of light with a gold beam trail (One Foundation) */
.cur-dot{width:14px;height:14px;z-index:9999;background:radial-gradient(circle at 35% 30%,#FFF4D6 0%,#F1D594 38%,#C9A55A 100%);
  box-shadow:0 0 10px rgba(241,213,148,.9),0 0 26px rgba(255,236,200,.55);transition:width .3s,height .3s}
.cur-ring{width:64px;height:64px;border:none;opacity:.9;z-index:9997;
  background:radial-gradient(circle,rgba(255,244,222,.55) 0%,rgba(230,194,119,.28) 30%,rgba(230,194,119,0) 68%);
  transition:width .35s cubic-bezier(.2,.8,.2,1),height .35s cubic-bezier(.2,.8,.2,1),opacity .35s}
body.cur-hover .cur-ring{width:110px;height:110px;opacity:1}
body.cur-hover .cur-dot{width:18px;height:18px}
.cur-trail{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:9998}
@media (hover:none){.cur-trail{display:none}}
.progress{background:linear-gradient(90deg,var(--gold),var(--coral))}

/* ── nav ── */
nav{background:color-mix(in srgb,var(--cream) 82%,transparent);border-bottom-color:rgba(201,165,90,.25)}
.nav-cta{background:var(--navy);box-shadow:0 10px 30px -14px rgba(27,36,64,.7)}
.nav-cta:hover{background:linear-gradient(120deg,var(--gold),var(--coral));color:var(--navy)}
.lang-btn.active{background:var(--sand)}

/* ── themes ── */
.t-dawn,.t-dune,.t-night{position:relative;isolation:isolate;overflow-x:clip}
.t-dawn{background:linear-gradient(180deg,#F6F1E6 0%,#F1E8D6 100%)!important}
.t-dune{background:linear-gradient(180deg,#F1E4CB 0%,#EAD6B4 100%)!important}
.t-night{background:radial-gradient(120% 70% at 50% 108%,rgba(201,165,90,.22),transparent 60%),radial-gradient(60% 50% at 85% 0%,rgba(224,123,98,.12),transparent 70%),linear-gradient(180deg,#1B2440 0%,#141C33 100%)!important;color:var(--cream)}
.t-dawn>.frame,.t-dune>.frame,.t-night>.frame,.t-dawn>.cta-inner,.t-night>.cta-inner{position:relative;z-index:2}
section.t-dawn,section.t-dune,section.t-night{border:none!important;padding-top:clamp(2.5rem,5vw,4rem)}

/* section ornaments injected by errp-theme.js */
.deco{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.deco svg{position:absolute;display:block}
.deco .glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.28}
.wave-top{position:absolute;left:0;right:0;top:-1px;height:clamp(48px,6vw,84px);z-index:1;pointer-events:none}
.wave-top svg{display:block;width:100%;height:100%}
.d-float{animation:t-float var(--t,9s) ease-in-out var(--del,0s) infinite alternate}
.d-twinkle{animation:t-twinkle var(--t,3.5s) ease-in-out var(--del,0s) infinite}
.d-spin{transform-box:view-box;transform-origin:center;animation:t-spin var(--t,80s) linear infinite}
@keyframes t-float{to{transform:translate(var(--fx,8px),var(--fy,-18px))}}
@keyframes t-twinkle{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes t-spin{to{transform:rotate(360deg)}}

/* ── headings & small type ── */
.sec-index{color:var(--coral)}
.sec-index::after{height:2px;width:3.5rem;background:linear-gradient(90deg,var(--gold),var(--coral));border-radius:2px}
.t-night .sec-index{color:var(--gold-l)}
.t-night h2,.t-night h3{color:#fff}
.t-night h2 .ital,.cta h2 .ital{color:var(--gold-l)}
.kicker{color:var(--coral)}
.kicker::before{height:2px;background:linear-gradient(90deg,var(--gold),var(--coral));border-radius:2px}

/* ── personal-page header: compact desktop nav, dropdown menu on small laptops ── */
@media (min-width:1180px) and (max-width:1600px){
  nav:has(.back-link) .nav-links{gap:clamp(.95rem,1.45vw,2rem)}
  nav:has(.back-link) .nav-links a{font-size:.68rem;letter-spacing:.12em}
  nav:has(.back-link) .lang-switch{margin-right:.75rem}
  nav:has(.back-link) .lang-btn{padding:.5rem .45rem}
  nav:has(.back-link) .nav-cta{padding:.75rem 1.15rem;font-size:.68rem;letter-spacing:.1em}
}
@media (min-width:1180px){
  nav:has(.back-link) .back-link{font-size:0;letter-spacing:0;width:34px;height:34px;justify-content:center;margin-right:.9rem;border:1px solid var(--card-line);border-radius:50%;flex-shrink:0}
  nav:has(.back-link) .back-link::before{content:'\2190';font-size:.95rem;color:var(--ink)}
  nav:has(.back-link) .back-link:hover{background:var(--sand)}
}
@media (min-width:921px) and (max-width:1179px){
  nav:has(.back-link) .nav-cta{display:inline-block;margin-left:auto;margin-right:1rem;padding:.75rem 1.15rem;font-size:.68rem;letter-spacing:.1em}
  nav:has(.back-link) .back-link{margin-left:1.75rem;margin-right:auto}
  nav:has(.back-link) .nav-cta{margin-left:0!important}
  nav:has(.back-link) .nav-links.open{top:84px;left:auto;right:clamp(1rem,3vw,2rem);width:min(380px,calc(100vw - 2rem));height:auto;max-height:calc(100vh - 110px);
    border-radius:22px;border:1px solid var(--card-line);box-shadow:0 30px 80px -30px rgba(27,36,64,.45);padding:1.1rem 1.4rem 1.4rem;
    background:color-mix(in srgb,var(--cream) 96%,transparent);backdrop-filter:blur(14px)}
  nav:has(.back-link) .nav-links.open a{font-size:1.15rem;padding:.85rem .25rem}
  nav:has(.back-link) .nav-links.open .m-cta{font-size:.72rem;padding:1rem;margin-top:1rem}
  nav:has(.back-link) .nav-links.open li:has(.m-cta[href="#contact"]){display:none}
  nav:has(.back-link) .nav-links.open .lang-switch-mobile{margin-bottom:.75rem}
  nav:has(.back-link) .nav-links.open .lang-switch-mobile .lang-btn{font-family:var(--grot);font-size:.75rem;letter-spacing:.12em;padding:.7rem .5rem;border-bottom:none}
}

/* main pages on small laptops: tighten the header so it never wraps */
@media (min-width:921px) and (max-width:1240px){
  nav:not(:has(.back-link)) .nav-links{gap:clamp(.8rem,1.3vw,1.6rem)}
  nav:not(:has(.back-link)) .nav-links a{font-size:.64rem;letter-spacing:.1em;white-space:nowrap}
  nav:not(:has(.back-link)) .lang-switch{margin-right:.6rem}
  nav:not(:has(.back-link)) .lang-btn{padding:.5rem .4rem}
  nav:not(:has(.back-link)) .nav-cta{padding:.7rem 1rem;font-size:.64rem;letter-spacing:.08em}
  nav:not(:has(.back-link)) .logo{font-size:1.2rem}
}

/* ── hero ── */
.hero{overflow:hidden}
.hero.has-art{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:0;padding-right:0}
.hero.has-art h1{max-width:none;font-size:clamp(2.4rem,4.3vw,4.6rem)}
.hero-art{margin-right:0;align-self:stretch;display:flex;align-items:center}
.hero-art .motion-scene,.hero-art img{border-radius:0!important;box-shadow:none!important;width:115%;max-width:none;margin-left:-8%;overflow:visible!important;
  -webkit-mask-image:radial-gradient(ellipse 62% 62% at 52% 50%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 62% 62% at 52% 50%,#000 58%,transparent 100%)}
.hero.t-night .hero-art .motion-scene,.hero.t-night .hero-art img{
  -webkit-mask-image:radial-gradient(ellipse 58% 64% at 54% 54%,#000 30%,rgba(0,0,0,.75) 52%,rgba(0,0,0,.25) 74%,transparent 92%);
  mask-image:radial-gradient(ellipse 58% 64% at 54% 54%,#000 30%,rgba(0,0,0,.75) 52%,rgba(0,0,0,.25) 74%,transparent 92%)}
.hero-art .motion-scene svg>rect:first-of-type{fill:transparent!important}
.hero-art .motion-scene svg{overflow:visible}
.hero.t-night{color:var(--cream);background:#1B2440!important}
.hero.t-night::before{content:'';position:absolute;inset:0;z-index:0;background:radial-gradient(60% 70% at 72% 62%,rgba(138,115,80,.45),transparent 70%),radial-gradient(50% 60% at 10% 0%,rgba(224,123,98,.14),transparent 70%)}
.hero.t-night h1{color:#fff}
.hero.t-night h1 .ital{color:var(--gold-l)}
.hero.t-night .kicker{color:var(--gold-l)}
.hero.t-night .hero-sub{color:rgba(246,241,230,.75);border-left-color:rgba(230,194,119,.4)}
.hero.t-night .hero-sub strong{color:#fff}
.hero.t-dawn::before{content:'';position:absolute;inset:0;z-index:0;background:radial-gradient(55% 65% at 75% 55%,rgba(233,168,143,.45),transparent 70%)}
.hero-copy{z-index:3}
.hero-quote{border-left-color:var(--coral)}

/* ── buttons ── */
.btn-ink{background:var(--navy);box-shadow:0 14px 34px -16px rgba(27,36,64,.8)}
.btn-ink:hover{background:linear-gradient(120deg,var(--gold),var(--coral));color:var(--navy);box-shadow:0 18px 40px -14px rgba(224,123,98,.6)}
.btn-coral{box-shadow:0 16px 40px -14px rgba(224,123,98,.75),inset 0 0 0 1px rgba(255,255,255,.18)}
.btn-gold{background:linear-gradient(120deg,var(--gold-l),var(--gold));box-shadow:0 14px 34px -14px rgba(201,165,90,.7)}
.btn-gold:hover{background:linear-gradient(120deg,var(--gold-l),var(--coral-s))}
.link-under{border-bottom:2px solid var(--coral)}

/* ── ticker ── */
.ticker{background:var(--navy);border:none;position:relative;z-index:3}
.tick::after{content:'';width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,var(--gold-l),var(--coral));box-shadow:0 0 12px var(--coral);margin-left:2.2rem}

/* ── why now ── */
.lead-txt{color:var(--navy)}
.pain-quote{border-left:3px solid;border-image:linear-gradient(180deg,var(--gold),var(--coral)) 1}

/* ── proof rings ── */
.t-night .ev-grid{background:none;border:none;gap:clamp(1rem,2vw,1.75rem)}
.t-night .ev-cell{background:rgba(255,255,255,.035);border:1px solid rgba(230,194,119,.2);border-radius:24px;text-align:center;display:flex;flex-direction:column;align-items:center;padding:clamp(1.75rem,3vw,2.5rem)}
.ring{position:relative;width:clamp(150px,15vw,190px);aspect-ratio:1;margin-bottom:1rem}
.ring svg{width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.ring .ev-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(2.6rem,4.4vw,3.6rem)!important}
.ring .arc{transition:stroke-dashoffset 2.2s cubic-bezier(.65,0,.25,1)}
.ev-cell p{max-width:20rem}
.ev-quote{border-left:3px solid var(--coral)}

/* ── cards everywhere ── */
.prog-rows{border-top:none!important;display:grid;gap:1rem}
.prog-row{border:1px solid var(--card-line)!important;border-radius:22px;background:var(--card-light);box-shadow:0 18px 40px -30px rgba(27,36,64,.4);transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s,border-color .5s}
.prog-row::before{background:linear-gradient(120deg,rgba(230,194,119,.35),rgba(233,168,143,.35));border-radius:inherit}
.prog-row:hover{transform:translateY(-4px);box-shadow:var(--glow-gold)}
.t-night .prog-row{background:rgba(255,255,255,.04);border-color:rgba(230,194,119,.2)!important}
.t-night .prog-row::before{background:linear-gradient(120deg,rgba(230,194,119,.16),rgba(224,123,98,.16))}
.prog-no{display:flex;flex-direction:column;align-items:center;gap:.35rem;font-size:.8rem!important;letter-spacing:.12em}
.prog-icon{width:64px;height:64px;display:block}
.prog-row{grid-template-columns:6.5rem 1fr!important}

.fw-phases{background:none!important;border:none!important;gap:1rem}
.fw-phase{border-radius:22px;border:1px solid var(--card-line);background:var(--card-light)!important;position:relative}
.t-night .fw-phase{background:rgba(255,255,255,.04)!important;border-color:rgba(230,194,119,.2)}
.fw-no{position:relative;z-index:4;width:46px;height:46px;border-radius:50%;display:inline-flex!important;align-items:center;justify-content:center;
  background:radial-gradient(circle at 35% 30%,var(--gold-l),var(--gold) 55%,#a8833b);color:var(--navy)!important;font-size:.95rem!important;box-shadow:0 0 0 6px rgba(201,165,90,.15)}
.fw-phase.lit .fw-no{background:radial-gradient(circle at 35% 30%,#FFD2C2,var(--coral) 60%,#c25a43);box-shadow:0 0 0 8px rgba(224,123,98,.18),0 0 30px rgba(224,123,98,.6);transform:none!important}
.fw-phase.lit{box-shadow:0 26px 60px -34px rgba(224,123,98,.65)!important}
.fw-rail{top:calc(clamp(1.5rem,2.4vw,2rem) + 22px)!important;left:2rem!important;right:2rem!important;height:2px!important;z-index:3;background:rgba(201,165,90,.25)!important;border-radius:2px}

.whyus-grid,.research-grid,.m-principles,.m-needs,.fw-dl-grid{background:none!important;border:none!important;gap:1rem!important}
.whyus-cell,.rstudy,.m-principles li,.m-needs>div,.fw-dl-grid>div{border-radius:20px;background:var(--card-light)!important;border:1px solid var(--card-line);transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s}
.whyus-cell:hover,.rstudy:hover,.m-principles li:hover{transform:translateY(-4px);box-shadow:var(--glow-gold)}
.recog-list{border-top:none!important}
.recog-list li{border-bottom:1px solid var(--card-line)}
.recog-list li::before{content:''!important;width:12px;height:12px;border-radius:50%;flex-shrink:0;background:radial-gradient(circle at 35% 30%,var(--gold-l),var(--coral));box-shadow:0 0 12px rgba(224,123,98,.55);transform:translateY(-2px)}
.fw-list li::before{content:''!important;width:8px;height:8px;border-radius:50%;top:1.1rem!important;background:radial-gradient(circle,var(--gold-l),var(--coral))}
.african{background:radial-gradient(90% 120% at 50% 120%,rgba(201,165,90,.3),transparent 60%),linear-gradient(180deg,#1B2440,#141C33);border-radius:28px;position:relative;overflow:hidden;isolation:isolate}
.african>*{position:relative;z-index:2}
.m-questions{background:radial-gradient(90% 120% at 50% 120%,rgba(201,165,90,.3),transparent 60%),linear-gradient(180deg,#1B2440,#141C33);border-radius:28px;position:relative;overflow:hidden;isolation:isolate}
.m-questions>*{position:relative;z-index:2}
.m-idw>div{border-top:2px solid;border-image:linear-gradient(90deg,var(--gold),var(--coral)) 1}

/* ── art frames with orbit ── */
.sec-art{position:relative}
.sec-art .motion-scene,.sec-art img{border-radius:28px!important;box-shadow:0 40px 80px -40px rgba(27,36,64,.55)}
.sec-art::before{content:'';position:absolute;inset:-5% -4%;border:1px dashed rgba(201,165,90,.55);border-radius:50%;z-index:-1;animation:t-spin 90s linear infinite}
.sec-art::after{content:'';position:absolute;width:14px;height:14px;border-radius:50%;right:-2%;top:12%;background:radial-gradient(circle,var(--gold-l),var(--coral));box-shadow:0 0 16px var(--coral)}
.sec-art-wide::before{inset:-3% -2%}

/* ── team arches ── */
.ph-wrap{border-radius:999px 999px 26px 26px;overflow:hidden;position:relative;box-shadow:0 30px 60px -30px rgba(27,36,64,.55)}
.ph-wrap::after{background:linear-gradient(180deg,transparent 55%,rgba(27,36,64,.35));mix-blend-mode:normal;opacity:1}
.person:hover .ph-wrap::after{opacity:.4}
.ph-tag{left:1rem;bottom:1rem;border-radius:999px;padding:.55rem 1rem;background:rgba(246,241,230,.92);backdrop-filter:blur(6px)}
.person .pq{border-left-color:var(--coral)}
.cred{border-color:var(--card-line);background:rgba(255,255,255,.35)}
.geo::before{border-color:var(--coral)}

/* ── contact ── */
.cta .meridians{display:none}
.contact-form{background:rgba(255,255,255,.05);border:1px solid rgba(230,194,119,.22);border-radius:24px;backdrop-filter:blur(6px);box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.form-field input,.form-field textarea{border-radius:12px}
.form-field input:focus,.form-field textarea:focus{border-color:var(--gold-l);box-shadow:0 0 0 4px rgba(230,194,119,.15)}

/* ── footer ── */
footer{background:#141C33;position:relative;border-top:1px solid rgba(230,194,119,.15)}

/* ── details / links ── */
.research-more summary,.fw-more summary{border-bottom-color:var(--coral)}
.story-wrap .giant{background:linear-gradient(100deg,var(--navy) 30%,var(--gold) 70%,var(--coral));-webkit-background-clip:text;background-clip:text;color:transparent}
#cookieNotice{background:rgba(20,28,51,.96);backdrop-filter:blur(8px);border-top:1px solid rgba(230,194,119,.25)}

@media(max-width:920px){
  .hero.has-art{grid-template-columns:1fr;padding-right:clamp(1.25rem,4vw,3rem)}
  .hero-art .motion-scene,.hero-art img{width:110%;margin-left:-5%}
  .prog-row{grid-template-columns:4.5rem 1fr!important}
  .prog-icon{width:48px;height:48px}
  .sec-art::before{inset:-3% -3%}
}
@media (prefers-reduced-motion:reduce){
  .d-float,.d-twinkle,.d-spin,.sec-art::before{animation:none!important}
  .ring .arc{transition:none}
}
