/* HCDE – home page sections. Loaded after style.css on the home page only. */

/* ---------- shared: photographic sections ---------- */
.ph-sec{position:relative;overflow:hidden;isolation:isolate;color:var(--ivory);background:var(--emerald-950)}
.ph-bg{position:absolute;inset:-14% 0;z-index:-2}
.ph-bg img{width:100%;height:100%;object-fit:cover;transform:translate3d(0,var(--py,0px),0)}
.ph-sec::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,42,37,.9),rgba(7,42,37,.78) 40%,rgba(7,42,37,.92))}
.ph-sec.ph-light::before{background:linear-gradient(90deg,rgba(7,42,37,.94),rgba(7,42,37,.7) 60%,rgba(7,42,37,.5))}
.ph-pad{padding:clamp(4rem,9vw,7.5rem) 0}
.ph-sec .section-lead{color:#D2CCBC}
.ph-sec .eyebrow{color:var(--copper-light)}

/* ---------- statement band: tune ---------- */
.band-quote small{display:block;margin-top:1.4rem;font:600 .95rem/1.5 var(--f-body);letter-spacing:.02em;color:#D2CCBC;max-width:46ch}

/* ---------- standards explorer ---------- */
.explorer{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;margin-top:2.6rem}
.tablist{display:grid;gap:.35rem;border-left:2px solid rgba(246,241,231,.2)}
.tab{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:2.6rem 1fr;align-items:baseline;padding:.85rem 1rem .85rem 0;margin-left:-2px;border-left:3px solid transparent;color:#CFC9B9;font:600 1.02rem/1.3 var(--f-body);transition:color .2s,border-color .25s,padding .3s var(--ease),background .25s}
.tab span{font:500 .9rem/1 var(--f-display);letter-spacing:.12em;color:var(--copper-light);padding-left:1rem}
.tab:hover{color:#fff;padding-left:.35rem}
.tab[aria-selected=true]{color:#fff;border-left-color:var(--copper-light);background:linear-gradient(90deg,rgba(224,168,116,.14),transparent);padding-left:.35rem}
.tab:focus-visible{outline:3px solid var(--copper-light);outline-offset:2px}
.tabpanel{background:rgba(246,241,231,.97);color:var(--ink);border-radius:22px;padding:clamp(1.6rem,3.4vw,2.8rem);box-shadow:0 40px 70px -40px rgba(0,0,0,.6);position:relative;overflow:hidden}
.tabpanel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,var(--copper),var(--emerald-900))}
.tabpanel[hidden]{display:none}
.tabpanel .pn{font:500 .95rem/1 var(--f-display);letter-spacing:.2em;color:var(--copper-ink)}
.tabpanel h3{font-size:clamp(1.7rem,3vw,2.4rem);margin:.7rem 0 .7rem;color:var(--emerald-900)}
.tabpanel .sum{font:400 1.18rem/1.45 var(--f-display);color:var(--emerald-900);margin-bottom:1.5rem;max-width:42ch}
.tabpanel .cols{display:grid;grid-template-columns:1.25fr 1fr;gap:1.6rem 2.4rem}
.tabpanel h4{font:700 .74rem/1 var(--f-body);letter-spacing:.18em;text-transform:uppercase;color:var(--copper-ink);margin-bottom:.8rem}
.tabpanel ul{display:grid;gap:.6rem}
.tabpanel li{position:relative;padding-left:1.15rem;font-size:.98rem;line-height:1.5;color:#2B403B}
.tabpanel li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--copper)}
.tabpanel .more{margin-top:1.8rem}
.tabpanel .btn-ink{background:var(--emerald-900);color:var(--ivory)}
.tabpanel .btn-ink:hover{background:var(--copper-deep)}

/* ---------- interactive timeline ---------- */
.tl{position:relative;margin-top:2.6rem}
.tl-track{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));position:relative}
.tl-track::before{content:"";position:absolute;left:calc(100%/12);right:calc(100%/12);top:27px;height:3px;background:rgba(246,241,231,.22)}
.tl-track::after{content:"";position:absolute;left:calc(100%/12);top:27px;height:3px;width:calc((100% - 100%/6) * var(--tp,0));background:var(--copper-light);transition:width .6s var(--ease)}
.tl-step{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.8rem;text-align:center;position:relative;z-index:1;padding:0 .3rem;color:#CFC9B9;font:700 .85rem/1.25 var(--f-body);letter-spacing:.04em}
.tl-dot{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--emerald-900);border:3px solid rgba(246,241,231,.3);font:600 1.15rem/1 var(--f-display);color:var(--ivory);transition:background .35s,border-color .35s,transform .45s var(--ease),color .35s}
.tl-step:hover .tl-dot{transform:scale(1.08)}
.tl-step.done .tl-dot{background:var(--copper-deep);border-color:var(--copper-light)}
.tl-step[aria-selected=true]{color:#fff}
.tl-step[aria-selected=true] .tl-dot{background:var(--copper-light);border-color:var(--ivory);color:var(--emerald-950);transform:scale(1.15)}
.tl-step:focus-visible{outline:3px solid var(--copper-light);outline-offset:4px;border-radius:12px}
.tl-panel{margin-top:2.4rem;background:rgba(246,241,231,.97);color:var(--ink);border-radius:22px;padding:clamp(1.6rem,3.4vw,2.8rem);display:grid;grid-template-columns:1.1fr 1fr;gap:1.6rem 3rem;box-shadow:0 40px 70px -40px rgba(0,0,0,.6)}
.tl-panel[hidden]{display:none}
.tl-panel h3{font-size:clamp(1.6rem,2.8vw,2.2rem);color:var(--emerald-900);margin-bottom:.8rem}
.tl-panel .big{font-size:1.1rem;color:#2B403B;line-height:1.6}
.tl-side{display:grid;gap:1.2rem;align-content:start}
.tl-side div{border-left:3px solid var(--copper);padding-left:1rem}
.tl-side h4{font:700 .72rem/1 var(--f-body);letter-spacing:.18em;text-transform:uppercase;color:var(--copper-ink);margin-bottom:.4rem}
.tl-side p{font-size:.98rem;color:#2B403B;line-height:1.5}
.tl-nav{display:flex;gap:.8rem;margin-top:1.4rem;align-items:center}
.tl-nav button{all:unset;box-sizing:border-box;cursor:pointer;padding:.7rem 1.1rem;border:2px solid var(--emerald-900);border-radius:999px;font:700 .85rem/1 var(--f-body);color:var(--emerald-900);transition:background .2s,color .2s}
.tl-nav button:hover{background:var(--emerald-900);color:var(--ivory)}
.tl-nav button:focus-visible{outline:3px solid var(--copper);outline-offset:3px}

/* ---------- certificate gallery ---------- */
.certs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2.4vw,2rem);margin-top:3rem;perspective:1400px}
.cert{all:unset;box-sizing:border-box;cursor:zoom-in;display:block;position:relative;border-radius:6px;transform-style:preserve-3d;transition:transform .5s var(--ease)}
.cert-img{display:block;border-radius:6px;overflow:hidden;box-shadow:0 36px 60px -24px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.08);transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(0);transition:transform .35s var(--ease),box-shadow .35s}
.cert:hover .cert-img{box-shadow:0 50px 70px -24px rgba(0,0,0,.85),0 0 0 1px rgba(224,168,116,.5)}
.cert-img img{width:100%;height:auto}
.cert:focus-visible{outline:3px solid var(--copper-light);outline-offset:6px}
.cert figcaption,.cert .cap{display:block;margin-top:1.1rem;color:#fff;font:500 1.25rem/1.25 var(--f-display)}
.cert .cap small{display:block;margin-top:.3rem;font:400 .92rem/1.5 var(--f-body);color:#CFC9B9}
.certs li:nth-child(2){margin-top:1.8rem}
.cert-note{margin-top:2.6rem;max-width:68ch;color:#D2CCBC;font-size:.98rem;border-left:3px solid var(--copper-light);padding-left:1rem}
dialog.lightbox{border:0;padding:0;background:transparent;max-width:min(92vw,560px);width:92vw;overflow:visible}
dialog.lightbox::backdrop{background:rgba(5,25,21,.88)}
dialog.lightbox img{width:100%;height:auto;max-height:84vh;object-fit:contain;border-radius:8px;box-shadow:0 40px 90px rgba(0,0,0,.6)}
dialog.lightbox form{position:absolute;right:-6px;top:-50px}
dialog.lightbox button{all:unset;cursor:pointer;width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--ivory);color:var(--emerald-900);font:700 1.4rem/1 var(--f-body)}
dialog.lightbox p{color:#E8E2D2;margin-top:.9rem;text-align:center;font-size:.95rem}

/* ---------- registry teaser ---------- */
.reg2{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.reg2-media{border-radius:22px;overflow:hidden;aspect-ratio:4/5;position:relative;box-shadow:0 40px 60px -36px rgba(11,58,51,.55);background:var(--stone)}
.reg2-media img{width:100%;height:100%;object-fit:cover;transform:translate3d(0,var(--py,0px),0) scale(1.12)}
.reg2-media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,42,37,.55),transparent 45%)}
.reg2-media figcaption{position:absolute;left:1.4rem;right:1.4rem;bottom:1.2rem;z-index:2;color:#fff;font:500 1.15rem/1.3 var(--f-display)}
.search-card{background:var(--paper);border:1px solid var(--stone);border-radius:20px;padding:clamp(1.3rem,3vw,2rem);margin-top:1.8rem;box-shadow:0 30px 50px -36px rgba(11,58,51,.5)}
.search-card label{font:700 .8rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--copper-ink);display:block;margin-bottom:.7rem}
.search-card .verify-form{margin-top:0}
.search-card input{border-color:#8C8676}
.search-card .btn{background:var(--emerald-900);color:var(--ivory)}
.search-card .btn:hover{background:var(--copper-deep)}
.search-card .hint{margin-top:.8rem}
#result:empty{display:none}
#result .no-result{margin-top:1.2rem}
.reg2 .result{margin-top:1.4rem}

/* ---------- governance ---------- */
.bodies{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1.6rem;margin-top:2rem;counter-reset:b}
.bodies li{counter-increment:b;display:grid;grid-template-columns:2rem 1fr;gap:.2rem .6rem;font-size:.95rem;color:var(--muted);line-height:1.45}
.bodies li::before{content:counter(b,upper-roman);font:500 1rem/1.3 var(--f-display);color:var(--copper-ink)}
.bodies strong{display:block;color:var(--emerald-900);font:600 1rem/1.3 var(--f-body)}

/* ---------- services with photo ---------- */
.svc-wrap{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.svc-photo{position:sticky;top:calc(var(--header-h) + 24px);border-radius:240px 240px 18px 18px;overflow:hidden;aspect-ratio:3/4;box-shadow:0 40px 60px -30px rgba(0,0,0,.6)}
.svc-photo img{width:100%;height:100%;object-fit:cover}

/* ---------- FAQ preview ---------- */
.faqsec{background:var(--ivory-2);padding:clamp(4rem,9vw,7.5rem) 0}
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,6vw,5.5rem);align-items:start}
.faq-media{position:sticky;top:calc(var(--header-h) + 24px)}
.faq-media figure{border-radius:20px;overflow:hidden;aspect-ratio:5/4;margin-bottom:1.6rem;box-shadow:0 36px 56px -34px rgba(11,58,51,.55)}
.faq-media img{width:100%;height:100%;object-fit:cover}
.faq details{border-bottom:1px solid #C9C1AE}
.faq summary{cursor:pointer;list-style:none;padding:1.15rem 2.4rem 1.15rem 0;font:500 1.25rem/1.3 var(--f-display);color:var(--emerald-900);position:relative;transition:color .2s}
.faq summary:hover{color:var(--copper-ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.2rem;top:.85rem;font:400 1.8rem/1 var(--f-body);color:var(--copper);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{padding:0 2.4rem 1.4rem 0;color:#2B403B;max-width:60ch}

/* ---------- insights ---------- */
.insights{background:var(--ivory);padding:clamp(4rem,9vw,7.5rem) 0}
.ins-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.3rem}
.ins{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--stone);border-radius:18px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s}
a.ins:hover{transform:translateY(-8px);box-shadow:0 30px 50px -26px rgba(11,58,51,.5);border-color:var(--copper)}
.ins-img{aspect-ratio:3/2;overflow:hidden;background:var(--stone)}
.ins-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
a.ins:hover .ins-img img{transform:scale(1.08)}
.ins-body{padding:1.3rem 1.3rem 1.5rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.ins-cat{font:700 .7rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink)}
.ins h3{font-size:1.28rem;line-height:1.2;color:var(--emerald-900)}
.ins p{font-size:.93rem;color:var(--muted);line-height:1.5}
.ins-date{margin-top:auto;padding-top:.6rem;font-size:.82rem;color:var(--muted)}

/* ---------- resources ---------- */
.docs-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:clamp(2rem,6vw,5rem);align-items:center}
.docs-list{display:grid;gap:.8rem}
.docitem{display:grid;grid-template-columns:44px 1fr;gap:1rem;align-items:center;padding:1rem 1.2rem;background:rgba(246,241,231,.97);color:var(--ink);border-radius:14px;text-decoration:none;transition:transform .3s var(--ease),box-shadow .3s}
a.docitem:hover{transform:translateX(6px);box-shadow:0 16px 30px -18px rgba(0,0,0,.6)}
.docitem .doc-icon{width:38px;height:46px;border:2px solid var(--emerald-900);border-radius:6px;position:relative}
.docitem .doc-icon::after{content:"";position:absolute;left:7px;right:7px;top:12px;height:2px;background:var(--emerald-900);box-shadow:0 7px 0 var(--emerald-900),0 14px 0 var(--stone)}
.docitem strong{display:block;font:500 1.12rem/1.25 var(--f-display);color:var(--emerald-900)}
.docitem span.d{display:block;font-size:.9rem;color:var(--muted);line-height:1.4}

/* ---------- marquee + CTA ---------- */
.marquee{background:var(--emerald-950);border-block:1px solid rgba(224,168,116,.22);overflow:hidden;padding:1.15rem 0;color:var(--copper-light)}
.marquee-track{display:flex;width:max-content;animation:mq 60s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{font:500 1.5rem/1 var(--f-display);font-style:italic;white-space:nowrap;padding:0 1.4rem;display:inline-flex;align-items:center;gap:2.8rem}
.marquee span::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--copper)}
@keyframes mq{to{transform:translateX(-50%)}}
.ctasec{text-align:center}
.ctasec .cta-inner{max-width:700px}
.ctasec h2{font-size:clamp(2.2rem,5vw,3.6rem);margin-bottom:1rem}
.ctasec p{color:#D9D3C4;font-size:1.12rem}
.ctasec .cta-actions{margin-top:2rem}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .ins-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tl-track{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:1.6rem}
  .tl-track::before,.tl-track::after{display:none}
}
@media (max-width:959px){
  .explorer{grid-template-columns:1fr}
  .tablist{display:flex;overflow-x:auto;border:0;gap:.5rem;padding-bottom:.4rem;scrollbar-width:thin}
  .tab{display:block;flex:none;border:1.5px solid rgba(246,241,231,.35);border-radius:999px;padding:.6rem 1rem;margin:0;white-space:nowrap}
  .tab span{padding:0 .5rem 0 0}
  .tab:hover,.tab[aria-selected=true]{padding-left:1rem}
  .tab[aria-selected=true]{background:var(--copper-light);color:var(--emerald-950);border-color:var(--copper-light)}
  .tab[aria-selected=true] span{color:var(--emerald-950)}
  .tabpanel .cols{grid-template-columns:1fr}
  .tl-panel{grid-template-columns:1fr}
  .certs{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .certs li:nth-child(2){margin-top:0}
  .reg2,.faq-grid,.docs-grid,.svc-wrap{grid-template-columns:1fr}
  .reg2-media{aspect-ratio:16/10}
  .svc-photo,.faq-media{position:static}
  .svc-photo{aspect-ratio:16/9;border-radius:18px;order:-1}
  .bodies{grid-template-columns:1fr}
}
@media (max-width:640px){
  .tl-track{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ins-grid{grid-template-columns:1fr}
  .tl-dot{width:48px;height:48px}
}
@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none}
  .ph-bg img,.reg2-media img{transform:none!important}
  .cert-img{transform:none!important}
}

/* fixes */
.ph-sec h2{margin-bottom:1rem}
.ph-sec .split-head h2,.ph-sec .section-head h2{margin-bottom:0}
.search-card .verify-form label{flex:0 0 100%;margin-bottom:.2rem}
.search-card .verify-form input{flex:1 1 220px;min-width:0}

/* accredited bodies strip */
.bodies-strip{background:var(--paper);padding:clamp(3.5rem,8vw,6rem) 0;border-block:1px solid var(--stone)}
.strip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;list-style:none;padding:0;margin:0}
.strip-grid a{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:var(--ivory);border:1px solid var(--stone);border-radius:16px;overflow:hidden;transition:transform .35s var(--ease),border-color .25s,box-shadow .35s var(--ease)}
.strip-grid a:hover{transform:translateY(-5px);border-color:var(--copper);box-shadow:0 22px 34px -24px rgba(11,58,51,.5)}
.strip-grid .logo-tile{aspect-ratio:1/1;padding:.8rem;background:#fff;border-bottom:1px solid var(--stone);display:flex;align-items:center;justify-content:center}
.strip-grid .logo-tile img{width:100%;height:100%;object-fit:contain}
.strip-name{padding:.7rem .8rem;font:700 .78rem/1.2 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--emerald-900);text-align:center}
/* the founding network as a list of names: the logo is only a small mark, so look-alike logos do not stand out */
.strip-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:.7rem}
.strip-grid a{flex-direction:row;align-items:center;gap:.8rem;padding:.7rem .9rem;border-radius:14px}
.strip-grid .logo-tile{flex:none;width:48px;height:48px;aspect-ratio:auto;padding:.25rem;border:1px solid var(--stone);border-radius:10px}
.strip-txt{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.strip-acr{font:700 .68rem/1 var(--f-body);letter-spacing:.2em;color:var(--copper-deep)}
.strip-name{font:500 1.02rem/1.25 var(--f-display);color:var(--emerald-900)}
.strip-geo{font-size:.8rem;color:var(--muted)}
.strip-grid .strip-name{text-transform:none;letter-spacing:0;text-align:left;padding:0;margin:0;font-size:1.02rem;line-height:1.25;font-weight:500}
.strip-grid .strip-txt{text-align:left}
