/* Soft clay surfaces and motion keep the academy's recognizable identity. */
:root {
  --paper:#f0edf9;
  --surface:#fffaff;
  --surface-2:#eee8f8;
  --page-top:#f8f0fc;
  --page-bottom:#e6f1fc;
  --header-start:#ebe3f8;
  --header-end:#e3edf9;
  --notice-start:#e2d6f5;
  --notice-end:#f5e1d7;
  --logo-surface:#f8cfb6;
  --logo-ink:#61417d;
  --logo-dot:#fff9f3;
  --brand-ink:#60437d;
  --feature:#4b3c65;
  --feature-text:#fff6ef;
  --ink:#342a46;
  --muted:#686176;
  --line:#d5d8e8;
  --orange:#faa178;
  --orange-ink:#442535;
  --accent:#6550a9;
  --accent-soft:#e7dff8;
  --focus:#6843ac;
  --peach:#fbe3d5;
  --lavender:#e7dff8;
  --sage:#dceee7;
  --sky:#dcebf9;
  --rose:#f7dfe9;
  --butter:#f8edce;
  --dock-start:#e8daf8;
  --dock-end:#d9eafa;
  --dock-active:#6850a7;
  --dock-active-ink:#fff;
  --clay-highlight:#ffffffd9;
  --clay-lowlight:#abb4d34d;
  --clay-card:12px 14px 28px #aeb8d345,-8px -8px 22px #ffffffb3,inset 3px 3px 8px #ffffffd9,inset -4px -4px 9px #aeb8d326;
  --clay-small:5px 6px 12px #aeb8d34d,-4px -4px 10px #ffffffb3,inset 2px 2px 4px #ffffffcc,inset -2px -3px 5px #aeb8d333;
  --clay-inset:inset 4px 4px 8px #aeb8d340,inset -4px -4px 8px #ffffffcc;
  --clay-colored:9px 11px 22px #9c94b333,inset 4px 4px 8px #ffffff80,inset -5px -5px 10px #856b9b26;
  --clay-orange:5px 7px 12px #c787633d,inset 3px 3px 5px #ffe9d994,inset -3px -4px 6px #be60222b;
  --shadow:var(--clay-card);
}
:root[data-theme="dark"] {
  --paper:#202332;
  --surface:#303044;
  --surface-2:#292c3e;
  --page-top:#30283f;
  --page-bottom:#24394b;
  --header-start:#352d46;
  --header-end:#2a3a4d;
  --notice-start:#493a5c;
  --notice-end:#4d3b46;
  --logo-surface:#c5b0f5;
  --logo-ink:#3c2852;
  --logo-dot:#ffe1c9;
  --brand-ink:#e6d6ff;
  --feature:#49365e;
  --ink:#f7f2ff;
  --muted:#c5bdd5;
  --line:#4c465e;
  --orange:#f6b28c;
  --accent:#c3afff;
  --accent-soft:#453857;
  --focus:#d0baff;
  --peach:#503841;
  --lavender:#453857;
  --sage:#304b46;
  --sky:#2c4158;
  --rose:#4d354b;
  --butter:#494230;
  --dock-start:#3c304d;
  --dock-end:#283e50;
  --dock-active:#c5b0f5;
  --dock-active-ink:#302443;
  --clay-highlight:#69677b33;
  --clay-lowlight:#09091680;
  --clay-card:12px 14px 28px #07071266,-7px -7px 20px #4e4d6426,inset 3px 3px 7px #9b94b11a,inset -4px -4px 9px #0a091e40;
  --clay-small:5px 6px 12px #07071266,-3px -3px 9px #716b8c1f,inset 2px 2px 4px #b0a0cf1a,inset -2px -3px 5px #08081c59;
  --clay-inset:inset 4px 4px 8px #09091680,inset -3px -3px 7px #68607833;
  --clay-colored:9px 11px 22px #07071266,inset 3px 3px 7px #c9b0df1f,inset -4px -4px 9px #10091c4d;
  --clay-orange:5px 7px 12px #0c081b66,inset 3px 3px 5px #fff1db99,inset -3px -4px 6px #9a572b40;
}
body {background:linear-gradient(155deg,var(--page-top),var(--paper) 45%,var(--page-bottom))}
.brand,:root[data-theme="dark"] .brand {color:var(--brand-ink);gap:12px}
.brand-symbol {
  background:var(--logo-surface);color:var(--logo-ink);
  font-size:46px;
  border:1px solid var(--clay-highlight);border-radius:15px 15px 15px 5px;
  box-shadow:var(--clay-small);text-shadow:0 1px 1px #ffffff40;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s;
}
.brand-symbol>span {color:var(--logo-dot);font-size:22px;text-shadow:0 1px 2px #61417d45}
.brand-sub {color:var(--muted)}
.site-header {
  background:linear-gradient(110deg,var(--header-start),var(--header-end));
  border:0;border-bottom:1px solid var(--clay-highlight);
  box-shadow:0 7px 18px var(--clay-lowlight),inset 0 2px 4px var(--clay-highlight);
}
.header-inner {animation:clay-chrome-enter .55s ease-out backwards}
.header-actions {gap:9px}
.header-actions button {
  background:var(--surface);
  border-radius:15px;
  box-shadow:var(--clay-small);
  transition:transform .2s,box-shadow .2s;
}
.header-actions button:hover {background:var(--surface)}
.header-actions .lang-button,.header-actions .lang-button:hover {background:var(--peach)}
.header-actions .reading-button,.header-actions .reading-button:hover {background:var(--lavender)}
.header-actions .menu-button,.header-actions .menu-button:hover {background:var(--sage)}
.desktop-nav {gap:8px}
.desktop-nav>a,.nav-more>summary {
  padding:10px 14px;border:1px solid var(--clay-highlight);border-radius:15px;
  background:var(--nav-surface,var(--butter));color:var(--ink);box-shadow:var(--clay-small);
  transition:transform .2s,box-shadow .2s,background .2s;
}
.desktop-nav>a:nth-child(1) {--nav-surface:var(--peach)}
.desktop-nav>a:nth-child(2) {--nav-surface:var(--sky)}
.desktop-nav>a:nth-child(3) {--nav-surface:var(--lavender)}
.desktop-nav>a:nth-child(4) {--nav-surface:var(--sage)}
.desktop-nav>a.active,.nav-more>summary.active,.nav-more[open]>summary {
  background:var(--dock-active);color:var(--dock-active-ink);box-shadow:var(--clay-inset);border-color:transparent;
}
.desktop-nav>a:hover {color:var(--ink);border:1px solid var(--clay-highlight)}
.desktop-nav>a.active:hover {color:var(--dock-active-ink);border-color:transparent;box-shadow:var(--clay-inset)}
.desktop-nav>a:active,.nav-more>summary:active {transform:scale(.97);box-shadow:var(--clay-inset)}
.nav-dropdown,.mobile-menu {background:var(--paper);border-color:var(--line)}
.nav-dropdown {border-radius:24px;padding:12px;box-shadow:var(--clay-card);animation:clay-chrome-enter .2s ease-out}
.nav-dropdown a {border-radius:14px;background:var(--nav-surface,var(--sky));margin-bottom:7px;box-shadow:var(--clay-small);transition:transform .2s,background .2s}
.nav-dropdown a:last-child {margin-bottom:0}
.nav-dropdown a:nth-child(3n+2) {--nav-surface:var(--peach)}
.nav-dropdown a:nth-child(3n) {--nav-surface:var(--sage)}
.nav-dropdown a:hover {background:var(--nav-surface,var(--sky));color:var(--ink)}
.nav-dropdown a.active,.nav-dropdown a.active:hover {background:var(--dock-active);color:var(--dock-active-ink);box-shadow:var(--clay-inset)}
.announcement {
  background:linear-gradient(110deg,var(--notice-start),var(--notice-end));color:var(--ink);
  border-bottom:1px solid var(--clay-highlight);
  box-shadow:inset 0 2px 4px var(--clay-highlight),inset 0 -2px 5px var(--clay-lowlight);
}
.announcement-dot {background:var(--accent);box-shadow:inset 1px 1px 2px var(--clay-highlight),0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent)}
.announcement a {border-left-color:color-mix(in srgb,var(--ink) 18%,transparent);color:var(--ink)}
.announcement-pause {background:var(--surface);border-color:var(--clay-highlight);border-radius:10px;color:var(--ink);box-shadow:var(--clay-inset);transition:transform .2s}
.announcement-pause:hover,.announcement-pause:focus-visible {background:var(--surface)}
.announcement-pause:active {transform:scale(.94)}
.primary-button,.secondary-button,.hub-feature-action {
  border-radius:17px;
  border:1px solid transparent;
  box-shadow:var(--clay-orange);
  transition:transform .16s,box-shadow .16s,background .16s;
}
.primary-button,.hub-feature-action {background:var(--orange);color:var(--orange-ink)}
.secondary-button {background:var(--surface);color:var(--ink);box-shadow:var(--clay-small)}
.primary-button:hover,.hub-feature:hover .hub-feature-action {background:var(--orange);box-shadow:var(--clay-orange)}
.secondary-button:hover {background:var(--surface);box-shadow:var(--clay-small)}
.primary-button:active,.secondary-button:active,.header-actions button:active {
  transform:translateY(2px);
  box-shadow:var(--clay-inset);
}
.hero-copy h1 {letter-spacing:-.05em}
.home-hero {gap:76px;padding-block:62px 70px}
.hero-actions {gap:14px}
.hero-actions .hero-whatsapp {display:grid;place-items:center;flex:none;width:52px;height:52px;padding:0;border:1px solid var(--clay-highlight);border-radius:17px;background:#d6ede2;color:#146344;box-shadow:var(--clay-small);transition:transform .16s,box-shadow .16s}
.hero-whatsapp .ui-icon {width:28px;height:28px}
.hero-whatsapp:hover {transform:translateY(-2px)}
.hero-whatsapp:active {transform:translateY(2px);box-shadow:var(--clay-inset)}
:root[data-theme="dark"] .hero-whatsapp {background:#244b3c;color:#98e4bf}
.hero-tags {margin-top:30px}
.student-hub {
  background:var(--surface);
  border-color:var(--clay-highlight);
  border-radius:36px;
  padding:28px;
  box-shadow:var(--clay-card);
}
.hub-heading {margin-bottom:22px}
.hub-feature {
  background:var(--lavender);
  color:var(--ink);
  border-radius:27px;
  padding:25px;
  box-shadow:var(--clay-colored);
}
.hub-feature:hover {box-shadow:var(--clay-colored)}
.hub-feature-top {color:var(--muted)}
.hub-feature p {color:var(--muted)}
.hub-feature-icon {
  background:var(--surface);
  color:var(--accent);
  border-radius:13px;
  width:42px;height:42px;
  box-shadow:var(--clay-small);
}
.hub-feature-action {padding:11px 17px;font-size:.82rem}
.hub-links {gap:10px;margin-top:20px}
.hub-links a,.hub-links a:last-child {padding:12px;border:1px solid var(--clay-highlight);border-radius:18px;box-shadow:var(--clay-small)}
.hub-links a:nth-child(1) {background:var(--butter)}
.hub-links a:nth-child(2) {background:var(--rose)}
.hub-links a:nth-child(3) {background:var(--sage)}
.hub-links a:nth-child(4) {background:var(--sky)}
.hub-links a:nth-child(5) {background:var(--peach)}
.hub-link-icon {
  background:var(--surface-2);
  border-radius:14px;
  width:42px;height:42px;
  box-shadow:var(--clay-small);
}
.path-grid,.shortcut-grid,.simple-grid,.subject-grid,.resource-grid,.teacher-grid,.book-grid,.official-grid {gap:26px}
.path-card,.shortcut-grid>a,.info-card,.subject-card,.resource-card,
.teacher-card,.book-card,.official-card,.student-help-card,
.selector-panel,.fee-builder,.enquiry-form,.tool-card,.english-card,
.english-topic,.results-guide,.next-panel,.english-welcome,.learner-switch {
  background:var(--surface);
  border:1px solid var(--clay-highlight);
  border-radius:28px;
  box-shadow:var(--clay-card);
}
.path-card {padding:30px 32px}
.school-path {background:var(--peach);box-shadow:var(--clay-colored)}
.college-path {background:var(--lavender);box-shadow:var(--clay-colored)}
.teachers-path {background:var(--sage);box-shadow:var(--clay-colored)}
.enquire-path {background:var(--peach);box-shadow:var(--clay-colored)}
.tools-path {background:var(--lavender);box-shadow:var(--clay-colored)}
.results-path {background:var(--sky);box-shadow:var(--clay-colored)}
:root[data-theme="dark"] .tools-path {background:var(--lavender)}
:root[data-theme="dark"] .results-path {background:var(--sky)}
:root[data-theme="dark"] .school-path {background:var(--peach)}
:root[data-theme="dark"] .college-path {background:var(--lavender)}
:root[data-theme="dark"] .teachers-path {background:var(--sage)}
:root[data-theme="dark"] .enquire-path {background:var(--peach)}
.path-card:hover {border-color:var(--clay-highlight);box-shadow:var(--clay-colored)}
.path-card-heading {margin-bottom:26px}
.path-icon,.subject-glyph,.shortcut-grid .shortcut-icon,.notice-icon,
.next-step-icon,.tool-heading>span,.official-icon,.topic-number {
  border-radius:16px;
  box-shadow:var(--clay-small);
}
.path-icon {background:var(--surface);color:var(--ink);width:54px;height:54px}
.college-path .path-icon {background:var(--surface);color:var(--accent)}
.path-index {color:var(--muted)}
.path-card-foot {border-color:color-mix(in srgb,var(--ink) 14%,transparent)}
.shortcut-grid>a:nth-child(1) {background:var(--lavender);box-shadow:var(--clay-colored)}
.shortcut-grid>a:nth-child(2) {background:var(--sage);box-shadow:var(--clay-colored)}
.shortcut-grid>a:nth-child(3) {background:var(--peach);box-shadow:var(--clay-colored)}
.shortcut-grid>a:hover {border-color:var(--clay-highlight);box-shadow:var(--clay-colored)}
.shortcut-grid .shortcut-icon {background:var(--surface);color:var(--accent);width:46px;height:46px}
.shortcut-grid .shortcut-action {box-shadow:none;border-radius:0;background:none}
.action-strip,.english-course-link,.library-strip,.calculator-note,.result-aside {
  border:1px solid var(--clay-highlight);
  border-radius:26px;
  background:var(--surface-2);
  box-shadow:var(--clay-card);
}
.action-strip {margin-top:34px;background:var(--butter);box-shadow:var(--clay-colored)}
.action-strip .secondary-button {background:var(--surface);border-color:transparent;box-shadow:var(--clay-small)}
.english-course-link {background:var(--lavender);box-shadow:var(--clay-colored)}
.english-course-link .primary-button {background:var(--orange);color:var(--orange-ink);box-shadow:var(--clay-orange)}
.category-chip,.english-status {border-radius:11px;background:var(--surface-2);box-shadow:var(--clay-inset);padding:6px 11px}
.notice-icon {background:var(--peach)}
.subject-card:nth-child(3n+2) .subject-glyph {background:var(--lavender)}
.subject-card:nth-child(3n) .subject-glyph {background:var(--sage)}
.fee-summary,.college-highlight,.contact-card,.student-hero,.english-next {
  background:var(--feature);
  border-radius:30px;
  box-shadow:9px 12px 23px var(--clay-lowlight),inset 3px 3px 7px #d89ac92b,inset -5px -5px 10px #17051e40;
}
.segmented,.fee-paths,.english-tabs {gap:9px}
.segmented {padding:8px;background:var(--surface-2);border-radius:18px;box-shadow:var(--clay-inset)}
.segmented button {border-radius:13px}
.fee-paths button,.learn-tabs a,.english-tabs button,.board-selector button,
.reading-choices button,.mobile-menu a,.book-actions>a {
  border:1px solid transparent;
  border-radius:15px;
  background:var(--surface);
  box-shadow:var(--clay-small);
}
.segmented button.selected,.fee-paths button.selected,.learn-tabs a.active,
.english-tabs button[aria-current],.board-selector button.selected,
.reading-choices button[aria-pressed="true"],.mobile-menu a.active {
  background:var(--accent-soft);
  color:var(--accent);
  border-color:var(--accent);
  box-shadow:var(--clay-inset);
}
:root[data-theme="dark"] .segmented button.selected,
:root[data-theme="dark"] .fee-paths button.selected,
:root[data-theme="dark"] .learn-tabs a.active {
  background:var(--accent-soft);color:var(--accent);border-color:var(--accent);
}
.english-tabs {border:0;padding:8px 5px 14px;scroll-padding-inline:5px}
.english-tabs button:hover {background:var(--surface)}
.class-picker select,.enquiry-form input,.enquiry-form select,.enquiry-form textarea,
.search-box input,.marks-row input,.tool-field input,
.english-page select,.english-page input:not([type=radio]):not([type=checkbox]) {
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-2);
  box-shadow:var(--clay-inset);
  color:var(--ink);
}
.enquiry-form input[type=checkbox] {min-height:21px;border-radius:4px;box-shadow:none}
.book-search {background:var(--surface-2);border-radius:18px;box-shadow:var(--clay-inset)}
.book-cover {background:var(--lavender);box-shadow:inset -4px -4px 9px var(--clay-lowlight);border:0}
.book-actions>a {background:var(--surface-2)}
.tool-result {border-radius:22px;background:var(--lavender);box-shadow:var(--clay-colored)}
.english-metrics>div {background:var(--surface);border-color:var(--clay-highlight);border-radius:23px;box-shadow:var(--clay-card)}
.english-welcome>.english-card {background:var(--lavender);box-shadow:var(--clay-colored);border-radius:23px}
.english-question fieldset label {background:var(--surface-2);border-radius:17px;box-shadow:var(--clay-small)}
.english-question fieldset label.selected {background:var(--accent-soft);border-color:var(--accent);box-shadow:var(--clay-inset)}
.english-page progress {background:var(--surface-2);box-shadow:var(--clay-inset)}
.english-page progress::-webkit-progress-value {background:var(--accent);box-shadow:inset 0 2px 4px #ffffff40}
.english-lesson {box-shadow:var(--clay-card)}
.empty-card,.loading-card {border-radius:28px;background:var(--surface);box-shadow:var(--clay-card);border-color:var(--clay-highlight)}
.selector-panel,.results-guide {background:var(--butter)}
.fee-builder,.english-welcome,.learner-switch,.library-strip {background:var(--sky)}
.enquiry-form {background:var(--peach)}
.next-panel,.english-card {background:var(--sage)}
.calculator-note,.result-aside {background:var(--rose)}
:is(.info-card,.subject-card,.resource-card,.teacher-card,.book-card,.official-card,.student-help-card,.tool-card,.english-topic,.english-grid>.english-card,.english-metrics>div):nth-child(6n+1) {background:var(--sky)}
:is(.info-card,.subject-card,.resource-card,.teacher-card,.book-card,.official-card,.student-help-card,.tool-card,.english-topic,.english-grid>.english-card,.english-metrics>div):nth-child(6n+2) {background:var(--peach)}
:is(.info-card,.subject-card,.resource-card,.teacher-card,.book-card,.official-card,.student-help-card,.tool-card,.english-topic,.english-grid>.english-card,.english-metrics>div):nth-child(6n+3) {background:var(--sage)}
:is(.info-card,.subject-card,.resource-card,.teacher-card,.book-card,.official-card,.student-help-card,.tool-card,.english-topic,.english-grid>.english-card,.english-metrics>div):nth-child(6n+4) {background:var(--lavender)}
:is(.info-card,.subject-card,.resource-card,.teacher-card,.book-card,.official-card,.student-help-card,.tool-card,.english-topic,.english-grid>.english-card,.english-metrics>div):nth-child(6n+5) {background:var(--butter)}
:is(.info-card,.subject-card,.resource-card,.teacher-card,.book-card,.official-card,.student-help-card,.tool-card,.english-topic,.english-grid>.english-card,.english-metrics>div):nth-child(6n) {background:var(--rose)}
.college-subject {background:var(--sky);border-radius:18px;padding-inline:18px;box-shadow:var(--clay-small);border-color:var(--clay-highlight)}
.college-subject:nth-child(3n+2) {background:var(--sage)}
.college-subject:nth-child(3n) {background:var(--peach)}
.reading-dialog,.content-dialog {border-radius:30px;background:var(--paper);border-color:var(--clay-highlight)}
.close-button {border:0;border-radius:14px;background:var(--surface);box-shadow:var(--clay-small)}
.mobile-menu-grid {gap:12px}
.mobile-menu {padding-block:22px}
.mobile-menu a:nth-child(3n+1) {background:var(--sky)}
.mobile-menu a:nth-child(3n+2) {background:var(--peach)}
.mobile-menu a:nth-child(3n) {background:var(--sage)}
.mobile-menu a.active {background:var(--accent-soft)}
.mobile-dock {background:linear-gradient(110deg,var(--dock-start),var(--dock-end));border:0;box-shadow:0 -5px 18px var(--clay-lowlight)}
.mobile-dock a {border-radius:16px;color:var(--ink);border:1px solid var(--clay-highlight)}
.mobile-dock a:nth-child(1) {background:var(--lavender)}
.mobile-dock a:nth-child(2) {background:var(--peach)}
.mobile-dock a:nth-child(3) {background:var(--sage)}
.mobile-dock a:nth-child(4) {background:var(--sky)}
.mobile-dock a:nth-child(5) {background:var(--rose)}
.mobile-dock a.active {background:var(--dock-active);box-shadow:var(--clay-inset);color:var(--dock-active-ink);font-weight:750;border-color:transparent}
.mobile-whatsapp {display:none}
@keyframes clay-chrome-enter {
  from {opacity:0;transform:translateY(-5px)}
  to {opacity:1;transform:none}
}
@keyframes clay-reveal {
  from {opacity:0;transform:translateY(18px)}
  to {opacity:1;transform:none}
}
@keyframes clay-dialog-enter {
  from {opacity:0;transform:translateY(10px) scale(.98)}
  to {opacity:1;transform:none}
}
@keyframes clay-backdrop-enter {
  from {opacity:0}
  to {opacity:1}
}
[data-reveal="pending"] {opacity:0;transform:translateY(18px)}
[data-reveal="pending"]:focus-within {opacity:1;transform:none}
[data-reveal="visible"] {animation:clay-reveal .6s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms) backwards}
.mobile-menu {animation:clay-chrome-enter .25s ease-out}
.reading-dialog[open],.content-dialog[open] {animation:clay-dialog-enter .25s cubic-bezier(.2,.75,.25,1)}
.reading-dialog[open]::backdrop,.content-dialog[open]::backdrop {animation:clay-backdrop-enter .2s ease-out}
.hub-links a,.path-card,.shortcut-grid>a,.linked-card,.mobile-dock a {transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.primary-button:active,.secondary-button:active {transform:translateY(1px) scale(.98)}
.mobile-dock a:active {transform:scale(.95);box-shadow:var(--clay-inset)}
@keyframes whatsapp-halo {
  0%,70%,100% {transform:scale(1);opacity:0}
  74% {opacity:.28}
  92% {transform:scale(1.3);opacity:0}
}
@keyframes whatsapp-wave {
  0%,70%,90%,100% {transform:rotate(0)}
  75%,83% {transform:rotate(-7deg)}
  79%,87% {transform:rotate(7deg)}
}
.site-footer {background:var(--surface-2);border:0;box-shadow:inset 0 7px 14px var(--clay-lowlight)}
@media(hover:hover) {
  .primary-button:hover,.secondary-button:hover,.hub-feature-action:hover {transform:translateY(-2px)}
  .path-card:hover,.shortcut-grid>a:hover,.linked-card:hover {transform:translateY(-3px)}
  .brand:hover .brand-symbol {transform:translateY(-2px) rotate(-3deg)}
  .desktop-nav>a:hover,.nav-more>summary:hover,.header-actions button:hover {transform:translateY(-2px)}
  .hub-links a:hover,.nav-dropdown a:hover {transform:translateX(3px)}
  .primary-button {position:relative;overflow:hidden}
  .primary-button:before {content:'';position:absolute;inset:-40%;background:linear-gradient(110deg,transparent 35%,#ffffff55 50%,transparent 65%);transform:translateX(-120%);transition:transform .65s;pointer-events:none}
  .primary-button:hover:before {transform:translateX(120%)}
}
@media(max-width:1100px) {
  .home-hero {gap:42px}
}
@media(max-width:760px) {
  .hero-actions .hero-whatsapp {display:none}
  .mobile-whatsapp {
    display:grid;place-items:center;position:fixed;z-index:36;
    right:max(18px,env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));
    width:60px;height:60px;border:1px solid #ffffff55;border-radius:22px;
    background:#178b53;color:#fff;text-decoration:none;isolation:isolate;
    box-shadow:inset 3px 3px 6px #ffffff35,inset -4px -4px 7px #07552e45,0 7px 18px #0b4f3433;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-whatsapp:before {content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#25d366;opacity:0;pointer-events:none;animation:whatsapp-halo 6s ease-out infinite}
  .mobile-whatsapp .ui-icon {width:35px;height:35px;fill:currentColor;stroke:none;animation:whatsapp-wave 6s ease-in-out infinite}
  .mobile-whatsapp:focus-visible {outline:3px solid var(--ink);outline-offset:5px}
  .mobile-whatsapp:focus-visible .ui-icon,.mobile-whatsapp:focus-visible:before {animation-play-state:paused}
  .mobile-whatsapp:active {box-shadow:inset 3px 3px 8px #07552e65,0 3px 10px #0b4f3433}
  .home-hero {gap:34px;padding-block:38px 45px}
  .brand {gap:10px}
  .brand-symbol {border-radius:13px 13px 13px 5px}
  .header-actions {gap:8px}
  .header-actions button {border-radius:13px}
  .student-hub {padding:22px;border-radius:30px}
  .hub-heading {margin-bottom:20px}
  .hub-feature {padding:23px;border-radius:23px}
  .hub-links {margin-top:19px}
  .path-grid,.shortcut-grid,.simple-grid,.subject-grid,.resource-grid,.teacher-grid,.book-grid,.official-grid {gap:21px}
  .path-card {padding:26px;border-radius:26px}
  .shortcut-grid>a,.info-card,.subject-card,.resource-card,.teacher-card,.book-card,
  .official-card,.student-help-card,.selector-panel,.fee-builder,.enquiry-form,
  .tool-card,.english-card,.english-topic,.results-guide,.next-panel,.english-welcome,.learner-switch {border-radius:24px}
  .shortcut-grid>a {grid-template-columns:46px minmax(0,1fr);gap:0 17px;padding:22px}
  .action-strip,.english-course-link,.library-strip {border-radius:24px}
  .learn-tabs {gap:12px}
  .mobile-menu-grid {gap:12px}
  .mobile-dock {padding-inline:8px;gap:4px}
  .mobile-dock a {font-size:.68rem}
  .english-metrics {gap:17px}
  .book-cover {padding:24px}
  .fee-summary,.college-highlight,.contact-card,.student-hero,.english-next {border-radius:26px}
}
@media(max-width:650px) {
  .brand-symbol {font-size:41px}
  .brand-symbol>span {font-size:20px}
  .mobile-whatsapp {bottom:calc(88px + env(safe-area-inset-bottom))}
}
@media(max-width:380px) {
  .brand-symbol {font-size:38px}
  .brand-symbol>span {font-size:18px}
  .header-actions {gap:6px}
  .header-actions button {min-width:38px;padding:6px}
  .student-hub {padding:20px}
  .hub-feature {padding:20px}
  .mobile-menu a {padding:11px;font-size:.82rem;gap:8px}
  .mobile-dock {padding-inline:5px;gap:2px}
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {transition:none!important;animation:none!important}
  [data-reveal="pending"] {opacity:1;transform:none}
  .brand:hover .brand-symbol,.desktop-nav>a:hover,.nav-more>summary:hover,.header-actions button:hover,.hub-links a:hover,.nav-dropdown a:hover {transform:none}
  .primary-button:before {display:none}
  .mobile-whatsapp .ui-icon {transform:none}
  .mobile-whatsapp:before {opacity:0}
  .primary-button:hover,.secondary-button:hover,.path-card:hover,.shortcut-grid>a:hover,.linked-card:hover {transform:none}
}