/* Living by Your Own Rules — cskeating.com
   Palette comes from the cover: canyon, ember sky, river light. */

@font-face{font-family:"Barlow Condensed";font-weight:500;font-style:normal;font-display:swap;src:url(/assets/fonts/BarlowCondensed-Medium.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-style:normal;font-display:swap;src:url(/assets/fonts/BarlowCondensed-Bold.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:800;font-style:normal;font-display:swap;src:url(/assets/fonts/BarlowCondensed-ExtraBold.woff2) format("woff2")}
@font-face{font-family:"Newsreader";font-weight:400 600;font-style:normal;font-display:swap;src:url(/assets/fonts/Newsreader.woff2) format("woff2")}
@font-face{font-family:"Newsreader";font-weight:400 600;font-style:italic;font-display:swap;src:url(/assets/fonts/Newsreader-Italic.woff2) format("woff2")}

:root{
  --ink:#14100c;          /* canyon shadow */
  --umber:#241810;        /* wall, lit side */
  --rock:#4a2c1a;         /* wall, sun side */
  --gold:#e6a830;         /* river light */
  --gold-hi:#f4c76a;
  --gold-deep:#a8730f;    /* gold on pale stone, passes contrast */
  --bone:#f0e9da;         /* text on dark */
  --dust:#b3aa9a;         /* secondary text on dark */
  --stone:#dedacf;        /* limestone sections */
  --stone-ink:#1d1812;
  --stone-dust:#5a5346;
  --line-dark:rgba(240,233,218,.16);
  --line-stone:rgba(29,24,18,.2);
  --display:"Barlow Condensed","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --text:"Newsreader",Georgia,"Times New Roman",serif;
  --wrap:1040px;
  --gutter:clamp(20px,5vw,56px);
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{font-size:90%;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--bone);font:400 1.2rem/1.6 var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
p{margin:0 0 1.1em}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:.98;margin:0;letter-spacing:.005em}
:focus-visible{outline:3px solid var(--gold-hi);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:var(--ink);padding:.6em 1em;z-index:100;font-family:var(--display);font-weight:700}
.skip:focus{left:8px}

.wrap{width:100%;max-width:calc(var(--wrap) + var(--gutter)*2);margin:0 auto;padding:0 var(--gutter)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--display);font-weight:700;font-size:1.2rem;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;line-height:1;padding:1em 1.55em;border:2px solid var(--gold);border-radius:2px;background:var(--gold);color:var(--ink);cursor:pointer;transition:background .15s,color .15s,transform .15s}
.btn:hover{background:var(--gold-hi);border-color:var(--gold-hi)}
.btn:active{transform:translateY(1px)}
.btn--ghost{background:transparent;color:var(--bone);border-color:var(--line-dark)}
.btn--ghost:hover{background:transparent;border-color:var(--gold);color:var(--gold-hi)}
.btn--sm{font-size:1.05rem;padding:.8em 1.2em}
.btn[aria-disabled="true"]{opacity:.45;pointer-events:none}

/* ---------- top bar ---------- */
.bar{position:fixed;inset:0 0 auto 0;z-index:50;background:rgba(20,16,12,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line-dark)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.mark{font-family:var(--display);font-weight:700;font-size:1.25rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none}

/* ---------- hero ---------- */
.hero{position:relative;padding:calc(58px + clamp(28px,4.6vw,64px)) 0 clamp(44px,6vw,84px);overflow:hidden;
  background:
   radial-gradient(38% 46% at 76% 50%,rgba(230,168,48,.2),transparent 100%),
   var(--ink)}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,6vw,88px);align-items:center}
.hero h1{font-size:clamp(2.7rem,5.4vw,4.9rem);line-height:.95;max-width:12ch}
.hero__sub{font-size:clamp(1.1rem,1.7vw,1.3rem);line-height:1.5;color:var(--bone);max-width:34em;margin:1.2rem 0 0}
.hero__sub strong{font-weight:500;color:var(--gold-hi)}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.7rem}
.hero__meta{margin:1.4rem 0 0;color:var(--dust);font-size:1.02rem}
.hero__meta span+span::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--gold);margin:0 .7em .22em}

/* ---------- the cover (photo mockup; edges feathered into the page) ---------- */
.book{justify-self:center;width:min(100%,380px,calc((100svh - 190px)/1.5))}
.book-art{width:100%;height:auto;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent),linear-gradient(180deg,transparent,#000 2.5%,#000 97.5%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent),linear-gradient(180deg,transparent,#000 2.5%,#000 97.5%,transparent);
  mask-composite:intersect;
  filter:drop-shadow(0 0 70px rgba(230,150,40,.25))}

/* ---------- shared section scaffolding ---------- */
.sec{padding:clamp(48px,6.5vw,92px) 0}
.sec--stone{background:var(--stone);color:var(--stone-ink)}
.sec--umber{background:linear-gradient(180deg,var(--ink),var(--umber) 30%,var(--umber) 70%,var(--ink))}
.river{background:linear-gradient(180deg,var(--ink) 0,rgba(20,16,12,.55) 14%,rgba(20,16,12,.62) 34%,var(--ink) 58%),url(/assets/canyon.jpg) center top/cover no-repeat var(--ink)}
.sec h2{font-size:clamp(2.1rem,4vw,3.3rem);max-width:16ch}
.lede{font-size:clamp(1.2rem,2vw,1.4rem);line-height:1.55;max-width:34em}
.narrow{max-width:38rem}
.sec--stone .btn--ghost{color:var(--stone-ink);border-color:var(--line-stone)}

/* ---------- recognition ---------- */
.recog__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,6vw,96px);align-items:start}
.recog__big{font-family:var(--display);font-weight:700;font-size:clamp(1.8rem,3.4vw,2.7rem);line-height:1.04;margin:0}
.recog__list{list-style:none;margin:0 0 1.6rem;padding:0;border-top:1px solid var(--line-dark)}
.recog__list li{padding:1.05rem 0;border-bottom:1px solid var(--line-dark);font-size:1.28rem;line-height:1.4}

/* ---------- puddle / river ---------- */
.river h2{max-width:12ch}
.river__figure{margin:clamp(36px,5vw,64px) 0 0}
.river__svg{width:100%;height:auto}
.river__cap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);margin-top:1.4rem}
.river__cap h3{font-size:1.9rem;margin-bottom:.35rem;color:var(--gold-hi)}
.river__cap p{color:var(--bone);margin:0;max-width:26em}
.river__cap div:first-child h3{color:var(--dust)}
.river__cap div:first-child p{color:var(--dust)}
.river__after{margin-top:clamp(36px,5vw,64px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:start}
.pull{margin:0;padding-left:1.4rem;border-left:3px solid var(--gold)}
.pull p{font-size:1.5rem;line-height:1.35;margin:0 0 .6rem;font-style:italic}
.pull cite{font-style:normal;color:var(--dust);font-size:1rem}
.rv .s-a{opacity:0;transition:opacity 1.2s ease .2s}
.rv .s-b{stroke-dasharray:800;stroke-dashoffset:800;transition:stroke-dashoffset 2.2s cubic-bezier(.2,.7,.2,1) .35s}
.rv .s-c{opacity:0;transition:opacity 1.4s ease 1.6s}
.rv.in .s-a,.rv.in .s-c{opacity:1}
.rv.in .s-b{stroke-dashoffset:0}

/* ---------- Tuesday table ---------- */
.moves h2{max-width:16ch}
.moves__rows{list-style:none;margin:clamp(32px,5vw,56px) 0 0;padding:0;border-top:2px solid var(--stone-ink)}
.moves__rows li{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) 5.5rem;gap:8px 32px;align-items:baseline;padding:1.15rem 0;border-bottom:1px solid var(--line-stone)}
.moves__when{font-size:1.2rem;line-height:1.35}
.moves__do{font-family:var(--display);font-weight:700;font-size:1.45rem;line-height:1.05;color:var(--stone-ink)}
.moves__ch{font-size:1rem;color:var(--stone-dust);text-align:right}
.moves__note{margin-top:1.4rem;color:var(--stone-dust);font-size:1.02rem;max-width:40em}

/* ---------- how it works ---------- */
.how__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,56px);margin-top:clamp(32px,5vw,56px)}
.how__grid h3{font-size:2rem;margin-bottom:.6rem;color:var(--gold-hi)}
.how__grid p{color:var(--bone);margin:0}
.warn{margin-top:clamp(40px,6vw,72px);padding:clamp(24px,4vw,40px);border:1px solid var(--line-dark);border-left:4px solid var(--gold)}
.warn p{font-size:1.3rem;line-height:1.5;margin:0;max-width:40em}
.warn p+p{margin-top:.8em}

/* ---------- inside ---------- */
.inside__head{display:flex;flex-wrap:wrap;gap:24px 56px;align-items:end;justify-content:space-between}
.inside__cols{columns:2 340px;column-gap:clamp(32px,6vw,88px);margin-top:clamp(32px,5vw,56px)}
.grp{break-inside:avoid;margin:0 0 2rem}
.grp h3{font-size:1.8rem;padding-bottom:.45rem;margin-bottom:.35rem;border-bottom:2px solid var(--stone-ink)}
.grp ol{list-style:none;margin:0;padding:0}
.grp li{display:grid;grid-template-columns:2.4rem 1fr;align-items:baseline;padding:.42rem 0;border-bottom:1px solid var(--line-stone);font-size:1.12rem;line-height:1.35}
.grp li b{font-family:var(--display);font-weight:700;font-size:1.25rem;color:var(--gold-deep)}
.grp li.ap b{color:transparent}

/* ---------- endorsements (renders only when quotes exist) ---------- */
.quotes__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(28px,4vw,56px);margin-top:clamp(28px,4vw,48px)}
.quotes blockquote{margin:0;padding-top:1.1rem;border-top:3px solid var(--gold)}
.quotes blockquote p{font-size:1.35rem;line-height:1.4;font-style:italic;margin:0 0 .7rem}
.quotes cite{font-style:normal;color:var(--dust);font-size:1rem}

/* ---------- author ---------- */
.author__grid{display:block}
.author__grid.has-photo{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(28px,6vw,88px);align-items:center}
.author__photo{aspect-ratio:4/5;background:radial-gradient(70% 50% at 50% 100%,rgba(230,168,48,.5),transparent 70%),var(--umber);border:1px solid var(--line-dark);display:grid;place-items:center;overflow:hidden}
.author__photo img{width:100%;height:100%;object-fit:cover}
.author__mono{font-family:var(--display);font-weight:800;font-size:clamp(4rem,10vw,7rem);letter-spacing:.06em;color:var(--gold)}
.author h2{max-width:16ch;margin-bottom:1.1rem}
.author p{max-width:36em}
.author__lede{color:var(--bone)}
.proof{list-style:none;margin:2rem 0 2.2rem;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(16px,3vw,40px);border-top:1px solid var(--line-dark)}
.proof li{padding:1.1rem 0 .2rem}
.proof b{display:block;font-family:var(--display);font-weight:700;font-size:clamp(2rem,3.6vw,2.9rem);line-height:1;color:var(--gold-hi)}
.proof span{display:block;margin-top:.45rem;color:var(--dust);font-size:1rem;line-height:1.35;max-width:14em}

/* ---------- outcomes / cta bands / fit ---------- */
.outcomes__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.4vw,48px) clamp(24px,4vw,56px);margin-top:clamp(32px,5vw,56px)}
.outcome{border-top:3px solid var(--gold);padding-top:1.05rem}
.outcome h3{font-size:1.9rem;line-height:1;margin-bottom:.55rem}
.outcome p{margin:0;color:var(--bone)}
.outcome small{display:block;margin-top:.75rem;color:var(--dust);font-size:.98rem}
.outcomes__cta{margin:clamp(32px,4.5vw,56px) 0 0}
.sec--cta{background:var(--gold);color:var(--ink);padding:clamp(34px,4.6vw,56px) 0}
.cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 48px}
.cta h2{font-size:clamp(2rem,3.6vw,3rem);max-width:26ch}
.outcomes h2,.fit h2{max-width:24ch}
.cta p{margin:.9rem 0 0;max-width:34em;font-size:1.2rem;line-height:1.45}
.cta .btn{background:var(--ink);border-color:var(--ink);color:var(--gold-hi)}
.cta .btn:hover{background:#000;border-color:#000;color:#fff}
.fit__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,6vw,88px);margin-top:clamp(28px,4vw,48px)}
.fit h3{font-size:1.9rem;padding-bottom:.5rem;border-bottom:2px solid var(--stone-ink);margin-bottom:.4rem}
.fit ul{list-style:none;margin:0;padding:0}
.fit li{position:relative;padding:.75rem 0 .75rem 2rem;border-bottom:1px solid var(--line-stone);font-size:1.15rem;line-height:1.4}
.fit li::before{position:absolute;left:0;top:.62rem;font-family:var(--display);font-weight:800;font-size:1.5rem;line-height:1}
.fit__yes li::before{content:"+";color:var(--gold-deep)}
.fit__no li::before{content:"\2013";color:var(--stone-dust)}
.gets{list-style:none;margin:1.4rem 0 0;padding:0}
.gets li{position:relative;padding:.35rem 0 .35rem 1.6rem;line-height:1.4}
.gets li::before{content:"";position:absolute;left:0;top:.85rem;width:.7rem;height:.7rem;border-radius:50%;background:var(--gold)}

/* ---------- buy box ---------- */
.buy{background:linear-gradient(180deg,var(--ink) 0,rgba(20,16,12,.7) 25%,rgba(20,16,12,.55) 100%),url(/assets/canyon.jpg) center 70%/cover no-repeat var(--ink)}
.buy__grid{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(32px,6vw,88px);align-items:center}
.buy .book{width:min(100%,300px)}
.buy h2{max-width:14ch;margin-bottom:1rem}
.facts{list-style:none;margin:1.4rem 0 1.8rem;padding:0;border-top:1px solid var(--line-dark)}
.facts li{display:flex;justify-content:space-between;gap:20px;padding:.7rem 0;border-bottom:1px solid var(--line-dark)}
.facts li span:first-child{color:var(--dust)}
.facts li span:last-child{text-align:right}
.bonus{margin:0 0 1.8rem;padding:1.2rem 1.4rem;border:1px dashed var(--gold)}
.bonus h3{font-size:1.6rem;margin-bottom:.5rem;color:var(--gold-hi)}
.bonus ul{margin:0;padding-left:1.1em}
.bonus li{margin:.25em 0}
.buy__fine{margin:1rem 0 0;color:var(--dust);font-size:1rem}

/* ---------- faq ---------- */
.faq h2{max-width:10ch}
.faq__list{margin-top:clamp(28px,4vw,48px);border-top:2px solid var(--stone-ink);max-width:48rem}
.faq details{border-bottom:1px solid var(--line-stone)}
.faq summary{cursor:pointer;list-style:none;padding:1.15rem 2.2rem 1.15rem 0;font-family:var(--display);font-weight:700;font-size:1.65rem;line-height:1.1;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.3rem;top:50%;transform:translateY(-50%);font-size:2rem;font-weight:500;color:var(--gold-deep);transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq details p{margin:0 0 1.2rem;max-width:36em}

/* ---------- list signup ---------- */
.list{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.2rem;max-width:34rem}
.list input[type=email]{flex:1 1 15rem;min-width:0;font:inherit;font-size:1.15rem;padding:.9em 1em;background:rgba(240,233,218,.07);color:var(--bone);border:1.5px solid var(--line-dark);border-radius:2px}
.list input[type=email]::placeholder{color:var(--dust)}
.list input[type=email]:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px rgba(230,168,48,.3)}
.list .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.list__consent{flex:1 1 100%;margin:0;color:var(--dust);font-size:.95rem;line-height:1.45}
.list__msg{flex:1 1 100%;margin:0;min-height:1.5em;font-size:1.05rem}
.list__msg.ok{color:var(--gold-hi)}
.list__msg.err{color:#ffb4a0}

/* ---------- footer ---------- */
.foot{padding:40px 0 48px;border-top:1px solid var(--line-dark);color:var(--dust);font-size:.98rem}
.foot .wrap{display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:space-between}
.foot a{text-decoration:none;border-bottom:1px solid var(--line-dark)}
.foot a:hover{color:var(--gold-hi);border-color:var(--gold)}

/* ---------- mobile sticky buy ---------- */
.stick{position:fixed;left:0;right:0;bottom:0;z-index:45;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));background:rgba(20,16,12,.94);border-top:1px solid var(--line-dark);transform:translateY(110%);transition:transform .25s ease;display:none}
.stick.show{transform:none}
.stick .btn{width:100%}

/* ---------- order / thanks / privacy pages ---------- */
.page{padding:calc(58px + clamp(32px,5vw,64px)) 0 clamp(48px,6vw,88px);min-height:80vh;background:radial-gradient(55% 50% at 85% 20%,rgba(230,168,48,.16),transparent 70%),var(--ink)}
.order__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,6vw,88px);align-items:start}
.page h1{font-size:clamp(2.4rem,4.6vw,3.8rem);max-width:13ch;margin-bottom:1.2rem}
.panel{border:1px solid var(--line-dark);padding:clamp(22px,3vw,36px);background:rgba(240,233,218,.04)}
.panel h2{font-size:2rem;margin-bottom:.6rem}
.steps{margin:1.4rem 0 0;padding:0;list-style:none;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:2.2rem 1fr;gap:6px;padding:.7rem 0;border-top:1px solid var(--line-dark)}
.steps li::before{content:counter(s);font-family:var(--display);font-weight:800;font-size:1.4rem;color:var(--gold);line-height:1.2}
.prose{max-width:40rem}
.prose h2{font-size:2rem;margin:2.2rem 0 .6rem}
.prose ul{padding-left:1.2em}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .hero__grid,.recog__grid,.river__after,.author__grid,.buy__grid,.order__grid{grid-template-columns:1fr}
  .hero .book{width:min(78%,340px);margin-top:12px}
  .hero h1{max-width:14ch}
  .how__grid{grid-template-columns:1fr}
  .author__photo{max-width:320px}
  .buy .book{width:min(60%,260px)}
  .outcomes__grid,.fit__grid{grid-template-columns:1fr}
  .stick{display:block}
  .foot{padding-bottom:100px}
  .bar .btn{display:none}
}
@media (max-width:620px){
  body{font-size:1.125rem}
  .moves__rows li{grid-template-columns:1fr auto}
  .moves__when{grid-column:1/-1}
  .moves__ch{text-align:right;align-self:end}
  .river__cap{grid-template-columns:1fr}
  .proof{grid-template-columns:1fr 1fr}
  .btn{width:100%}
  .hero__cta .btn{width:100%}
  .list .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .rv .s-a,.rv .s-c{opacity:1}
  .rv .s-b{stroke-dashoffset:0}
}
@media print{.bar,.stick{display:none}body{background:#fff;color:#000}}