/* iPad-only layout, rebuilt as a coherent tablet system.
   Phone and desktop styling are intentionally outside these queries. */
@media (min-width: 744px) and (max-width: 1400px) {
  html {
    font-size: 14px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  body.playful-site.academic-site {
    --tablet-gutter: clamp(32px, 4.5vw, 58px);
    --tablet-space: clamp(38px, 5vw, 56px);
    font-size: 13px;
    line-height: 1.58;
  }

  body.playful-site.academic-site
    :is(.site-header, .simple-header, .algebra-header, .club-header, .course-header) {
    width: 100%;
    height: 68px;
    min-height: 68px;
    padding: 6px var(--tablet-gutter);
    gap: 14px;
  }
  body.playful-site.academic-site
    :is(.site-header, .simple-header, .algebra-header, .club-header, .course-header) .brand-logo {
    width: auto;
    height: 52px;
    max-height: 52px;
  }
  body.playful-site.academic-site :is(.mobile-nav-toggle, .site-header .menu-toggle) {
    display: grid;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 9px;
  }

  body.playful-site.academic-site
    :is(.section, .page-wrap, .content-wrap, .competition-section, .trial, .v2-programs, .v2-system) {
    padding: var(--tablet-space) var(--tablet-gutter);
  }
  body.playful-site.academic-site :is(.a-container, .course-container, .club-wrap) {
    width: calc(100% - (2 * var(--tablet-gutter)));
  }
  body.playful-site.academic-site
    :is(.a-section, .club-section, .club-intro, .club-bridge, .club-closing) {
    padding-block: var(--tablet-space);
  }
  body.playful-site.academic-site
    :is(.page-hero, .content-hero, .competition-hero, .science-hero, .school-hero) {
    min-height: 0;
    padding: 38px var(--tablet-gutter);
  }

  body.playful-site.academic-site
    :is(.page-hero h1, .content-hero h1, .competition-hero h1, .science-hero h1, .school-hero h1, .algebra-hero h1, .course-hero h1, .club-hero h1) {
    margin-block: 8px 14px;
    font-size: clamp(28px, 3vw, 36px);
    line-height: 1.14;
  }
  body.playful-site.academic-site.home-page .hero .home-hero-title {
    font-size: clamp(28px, 3.1vw, 38px);
    line-height: 1.16;
  }
  body.playful-site.academic-site main h2 { font-size: clamp(21px, 2.35vw, 28px); }
  body.playful-site.academic-site main h3 { font-size: 16px; }
  body.playful-site.academic-site main
    :is(p, li):not(.kicker):not(.eyebrow):not(.club-kicker):not(.contest-tag):not(.grade):not(.study-label) {
    font-size: 13px;
  }
  body.playful-site.academic-site
    :is(.kicker, .eyebrow, .club-kicker, .contest-tag, .study-label, .problem-top, .problem-label, .problem-foot) {
    font-size: 10.5px;
  }
  body.playful-site.academic-site
    :is(.button, .a-button, .club-button, .text-link, .text-action, .pathway-primary, .pathway-secondary) {
    min-height: 42px;
    padding: 9px 13px;
    font-size: 12px;
  }

  body.playful-site.academic-site
    :is(.program-grid, .info-grid, .content-grid, .pathway-cards, .stage-grid, .contest-grid, .club-duo) {
    gap: 16px;
  }
  body.playful-site.academic-site
    :is(.program-card, .info-card, .course-card, .contest-card, .stage-grid article, .pathway-cards > a, .content-grid article, .club-duo article, .assessment-card, .sample-card, .unit-detail, .system-panel, .trial-form, .inquiry-form) {
    min-width: 0;
    padding: 20px;
  }
  body.playful-site.academic-site :is(.content-grid, .info-grid, .stage-grid) {
    align-items: stretch;
  }
  body.playful-site.academic-site :is(.content-grid, .stage-grid) > article {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  body.playful-site.academic-site :is(.content-grid, .stage-grid) > article > :is(.button, a:last-child) {
    margin-top: auto;
  }
  body.playful-site.academic-site .content-grid.subject-pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.playful-site.academic-site .test-preparation-cards > article {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  body.playful-site.academic-site .test-preparation-cards > article > .button {
    width: 100%;
    height: 42px;
    min-height: 42px;
    max-height: 42px;
    margin-top: auto;
    font-size: 12px;
  }

  body.playful-site.academic-site .system-flow {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
  }
  body.playful-site.academic-site .system-flow > div {
    min-height: 82px;
    padding: 12px 8px;
  }
  body.playful-site.academic-site .system-flow > div:last-child { grid-column: auto; }
  body.playful-site.academic-site .inquiry-form { max-width: 960px; }
  body.playful-site.academic-site
    :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea) {
    font-size: 16px;
  }

  body.playful-site.academic-site .simple-footer,
  body.playful-site.academic-site :is(.site-footer, .club-footer, .course-footer) {
    padding: 24px var(--tablet-gutter);
    font-size: 12px;
  }
}

/* Portrait: vertical reading flow with horizontal summary cards. */
@media (min-width: 744px) and (max-width: 1040px) and (orientation: portrait) {
  body.playful-site.academic-site {
    --tablet-gutter: clamp(30px, 4.2vw, 38px);
    --tablet-space: 44px;
    font-size: 13.5px;
  }
  body.playful-site.academic-site.home-page .hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
    padding: 42px var(--tablet-gutter) 48px;
  }
  body.playful-site.academic-site.home-page .hero-copy { max-width: 620px; }
  body.playful-site.academic-site.home-page .hero-problem {
    width: min(540px, 100%);
    justify-self: center;
  }
  body.playful-site.academic-site.home-page .problem-card { padding: 22px; }

  body.playful-site.academic-site :is(.competition-hero, .course-hero-grid, .club-hero) {
    grid-template-columns: minmax(0, 1fr);
  }
  body.playful-site.academic-site .competition-hero,
  body.playful-site.academic-site .club-hero { gap: 30px; }
  body.playful-site.academic-site .club-hero {
    width: calc(100% - (2 * var(--tablet-gutter)));
    padding-block: 40px;
  }
  body.playful-site.academic-site .club-notebook { padding: 20px; }
  body.playful-site.academic-site .club-question { padding-block: 11px; font-size: 18px; }

  body.playful-site.academic-site :is(.content-grid, .info-grid, .stage-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.playful-site.academic-site
    :is(.content-grid, .info-grid, .stage-grid) > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  body.playful-site.academic-site .test-preparation-cards {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: 1fr;
    gap: 14px;
  }
  body.playful-site.academic-site .test-preparation-cards > article,
  body.playful-site.academic-site .test-preparation-cards > article:last-child:nth-child(odd) {
    display: grid;
    grid-column: auto;
    grid-template-columns: 88px minmax(0, 1fr) 164px;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 10px 18px;
    min-height: 230px;
    height: 100%;
    padding: 20px;
  }
  body.playful-site.academic-site .test-preparation-cards > article > h2 {
    grid-column: 1;
    grid-row: 1 / 3;
    min-height: 0;
    margin: 0;
    padding-right: 18px;
    border-right: 1px solid #c8d3dc;
  }
  body.playful-site.academic-site .test-preparation-cards > article > p {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
  }
  body.playful-site.academic-site .test-preparation-cards > article > ul {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
    padding-left: 18px;
  }
  body.playful-site.academic-site .test-preparation-cards > article > .button {
    grid-column: 3;
    grid-row: 1 / 3;
    align-self: center;
    margin: 0;
  }

  body.playful-site.academic-site.home-page .home-pathways .program-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
  body.playful-site.academic-site.home-page .home-pathways .program-card {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 176px;
    grid-template-rows: auto auto auto auto;
    gap: 7px 18px;
    min-height: 190px;
    height: 100%;
    padding: 20px;
  }
  body.playful-site.academic-site.home-page .home-pathways .pathway-card-top {
    grid-column: 1;
    grid-row: 1 / 5;
    align-self: start;
    margin: 0;
  }
  body.playful-site.academic-site.home-page .home-pathways .program-card > .grade {
    grid-column: 2;
    grid-row: 1;
    min-height: 0;
    margin: 0;
  }
  body.playful-site.academic-site.home-page .home-pathways .program-card > h3 {
    grid-column: 2;
    grid-row: 2;
    width: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
  }
  body.playful-site.academic-site.home-page .home-pathways .program-card > p:not(.grade) {
    grid-column: 2;
    grid-row: 3;
    width: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
  }
  body.playful-site.academic-site.home-page .home-pathways .pathway-details {
    grid-column: 2;
    grid-row: 4;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
  }
  body.playful-site.academic-site.home-page .home-pathways .pathway-actions {
    grid-column: 3;
    grid-row: 1 / 5;
    align-self: center;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
  }
  body.playful-site.academic-site.home-page .home-pathways .pathway-primary,
  body.playful-site.academic-site.home-page .home-pathways .pathway-secondary {
    width: 100%;
  }

  body.playful-site.academic-site.home-page .footer-main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
    gap: 30px 46px;
  }
  body.playful-site.academic-site.home-page .footer-main > div:first-child {
    grid-column: 1 / -1;
  }
  body.playful-site.academic-site.home-page .footer-main > div:nth-child(2) a {
    white-space: nowrap;
  }

  body.playful-site.academic-site .unit-layout {
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 24px;
  }
  body.playful-site.academic-site .practice-layout { grid-template-columns: minmax(0, 1fr); }
  body.playful-site.academic-site .review-sidebar { order: -1; }
}

/* Landscape: full-width reading canvas with intentional two- and three-column groups. */
@media (min-width: 900px) and (max-width: 1400px) and (orientation: landscape) {
  html { font-size: 12.5px; }
  body.playful-site.academic-site {
    --tablet-gutter: clamp(44px, 5vw, 68px);
    --tablet-space: clamp(32px, 3.8vw, 44px);
    font-size: 11.5px;
    line-height: 1.54;
  }
  body.playful-site.academic-site
    :is(.site-header, .simple-header, .algebra-header, .club-header, .course-header) {
    height: 60px;
    min-height: 60px;
    padding-block: 5px;
  }
  body.playful-site.academic-site
    :is(.site-header, .simple-header, .algebra-header, .club-header, .course-header) .brand-logo {
    height: 46px;
    max-height: 46px;
  }
  body.playful-site.academic-site :is(.mobile-nav-toggle, .site-header .menu-toggle) {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 8px;
  }
  body.playful-site.academic-site
    :is(.page-hero, .content-hero, .competition-hero, .science-hero, .school-hero) {
    padding-block: 30px;
  }
  body.playful-site.academic-site
    :is(.page-hero h1, .content-hero h1, .competition-hero h1, .science-hero h1, .school-hero h1, .algebra-hero h1, .course-hero h1, .club-hero h1) {
    margin-block: 7px 11px;
    font-size: clamp(23px, 2.5vw, 30px);
  }
  body.playful-site.academic-site.home-page .hero .home-hero-title {
    font-size: clamp(23px, 2.55vw, 31px);
  }
  body.playful-site.academic-site main h2 { font-size: clamp(18px, 2vw, 23px); }
  body.playful-site.academic-site main h3 { font-size: 14px; }
  body.playful-site.academic-site main
    :is(p, li):not(.kicker):not(.eyebrow):not(.club-kicker):not(.contest-tag):not(.grade):not(.study-label) {
    font-size: 11.5px;
  }
  body.playful-site.academic-site
    :is(.kicker, .eyebrow, .club-kicker, .contest-tag, .study-label, .problem-top, .problem-label, .problem-foot) {
    font-size: 9.5px;
  }
  body.playful-site.academic-site
    :is(.button, .a-button, .club-button, .text-link, .text-action, .pathway-primary, .pathway-secondary) {
    min-height: 38px;
    padding: 8px 11px;
    font-size: 10.5px;
  }
  body.playful-site.academic-site
    :is(.program-grid, .info-grid, .content-grid, .pathway-cards, .stage-grid, .contest-grid, .club-duo) {
    gap: 14px;
  }
  body.playful-site.academic-site
    :is(.program-card, .info-card, .course-card, .contest-card, .stage-grid article, .pathway-cards > a, .content-grid article, .club-duo article, .assessment-card, .sample-card, .unit-detail, .system-panel, .trial-form, .inquiry-form) {
    padding: 16px;
  }
  body.playful-site.academic-site.home-page .hero {
    grid-template-columns: minmax(0, 1.08fr) minmax(370px, .92fr);
    align-items: center;
    gap: clamp(30px, 3.6vw, 48px);
    min-height: 0;
    padding: 34px var(--tablet-gutter) 38px;
  }
  body.playful-site.academic-site.home-page .hero-problem { width: min(420px, 100%); }
  body.playful-site.academic-site.home-page .problem-card { padding: 16px; }

  body.playful-site.academic-site :is(.content-grid, .info-grid, .stage-grid) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body.playful-site.academic-site.home-page .home-pathways .program-grid,
  body.playful-site.academic-site .test-preparation-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
  }
  body.playful-site.academic-site.home-page .home-pathways .program-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 16px;
  }
  body.playful-site.academic-site.home-page .home-pathways .pathway-actions { margin-top: auto; }

  body.playful-site.academic-site .club-hero {
    width: calc(100% - (2 * var(--tablet-gutter)));
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
    gap: 32px;
    padding-block: 34px;
  }
  body.playful-site.academic-site .club-notebook { padding: 16px; }
  body.playful-site.academic-site .club-question { padding-block: 9px; font-size: 16px; }
  body.playful-site.academic-site .club-editorial {
    grid-template-columns: minmax(260px, .78fr) minmax(0, 1.22fr);
    gap: clamp(34px, 4.5vw, 60px);
  }

  body.playful-site.academic-site .competition-hero {
    grid-template-columns: minmax(0, 1.18fr) minmax(350px, .82fr);
    gap: 36px;
  }
  body.playful-site.academic-site .course-hero { padding-block: 24px 28px; }
  body.playful-site.academic-site .course-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 310px);
    gap: 32px;
  }
  body.playful-site.academic-site .breadcrumb { margin-bottom: 24px; }
  body.playful-site.academic-site .unit-layout {
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 26px;
  }
  body.playful-site.academic-site .explorer-tabs { margin-bottom: 24px; }

  body.playful-site.academic-site.home-page .footer-main {
    grid-template-columns: minmax(230px, .8fr) minmax(260px, .72fr) minmax(380px, 1.2fr);
    gap: 34px;
  }
  body.playful-site.academic-site.home-page .footer-main > div:nth-child(2) a,
  body.playful-site.academic-site.home-page .footer-main > div:nth-child(3) a {
    white-space: nowrap;
  }
  body.playful-site.academic-site .simple-footer,
  body.playful-site.academic-site :is(.site-footer, .club-footer, .course-footer) {
    padding-block: 20px;
    font-size: 11px;
  }
}

@media (min-width: 1251px) and (max-width: 1400px) and (orientation: landscape) {
  body.playful-site.academic-site :is(.mobile-nav-toggle, .site-header .menu-toggle) {
    display: none;
  }
}

/* Real iPad portrait viewports can be reported as 1032px wide. Keep the
   stage marker in its own rail so it can never collide with grade metadata. */
@media (min-width: 744px) and (max-width: 1400px) {
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .section-heading {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-card {
    grid-template-columns: 90px minmax(0, 1fr) minmax(128px, 154px);
    min-height: 200px;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .pathway-card-top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .pathway-step {
    white-space: nowrap;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article,
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article:last-child:nth-child(odd) {
    grid-template-columns: 78px minmax(0, 1fr) minmax(124px, 146px);
  }
}

/* Keep every dark-blue action inside its parent card while Safari recalculates
   text metrics after an iPad rotation. */
@media (min-width: 700px) and (max-width: 1400px) {
  body.playful-site.academic-site :is(.pathway-actions, .test-preparation-cards > article) {
    min-width: 0;
  }
  body.playful-site.academic-site
    :is(.pathway-primary, .pathway-secondary, .test-preparation-cards > article > .button, .program-card > .button) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  /* Portrait actions use their own row. This remains stable when iPad Safari
     keeps a desktop-width layout viewport or applies enlarged text. */
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-card {
    grid-template-columns: 88px minmax(0, 1fr);
    grid-template-rows: auto auto auto auto auto;
    min-height: 0;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .pathway-card-top {
    grid-column: 1;
    grid-row: 1 / 5;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-card > :is(.grade, h3, p:not(.grade), .pathway-details) {
    grid-column: 2;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .pathway-actions {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 5;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: center;
    gap: 10px 18px;
    margin-top: 8px;
    padding-top: 12px;
    border-top: 1px solid #d8dfe2;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways
    :is(.pathway-primary, .pathway-secondary) {
    width: auto;
    max-width: 100%;
  }

  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article,
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article:last-child:nth-child(odd) {
    grid-template-columns: 82px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    height: auto;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > h2 {
    grid-column: 1;
    grid-row: 1 / 3;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > p {
    grid-column: 2;
    grid-row: 1;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > ul {
    grid-column: 2;
    grid-row: 2;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > .button {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: start;
    width: auto;
    min-width: 170px;
    margin-top: 8px;
  }
}

/* Safari rotation fallback. The class is derived from the live viewport size,
   so a landscape-to-portrait turn cannot retain the previous column layout. */
@media (min-width: 744px) and (max-width: 1400px) {
  html.ipad-portrait body.playful-site.academic-site.home-page .hero,
  html.ipad-portrait body.playful-site.academic-site :is(.competition-hero, .course-hero-grid, .club-hero) {
    grid-template-columns: minmax(0, 1fr);
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .hero {
    gap: 24px;
    padding: 32px var(--tablet-gutter) 36px;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .hero-copy { max-width: 620px; }
  html.ipad-portrait body.playful-site.academic-site.home-page .hero-problem {
    width: min(500px, 100%);
    justify-self: center;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .problem-card { padding: 16px; }
  html.ipad-portrait body.playful-site.academic-site .competition-hero,
  html.ipad-portrait body.playful-site.academic-site .club-hero { gap: 24px; }
  html.ipad-portrait body.playful-site.academic-site .club-hero {
    width: calc(100% - (2 * var(--tablet-gutter)));
    padding-block: 32px;
  }

  html.ipad-portrait body.playful-site.academic-site :is(.content-grid, .info-grid, .stage-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  html.ipad-portrait body.playful-site.academic-site
    :is(.content-grid, .info-grid, .stage-grid) > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: 1fr;
    gap: 13px;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article,
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article:last-child:nth-child(odd) {
    display: grid;
    grid-column: auto;
    grid-template-columns: 82px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    align-items: center;
    gap: 7px 14px;
    min-height: 206px;
    height: 100%;
    padding: 16px;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > h2 {
    grid-column: 1;
    grid-row: 1 / 3;
    min-height: 0;
    margin: 0;
    padding-right: 14px;
    border-right: 1px solid #c8d3dc;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > p {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > ul {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
    padding-left: 18px;
  }
  html.ipad-portrait body.playful-site.academic-site .test-preparation-cards > article > .button {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: start;
    width: auto;
    min-width: 170px;
    max-width: 100%;
    margin: 8px 0 0;
  }

  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 13px;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-card {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    grid-template-rows: auto auto auto auto auto;
    gap: 5px 14px;
    min-height: 172px;
    height: 100%;
    padding: 15px;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .pathway-card-top {
    grid-column: 1;
    grid-row: 1 / 5;
    align-self: start;
    margin: 0;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-card > .grade {
    grid-column: 2;
    grid-row: 1;
    min-height: 0;
    margin: 0;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-card > h3 {
    grid-column: 2;
    grid-row: 2;
    width: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .program-card > p:not(.grade) {
    grid-column: 2;
    grid-row: 3;
    width: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .pathway-details {
    grid-column: 2;
    grid-row: 4;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways .pathway-actions {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 5;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: center;
    gap: 10px 18px;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 8px 0 0;
    padding-top: 12px;
    border-top: 1px solid #d8dfe2;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .home-pathways
    :is(.pathway-primary, .pathway-secondary) {
      width: auto;
      min-width: 0;
      max-width: 100%;
    }

  html.ipad-portrait body.playful-site.academic-site .unit-layout {
    grid-template-columns: 195px minmax(0, 1fr);
    gap: 20px;
  }
  html.ipad-portrait body.playful-site.academic-site .practice-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  html.ipad-portrait body.playful-site.academic-site .review-sidebar { order: -1; }
  html.ipad-portrait body.playful-site.academic-site.home-page .footer-main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
    gap: 28px 42px;
  }
  html.ipad-portrait body.playful-site.academic-site.home-page .footer-main > div:first-child {
    grid-column: 1 / -1;
  }
}

/* Final compact iPad scale. Form controls intentionally stay at 16px so iOS
   does not zoom the viewport when a field receives focus. */
@media (min-width: 744px) and (max-width: 1400px) {
  html { font-size: 12px; }
  body.playful-site.academic-site {
    --tablet-space: clamp(30px, 3.7vw, 42px);
    font-size: 11px;
    line-height: 1.52;
  }
  body.playful-site.academic-site
    :is(.site-header, .simple-header, .algebra-header, .club-header, .course-header) {
    height: 58px;
    min-height: 58px;
    padding-block: 5px;
  }
  body.playful-site.academic-site
    :is(.site-header, .simple-header, .algebra-header, .club-header, .course-header) .brand-logo {
    height: 44px;
    max-height: 44px;
  }
  body.playful-site.academic-site
    :is(.site-header, .simple-header, .algebra-header, .club-header, .course-header) nav a {
    font-size: 11px;
  }
  body.playful-site.academic-site :is(.mobile-nav-toggle, .site-header .menu-toggle) {
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 7px;
  }
  body.playful-site.academic-site
    :is(.page-hero, .content-hero, .competition-hero, .science-hero, .school-hero) {
    padding-block: 28px;
  }
  body.playful-site.academic-site
    :is(.page-hero h1, .content-hero h1, .competition-hero h1, .science-hero h1, .school-hero h1, .algebra-hero h1, .course-hero h1, .club-hero h1) {
    margin-block: 6px 10px;
    font-size: clamp(22px, 2.45vw, 29px);
  }
  body.playful-site.academic-site.home-page .hero .home-hero-title {
    font-size: clamp(22px, 2.5vw, 30px);
  }
  body.playful-site.academic-site main h2 { font-size: clamp(18px, 1.95vw, 23px); }
  body.playful-site.academic-site main h3 { font-size: 13.5px; }
  body.playful-site.academic-site main
    :is(p, li):not(.kicker):not(.eyebrow):not(.club-kicker):not(.contest-tag):not(.grade):not(.study-label) {
    font-size: 11px;
  }
  body.playful-site.academic-site
    :is(.kicker, .eyebrow, .club-kicker, .contest-tag, .study-label, .problem-top, .problem-label, .problem-foot) {
    font-size: 9px;
  }
  body.playful-site.academic-site
    :is(.button, .a-button, .club-button, .text-link, .text-action, .pathway-primary, .pathway-secondary) {
    min-height: 36px;
    padding: 7px 10px;
    font-size: 10px;
  }
  body.playful-site.academic-site
    :is(.program-grid, .info-grid, .content-grid, .pathway-cards, .stage-grid, .contest-grid, .club-duo) {
    gap: 13px;
  }
  body.playful-site.academic-site
    :is(.program-card, .info-card, .course-card, .contest-card, .stage-grid article, .pathway-cards > a, .content-grid article, .club-duo article, .assessment-card, .sample-card, .unit-detail, .system-panel, .trial-form, .inquiry-form) {
    padding: 14px;
  }
  body.playful-site.academic-site .system-flow > div {
    min-height: 68px;
    padding: 9px 6px;
  }
  body.playful-site.academic-site .simple-footer,
  body.playful-site.academic-site :is(.site-footer, .club-footer, .course-footer) {
    padding-block: 18px;
    font-size: 10.5px;
  }
}

@media (min-width: 744px) and (max-width: 1040px) and (orientation: portrait) {
  body.playful-site.academic-site {
    --tablet-gutter: clamp(28px, 3.8vw, 34px);
    --tablet-space: 34px;
    font-size: 11.5px;
  }
  body.playful-site.academic-site.home-page .hero {
    gap: 24px;
    padding: 32px var(--tablet-gutter) 36px;
  }
  body.playful-site.academic-site.home-page .hero-problem { width: min(500px, 100%); }
  body.playful-site.academic-site.home-page .problem-card { padding: 16px; }
  body.playful-site.academic-site.home-page .home-pathways .program-card {
    grid-template-columns: 62px minmax(0, 1fr) 154px;
    gap: 5px 14px;
    min-height: 172px;
    padding: 15px;
  }
  body.playful-site.academic-site .test-preparation-cards > article,
  body.playful-site.academic-site .test-preparation-cards > article:last-child:nth-child(odd) {
    grid-template-columns: 78px minmax(0, 1fr) 146px;
    gap: 7px 14px;
    min-height: 206px;
    padding: 16px;
  }
  body.playful-site.academic-site .club-hero { gap: 24px; padding-block: 32px; }
  body.playful-site.academic-site .club-notebook { padding: 16px; }
  body.playful-site.academic-site .club-question { padding-block: 9px; font-size: 16px; }
  body.playful-site.academic-site .unit-layout {
    grid-template-columns: 195px minmax(0, 1fr);
    gap: 20px;
  }
}

@media (min-width: 900px) and (max-width: 1400px) and (orientation: landscape) {
  html { font-size: 11.5px; }
  body.playful-site.academic-site {
    --tablet-space: clamp(27px, 3.2vw, 36px);
    font-size: 10.5px;
  }
  body.playful-site.academic-site.home-page .hero {
    gap: clamp(26px, 3.2vw, 42px);
    padding-block: 29px 32px;
  }
  body.playful-site.academic-site.home-page .hero-problem { width: min(400px, 100%); }
  body.playful-site.academic-site.home-page .problem-card { padding: 14px; }
  body.playful-site.academic-site .test-preparation-cards > article > .button {
    height: 36px;
    min-height: 36px;
    max-height: 36px;
    font-size: 10px;
  }
  body.playful-site.academic-site .club-hero { gap: 28px; padding-block: 29px; }
  body.playful-site.academic-site .club-notebook { padding: 14px; }
  body.playful-site.academic-site .club-question { padding-block: 8px; font-size: 15px; }
  body.playful-site.academic-site .course-hero { padding-block: 20px 24px; }
  body.playful-site.academic-site .breadcrumb { margin-bottom: 20px; }
}

@media (min-width: 1251px) and (max-width: 1400px) and (orientation: landscape) {
  body.playful-site.academic-site :is(.mobile-nav-toggle, .site-header .menu-toggle) {
    display: none;
  }
}