/* Anything But the Norm — phone and small-tablet fixes */
.abtn-wordmark { font-family: 'Fraunces', Georgia, serif; font-weight: 700; font-variation-settings: 'SOFT' 100, 'opsz' 48; font-size: 22px; line-height: 1.05; color: #13284D; text-decoration: none; letter-spacing: -0.01em; }
.abtn-wordmark em { font-style: italic; color: #D13D23; }
a:has(> .abtn-wordmark) { text-decoration: none; }
footer .abtn-wordmark { font-size: 26px; }
.abtn-flink { color: #4A5876; text-decoration: none; font-size: 15px; padding: 3px 0; align-self: flex-start; }
.abtn-flink:hover { color: #13284D; text-decoration: underline; text-underline-offset: 3px; }
.abtn-flink-cta { color: #B5321B; font-weight: 700; }
/* Wave dividers: overlap the next section by 2px so phones never show a hairline seam */
.s98 { position: relative; z-index: 1; margin-bottom: -2px; height: 50px; }
.s70 { position: relative; z-index: 1; margin-top: -2px; height: 50px; }
.s34 { margin-top: 36px; }
.s26 { bottom: 60px; }
.abtn-menu-btn { display: none; }
.abtn-menu-panel[hidden] { display: none !important; }
.abtn-menu-btn .abtn-mi-close { display: none; }
.abtn-menu-btn[aria-expanded="true"] .abtn-mi-open { display: none; }
.abtn-menu-btn[aria-expanded="true"] .abtn-mi-close { display: inline; }

@media (max-width: 760px) {
  /* Top banner and menu */
  .s1 { font-size: 13px; line-height: 1.45; padding: 9px 16px; }
  .s4 { padding: 10px 16px; gap: 10px; flex-wrap: nowrap; }
  .s6 { height: 46px; }
  header .abtn-wordmark { font-size: 19px; white-space: nowrap; }
  .s7 { gap: 0; flex-wrap: nowrap; }
  .s7 > .s8 { display: none; }
  .s9 { padding: 10px 18px; font-size: 15px; white-space: nowrap; }
  .abtn-menu-btn { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 44px; height: 44px; margin-left: 8px; border-radius: 50%; border: 1.5px solid rgba(19, 40, 77, .2); background: #FFFFFF; color: #13284D; cursor: pointer; }
  header.menu-open { background-color: rgba(251, 246, 236, .97); }
  .abtn-menu-panel { position: absolute; top: 100%; left: 12px; right: 12px; display: flex; flex-direction: column; padding: 8px; background: #FFFFFF; border-radius: 20px; box-shadow: 0 24px 50px -20px rgba(19, 40, 77, .55); }
  .abtn-menu-panel a { display: flex; align-items: center; min-height: 52px; padding: 0 16px; border-radius: 12px; font-weight: 700; font-size: 18px; color: #13284D; text-decoration: none; }
  .abtn-menu-panel a:hover, .abtn-menu-panel a:focus-visible { background: #FBF6EC; }
  .abtn-menu-panel a + a { border-top: 1px solid rgba(19, 40, 77, .08); }

  /* Hero */
  .s10 { padding: 32px 20px 56px; gap: 40px; }
  .s16 { max-width: none; }
  .s18 { flex-direction: column; flex-wrap: nowrap; border-radius: 22px; padding: 8px; gap: 8px; }
  .s19 { flex: none; width: 100%; padding: 12px 14px; }
  .s20 { width: 100%; }
  .s25 { padding: 10px; }
  .s31 { width: 104px; height: 104px; bottom: 14%; }
  .s32 { font-size: 15px; }
  .s33 { font-size: 12.5px; }
  .s34 { margin-top: 40px; }
  .s26 { bottom: 78px; }

  /* Section spacing */
  .s36 { padding: 64px 20px; }
  .s42, .s100, .s106, .s127, .s160, .s173 { padding-left: 20px; padding-right: 20px; }
  .s42, .s106, .s160, .s173 { padding-top: 72px; padding-bottom: 72px; }
  .s71, .s149, .s122, .s168, .s191 { padding-left: 20px; padding-right: 20px; }

  /* Toolbox */
  .s79 { padding: 28px 20px; border-radius: 24px; }
  .s82 { font-size: 30px; }
  .s93 { grid-template-columns: 1fr; }
  .s94 { min-height: 0; padding: 18px; }
  .s97 { margin-top: 6px; }

  /* Offer card */
  .s128 { border-radius: 28px; }
  .s129 { min-height: 0; padding: 150px 20px 36px; }
  .s132 { width: 108px; height: 108px; top: 22px; right: 22px; }
  .s134 { font-size: 17px; }
  .s130 { top: 28px; left: 26px; }
  .s131 { top: 74px; left: 70px; }
  .s140 { padding: 32px 22px 36px; }
  .s144 > a { width: 100%; }

  /* Classroom buttons */
  .s153 > a { width: 100%; }

  /* Author photo */
  .s169 { flex-basis: 180px; width: 180px; height: 180px; }

  /* Closing section: keep the sparkles clear of the words */
  .s182 { padding-top: 76px; }
  .s183 { top: 18px; left: 18px; width: 40px; height: 40px; }
  .s184 { bottom: 24px; left: 24px; }
  .s185 { top: 22px; right: 22px; width: 30px; height: 30px; }
  .s186 { bottom: 34px; right: 30px; }
}

@media (max-width: 380px) {
  .s9 { padding: 9px 14px; font-size: 14px; }
  .abtn-menu-btn { margin-left: 6px; }
  header .abtn-wordmark { font-size: 17px; }
}