/* IFEIA — home page */

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:grid;grid-template-rows:1fr auto;background:var(--ox-deep);color:var(--stone);overflow:hidden;isolation:isolate}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3;animation:kb 26s var(--ease) both}
.hero-shade{position:absolute;inset:0;z-index:-2;background:
  linear-gradient(98deg,rgba(32,6,12,.94) 0%,rgba(74,14,28,.82) 40%,rgba(74,14,28,.38) 100%),
  linear-gradient(0deg,rgba(32,6,12,.9) 0%,rgba(32,6,12,0) 46%)}
.hero-ring{position:absolute;right:-4vw;top:50%;width:min(46vw,640px);aspect-ratio:1;opacity:.1;z-index:-1;transform:translateY(-50%);animation:none}
.hero-ring img{width:100%;height:100%}
.hero-body{align-self:end;padding-top:150px;padding-bottom:clamp(36px,6vh,72px)}
.hero-eyebrow{display:flex;align-items:center;gap:14px;color:var(--rose-soft);margin-bottom:clamp(20px,3vh,34px);opacity:0;animation:fade .6s 0s var(--ease) forwards}
.hero-eyebrow::before{content:"";width:46px;height:1.5px;background:var(--rose)}
.hero-title{font-weight:700;font-size:clamp(2.7rem,8.4vw,7.6rem);line-height:.98;letter-spacing:-.04em;margin-bottom:clamp(22px,3.4vh,38px)}
.ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.ln>span{display:block;transform:translateY(108%);animation:rise .55s var(--ease) forwards}
.ln:nth-child(1)>span{animation-delay:0s}.ln:nth-child(2)>span{animation-delay:.04s}.ln:nth-child(3)>span{animation-delay:.08s}
.ln-accent{color:var(--rose)}
.hero-lead{max-width:58ch;font-size:clamp(1.02rem,1.35vw,1.22rem);line-height:1.6;color:rgba(239,233,225,.9);margin-bottom:clamp(24px,3.6vh,38px);opacity:0;animation:fade .6s .15s var(--ease) forwards}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;opacity:1}
.hero .hero-actions{opacity:0;animation:fade .6s .25s var(--ease) forwards}
.hero-foot{border-top:1px solid var(--line-light);background:linear-gradient(0deg,rgba(32,6,12,.55),transparent)}
.hero-facts{display:grid;grid-template-columns:repeat(3,1fr) 64px;align-items:center;gap:24px;padding-block:22px}
.hero-facts p{margin:0;display:flex;flex-direction:column;gap:4px;font-size:.88rem;color:rgba(239,233,225,.78)}
.hero-facts b{font:700 .78rem/1 var(--head);letter-spacing:.2em;text-transform:uppercase;color:var(--stone)}
.scroll-cue{justify-self:end;width:44px;height:44px;border:1.5px solid rgba(239,233,225,.5);border-radius:50%;display:grid;place-items:center;text-decoration:none}
.scroll-cue i{width:8px;height:8px;border-right:2px solid var(--stone);border-bottom:2px solid var(--stone);transform:rotate(45deg) translate(-1px,-1px);animation:bob 1.8s ease-in-out infinite}
@media(max-width:760px){.hero-facts{grid-template-columns:1fr;gap:10px;padding-block:16px}.hero-facts p{flex-direction:row;gap:10px;align-items:baseline}.hero-facts span{display:none}.scroll-cue{display:none}.hero-body{padding-top:120px}}

/* ---------- what ---------- */
.what-grid{display:grid;grid-template-columns:minmax(150px,.28fr) 1fr;gap:clamp(24px,5vw,80px)}
.statement{font:500 clamp(1.5rem,3.1vw,2.7rem)/1.26 var(--head);letter-spacing:-.025em;max-width:30ch;margin-bottom:clamp(40px,6vw,88px)}
.statement em{font-style:normal;color:var(--wine);background:linear-gradient(var(--rose-soft),var(--rose-soft)) 0 92%/100% .22em no-repeat}
.tenets{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px)}
.tenets article{border-top:2px solid var(--ox);padding-top:20px}
.tenets h2{font-size:1.2rem;margin-bottom:.6em}
.tenets p{color:var(--muted);font-size:.98rem;margin:0}
@media(max-width:900px){.what-grid{grid-template-columns:1fr}.tenets{grid-template-columns:1fr}}

/* ---------- framework (pinned horizontal scroller) ---------- */
.fw{position:relative;background:var(--ox-deep);color:var(--stone);background-image:radial-gradient(120% 80% at 85% 0%,rgba(107,26,43,.55),transparent 60%)}
.fw-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;grid-template-rows:auto 1fr auto;padding-block:calc(var(--hdr) + 28px) 28px}
.fw-head{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,5vw,80px);align-items:end}
.fw-head .kicker{grid-column:1/-1;margin-bottom:.4rem}
.fw-head h2{font-size:clamp(2rem,4.4vw,4rem);letter-spacing:-.035em}
.fw-intro{margin:0;color:rgba(239,233,225,.78);max-width:52ch;font-size:1rem}
.fw-viewport{align-self:center;overflow:hidden;padding-block:clamp(10px,2vh,28px)}
.fw-track{display:flex;gap:clamp(16px,2.2vw,36px);list-style:none;padding-inline:max(var(--gutter),calc((100vw - var(--max)) / 2 + var(--gutter)));width:max-content;will-change:transform}
.fw-panel{flex:0 0 clamp(300px,31vw,430px);border-top:1px solid var(--line-light);padding-top:18px;opacity:.42;transition:opacity .5s var(--ease)}
.fw-panel.is-active{opacity:1}
.fw-num{display:block;font:800 clamp(4.2rem,8vw,7.4rem)/.95 var(--head);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px rgba(201,138,151,.75);margin-bottom:.12em;transition:color .5s}
.fw-panel.is-active .fw-num{color:rgba(201,138,151,.16)}
.fw-panel h3{font-size:clamp(1.3rem,1.9vw,1.75rem);margin-bottom:.5em}
.fw-lead{color:rgba(239,233,225,.82);font-size:.98rem;max-width:34ch}
.fw-panel ul{list-style:none;margin-top:1.2em}
.fw-panel li{border-top:1px solid rgba(239,233,225,.14);padding:.6em 0;font-size:.9rem;color:rgba(239,233,225,.72)}
.fw-progress{display:grid;gap:10px}
.fw-bar{height:2px;background:rgba(239,233,225,.18);position:relative}
.fw-bar i{position:absolute;inset:0;transform:scaleX(0);transform-origin:0 50%;background:var(--rose)}
.fw-progress ol{display:flex;justify-content:space-between;list-style:none;font:600 .72rem/1 var(--head);letter-spacing:.12em;color:rgba(239,233,225,.55)}
@media(max-width:899px),(prefers-reduced-motion:reduce){
  .fw-sticky{position:static;height:auto;display:block;padding-block:calc(var(--hdr) + 40px) 64px}
  .fw-head{grid-template-columns:1fr;gap:16px}
  .fw-viewport{overflow:visible;padding-top:36px}
  .fw-track{flex-direction:column;width:auto;transform:none!important;padding-inline:var(--gutter);gap:32px}
  .fw-panel{flex:none;opacity:1}
  .fw-panel .fw-num{color:rgba(201,138,151,.14)}
  .fw-progress{display:none}
}

/* ---------- levels ---------- */
.levels-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,100px);align-items:start}
.levels-head{position:sticky;top:calc(var(--hdr) + 40px)}
.levels-head h2{font-size:clamp(2rem,4vw,3.4rem);margin-bottom:.5em}
.levels-head p:not(.kicker){color:var(--muted);max-width:40ch}
.levels-list{list-style:none;border-bottom:1px solid var(--line)}
.levels-list li{display:grid;grid-template-columns:44px 1fr 30px;gap:20px;align-items:start;padding:28px 0;border-top:1px solid var(--line);transition:background .35s var(--ease),color .35s,padding .35s var(--ease),margin .35s var(--ease)}
.levels-list li:hover{background:var(--ox);color:var(--stone);padding-inline:24px;margin-inline:-24px;border-radius:8px}
.lv-i{font:700 .85rem/1.9 var(--head);color:var(--wine);letter-spacing:.1em}
.levels-list li:hover .lv-i{color:var(--rose)}
.levels-list h3{font-size:clamp(1.25rem,2vw,1.7rem);margin-bottom:.35em}
.levels-list p{margin:0;color:var(--muted);font-size:.97rem;max-width:52ch}
.levels-list li:hover p{color:rgba(239,233,225,.78)}
.lv-arrow{opacity:.35;transform:translateX(-6px);transition:transform .35s var(--ease),opacity .3s}
.levels-list li:hover .lv-arrow{opacity:1;transform:none;color:var(--rose)}
@media(max-width:900px){.levels-grid{grid-template-columns:1fr}.levels-head{position:static}}

/* ---------- process ---------- */
.process{background:var(--stone-2)}
.process-head{max-width:760px;margin-bottom:clamp(36px,5vw,72px)}
.process-head h2{font-size:clamp(2rem,4vw,3.4rem)}
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px)}
.steps li{background:var(--stone);border-top:3px solid var(--ox);padding:28px 26px 30px;transition:transform .4s var(--ease),box-shadow .4s,background .3s}
.steps li:hover{transform:translateY(-8px);box-shadow:0 26px 40px -26px rgba(74,14,28,.55);background:#fff}
.step-n{display:block;font:800 3.4rem/1 var(--head);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.4px var(--wine);margin-bottom:.35em}
.steps h3{font-size:1.3rem;margin-bottom:.5em}
.steps p{margin:0;color:var(--muted);font-size:.97rem}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}

/* ---------- registry ---------- */
.reg{background:radial-gradient(90% 120% at 100% 0%,var(--wine),transparent 62%),var(--ox);color:var(--stone);padding-block:clamp(72px,10vw,150px);position:relative;overflow:hidden}
.reg-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,6vw,100px);align-items:center}
.reg h2{font-size:clamp(2rem,4.2vw,3.7rem);margin-bottom:.6em}
.reg-copy>p{color:rgba(239,233,225,.82);max-width:52ch}
.reg-points{list-style:none;margin:1.6em 0 2em}
.reg-points li{padding:.7em 0 .7em 34px;border-top:1px solid var(--line-light);position:relative;color:rgba(239,233,225,.9)}
.reg-points li:last-child{border-bottom:1px solid var(--line-light)}
.reg-points li::before{content:"";position:absolute;left:4px;top:1.15em;width:12px;height:7px;border-left:2px solid var(--rose);border-bottom:2px solid var(--rose);transform:rotate(-45deg)}
.reg-points a{color:var(--rose-soft)}
.record{background:var(--stone);color:var(--ink);border-radius:14px;padding:22px 24px 24px;box-shadow:0 40px 70px -30px rgba(0,0,0,.65);transform:rotate(1.4deg);transition:transform .5s var(--ease)}
.record:hover{transform:rotate(0)}
.record-top{display:flex;align-items:center;gap:10px;padding-bottom:16px;border-bottom:1px solid var(--line);font:700 .78rem/1 var(--head);letter-spacing:.16em;text-transform:uppercase;color:var(--ox)}
.record-top img{filter:none}
.record-top em{margin-left:auto;font-style:normal;color:var(--wine);background:var(--rose-soft);padding:.5em .9em;border-radius:999px;font-size:.68rem}
.record dl{margin:0;padding-block:8px}
.record dl>div{display:grid;grid-template-columns:120px 1fr;gap:12px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--line)}
.record dt{font:600 .7rem/1.2 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.record dd{margin:0}
.record dd i{display:block;height:11px;width:var(--w);border-radius:6px;background:linear-gradient(90deg,#ddd5c9,#f4efe8,#ddd5c9);background-size:200% 100%;animation:shimmer 2.6s linear infinite}
.record-foot{display:flex;gap:16px;align-items:center;padding-top:16px}
.record-foot p{margin:0;font-size:.82rem;color:var(--muted);line-height:1.45}
.qr-box{flex:none;width:84px;height:84px;padding:6px;border:1px solid var(--line);border-radius:8px;background:#fff}
.qr-box .qr{width:100%;height:100%}
@media(max-width:900px){.reg-grid{grid-template-columns:1fr}.record{transform:none}}

/* ---------- mosaic ---------- */
.mosaic{display:grid;grid-template-columns:6fr 3fr 3fr;grid-template-rows:minmax(260px,32vw) minmax(260px,32vw);gap:6px;background:var(--stone);padding:0;max-height:none}
.mosaic figure{margin:0;position:relative;overflow:hidden;background:var(--ox)}
.mosaic img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.mosaic figure:hover img{transform:scale(1.05)}
.m1{grid-row:1/3}.m2{grid-column:2/4}.m3{grid-column:2/4;grid-row:2}
.mosaic figcaption{position:absolute;inset:auto 0 0 0;padding:60px 24px 22px;color:var(--stone);font-size:.92rem;background:linear-gradient(0deg,rgba(32,6,12,.88),transparent);display:grid;gap:4px;max-width:none}
.mosaic figcaption b{font:700 .78rem/1 var(--head);letter-spacing:.18em;text-transform:uppercase;color:var(--rose-soft)}
@media(max-width:800px){.mosaic{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:260px}.m1,.m2,.m3{grid-column:auto;grid-row:auto}}

/* ---------- transparency ---------- */
.trans-grid{display:grid;grid-template-columns:4fr 8fr;gap:clamp(24px,6vw,100px)}
.trans h2{font-size:clamp(2.2rem,5vw,4.4rem);letter-spacing:-.04em}
.trans .lead{font:500 clamp(1.25rem,2.1vw,1.8rem)/1.4 var(--head);letter-spacing:-.02em;max-width:34ch;margin-bottom:2em}
.trans-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,28px)}
.trans-cols article{padding:28px;border:1px solid var(--line);border-radius:10px}
.trans-cols article:last-child{background:var(--ox);color:var(--stone);border-color:var(--ox)}
.trans-cols h3{font-size:1.15rem;margin-bottom:.6em}
.trans-cols p{margin:0;font-size:.97rem;color:var(--muted)}
.trans-cols article:last-child p{color:rgba(239,233,225,.88)}
@media(max-width:900px){.trans-grid,.trans-cols{grid-template-columns:1fr}}

/* ---------- closing CTA ---------- */
.cta{position:relative;isolation:isolate;color:var(--stone);padding-block:clamp(90px,13vw,190px);overflow:hidden;background:var(--ox-deep)}
.cta-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.cta-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(32,6,12,.95),rgba(74,14,28,.78))}
.cta h2{font-size:clamp(2.4rem,6.6vw,5.8rem);letter-spacing:-.04em;max-width:14ch;margin-bottom:.4em}
.cta p{max-width:48ch;color:rgba(239,233,225,.85);font-size:1.1rem;margin-bottom:1.8em}

@keyframes rise{to{transform:none}}
@keyframes fade{to{opacity:1}}
@keyframes kb{from{transform:scale(1.14)}to{transform:scale(1)}}
@keyframes spin{to{transform:translateY(-50%) rotate(360deg)}}
@keyframes bob{50%{transform:rotate(45deg) translate(3px,3px)}}
@keyframes shimmer{to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){
  .ln>span{transform:none}.hero-eyebrow,.hero-lead,.hero .hero-actions{opacity:1}
  .hero-ring{animation:none}.hero-img{animation:none}.record dd i{animation:none}
}