/* APN presentation system — homepage, both Studios, and their lesson readers. */
:root{
  --apn-gutter:clamp(16px,3.5vw,44px);
  --apn-width:1280px;
  --apn-section:clamp(48px,6vw,88px);
  --apn-card:clamp(20px,2.5vw,32px);
  --apn-radius:12px;
  --apn-line:#c8d3df;
  --apn-muted:#4d5e68;
  --apn-title:clamp(2.25rem,4.2vw,3.75rem);
  --apn-section-title:clamp(1.8rem,3.1vw,2.75rem);
}
:is(.home-page,.studio-page,.reason-page){font-family:var(--font-body,Arial,Helvetica,sans-serif);line-height:1.65}
:is(.home-page,.studio-page,.reason-page) .shell{width:min(calc(100% - var(--apn-gutter) * 2),var(--apn-width))}
:is(.home-page,.studio-page,.reason-page) :is(h1,h2,h3,h4){text-wrap:balance}
:is(.studio-page,.reason-page) :is(button,select,input){font:inherit;min-height:46px}
:is(.studio-page,.reason-page) input[type=radio]{min-height:0}
:is(.home-page,.studio-page,.reason-page) :is(a,button,summary,select,input):focus-visible{outline:3px solid #213fc9;outline-offset:4px}
:is(.home-page,.studio-page,.reason-page) :is(button,select,input){max-width:100%}
:is(.home-page,.studio-page,.reason-page) .site-header{background:#f4f3ed}
:is(.home-page,.studio-page,.reason-page) .header-inner{min-height:84px;height:auto;padding-block:14px;gap:24px;flex-wrap:nowrap}
:is(.home-page,.studio-page,.reason-page) .header-note{font-size:.8125rem;letter-spacing:0;text-transform:none;font-weight:500}
:is(.home-page,.studio-page,.reason-page) .site-header nav{gap:22px;margin-left:auto}
:is(.home-page,.studio-page,.reason-page) .site-header nav a{font-size:.875rem;letter-spacing:0;text-transform:none;padding:11px 0;min-height:44px;display:inline-flex;align-items:center}
.page-skip{position:absolute;top:-100px;left:20px;background:#213fc9;color:#fff;padding:12px 18px;z-index:20}.page-skip:focus{top:12px}
.mobile-navigation{display:none;position:relative;margin-left:auto}.mobile-navigation summary{cursor:pointer;min-height:44px;padding:10px 15px;border:1px solid #bdc8cf;border-radius:7px;color:#213fc9;font-weight:700}
:is(.home-page,.studio-page,.reason-page) .mobile-navigation nav{position:absolute;right:0;top:calc(100% + 8px);z-index:10;display:grid;gap:0;width:min(280px,calc(100vw - 32px));padding:9px 16px;border:1px solid #c8d3df;border-radius:10px;background:#fff;box-shadow:0 14px 32px #15232d1a}
:is(.home-page,.studio-page,.reason-page) .mobile-navigation nav a{display:block;margin:0;padding:12px 6px;border-bottom:1px solid #e1e6ec;min-height:46px}
:is(.home-page,.studio-page,.reason-page) .mobile-navigation nav a:last-child{border-bottom:0;display:block}
/* A concrete introduction with two real learning previews. */
.home-page .hero{padding-block:clamp(48px,6vw,82px)}
.home-page .hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:clamp(28px,5vw,72px)}
.home-page .hero-copy .overline{font-size:.75rem;letter-spacing:.07em;margin-bottom:25px;line-height:1.5}
.home-page .hero-copy h1{font-size:clamp(2.75rem,4.8vw,4.75rem);line-height:1.05;letter-spacing:-.058em;margin-bottom:25px;max-width:17ch}
.home-page .hero-copy h1 em{font-family:var(--font-display,Arial);font-style:normal;font-weight:650;letter-spacing:inherit}
.home-page .hero-intro{font-size:clamp(1.0625rem,1.5vw,1.25rem);line-height:1.65;max-width:52ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.apn-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:48px;padding:12px 18px;border:1px solid #213fc9;border-radius:7px;background:#213fc9;color:#fff;font-size:.9375rem;font-weight:700;text-decoration:none;line-height:1.35}
.apn-button.secondary{background:transparent;color:#213fc9}.apn-button:hover{background:#1833b2;color:#fff}
.hero-availability{color:#53636b;font-size:.8125rem;line-height:1.6;max-width:52ch;margin:16px 0 0}
.hero-experiences{background:#fff;border:1px solid #bdc8cf;border-radius:14px;padding:16px;box-shadow:0 18px 50px #15232d0d,8px 8px 0 #e9f45a;min-width:0}
.experience-window-top{display:flex;align-items:center;gap:10px;padding:2px 2px 15px;font-size:.8125rem;border-bottom:1px solid #d6dfe6}
.window-mark{display:grid;place-items:center;background:#213fc9;color:white;width:28px;height:28px;font-size:.75rem;font-weight:800;border-radius:4px}
.live-pill{margin-left:auto;font-size:.6875rem;color:#205839;background:#edf7ef;padding:4px 8px;border-radius:20px;font-weight:700;white-space:nowrap}
.hero-experience{display:block;padding:19px 18px 14px;border-radius:9px;margin-top:13px;text-decoration:none;transition:box-shadow .18s}
.hero-experience:hover{box-shadow:inset 0 0 0 2px #213fc9}.hero-experience.speaking{background:#fff0e9}.hero-experience.reasoning{background:#edf2ff}
.experience-label{display:block;color:#213fc9;font-size:.6875rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-bottom:9px}
.hero-experience>strong{display:block;font-size:1.2rem;line-height:1.35;letter-spacing:-.025em;max-width:28ch}
.hero-experience blockquote{margin:12px 0;padding:0 0 0 12px;border-left:3px solid #df7453;font-size:.9375rem;line-height:1.55;color:#45545e}
.experience-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:.75rem;color:#213fc9;font-weight:700;margin-top:13px}.experience-bottom b{font-size:1.2rem}
.hero-bars{padding:3px 0 0;margin:12px 0;border-left:1px solid #8494b9}
.hero-bars>div{margin:8px 0}.hero-bars span{font-size:.75rem;display:block;padding-left:10px;margin-bottom:4px}.hero-bars i{display:block;height:12px;background:#213fc9;border-radius:0 3px 3px 0}
.experience-subjects{display:flex;flex-wrap:wrap;gap:7px;padding:15px 2px 1px}.experience-subjects a{border:1px solid #d3dbe1;border-radius:5px;padding:7px 9px;font-size:.75rem;font-weight:600;text-decoration:none;min-height:44px}.experience-subjects a:hover{background:#f0f3f8}
.home-page .signal-inner>div{padding-block:18px;gap:14px}.home-page .signal-inner strong{font-size:clamp(1.5rem,2.7vw,2.35rem);letter-spacing:-.05em}.home-page .signal-inner span{font-size:.6875rem;letter-spacing:.02em;max-width:180px}
/* Product identities, benefit, preview, and action share one composition. */
.home-page .portfolio-intro{padding-block:var(--apn-section);gap:30px 6vw;align-items:center}
.home-page .portfolio-intro h2,.home-page .mission h2,.home-page .approach h2,.home-page .passport-copy h2,.home-page .community-intro h2,.home-page .audience-heading h2{font-size:var(--apn-section-title);line-height:1.12;letter-spacing:-.045em}
.home-page .portfolio-intro h2 em,.home-page .mission h2 em,.home-page .approach h2 em{font-family:var(--font-display,Arial);font-style:normal;letter-spacing:inherit;font-weight:600}
.home-page .portfolio-intro>p{font-size:1.0625rem;line-height:1.7;max-width:56ch}
.home-page .portfolio-nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:0;margin-top:12px}
.home-page .portfolio-nav a:nth-child(n){grid-template-columns:26px minmax(0,1fr) 18px;border:1px solid #c5d0d8;border-radius:9px;padding:21px 18px;gap:12px;background:#fff;align-items:start;min-width:0;transition:box-shadow .18s,border-color .18s}
.home-page .portfolio-nav a:hover{border-color:#213fc9;box-shadow:0 5px 16px #15232d08}
.home-page .portfolio-nav-copy strong{font-size:1.1rem;line-height:1.3;letter-spacing:-.02em}
.home-page .portfolio-nav-copy small{font-size:.8125rem;line-height:1.5;margin-top:10px}
.portfolio-card-status{display:inline-block;font-size:.6875rem;color:#213fc9;border-radius:4px;background:#edf2ff;padding:3px 6px;margin-top:9px;line-height:1.4;font-weight:700}
.home-page .feature{padding-block:var(--apn-section)}
.home-page .feature-heading{padding-top:0;border-top:0;margin-bottom:30px;align-items:start}
.home-page .section-label{font-size:1.125rem;font-family:var(--font-display,Arial);letter-spacing:-.025em;text-transform:none;font-weight:700;line-height:1.4}
.product-status{flex-shrink:0;border:1px solid #ffffff60;background:#ffffff12;color:inherit;padding:5px 10px;font-size:.6875rem;border-radius:20px;font-weight:700;line-height:1.5}
.feature-communication .product-status,.feature-visual .product-status{border-color:#15232d50;background:#ffffff70;color:#15232d}
.product-audience{font-size:.8125rem;line-height:1.5;opacity:.9;margin:0 0 15px;font-weight:600}
.home-page .feature-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,68px);align-items:center}
.home-page .feature-copy h2{font-size:clamp(2rem,3.3vw,3.125rem);line-height:1.12;letter-spacing:-.045em;font-family:var(--font-display,Arial);text-transform:none;margin:0 0 22px;font-weight:750}
.home-page .feature-copy h2 em{font-family:inherit;font-size:inherit;font-style:normal;font-weight:600;letter-spacing:inherit;line-height:inherit}
.home-page .feature-lead{font-size:1.0625rem;line-height:1.7;margin-bottom:24px;max-width:58ch}
.home-page .chem-grid .feature-copy,.home-page .chem-grid .product-figure{order:initial}
.product-details{border-block:1px solid #ffffff45;margin:20px 0 0;max-width:640px}
.product-details summary{cursor:pointer;padding:13px 0;font-size:.9375rem;font-weight:700;min-height:48px}
.home-page .product-details .detail-stack{border-top:0}.home-page .product-details .detail-stack>div:last-child{border-bottom:0}
.feature-communication .product-details,.feature-visual .product-details{border-color:#15232d55}
.home-page .action{font-family:var(--font-body,Arial);text-transform:none;letter-spacing:0;font-size:.9375rem;min-height:48px;border-radius:7px;padding:13px 18px;gap:22px;margin-top:24px;transition:background .18s}
.home-page .action:hover{transform:none;filter:brightness(.97)}
.product-availability{font-size:.8125rem;opacity:.85;margin:12px 0 0;line-height:1.6}
.product-story-link{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:.875rem;text-underline-offset:4px;margin-top:19px}
.home-page :is(.screen-frame,.knight-preview,.titan-map){border-radius:12px;box-shadow:0 15px 35px #00000015,8px 8px 0 #00000017}
.home-page .product-figure{min-width:0;width:100%;max-width:none;justify-self:stretch}
.home-page .product-figure figcaption{font-size:.8125rem;line-height:1.6;margin-top:18px;max-width:62ch}
.screenshot-link{display:block}.screenshot-link:focus-visible{outline-offset:-4px!important}.screenshot-zoom{display:flex;align-items:center;justify-content:end;gap:10px;min-height:44px;padding:9px 14px;background:#fff;color:#213fc9;font-size:.75rem;font-weight:700;text-underline-offset:3px;border-top:1px solid #d8e0e8}
.home-page .screen-top{font-size:.6875rem;height:38px}.home-page .screen-top-end{font-size:.625rem}
.home-page .knight-preview-top,.home-page .titan-map-top{font-size:.6875rem;letter-spacing:.02em;flex-wrap:wrap;text-transform:none}
.home-page .knight-coach-card{border-radius:6px;box-shadow:none}.home-page .knight-coach-label,.home-page .knight-coach-prompt{font-size:.6875rem;letter-spacing:.02em}
.home-page .knight-coach-card strong{font-size:clamp(1.25rem,2vw,1.65rem);letter-spacing:-.025em}
.home-page .knight-coach-card p{font-size:.9375rem}.home-page .knight-preview-bottom,.home-page .titan-map-bottom{font-size:.6875rem;letter-spacing:.025em}
.home-page :is(.subject-grid,.chem-capabilities,.knight-learning-rhythm,.titan-learning-rhythm){margin-top:48px}
.home-page .subject-symbol{font-size:2rem;margin-bottom:18px}.home-page .chem-capabilities span{margin-bottom:20px}
.home-page :is(.subject-grid,.chem-capabilities,.knight-learning-rhythm,.titan-learning-rhythm) strong{font-size:1.125rem;line-height:1.4;letter-spacing:-.025em}
.home-page .communication-preview,.home-page .visual-preview{padding:var(--apn-card);border:1px solid #15232d35;border-radius:12px;box-shadow:8px 8px 0 #15232d12;max-width:none;width:100%}
.preview-top{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid #cbd4dc;padding-bottom:14px;margin-bottom:22px;color:#53636b;font-size:.6875rem;line-height:1.5}
.home-page .communication-preview h3,.home-page .visual-preview h3{font-size:clamp(1.5rem,2.5vw,2.2rem);line-height:1.2;letter-spacing:-.035em;margin-bottom:20px}
.home-page .communication-preview-label,.home-page .visual-preview-label{font-size:.75rem!important;margin-bottom:13px;line-height:1.5}
.home-page .communication-preview blockquote{background:#f5f7fc;border-left:3px solid #213fc9;padding:14px 16px;margin:16px 0;font-size:1rem}
.home-page .communication-preview>p,.home-page .visual-preview>p{font-size:1rem;line-height:1.65}
.preview-choices{display:grid;gap:9px;margin:20px 0}.preview-choices>div{display:flex;align-items:start;gap:11px;padding:12px;border:1px solid #c8d3df;border-radius:7px;font-size:.9375rem;line-height:1.5}
.preview-choices span{color:#213fc9;font-weight:700}.preview-link,.home-page .visual-preview a{display:inline-flex;align-items:center;gap:15px;min-height:44px;color:#213fc9;font-size:.9375rem;font-weight:700;text-underline-offset:4px}
.home-page .studio-product-figure figcaption{color:#35454e}
.home-page :is(.mission,.nexus-passport,.community,.approach,.audience-paths){padding-block:var(--apn-section)}
.home-page .mission-kicker .overline{margin-bottom:25px}.home-page .mission-mark{width:46px;height:46px;font-size:1.125rem}
.home-page .mission-copy,.home-page .passport-inner,.home-page .community-inner,.home-page .approach-inner{gap:clamp(30px,5vw,68px)}
.home-page .mission-body p,.home-page .approach-intro p,.home-page .passport-copy>p:not(.overline){font-size:1.0625rem;line-height:1.7;max-width:62ch}
.home-page .approach-steps{margin-top:38px}.home-page .overline{margin-bottom:22px;letter-spacing:.07em}
/* Studio headings, library cards, and fixed practice panels. */
:is(.studio-page,.reason-page){background:#f4f6fa}
:is(.studio-page,.reason-page) :is(.studio-intro,.reason-intro){padding-block:clamp(30px,4vw,52px);align-items:center;gap:32px}
:is(.studio-page,.reason-page) :is(.studio-intro h1,.reason-intro h1,.reader-title h1,.reason-reader h1){font-size:var(--apn-title);line-height:1.1;letter-spacing:-.045em;margin-bottom:16px}
:is(.studio-page,.reason-page) :is(.studio-intro>div>p:last-child,.reason-intro>div>p:last-child){font-size:1.125rem;line-height:1.65;max-width:60ch}
.studio-page .studio-intro-note{max-width:340px;min-width:260px;padding:22px;border:1px solid #c8d3df;border-radius:10px;background:white}
.studio-intro-note p{font-size:1rem;line-height:1.6;margin:12px 0 16px;color:#4d5e68}
.studio-free-label{font-size:.6875rem;font-weight:800;letter-spacing:.055em;text-transform:uppercase;color:#213fc9}
.studio-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;border-top:1px solid #d8e0e8;padding-top:13px}
.studio-metrics span{font-size:.6875rem;line-height:1.4;color:#53636b}.studio-metrics strong{display:block;font-size:1.4rem;line-height:1.3;color:#15232d}
.reason-page .reason-links{max-width:280px;background:white;padding:20px 22px;border:1px solid #c8d3df;border-radius:10px;flex-shrink:0;font-size:.9375rem}
.reason-page .reason-links a{min-height:44px;display:flex;align-items:center;margin:0 0 10px;font-weight:600}
.studio-page .studio-views{gap:10px;padding-bottom:28px;flex-wrap:wrap}
.studio-page .studio-views button{border-radius:7px;min-height:48px;font-size:.9375rem}
.studio-page .catalog-section,.studio-page .planner-section{padding-block:22px 56px}
.studio-page .catalog-heading h2,.studio-page .planner-section h2,.studio-page .studio-section-head h2,.reason-page .reason-library h2,.reason-page .reason-guidance h2{font-size:var(--apn-section-title);letter-spacing:-.04em;line-height:1.2}
.studio-page .catalog-heading>div>p{max-width:62ch;font-size:1rem;line-height:1.7}
.studio-page .catalog-controls{padding:22px;border-radius:10px;gap:18px;background:#fff;border:1px solid #c8d3df}
.studio-page :is(.catalog-controls input,.catalog-controls select,.planner-section>select){border-radius:7px;min-height:46px}
.studio-page .catalog-card,.reason-page .module-card{padding:var(--apn-card);border-radius:10px;border:1px solid #c8d3df;border-top:4px solid #213fc9;box-shadow:0 6px 16px #15232d04;transition:border-color .18s,box-shadow .18s}
.studio-page .catalog-card:hover,.reason-page .module-card:hover{border-color:#213fc9;box-shadow:0 8px 20px #15232d09}
.studio-page .catalog-card h3,.reason-page .module-card h4{font-size:1.2rem;line-height:1.35;letter-spacing:-.025em}
.studio-page .catalog-card p,.reason-page .module-card p{font-size:1rem;line-height:1.65}
.reason-page .module-actions a{min-height:44px;display:inline-flex;align-items:center;font-weight:600}
.studio-page :is(.skill-map,.library-help){border-radius:9px}.studio-page .library-help summary,.reason-page .reason-guidance summary{min-height:48px;padding-block:14px;line-height:1.5}
.studio-page .argument-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.studio-page .argument-flow>div{padding:22px;border-radius:10px;border-top:3px solid #213fc9}
.studio-page .argument-flow>div::after{display:none}.studio-page .argument-flow>div:last-child{grid-column:1/-1}
.studio-page .argument-flow .fixed-options legend{min-height:0}
.studio-page .argument-preview{border-radius:0 10px 10px 0;margin-bottom:25px}.studio-page .argument-preview>p{max-width:72ch}
.studio-page .studio-controls,.reason-page .reason-controls{border-radius:10px;padding:22px 24px;gap:22px}
.reason-page .reason-controls{grid-template-columns:minmax(160px,.5fr) minmax(0,1fr)}
.reason-page .reason-controls select{border-radius:7px}
.studio-page .studio-layout{grid-template-columns:240px minmax(0,1fr);gap:24px}
.studio-page .activity-list button{min-height:52px;border-radius:8px;line-height:1.4;font-weight:600;padding:15px 17px}
.studio-page .studio-activity,.reason-page .reason-workspace{border-radius:12px;border-color:#c8d3df;box-shadow:0 8px 24px #15232d05}
.studio-page .studio-activity{padding:var(--apn-card)}
.studio-page .activity-heading h2,.reason-page .reason-lesson-head h2{font-size:clamp(1.65rem,2.7vw,2.3rem);line-height:1.2;letter-spacing:-.035em}
.practice-kicker{font-size:.75rem;font-weight:800;color:#213fc9;letter-spacing:.065em;text-transform:uppercase;margin:0 0 10px}
.studio-page .practice-stages,.reason-page .case-tabs{gap:8px;border-bottom:0;padding-bottom:8px;counter-reset:practice-step}
.studio-page .practice-stages button,.reason-page .case-tabs button{counter-increment:practice-step;background:#f3f6fc;border:1px solid #c8d3df;border-radius:7px;padding:12px;font-size:.875rem;line-height:1.45;min-height:55px}
.studio-page .practice-stages button::before,.reason-page .case-tabs button::before{content:counter(practice-step,decimal-leading-zero) ' / ';font-size:.75rem;font-weight:800}
.studio-page .practice-stages button[aria-pressed=true],.reason-page .case-tabs button[aria-pressed=true]{background:#213fc9;color:white;border-color:#213fc9;box-shadow:none}
.reason-page .case-tabs button[aria-pressed=true] small{color:#e4eaff}
.studio-page .prompt-top{padding:12px 0;border-top:1px solid #d8e0e8}.studio-page .prompt-top button{min-height:44px;padding:8px 0}
.studio-page .worked-comparison>div{border-radius:9px;padding:20px;background:#f7f9fc;border:1px solid #c8d3df}
.studio-page .worked-comparison>div:last-child{border-color:#c8d3df;background:#f7f9fc}
.studio-page .worked-comparison h4{color:#213fc9;font-size:.8125rem;letter-spacing:.02em}
.studio-page .worked-comparison p{font-size:1rem;line-height:1.7}
.studio-page :is(.studio-button,.studio-secondary,.resource-practice),.reason-page .reason-btn{font-size:.9375rem;padding:12px 17px;border-radius:7px;min-height:46px;line-height:1.4;font-weight:700;text-decoration:none}
.studio-page #stage-practice{background:#f7f9fc;padding:22px;border:1px solid #d5dfea;border-radius:10px}
.reason-page .reason-lesson-head{padding:26px 28px 8px}.reason-page .reason-lesson-head a{white-space:normal;max-width:180px;min-height:44px;line-height:1.5;font-weight:600}
.reason-page .reason-lab{padding:28px;gap:28px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start}
.reason-page .visual-pane{background:#f7f9fc;border:1px solid #d3dce9;border-radius:10px;padding:22px;min-width:0}
.reason-page .visual-pane>.practice-kicker,.reason-page .question-pane>.practice-kicker{margin-bottom:12px}
.reason-page .visual-surface{padding:8px 4px 0;border-radius:7px;background:white}
.reason-page .question-pane h3{font-size:1.2rem;line-height:1.45;letter-spacing:-.02em}
.reason-page .answer-options label{border-radius:8px;padding:14px;font-size:1rem;line-height:1.55;background:white}
.reason-page .answer-options label:has(input:checked){border-color:#213fc9;background:#edf2ff;box-shadow:inset 3px 0 #213fc9}
.reason-page .answer-options label[data-result=correct]{border-color:#246646;background:#edf7ef;box-shadow:inset 3px 0 #246646}
.reason-page .answer-options label[data-result=retry]{border-color:#a05719;background:#fff5e8;box-shadow:inset 3px 0 #a05719}
.reason-page .answer-options input{min-height:0}
.reason-page .reason-feedback:empty{display:none}.reason-page .reason-feedback[data-state]{border:1px solid #c8d3df;border-radius:7px;padding:15px;font-size:.9375rem;line-height:1.6}
.reason-page .reason-feedback[data-state=correct]{background:#edf7ef;border-color:#92bda1;color:#205839}.reason-page .reason-feedback[data-state=retry]{background:#fff5e8;border-color:#d9af79;color:#794213}
.reason-page .reason-feedback[data-state=empty]{background:#f3f6fc;color:#53636b}
.reason-page .hint-output{padding:16px 18px;border-radius:0 7px 7px 0;line-height:1.7}
.reason-page .hint-output::before{content:'Hint';display:block;color:#213fc9;font-size:.75rem;font-weight:800;letter-spacing:.065em;text-transform:uppercase;margin-bottom:7px}
.reason-page .explanation-box{padding-top:22px;border-top:1px solid #d3dce9}.reason-page .explanation-box::before{content:'03 / Check the rule';display:block;font-size:.75rem;font-weight:800;letter-spacing:.065em;text-transform:uppercase;color:#213fc9}
.reason-page .worked-answer{border:1px solid #c8d3df;background:#fff;border-radius:8px;padding-inline:16px}.reason-page .worked-answer summary{min-height:48px;line-height:1.5;padding-block:13px}
.reason-page .worked-answer p{line-height:1.7}.reason-page .lesson-principle{padding:0 28px 26px}.reason-page .reflection{padding:23px 28px;background:#f4f7e6}
.reason-page .reason-library,.reason-page .reason-guidance{padding-block:48px}.reason-page .reason-library>p{max-width:76ch}
/* Readable lesson depth with diagrams, comparisons, and expandable context. */
.studio-page .reader,.reason-page .reason-reader{padding-top:36px;padding-bottom:64px}
.reason-page .reason-reader{max-width:1080px}
.studio-page .reader-title{max-width:1000px;padding-bottom:32px}.studio-page .reader-title>p:not(.studio-eyebrow){font-size:1.125rem;line-height:1.7;max-width:64ch}
.studio-page .reader-layout{grid-template-columns:minmax(0,1fr) 220px;gap:34px}
.studio-page .reader-content{border-radius:12px;padding:8px var(--apn-card) 28px}
.studio-page .reader-content>section,.reason-page .reader-section{padding-block:28px;scroll-margin-top:20px}
.studio-page .reader-content h2,.reason-page .reader-section h2{font-size:1.65rem;line-height:1.3;letter-spacing:-.03em}
.studio-page .reader-content p,.studio-page .reader-content li,.reason-page .reader-section p,.reason-page .reader-section li{font-size:1rem;line-height:1.75}
.studio-page .reader-content>section>p,.reason-page .reader-section>p{max-width:72ch}
.studio-page .reader-sidebar{font-size:.875rem}.studio-page .reader-sidebar nav a{min-height:44px}
.studio-page .method-flow li{border-radius:7px;padding:18px;background:#edf2ff}
.example-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0}
.studio-page .example-comparison .attempt-box{margin:0;padding:21px;border:1px solid #c8d3df;background:#f7f9fc;border-radius:8px}
.studio-page .example-comparison h3{font-size:.875rem;color:#213fc9}.studio-page .example-comparison p{font-size:1rem;line-height:1.75;margin:0}
.lesson-depth{border:1px solid #c8d3df;border-radius:8px;background:#f7f9fc;padding:0 17px;margin:18px 0}
.lesson-depth summary{padding:13px 0;min-height:48px;font-size:.9375rem;line-height:1.5;font-weight:700;cursor:pointer;color:#213fc9}
.lesson-depth p{margin:8px 0 18px;max-width:72ch}
.teaching-visual{margin:24px 0;border:1px solid #c8d3df;border-radius:10px;background:#f8faff;padding:22px;min-width:0}
.visual-heading{margin-bottom:17px}.visual-heading>span{font-size:.6875rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#213fc9}
:is(.studio-page,.reason-page) .visual-heading h3{font-size:1.2rem;line-height:1.35;letter-spacing:-.025em;margin:8px 0 0}
.visual-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.visual-note{padding:18px;border:1px solid #d3dce9;background:#fff;border-radius:8px;min-width:0}
.visual-step{display:block;color:#213fc9;font-size:.6875rem;font-weight:800;letter-spacing:.055em;text-transform:uppercase;margin-bottom:11px;line-height:1.5}
.visual-note>strong,.teaching-flow strong{font-size:1rem;line-height:1.5;display:block}
:is(.studio-page,.reason-page) .visual-note p,:is(.studio-page,.reason-page) .teaching-flow p{font-size:.9375rem;line-height:1.65;margin:12px 0 0}
.teaching-visual figcaption{padding-top:15px;margin-top:17px;border-top:1px solid #d3dce9;font-size:.875rem;line-height:1.65;color:#4d5e68}
.teaching-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;list-style:none;padding:0;margin:0}
:is(.studio-page,.reason-page) .teaching-flow li{background:#fff;border:1px solid #d3dce9;border-top:3px solid #213fc9;border-radius:7px;padding:17px;position:relative;margin:0}
.teaching-flow li:not(:last-child)::after{content:'→';position:absolute;right:-20px;top:45%;font-size:1.2rem;color:#213fc9}
.visual-note>.visual-number{font-size:2.75rem;line-height:1.15;letter-spacing:-.04em;color:#213fc9}.visual-number small{font-size:1rem;letter-spacing:0;color:#4d5e68}
.sample-dots{display:grid;grid-template-columns:repeat(5,18px);gap:7px;margin-top:16px}.sample-dots i{width:18px;height:18px;border-radius:50%;background:#213fc9;border:2px solid #213fc9}.sample-dots .unfilled{background:white}
.diagram-symbol{display:block;font-size:3.5rem;color:#213fc9;line-height:1.2;margin-bottom:12px}
.inline-route{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.9375rem;line-height:1.5}.inline-route span{background:#edf2ff;padding:8px;border-radius:5px}.inline-route b{color:#213fc9}
.teaching-bars{margin:12px 0 0;min-width:0}.bar-origin{display:block;font-size:.75rem;font-weight:600;color:#53636b;margin-bottom:11px}.teaching-bars>div{margin:12px 0}.teaching-bars>div>span{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;font-size:.875rem;line-height:1.5}.teaching-bars b{font-weight:700}.teaching-bars i{display:block;height:17px;background:#213fc9;border-radius:0 4px 4px 0;margin-top:6px}
.studio-page .prompt-deck,.studio-page .age-exercise,.reason-page .reader-case{border-radius:9px;padding:22px}
.reason-page .reader-case h4{font-size:1.2rem}.reason-page .claim-critique{border-radius:0 9px 9px 0}
/* Responsive composition: preserve content, stack relationships, keep controls usable. */
@media(max-width:1100px){
  :is(.home-page,.studio-page,.reason-page) .header-note{display:none}
  .home-page .hero-grid{gap:32px}.home-page .hero-copy h1{font-size:clamp(2.75rem,5.5vw,4.2rem)}
  .studio-page .reader-layout{grid-template-columns:minmax(0,1fr) 190px;gap:25px}
  .reason-page .reason-lab{grid-template-columns:1fr;padding:24px}
  .reason-page .visual-pane{max-width:none}.reason-page .visual-surface{max-width:760px;margin-inline:auto}
}
@media(max-width:860px){
  .home-page .hero-grid{display:grid;grid-template-columns:1fr;gap:32px}.home-page .hero-copy h1{font-size:clamp(2.75rem,7.5vw,4.8rem);max-width:15ch}
  .hero-experiences{max-width:670px;width:100%}.home-page .feature-grid{display:grid;grid-template-columns:1fr;gap:30px}
  .home-page .portfolio-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-page .feature-copy h2{max-width:24ch}.home-page .feature-lead{max-width:64ch}
  .home-page .knight-preview-body{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  .studio-page .reader-layout{grid-template-columns:1fr}.studio-page .reader-sidebar{position:static;padding:22px;border-radius:10px;background:#fff;border:1px solid #c8d3df}
  .studio-page .studio-layout{grid-template-columns:1fr}.studio-page .activity-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .studio-page .studio-intro,.reason-page .reason-intro{display:block}.studio-page .studio-intro-note,.reason-page .reason-links{margin-top:22px;min-width:0;max-width:none}
  .studio-page .studio-intro-note{display:none}.reason-page .reason-links{display:flex;gap:16px;flex-wrap:wrap;align-items:center;background:transparent;border:0;padding:0}
  .reason-page .reason-links a{margin:0}.studio-page .method-flow{grid-template-columns:1fr;gap:22px}
  .studio-page .method-flow li:not(:last-child)::after{content:'↓';top:auto;right:50%;bottom:-24px}
}
@media(max-width:700px){
  :is(.home-page,.studio-page,.reason-page) .header-inner{min-height:74px;padding-block:12px;flex-wrap:nowrap;gap:15px}
  :is(.home-page,.studio-page,.reason-page) .header-inner>nav{display:none}
  .mobile-navigation{display:block}
  :is(.home-page,.studio-page,.reason-page) .brand{font-size:12px;gap:10px}
  :is(.home-page,.studio-page,.reason-page) .brand-mark{width:38px;height:38px}
  .home-page .feature-heading{gap:14px}.home-page .product-status{font-size:.625rem;padding:5px 9px}
  .home-page .signal-inner strong{font-size:1.25rem;letter-spacing:-.04em}.home-page .signal-inner span{font-size:.625rem;text-transform:none;font-weight:600;letter-spacing:0}
  .home-page .signal-inner>div{display:block;padding:16px 10px 16px 0}.home-page .signal-inner>div+div{padding-left:12px}.home-page .signal-inner span{display:block;margin-top:6px}
  .teaching-flow{grid-template-columns:1fr;gap:22px}.teaching-flow li:not(:last-child)::after{content:'↓';top:auto;right:50%;bottom:-24px}
  .visual-pair,.example-comparison{grid-template-columns:1fr}
}
@media(max-width:560px){
  .home-page .hero-copy h1{font-size:clamp(2.55rem,9.4vw,3.2rem);letter-spacing:-.05em;margin-bottom:20px}
  .home-page .hero-copy .overline{font-size:.6875rem;margin-bottom:19px;letter-spacing:.03em}
  .home-page .hero-intro{font-size:1.0625rem;line-height:1.65}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:23px}.apn-button{justify-content:space-between}
  .hero-experiences{padding:12px;box-shadow:5px 5px 0 #e9f45a}.experience-window-top{font-size:.75rem;gap:8px}.live-pill{font-size:.625rem;padding-inline:6px}
  .hero-experience{padding:16px 14px 13px}.hero-experience>strong{font-size:1.125rem}.hero-experience blockquote{font-size:.875rem}.experience-subjects{gap:6px}.experience-subjects a{font-size:.6875rem;min-height:44px;align-content:center}
  .home-page .portfolio-nav{grid-template-columns:1fr}.home-page .portfolio-nav a:nth-child(n){padding:18px;min-height:100px}
  .home-page .portfolio-intro{gap:24px}.home-page .portfolio-intro>p{margin-top:20px}
  .home-page .feature-heading{align-items:start}.home-page .section-label{font-size:1rem;max-width:65%}
  .home-page .feature-copy h2{font-size:2rem;line-height:1.15}.home-page .feature-lead{font-size:1rem;line-height:1.7}
  .home-page .product-audience{font-size:.8125rem}.home-page .action{width:100%;justify-content:space-between;margin-top:21px}
  .home-page :is(.subject-grid,.chem-capabilities,.knight-learning-rhythm,.titan-learning-rhythm){margin-top:32px}
  .home-page .knight-preview-body{grid-template-columns:1fr;gap:18px}.home-page .knight-board{max-width:270px;margin-inline:auto}
  .home-page .knight-coach-card{padding:18px}.home-page .knight-coach-card strong{font-size:1.35rem;margin:12px 0}.home-page .knight-coach-card p{font-size:.9375rem}
  .home-page .titan-map svg{min-height:220px}.home-page .titan-node-kicker{display:none}.home-page .titan-node-title{font-size:30px}.home-page .titan-map-top span:first-child{max-width:65%}
  .home-page .communication-preview,.home-page .visual-preview{padding:21px;width:100%;box-shadow:5px 5px 0 #15232d12}
  .home-page .communication-preview h3,.home-page .visual-preview h3{font-size:1.5rem}.preview-top{font-size:.625rem;gap:10px;margin-bottom:18px}
  .home-page .screen-top{font-size:.625rem;padding-inline:9px;gap:9px}.home-page .screen-top-end{display:none}
  .home-page .product-figure figcaption{font-size:.8125rem}
  .home-page .mission h2,.home-page .portfolio-intro h2,.home-page .approach h2,.home-page .passport-copy h2,.home-page .community-intro h2,.home-page .audience-heading h2{font-size:1.95rem}
  .home-page .approach-steps h3{font-size:1.1rem}.home-page .approach-steps p{font-size:.875rem}
  :is(.studio-page,.reason-page) :is(.studio-intro h1,.reason-intro h1,.reader-title h1,.reason-reader h1){font-size:2.15rem}
  .studio-page .studio-views{display:grid;grid-template-columns:1fr;padding-bottom:24px;gap:8px}
  .studio-page .studio-views button{text-align:left;justify-content:start;min-height:46px}
  .studio-page .catalog-controls{padding:18px;gap:14px}.studio-page .catalog-card,.reason-page .module-card{padding:21px}
  .studio-page .argument-flow{grid-template-columns:1fr}.studio-page .argument-flow>div:last-child{grid-column:auto}
  .studio-page .studio-controls,.reason-page .reason-controls{padding:18px}.reason-page .reason-controls{grid-template-columns:1fr;gap:14px}
  .studio-page .studio-activity{padding:19px}.studio-page .activity-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.studio-page .activity-list button{font-size:.875rem;padding:12px;min-height:48px}
  .studio-page .practice-stages{grid-template-columns:1fr;gap:6px}.studio-page .practice-stages button{min-height:46px;padding:11px 13px}
  .studio-page .worked-comparison>div{padding:17px}.studio-page #stage-practice{padding:17px}
  .reason-page .reason-lesson-head{padding:21px 18px 8px}.reason-page .reason-lab{padding:18px;gap:24px}
  .reason-page .visual-pane{padding:16px}.reason-page .visual-surface{padding:8px 0 0}
  .reason-page .case-tabs{padding-inline:18px;display:grid;grid-template-columns:1fr;gap:6px}.reason-page .case-tabs button{display:block;min-height:46px;padding:10px 12px;line-height:1.4}.reason-page .case-tabs small{display:inline;margin-left:8px;font-size:.75rem}
  .reason-page .reason-actions{display:grid;grid-template-columns:1fr 1fr}.reason-page .reason-actions button{font-size:.875rem;padding-inline:11px}
  .reason-page .lesson-principle,.reason-page .reflection{padding-inline:18px}.reason-page .application-nav{padding-inline:18px}
  .studio-page .reader-content{padding-inline:19px}.studio-page .reader-content h2,.reason-page .reader-section h2{font-size:1.5rem}
  .teaching-visual{padding:18px}.visual-note{padding:17px}.studio-page .age-exercise,.reason-page .reader-case{padding:18px}
  :is(.studio-page,.reason-page,.home-page) .footer-links a{min-height:44px;display:inline-flex;align-items:center;font-size:.8125rem}
}
@media(prefers-reduced-motion:reduce){.hero-experience,.home-page .portfolio-nav a,.studio-page .catalog-card,.reason-page .module-card{transition:none}}
@media print{
  .mobile-navigation,.hero-actions,.experience-subjects{display:none!important}
  :is(.studio-page,.reason-page) .shell{width:100%;max-width:none}
  .teaching-visual,.visual-note,.studio-page .reader-content,.reason-page .visual-pane{box-shadow:none;background:white;border-color:#ccc;break-inside:avoid}
  .lesson-depth>p{display:block}.visual-pair,.example-comparison{grid-template-columns:1fr 1fr}.teaching-flow{grid-template-columns:repeat(3,minmax(0,1fr))}
  .teaching-flow li:not(:last-child)::after{content:'→';top:45%;right:-20px;bottom:auto}
  .studio-page .reader-content p,.studio-page .reader-content li,.reason-page .reader-section p,.reason-page .reader-section li{font-size:11pt}
  .reason-page .reason-lab{display:block;padding:0}.reason-page .visual-pane{padding:12px;margin-bottom:20px}.reason-page .reason-workspace{box-shadow:none}
}

/* How Things Work is the subject-led visual learning portfolio entry. */
.home-page .hero-moons{display:block;width:100%;height:64px;margin:12px 0}.home-page .htw-portfolio-preview img{display:block;max-width:100%;width:100%;height:auto;border:1px solid #cbd5df;border-radius:8px;background:#fbfbf7;margin:14px 0}