/* Homepage only. Everything is prefixed hm- so it cannot clash with style.css. Behaviour is in home.js. Colors come from the site tokens. */
.hm{--hm-mint:#2cc4b4;--hm-amber:#f2b134;--hm-shadow:0 30px 60px -30px rgba(6,60,55,.35);--hm-orb1:rgba(44,196,180,.38);--hm-orb2:rgba(242,177,52,.18);--accentf:'Instrument Serif',Georgia,'Times New Roman',serif;overflow-x:clip}
:root[data-theme="dark"] .hm{--hm-shadow:0 30px 60px -30px rgba(0,0,0,.7);--hm-orb1:rgba(44,196,180,.22);--hm-orb2:rgba(242,177,52,.10)}
.hm h1,.hm h2,.hm h3{font-family:var(--display);font-weight:700;letter-spacing:-.025em;line-height:1.05;text-wrap:balance}
.hm-sec{padding-block:88px}
.hm-sh{max-width:720px;margin-bottom:44px}.hm-sh h2{font-size:clamp(2rem,4.4vw,3.4rem)}
.hm-sh p{margin:18px 0 0;color:var(--muted);font-size:1.1rem;max-width:56ch}
.hm-btn{display:inline-flex;align-items:center;gap:10px;font:600 .98rem/1 var(--body);padding:15px 22px;border-radius:99px;border:1px solid transparent;text-decoration:none;cursor:pointer;transition:transform .25s,box-shadow .25s,background .25s}
.hm-btn.p{background:var(--band);color:#fff}
:root[data-theme="dark"] .hm-btn.p{background:var(--accent);color:var(--on-accent)}
.hm-btn.p:hover{transform:translateY(-2px);box-shadow:0 14px 28px -14px var(--accent)}
.hm-btn.g{border-color:var(--line);color:var(--fg);background:transparent}.hm-btn.g:hover{border-color:var(--accent)}
.hm-btn.a{background:var(--hm-amber);color:#10201f}.hm-btn.a:hover{transform:translateY(-2px);box-shadow:0 14px 28px -12px rgba(242,177,52,.7)}
.hm-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* hero */
.hm-hero{position:relative;padding-block:56px 56px;overflow:clip}
.hm-orb{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;will-change:transform}
.hm-o1{width:560px;height:560px;right:-120px;top:-120px;background:var(--hm-orb1)}.hm-o2{width:420px;height:420px;left:-140px;bottom:-120px;background:var(--hm-orb2)}
.hm-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.hm-copy{will-change:transform,filter,opacity}
.hm-kick{display:inline-block;font:600 .9rem/1.3 var(--body);color:var(--accent-ink);background:var(--accent-soft);padding:8px 14px;border-radius:16px;margin-bottom:22px}
.hm h1{font-size:clamp(2.6rem,6.2vw,5.4rem);line-height:1;font-weight:800;letter-spacing:-.035em}
.hm h1 .w{display:block}
.hm h1 .w.ac{color:var(--accent-ink);font:italic 400 1.08em/1 var(--accentf);letter-spacing:-.01em}
.hm-sub{margin:26px 0 0;font-size:clamp(1.05rem,1.5vw,1.22rem);color:var(--muted);max-width:50ch}
.hm-note{margin:22px 0 0;font-size:.88rem;color:var(--muted);max-width:52ch}

.hm-board{position:relative;margin-bottom:46px;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:26px;box-shadow:var(--hm-shadow)}
.hm-bh{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}.hm-bh b{font:600 1.05rem var(--body)}
.hm-tag{font:600 .74rem/1 var(--body);padding:6px 10px;border-radius:99px;background:var(--accent-soft);color:var(--accent-ink)}
.hm-brow{display:grid;grid-template-columns:auto 1fr auto;gap:6px 14px;align-items:center;padding:15px 0;border-top:1px solid var(--line)}
.hm-brow:first-of-type{border-top:0}
.hm-ck{width:26px;height:26px;border-radius:50%;background:var(--hm-mint);color:#fff;display:grid;place-items:center;font-size:.8rem;font-weight:700}.hm-ck.am{background:var(--hm-amber);color:#10201f}
.hm-brow .l{font-weight:600}
.hm-st{font:600 .78rem/1 var(--body);padding:6px 10px;border-radius:99px;background:var(--accent-soft);color:var(--accent-ink);white-space:nowrap}
.hm-st.am{background:rgba(242,177,52,.2);color:#8a5a00}
:root[data-theme="dark"] .hm-st.am{color:#f7c75a}
.hm-pg{grid-column:2/4;height:5px;border-radius:3px;background:var(--line);overflow:hidden}
.hm-pg i{display:block;height:100%;width:var(--w);border-radius:3px;background:linear-gradient(90deg,var(--accent),var(--hm-mint));transform-origin:left;animation:hmfill 1.6s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,.6s)}
.hm-pg i.am{background:linear-gradient(90deg,#e09a10,var(--hm-amber))}
.hm-float{position:absolute;right:-18px;bottom:-58px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 16px;box-shadow:var(--hm-shadow);font-size:.9rem;display:flex;gap:10px;align-items:center}
.hm-spark{display:flex;align-items:flex-end;gap:4px;height:30px}.hm-spark i{width:6px;border-radius:2px;background:var(--accent)}.hm-spark i:last-child{background:var(--hm-amber)}

/* ticker + facts */
.hm-tick{border-block:1px solid var(--line);overflow:hidden;white-space:nowrap;padding:18px 0}
.hm-trk{display:inline-flex;gap:56px;animation:hmslide 40s linear infinite;font:italic 400 1.7rem/1 var(--accentf);color:var(--muted)}
.hm-trk span::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-left:56px;vertical-align:middle}
.hm-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding-block:64px 24px}
.hm-fact{padding:6px 28px;border-left:1px solid var(--line)}.hm-fact:first-child{border-left:0;padding-left:0}
.hm-fact b{display:block;font:italic 400 clamp(2.1rem,3.8vw,3.1rem)/1 var(--accentf);letter-spacing:-.01em;color:var(--accent-ink)}
.hm-fact span{display:block;margin-top:10px;color:var(--muted);font-size:.96rem;max-width:22ch}

/* services ledger */
.hm-led{border-top:1px solid var(--line)}
.hm-row{--mx:50%;--my:50%;position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.3fr) 220px;gap:28px;align-items:center;padding:34px 12px;border-bottom:1px solid var(--line);text-decoration:none;color:inherit;overflow:hidden;isolation:isolate;transition:padding .35s cubic-bezier(.2,.7,.2,1)}
.hm-row::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx) var(--my),var(--accent-soft),transparent 70%)}
.hm-row:hover{padding-left:26px}.hm-row:hover::before{opacity:1}
.hm-row h3{font-size:clamp(1.7rem,3vw,2.5rem)}.hm-row p{margin:0;color:var(--muted);max-width:46ch}
.hm-pr{text-align:right;font-size:.88rem;color:var(--muted)}.hm-pr b{display:block;font:700 1.7rem/1.1 var(--display);color:var(--fg);letter-spacing:-.01em}

/* process */
.hm-proc{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}
.hm-stick{position:sticky;top:110px}
.hm-steps{position:relative;padding-left:44px}
.hm-steps::before,.hm-steps::after{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:2px;background:var(--line)}
.hm-steps::after{background:linear-gradient(var(--accent),var(--hm-mint));transform-origin:top;transform:scaleY(var(--p,0));transition:transform .15s linear}
.hm-step{position:relative;padding-bottom:54px}.hm-step:last-child{padding-bottom:0}
.hm-step::before{content:attr(data-n);position:absolute;left:-44px;top:0;width:24px;height:24px;border-radius:50%;background:var(--bg);border:2px solid var(--line);display:grid;place-items:center;font:700 .7rem/1 var(--body);color:var(--muted);transition:all .4s}
.hm-step.on::before{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}
.hm-step h3{font-size:1.9rem;margin-bottom:10px}.hm-step p{margin:0;color:var(--muted);max-width:46ch}

/* posts, faq */
.hm-posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.hm-post{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--surface);text-decoration:none;color:inherit;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.hm-post:hover{transform:translateY(-6px);box-shadow:var(--hm-shadow)}
.hm-pc{height:150px;background:linear-gradient(135deg,var(--band),var(--accent));position:relative;overflow:hidden}
.hm-pc::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-60px;top:-80px;background:rgba(255,255,255,.12)}
.hm-pc::before{content:"";position:absolute;width:140px;height:140px;border-radius:50%;left:-40px;bottom:-60px;background:rgba(242,177,52,.28)}
.hm-pb{padding:22px;display:flex;flex-direction:column;gap:12px;flex:1}
.hm-pb small{color:var(--accent-ink);font-weight:600;letter-spacing:.02em}.hm-pb h3{font-size:1.4rem;line-height:1.18}.hm-pb span{margin-top:auto;color:var(--muted);font-size:.92rem}
.hm-faq{max-width:860px}
.hm-faq details{border-top:1px solid var(--line)}.hm-faq details:last-child{border-bottom:1px solid var(--line)}
.hm-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:center;padding:26px 0;font:600 clamp(1.2rem,2vw,1.55rem)/1.25 var(--display);letter-spacing:-.01em}
.hm-faq summary::-webkit-details-marker{display:none}
.hm-faq summary i{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;transition:transform .35s,background .35s;font-style:normal}
.hm-faq details[open] summary i{transform:rotate(45deg);background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.hm-faq details p{margin:0;padding:0 56px 28px 0;color:var(--muted);max-width:64ch;animation:hmopen .45s cubic-bezier(.2,.7,.2,1)}

/* closing band */
.hm-close{background:linear-gradient(135deg,#072b28,#0b6f66);color:#fff;border-radius:32px;padding:clamp(40px,7vw,88px);position:relative;overflow:hidden}
.hm-close::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-160px;top:-200px;background:rgba(44,196,180,.28);filter:blur(60px)}
.hm-close h2{font-size:clamp(2.1rem,5vw,3.8rem);max-width:16ch;position:relative;color:#fff}
.hm-close h2 em{font:italic 400 1.1em/1 var(--accentf);color:var(--hm-amber)}
.hm-close p{margin:20px 0 0;max-width:46ch;color:#cfeeea;position:relative}
.hm-close .hm-cta{position:relative}.hm-close .hm-note{color:#a8d4cf;position:relative}

/* motion: only active once home.js adds .hm-on, so the page reads fine without it */
.hm-on .rv{opacity:0;transform:translateY(34px);filter:blur(12px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),filter .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rd,0s)}
.hm-on .rv.in2{opacity:1;transform:none;filter:none}
.hm-on h1 .w,.hm-on .after{opacity:0;animation:hmword 1s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:var(--wd,.9s)}
@keyframes hmword{from{opacity:0;transform:translateY(40px);filter:blur(14px)}to{opacity:1;transform:none;filter:none}}
@keyframes hmfill{from{transform:scaleX(0)}}
@keyframes hmslide{to{transform:translateX(-50%)}}
@keyframes hmopen{from{opacity:0;transform:translateY(-8px)}}

@media (max-width:900px){
  .hm-grid,.hm-proc{grid-template-columns:minmax(0,1fr);gap:44px}.hm-stick{position:static}
  .hm-facts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}.hm-fact:nth-child(3){border-left:0;padding-left:0}
  .hm-row{grid-template-columns:minmax(0,1fr);gap:12px;padding:28px 4px}.hm-pr{text-align:left}
  .hm-posts{grid-template-columns:minmax(0,1fr)}.hm-sec{padding-block:64px}
  .hm-float{right:8px}.hm-faq details p{padding-right:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .hm-on .rv,.hm-on h1 .w,.hm-on .after{opacity:1!important;transform:none!important;filter:none!important}
}
