/* ==========================================================================
   THE SHIFT ADVISORY — The Founder Series, Fall 2026
   Shared stylesheet for all three pages.

   PALETTE
     #041C2E  navy .......... primary ground
     #121111  ink ........... deepest ground, instead of black
     #41111b  wine .......... secondary accent, feature sections
     #08561E  green ......... tertiary accent, used as a hint
     #ffffff  white ......... type

   Blush and the lighter green are tints of the wine and green above,
   needed because both brand colors are too dark to read as type on navy.
   ========================================================================== */

:root{
  --navy:#041C2E;
  --navy-lift:#0A2839;
  --ink:#121111;
  --wine:#41111b;
  --wine-lift:#5A1826;
  --green:#08561E;
  --green-lt:#2F9257;
  --blush:#D9A5AC;
  --white:#fff;
  --w88:rgba(255,255,255,.88);
  --w72:rgba(255,255,255,.72);
  --w55:rgba(255,255,255,.55);
  --w40:rgba(255,255,255,.4);
  --line:rgba(255,255,255,.13);
  --line-2:rgba(255,255,255,.22);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--navy);color:var(--white);
  font-family:var(--sans);font-size:17px;line-height:1.75;font-weight:350;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,h4,p,ul,li,figure,table{margin:0;padding:0}
ul{list-style:none}

/* ---------- LAYOUT ------------------------------------------------------- */
.wrap{max-width:1130px;margin:0 auto;padding:0 26px;width:100%}
.narrow{max-width:710px;margin-left:auto;margin-right:auto}
.sec{padding:96px 0}
.g-navy{background:var(--navy)}
.g-lift{background:var(--navy-lift)}
.g-ink{background:var(--ink)}
.g-wine{background:var(--wine)}
.center{text-align:center}

/* ---------- TYPE --------------------------------------------------------- */
h1,h2,.display{font-family:var(--serif);font-weight:400;letter-spacing:-.008em}
h1{font-size:clamp(3rem,7.4vw,5.4rem);line-height:1.02;margin:0 0 .1em}
h2{font-size:clamp(2.1rem,4.2vw,3.1rem);line-height:1.13;margin:0 0 .42em}
h3{font-family:var(--sans);font-size:1.16rem;font-weight:600;line-height:1.35;letter-spacing:-.005em;margin:0 0 .45em}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
.eyebrow{
  font-family:var(--sans);color:var(--blush);font-size:.7rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;line-height:1.6;margin:0 0 20px;
}
.lede{font-size:1.08rem;color:var(--w72);font-weight:350}
.rule{width:52px;height:1px;background:var(--blush);border:0;margin:0 0 28px}
.center .rule{margin-left:auto;margin-right:auto}

/* ---------- BUTTONS ------------------------------------------------------ */
.btn{
  display:inline-block;background:var(--white);color:var(--navy);
  font-family:var(--sans);font-weight:600;font-size:1rem;letter-spacing:.01em;line-height:1;
  padding:20px 46px;border-radius:2px;text-align:center;
  transition:background .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.btn:hover{background:var(--blush);color:var(--wine);transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.35)}
.btn-lg{font-size:1.06rem;padding:23px 58px}
.btn-line{
  background:transparent;color:var(--white);border:1px solid var(--line-2);
  font-weight:500;padding:13px 30px;font-size:.88rem;
}
.btn-line:hover{background:var(--white);color:var(--navy);border-color:var(--white);transform:none;box-shadow:none}

/* ---------- NAV ---------------------------------------------------------- */
.nav{background:var(--ink);position:sticky;top:0;z-index:60;border-bottom:1px solid rgba(255,255,255,.07)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:17px;padding-bottom:17px;gap:18px}
.brand{font-family:var(--serif);font-size:1.16rem;letter-spacing:.03em;line-height:1.3;white-space:nowrap}
.brand b{font-weight:600}
.brand i{font-style:normal;color:var(--blush)}
.nav .btn{padding:13px 28px;font-size:.84rem}

/* ---------- HERO --------------------------------------------------------- */
.hero{
  background:
    radial-gradient(1100px 520px at 50% -8%,rgba(65,17,27,.55),transparent 70%),
    var(--navy);
  padding:104px 0 96px;text-align:center;
}
.kicker{
  font-family:var(--sans);color:var(--blush);font-size:.69rem;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;line-height:1.9;margin:0 0 30px;
}
.tagline{
  font-family:var(--serif);font-size:clamp(1.5rem,3.1vw,2.25rem);
  font-weight:300;font-style:italic;color:var(--blush);
  letter-spacing:.01em;line-height:1.3;margin:0 0 32px;
}
.hero .sub{max-width:640px;margin:0 auto 38px;color:var(--w72);font-size:1.08rem}
.badges{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 auto 42px;max-width:800px}
.badge{
  border:1px solid var(--line-2);color:var(--w88);border-radius:2px;
  padding:10px 20px;font-size:.81rem;font-weight:450;line-height:1.4;
}
.badge.hl{border-color:var(--blush);color:var(--blush)}
.subnote{font-size:.83rem;color:var(--w55);margin:22px auto 0;max-width:560px}

/* ---------- STRIP -------------------------------------------------------- */
.strip{background:var(--wine);padding:19px 0;text-align:center;font-size:.95rem;line-height:1.6}
.strip .wrap{display:flex;gap:6px 22px;justify-content:center;flex-wrap:wrap;align-items:baseline}
.strip b{font-weight:600;color:var(--white)}
.strip i{font-style:normal;color:rgba(255,255,255,.68)}

/* ---------- CARDS -------------------------------------------------------- */
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(282px,1fr));gap:22px;margin-top:54px}
.card{
  background:rgba(255,255,255,.035);border:1px solid var(--line);
  border-top:2px solid var(--blush);border-radius:2px;padding:36px 32px;
}
.card p{color:var(--w72);font-size:.95rem}
.card .num{
  font-family:var(--serif);color:var(--blush);font-size:1.5rem;
  display:block;margin-bottom:14px;line-height:1;
}

/* ---------- FEATURES ----------------------------------------------------- */
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(262px,1fr));gap:40px;margin-top:54px}
.feat p{color:var(--w72);font-size:.94rem}
.feat .bar{width:30px;height:1px;background:var(--blush);margin-bottom:20px}

/* ---------- SESSIONS ----------------------------------------------------- */
.session{
  background:rgba(255,255,255,.035);border:1px solid var(--line);
  border-left:2px solid var(--blush);border-radius:2px;
  padding:36px 38px;margin-bottom:16px;
}
.session:last-child{margin-bottom:0}
.smeta{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:baseline;margin-bottom:16px}
.snum{font-family:var(--serif);color:var(--blush);font-size:1.15rem;line-height:1.3}
.sdate{font-size:.74rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--w55);line-height:1.5}
.session h3{font-family:var(--serif);font-weight:400;font-size:1.72rem;line-height:1.2;letter-spacing:-.01em;margin-bottom:.3em}
.led{color:var(--blush);font-size:.82rem;letter-spacing:.03em;margin:0 0 16px}
.session p{color:var(--w72);font-size:.96rem}
.leave{
  margin:20px 0 0;padding:16px 20px;background:rgba(8,86,30,.22);
  border-left:2px solid var(--green-lt);border-radius:2px;
  font-size:.92rem;color:var(--w88);
}
.leave b{color:var(--white);font-weight:600}

/* ---------- GRADUATION --------------------------------------------------- */
.grad{
  border:1px solid var(--line-2);border-radius:2px;
  background:linear-gradient(180deg,rgba(65,17,27,.5),rgba(4,28,46,0));
  padding:44px 42px;margin-top:16px;text-align:center;
}
.grad .snum{display:block;margin-bottom:10px}
.grad h3{font-family:var(--serif);font-weight:400;font-size:1.9rem;line-height:1.2;margin-bottom:.3em}
.grad p{color:var(--w72);font-size:.98rem;max-width:560px;margin-left:auto;margin-right:auto}
.grad .when{
  display:inline-block;margin-top:20px;border:1px solid var(--blush);color:var(--blush);
  border-radius:2px;padding:10px 22px;font-size:.83rem;font-weight:500;
}

/* ---------- ADVISORS ----------------------------------------------------- */
.adv{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:2px;padding:36px 32px}
.adv h3{font-family:var(--serif);font-weight:400;font-size:1.6rem;line-height:1.2;margin-bottom:.14em}
.adv .role{color:var(--blush);font-size:.82rem;font-weight:500;margin:0 0 16px;line-height:1.5}
.adv .focus{font-size:.75rem;color:var(--w55);letter-spacing:.05em;line-height:1.7;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.adv .bio{font-size:.93rem;color:var(--w72)}

/* ---------- PRICING ------------------------------------------------------ */
.price-card{
  max-width:640px;margin:52px auto 0;border:1px solid var(--blush);border-radius:2px;
  background:rgba(255,255,255,.04);padding:0;overflow:hidden;
}
.price-head{background:var(--wine);padding:26px 34px;text-align:center}
.price-head .t{font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--blush);line-height:1.6}
.price-head .n{font-family:var(--serif);font-size:3.4rem;line-height:1.05;margin-top:8px;font-weight:400}
.price-head .n span{font-size:1.1rem;vertical-align:super;margin-right:2px}
.price-body{padding:32px 34px}
.price-body li{position:relative;padding:0 0 14px 30px;font-size:.96rem;color:var(--w88)}
.price-body li:last-child{padding-bottom:0}
.price-body li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:2px;background:var(--green-lt)}
.pnote{margin-top:26px;font-size:.85rem;color:var(--w55);text-align:center}
.callout{
  border:1px solid var(--line-2);border-left:2px solid var(--blush);
  border-radius:2px;padding:28px 32px;margin-top:24px;
}
.callout h3{margin-bottom:.4em}
.callout p{color:var(--w72);font-size:.94rem}

/* ---------- FORM --------------------------------------------------------- */
.vip{
  max-width:730px;margin:0 auto;border:1px solid var(--line-2);
  border-left:2px solid var(--green-lt);border-radius:2px;
  padding:24px 28px;background:rgba(8,86,30,.16);
}
.vip h3{font-size:.98rem;margin-bottom:.35em}
.vip p{font-size:.92rem;color:var(--w72)}
.formcard{
  background:var(--white);border-radius:3px;padding:14px;max-width:730px;
  margin:30px auto 0;box-shadow:0 26px 64px rgba(0,0,0,.45);
}
.formcard iframe{display:block;width:100%;border:0;border-radius:2px;min-height:1155px}
.privacy{font-size:.76rem;color:var(--w40);max-width:540px;margin:26px auto 0;text-align:center;line-height:1.7}

/* ---------- FAQ ---------------------------------------------------------- */
.faq{max-width:840px;margin:52px auto 0}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:24px 48px 24px 0;position:relative;
  font-weight:500;font-size:1.04rem;line-height:1.5;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:10px;top:50%;width:11px;height:11px;
  margin-top:-7px;border-right:1px solid var(--blush);border-bottom:1px solid var(--blush);
  transform:rotate(45deg);transition:transform .2s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-3px}
.faq details p{color:var(--w72);font-size:.95rem;padding:0 0 26px;max-width:740px}

/* ---------- FOOTER ------------------------------------------------------- */
.footer{background:var(--ink);color:var(--w40);padding:58px 0;font-size:.84rem;text-align:center;line-height:1.9}
.footer .fbrand{font-family:var(--serif);font-size:1.2rem;color:var(--white);margin-bottom:14px;letter-spacing:.03em}
.footer .fbrand i{font-style:normal;color:var(--blush)}
.footer a:hover{color:var(--blush)}
.flinks{margin-top:6px}
.flinks a{margin:0 11px}

/* ---------- STICKY MOBILE CTA -------------------------------------------- */
.sticky{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;
  background:var(--ink);border-top:1px solid var(--line-2);
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
}
.sticky .btn{display:block;width:100%;padding:17px 20px;font-size:.98rem}
.sticky small{display:block;text-align:center;color:var(--w55);font-size:.71rem;margin-top:8px;line-height:1.4}

/* ---------- STEP PAGES (reserve / welcome) ------------------------------- */
.page{min-height:100vh;display:flex;flex-direction:column}
.page main{flex:1;padding:46px 0 74px}
.topbar{padding:20px 0;border-bottom:1px solid var(--line)}
.topbar .brand{display:block;text-align:center}
.step-wrap{max-width:770px;margin:0 auto;padding:0 24px;width:100%}
.progress{margin:36px auto 46px;max-width:600px}
.track{height:3px;background:rgba(255,255,255,.14);border-radius:99px;overflow:hidden;margin-bottom:24px}
.fill{height:100%;background:var(--green-lt);border-radius:99px}
.fill.p66{width:66%;animation:grow66 1.1s cubic-bezier(.22,.9,.3,1) both}
.fill.p100{width:100%;animation:grow100 1.2s cubic-bezier(.22,.9,.3,1) both}
@keyframes grow66{from{width:0}to{width:66%}}
@keyframes grow100{from{width:0}to{width:100%}}
.steps{display:flex;justify-content:space-between;gap:8px}
.step{flex:1;text-align:center;font-size:.69rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:var(--w40);line-height:1.6}
.step .dot{
  width:26px;height:26px;border-radius:50%;margin:0 auto 10px;
  border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;
  font-size:.72rem;line-height:1;background:var(--navy);
}
.step.done{color:var(--w72)}
.step.done .dot{border-color:var(--green-lt);background:var(--green-lt);color:var(--white)}
.step.now{color:var(--blush)}
.step.now .dot{border-color:var(--blush);color:var(--blush);box-shadow:0 0 0 4px rgba(217,165,172,.16)}
.step-lede{color:var(--w72);font-size:1.04rem;max-width:590px;margin:0 auto 34px}

.ribbon{display:flex;flex-wrap:wrap;justify-content:center;gap:9px 12px;max-width:700px;margin:0 auto 22px}
.chip{border:1px solid var(--line-2);border-radius:2px;padding:9px 18px;font-size:.78rem;font-weight:450;color:var(--w88);line-height:1.4}

.checkout{background:var(--white);border-radius:3px;padding:10px;box-shadow:0 26px 66px rgba(0,0,0,.5);border-top:2px solid var(--blush)}
.checkout iframe{display:block;width:100%;border:0;border-radius:2px;height:1260px;background:var(--white);transition:height .25s ease}
.fallback{text-align:center;font-size:.82rem;color:var(--w40);margin:20px auto 0;line-height:1.7}
.fallback a{color:var(--blush);text-decoration:underline}
.trust{display:flex;flex-wrap:wrap;gap:9px 26px;justify-content:center;margin:28px 0 0;font-size:.78rem;color:var(--w55);line-height:1.6}
.trust span::before{content:"";display:inline-block;width:9px;height:9px;margin-right:9px;border-radius:50%;background:var(--green-lt)}
.help{margin-top:30px;font-size:.81rem;color:var(--w40);text-align:center;line-height:1.8}
.help a{color:var(--blush)}
.stepfoot{padding:28px 0;border-top:1px solid var(--line);font-size:.77rem;color:var(--w40);text-align:center}

/* ---------- WELCOME PAGE ------------------------------------------------- */
.seal{
  width:74px;height:74px;border-radius:50%;border:1px solid var(--green-lt);
  display:flex;align-items:center;justify-content:center;margin:0 auto 28px;
  color:var(--green-lt);font-size:1.7rem;line-height:1;
}
.panel{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:2px;padding:32px 34px;margin:0 auto 24px}
.ptitle{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--blush);font-weight:600;line-height:1.6;margin:0 0 22px}
.panel li{position:relative;padding:0 0 16px 30px;font-size:.96rem;color:var(--w88)}
.panel li:last-child{padding-bottom:0}
.panel li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:2px;background:var(--green-lt)}
.panel li b{color:var(--white);font-weight:600}
.surprise{
  border:1px solid var(--line-2);border-left:2px solid var(--blush);border-radius:2px;
  padding:28px 32px;margin:0 auto 24px;background:rgba(65,17,27,.35);
}
.surprise h3{color:var(--blush);font-size:1.04rem;margin-bottom:.42em}
.surprise p{font-size:.95rem;color:var(--w72)}
.dates{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:2px;padding:32px 34px;margin:0 auto 24px}
.drow{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.drow:last-of-type{border-bottom:0}
.drow .d{font-weight:600;white-space:nowrap;color:var(--white)}
.drow .t{color:var(--w55);text-align:right}
.drow.grad-row .d,.drow.grad-row .t{color:var(--blush)}
.calrow{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px}
.cal{
  flex:1 1 210px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line-2);border-radius:2px;padding:15px 18px;
  font-size:.88rem;font-weight:500;line-height:1.35;text-align:center;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.cal:hover{background:var(--white);color:var(--navy);border-color:var(--white)}
.calnote{margin-top:15px;font-size:.79rem;color:var(--w40);text-align:center;line-height:1.7}
.calnote a{color:var(--blush);text-decoration:underline}
.sharebox{border:1px solid var(--blush);border-radius:2px;padding:34px 32px;text-align:center;margin:0 auto}
.sharebox h3{font-family:var(--serif);font-weight:400;font-size:1.6rem;line-height:1.25;margin-bottom:.35em}
.sharebox p{font-size:.94rem;color:var(--w72);margin:0 0 24px}

/* ---------- SHARE MODAL -------------------------------------------------- */
.modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(4,10,18,.8);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.modal.open{display:flex;animation:fade .2s ease both}
@keyframes fade{from{opacity:0}to{opacity:1}}
.sheet{
  background:var(--navy);border:1px solid var(--line-2);border-top:2px solid var(--blush);
  border-radius:3px;width:100%;max-width:452px;max-height:90vh;overflow-y:auto;
  padding:34px 34px 28px;position:relative;box-shadow:0 34px 80px rgba(0,0,0,.6);
  animation:rise .26s cubic-bezier(.22,.9,.3,1) both;
}
@keyframes rise{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
.x{position:absolute;top:12px;right:14px;font-size:1.5rem;color:var(--w55);line-height:1;padding:6px 10px;border-radius:2px}
.x:hover{background:rgba(255,255,255,.08);color:var(--white)}
.sheet h3{font-family:var(--serif);font-weight:400;font-size:1.55rem;line-height:1.2;margin:0 0 .25em;padding-right:28px}
.sheet .sub{color:var(--w55);font-size:.9rem;margin:0 0 26px}
.slist{display:flex;flex-direction:column;gap:9px}
.sbtn{
  display:flex;align-items:center;gap:15px;width:100%;text-align:left;
  border:1px solid var(--line);border-radius:2px;padding:15px 18px;
  font-size:.94rem;font-weight:500;
  transition:border-color .16s ease,background .16s ease,transform .16s ease;
}
.sbtn:hover{border-color:var(--blush);background:rgba(255,255,255,.05);transform:translateX(2px)}
.sbtn .ic{
  width:32px;height:32px;flex:0 0 32px;border-radius:50%;
  border:1px solid var(--line-2);color:var(--blush);
  display:flex;align-items:center;justify-content:center;font-size:.76rem;font-weight:700;
}
.sbtn small{display:block;font-weight:350;color:var(--w55);font-size:.78rem;line-height:1.5;margin-top:3px}
.toast{margin-top:18px;font-size:.83rem;color:var(--green-lt);text-align:center;font-weight:600;opacity:0;transition:opacity .2s ease;line-height:1.5}
.toast.show{opacity:1}

/* ---------- RESPONSIVE --------------------------------------------------- */
@media(max-width:860px){
  .sec{padding:68px 0}
  .hero{padding:74px 0 68px}
  .session{padding:28px 24px}
  .grad{padding:34px 24px}
  .nav .btn{display:none}
  .sticky{display:block}
  .footer{padding-bottom:126px}
}
@media(max-width:520px){
  .wrap,.step-wrap{padding:0 18px}
  .card,.adv,.callout,.panel,.dates,.sharebox,.surprise{padding:26px 22px}
  .price-body,.price-head{padding-left:24px;padding-right:24px}
  .formcard,.checkout{padding:7px}
  .checkout iframe{height:1560px}
  .step{font-size:.58rem;letter-spacing:.06em}
  .drow{flex-direction:column;gap:2px}
  .drow .t{text-align:left}
  .sheet{padding:28px 22px 24px}
}
