/* MUTARE — metamorphosis motion system */
:root{
  --white:#FFFFFF;
  --ivory:#FAF8F3;
  --ivory-dim:#F3EFE6;
  --ink:#161310;
  --ink-soft:#575046;
  --stone:#9A9184;
  --gold:#A68B5B;
  --gold-soft:rgba(166,139,91,.16);
  --line:rgba(22,19,16,.1);
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Inter",-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.22,.8,.28,1);
  --bloom:cubic-bezier(.19,1,.22,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);background:var(--white);color:var(--ink);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.loading{overflow:hidden}
::selection{background:var(--gold-soft)}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:76rem;margin:0 auto;padding:0 clamp(1.25rem,5vw,3rem)}
.wrap.narrow{max-width:52rem}
.center{text-align:center}

.draft-badge{
  position:fixed;top:0;left:0;right:0;z-index:400;text-align:center;
  font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;
  padding:.5rem;background:var(--ink);color:var(--white);
}

/* ---------- preloader ---------- */
.loader{
  position:fixed;inset:0;z-index:500;background:var(--white);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2rem;
  transition:transform 1s var(--bloom);
}
.loader.done{transform:translateY(-101%)}
.loader-word{
  font-family:var(--serif);font-weight:600;font-size:clamp(1.6rem,6vw,2.6rem);
  letter-spacing:.34em;text-transform:uppercase;color:var(--ink);
  display:flex;overflow:hidden;
}
.loader-word span{
  display:inline-block;transform:translateY(120%);opacity:0;
  animation:lrise .9s var(--bloom) forwards;
}
.loader-sub{
  font-size:.64rem;letter-spacing:.4em;text-transform:uppercase;color:var(--stone);
  opacity:0;animation:lfade .8s ease .9s forwards;
}
@keyframes lrise{to{transform:translateY(0);opacity:1}}
@keyframes lfade{to{opacity:1}}

/* ---------- silk thread ---------- */
.thread{
  position:fixed;left:clamp(.6rem,2.5vw,2rem);top:0;bottom:0;height:100%;width:60px;
  z-index:60;pointer-events:none;opacity:.9;
}
.thread path#threadPath{
  stroke-dasharray:1;stroke-dashoffset:1;
}
#cocoon,#threadFly{transition:opacity .6s ease}

/* ---------- nav ---------- */
.nav{
  position:fixed;top:2rem;left:0;right:0;z-index:100;
  display:flex;justify-content:space-between;align-items:center;
  padding:.9rem clamp(1.25rem,5vw,3rem);
  transition:transform .45s var(--ease),background .35s,box-shadow .35s,top .35s;
}
.nav.scrolled{background:rgba(255,255,255,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line);top:0}
.nav.hidden{transform:translateY(-110%)}
.wordmark{
  font-family:var(--serif);font-weight:600;font-size:1.5rem;
  letter-spacing:.28em;text-transform:uppercase;text-decoration:none;color:var(--ink);
}
.nav-links{display:flex;gap:clamp(1.2rem,3vw,2.4rem);align-items:center}
.nav-links>a:not(.btn){
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;
  color:var(--ink-soft);position:relative;transition:color .3s;
}
.nav-links>a:not(.btn)::after{
  content:"";position:absolute;left:0;bottom:-5px;width:100%;height:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease);
}
.nav-links>a:not(.btn):hover{color:var(--ink)}
.nav-links>a:not(.btn):hover::after{transform:scaleX(1);transform-origin:left}

/* ---------- type ---------- */
.kicker{
  font-size:.68rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1.5rem;font-weight:600;
}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.06;letter-spacing:.005em;color:var(--ink)}
h1 em,h2 em,h3 em{font-style:italic;font-weight:400}
h2{font-size:clamp(2.4rem,5.2vw,4rem);margin-bottom:1.2rem}
.lede{font-size:clamp(1.02rem,1.5vw,1.18rem);line-height:1.75;color:var(--ink-soft);max-width:36rem}
.velo{will-change:transform}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:600;
  text-decoration:none;padding:1.05rem 2.2rem;border-radius:999px;border:1px solid transparent;
  transition:transform .35s var(--ease),box-shadow .35s,background .35s,color .35s,border-color .35s;
  will-change:transform;white-space:nowrap;
}
.btn-sm{padding:.7rem 1.4rem}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#2A241D;box-shadow:0 16px 38px rgba(22,19,16,.22);transform:translateY(-2px)}
.btn-ghost{border-color:rgba(22,19,16,.25);color:var(--ink);background:transparent}
.btn-ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.text-link{
  display:inline-block;margin-top:1.6rem;font-size:.74rem;letter-spacing:.2em;
  text-transform:uppercase;text-decoration:none;color:var(--ink);font-weight:600;
  border-bottom:1px solid var(--gold);padding-bottom:.35rem;transition:color .3s;
}
.text-link:hover{color:var(--gold)}

/* ---------- hero ---------- */
.hero{position:relative;padding:11rem 0 6rem;overflow:hidden;background:var(--white)}
.blob{
  position:absolute;top:-14%;right:-10%;width:min(58vw,640px);height:min(58vw,640px);
  background:radial-gradient(circle at 40% 40%,rgba(166,139,91,.16),rgba(166,139,91,.04) 55%,transparent 72%);
  border-radius:42% 58% 61% 39%/44% 41% 59% 56%;
  animation:morph 16s ease-in-out infinite alternate;pointer-events:none;
}
.blob.b2{
  top:auto;right:auto;bottom:-22%;left:-12%;width:min(44vw,480px);height:min(44vw,480px);
  background:radial-gradient(circle at 60% 60%,rgba(166,139,91,.1),transparent 70%);
  animation-duration:21s;animation-delay:-8s;
}
@keyframes morph{
  0%{border-radius:42% 58% 61% 39%/44% 41% 59% 56%;transform:rotate(0deg) scale(1) translate(calc(var(--tilt-x,0)*26px),calc(var(--tilt-y,0)*20px))}
  50%{border-radius:60% 40% 38% 62%/52% 60% 40% 48%;transform:rotate(24deg) scale(1.07) translate(calc(var(--tilt-x,0)*26px),calc(var(--tilt-y,0)*20px))}
  100%{border-radius:38% 62% 55% 45%/58% 42% 58% 42%;transform:rotate(-14deg) scale(.96) translate(calc(var(--tilt-x,0)*26px),calc(var(--tilt-y,0)*20px))}
}
.hero-title{font-size:clamp(3.4rem,10vw,7.4rem);margin-bottom:1.6rem}
.hero-ctas{display:flex;gap:1rem;margin-top:2.6rem;flex-wrap:wrap}
.hero-ctas.center{justify-content:center}
.stats{display:flex;gap:clamp(2rem,6vw,4.5rem);margin-top:4.5rem;flex-wrap:wrap}
.stat{display:flex;flex-direction:column;gap:.3rem}
.stat-n{font-family:var(--serif);font-size:2.6rem;font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums}
.stat-l{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--stone)}
.scroll-hint{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  width:1px;height:56px;background:var(--line);overflow:hidden;
}
.scroll-hint span{
  display:block;width:100%;height:50%;background:var(--gold);
  animation:hint 2.2s var(--ease) infinite;
}
@keyframes hint{0%{transform:translateY(-110%)}100%{transform:translateY(220%)}}

/* ---------- bloom : emergence from the cocoon ---------- */
[data-bloom] .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
[data-bloom] .ws{white-space:pre}
[data-bloom] .wi{
  display:inline-block;transform:translateY(60%) scale(.86);opacity:0;filter:blur(10px);
  transition:transform 1.15s var(--bloom),opacity .9s ease,filter 1.15s var(--bloom);
}
[data-bloom].in .wi{transform:translateY(0) scale(1);opacity:1;filter:blur(0)}

/* ---------- unfold : wings opening ----------
   NOTE: the hidden state must keep layout area (opacity only).
   clip-path:inset(102%) in the resting state collapses the element to zero
   area, and IntersectionObserver never fires for zero-area targets — the
   reveal would never trigger. The clip-path lives in the keyframes instead. */
.unfold{opacity:0}
.unfold.in{opacity:1;animation:wingUnfold 1.25s var(--bloom) both}
@keyframes wingUnfold{
  from{clip-path:inset(-2% 0 102% 0);opacity:.25}
  to{clip-path:inset(-2% 0 -2% 0);opacity:1}
}

/* ---------- marquee ---------- */
.marquee{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;padding:1.3rem 0;background:var(--white);
}
.marquee-track{display:flex;gap:3rem;width:max-content;align-items:center;will-change:transform}
.marquee-track span{
  font-family:var(--serif);font-size:1.35rem;font-style:italic;color:var(--ink-soft);white-space:nowrap;
}
.marquee-track i{color:var(--gold);font-style:normal;font-size:.9rem}

/* ---------- sections ---------- */
.section{padding:clamp(5rem,9vw,8.5rem) 0;background:var(--white);position:relative}
.section.alt{background:var(--ivory)}
.split-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:3.5rem;flex-wrap:wrap}

/* ---------- offers ---------- */
.offer-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:1.4rem;margin-top:3.5rem;perspective:1200px;
}
.offer{
  background:var(--white);border:1px solid var(--line);border-radius:6px;
  padding:2.4rem 2.2rem;position:relative;overflow:hidden;
  transition:transform .55s var(--bloom),box-shadow .55s,border-color .55s;
  transform-style:preserve-3d;
}
.offer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--gold),transparent);
  transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease);
}
.offer:hover{transform:translateY(-10px) rotateX(2deg);box-shadow:0 34px 70px rgba(22,19,16,.12);border-color:rgba(166,139,91,.45)}
.offer:hover::before{transform:scaleX(1)}
.offer-no{font-family:var(--serif);font-size:.95rem;letter-spacing:.25em;color:var(--gold);margin-bottom:1.1rem}
.offer h3{font-size:1.9rem;margin-bottom:.3rem}
.offer-tag{font-family:var(--serif);font-style:italic;font-size:1.1rem;color:var(--ink-soft);margin-bottom:1rem}
.best-for{font-family:var(--serif);font-style:italic;font-size:.98rem;color:var(--ink-soft);margin:-.5rem 0 1.2rem}
.price-block{margin:0 0 1.3rem;padding:1.05rem 1.2rem;background:var(--ivory);border-radius:6px}
.price-block span{display:block;font-family:var(--serif);font-size:2rem;font-weight:600;letter-spacing:0}
.price-block em{display:block;font-style:normal;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-top:.4rem;line-height:1.6}
.revision{margin:1.15rem 0 1.3rem;font-size:.85rem;font-weight:600;color:var(--gold);letter-spacing:.02em}
.bundle-banner{
  margin-top:2.8rem;padding:2.6rem 2rem;text-align:center;
  background:var(--ink);color:var(--white);border-radius:10px;
}
.bundle-kicker{font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem}
/* flagship : the combined transformation product */
.flagship{
  margin-top:3rem;padding:clamp(2rem,5vw,3.4rem) clamp(1.4rem,4vw,3rem);
  background:var(--ink);color:var(--white);border-radius:12px;position:relative;overflow:hidden;
}
.flagship::before{
  content:"";position:absolute;top:-30%;right:-10%;width:60%;height:120%;
  background:radial-gradient(circle,var(--gold-soft) 0%,transparent 60%);
  pointer-events:none;
}
.flagship h3{font-family:var(--serif);font-size:clamp(1.8rem,5vw,2.6rem);margin-bottom:.6rem;position:relative;color:var(--white)}
.flagship-sub{color:rgba(255,255,255,.72);max-width:34rem;margin-bottom:1.6rem;position:relative}
.flagship .price-block{background:rgba(255,255,255,.06);position:relative}
.flagship .price-block span{color:#fff}
.flagship .price-block em{color:rgba(255,255,255,.6)}
.flagship .btn{position:relative;margin-top:.4rem}
/* priority : the anchor tier above the flagship */
.priority{
  margin-top:3rem;padding:clamp(2rem,5vw,3.4rem) clamp(1.4rem,4vw,3rem);
  background:linear-gradient(135deg,#141414 0%,#241d0e 100%);
  color:var(--white);border-radius:12px;position:relative;overflow:hidden;
  border:1px solid rgba(212,175,55,.45);
}
.priority h3{font-family:var(--serif);font-size:clamp(1.8rem,5vw,2.6rem);margin-bottom:.6rem;position:relative;color:var(--white)}
.priority .price-block{background:rgba(255,255,255,.06);position:relative}
.priority .price-block span{color:#fff}
.priority .price-block em{color:rgba(255,255,255,.6)}
.priority .btn{position:relative;margin-top:.4rem}
/* value stack */
.stack{list-style:none;margin:1.4rem 0 .6rem;padding:0;position:relative}
.stack li{display:flex;justify-content:space-between;align-items:baseline;gap:1.2rem;padding:.55rem 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:.92rem;color:rgba(255,255,255,.88)}
.stack em{font-style:normal;color:var(--gold);white-space:nowrap;font-size:.85rem;letter-spacing:.04em}
.stack-total{position:relative;color:rgba(255,255,255,.75);font-size:.95rem;margin:.4rem 0 1.2rem}
.stack-total s{color:var(--gold);text-decoration-thickness:2px;margin-left:.3rem}
.scarcity{position:relative;margin:1rem 0 0;font-size:.82rem;letter-spacing:.06em;color:rgba(255,255,255,.6)}
/* guarantee banner */
.guarantee{
  margin-top:2.2rem;padding:1.8rem 2rem;text-align:center;
  border:1px solid rgba(212,175,55,.5);border-radius:10px;background:#fffdf4;
}
.guarantee-title{font-family:var(--serif);font-size:1.35rem;margin-bottom:.5rem}
.guarantee-title::before{content:"♥ ";color:var(--gold)}
.guarantee p:last-child{margin:0;color:var(--ink-soft);font-size:.95rem;max-width:36rem;margin-left:auto;margin-right:auto}
/* ownership : the competitive strip */
.ownership{
  margin-top:1.4rem;padding:1.7rem 2rem 1.7rem 1.9rem;
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:0 10px 10px 0;
}
.ownership-title{font-family:var(--serif);font-size:1.3rem;margin-bottom:.5rem}
.ownership p:last-child{margin:0;color:var(--ink-soft);font-size:.93rem;max-width:42rem}
.ownership strong{color:var(--ink)}
.halves-kicker{
  text-align:center;margin:3.2rem 0 0;font-family:var(--serif);font-style:italic;
  font-size:1.25rem;color:var(--ink-soft);
}
.offer-grid.halves{grid-template-columns:repeat(auto-fit,minmax(290px,1fr));max-width:56rem;margin-left:auto;margin-right:auto}
/* entry strip : the one-pager */
.entry-strip{
  padding:1.6rem 1.8rem;display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap;
  border:1px solid var(--line);border-radius:10px;background:var(--ivory);
}
.entry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.4rem;margin-top:2.6rem}
.entry-copy{flex:1 1 220px}
.entry-copy h3{font-family:var(--serif);font-size:1.4rem;margin-bottom:.3rem}
.entry-copy p{font-size:.92rem;color:var(--ink-soft);margin:0}
.entry-price{margin:0;text-align:center}
.entry-price strong{display:block;font-family:var(--serif);font-size:1.6rem}
.entry-price em{font-style:normal;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.btn-gold{background:var(--gold);color:#fff;border-color:var(--gold)}
.btn-gold:hover{background:#937a4d;border-color:#937a4d}
.trust-line{text-align:center;margin-top:1.7rem;font-size:.72rem;letter-spacing:.1em;color:var(--stone);text-transform:uppercase;line-height:2}
.offer>p{font-size:.93rem;line-height:1.7;color:var(--ink-soft)}
.offer-get{
  margin-top:1.6rem;font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--ink);font-weight:600;
}
.offer ul{list-style:none;margin-top:.9rem}
.offer ul li{
  padding:.65rem 0;border-top:1px solid var(--line);
  font-size:.9rem;color:var(--ink-soft);display:flex;gap:.7rem;align-items:baseline;
}
.offer ul li::before{content:"✦";color:var(--gold);font-size:.7rem}

/* ---------- phases ---------- */
.phases{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:2.8rem;margin-top:3.5rem}
.phase{position:relative;padding-top:1.6rem}
.phase::before{content:"";position:absolute;top:0;left:0;width:44px;height:2px;background:var(--gold);transition:width .6s var(--bloom)}
.phase:hover::before{width:100%}
.phase-n{font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:.9rem}
.phase h3{font-size:1.6rem;margin-bottom:.7rem}
.phase p{font-size:.92rem;line-height:1.75;color:var(--ink-soft)}

/* ---------- work ---------- */
.work-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.6rem;margin-top:1rem}
.work-card{
  background:var(--white);border:1px solid var(--line);border-radius:6px;overflow:hidden;
  text-decoration:none;transition:transform .55s var(--bloom),box-shadow .55s;
}
.work-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px rgba(22,19,16,.12)}
.work-card .thumb{aspect-ratio:16/10;overflow:hidden;background:var(--ivory-dim)}
.work-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.work-card:hover .thumb img{transform:scale(1.07) rotate(.4deg)}
/* typographic tiles replace removed anime art for concept projects */
.thumb-type{
  display:flex;align-items:center;justify-content:center;position:relative;
  background:
    radial-gradient(circle at 78% 18%, var(--gold-soft) 0%, transparent 42%),
    linear-gradient(135deg, var(--ivory) 0%, var(--ivory-dim) 100%);
}
.thumb-type::after{
  content:"";position:absolute;left:12%;right:12%;bottom:22%;
  border-bottom:1px solid var(--gold);opacity:.55;
}
.thumb-initial{
  font-family:var(--serif);font-size:clamp(3.4rem,9vw,5rem);line-height:1;
  color:var(--ink);transform:translateY(-.35rem);
}
.work-card .meta{padding:1.8rem}
.work-card .meta .kicker{margin-bottom:.8rem}
.work-card h3{font-size:1.55rem;margin-bottom:.5rem}
.work-card p{font-size:.9rem;line-height:1.7;color:var(--ink-soft)}
.tag{
  display:inline-block;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;
  border:1px solid rgba(166,139,91,.45);color:var(--gold);border-radius:999px;
  padding:.35rem .95rem;margin-bottom:1rem;font-weight:600;
}

/* ---------- principles ---------- */
.principles{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2.8rem;margin-top:3.5rem}
.principle h3{font-size:1.65rem;margin-bottom:.8rem}
.principle p{font-size:.94rem;line-height:1.75;color:var(--ink-soft)}

/* ---------- faq ---------- */
.faq{margin-top:3rem;border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{
  width:100%;background:none;border:none;cursor:pointer;text-align:left;
  display:flex;justify-content:space-between;align-items:center;gap:1.5rem;
  padding:1.6rem .2rem;font-family:var(--serif);font-size:1.35rem;font-weight:500;color:var(--ink);
  transition:color .3s;
}
.faq-q:hover{color:var(--gold)}
.faq-icon{position:relative;flex:none;width:14px;height:14px}
.faq-icon::before,.faq-icon::after{
  content:"";position:absolute;background:var(--gold);transition:transform .45s var(--ease);
}
.faq-icon::before{left:0;top:6px;width:14px;height:2px}
.faq-icon::after{left:6px;top:0;width:2px;height:14px}
.faq-item.open .faq-icon::after{transform:rotate(90deg) scaleY(0)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .55s var(--ease)}
.faq-a p{padding:0 .2rem 1.8rem;font-size:.95rem;line-height:1.8;color:var(--ink-soft);max-width:44rem}

/* ---------- butterfly ---------- */
.fly{width:52px;height:40px;margin:0 auto 1.6rem;display:block}
.fly path,.fly line{fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round}
.fly .wing{transform-origin:24px 18px;animation:flapL 2.6s ease-in-out infinite}
.fly .wing.r{transform-origin:24px 18px;animation:flapR 2.6s ease-in-out infinite}
@keyframes flapL{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.55)}}
@keyframes flapR{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.55)}}

/* ---------- cta / footer ---------- */
.section.cta{background:var(--ivory)}
.foot{border-top:1px solid var(--line);background:var(--white)}
.foot-inner{
  display:flex;justify-content:space-between;align-items:center;gap:1.2rem;flex-wrap:wrap;
  padding-top:2.2rem;padding-bottom:2.2rem;
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--stone);
}
.foot nav{display:flex;gap:1.6rem}
.foot nav a{text-decoration:none;transition:color .3s}
.foot nav a:hover{color:var(--ink)}

/* ---------- inner pages ---------- */
.page-head{padding:11rem 0 4rem;background:var(--white)}
.page-head .rule{width:64px;height:2px;background:var(--gold);margin:0 0 2.2rem}
.page-head h1{font-size:clamp(2.8rem,6.5vw,5rem);margin-bottom:1.2rem}
.page-body{background:var(--white);padding:0 0 6rem}
.prose{max-width:46rem}
.prose p{line-height:1.85;color:var(--ink-soft);margin-bottom:1.4rem;font-size:1.02rem}
.prose h3{font-size:1.8rem;margin:2.8rem 0 1rem}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2.5rem;margin-top:3rem}
.step .n{font-family:var(--serif);font-size:2.4rem;color:var(--gold);margin-bottom:.7rem}
.step h4{font-family:var(--serif);font-size:1.35rem;font-weight:500;margin-bottom:.6rem}
.step p{font-size:.92rem;line-height:1.7;color:var(--ink-soft)}

/* ---------- form ---------- */
.cform{max-width:42rem;margin-top:1rem}
.field{margin-bottom:1.6rem}
.field label{
  display:block;font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--stone);margin-bottom:.6rem;font-weight:600;
}
.field input,.field select,.field textarea{
  width:100%;background:var(--white);border:1px solid rgba(22,19,16,.18);border-radius:4px;
  padding:1rem 1.1rem;font-family:var(--sans);font-size:.95rem;color:var(--ink);
  transition:border-color .3s,box-shadow .3s;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft);
}
.field textarea{min-height:150px;resize:vertical}
.form-note{margin-top:1.2rem;font-size:.85rem;color:var(--stone);line-height:1.7}

/* ---------- mobile-exclusive ---------- */
.touch-trail{
  position:fixed;top:0;left:0;width:100%;height:100%;z-index:250;pointer-events:none;
}
.btn{position:relative;overflow:hidden}
.ripple{
  position:absolute;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(166,139,91,.45) 0%,rgba(166,139,91,0) 70%);
  transform:scale(0);opacity:1;animation:rippleGo .65s ease-out forwards;
}
@keyframes rippleGo{to{transform:scale(3.2);opacity:0}}
.swipe-hint{
  display:none;text-align:center;margin-top:1.1rem;
  font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--stone);
  animation:hintPulse 1.8s ease-in-out infinite;transition:opacity .5s;
}
.swipe-hint.gone{opacity:0}
@keyframes hintPulse{0%,100%{opacity:.45}50%{opacity:1}}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .thread{display:none}
  .nav-links a:not(.btn){display:none}
  .stats{gap:1.6rem}
  .blob{width:90vw;height:90vw;top:-10%;right:-30%}
  /* swipe-snap offer carousel — mobile only */
  .offer-grid{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-left:calc(clamp(1.25rem,5vw,3rem) * -1);
    margin-right:calc(clamp(1.25rem,5vw,3rem) * -1);
    padding:0 clamp(1.25rem,5vw,3rem) 1.6rem;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .offer-grid::-webkit-scrollbar{display:none}
  .offer{flex:0 0 84%;scroll-snap-align:center}
  .swipe-hint{display:block}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
  [data-bloom] .wi{transform:none;opacity:1;filter:none}
  .unfold{clip-path:none;opacity:1}
  .loader{display:none}
}