/* Only the homepage and FAQ opt in. Existing desktop styles stay unchanged. */
@media (max-width:850px), (max-width:950px) and (max-height:500px) and (pointer:coarse) {
  .mobile-site .site-header {
    height:auto;
    min-height:0;
    padding:12px 16px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    justify-content:initial;
  }
  .mobile-site .site-header .brand { justify-self:start; max-width:100%; padding:6px 8px; }
  .mobile-site .site-header .brand-logo { width:136px; max-width:100%; height:42px; }
  .mobile-site .menu-toggle {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-width:88px;
    min-height:48px;
    padding:10px 12px;
    border:1px solid #8fb0ce;
    border-radius:5px;
    background:transparent;
    color:white;
    font-size:16px;
    font-weight:600;
  }
  .mobile-site .menu-toggle[hidden], .mobile-site #site-menu[hidden] { display:none; }
  .mobile-site .menu-toggle:focus-visible { outline-color:white; outline-offset:3px; }
  .mobile-site #site-menu {
    grid-column:1 / -1;
    order:initial;
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:4px;
    padding:8px 0;
    margin:0;
    border-block:1px solid #53708b;
    max-height:calc(100vh - 180px);
    max-height:calc(100svh - 180px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .mobile-site #site-menu a { display:flex; align-items:center; min-height:48px; padding:10px 12px; font-size:16px; border-radius:4px; overflow-wrap:anywhere; }
  .mobile-site #site-menu a:hover, .mobile-site #site-menu a:focus-visible { background:#153e61; color:white; }
  .mobile-site .site-header .account-actions { grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:12px; width:100%; }
  .mobile-site .site-header .account-actions a { justify-content:center; padding:10px 12px; min-height:48px; font-size:15px; text-align:center; }
  .mobile-site .site-header .account-actions .login-link { border:1px solid #8fb0ce; border-radius:4px; }
  .mobile-site .site-header .account-signup span { display:none; }
  .mobile-site .site-header > .button { grid-column:1 / -1; justify-content:center; min-height:48px; font-size:16px; }
  .mobile-site .site-header .menu-toggle { grid-column:2; grid-row:1; }
  .mobile-site main, .mobile-site section, .mobile-site article, .mobile-site footer > *, .mobile-site .hero-copy, .mobile-site .guide-copy { min-width:0; }
  .mobile-site .hero { grid-template-columns:minmax(0,1fr); gap:28px; padding:24px 5% 36px; min-height:0; }
  .mobile-site .hero-copy { padding-top:0; }
  .mobile-site .hero h1 { font-size:clamp(2.5rem,10.4vw,4.1rem); line-height:1.1; letter-spacing:-.04em; margin:22px 0; }
  .mobile-site .hero .eyebrow { font-size:12px; letter-spacing:1px; gap:8px; }
  .mobile-site .hero .line { flex:0 0 20px; }
  .mobile-site .hero p.intro { max-width:40rem; font-size:16px; line-height:1.75; }
  .mobile-site .hero-purchase { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
  .mobile-site .hero-purchase .button, .mobile-site .faq .button, .mobile-site .enroll .button { width:100%; min-height:52px; padding:14px 20px; gap:16px; text-align:left; }
  .mobile-site .hero-purchase .login-link { display:flex; align-items:center; min-height:48px; padding:10px 0; }
  .mobile-site .hero-note { align-items:flex-start; margin-top:20px; }
  .mobile-site .hero-note .seal { flex:0 0 34px; }
  .mobile-site .hero-note p, .mobile-site .hero-note strong { font-size:14px; }
  .mobile-site .hero-visual { min-height:360px; }
  .mobile-site .image-top, .mobile-site .image-bottom { left:20px; right:20px; gap:12px; }
  .mobile-site .image-top { top:20px; font-size:11px; letter-spacing:1px; }
  .mobile-site .image-top > :last-child { flex-shrink:0; }
  .mobile-site .image-bottom { bottom:20px; }
  .mobile-site .image-bottom > span { font-size:clamp(1rem,3vw,1.3rem); line-height:1.5; letter-spacing:.4px; margin-bottom:14px; }
  .mobile-site .slideshow-controls button { min-height:48px; min-width:48px; }
  .mobile-site .strip { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; font-size:12px; padding:18px 6%; letter-spacing:1px; text-align:center; }
  .mobile-site .strip b { display:none; }
  .mobile-site .section { padding:48px 6%; }
  .mobile-site .section-heading, .mobile-site .benefits, .mobile-site .guide-grid, .mobile-site .instructor, .mobile-site .faq { grid-template-columns:minmax(0,1fr); gap:24px; }
  .mobile-site .section-heading { gap:0; }
  .mobile-site .section-heading > p:last-child { max-width:42rem; }
  .mobile-site .section h2, .mobile-site .instructor h2 { font-size:clamp(2rem,7vw,3rem); line-height:1.2; letter-spacing:-.03em; }
  .mobile-site .benefits { margin-top:24px; }
  .mobile-site .benefits h3 { margin-top:16px; }
  .mobile-site .benefits p { font-size:16px; }
  .mobile-site .guide-grid { margin-top:24px; }
  .mobile-site .guide-cover { height:auto; max-height:380px; aspect-ratio:918 / 1188; padding:16px; }
  .mobile-site .guide-copy { padding:22px 18px; }
  .mobile-site .guide-copy h3 { font-size:22px; overflow-wrap:anywhere; }
  .mobile-site .guide-copy .eyebrow { font-size:12px; letter-spacing:1px; }
  .mobile-site .guide-copy summary { min-height:48px; padding:10px 30px 10px 0; line-height:1.5; }
  .mobile-site .guide-copy summary::after { top:6px; }
  .mobile-site .guide-copy details img { max-width:100%; height:auto; }
  .mobile-site .materials-note { font-size:14px; }
  .mobile-site .materials + .instructor { margin-top:40px; }
  .mobile-site .instructor { padding:32px 6%; }
  .mobile-site .instructor h2 { margin-top:18px; }
  .mobile-site .signature { font-size:28px; overflow-wrap:anywhere; }
  .mobile-site .signature span, .mobile-site .story .fine { font-size:14px; letter-spacing:0; }
  .mobile-site .tag { font-size:12px; }
  .mobile-site .enroll { padding:48px 6%; }
  .mobile-site .enroll h2 { font-size:clamp(2rem,7.5vw,3rem); line-height:1.2; letter-spacing:-.03em; }
  .mobile-site .enroll .eyebrow { letter-spacing:1px; }
  .mobile-site .enroll .availability { font-size:14px; line-height:1.8; max-width:36rem; margin-inline:auto; }
  .mobile-site footer { flex-direction:column; align-items:flex-start; gap:20px; padding:30px 6%; }
  .mobile-site footer p { max-width:38rem; font-size:14px; }
  .mobile-site footer > div { width:100%; font-size:14px; overflow-wrap:anywhere; }
  .mobile-site footer a:not(.brand) { display:inline-flex; align-items:center; min-height:48px; }
  .mobile-site .photo-credits { padding-inline:6%; font-size:14px; line-height:1.9; overflow-wrap:anywhere; }
  .mobile-site .photo-credits a { display:inline-block; min-height:44px; padding-block:8px; }
  .faq-page.mobile-site .faq-shell { width:calc(100% - 32px); }
  .faq-page.mobile-site .faq-hero { padding:28px 0; }
  .faq-page.mobile-site .faq-hero h1 { font-size:clamp(2rem,8vw,3rem); line-height:1.2; letter-spacing:-.03em; }
  .faq-page.mobile-site .faq-hero .eyebrow { font-size:12px; letter-spacing:1px; }
  .faq-page.mobile-site .faq-intro { font-size:16px; margin-bottom:20px; }
  .faq-page.mobile-site .search-field { gap:8px; padding-inline:12px; min-height:60px; }
  .faq-page.mobile-site .search-field > span { display:none; }
  .faq-page.mobile-site .search-field input { font-size:16px; }
  .faq-page.mobile-site .search-field button { flex-shrink:0; min-height:48px; padding-inline:10px; }
  .faq-page.mobile-site .faq-shortcuts { gap:4px 18px; margin-top:16px; }
  .faq-page.mobile-site .faq-shortcuts a { min-height:48px; }
  .faq-page.mobile-site .browse-heading, .faq-page.mobile-site .faq-support { flex-direction:column; align-items:flex-start; gap:12px; }
  .faq-page.mobile-site .category-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .faq-page.mobile-site .category-nav a { min-width:0; min-height:48px; padding:10px 12px; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
  .faq-page.mobile-site .category-heading { align-items:flex-start; gap:12px; }
  .faq-page.mobile-site .category-heading h3 { min-width:0; font-size:20px; line-height:1.4; }
  .faq-page.mobile-site .category-heading > span { flex-shrink:0; padding-top:3px; }
  .faq-page.mobile-site .faq-item summary { font-size:16px; min-height:64px; padding:18px 44px 18px 16px; }
  .faq-page.mobile-site .faq-item summary::after { right:16px; }
  .faq-page.mobile-site .faq-answer { padding:0 16px 20px; }
  .faq-page.mobile-site .faq-answer ul { padding-left:20px; }
  .faq-page.mobile-site .result-meta { gap:8px; font-size:14px; }
  .faq-page.mobile-site .result-question { font-size:17px; }
  .faq-page.mobile-site .best-badge { font-size:14px; }
  .faq-page.mobile-site .faq-answer .answer-link { min-height:48px; }
  .faq-page.mobile-site .faq-actions .button, .faq-page.mobile-site .faq-support > .button { width:100%; justify-content:center; min-height:48px; text-align:center; }
  .faq-page.mobile-site .no-results { padding:20px 16px; }
}
