/* Scoped landing-page additions. Existing KYD and SLPP styling is untouched. */
:root{--text-orange:#945200;--text-coral:#ae3015}
html{scroll-padding-top:110px}
section[id]{scroll-margin-top:110px}
.hero--lyf{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);min-height:650px}
.hero--lyf .hero__panel{padding:70px 48px 66px max(var(--gutter),calc((100vw - var(--wrap))/2));min-width:0;background:linear-gradient(125deg,#f6af43,#f38d00 65%,#ef8b47);color:var(--ink)}
/* Apply the page gutter once, to the panel, not inside an auto-aligned
   fixed-width copy box. The old combination squeezed copy on wide screens. */
.hero--lyf .hero__copy{width:100%;max-width:none;min-width:0;margin:0;padding:0}
.hero--lyf h1{font-size:clamp(3.3rem,5.6vw,5.7rem);letter-spacing:-.025em;color:var(--ink);max-width:100%;line-height:1.02}
.hero--lyf .kicker,.hero--lyf .sub,.hero--lyf .lead{color:var(--ink);opacity:1}
.hero--lyf .sub{font-size:clamp(1.3rem,2vw,1.7rem);font-style:normal;max-width:25ch}
.hero--lyf .lead{font-size:1.1rem;line-height:1.7}
.hero--lyf .btn--outline{border-color:var(--ink);color:var(--ink)}
.hero--lyf .hero-note{font-size:.88rem;margin:20px 0 0;font-weight:600}
.hero--lyf .facts{font-size:.92rem;gap:8px}
.hero--lyf .facts li{display:block}
.hero__media--lyf{background-color:#eae6dc;padding:46px 36px}
.workbook-figure{margin:0;max-width:400px;width:100%;text-align:center}
.book-wrap{width:78%;max-width:300px;margin:0 auto;border-left:6px solid #c7c2b6;box-shadow:12px 18px 28px #1c12512b;transform:rotate(3deg)}
.book-wrap img{width:100%;height:auto}
.workbook-figure figcaption{max-width:27ch;margin:28px auto 0;font-size:.86rem;line-height:1.6;color:var(--ink2)}
.steady-steps{display:flex;justify-content:space-around;gap:12px;margin-block:0;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:.9rem;letter-spacing:.08em;padding-block:9px}
.approach{background:var(--ink);color:#fff}
.approach .kicker,.approach .step{color:var(--amber)}
.approach .cols3 li{background:#2a2160;backdrop-filter:none;border-color:#71678d}
.approach .cols3 p{color:#eeebf5}
.modules-section{background:#f1ece3;padding-top:76px}
.mod h4{font-size:1.1rem;line-height:1.35}
.mod .mod__k{color:var(--text-coral);font-size:.73rem;margin-bottom:6px}
.phaseblock__h{font-size:1.6rem}
.who-section{background:#e8e1d4}
.who-section p{max-width:44ch}
.price-section{background:#f1ece3}
.price-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:32px}
.price-card{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid #c7c1ce;border-radius:20px;padding:36px}
.price-card--live{border:2px solid var(--ink);box-shadow:7px 7px 0 var(--orange)}
.price-card h3{font-size:2rem}
.price{font-family:'Fraunces',Georgia,serif;font-size:3.5rem;font-weight:600;line-height:1.1;margin:16px 0}
.price span{display:block;font-family:'Manrope',sans-serif;font-size:.9rem;font-weight:500;margin-top:12px;color:var(--muted)}
.price-card ul{padding-left:22px;display:grid;gap:12px;margin-bottom:30px}
.price-card .btn{margin-top:auto}
.price-card .small{margin-top:0}
.lyf-pathway{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;padding:0;gap:12px;margin:32px 0 24px}
.lyf-pathway li{border-top:3px solid #b5adbd;background:#f1ece3;padding:22px 18px}
.lyf-pathway li.current{background:var(--ink);border-color:var(--orange);color:#fff}
.lyf-pathway span{display:block;font-family:'IBM Plex Mono',monospace;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:18px}
.lyf-pathway h3,.lyf-pathway a{font-family:'Fraunces',Georgia,serif;font-size:1.2rem;line-height:1.3;font-weight:600;color:inherit}
.lyf-pathway h3{margin:0}
.lyf-pathway p{font-size:.9rem;line-height:1.65;margin-bottom:0}
.register .form-card .btn{white-space:normal;text-align:center}
.form-card .small{font-size:.88rem;line-height:1.7}
.ctac{color:var(--ink)}
.ctac h2,.ctac p{color:var(--ink)}
.on-orange :focus-visible{outline-color:var(--ink)}
.on-dark :focus-visible{outline-color:var(--amber)}
.form-card :focus-visible{outline-color:var(--ink)}
.nav a,.ftr a{min-height:28px;display:inline-block}
.faq__item summary{min-height:64px}
.no-js .nav-toggle{display:none}
@media(max-width:1100px){.hero--lyf .hero__panel{padding:52px 28px}.hero--lyf .btn-row{gap:10px}.hero--lyf .btn{font-size:.92rem}}
@media(max-width:960px){
 html{scroll-padding-top:20px}section[id]{scroll-margin-top:20px}
 .hero--lyf{grid-template-columns:minmax(0,1fr)}.hero--lyf .hero__panel{padding:44px var(--gutter) 48px}.hero--lyf .hero__copy{margin:0;width:100%}
 .hero--lyf h1{max-width:100%;font-size:clamp(3.3rem,10vw,5.6rem)}
 .hero--lyf .hero__media{order:0;padding:38px var(--gutter)}
 .book-wrap{max-width:190px}.workbook-figure figcaption{margin-top:22px}
 .hero--lyf .lead,.hero--lyf .sub{max-width:45ch}
 .lyf-pathway{grid-template-columns:repeat(2,minmax(0,1fr))}
 .no-js .nav{position:static;display:block;border:0}.no-js .mast__in{flex-wrap:wrap}.no-js .nav ul{flex-direction:row;flex-wrap:wrap}.no-js .mast__bar{flex-wrap:wrap}
}
@media(max-width:640px){
 .price-grid{grid-template-columns:minmax(0,1fr)}.price-card{padding:28px 22px}.price-card--live{box-shadow:5px 5px 0 var(--orange)}
 .lyf-pathway{grid-template-columns:minmax(0,1fr)}.lyf-pathway li{padding:22px}.lyf-pathway span{margin-bottom:10px}
 .steady-steps{font-size:.74rem;gap:14px;letter-spacing:0}
 .hero--lyf .btn-row{align-items:stretch;flex-direction:column}.hero--lyf .btn-row .btn{justify-content:center}
 .hero--lyf .kicker{font-size:.65rem;letter-spacing:.12em}.hero--lyf h1{font-size:clamp(3rem,13vw,4.5rem)}
 .phaseblock{padding:18px 14px}.mod{padding:14px 10px;gap:12px}.mod__n{width:30px;height:30px}
}
@media(prefers-reduced-motion:reduce){.book-wrap{transform:none}.progress{display:none}}

.form-card a.btn--violet,.form-card a.btn--violet:hover{color:#fff}

/* Intrinsic grid/flex sizing must never force cards or long links wider than
   their track. These page-local rules leave KYD and SLPP untouched. */
:is(.hero--lyf,.intro__cols,.cols3,.cols,.modules,.mods,.factsgrid,.price-grid,.lyf-pathway,.register__in,.faq,.ftr__top)>*{min-width:0}
.mod>div,.faq__item summary h3{min-width:0}
:is(.hero__copy,.col,.cols3 li,.mod,.factsgrid li,.price-card,.lyf-pathway li,.form-card,.faq__a,.ftr){overflow-wrap:anywhere}
.btn{max-width:100%;white-space:normal;text-align:center;justify-content:center}
.topbar a{display:inline-block;min-height:24px}
.intro__cols{grid-template-columns:repeat(2,minmax(0,1fr))}
.cols3,.factsgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
.cols{grid-template-columns:repeat(4,minmax(0,1fr))}
.mods{grid-template-columns:repeat(2,minmax(0,1fr))}
.register__in{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
.faq{grid-template-columns:minmax(0,280px) minmax(0,1fr)}
.ftr__top{grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr))}
@media(max-width:1100px){.cols,.lyf-pathway{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:960px){
 .intro__cols,.register__in,.faq,.cols3{grid-template-columns:minmax(0,1fr)}
 .factsgrid,.ftr__top{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:800px){.price-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:767px){.mods{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){
 .cols,.factsgrid,.lyf-pathway,.ftr__top{grid-template-columns:minmax(0,1fr)}
 .mast__in{gap:10px}.mast__logo{min-width:0;flex:1}.mast__bar{flex:none}
 .mast__logo .logo{max-width:100%;height:auto;max-height:44px}
 .nav a{min-height:44px}
}

/* The third item in the Steady phase uses the available row, without an empty half-card. */
.mods>.mod:last-child:nth-child(odd){grid-column:1 / -1}

/* Keep navigation visible and within the page if JavaScript is unavailable. */
@media(max-width:960px){
 .no-js .mast__bar{flex:1 1 100%;width:100%;max-width:100%;min-width:0}
 .no-js .mast__logo{padding-top:12px}
 .no-js .nav{width:100%;padding-inline:0}
}
/* Teaser video band (KYD pattern) */
.lyf-teaser{background:var(--ink);color:var(--paper);padding:72px 0}
.lyf-teaser__in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:center}
.lyf-teaser .kicker{color:var(--orange)}.lyf-teaser .secttl{color:#fff;margin:0}
.lyf-teaser .teaser{max-width:760px;justify-self:end}
.lyf-teaser .teaser video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#1C1251;border-radius:18px;box-shadow:12px 12px 0 var(--orange)}
.lyf-teaser .teaser figcaption{display:flex;flex-direction:column;gap:8px;margin-top:18px;color:var(--paper);font-size:.95rem}
.lyf-teaser .transcript summary{color:var(--orange);cursor:pointer}
.lyf-teaser .transcript summary:hover{color:#FFB749}
.lyf-teaser :focus-visible{outline:3px solid var(--orange);outline-offset:3px}
@media(max-width:960px){.lyf-teaser{padding:48px 0}.lyf-teaser__in{grid-template-columns:minmax(0,1fr);gap:24px}.lyf-teaser .teaser{justify-self:stretch;max-width:none}.lyf-teaser .teaser video{box-shadow:8px 8px 0 var(--orange);border-radius:14px}}
/* Page animations: reuses the SLPP (styles.css + main.js) reveal, stagger and hero-fade pattern. Only active once JS adds .lyf-anim, so content stays visible without JS. Transforms and opacity only, no layout shift. */
.lyf-anim .reveal{opacity:0;transform:translateY(32px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.lyf-anim .reveal.is-in{opacity:1;transform:none}
.lyf-anim .stagger>*{opacity:0;transform:translateY(36px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}
.lyf-anim .stagger.is-in>*{opacity:1;transform:none}
.lyf-anim .stagger.is-in>*:nth-child(2){transition-delay:.1s}
.lyf-anim .stagger.is-in>*:nth-child(3){transition-delay:.2s}
.lyf-anim .stagger.is-in>*:nth-child(4){transition-delay:.3s}
.lyf-anim .stagger.is-in>*:nth-child(5){transition-delay:.4s}
.lyf-anim .hero-fade{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1);transition-delay:var(--d,.1s)}
.lyf-anim .is-in .hero-fade{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.lyf-anim .reveal,.lyf-anim .stagger>*,.lyf-anim .hero-fade{opacity:1!important;transform:none!important;transition:none!important}}
@media print{.lyf-anim .reveal,.lyf-anim .stagger>*,.lyf-anim .hero-fade{opacity:1;transform:none}}
.lyf-anim .hf1{--d:.05s}.lyf-anim .hf2{--d:.12s}.lyf-anim .hf3{--d:.2s}.lyf-anim .hf4{--d:.28s}.lyf-anim .hf5{--d:.36s}.lyf-anim .hf6{--d:.44s}.lyf-anim .hf7{--d:.52s}.lyf-anim .hf8{--d:.6s}.lyf-anim .hf9{--d:.3s}
