/* Thakur British Academy: SMALL TWEAKS (24 Oct 2026, owner's 10-point brief). Loaded after audit.css on the homepage only.
   Remove the <link href="tweaks.css"> line in index.html to undo everything in this file. No colours, fonts, logo or sections change here. */

/* ---- 1. Mobile typography: tiny labels up to a readable size, calmer wrapping ---- */
h1,h2,h3,.lead,.hero .hi,.hero .sub{text-wrap:balance}
main p{text-wrap:pretty}
@media (max-width:480px){
  .band{font-size:12px!important;letter-spacing:.03em!important;line-height:1.35!important}
  .notice strong{font-size:12px!important}
  .hero .stats .lbl{font-size:12.5px!important;line-height:1.35!important}
  .pill,.status,span.pill,span.status{font-size:12px!important}
  .star-card li{font-size:12.5px!important;line-height:1.35!important}
  #toppers-list figcaption span{font-size:13.5px!important;line-height:1.4!important}
  #toppers-list figcaption em{font-size:12px!important}
  .batch dt{font-size:12px!important}
  .batch dd{line-height:1.45!important}
  main p,main li,main dd{overflow-wrap:break-word}
  .hero .hi{font-size:1rem!important;line-height:1.5!important}
}

/* ---- 2 + 3. Mobile bar: a little slimmer (62px to 56px), and the Ask + Back-to-top buttons sit inside it, never over the page ---- */
@media (max-width:759px){
  :root{--a-bar-h:64px} /* 56px bar + 8px gap below it */
  .sticky{bottom:calc(8px + env(safe-area-inset-bottom))!important;padding:5px!important;gap:6px!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px 44px!important}
  .sticky .btn{min-height:44px!important;padding:.4em .35em!important;font-size:.95rem!important;white-space:nowrap}
  .sticky .btn svg{flex:0 0 auto}
  .tba-as-fab{right:calc(16px + 44px + 6px)!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;width:44px!important;height:44px!important;font-size:11px!important}
  .totop,.totop.on{position:fixed!important;right:16px!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;width:44px!important;height:44px!important;
    border-radius:12px!important;opacity:1!important;visibility:visible!important;transform:none!important;translate:none!important;pointer-events:auto!important;
    background:#EAF1FB!important;border:0!important;box-shadow:none!important;color:var(--a-blue)!important;z-index:140!important;font-size:18px!important}
  /* page end: footer text ends above the bar */
  footer.foot{padding-bottom:calc(var(--a-bar-h) + 28px + env(safe-area-inset-bottom))!important}
  /* a link or a focused form field is never scrolled to a spot under the bar */
  html{scroll-padding-bottom:calc(var(--a-bar-h) + 16px)}
}

/* tablet / small laptop: keep page content clear of the right-hand button column (Top, Ask, WhatsApp, Call) */
@media (min-width:760px) and (max-width:1347px){
  main>section.sec,main>section.notice{padding-left:84px!important;padding-right:84px!important}
  footer.foot{padding-left:84px!important;padding-right:84px!important}
}

/* ---- 4. Cards: same corner radius, border, shadow, padding and icon size ---- */
.course,.batch,.teacher,.teacher-c>.teacher,#toppers-list .card,.star-card,section .why#features-list .w:nth-child(n),.lec{
  border-radius:var(--a-radius)!important}
.course,.batch,.teacher,#toppers-list .card,.star-card{border:1px solid var(--a-line)!important;box-shadow:var(--a-shadow)!important}
.teacher-c{border-radius:var(--a-radius)!important}
.course,.batch{padding:16px!important}
.teacher{padding:16px 14px!important}
section .why#features-list .w:nth-child(n){padding:14px!important}
@media (min-width:760px){.course,.batch{padding:18px!important}.teacher{padding:18px 14px!important}section .why#features-list .w:nth-child(n){padding:16px!important}}
.course .ic{width:44px!important;height:44px!important;flex:0 0 44px!important;border-radius:10px!important}
.course .ic .lic,.course .ic svg{width:24px!important;height:24px!important}
section .why#features-list .w:nth-child(n)>span{width:44px!important;height:44px!important;flex:0 0 44px!important}
section .why#features-list .w .lic{width:24px!important;height:24px!important}
.course h3,.batch h3,.teacher h3{font-size:1.35rem!important;line-height:1.2!important}

/* result cards: the year sat glued to the marks ("Rank 32026", "5002026"); put it on its own line */
#toppers-list figcaption b{line-height:1.2!important;margin-bottom:4px}
#toppers-list figcaption span{display:block!important;line-height:1.45!important}
#toppers-list figcaption em{display:block!important;margin-top:4px!important}

/* ---- 5. App section: one alignment per screen size ---- */
@media (max-width:759px){
  html body section#app.app-sec .app-copy{text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important}
  html body section#app.app-sec .app-copy>h2{text-align:center!important}
  html body section#app.app-sec .app-copy>h2::after{margin-left:auto!important;margin-right:auto!important}
  html body section#app.app-sec .app-copy .app-icon{text-align:left!important}
  html body section#app.app-sec .app-stats{width:100%!important;max-width:360px!important;margin-left:auto!important;margin-right:auto!important}
  html body section#app.app-sec .phone{margin-left:auto!important;margin-right:auto!important}
}
@media (min-width:760px){
  html body section#app.app-sec{align-items:center!important}
  html body section#app.app-sec .app-copy{text-align:left!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important}
  html body section#app.app-sec .app-copy>.eyebrow{justify-content:flex-start!important;text-align:left!important;margin-left:0!important}
  html body section#app.app-sec .app-copy>.eyebrow::before{display:none!important}
  html body section#app.app-sec .app-copy>h2{text-align:left!important}
  html body section#app.app-sec .app-stats{width:100%!important;max-width:440px!important}
}
html body section#app.app-sec .app-stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}
html body section#app.app-sec .app-stats li{text-align:center!important;min-width:0!important;margin:0!important}
@media (min-width:760px){html body section#app.app-sec .app-copy>h2{margin-left:0!important;margin-right:0!important;max-width:none!important;width:auto!important}}
html body section#app.app-sec .app-stats li span{line-height:1.35!important;display:block}
html body section#app.app-sec .fine{margin-top:10px!important}

/* ---- 6. Footer: tidy link rows, readable small print ---- */
footer.foot .foot-links{line-height:1.3!important;margin:10px auto!important}
footer.foot .foot-links a{font-size:15px!important;padding:0 8px!important}
@media (max-width:480px){
  footer.foot .foot-links{display:grid!important;grid-template-columns:1fr 1fr!important;gap:0 8px!important;max-width:340px!important}
  footer.foot .foot-links a:last-child:nth-child(odd){grid-column:1/-1}
}
@media (min-width:481px){footer.foot .foot-links{gap:0 4px!important}footer.foot .foot-links a{padding:0 7px!important}}
footer.foot p.small{font-size:13.5px!important;line-height:1.7!important;max-width:34em;margin-left:auto!important;margin-right:auto!important}
footer.foot>p{line-height:1.6}

/* ---- 7. Header: when scrolled, page text no longer shows through it ---- */
header.nav.scrolled{background-color:#FDFAF8!important;background-image:none!important}

/* ---- 8. Skip link: full 44px tap height ---- */
.skip{min-height:44px;display:inline-flex;align-items:center}

/* Oct 25: hero has 2 facts now (rating fact removed) */
.hero .stats{grid-template-columns:repeat(2,1fr)!important}

/* ---- Oct 25 (reels checklist): enquiry consent tick, hidden spam box, thank-you note, policy links ---- */
form.enq .hp-field{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
form.enq{position:relative}
form.enq label.consent{display:flex!important;align-items:flex-start;gap:10px;font-weight:500;font-size:.92rem;line-height:1.45;cursor:pointer}
form.enq label.consent input{width:24px!important;height:24px!important;min-width:24px;margin:1px 0 0;padding:0!important;box-shadow:none!important;accent-color:#014BAA}
form.enq label.consent a{color:#014BAA;font-weight:600}
form.enq .enq-ok{border:1px solid #014BAA;border-left-width:4px;border-radius:10px;background:#fff;padding:12px 14px;color:#172033}
form.enq .enq-ok p{margin:0 0 4px}form.enq .enq-ok p:last-child{margin:0;font-size:.9rem}
form.enq .enq-ok b{color:#014BAA}
/* ---- Oct 25 accessibility pass (look unchanged) ---- */
form.enq .err{color:#B3261E!important} /* was #ff6b6b: 2.6:1 on cream, now 6:1 */
.shots:focus-visible{outline:3px solid #014BAA;outline-offset:3px}

/* Oct 25: BSEB roll code / roll number on topper cards */
#toppers-list figcaption span.roll,.star-info .roll{display:block!important;margin-top:4px!important;font-family:"Inter",system-ui,sans-serif!important;font-size:12.5px!important;font-weight:600!important;color:#172033!important;letter-spacing:.01em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.star-info .roll{font-size:13.5px!important;margin:.2em 0 .6em!important}
.star-info .roll{color:#F8F3F0!important}
