/* Phone and tablet refinements. The desktop styles remain in their original files. */

@media(max-width:900px){
  html{scroll-padding-top:90px}
  .nav-wrap{height:74px;gap:12px}
  .nav-actions{gap:8px;flex-shrink:0}
  .nav-actions>.button{min-height:44px;font-size:.8125rem;padding:10px 12px}
  .menu-toggle{width:44px;height:44px;flex:0 0 44px;padding:11px}
  .mobile-nav{max-height:calc(100svh - 74px);overflow-y:auto;padding:8px 24px 16px}
  .mobile-nav a{min-height:44px;padding:10px 0;display:flex;align-items:center}
  .mobile-nav .schools-nav-link{padding:10px 0}
  .hero{grid-template-columns:minmax(0,1fr);gap:32px;align-items:start}
  .hero>*{min-width:0}
  .hero h1.board-headline{font-size:clamp(2.1rem,7.9vw,3.35rem);line-height:1.14}
  .board-session{font-size:1rem;line-height:1.6}
  .hero-copy{max-width:650px}
  .hero-actions{flex-direction:row;align-items:center;gap:14px 20px}
  .hero-cta .hero-actions{flex-direction:column;align-items:stretch;gap:10px}
  .hero-actions .text-link{min-height:44px}
  .demo-outer{max-width:650px;width:100%;padding:16px 14px;scroll-margin-top:0}
  .demo-label{display:inline;font-size:.6875rem}
  .demo-top{justify-content:space-between;gap:10px;padding:12px 14px 10px}
  .class-toggle button{min-height:44px;padding:9px 11px;font-size:.8125rem}
  #walkthrough .demo-tabs{margin-inline:14px;gap:5px}
  #walkthrough .demo-tabs button{min-height:54px;font-size:.8125rem;line-height:1.5}
  #walkthrough .demo-panel,#walkthrough .demo-panel[data-real-answer="true"]{min-height:0;padding:18px 16px}
  .real-answer-meta{font-size:.75rem;line-height:1.6}
  .answer-proof-heading{align-items:flex-start}
  .vedora-grade>span{font-size:.625rem;letter-spacing:.035em}
  .answer-sheet-proof figcaption{font-size:.75rem;flex-wrap:wrap;gap:4px 12px}
  .answer-sheet-proof figcaption a{display:inline-flex;align-items:center;min-height:44px}
  .answer-source-links{font-size:.8125rem;gap:0 16px;margin-top:4px}
  .answer-source-links a{display:inline-flex;align-items:center;gap:5px;min-height:44px}
  .grading-preview-caption{font-size:.6875rem}
  .grading-preview-caption a{display:inline-flex;align-items:center;gap:5px;min-height:44px;font-size:.75rem}
  .product-grading-preview .result-card{padding:15px 13px}
  .product-grading-preview .banner{padding:11px 12px;font-size:.9375rem;line-height:1.7}
  .grading-correction>span{font-size:.6875rem}
  .answer-grading-details summary{min-height:44px;font-size:.875rem;padding-block:10px}
  .answer-grading-body,.answer-grading-body h4{font-size:.9375rem;line-height:1.75}
  .answer-grading-body p{font-size:.9375rem}
  .demo-next{min-height:44px;display:inline-flex;align-items:center;gap:9px;text-align:left;font-size:.875rem}
  .demo-bottom{line-height:1.6}
  .real-answer-options .answer-choice>span:last-child{min-width:0;overflow-wrap:anywhere}
  .distance-practice-question strong{white-space:normal}
  .practice-sheet-selector{flex-wrap:wrap;gap:10px 14px}
  .practice-class button{min-height:44px;font-size:.875rem;padding:8px 12px}
  .practice-sheet-heading{flex-wrap:wrap;gap:6px 13px}
  .practice-sheet-heading>span:last-child{margin-left:auto;font-size:.8125rem}
  .practice-question-tools{gap:0 18px}
  .practice-question-content details{margin-top:3px}
  .practice-question-content summary{display:flex;align-items:center;gap:7px;min-height:44px;padding-block:6px;font-size:.875rem;line-height:1.5}
  .practice-question-content details>p,.practice-solution-steps{font-size:.9375rem;line-height:1.8}
  .practice-feedback-invite{padding:23px}
  .practice-feedback-copy,.practice-feedback-action{font-size:.9375rem}
  .school-invite-cta{min-height:49px}
  .faq-list summary{min-height:52px}
  .footer>div{gap:4px 16px}
  .footer>div a{display:inline-flex;align-items:center;min-height:44px;font-size:.8125rem}
}

@media(max-width:680px){
  .hero{padding-top:30px;padding-bottom:38px}
  .hero-copy .eyebrow{margin-bottom:18px}
  .hero-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
  .hero-actions>.button{width:100%;min-height:50px}
  .hero-actions>.text-link{justify-content:center}
  .hero-cta .hero-actions>.text-link{justify-content:flex-start}
  .hero-meta{font-size:.875rem}
  .demo-caption{font-size:.6875rem;letter-spacing:.035em;line-height:1.6;align-items:flex-start}
  .hero-benefit-controls button>span:nth-child(2){min-width:0}
  .hero-benefit-controls small{font-size:.875rem}
  .benefit-arrow{flex:0 0 auto;padding-inline:0}
  .section-heading h2,.vision-section h2,.faq-section h2{font-size:clamp(2rem,7vw,2.75rem)}
  .scope-strip{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:20px}
  .scope-strip>span{grid-column:auto}
  .scope-strip>div{justify-self:end}
  .next-practice-layout{gap:24px}
  .next-practice-heading h2{font-size:2.35rem;line-height:1.2}
  .next-practice-section .focus-note{margin-top:38px}
  .schools-invitation{padding:26px 20px;gap:23px}
  .school-invite-copy .button{width:100%}
  .final-cta .cta-top{flex-wrap:wrap}
  .final-cta .cta-top .eyebrow{max-width:none}
}

@media(max-width:480px){
  .journey-stage{grid-template-columns:minmax(0,1fr);gap:10px;padding-left:18px}
  .journey-art{max-width:210px}
  .journey-caption{max-width:310px;width:100%;margin-inline:auto;padding-bottom:10px}
  .journey-caption h3{font-size:1.125rem;line-height:1.4}
  .journey-caption p{font-size:.9375rem;line-height:1.7;max-width:none}
  .journey-number{top:20px}
  .learning-journey:before,.has-journey-motion .learning-journey:after{bottom:110px}
  .journey-stages{gap:22px}
}

@media(max-width:370px){
  .nav-wrap{gap:9px}
  .brand>span{font-size:1.5rem}
  .brand img{width:24px;height:24px}
  .nav-actions>.button{font-size:.75rem;padding-inline:9px}
  .demo-outer{padding:14px 10px}
  .demo-top{padding-inline:10px}
  .class-toggle button{padding-inline:8px}
  #walkthrough .demo-panel,#walkthrough .demo-panel[data-real-answer="true"]{padding-inline:12px}
  #walkthrough .demo-tabs{margin-inline:10px}
  .answer-proof-heading h3{font-size:1.25rem}
  .practice-sheet-selector>.practice-class{margin-left:auto}
  .practice-feedback-invite{padding:21px}
}