/* SprintAi Action: wide editorial composition, loaded after styles.css. */
:root { --gutter: clamp(32px, calc(3.125vw - 13px), 64px); }
.container { width:100%; max-width:none; margin-inline:0; padding-inline:var(--gutter); }

/* Desktop canvas */
@media (min-width:701px) {
  .section { padding-block:clamp(82px, 6vw, 142px); }
  .section-top { margin-bottom:clamp(34px, 3.2vw, 58px); }
  .section-heading { gap:clamp(42px, 6vw, 150px); margin-bottom:clamp(38px, 3.5vw, 68px); }
  .section-heading h2, .method h2, .format h2, .faq h2 {
    font-size:clamp(38px, 3.25vw, 62px); line-height:1.25;
  }
  .lead, .section-heading .lead, .method .lead, .format .lead {
    max-width:62ch; font-size:20px; line-height:1.6;
  }
  .header-inner { height:88px; }
  .nav { gap:clamp(22px, 2.2vw, 44px); font-size:16px; }
  .header-cta { padding:12px 18px; }

  /* Hero pairs the promise with a large, luminous film sculpture. */
  .hero { min-height:0; padding-top:88px; }
  .hero-content { padding-top:clamp(34px, 3vw, 58px); }
  .hero-topline { margin-bottom:clamp(25px, 2.8vw, 52px); }
  .hero-grid { grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); gap:clamp(42px,5vw,118px); }
  .hero-copy { max-width:760px; }
  .hero h1 { font-size:clamp(58px,5.15vw,104px); line-height:1.17; }
  .hero-lead { max-width:34ch; font-size:clamp(21px,1.55vw,28px); }
  .hero-description { max-width:58ch; font-size:20px; line-height:1.65; }
  .hero-buttons { gap:28px; margin-top:34px; }
  .hero-buttons .button { min-height:62px; padding-inline:26px; }
  .hero-bottom { margin-top:clamp(40px,4vw,74px); padding-block:28px 30px; }
  .hero-path { gap:clamp(16px,1.7vw,31px); }
  .cinema-art { height:clamp(520px,39vw,900px); min-width:0; }
  .cinema-surface { width:142%; max-width:1180px; }
  .cinema-echo { width:66%; }
  .cinema-preview { inset:auto 1% 1% 10%; gap:18px; padding:13px 18px 13px 13px; }
  .cinema-preview > img { width:48px; height:68px; }
  .cinema-preview > span { font-size:18px; }
  .cinema-preview small { font-size:16px; }
  .cinema-orbit { padding:11px 15px; }

  /* The numbers become a full-bleed editorial index. */
  .numbers { padding-block:clamp(34px,3vw,56px); }
  .numbers-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(28px,4vw,80px); }
  .numbers-grid > div { padding-left:clamp(24px,2.5vw,48px); }
  .numbers strong { font-size:clamp(34px,3vw,56px); }
  .numbers strong span, .numbers p { font-size:17px; }

  /* Tracks and frames expand as a single storyboard, not empty wrappers. */
  .track-tabs { gap:14px; margin-bottom:22px; }
  .track-tabs button { min-height:76px; padding:20px 24px; font-size:19px; }
  .storyboard { padding:clamp(32px,3vw,58px); }
  .storyboard-top { gap:clamp(36px,5vw,100px); margin-bottom:36px; }
  .storyboard-top h3 { font-size:clamp(28px,2.2vw,40px); }
  .storyboard-top > p { max-width:60ch; }
  .frame-selector { grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,1.7vw,32px); }
  .story-frame { padding:clamp(17px,1.5vw,29px); }
  .frame-art { height:clamp(190px,15vw,340px); margin-block:18px 21px; }
  .story-frame strong { font-size:clamp(19px,1.45vw,25px); }
  .frame-text { min-height:3.2em; }
  .frame-circle { width:clamp(130px,11vw,240px); height:clamp(130px,11vw,240px); }
  .frame-art > b { font-size:clamp(78px,7vw,148px); }
  .scene-grid { width:min(60%,300px); height:auto; aspect-ratio:1; }
  .scene-insight { margin-top:32px; padding:22px 28px; }

  /* Showcase keeps the same outer edge; only the film rail scrolls inside it. */
  .screening-top { margin-bottom:28px; }
  .film-rail { gap:clamp(18px,1.6vw,32px); padding:8px 4px 30px; margin:0;
    scroll-padding-inline:4px; }
  .film-card { flex:0 0 clamp(285px,19.5vw,470px); min-width:0; }
  .film-poster { aspect-ratio:9 / 14.5; border-radius:17px; }
  .film-card > strong { margin-top:21px; font-size:21px; }
  .film-card > span:last-child { max-width:38ch; }

  /* Supporting sections use paired content columns with measured copy. */
  .method-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(60px,8vw,180px); }
  .method .lead { margin-top:29px; }
  .method-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,2vw,38px); }
  .method-list > div, .method-list > div:first-child {
    display:block; padding:22px 0 0!important; border:0; border-top:1px solid #cfbddd5e;
  }
  .method-list > div > span { display:block; margin-bottom:18px; }
  .method-list strong { font-size:20px; }
  .program .section-heading .lead { max-width:56ch; }
  .curriculum { grid-template-columns:minmax(340px,.83fr) minmax(0,1.17fr); }
  .module-tabs { padding:16px clamp(24px,2.4vw,46px); }
  .module-tabs button { min-height:102px; gap:22px; }
  .module-tabs button > div { font-size:20px; }
  .module-panel { min-height:660px; padding:clamp(38px,3.5vw,68px); }
  .module-panel h3 { font-size:clamp(29px,2.4vw,42px); }
  .module-panel > p, .module-panel ul, .module-outcome p { max-width:62ch; }
  .architect-card { grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    gap:clamp(50px,7vw,150px); padding:clamp(42px,4vw,78px); }
  .architect-card h3 { font-size:clamp(32px,2.65vw,48px); }
  .architect-card p { max-width:58ch; }
  .director-flow > div { padding:28px 36px; }
  .toolkit-grid { grid-template-columns:repeat(4,minmax(0,1fr));
    gap:clamp(25px,3vw,62px); margin-top:clamp(42px,4vw,76px); }
  .toolkit-grid h3 { font-size:clamp(20px,1.5vw,26px); }
  .toolkit-grid p { max-width:34ch; }
  .stack-row { grid-template-columns:minmax(150px,.28fr) minmax(0,1fr);
    gap:18px 36px; margin-top:58px; padding-top:34px; }
  .stack-row > p { max-width:68ch; }
  .authors-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(22px,2.5vw,48px); }
  .author-card { padding:clamp(24px,2.2vw,42px); }
  .author-photo { max-height:450px; aspect-ratio:1.12 / 1; }
  .author-copy h3 { font-size:clamp(25px,2vw,36px); }
  .author-copy p { max-width:48ch; }
  .format-layout { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(55px,8vw,170px); }
  .format .lead { margin-top:30px; }
  .format-board { padding:clamp(35px,3.6vw,68px); }
  .format-ratio > span, .format-ratio > strong { font-size:clamp(66px,5.6vw,100px); }
  .ratio-bar { height:8px; margin-block:34px 38px; }
  .format-points { gap:23px; }
  .faq-layout { grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr); gap:clamp(60px,8vw,170px); }
  .faq-layout > div:first-child > p { max-width:35ch; }
  .faq summary { padding-block:27px; }
  .faq details > p { max-width:68ch; }

  /* Closing action aligns the promise, copy and signup panel to the same grid. */
  .final-cta { padding-top:clamp(82px,7vw,132px); }
  .final-cta > .container { display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:clamp(48px,7vw,140px); align-items:start; }
  .final-cta .eyebrow, .final-bottom { grid-column:1 / -1; }
  .final-cta h2 { grid-column:1; grid-row:2 / span 2; font-size:clamp(68px,7vw,128px); }
  .final-copy { display:block; grid-column:2; grid-row:2; align-self:end; margin-top:0; }
  .final-copy > p { max-width:48ch; }
  .final-copy .button { margin-top:25px; }
  .final-cta .signup-panel { grid-column:2; grid-row:3; justify-self:start; margin:32px 0 0; }
  .final-bottom { margin-top:clamp(64px,6vw,110px); }
  .footer { padding-block:38px 30px; }
  .footer-bottom { margin-top:30px; }
}

/* Large cinema scales the artwork and gives the module panel a useful layout. */
@media (min-width:1600px) {
  .hero { padding-top:96px; }
  .header-inner { height:96px; }
  .hero-bottom { margin-top:56px; }
  .numbers-grid > div:not(:first-child) { border-left-color:#d5b4ec3c; }
  .storyboard { border-radius:24px; }
  .module-panel { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);
    grid-template-rows:auto auto minmax(0,1fr) auto; column-gap:clamp(34px,4vw,72px);
    align-content:stretch; }
  .module-meta, .module-panel > h3 { grid-column:1 / -1; }
  .module-panel > p { grid-area:3 / 1 / 4 / 2; }
  .module-panel > ul { grid-area:3 / 2 / 5 / 3; margin-block:0 24px; }
  .module-outcome { grid-area:4 / 1 / 5 / 2; align-self:end; margin-top:0; }
}
@media (min-width:2200px) {
  .hero-grid { grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); }
  .cinema-art { height:min(38vw,990px); }
  .cinema-surface { width:150%; max-width:1380px; }
  .storyboard-top { align-items:center; }
  .storyboard-top > p { max-width:62ch; }
  .film-card { flex-basis:clamp(390px,18vw,510px); }
  .module-panel { min-height:700px; }
}

/* Tablet: preserve readable copy and avoid cramped multi-column cards. */
@media (min-width:701px) and (max-width:1100px) {
  :root { --gutter:24px; }
  .hero-grid { grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:24px; }
  .hero h1 { font-size:clamp(46px,5.2vw,58px); }
  .hero-lead { font-size:20px; }
  .hero-description { font-size:19px; }
  .cinema-art { height:clamp(360px,49vw,500px); }
  .cinema-surface { width:146%; }
  .cinema-preview { left:4%; right:-2%; }
  .cinema-orbit { gap:7px; padding:8px 10px; }
  .cinema-orbit strong { font-size:16px; }
  .orbit-one, .orbit-three { right:0; }
  .numbers-grid { gap:24px; }
  .section { padding-block:74px; }
  .method-layout, .format-layout, .faq-layout { gap:34px; }
  .method-list { display:block; }
  .method-list > div, .method-list > div:first-child {
    display:flex; padding:20px 0!important; border:0; border-bottom:1px solid #c7b4d736;
  }
  .method-list > div > span { display:block; margin:0; }
  .curriculum { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); }
  .module-tabs { padding-inline:18px; }
  .module-tabs button { gap:12px; }
  .module-panel { min-height:620px; padding:28px; }
  .toolkit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .authors-grid { gap:16px; }
  .author-card { padding:18px; }
}

/* Phone: retain the original stacked interaction patterns with wider gutters. */
@media (max-width:700px) {
  :root { --gutter:clamp(16px,5vw,20px); }
  .container { width:100%; padding-inline:var(--gutter); }
  .hero { padding-top:70px; }
  .hero-content { padding-top:26px; }
  .hero-grid { gap:26px; }
  .hero h1 { font-size:clamp(41px,10.2vw,64px); }
  .hero-description { max-width:62ch; font-size:18px; }
  .hero-lead { font-size:20px; }
  .hero-buttons .button, .hero-buttons .text-link { font-size:16px; }
  .cinema-art { height:clamp(350px,100vw,430px); max-width:100%; }
  .cinema-surface { width:128%; }
  .cinema-preview { left:3%; right:1%; bottom:0; gap:10px; }
  .numbers-grid { gap:23px 17px; }
  .numbers-grid > div { min-width:0; }
  .section-heading .lead, .lead, .method .lead, .format .lead { max-width:62ch; font-size:18px; }
  .toolkit .section-heading h2 { text-wrap:balance; }
  .track-tabs button { min-height:92px; padding:12px 10px; font-size:16px; }
  .storyboard { padding:23px 17px; }
  .frame-selector { grid-template-columns:1fr; }
  .frame-art { height:110px; }
  .film-rail { gap:14px; padding:5px 4px 22px; margin:0; scroll-padding-inline:4px; }
  .film-card { flex:0 0 78%; min-width:0; }
  .film-poster { aspect-ratio:9 / 16; }
  .film-card > strong { font-size:19px; }
  .film-card > span:last-child, .media-note { font-size:18px; }
  .method-layout, .format-layout, .faq-layout { grid-template-columns:1fr; }
  .method-list { display:block; }
  .method-list > div, .method-list > div:first-child {
    display:flex; padding:20px 0!important; border:0; border-bottom:1px solid #c7b4d736;
  }
  .curriculum { grid-template-columns:1fr; }
  .module-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .toolkit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .authors-grid { grid-template-columns:1fr; }
  .author-photo { max-width:min(100%,360px); max-height:none; aspect-ratio:1; }
  .final-cta > .container { display:block; }
  .final-cta h2 { font-size:clamp(42px,10vw,64px); }
  .final-copy { display:block; margin-top:25px; }
  .final-copy > p { max-width:62ch; font-size:18px; }
  .final-cta .signup-panel { margin:32px auto 0; }
}
@media (max-width:390px) {
  .hero h1 { font-size:41px; }
  .cinema-art { height:350px; }
  .film-card { flex-basis:82%; }
  .frame-art { height:108px; }
}