/* Compact desktop-inspired compositions, scoped entirely to phone/tablet widths. */
@media (max-width:800px){
 html{scroll-padding-top:88px;scrollbar-gutter:auto}
 .header{height:72px;padding-inline:16px}
 .mobile-nav{max-height:calc(100svh - 72px);padding-bottom:max(22px,env(safe-area-inset-bottom))}
 .wrap{width:calc(100% - 32px)}
 .section{padding-block:44px}
 .section-top{margin-bottom:24px;gap:12px}
 .eyebrow{font-size:.875rem;letter-spacing:.07em}
 .index{margin-right:10px}
 .section-heading,.results .section-heading{margin-bottom:24px}
 .section-heading p{font-size:1rem;line-height:1.5;margin-top:16px}
 .primary-cta{min-height:64px;padding:12px 16px 12px 22px;font-size:1.0625rem;gap:20px;letter-spacing:.065em}
 .hero .primary-cta,.coaching-intro .primary-cta,.contact .primary-cta{min-width:0}

 /* Put the hero artwork beside the headline; the enquiry stays easy to reach. */
 .hero{min-height:0;height:auto;max-height:none;justify-content:flex-start}
 .hero-composition{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);grid-template-areas:"eyebrow eyebrow" "title image" "intro intro" "actions actions";gap:18px;padding-block:28px 20px}
 .hero-content{display:contents}
 .hero-eyebrow{grid-area:eyebrow;margin:0;font-size:.8125rem;gap:10px;letter-spacing:.06em}
 .hero h1{grid-area:title;font-size:clamp(2rem,9.6vw,4.8rem);line-height:1.04;max-width:none;letter-spacing:-.025em;overflow-wrap:normal}
 .hero h1>span{display:block}
 .hero-training{grid-area:image;width:100%;max-width:270px;margin:0;justify-self:end;align-self:center;transform:none}
 .training-image:before{inset:-5px}
 .training-image:after{top:-5px}
 .training-image{box-shadow:0 16px 32px #0008,0 0 0 3px #ffffff06}
 .hero-training figcaption{padding-top:10px;font-size:.75rem;letter-spacing:.025em;line-height:1.4}
 .hero-training figcaption span:last-child{display:none}
 .hero-intro{grid-area:intro;font-size:1rem;line-height:1.5;margin:0;max-width:none}
 .hero-intro br{display:none}
 .hero-actions{grid-area:actions;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:10px;margin:4px 0 0}
 .hero .hero-actions .primary-cta{width:100%;justify-content:space-between}
 .hero-results-link{font-size:.875rem;gap:10px;min-height:44px;padding:10px 0;align-self:center;justify-self:center}
 .hero-bottom{position:relative;bottom:auto;left:auto;right:auto;min-height:50px;padding:6px 0 12px}
 .hero-bottom .scroll-cue{font-size:.875rem;min-height:44px}
 .principle-strip{padding:14px 16px;gap:12px;flex-wrap:nowrap;justify-content:space-between;font-size:.75rem;line-height:1.4;letter-spacing:.025em}
 .principle-strip span:not([aria-hidden]){flex:1;min-width:0;text-align:center;max-width:160px}

 .approach-intro{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px 20px;align-items:center}
 .approach h2{font-size:clamp(1.75rem,6.6vw,3.25rem);line-height:1.08;overflow-wrap:normal}
 .intro-copy{display:contents}
 .intro-copy p{font-size:1rem;line-height:1.5}
 .intro-copy p:first-child{grid-column:2;grid-row:1}
 .intro-copy p+p{grid-column:1/-1;margin:0;max-width:none}
 .intro-copy .text-link{grid-column:1/-1;justify-self:start;margin-top:0}
 .text-link{min-height:44px;margin-top:14px;gap:12px;font-size:.875rem;padding-bottom:6px}
 /* Keep all three principles in a horizontal row with readable text. */
 .principles{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:76%;gap:12px;margin-top:24px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;padding:2px 2px 12px}
 .principle,.principle+.principle{display:block;min-width:0;padding:18px;scroll-snap-align:start}
 .principle-number{font-size:1.5rem;padding:0;margin-bottom:10px}
 .principle h3{font-size:1.6rem;line-height:1.1;margin:0 0 12px}
 .principle h3 br{display:none}
 .principle p{font-size:1rem;line-height:1.5;margin:0}

 .results h2{font-size:clamp(2.25rem,8vw,4rem)}
 .story-selectors{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;grid-auto-columns:auto;gap:8px;padding:0;margin:0 0 14px;overflow:visible;scroll-snap-type:none}
 .story-selectors button{min-width:0;min-height:44px;padding:10px 8px;gap:0;font-size:.875rem;text-align:center;align-items:center;overflow-wrap:anywhere}
 .story-selectors .selector-phase{display:none}
 .carousel-toolbar{flex-wrap:nowrap;align-items:center;gap:10px;margin-bottom:12px}
 .carousel-hint{max-width:none;font-size:.875rem;line-height:1.4}
 .carousel-count{margin-right:0;min-width:46px;font-size:.8125rem}
 .carousel-controls{gap:6px;flex-shrink:0}
 .carousel-arrow{width:44px;height:44px;flex:0 0 44px}
 /* Edge-to-edge track leaves a visible next card without shrinking the current one. */
 .story-track{grid-auto-columns:calc(100% - 24px);gap:12px;margin-inline:-16px;padding:3px 16px 14px;scroll-padding-inline:16px;scroll-behavior:auto}
 .story-track>.story{padding:14px;min-height:0}
 .story-top{gap:10px}
 .story .pill{font-size:.75rem;padding:7px 9px;letter-spacing:.035em}
 .story-index{font-size:.8125rem}
 .story-track .story-with-photo .story-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-rows:auto 1fr auto;align-items:start;align-content:start;gap:12px 16px;padding-block:18px}
 .story-track .story-with-photo .story-copy{display:contents}
 .story-photo{grid-column:1;grid-row:1/3;max-width:none;width:100%;align-self:start;min-width:0}
 .story-photo img{object-fit:contain;height:auto}
 .photo-expand{font-size:.875rem;line-height:1.3;padding:10px 6px;min-height:44px;display:grid;place-items:center}
 .story-track .story-with-photo .story-metric{grid-column:2;grid-row:1;font-size:clamp(2.75rem,10vw,4.5rem);line-height:1;align-self:start}
 .story-track .story-with-photo .story-metric span{font-size:1.25rem}
 .story-track .story-with-photo .story-main h3{grid-column:2;grid-row:2;margin:0;font-size:clamp(1.4rem,5.6vw,2.5rem);line-height:1.12;overflow-wrap:normal;hyphens:auto}
 .story-track .story-with-photo .story-main h3 br{display:none}
 .story-track .story-with-photo .story-main p{grid-column:1/-1;grid-row:3;margin:2px 0 0;font-size:1rem;line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
 .story-footer{padding-top:12px;font-size:1rem;gap:10px}
 .story-footer .muted-inline{font-size:.8125rem;line-height:1.4}
 .round-button{flex:0 0 44px;width:44px;height:44px}
 .story-footer .round-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-basis:auto;width:auto;padding:0 10px}
 .story-footer .round-button:before{content:'Read story';font-family:var(--body);font-size:.875rem;white-space:nowrap}
 .results-note{font-size:.8125rem;line-height:1.5;margin-top:12px}

 .testimonial-feature{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;margin-top:28px;padding:16px;align-items:center}
 .testimonial-copy{min-width:0}
 .testimonial-copy .eyebrow{font-size:.75rem;line-height:1.4;letter-spacing:.04em}
 .testimonial-copy .index{display:none}
 .testimonial-copy h3{font-size:clamp(1.5rem,6.1vw,3rem);line-height:1.08;margin:12px 0}
 .testimonial-copy>p:not(.eyebrow){font-size:1rem;line-height:1.5}
 .testimonial-copy .testimonial-instruction{display:none}
 .testimonial-media{width:100%;max-width:235px;justify-self:end;min-width:0}
 .testimonial-sound{padding:10px;gap:6px;flex-direction:column;justify-content:flex-end;align-items:flex-start}
 .sound-icon{width:34px;height:34px;flex:0 0 34px}
 .sound-label{font-size:.875rem;line-height:1.3}

 .coaching-layout{gap:24px}
 .coaching-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
 .coaching-intro h2{font-size:clamp(1.9rem,7vw,3.6rem);line-height:1.08;min-width:0}
 .coaching-intro p{font-size:1rem;line-height:1.5;margin:0;min-width:0}
 .coaching-intro .primary-cta{grid-column:1/-1;justify-self:stretch;width:100%}
 .detail-label{padding-bottom:14px}
 .phase,.phase:last-of-type{margin-bottom:8px}
 .phase summary{padding:14px;min-height:56px;gap:12px;font-size:1rem}
 .phase-number{font-size:1.5rem}
 .phase-body{padding:0 16px 18px}
 .phase-caption{font-size:.8125rem}
 .phase[open] .phase-body p{font-size:1rem;line-height:1.5}
 .included{margin-top:18px;padding:18px}
 .included ul{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 16px;margin-top:14px}
 .included li{font-size:1rem;line-height:1.45;margin:0;padding-left:20px}

 .life{min-height:0}
 .life-content{padding-block:44px 90px}
 .life h2{font-size:clamp(2.5rem,9vw,4.5rem);line-height:1;margin:20px 0}
 .life-content p:not(.eyebrow){font-size:1rem;line-height:1.5}
 .life-caption{bottom:20px;padding-top:12px;font-size:.75rem;gap:16px;line-height:1.4;letter-spacing:.035em}
 .founder{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-areas:"portrait heading" "story story";grid-template-rows:auto auto;gap:22px;align-items:center}
 .founder-heading{min-width:0}
 .founder-heading .eyebrow{font-size:.8125rem}
 .founder-heading .index{display:block;margin:0 0 4px}
 .founder-heading h2{font-size:clamp(2rem,7.5vw,3.5rem);line-height:1.06;margin-top:14px}
 .founder-role{font-size:.75rem;line-height:1.4;margin-top:12px;letter-spacing:.04em}
 .founder-portrait{width:100%;max-width:280px;box-shadow:5px 5px 0 #e1e2e5}
 .founder-copy{max-width:none}
 .founder-copy .large-copy{font-size:1.25rem;line-height:1.4}
 .founder-copy p{font-size:1rem;line-height:1.5}
 .founder-copy p+p{margin-top:14px}
 .founder-copy .signature{font-size:1.8rem;padding-top:16px;margin-top:20px}

 .resources h2{font-size:clamp(2.1rem,7.6vw,3.75rem)}
 .resource-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
 .resource-card,.resource-card+.resource-card{padding:16px;min-width:0;display:flex;flex-direction:column}
 .resource-meta{flex-direction:column;gap:6px;font-size:.75rem;line-height:1.35;letter-spacing:.025em}
 .resource-card h3{font-size:clamp(1.6rem,6vw,2.8rem);line-height:1.08;margin-top:20px;overflow-wrap:break-word;hyphens:auto}
 .resource-card p{font-size:1rem;line-height:1.5;margin:14px 0 20px}
 .resource-bottom{margin-top:auto;padding-top:12px;flex-direction:column;align-items:start;gap:6px;font-size:.75rem;line-height:1.4;letter-spacing:.02em}
 .resource-bottom span:last-child{font-size:.875rem}
 .resource-card.resource-premium{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"meta" "intro" "action" "inclusions";gap:22px;padding:22px 18px}
 .resource-premium>.resource-meta{align-items:flex-start;gap:10px;padding-bottom:16px}
 .resource-premium h3{font-size:clamp(2rem,8.2vw,3.7rem);line-height:1.06;margin:0}
 .resource-premium .premium-intro p{max-width:none;margin:14px 0 0;font-size:1rem;line-height:1.5}
 .premium-action .primary-cta{width:100%;min-width:0}
 .resource-premium .premium-action p{margin-top:10px}
 .premium-inclusions h4{margin-bottom:14px;font-size:.8125rem}
 .premium-features{gap:18px 16px}
 .premium-features li{padding-top:12px}
 .premium-features h5{font-size:1rem;line-height:1.4}
 .resource-premium .premium-features p{font-size:1rem;line-height:1.5;margin-top:8px}
 .contact-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start;margin-top:24px}
 .contact-layout>div{display:contents}
 .contact h2{font-size:clamp(2rem,7.6vw,3.8rem);line-height:1.06;overflow-wrap:normal}
 .contact-layout>div>p:first-child{font-size:1rem;line-height:1.5;margin:0;min-width:0}
 .contact .primary-cta{grid-column:1/-1;min-width:0;width:100%}
 .contact .contact-note{grid-column:1/-1;margin:0;font-size:.875rem}
 .footer{padding-block:28px 20px}
 .footer-top{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:0 0 20px}
 .footer-bottom{padding-top:16px;gap:12px 20px;align-items:center}
 .footer-bottom a,.credits-button{min-height:44px;display:inline-flex;align-items:center;font-size:.875rem}
 .story-dialog{padding:18px;width:calc(100% - 24px)}
 .story-dialog .dialog-top{top:-18px;gap:12px;padding-block:8px;margin-bottom:16px;background:#f4f4f4}
 .story-dialog h2{font-size:clamp(2rem,7.5vw,3rem);margin-bottom:18px}
 .story-dialog.has-transformation #dialog-content{gap:20px}
 .dialog-footer{gap:14px;margin-top:24px;padding-top:18px}
 .dialog-story-nav{gap:8px;min-width:0}
 .dialog-story-nav button{flex-shrink:0}
}

/* Keep the full wordmark and a prominent enquiry together in the phone header. */
@media (max-width:600px){
 .header{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;gap:8px;height:auto;min-height:72px;padding:10px 12px}
 .header .brand{gap:8px;min-width:0}
 .header .brand-title{display:block;min-width:0;font-size:.6875rem;letter-spacing:.02em;line-height:1.35;overflow-wrap:normal}
 .header .brand-title>span{letter-spacing:.16em}
 .header .brand-mark{width:30px;height:33px}
 .header .header-cta.primary-cta{font-size:.8125rem;letter-spacing:.02em;min-height:48px;min-width:0;margin-left:0;padding:8px;gap:8px;white-space:normal}
 .header .cta-label{min-width:0;max-width:4.8em;line-height:1.2;overflow-wrap:normal}
 .header .header-cta .cta-arrow{flex-basis:24px;width:24px;height:24px}
 .header .menu-toggle{width:44px;height:44px;margin-left:0}
}

@media (min-width:600px) and (max-width:800px){
 .wrap{width:calc(100% - 48px)}
 .hero-composition{gap:24px;grid-template-areas:"eyebrow image" "title image" "intro image" "actions actions"}
 .principles{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;grid-auto-columns:auto}
 .story-track{grid-auto-columns:88%;margin-inline:-24px;padding-inline:24px;scroll-padding-inline:24px}
 .story-track .story-with-photo .story-main{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 22px}
 .story-photo{grid-row:1/4}
 .story-track .story-with-photo .story-main p{grid-column:2;grid-row:3;-webkit-line-clamp:4}
}

/* At extra-narrow or enlarged-text widths, give reading and controls room. */
@media (max-width:359px){
 .hero-actions{grid-template-columns:minmax(0,1fr)}
 .hero-results-link{justify-self:start}
 .hero-composition{gap:14px}
 .hero h1{font-size:clamp(1.65rem,10vw,2.2rem)}
 .approach-intro,.coaching-intro,.contact-layout{grid-template-columns:minmax(0,1fr)}
 .intro-copy p:first-child{grid-column:1;grid-row:auto}
 .approach h2,.coaching-intro h2{font-size:2rem}
 .included ul{grid-template-columns:minmax(0,1fr)}
 .testimonial-feature{gap:12px;padding:14px}
 .story-track .story-with-photo .story-main{gap:12px}
 .story-track .story-with-photo .story-main h3{font-size:1.35rem}
 .story .pill{letter-spacing:0}
 .carousel-hint{max-width:100px}
 .resource-card,.resource-card+.resource-card{padding:12px}
 .resource-card.resource-premium{padding:20px 16px}
 .premium-features{grid-template-columns:minmax(0,1fr)}
}