/* ============================================================
   COMMISSIONED — site stylesheet
   Tokens locked to the Commissioned Brand Kit §5.
   Edit here once; every page picks it up.
   ============================================================ */
:root{
  --vespers:#0B1C3B;      /* navy — dominant ground */
  --basalt:#0A0A0C;       /* ink black — deepest ground */
  --gold:#C6972F;         /* reliquary gold — gilding only */
  --gold-lit:#E0B85A;     /* tint of gold, lit/hover state */
  --vellum:#F4EEE2;       /* parchment — paper ground */
  --stone:#3A3F47;        /* secondary text on light */
  --crimson:#7A1F2B;      /* rare accent */

  --ink-on-dark:#DCD6C8;
  --mute-on-dark:#8C93A4;

  --display:'Cinzel',Georgia,serif;
  --editorial:'Cormorant Garamond',Georgia,serif;
  --body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  --wrap:1160px;
  --gutter:clamp(20px,5vw,64px);
  --bay:clamp(96px,13vh,180px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--vespers);color:var(--ink-on-dark);
  font-family:var(--body);font-weight:300;font-size:clamp(16px,1.05vw,17.5px);
  line-height:1.72;letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg{max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold-lit);outline-offset:3px}

/* skip link — accessibility */
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--gold);
  color:var(--basalt);padding:.9rem 1.4rem;font-size:.75rem;letter-spacing:.16em;
  text-transform:uppercase;text-decoration:none}
.skip:focus{left:var(--gutter);top:.6rem}

/* aged-vellum grain (Brand Kit §5 texture) */
.grain{
  position:fixed;inset:-50%;z-index:9999;pointer-events:none;
  opacity:.055;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- type ---------- */
.eyebrow{
  font-family:var(--body);font-size:.68rem;font-weight:500;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold);
  margin:0 0 1.4rem;
}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;letter-spacing:.02em;line-height:1.12;margin:0}
h1{font-size:clamp(2.3rem,6.2vw,4.6rem);letter-spacing:.005em}
h2{font-size:clamp(1.85rem,3.7vw,3rem)}
h3{font-size:clamp(1.05rem,1.5vw,1.32rem);letter-spacing:.09em;text-transform:uppercase}
h4{font-size:1.02rem;letter-spacing:.06em}
p{margin:0 0 1.25em;max-width:62ch}
strong,b{font-weight:500}
em{font-style:italic}

.cadence{
  font-family:var(--editorial);font-style:italic;font-weight:300;
  font-size:clamp(1.45rem,2.7vw,2.15rem);line-height:1.4;
  color:var(--gold);max-width:24ch;margin:2.4rem 0 0;
}
.scripture{
  font-family:var(--editorial);font-weight:300;font-size:clamp(1.15rem,1.9vw,1.55rem);
  line-height:1.55;font-style:italic;max-width:36ch;margin:0;
}
.scripture cite{display:block;font-style:normal;font-family:var(--body);
  font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;
  margin-top:1.1rem;opacity:.7}
.lede{font-size:clamp(1.05rem,1.5vw,1.22rem);line-height:1.68}

/* ---------- layout ---------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap--narrow{max-width:760px}
.s{padding-block:var(--bay);position:relative}
.s--navy{background:var(--vespers)}
.s--basalt{background:var(--basalt)}
.s--vellum{background:var(--vellum);color:var(--stone)}
.s--vellum h1,.s--vellum h2,.s--vellum h3,.s--vellum h4{color:var(--vespers)}
.s--vellum .eyebrow{color:#8A6A20}
.s--vellum .cadence,.s--vellum .scripture{color:var(--vespers)}
.s--tight{padding-block:clamp(64px,9vh,110px)}

.rule{display:block;width:100%;height:1px;border:0;margin:0 0 3.2rem;
  background:linear-gradient(90deg,var(--gold),rgba(198,151,47,0));
  transform-origin:left center}

.two{display:grid;grid-template-columns:1fr;gap:clamp(2rem,5vw,4.5rem)}
@media(min-width:900px){.two{grid-template-columns:1fr 1fr;align-items:start}
  .two--wide{grid-template-columns:1.15fr .85fr}}

/* ---------- header ---------- */
.hdr{
  position:fixed;inset:0 0 auto;z-index:100;
  display:flex;align-items:center;gap:2rem;
  padding:.9rem var(--gutter);
  background:rgba(10,10,12,0);
  border-bottom:1px solid rgba(198,151,47,0);
  transition:background .45s ease,border-color .45s ease,backdrop-filter .45s ease;
}
.hdr.is-stuck{background:rgba(10,10,12,.9);backdrop-filter:blur(14px);
  border-bottom-color:rgba(198,151,47,.24)}
.hdr__mark{flex:0 0 auto;line-height:0}
.hdr__mark svg{height:34px;width:auto;display:block}
.hdr__nav{margin-left:auto;display:flex;align-items:center;gap:2rem}
.hdr__nav a{
  font-size:.72rem;letter-spacing:.19em;text-transform:uppercase;
  text-decoration:none;color:var(--ink-on-dark);opacity:.72;
  transition:opacity .3s,color .3s}
.hdr__nav a:hover,.hdr__nav a[aria-current="page"]{opacity:1;color:var(--gold-lit)}
@media(max-width:900px){.hdr__nav a:not(.btn){display:none}}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.7rem;
  font-family:var(--body);font-size:.72rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;text-decoration:none;
  padding:1rem 1.7rem;border:1px solid var(--gold);color:var(--gold);
  background:transparent;cursor:pointer;position:relative;overflow:hidden;z-index:0;
  transition:color .4s ease,border-color .4s ease;
}
.btn::after{content:"";position:absolute;inset:0;background:var(--gold);
  transform:scaleX(0);transform-origin:right center;
  transition:transform .5s cubic-bezier(.7,0,.2,1);z-index:0}
.btn span{position:relative;z-index:1}
.btn:hover{color:var(--basalt)}
.btn:hover::after{transform:scaleX(1);transform-origin:left center}
.btn--solid{background:var(--gold);color:var(--basalt);border-color:var(--gold)}
.btn--solid:hover{color:var(--basalt);filter:brightness(1.12)}
.btn--quiet{border-color:rgba(220,214,200,.3);color:var(--ink-on-dark)}
.btn--quiet::after{background:var(--ink-on-dark)}
.hdr .btn{padding:.72rem 1.25rem;opacity:1}
.cta-row{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.8rem}

/* ---------- hero ---------- */
.hero{
  min-height:100svh;display:flex;align-items:center;
  background:var(--basalt);position:relative;overflow:hidden;
  padding-block:clamp(120px,16vh,180px) var(--bay);
}
.hero::before{
  content:"";position:absolute;left:50%;top:-30%;width:120vw;height:110vh;
  transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(ellipse 50% 45% at 50% 50%,rgba(198,151,47,.13),transparent 68%);
}
.hero__grid{display:grid;grid-template-columns:1fr;gap:clamp(2.5rem,5vw,4.5rem);
  align-items:center;position:relative}
@media(min-width:960px){.hero__grid{grid-template-columns:1.35fr .65fr}}
.hero__crest{justify-self:center;width:min(300px,58vw)}
.hero__crest svg{width:100%;height:auto;display:block;
  filter:drop-shadow(0 0 44px rgba(198,151,47,.2))}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln i{display:block;font-style:normal}
.hero__sub{font-size:clamp(1.06rem,1.7vw,1.35rem);line-height:1.62;max-width:46ch;
  color:var(--ink-on-dark);margin:2rem 0 0}
.hero__note{margin:1.9rem 0 0;font-size:.74rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mute-on-dark);max-width:none}
.hero__note b{color:var(--gold);font-weight:500}

/* page header (interior pages) */
.phead{background:var(--basalt);padding:clamp(140px,20vh,220px) 0 clamp(60px,8vh,96px);
  position:relative;overflow:hidden}
.phead::before{content:"";position:absolute;left:50%;top:-40%;width:120vw;height:100vh;
  transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(ellipse 50% 45% at 50% 50%,rgba(198,151,47,.1),transparent 68%)}
.phead .wrap{position:relative}
.phead p.lede{margin-top:1.8rem;color:var(--ink-on-dark)}

/* ---------- pain list ---------- */
.pains{list-style:none;padding:0;margin:2.5rem 0 0;max-width:44ch}
.pains li{
  font-family:var(--editorial);font-size:clamp(1.25rem,2.2vw,1.72rem);
  font-style:italic;font-weight:300;line-height:1.4;
  padding:1.15rem 0 1.15rem 2.2rem;border-bottom:1px solid rgba(198,151,47,.17);
  position:relative;color:#E6E1D5;
}
.pains li::before{content:"";position:absolute;left:0;top:1.85rem;
  width:12px;height:1px;background:var(--gold)}
.pains li:first-child{border-top:1px solid rgba(198,151,47,.17)}

/* ---------- panel ---------- */
.panel{border:1px solid rgba(11,28,59,.18);padding:clamp(1.8rem,4vw,3rem);
  position:relative;background:rgba(255,255,255,.28)}
.panel--dark{border-color:rgba(198,151,47,.3);background:rgba(198,151,47,.05)}
.panel::before,.panel::after{content:"";position:absolute;width:14px;height:14px;
  border:1px solid var(--gold)}
.panel::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.panel::after{bottom:-1px;right:-1px;border-left:0;border-top:0}

/* ============================================================
   SIGNATURE — the SPEED ascending path
   ============================================================ */
.stations{position:relative;margin-top:clamp(3rem,7vw,5.5rem)}
.rail{position:absolute;inset:0;width:100%;height:100%;overflow:visible;
  pointer-events:none;z-index:0}
.rail path{fill:none;stroke:var(--gold);stroke-width:1.25;stroke-linecap:round;
  stroke-linejoin:round;opacity:.55;vector-effect:non-scaling-stroke}
.stations__row{display:grid;grid-template-columns:1fr;gap:2.6rem;position:relative;z-index:1}
@media(min-width:1000px){
  .stations__row{grid-template-columns:repeat(5,1fr);gap:1.5rem;align-items:start}
  .st:nth-child(1){margin-top:132px}
  .st:nth-child(2){margin-top:99px}
  .st:nth-child(3){margin-top:66px}
  .st:nth-child(4){margin-top:33px}
  .st:nth-child(5){margin-top:0}
}
.st{position:relative}
.st__med{width:74px;height:74px;display:block;margin:0 0 1.5rem}
.st__med svg{width:100%;height:auto;display:block;
  opacity:.34;transition:opacity .8s ease,filter .8s ease}
.st.is-lit .st__med svg{opacity:1;filter:drop-shadow(0 0 16px rgba(198,151,47,.45))}
.st__num{font-family:var(--display);font-size:.78rem;letter-spacing:.32em;
  color:var(--gold);display:block;margin-bottom:.7rem}
.st h3{color:#EFEAE0;margin-bottom:.5rem;font-size:.95rem;letter-spacing:.1em}
.st__sub{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold);margin:0 0 1rem}
.st p{font-size:.94rem;line-height:1.62;color:var(--mute-on-dark);margin:0 0 1.2rem;max-width:34ch}
.st__ref{font-family:var(--editorial);font-style:italic;font-size:1rem;
  color:#CFC7B6;border-left:1px solid rgba(198,151,47,.4);padding-left:.9rem;
  display:block;line-height:1.45}
.st__ref b{display:block;font-family:var(--body);font-style:normal;font-weight:400;
  font-size:.63rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);margin-top:.55rem}
@media(max-width:999px){
  .st{padding-left:3.4rem}
  .st__med{position:absolute;left:0;top:0;width:44px;height:44px;margin:0}
}

/* expanded station blocks (method page) */
.station-long{border-top:1px solid rgba(198,151,47,.22);padding:clamp(2.2rem,5vw,3.4rem) 0}
.station-long:last-of-type{border-bottom:1px solid rgba(198,151,47,.22)}
.station-long__head{display:flex;align-items:center;gap:1.4rem;margin-bottom:1.6rem}
.station-long__head svg{width:56px;height:auto;flex:0 0 auto}
.station-long__head .st__num{margin:0 0 .3rem}
.station-long h2{font-size:clamp(1.5rem,2.6vw,2.1rem)}

/* ---------- track record ---------- */
.track{list-style:none;padding:0;margin:2.4rem 0 0;border-top:1px solid rgba(11,28,59,.16)}
.track li{display:grid;grid-template-columns:1fr;gap:.2rem;
  padding:1.35rem 0;border-bottom:1px solid rgba(11,28,59,.16)}
@media(min-width:700px){.track li{grid-template-columns:15rem 1fr;gap:2rem;align-items:baseline}}
.track b{font-family:var(--display);font-weight:400;font-size:1rem;
  letter-spacing:.06em;color:var(--vespers)}
.track span{font-size:.95rem;line-height:1.6;color:var(--stone)}
.pullnote{margin-top:1.9rem;font-size:1rem;
  border-left:1px solid rgba(198,151,47,.55);padding-left:1.2rem;color:var(--vespers)}

/* honest empty states */
.empty{margin-top:3rem;border:1px dashed rgba(11,28,59,.34);
  padding:clamp(1.6rem,3.5vw,2.4rem);background:rgba(255,255,255,.22)}
.empty h3{font-size:.82rem;letter-spacing:.22em;color:var(--vespers);margin-bottom:.9rem}
.empty p{margin:0;font-size:.98rem;color:var(--stone)}
.empty--dark{border-color:rgba(198,151,47,.34);background:rgba(198,151,47,.04)}
.empty--dark h3{color:var(--gold)}
.empty--dark p{color:var(--mute-on-dark)}

/* ---------- fit lists ---------- */
.fit{list-style:none;padding:0;margin:1.8rem 0 0}
.fit li{padding:.85rem 0 .85rem 2rem;position:relative;font-size:1rem;line-height:1.6;
  border-bottom:1px solid rgba(220,214,200,.12)}
.fit li::before{position:absolute;left:0;top:.85rem;font-family:var(--display);font-size:.9rem}
.fit--yes li::before{content:"\271D";color:var(--gold)}
.fit--no li::before{content:"\2014";color:var(--crimson)}
.fit--no li{color:var(--mute-on-dark)}

/* ---------- offer ---------- */
.offer{border:1px solid rgba(198,151,47,.45);padding:clamp(1.9rem,5vw,4rem);
  background:linear-gradient(170deg,rgba(198,151,47,.08),rgba(198,151,47,0) 62%)}
.offer h2{margin-bottom:1.6rem}
.incl{list-style:none;padding:0;margin:2rem 0 0}
.incl li{padding:1rem 0 1rem 2.1rem;position:relative;
  border-bottom:1px solid rgba(198,151,47,.18);font-size:1rem;line-height:1.6}
.incl li::before{content:"";position:absolute;left:0;top:1.62rem;width:11px;height:1px;background:var(--gold)}
.incl li b{font-weight:500;color:#EFEAE0}
.terms{margin-top:2.4rem;font-size:.92rem;color:var(--mute-on-dark);max-width:52ch}
.terms strong{color:var(--gold);font-weight:500}

/* ---------- GoHighLevel form embed ---------- */
.embed{border:1px solid rgba(11,28,59,.18);background:#fff;position:relative;
  padding:clamp(.5rem,1.5vw,1rem);margin-top:2.6rem}
.embed::before,.embed::after{content:"";position:absolute;width:14px;height:14px;
  border:1px solid var(--gold)}
.embed::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.embed::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.embed iframe{width:100%;min-height:760px;height:760px;border:0;display:block;background:#fff}
.formnote{font-size:.86rem;color:var(--stone);margin-top:1.4rem;max-width:54ch}
.formnote a{color:var(--vespers)}
.s--navy .formnote,.s--basalt .formnote{color:var(--mute-on-dark)}
.s--navy .formnote a,.s--basalt .formnote a{color:var(--gold)}

/* ---------- article typography ---------- */
.article{max-width:70ch}
.article p{font-size:1.06rem;line-height:1.78;margin-bottom:1.5em;max-width:none}
.article h2{font-size:clamp(1.5rem,2.8vw,2.1rem);margin:3rem 0 1.2rem}
.article h3{font-size:1rem;letter-spacing:.12em;margin:2.4rem 0 1rem;color:var(--gold)}
.s--vellum .article h3{color:#8A6A20}
.article blockquote{margin:2.4rem 0;padding-left:1.6rem;
  border-left:1px solid rgba(198,151,47,.6)}
.article blockquote p{font-family:var(--editorial);font-style:italic;font-weight:300;
  font-size:clamp(1.15rem,1.9vw,1.45rem);line-height:1.5;margin-bottom:.6em}
.article blockquote cite{font-style:normal;font-family:var(--body);font-size:.68rem;
  letter-spacing:.24em;text-transform:uppercase;opacity:.72}
.article ul,.article ol{margin:0 0 1.6em;padding-left:1.3rem}
.article li{margin-bottom:.7em;line-height:1.72}
.article a{color:var(--vespers);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:rgba(198,151,47,.7)}
.article a:hover{text-decoration-color:var(--gold)}
.meta{font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--mute-on-dark);margin:1.6rem 0 0}

/* ---------- journal index cards ---------- */
.cards{display:grid;grid-template-columns:1fr;gap:1px;background:rgba(198,151,47,.22);
  border:1px solid rgba(198,151,47,.22);margin-top:3rem}
.card{background:var(--vespers);padding:clamp(1.6rem,3.5vw,2.6rem);
  text-decoration:none;display:block;transition:background .4s ease}
.card:hover{background:#0d2246}
.card h2{font-size:clamp(1.2rem,2vw,1.55rem);color:#EFEAE0;margin-bottom:.9rem}
.card p{font-size:.98rem;color:var(--mute-on-dark);margin:0}
.card .meta{margin-top:1.2rem}

/* ---------- close ---------- */
.close{text-align:center}
.close .cadence{margin-inline:auto;max-width:26ch;text-align:center}
.close p{margin-inline:auto}
.close .cta-row{justify-content:center}
.close__crest{width:88px;margin:0 auto 2.5rem}
.close__crest svg{width:100%;height:auto;opacity:.85}

/* ---------- footer ---------- */
.ftr{background:var(--basalt);padding:3.4rem 0 3rem;
  border-top:1px solid rgba(198,151,47,.18)}
.ftr__in{display:flex;flex-wrap:wrap;gap:1.6rem 2.4rem;
  align-items:flex-start;justify-content:space-between}
.ftr small{font-size:.74rem;letter-spacing:.05em;color:var(--mute-on-dark);line-height:1.7;display:block}
.ftr nav{display:flex;gap:1.6rem;flex-wrap:wrap}
.ftr nav a{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  text-decoration:none;color:var(--mute-on-dark);transition:color .3s}
.ftr nav a:hover{color:var(--gold-lit)}

/* ============================================================
   MOTION — applied only once JS confirms the libraries loaded
   ============================================================ */
.anim-ready .rv{opacity:0;transform:translateY(26px)}
.anim-ready .hero h1 .ln i{transform:translateY(105%)}
.anim-ready .rule{transform:scaleX(0)}
.anim-ready .hero__crest svg [stroke]{stroke-dasharray:var(--len);stroke-dashoffset:var(--len)}
/* the form embed must never be hidden by a reveal */
.embed,.embed *{opacity:1!important;transform:none!important}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .anim-ready .rv,.anim-ready .hero h1 .ln i,.anim-ready .rule{opacity:1!important;transform:none!important}
  .anim-ready .hero__crest svg [stroke]{stroke-dashoffset:0!important}
  .st .st__med svg{opacity:1}
}
