/* DAK CSS: dark-mode.css */
/* ==========================================================
   DAK AUTOMATIC DARK MODE
   Enabled by js/dark-mode.js from 18:30 to 06:30 Oman time.
   Light-mode rules remain untouched in the original files.
   ========================================================== */

html[data-theme="dark"] {
  color-scheme: dark;
  --dark-bg: #0b1220;
  --dark-bg-soft: #0f1827;
  --dark-surface: #141f30;
  --dark-surface-2: #192638;
  --dark-surface-3: #203044;
  --dark-border: #2b3b50;
  --dark-text: #edf3f9;
  --dark-muted: #aeb9c7;
  --dark-muted-2: #8795a7;

  /* Only semantic light-page variables are remapped. Brand colours stay intact. */
  --text: var(--dark-text);
  --text-muted: var(--dark-muted);
  --gray: var(--dark-bg-soft);
  --gray-2: var(--dark-border);
  --teal-light: #12333a;
  --purple-pale: #211a31;
  --shadow: 0 2px 18px rgba(0,0,0,.28);
  --shadow-md: 0 8px 30px rgba(0,0,0,.34);
  --shadow-lg: 0 18px 56px rgba(0,0,0,.42);
}

html[data-theme="dark"],
html[data-theme="dark"] body {
  background: var(--dark-bg);
  color: var(--dark-text);
}

html[data-theme="dark"] body,
html[data-theme="dark"] nav,
html[data-theme="dark"] .mobile-menu,
html[data-theme="dark"] .section,
html[data-theme="dark"] .section-gray,
html[data-theme="dark"] .footer,
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] button {
  transition: background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
}

/* Navigation */
html[data-theme="dark"] nav {
  background: rgba(11,18,32,.96) !important;
  border-bottom-color: rgba(255,255,255,.09) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.22);
}
html[data-theme="dark"] nav.scrolled { box-shadow: 0 8px 34px rgba(0,0,0,.38); }
html[data-theme="dark"] .nav-links a,
html[data-theme="dark"] .mobile-menu a { color: var(--dark-text); }
html[data-theme="dark"] .nav-links a:hover,
html[data-theme="dark"] .mobile-menu a:hover { background: var(--dark-surface-2); color: #61e4f4; }
html[data-theme="dark"] .nav-links a.active { color: #55d9e9; }
html[data-theme="dark"] .lang-toggle {
  color: var(--dark-text) !important;
  border-color: var(--dark-border) !important;
  background: rgba(255,255,255,.035) !important;
}
html[data-theme="dark"] .lang-toggle:hover { border-color: var(--teal) !important; color: var(--teal) !important; }
html[data-theme="dark"] .hamburger span { background: var(--dark-text) !important; }
html[data-theme="dark"] .mobile-menu {
  background: rgba(15,24,39,.985) !important;
  border-bottom-color: var(--dark-border) !important;
  box-shadow: 0 16px 38px rgba(0,0,0,.48) !important;
}

/* Main page surfaces and typography */
html[data-theme="dark"] .section-gray { background: var(--dark-bg-soft) !important; }
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .home-adm-title,
html[data-theme="dark"] .path-tools-intro h2,
html[data-theme="dark"] .edexcel-title,
html[data-theme="dark"] .privacy-section h2,
html[data-theme="dark"] .calendar-brand-title,
html[data-theme="dark"] .fyp-q-title,
html[data-theme="dark"] .fv-form-title { color: var(--dark-text) !important; }
html[data-theme="dark"] .section-sub,
html[data-theme="dark"] .home-adm-sub,
html[data-theme="dark"] .edexcel-text,
html[data-theme="dark"] .print-tip,
html[data-theme="dark"] .age-table-note { color: var(--dark-muted) !important; }
html[data-theme="dark"] .btn-outline { color: var(--dark-text); border-color: var(--dark-border); }
html[data-theme="dark"] .btn-outline:hover { color: var(--teal); border-color: var(--teal); background: rgba(0,188,212,.08); }

/* Reusable white/light cards */
html[data-theme="dark"] :is(
  .prog-card,
  .why-card,
  .news-card,
  .ql-card,
  .team-card,
  .branch-detail,
  .home-adm-panel,
  .home-adm-side-block,
  .home-adm-card,
  .newsletter-form-panel,
  .calendar-board,
  .month-card,
  .key-card:not(.dark),
  .contact-form-card,
  .office-hours-card,
  .map-card,
  .facility-card,
  .bus-card,
  .step-card,
  .dress-card,
  .faq-item,
  .privacy-section,
  .info-card:not(.navy):not(.purple),
  .prog-full-right,
  .subject-item,
  .curriculum-card.edexcel,
  .journey-form,
  .journey-stat,
  .j-card,
  .journey-result,
  .path-tool-card,
  .home-edexcel-strip,
  .age-table,
  .dak-ai-chat,
  .fyp-quiz-card,
  .fyp-result-card,
  .fyp-rec-card,
  .fv-form,
  .fv-result
) {
  background: var(--dark-surface) !important;
  border-color: var(--dark-border) !important;
  box-shadow: var(--shadow) !important;
}

html[data-theme="dark"] :is(
  .branch-detail-body,
  .branch-detail-row,
  .home-adm-card,
  .journey-footer,
  .journey-reset:hover,
  .faq-answer,
  .month-note,
  .mini-cal th,
  .summary-table th,
  .fyp-summary-item
) {
  background: var(--dark-surface-2) !important;
  border-color: var(--dark-border) !important;
}

/* Card headings and normal text */
html[data-theme="dark"] :is(
  .prog-title,
  .why-card h3,
  .news-title-text,
  .ql-title,
  .team-card h4,
  .branch-detail-row strong,
  .home-adm-panel-top h3,
  .home-adm-side-block h3,
  .home-adm-card strong,
  .journey-stat-num,
  .j-title,
  .journey-step-title,
  .path-tool-card,
  .path-tool-card h3,
  .path-tool-action,
  .home-edexcel-copy strong,
  .contact-form-card h2,
  .office-hours-card h4,
  .facility-card h3,
  .bus-card h4,
  .dress-card h4,
  .faq-question,
  .privacy-section h2,
  .prog-full-right h3,
  .fyp-option-title,
  .fyp-rec-name,
  .fyp-summary-value,
  .fyp-why-title,
  .fv-label,
  .fv-dream-name,
  .info-card h3,
  .info-row .val
) { color: var(--dark-text) !important; }

html[data-theme="dark"] :is(
  .prog-desc,
  .why-card p,
  .news-excerpt,
  .ql-desc,
  .team-card span,
  .branch-detail-row span,
  .home-adm-panel-top p,
  .home-adm-side-block p,
  .journey-stat-lbl,
  .j-year,
  .j-desc,
  .journey-step-age,
  .journey-step-desc,
  .journey-footer-text,
  .home-edexcel-copy span,
  .faq-answer,
  .privacy-section p,
  .privacy-section li,
  .fyp-q-sub,
  .fyp-rec-desc,
  .fv-form-sub
) { color: var(--dark-muted) !important; }

/* Forms, search fields and chatbot */
html[data-theme="dark"] :is(
  .form-group input,
  .form-group textarea,
  .form-group select,
  .journey-field input,
  .journey-field select,
  .journey-input-group input,
  .journey-premium-inputs input,
  .journey-premium-inputs select,
  .nl-form input,
  .dak-ai-input-row input,
  .fv-input,
  .fv-select
) {
  background: #101a29 !important;
  color: var(--dark-text) !important;
  border-color: var(--dark-border) !important;
  caret-color: var(--teal);
}
html[data-theme="dark"] :is(input,textarea)::placeholder { color: #7f8da0 !important; opacity: 1; }
html[data-theme="dark"] :is(
  .form-group label,
  .journey-field label,
  .journey-input-group label,
  .journey-premium-inputs label
) { color: var(--dark-text) !important; }
html[data-theme="dark"] select option { background: #101a29; color: var(--dark-text); }
html[data-theme="dark"] .dak-msg-bot,
html[data-theme="dark"] .dak-ai-suggestions button { background: var(--dark-surface-2) !important; color: var(--dark-text) !important; }
html[data-theme="dark"] .dak-ai-input-row { background: var(--dark-surface) !important; border-top-color: var(--dark-border) !important; }

/* Home page light sections */
html[data-theme="dark"] :is(
  .branches-section,
  .programmes-section,
  .news-section,
  .journey-section,
  .path-tools-section,
  .quick-access-premium,
  .premium-apps-section,
  .team-section,
  #our-campuses,
  .home-adm-section
) {
  background: var(--dark-bg) !important;
}
html[data-theme="dark"] .team-section {
  background: linear-gradient(180deg,#0b1220 0%,#101a29 62%,#151225 100%) !important;
}
html[data-theme="dark"] #our-campuses {
  background: linear-gradient(180deg,#0c1623 0%,#101d2a 100%) !important;
}
html[data-theme="dark"] .branch-detail-body {
  background: linear-gradient(180deg,#162335,#111c2b) !important;
}
html[data-theme="dark"] .branch-detail-row { background: rgba(255,255,255,.035) !important; }
html[data-theme="dark"] .team-card span { background: var(--dark-surface-2) !important; border-color: var(--dark-border) !important; }
html[data-theme="dark"] .home-edexcel-strip { background: rgba(20,31,48,.95) !important; }
html[data-theme="dark"] .home-edexcel-left img,
html[data-theme="dark"] .edexcel-card-logo { background: #fff !important; }

/* Tables and calendar */
html[data-theme="dark"] .age-table tbody td {
  color: var(--dark-text) !important;
  border-top-color: var(--dark-border) !important;
}
html[data-theme="dark"] .age-table tbody tr:hover { background: var(--dark-surface-2) !important; }
html[data-theme="dark"] .mini-cal th { color: var(--dark-text) !important; }
html[data-theme="dark"] .mini-cal td {
  background: #121d2c;
  color: #dbe4ee;
  border-color: #29394d;
}
html[data-theme="dark"] .mini-cal td.muted { background: #0e1724; color: #5f6e81; }
html[data-theme="dark"] .month-note { color: var(--dark-muted) !important; }
html[data-theme="dark"] .key-row,
html[data-theme="dark"] .summary-table th,
html[data-theme="dark"] .summary-table td { border-color: var(--dark-border) !important; }
html[data-theme="dark"] .key-text strong,
html[data-theme="dark"] .summary-table th,
html[data-theme="dark"] .summary-table .total td { color: var(--dark-text) !important; }
html[data-theme="dark"] .key-date { background: var(--dark-surface-2) !important; color: var(--dark-text) !important; }
html[data-theme="dark"] .summary-table td { color: var(--dark-muted) !important; }
html[data-theme="dark"] .summary-table .total td { background: rgba(245,166,35,.12) !important; }

/* Admissions and FAQ */
html[data-theme="dark"] .home-adm-table-wrap { border-color: var(--dark-border) !important; }
html[data-theme="dark"] .faq-item { border-color: var(--dark-border) !important; }
html[data-theme="dark"] .faq-answer { border-top-color: var(--dark-border) !important; }
html[data-theme="dark"] .uniform-poster-wrap,
html[data-theme="dark"] .uniform-card,
html[data-theme="dark"] .admission-form-card,
html[data-theme="dark"] .sidebar-card.gray {
  background: var(--dark-surface) !important;
  border-color: var(--dark-border) !important;
}
html[data-theme="dark"] :is(.uniform-card h4,.uniform-extra-title,.uniform-store-phone,.admission-form-card h2,.sidebar-card.gray h4,.step-card h4) {
  color: var(--dark-text) !important;
}

/* Contact and facilities */
html[data-theme="dark"] .info-card.teal-light {
  background: #12333a !important;
  border-color: rgba(0,188,212,.35) !important;
}
html[data-theme="dark"] .info-card.teal-light :is(h4,.info-row strong,.info-row .val) { color: var(--dark-text) !important; }
html[data-theme="dark"] .hours-row-item { border-color: var(--dark-border) !important; }
html[data-theme="dark"] .hours-row-item :is(strong,span) { color: var(--dark-text) !important; }
html[data-theme="dark"] .map-card iframe { filter: brightness(.82) contrast(1.06) saturate(.86); }

/* Find Your Path / Future Vision tools */
html[data-theme="dark"] .fyp-quiz-section,
html[data-theme="dark"] .fv-section { background: var(--dark-bg) !important; }
html[data-theme="dark"] .fyp-option,
html[data-theme="dark"] .fyp-summary-item,
html[data-theme="dark"] .fv-dreams {
  background: var(--dark-surface-2) !important;
  border-color: var(--dark-border) !important;
}
html[data-theme="dark"] .fyp-option:hover { border-color: var(--teal) !important; }
html[data-theme="dark"] .fyp-restart-btn,
html[data-theme="dark"] .fv-action-btn.secondary {
  color: var(--dark-text) !important;
  border-color: var(--dark-border) !important;
  background: var(--dark-surface-2) !important;
}

/* Programmes */
html[data-theme="dark"] .prog-tabs { background: var(--dark-surface) !important; border-color: var(--dark-border) !important; }
html[data-theme="dark"] .prog-tab { color: var(--dark-muted) !important; }
html[data-theme="dark"] .prog-tab.active { color: var(--dark-text) !important; background: var(--dark-surface-2) !important; }
html[data-theme="dark"] .subject-item { color: var(--dark-text) !important; }
html[data-theme="dark"] .prog-tag,
html[data-theme="dark"] .edexcel-pill { color: var(--dark-text) !important; }
html[data-theme="dark"] .curriculum-card.edexcel { color: var(--dark-text) !important; }
html[data-theme="dark"] .curriculum-card.edexcel h3 { color: var(--dark-text) !important; }
html[data-theme="dark"] .curriculum-card.edexcel p { color: var(--dark-muted) !important; }

/* Keep intentionally coloured/dark blocks readable. */
html[data-theme="dark"] :is(
  .topbar,
  .page-hero,
  .hero-left,
  .why-panel,
  .newsletter,
  .day-panel,
  .journey-header,
  .home-adm-side-cta,
  .key-card.dark,
  .info-card.navy,
  .info-card.purple,
  .branch-hero,
  .fyp-result-header,
  .fv-hero,
  .mission-card,
  .prog-full-left,
  .facility-header.c-teal,
  .facility-header.c-purple,
  .facility-header.c-orange
) { color: #fff; }
html[data-theme="dark"] :is(
  .page-hero h1,
  .hero-title,
  .hero-stat .stat-num,
  .why-panel-title,
  .newsletter h2,
  .journey-header,
  .journey-child-name,
  .home-adm-cta-title,
  .key-card.dark h3,
  .key-card.dark .key-text strong,
  .key-card.dark .key-date,
  .info-card.navy h4,
  .info-card.purple h4,
  .mission-card h3,
  .value-title,
  .prog-full-left h2,
  .prog-full-left .age,
  .facility-header.c-teal h3,
  .facility-header.c-purple h3,
  .facility-header.c-orange h3,
  .dak-ai-name,
  .dak-msg-user,
  .nav-cta,
  .btn-purple,
  .btn-ghost
) { color: #fff !important; }

/* Teal/yellow controls need dark text for contrast even at night. */
html[data-theme="dark"] :is(
  .btn-teal,
  .btn-portal:hover,
  .calendar-year-pill,
  .calendar-note,
  .month-card.summer .month-head,
  .map-label.teal,
  .facility-header.c-yellow h3,
  .path-dot.start,
  .path-dot.finish
) { color: #10222a !important; }

/* Logos and photography are deliberately left unchanged. */
html[data-theme="dark"] img,
html[data-theme="dark"] video,
html[data-theme="dark"] .slide,
html[data-theme="dark"] .photo-slide,
html[data-theme="dark"] .hero-right,
html[data-theme="dark"] .day-picture {
  color-scheme: normal;
}

/* Accessibility */
html[data-theme="dark"] :focus-visible {
  outline: 3px solid rgba(0,188,212,.72);
  outline-offset: 3px;
}
html[data-theme="dark"] ::selection { background: rgba(0,188,212,.32); color: #fff; }

@media print {
  html[data-theme="dark"],
  html[data-theme="dark"] body {
    color-scheme: light;
    background: #fff !important;
    color: #1A2332 !important;
  }
}

/* Final safety pass for later versioned/mobile rules in the original stylesheet. */
html[data-theme="dark"] body,
html[data-theme="dark"] .hero,
html[data-theme="dark"] .section {
  background: var(--dark-bg) !important;
}
html[data-theme="dark"] :is(
  .branches-section,
  .why-section,
  .day-at-dak,
  .quick-access-premium,
  .journey-premium-section,
  .path-tools-section,
  .edexcel-recognition-section,
  .fyp-quiz-section,
  .fv-section
) {
  background: linear-gradient(180deg,#0b1220 0%,#0f1928 100%) !important;
}
html[data-theme="dark"] :is(
  .quick-directory,
  .journey-premium-card,
  .journey-form-panel,
  .path-tools-panel,
  .edexcel-recognition-card,
  .edexcel-content,
  .office-status-card,
  .hero-pill,
  .portal-badge
) {
  background: rgba(20,31,48,.96) !important;
  border-color: var(--dark-border) !important;
  box-shadow: var(--shadow-md) !important;
}
html[data-theme="dark"] .journey-form-panel {
  background: linear-gradient(180deg,#141f30 0%,#101a29 100%) !important;
}
html[data-theme="dark"] .edexcel-logo-wrap {
  background: linear-gradient(135deg,#182538,#111c2b) !important;
  border-color: var(--dark-border) !important;
}
html[data-theme="dark"] .ql-card {
  background: linear-gradient(135deg,#182538,#121d2c) !important;
  border-color: var(--dark-border) !important;
  box-shadow: var(--shadow) !important;
}
html[data-theme="dark"] .ql-card:hover {
  background: linear-gradient(135deg,#1d2c40,#162538) !important;
}
html[data-theme="dark"] .ql-desc { color: var(--dark-muted) !important; }
html[data-theme="dark"] .ql-arrow { background: #27384c !important; color: #fff !important; }
html[data-theme="dark"] :is(.hero-pill,.portal-badge) :is(strong,span) { color: var(--dark-text) !important; }
html[data-theme="dark"] .hero-pill,
html[data-theme="dark"] .portal-badge { backdrop-filter: blur(12px); }
html[data-theme="dark"] .office-status-card,
html[data-theme="dark"] .office-status-title,
html[data-theme="dark"] .office-status-card :is(strong,span) { color: var(--dark-text) !important; }
html[data-theme="dark"] .office-status-note { color: var(--dark-muted) !important; }
html[data-theme="dark"] .office-status-action {
  background: var(--dark-surface-2) !important;
  border-color: var(--dark-border) !important;
  color: var(--dark-text) !important;
}
html[data-theme="dark"] .journey-form-head strong,
html[data-theme="dark"] .journey-form-panel .journey-form-head strong,
html[data-theme="dark"] .path-tools-intro,
html[data-theme="dark"] .path-tools-intro h2 { color: var(--dark-text) !important; }
html[data-theme="dark"] .journey-form-panel .journey-form-head small { color: var(--dark-muted) !important; }
html[data-theme="dark"] .journey-premium-card,
html[data-theme="dark"] .journey-premium-result { border-color: var(--dark-border) !important; }
html[data-theme="dark"] .edexcel-recognition-card { color: var(--dark-text) !important; }
html[data-theme="dark"] .edexcel-logo-wrap img,
html[data-theme="dark"] .edexcel-card-logo { background: #fff !important; }
html[data-theme="dark"] .prog-tag,
html[data-theme="dark"] .activity-chip {
  background: var(--dark-surface-2) !important;
  border-color: var(--dark-border) !important;
  color: var(--dark-text) !important;
}
html[data-theme="dark"] .uniform-note {
  background: #2b2317 !important;
  border-color: #8d6427 !important;
  color: #f3dfbd !important;
}
html[data-theme="dark"] .uniform-note :is(strong,p) { color: #f3dfbd !important; }
html[data-theme="dark"] .dak-ai-suggestions,
html[data-theme="dark"] .dak-mascot-wave,
html[data-theme="dark"] .dak-loader-logo {
  background: var(--dark-surface) !important;
  border-color: var(--dark-border) !important;
}
html[data-theme="dark"] :is(.est-year,.cal-month-year,.cal-day) { color: var(--dark-text) !important; }
html[data-theme="dark"] .cal-day:not(.empty):not(.weekend):hover { background: var(--dark-surface-3) !important; }
html[data-theme="dark"] .newsletter-form-panel :is(h3,p,label) {
  color: var(--dark-text) !important;
}
html[data-theme="dark"] .newsletter-form-panel p { color: var(--dark-muted) !important; }
html[data-theme="dark"] .map-open,
html[data-theme="dark"] .map-card .map-open {
  background: var(--dark-surface-2) !important;
  border-color: var(--dark-border) !important;
  color: var(--dark-text) !important;
}
html[data-theme="dark"] .activity-card,
html[data-theme="dark"] .subject-card,
html[data-theme="dark"] .contact-card {
  background: var(--dark-surface) !important;
  border-color: var(--dark-border) !important;
  color: var(--dark-text) !important;
}
html[data-theme="dark"] :is(.activity-card h3,.subject-card h3,.contact-card h3) { color: var(--dark-text) !important; }

/* Visual QA corrections: protect text contrast in nested light components. */
html[data-theme="dark"] .newsletter-form-title,
html[data-theme="dark"] .key-card:not(.dark) h3 {
  color: var(--dark-text) !important;
}
html[data-theme="dark"] .facility-body {
  background: var(--dark-surface) !important;
  color: var(--dark-muted) !important;
}
html[data-theme="dark"] .facility-body ul li {
  color: var(--dark-muted) !important;
  border-bottom-color: var(--dark-border) !important;
}
html[data-theme="dark"] .info-card p {
  color: var(--dark-muted) !important;
}
html[data-theme="dark"] .info-row .lbl {
  color: var(--dark-muted-2) !important;
}

/* ==========================================================
   Dark-mode refinement: navbar brand, language switch, and
   programme stage tabs. Added after visual QA screenshots.
   ========================================================== */

/* Use the official full-colour school mark with a dedicated light-text lockup.
   Both files preserve the official logo geometry; only the lettering colour changes. */
html[data-theme="dark"] nav > .logo {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
.logo .logo-dark { display: none !important; }
html[data-theme="dark"] .logo .logo-light { display: none !important; }
html[data-theme="dark"] .logo .logo-dark {
  display: block !important;
  opacity: 1 !important;
  filter: drop-shadow(0 3px 8px rgba(0,0,0,.24)) !important;
}

/* The generated label is a child element, so it needs its own dark-mode colour. */
html[data-theme="dark"] .lang-toggle-label {
  color: #f4f8fc !important;
}
html[data-theme="dark"] .lang-toggle-track {
  background: linear-gradient(135deg, #203044, #172337) !important;
  border-color: rgba(97,228,244,.34) !important;
  box-shadow: inset 0 1px 5px rgba(0,0,0,.34) !important;
}
html[data-theme="dark"] .mobile-menu .lang-toggle-label::before {
  color: rgba(237,243,249,.58) !important;
}

/* Remove the full-width pale bar and make every stage tab a true dark-mode pill. */
html[data-theme="dark"] .prog-tabs {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .prog-tab {
  background: var(--dark-surface) !important;
  color: #cbd6e3 !important;
  border-color: #34465d !important;
  box-shadow: 0 5px 16px rgba(0,0,0,.18) !important;
}
html[data-theme="dark"] .prog-tab:hover {
  background: var(--dark-surface-2) !important;
  color: #72e8f5 !important;
  border-color: #00bcd4 !important;
}
html[data-theme="dark"] .prog-tab.active {
  background: linear-gradient(135deg, rgba(0,188,212,.18), rgba(107,63,160,.16)) !important;
  color: #ffffff !important;
  border-color: #00cbe3 !important;
  box-shadow: 0 0 0 1px rgba(0,203,227,.10), 0 8px 22px rgba(0,0,0,.24) !important;
}


/* ==========================================================
   USER THEME CONTROLS
   Desktop: compact menu beside the language switch.
   Mobile: clear three-option appearance selector.
   ========================================================== */
.theme-control {
  position: relative;
  font-family: 'DM Sans', sans-serif;
  color: var(--text);
}
.theme-control button {
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}
.theme-control--desktop {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  flex: 0 0 auto;
}
html[dir="rtl"] .theme-control--desktop {
  margin-left: 0;
  margin-right: 4px;
}
.theme-trigger {
  min-width: 42px;
  height: 38px;
  padding: 0 9px;
  border: 1px solid rgba(26,35,50,.12);
  border-radius: 11px;
  background: linear-gradient(135deg,#fff,#f7fbfd);
  color: var(--navy);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  box-shadow: 0 7px 18px rgba(26,35,50,.07), inset 0 1px 0 rgba(255,255,255,.95);
  transition: border-color .2s ease, color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.theme-trigger:hover,
.theme-control.is-open .theme-trigger {
  color: var(--teal-dark);
  border-color: rgba(0,188,212,.42);
  box-shadow: 0 10px 22px rgba(26,35,50,.11), 0 0 0 4px rgba(0,188,212,.07);
  transform: translateY(-1px);
}
.theme-trigger:focus-visible,
.theme-choice:focus-visible,
.theme-segment-option:focus-visible {
  outline: 3px solid rgba(0,188,212,.28);
  outline-offset: 2px;
}
.theme-trigger-icon,
.theme-choice-icon,
.theme-mobile-heading-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.theme-trigger-icon svg {
  width: 19px;
  height: 19px;
}
.theme-trigger-icon svg,
.theme-choice-icon svg,
.theme-mobile-heading-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.theme-trigger-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.theme-trigger-chevron {
  width: 12px;
  height: 12px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .55;
  transition: transform .2s ease;
}
.theme-control.is-open .theme-trigger-chevron { transform: rotate(180deg); }
.theme-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 1000;
  width: 208px;
  padding: 7px;
  border-radius: 16px;
  background: rgba(255,255,255,.985);
  border: 1px solid rgba(26,35,50,.11);
  box-shadow: 0 22px 60px rgba(26,35,50,.18), 0 3px 12px rgba(26,35,50,.08);
  backdrop-filter: blur(18px);
  transform-origin: top right;
}
html[dir="rtl"] .theme-menu {
  right: auto;
  left: 0;
  transform-origin: top left;
}
.theme-menu[hidden] { display: none !important; }
.theme-choice {
  width: 100%;
  min-height: 52px;
  padding: 8px 9px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--navy);
  display: grid;
  grid-template-columns: 30px 1fr 18px;
  align-items: center;
  gap: 8px;
  text-align: left;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}
html[dir="rtl"] .theme-choice { text-align: right; }
.theme-choice:hover { background: #f2f8fa; }
.theme-choice.is-active {
  background: linear-gradient(135deg,rgba(0,188,212,.11),rgba(107,63,160,.08));
  color: #087f8e;
}
.theme-choice-icon {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: rgba(26,35,50,.055);
}
.theme-choice.is-active .theme-choice-icon { background: rgba(0,188,212,.13); }
.theme-choice-icon svg { width: 17px; height: 17px; }
.theme-choice-copy { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.theme-choice-copy strong { font-size: 13px; font-weight: 800; color: inherit; }
.theme-choice-copy small { font-size: 10.5px; font-weight: 600; color: var(--text-muted); margin-top: 2px; }
.theme-choice-check { font-size: 14px; font-weight: 900; color: var(--teal-dark); opacity: 0; }
.theme-choice.is-active .theme-choice-check { opacity: 1; }
.theme-control--mobile { display: none; }

@media (max-width: 768px) {
  .theme-control--desktop { display: none !important; }
  .mobile-menu .theme-control--mobile {
    display: block;
    width: 100%;
    margin: 8px 0 0;
    padding: 10px;
    border-radius: 15px;
    background: linear-gradient(135deg,rgba(255,255,255,.99),rgba(244,251,253,.97));
    border: 1px solid rgba(0,188,212,.19);
    box-shadow: 0 10px 24px rgba(26,35,50,.07);
  }
  .theme-mobile-heading {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 2px 8px;
    color: var(--navy);
    font-size: 11.5px;
    font-weight: 900;
    letter-spacing: .025em;
  }
  .theme-mobile-heading-icon { color: var(--teal-dark); }
  .theme-mobile-heading-icon svg { width: 16px; height: 16px; }
  .theme-segment {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 5px;
    padding: 4px;
    border-radius: 12px;
    background: rgba(26,35,50,.055);
  }
  .theme-segment-option {
    min-width: 0;
    min-height: 42px;
    padding: 6px 4px;
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    color: var(--text-muted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    cursor: pointer;
    transition: background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
  }
  .theme-segment-option .theme-choice-icon { width: 20px; height: 20px; background: transparent; }
  .theme-segment-option .theme-choice-icon svg { width: 16px; height: 16px; }
  .theme-segment-option .theme-choice-copy { align-items: center; }
  .theme-segment-option .theme-choice-copy strong { font-size: 11.5px; font-weight: 800; }
  .theme-segment-option .theme-choice-copy small,
  .theme-segment-option .theme-choice-check { display: none; }
  .theme-segment-option.is-active {
    background: #fff;
    color: var(--navy);
    border-color: rgba(0,188,212,.2);
    box-shadow: 0 5px 14px rgba(26,35,50,.09);
  }
}

/* Dark appearance for both desktop and mobile controls. */
html[data-theme="dark"] .theme-trigger {
  background: linear-gradient(135deg,#192638,#121c2b);
  color: #e8f1f8;
  border-color: #34465d;
  box-shadow: 0 8px 20px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"] .theme-trigger:hover,
html[data-theme="dark"] .theme-control.is-open .theme-trigger {
  color: #72e8f5;
  border-color: #00bcd4;
  background: linear-gradient(135deg,#1d2c40,#162538);
  box-shadow: 0 11px 26px rgba(0,0,0,.3), 0 0 0 4px rgba(0,188,212,.08);
}
html[data-theme="dark"] .theme-menu {
  background: rgba(20,31,48,.985);
  border-color: #34465d;
  box-shadow: 0 24px 65px rgba(0,0,0,.48), 0 3px 14px rgba(0,0,0,.3);
}
html[data-theme="dark"] .theme-choice { color: #eaf1f7; }
html[data-theme="dark"] .theme-choice:hover { background: #1b2a3d; }
html[data-theme="dark"] .theme-choice.is-active {
  background: linear-gradient(135deg,rgba(0,188,212,.17),rgba(107,63,160,.14));
  color: #78e9f5;
}
html[data-theme="dark"] .theme-choice-icon { background: rgba(255,255,255,.055); }
html[data-theme="dark"] .theme-choice.is-active .theme-choice-icon { background: rgba(0,188,212,.16); }
html[data-theme="dark"] .theme-choice-copy small { color: #91a1b3; }
html[data-theme="dark"] .theme-choice-check { color: #61e4f4; }

@media (max-width: 768px) {
  html[data-theme="dark"] .mobile-menu .theme-control--mobile {
    background: linear-gradient(135deg,#172438,#111b2a);
    border-color: #31435a;
    box-shadow: 0 12px 28px rgba(0,0,0,.26);
  }
  html[data-theme="dark"] .theme-mobile-heading { color: #edf3f9; }
  html[data-theme="dark"] .theme-mobile-heading-icon { color: #61e4f4; }
  html[data-theme="dark"] .theme-segment { background: rgba(0,0,0,.18); }
  html[data-theme="dark"] .theme-segment-option { color: #93a2b5; }
  html[data-theme="dark"] .theme-segment-option.is-active {
    background: #223248;
    color: #fff;
    border-color: rgba(0,188,212,.38);
    box-shadow: 0 6px 16px rgba(0,0,0,.24);
  }
}


/* DAK School Assistant v2.0 dark mode */
html[data-theme="dark"] .dak-ai-disclaimer{
  background:#101a29 !important;
  color:#91a0b2 !important;
  border-top-color:var(--dark-border) !important;
}
html[data-theme="dark"] .dak-msg-actions{border-top-color:var(--dark-border) !important;}
html[data-theme="dark"] .dak-msg-action{
  background:#162335 !important;
  color:#d9c8f3 !important;
  border-color:rgba(174,137,230,.28) !important;
}
html[data-theme="dark"] .dak-msg-action:hover,
html[data-theme="dark"] .dak-msg-action:focus-visible{
  background:#211a35 !important;
  border-color:rgba(174,137,230,.5) !important;
}


/* ==========================================================
   REFINED DARK MODE — GUIDED PATH CARDS
   Scope: homepage "Find the Right Programme" and
   "Visualise the Future" cards only.
   ========================================================== */
html[data-theme="dark"] .path-tools-panel {
  background: linear-gradient(145deg, #101c2b 0%, #122235 100%) !important;
  border-color: rgba(126, 165, 196, .25) !important;
  box-shadow:
    0 28px 70px rgba(0, 0, 0, .38),
    inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html[data-theme="dark"] .path-tool-card {
  background: linear-gradient(145deg, #18273a 0%, #142134 100%) !important;
  border-color: rgba(83, 214, 232, .22) !important;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, .26),
    inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html[data-theme="dark"] .path-tool-card.purple {
  background: linear-gradient(145deg, #20233f 0%, #171f34 100%) !important;
  border-color: rgba(166, 130, 225, .25) !important;
}

html[data-theme="dark"] .path-tool-card::before {
  background:
    radial-gradient(circle at 0 0, rgba(0, 188, 212, .13), transparent 46%),
    linear-gradient(90deg, rgba(0, 188, 212, .035), transparent 55%) !important;
  opacity: 1 !important;
}

html[data-theme="dark"] .path-tool-card.purple::before {
  background:
    radial-gradient(circle at 0 0, rgba(126, 84, 190, .18), transparent 46%),
    linear-gradient(90deg, rgba(126, 84, 190, .045), transparent 55%) !important;
}

html[data-theme="dark"] .path-tool-card h3 {
  color: #f7f9fc !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .2);
}

html[data-theme="dark"] .path-tool-card p {
  color: #b8c5d6 !important;
}

html[data-theme="dark"] .path-tool-index {
  color: #54d8e9 !important;
  background: #102b3a !important;
  border-color: rgba(84, 216, 233, .58) !important;
  box-shadow:
    inset 0 0 0 4px rgba(84, 216, 233, .075),
    0 10px 24px rgba(0, 0, 0, .18) !important;
}

html[data-theme="dark"] .path-tool-card.purple .path-tool-index {
  color: #ad86ec !important;
  background: #282342 !important;
  border-color: rgba(173, 134, 236, .55) !important;
  box-shadow:
    inset 0 0 0 4px rgba(173, 134, 236, .075),
    0 10px 24px rgba(0, 0, 0, .18) !important;
}

html[data-theme="dark"] .path-tool-icon {
  color: #eefbff !important;
  background: #203247 !important;
  border: 1px solid rgba(84, 216, 233, .20) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, .22) !important;
}

html[data-theme="dark"] .path-tool-card.purple .path-tool-icon {
  color: #f4efff !important;
  background: #292742 !important;
  border-color: rgba(173, 134, 236, .22) !important;
}

html[data-theme="dark"] .path-tool-action {
  color: #f8fcff !important;
  background: rgba(0, 188, 212, .15) !important;
  border: 1px solid rgba(84, 216, 233, .30) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html[data-theme="dark"] .path-tool-card.purple .path-tool-action {
  background: rgba(126, 84, 190, .18) !important;
  border-color: rgba(173, 134, 236, .30) !important;
}

html[data-theme="dark"] .path-tool-arrow {
  color: #ffffff !important;
  background: rgba(7, 18, 31, .72) !important;
  border: 1px solid rgba(255, 255, 255, .08) !important;
}

html[data-theme="dark"] .path-tool-card::after {
  background: linear-gradient(90deg, #18c7dd, #6481dd, #9668d6) !important;
  opacity: .9 !important;
}

html[data-theme="dark"] .path-tool-card:hover {
  background: linear-gradient(145deg, #1b2d42 0%, #17263a 100%) !important;
  border-color: rgba(84, 216, 233, .48) !important;
  box-shadow: 0 24px 54px rgba(0, 0, 0, .34) !important;
}

html[data-theme="dark"] .path-tool-card.purple:hover {
  background: linear-gradient(145deg, #28294a 0%, #1b253b 100%) !important;
  border-color: rgba(173, 134, 236, .45) !important;
}

@media (max-width: 620px) {
  html[data-theme="dark"] .path-tool-card {
    padding: 24px 22px !important;
  }

  html[data-theme="dark"] .path-tool-card h3 {
    padding-right: 46px;
  }

  html[dir="rtl"][data-theme="dark"] .path-tool-card h3 {
    padding-right: 0;
    padding-left: 46px;
  }
}

/* ==========================================================
   GUIDED TOOLS — COMPLETE DARK MODE REFINEMENT V2
   Scope: Find the Right Programme + Visualise the Future.
   Light mode remains untouched.
   ========================================================== */
html[data-theme="dark"] .fyp-quiz-section,
html[data-theme="dark"] .fv-section {
  background: linear-gradient(180deg, #0a1220 0%, #0d1726 100%) !important;
}

/* Find the Right Programme: shell and progress */
html[data-theme="dark"] .fyp-progress {
  background: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.35) !important;
}
html[data-theme="dark"] .fyp-progress-bar {
  background: linear-gradient(90deg, #11bfd4 0%, #7650bd 100%) !important;
  box-shadow: 0 0 16px rgba(17,191,212,.28) !important;
}
html[data-theme="dark"] .fyp-progress-label {
  color: #91a1b5 !important;
}
html[data-theme="dark"] .fyp-quiz-card,
html[data-theme="dark"] .fyp-result-card {
  background: linear-gradient(160deg, #142135 0%, #111d2e 100%) !important;
  border: 1px solid #2c3e55 !important;
  box-shadow: 0 22px 58px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.025) !important;
}
html[data-theme="dark"] .fyp-q-num {
  background: #292442 !important;
  border: 1px solid rgba(166,124,224,.32) !important;
  color: #c8a9f0 !important;
}
html[data-theme="dark"] .fyp-q-title {
  color: #f5f8fc !important;
  text-shadow: none !important;
}
html[data-theme="dark"] .fyp-q-sub {
  color: #b4c1d1 !important;
}

/* Find the Right Programme: choices */
html[data-theme="dark"] .fyp-option {
  background: #19283b !important;
  border-color: #30435a !important;
  color: #f2f6fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
}
html[data-theme="dark"] .fyp-option:hover {
  background: #1d3045 !important;
  border-color: #29bfd3 !important;
  transform: translateX(2px);
}
html[dir="rtl"][data-theme="dark"] .fyp-option:hover {
  transform: translateX(-2px);
}
html[data-theme="dark"] .fyp-option.selected {
  background: linear-gradient(135deg, rgba(34,103,130,.34), rgba(95,61,151,.28)) !important;
  border-color: #25bfd4 !important;
  box-shadow: 0 0 0 1px rgba(37,191,212,.16), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html[data-theme="dark"] .fyp-option-icon {
  background: #25374c !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  color: #eaf1f8 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .fyp-option.selected .fyp-option-icon {
  background: linear-gradient(145deg, #7045b3, #59368e) !important;
  border-color: rgba(194,159,239,.32) !important;
  color: #fff !important;
}
html[data-theme="dark"] .fyp-option-title {
  color: #f5f8fc !important;
}
html[data-theme="dark"] .fyp-option-desc {
  color: #b7c4d4 !important;
}
html[data-theme="dark"] .fyp-input {
  background: #0f1b2b !important;
  border-color: #30435a !important;
  color: #f5f8fc !important;
  caret-color: #24c2d8 !important;
}
html[data-theme="dark"] .fyp-input:focus {
  border-color: #25bfd4 !important;
  box-shadow: 0 0 0 3px rgba(37,191,212,.10) !important;
}
html[data-theme="dark"] .fyp-back-btn {
  color: #bac7d7 !important;
}
html[data-theme="dark"] .fyp-back-btn:hover {
  color: #ffffff !important;
}
html[data-theme="dark"] .fyp-next-btn {
  background: linear-gradient(135deg, #7445b5, #6537a5) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(83,48,142,.24) !important;
}
html[data-theme="dark"] .fyp-next-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #8252c2, #7040b2) !important;
}
html[data-theme="dark"] .fyp-next-btn:disabled {
  background: #34334d !important;
  color: #7f8795 !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

/* Find the Right Programme: result */
html[data-theme="dark"] .fyp-result-body {
  background: #111d2e !important;
}
html[data-theme="dark"] .fyp-rec-card {
  background: linear-gradient(135deg, rgba(100,70,164,.23), rgba(21,145,159,.19)) !important;
  border: 1px solid rgba(91,197,211,.22) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .fyp-rec-label {
  color: #bda1e8 !important;
}
html[data-theme="dark"] .fyp-rec-name,
html[data-theme="dark"] .fyp-summary-value,
html[data-theme="dark"] .fyp-why-title {
  color: #f5f8fc !important;
}
html[data-theme="dark"] .fyp-rec-desc,
html[data-theme="dark"] .fyp-summary-label,
html[data-theme="dark"] .fyp-why-list li {
  color: #b7c4d4 !important;
}
html[data-theme="dark"] .fyp-summary-item {
  background: #19283b !important;
  border: 1px solid #2c3e55 !important;
}
html[data-theme="dark"] .fyp-why-list {
  background: #19283b !important;
  border: 1px solid #2c3e55 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .fyp-why-list li::before {
  background: #17bdd2 !important;
  color: #071820 !important;
}
html[data-theme="dark"] .fyp-principal-msg {
  background: #0e1928 !important;
  border: 1px solid #2c3e55 !important;
}
html[data-theme="dark"] .fyp-principal-text {
  color: #c6d1df !important;
}
html[data-theme="dark"] .fyp-restart-btn {
  background: #19283b !important;
  color: #f2f6fb !important;
  border-color: #344960 !important;
}
html[data-theme="dark"] .fyp-restart-btn:hover {
  background: #203248 !important;
  border-color: #5a708a !important;
}

/* Visualise the Future: form */
html[data-theme="dark"] .fv-form {
  background: linear-gradient(160deg, #142135 0%, #111d2e 100%) !important;
  border: 1px solid #2c3e55 !important;
  box-shadow: 0 22px 58px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.025) !important;
}
html[data-theme="dark"] .fv-form-title,
html[data-theme="dark"] .fv-label {
  color: #f5f8fc !important;
}
html[data-theme="dark"] .fv-form-sub {
  color: #b4c1d1 !important;
}
html[data-theme="dark"] .fv-input,
html[data-theme="dark"] .fv-select {
  background: #0f1b2b !important;
  color: #f5f8fc !important;
  border-color: #30435a !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .fv-input:focus,
html[data-theme="dark"] .fv-select:focus {
  border-color: #25bfd4 !important;
  box-shadow: 0 0 0 3px rgba(37,191,212,.10) !important;
}
html[data-theme="dark"] .fv-dreams {
  background: transparent !important;
  border: 0 !important;
}
html[data-theme="dark"] .fv-dream {
  background: #19283b !important;
  border-color: #30435a !important;
  color: #f2f6fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
}
html[data-theme="dark"] .fv-dream:hover {
  background: #1d3045 !important;
  border-color: #29bfd3 !important;
}
html[data-theme="dark"] .fv-dream.selected {
  background: linear-gradient(145deg, rgba(34,103,130,.34), rgba(95,61,151,.28)) !important;
  border-color: #25bfd4 !important;
  box-shadow: 0 0 0 1px rgba(37,191,212,.15) !important;
}
html[data-theme="dark"] .fv-dream-name {
  color: #eef4fa !important;
}
html[data-theme="dark"] .fv-generate-btn {
  background: linear-gradient(135deg, #7445b5, #6537a5) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(83,48,142,.24) !important;
}
html[data-theme="dark"] .fv-generate-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #8252c2, #7040b2) !important;
}
html[data-theme="dark"] .fv-generate-btn:disabled {
  background: #34334d !important;
  color: #858d9a !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

/* Visualise the Future: generated poster and actions */
html[data-theme="dark"] .fv-result {
  background: transparent !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .fv-poster-wrap {
  background: #141f30 !important;
  border: 1px solid #2c3e55 !important;
  box-shadow: 0 22px 58px rgba(0,0,0,.34) !important;
}
html[data-theme="dark"] .fv-poster-frame {
  background: #0d1726 !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.30) !important;
}
html[data-theme="dark"] .fv-action-btn.secondary {
  background: #19283b !important;
  color: #f2f6fb !important;
  border-color: #344960 !important;
}
html[data-theme="dark"] .fv-action-btn.secondary:hover {
  background: #203248 !important;
  border-color: #5a708a !important;
}

/* Mobile refinements for both tools */
@media (max-width: 700px) {
  html[data-theme="dark"] .fyp-quiz-card,
  html[data-theme="dark"] .fv-form {
    border-radius: 18px !important;
  }
  html[data-theme="dark"] .fyp-option {
    padding: 16px 15px !important;
    gap: 13px !important;
  }
  html[data-theme="dark"] .fyp-option-icon {
    width: 44px !important;
    height: 44px !important;
  }
  html[data-theme="dark"] .fv-dream {
    padding: 15px 10px !important;
  }
  html[data-theme="dark"] .fv-poster-wrap {
    padding: 12px !important;
  }
}

/* Cambridge Secondary teaching programme choices */
html[data-theme="dark"] .prog-card.c3 .prog-track-option {
  background: rgba(245,166,35,.035) !important;
  border-color: rgba(245,166,35,.14) !important;
  color: var(--dark-text) !important;
}


/* ==========================================================
   FINAL THEME SAFETY NET
   Keeps browser controls and floating WhatsApp UI consistent
   with the selected Light / Dark appearance.
   ========================================================== */
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }

html[data-theme="dark"] .wa-menu {
  background: #0f1b2b !important;
  border: 1px solid #2b3c50 !important;
  box-shadow: 0 20px 58px rgba(0,0,0,.46) !important;
}
html[data-theme="dark"] .wa-menu-body { background: #0b1521 !important; }
html[data-theme="dark"] .wa-greeting,
html[data-theme="dark"] .wa-option {
  background: #142438 !important;
  color: #edf4f7 !important;
  border: 1px solid rgba(255,255,255,.055) !important;
}
html[data-theme="dark"] .wa-option-name { color: #edf4f7 !important; }
html[data-theme="dark"] .wa-option-number { color: #9eafbf !important; }
html[data-theme="dark"] .wa-greeting { color: #dfe9ee !important; }
html[data-theme="dark"] .wa-greeting::before {
  border-color: transparent #142438 transparent transparent !important;
}
html[dir="rtl"][data-theme="dark"] .wa-greeting::before {
  border-color: transparent transparent transparent #142438 !important;
}
html[data-theme="dark"] .wa-option:hover {
  background: #1f8f50 !important;
  border-color: #29b865 !important;
  color: #fff !important;
}
html[data-theme="dark"] .wa-option:hover .wa-option-name,
html[data-theme="dark"] .wa-option:hover .wa-option-number { color: #fff !important; }
html[data-theme="dark"] .wa-menu-footer {
  background: #0c1724 !important;
  color: #91a2b4 !important;
  border-top-color: #27384b !important;
}


/* DAK CSS: assistant-v4.css */
/* ==========================================================
   DAK SMART ASSISTANT v4
   Modern local school assistant. Loaded after dark-mode.css.
   ========================================================== */
:root{
  --dak-chat-accent:#00a9bd;
  --dak-chat-accent-strong:#008fa2;
  --dak-chat-ink:#142136;
  --dak-chat-muted:#66768b;
  --dak-chat-line:rgba(20,33,54,.10);
  --dak-chat-surface:#ffffff;
  --dak-chat-soft:#f4f7fa;
}

.dak-ai-bubble{
  width:68px!important;
  height:68px!important;
  right:32px!important;
  bottom:88px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:50%!important;
  color:#fff!important;
  background:linear-gradient(145deg,#7b4bc2 0%,#6B3FA0 62%,#56308c 100%)!important;
  box-shadow:0 14px 34px rgba(107,63,160,.38),0 0 0 8px rgba(107,63,160,.08)!important;
  animation:dakBotClassicFloat 3.8s ease-in-out infinite!important;
  overflow:visible!important;
  transform:none!important;
}
.dak-ai-bubble::before{
  content:""!important;
  position:absolute!important;
  inset:-6px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(255,255,255,.18),transparent 68%)!important;
  border:0!important;
  pointer-events:none!important;
  z-index:0!important;
}
.dak-ai-bubble::after{
  content:""!important;
  position:absolute!important;
  top:8px!important;
  right:7px!important;
  width:10px!important;
  height:10px!important;
  border-radius:999px!important;
  background:#20d982!important;
  border:2px solid #fff!important;
  box-shadow:0 0 12px rgba(32,217,130,.75)!important;
  z-index:3!important;
}
.dak-ai-bubble .dak-bot-mark,
.dak-ai-bubble svg{
  display:block!important;
  position:relative!important;
  z-index:2!important;
  width:43px!important;
  height:43px!important;
  filter:drop-shadow(0 8px 14px rgba(26,35,50,.24))!important;
  transition:transform .28s ease!important;
}
.dak-ai-bubble img{display:none!important;}
.dak-ai-bubble:hover{
  transform:translateY(-5px) scale(1.10)!important;
  box-shadow:0 18px 44px rgba(107,63,160,.48),0 0 0 10px rgba(0,188,212,.08)!important;
}
.dak-ai-bubble:hover .dak-bot-mark,
.dak-ai-bubble:hover svg{transform:rotate(-3deg) scale(1.04)!important;}
.dak-ai-bubble:focus-visible{outline:3px solid rgba(0,188,212,.48)!important;outline-offset:4px!important;}
body.dak-chat-open .dak-ai-bubble{opacity:0;pointer-events:none;transform:translateY(10px)!important;}
@keyframes dakBotClassicFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
@media(max-width:640px){
  .dak-ai-bubble{
    width:62px!important;
    height:62px!important;
    right:14px!important;
    bottom:82px!important;
  }
  .dak-ai-bubble .dak-bot-mark,
  .dak-ai-bubble svg{width:39px!important;height:39px!important;}
}

.dak-ai-chat.dak-v4{
  --chat-bg:#f7f9fc;
  --chat-panel:#ffffff;
  --chat-panel-2:#f1f5f8;
  --chat-text:#142136;
  --chat-muted:#66768b;
  --chat-border:rgba(20,33,54,.10);
  --chat-shadow:0 28px 90px rgba(5,17,31,.24),0 0 0 1px rgba(20,33,54,.05);
  position:fixed!important;
  right:28px!important;
  bottom:28px!important;
  width:min(430px,calc(100vw - 32px))!important;
  height:min(690px,calc(100dvh - 56px))!important;
  max-height:none!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border:1px solid var(--chat-border)!important;
  border-radius:28px!important;
  background:var(--chat-bg)!important;
  box-shadow:var(--chat-shadow)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(18px) scale(.985)!important;
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease!important;
  isolation:isolate!important;
  z-index:10020!important;
}
.dak-ai-chat.dak-v4::before,.dak-ai-chat.dak-v4::after{display:none!important;content:none!important;}
.dak-ai-chat.dak-v4.open{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
}

.dak-v4-header{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:76px;
  padding:14px 16px;
  color:#fff;
  background:linear-gradient(135deg,#102239 0%,#15364c 100%);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.dak-v4-header::after{
  content:"";
  position:absolute;
  right:-50px;
  top:-75px;
  width:180px;
  height:180px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(0,188,212,.23),transparent 68%);
  pointer-events:none;
}
.dak-v4-avatar{
  width:45px;
  height:45px;
  flex:0 0 45px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#fff;
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 8px 20px rgba(0,0,0,.16);
  overflow:hidden;
}
.dak-v4-avatar img{width:38px;height:38px;object-fit:contain;}
.dak-v4-heading{min-width:0;flex:1;position:relative;z-index:1;}
.dak-v4-title{font:800 15px/1.2 "DM Sans",sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dak-v4-status{display:flex;align-items:center;gap:7px;margin-top:5px;font:500 11px/1.2 "DM Sans",sans-serif;color:rgba(255,255,255,.72);}
.dak-v4-status-dot{width:7px;height:7px;border-radius:999px;background:#22cf84;box-shadow:0 0 0 4px rgba(34,207,132,.12);}
.dak-v4-tools{display:flex;align-items:center;gap:6px;position:relative;z-index:2;}
.dak-v4-icon-btn{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:11px;
  color:rgba(255,255,255,.82);
  background:rgba(255,255,255,.08);
  cursor:pointer;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.dak-v4-icon-btn:hover,.dak-v4-icon-btn:focus-visible{background:rgba(255,255,255,.16);color:#fff;transform:translateY(-1px);outline:none;}
.dak-v4-icon-btn svg{width:17px;height:17px;display:block;}

.dak-v4-body{
  position:relative;
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  background:var(--chat-bg);
}
.dak-ai-messages.dak-v4-messages{
  flex:1!important;
  min-height:0!important;
  overflow-y:auto!important;
  display:flex!important;
  flex-direction:column!important;
  gap:15px!important;
  padding:18px 16px 22px!important;
  background:transparent!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(101,119,139,.34) transparent;
}
.dak-v4-messages::-webkit-scrollbar{width:6px;}
.dak-v4-messages::-webkit-scrollbar-thumb{background:rgba(101,119,139,.28);border-radius:999px;}

.dak-v4-welcome{
  display:block;
  padding:4px 0 2px;
  animation:dakV4Fade .28s ease both;
}
.dak-v4-welcome.is-hidden{display:none;}
.dak-v4-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:28px;
  padding:6px 10px;
  border-radius:999px;
  color:#087e8d;
  background:rgba(0,169,189,.09);
  border:1px solid rgba(0,169,189,.14);
  font:800 10.5px/1 "DM Sans",sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.dak-v4-welcome h3{
  margin:16px 0 8px;
  color:var(--chat-text);
  font:800 clamp(25px,6vw,31px)/1.08 "Playfair Display",serif;
  letter-spacing:-.025em;
}
.dak-v4-welcome p{
  margin:0;
  color:var(--chat-muted);
  font:500 13.5px/1.65 "DM Sans",sans-serif;
}
.dak-v4-topic-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin-top:18px;
}
.dak-v4-topic{
  min-height:78px;
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px;
  text-align:left;
  color:var(--chat-text);
  background:var(--chat-panel);
  border:1px solid var(--chat-border);
  border-radius:17px;
  box-shadow:0 7px 20px rgba(10,26,44,.045);
  cursor:pointer;
  font-family:"DM Sans",sans-serif;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease,background .18s ease;
}
html[dir="rtl"] .dak-v4-topic{text-align:right;}
.dak-v4-topic:hover,.dak-v4-topic:focus-visible{
  transform:translateY(-2px);
  border-color:rgba(0,169,189,.34);
  box-shadow:0 12px 26px rgba(10,26,44,.08);
  outline:none;
}
.dak-v4-topic-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  color:#087e8d;
  border-radius:11px;
  background:rgba(0,169,189,.09);
}
.dak-v4-topic-icon svg{width:17px;height:17px;}
.dak-v4-topic-copy strong{display:block;color:inherit;font-size:12.5px;line-height:1.35;font-weight:800;}
.dak-v4-topic-copy span{display:block;margin-top:4px;color:var(--chat-muted);font-size:10.5px;line-height:1.35;}
.dak-v4-local-note{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px;color:var(--chat-muted);font-size:10.5px;line-height:1.4;}
.dak-v4-local-note svg{width:13px;height:13px;color:#1ca96b;}

.dak-v4-message-row{display:flex;align-items:flex-end;gap:9px;animation:dakV4Message .25s cubic-bezier(.2,.8,.2,1) both;}
.dak-v4-message-row.is-user{justify-content:flex-end;}
.dak-v4-message-avatar{
  width:29px;
  height:29px;
  flex:0 0 29px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--chat-border);
  overflow:hidden;
  box-shadow:0 5px 13px rgba(10,26,44,.07);
}
.dak-v4-message-avatar img{width:24px;height:24px;object-fit:contain;}
.dak-v4-message-stack{max-width:84%;min-width:0;}
.dak-v4-message-meta{display:flex;align-items:center;gap:6px;margin:0 0 5px;color:var(--chat-muted);font-size:9.5px;font-weight:650;}
.dak-v4-message-row.is-user .dak-v4-message-meta{justify-content:flex-end;}
.dak-msg.dak-v4-message{
  max-width:none!important;
  margin:0!important;
  padding:12px 14px!important;
  border-radius:17px!important;
  font:500 13.5px/1.65 "DM Sans",sans-serif!important;
  white-space:pre-line;
  word-break:break-word;
  box-shadow:none!important;
}
.dak-v4-message.dak-msg-bot{
  color:var(--chat-text)!important;
  background:var(--chat-panel)!important;
  border:1px solid var(--chat-border)!important;
  border-bottom-left-radius:6px!important;
}
html[dir="rtl"] .dak-v4-message.dak-msg-bot{border-bottom-left-radius:17px!important;border-bottom-right-radius:6px!important;}
.dak-v4-message.dak-msg-user{
  color:#fff!important;
  background:linear-gradient(135deg,#087e8d,#126d83)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-bottom-right-radius:6px!important;
}
html[dir="rtl"] .dak-v4-message.dak-msg-user{border-bottom-right-radius:17px!important;border-bottom-left-radius:6px!important;}
.dak-v4-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px;}
.dak-v4-action{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:31px;
  padding:6px 10px;
  border-radius:10px;
  color:#087e8d;
  background:rgba(0,169,189,.075);
  border:1px solid rgba(0,169,189,.16);
  text-decoration:none;
  font-size:10.5px;
  line-height:1.25;
  font-weight:800;
}
.dak-v4-action:hover,.dak-v4-action:focus-visible{background:rgba(0,169,189,.13);border-color:rgba(0,169,189,.28);outline:none;}
.dak-v4-action svg{width:13px;height:13px;flex:0 0 auto;}

.dak-typing.dak-v4-typing{padding:10px 12px!important;min-width:58px;display:flex;gap:5px;align-items:center;}
.dak-v4-typing .dak-dot{width:6px;height:6px;border-radius:999px;background:#6c7d91;animation:dakV4Dot 1.05s infinite ease-in-out;}
.dak-v4-typing .dak-dot:nth-child(2){animation-delay:.13s;}
.dak-v4-typing .dak-dot:nth-child(3){animation-delay:.26s;}

.dak-ai-suggestions.dak-v4-suggestions{
  flex:0 0 auto!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:7px!important;
  overflow-x:auto!important;
  padding:10px 16px 2px!important;
  background:var(--chat-bg)!important;
  border:0!important;
  scrollbar-width:none;
}
.dak-v4-suggestions::-webkit-scrollbar{display:none;}
.dak-v4-suggestions:empty{display:none!important;}
.dak-v4-suggestions button{
  flex:0 0 auto;
  min-height:34px;
  padding:7px 11px!important;
  border-radius:999px!important;
  color:var(--chat-text)!important;
  background:var(--chat-panel)!important;
  border:1px solid var(--chat-border)!important;
  font:750 10.5px/1.2 "DM Sans",sans-serif!important;
  white-space:nowrap!important;
  cursor:pointer;
}
.dak-v4-suggestions button:hover,.dak-v4-suggestions button:focus-visible{color:#087e8d!important;border-color:rgba(0,169,189,.30)!important;background:rgba(0,169,189,.07)!important;outline:none;}

.dak-v4-composer-wrap{
  flex:0 0 auto;
  padding:10px 12px 12px;
  background:var(--chat-panel);
  border-top:1px solid var(--chat-border);
}
.dak-ai-input-row.dak-v4-composer{
  display:flex!important;
  align-items:flex-end!important;
  gap:8px!important;
  padding:6px 6px 6px 13px!important;
  border:1.5px solid rgba(20,33,54,.13)!important;
  border-radius:18px!important;
  background:var(--chat-soft)!important;
  box-shadow:none!important;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
html[dir="rtl"] .dak-v4-composer{padding:6px 13px 6px 6px!important;}
.dak-v4-composer:focus-within{border-color:rgba(0,169,189,.52)!important;box-shadow:0 0 0 4px rgba(0,169,189,.08)!important;background:var(--chat-panel)!important;}
.dak-v4-composer textarea{
  flex:1;
  width:100%;
  min-height:38px;
  max-height:112px;
  resize:none;
  overflow-y:auto;
  border:0!important;
  outline:0!important;
  padding:9px 0 7px!important;
  color:var(--chat-text)!important;
  background:transparent!important;
  font:500 13px/1.5 "DM Sans",sans-serif!important;
}
.dak-v4-composer textarea::placeholder{color:#8492a5;}
.dak-send-btn.dak-v4-send{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:0!important;
  border-radius:14px!important;
  color:#fff!important;
  background:linear-gradient(135deg,#00a9bd,#087e8d)!important;
  box-shadow:0 8px 18px rgba(0,145,164,.22)!important;
  cursor:pointer;
}
.dak-v4-send:hover,.dak-v4-send:focus-visible{transform:translateY(-1px);box-shadow:0 11px 24px rgba(0,145,164,.29)!important;outline:none;}
.dak-v4-send:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none!important;}
.dak-v4-send svg{width:18px;height:18px;display:block;}
.dak-v4-composer-note{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 4px 0;color:var(--chat-muted);font-size:9.5px;line-height:1.35;}
.dak-v4-composer-note button{border:0;background:none;color:inherit;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:2px;font:inherit;}

.dak-v4-info{
  position:absolute;
  inset:76px 0 auto 0;
  z-index:10;
  display:none;
  padding:13px 16px;
  color:var(--chat-text);
  background:var(--chat-panel);
  border-bottom:1px solid var(--chat-border);
  box-shadow:0 14px 30px rgba(10,26,44,.09);
  font-size:11px;
  line-height:1.55;
}
.dak-v4-info.is-open{display:block;animation:dakV4Fade .18s ease both;}
.dak-v4-info strong{display:block;margin-bottom:3px;font-size:11.5px;}

html[data-theme="dark"] .dak-ai-chat.dak-v4{
  --chat-bg:#0b1627;
  --chat-panel:#111f32;
  --chat-panel-2:#15253a;
  --chat-text:#f1f5fa;
  --chat-muted:#9eacc0;
  --chat-border:rgba(163,187,213,.15);
  --chat-soft:#0e1b2d;
  --chat-shadow:0 30px 100px rgba(0,0,0,.55),0 0 0 1px rgba(144,177,208,.08);
  background:var(--chat-bg)!important;
  border-color:var(--chat-border)!important;
}
html[data-theme="dark"] .dak-v4-header{background:linear-gradient(135deg,#0d1b2d,#12334a);}
html[data-theme="dark"] .dak-v4-avatar,html[data-theme="dark"] .dak-v4-message-avatar{background:#f8fafc;border-color:rgba(255,255,255,.10);}
html[data-theme="dark"] .dak-v4-eyebrow{color:#65dce8;background:rgba(0,188,212,.11);border-color:rgba(101,220,232,.17);}
html[data-theme="dark"] .dak-v4-topic{box-shadow:none;background:#111f32;border-color:rgba(163,187,213,.14);}
html[data-theme="dark"] .dak-v4-topic:hover{background:#14263a;border-color:rgba(101,220,232,.29);}
html[data-theme="dark"] .dak-v4-topic-icon{color:#65dce8;background:rgba(0,188,212,.11);}
html[data-theme="dark"] .dak-v4-message.dak-msg-bot{background:#111f32!important;border-color:rgba(163,187,213,.14)!important;color:#eef3f9!important;}
html[data-theme="dark"] .dak-v4-action{color:#68dce8;background:rgba(0,188,212,.10);border-color:rgba(104,220,232,.18);}
html[data-theme="dark"] .dak-v4-action:hover{background:rgba(0,188,212,.16);}
html[data-theme="dark"] .dak-v4-suggestions button{background:#111f32!important;border-color:rgba(163,187,213,.14)!important;color:#eef3f9!important;}
html[data-theme="dark"] .dak-v4-suggestions button:hover{color:#6be0eb!important;background:rgba(0,188,212,.10)!important;border-color:rgba(107,224,235,.28)!important;}
html[data-theme="dark"] .dak-v4-composer-wrap{background:#0e1a2b;border-color:rgba(163,187,213,.13);}
html[data-theme="dark"] .dak-v4-composer{border-color:rgba(163,187,213,.16)!important;background:#0b1728!important;}
html[data-theme="dark"] .dak-v4-composer:focus-within{background:#0d1b2d!important;border-color:rgba(101,220,232,.48)!important;}
html[data-theme="dark"] .dak-v4-info{background:#111f32;border-color:rgba(163,187,213,.14);box-shadow:0 16px 32px rgba(0,0,0,.35);}

html[dir="rtl"] .dak-v4-message-row{direction:rtl;}
html[dir="rtl"] .dak-v4-message-row.is-user{direction:ltr;}
html[dir="rtl"] .dak-v4-message-stack{text-align:right;}
html[dir="rtl"] .dak-v4-message-row.is-user .dak-v4-message-stack{text-align:right;}
html[dir="rtl"] .dak-v4-title,html[dir="rtl"] .dak-v4-status,html[dir="rtl"] .dak-v4-welcome,html[dir="rtl"] .dak-v4-info{text-align:right;}

@keyframes dakV4Fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes dakV4Message{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes dakV4Dot{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-3px);opacity:1}}

@media(max-width:640px){
  .dak-ai-chat.dak-v4{
    right:8px!important;
    bottom:8px!important;
    width:calc(100vw - 16px)!important;
    height:min(82dvh,720px)!important;
    border-radius:24px!important;
  }
  .dak-v4-header{min-height:70px;padding:12px 13px;}
  .dak-v4-avatar{width:42px;height:42px;flex-basis:42px;border-radius:14px;}
  .dak-v4-avatar img{width:35px;height:35px;}
  .dak-v4-tools{gap:4px;}
  .dak-v4-icon-btn{width:32px;height:32px;}
  .dak-ai-messages.dak-v4-messages{padding:15px 13px 18px!important;}
  .dak-v4-welcome h3{font-size:27px;}
  .dak-v4-topic-grid{gap:8px;}
  .dak-v4-topic{min-height:72px;padding:10px;}
  .dak-v4-message-stack{max-width:87%;}
  .dak-v4-composer-wrap{padding:9px 9px 10px;}
}
@media(max-width:390px){
  .dak-v4-topic-grid{grid-template-columns:1fr;}
  .dak-v4-topic{min-height:62px;}
  .dak-v4-welcome h3{font-size:24px;}
  .dak-v4-title{font-size:14px;}
  .dak-v4-status{font-size:10.5px;}
}
@media(prefers-reduced-motion:reduce){
  .dak-ai-chat.dak-v4,.dak-v4-message-row,.dak-v4-welcome,.dak-v4-info,.dak-v4-typing .dak-dot{animation:none!important;transition:none!important;}
}

/* ==========================================================
   DAK SMART ASSISTANT — WORLD-CLASS MOBILE v8
   Institutional mobile UI. Desktop styles above are unchanged.
   ========================================================== */
@media (max-width:640px){
  body.dak-chat-open{
    overflow:hidden!important;
    overscroll-behavior:none;
  }
  body.dak-chat-open::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:10010;
    background:rgba(8,20,36,.34);
    -webkit-backdrop-filter:blur(2px);
    backdrop-filter:blur(2px);
    animation:dakV4Backdrop .18s ease both;
  }

  /* Launcher: restrained school-brand treatment */
  .dak-ai-bubble{
    width:56px!important;
    height:56px!important;
    right:16px!important;
    bottom:calc(18px + env(safe-area-inset-bottom,0px))!important;
    border:1px solid rgba(255,255,255,.24)!important;
    border-radius:17px!important;
    background:#102b46!important;
    box-shadow:0 12px 28px rgba(8,28,48,.24),0 2px 8px rgba(8,28,48,.10)!important;
    animation:none!important;
  }
  .dak-ai-bubble::before{
    inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(145deg,rgba(255,255,255,.08),transparent 55%)!important;
  }
  .dak-ai-bubble::after{
    top:7px!important;
    right:7px!important;
    width:8px!important;
    height:8px!important;
    background:#23c483!important;
    border:2px solid #102b46!important;
    box-shadow:none!important;
  }
  .dak-ai-bubble .dak-bot-mark,
  .dak-ai-bubble svg{
    width:35px!important;
    height:35px!important;
    filter:none!important;
  }
  .dak-ai-bubble:hover{transform:none!important;box-shadow:0 12px 28px rgba(8,28,48,.24),0 2px 8px rgba(8,28,48,.10)!important;}

  /* Main card */
  .dak-ai-chat.dak-v4{
    --chat-bg:#f6f8fb;
    --chat-panel:#ffffff;
    --chat-panel-2:#f2f5f8;
    --chat-text:#10243a;
    --chat-muted:#69798b;
    --chat-border:rgba(16,36,58,.10);
    left:12px!important;
    right:12px!important;
    bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;
    width:auto!important;
    height:min(70dvh,610px)!important;
    min-height:470px!important;
    max-height:calc(100dvh - 42px - env(safe-area-inset-bottom,0px))!important;
    border:1px solid rgba(16,36,58,.10)!important;
    border-radius:22px!important;
    background:var(--chat-bg)!important;
    box-shadow:0 28px 78px rgba(5,20,36,.28),0 8px 24px rgba(5,20,36,.12)!important;
    transform:translateY(16px) scale(.988)!important;
    transition:opacity .2s ease,transform .22s cubic-bezier(.2,.8,.2,1),visibility .2s ease!important;
    z-index:10020!important;
  }
  .dak-ai-chat.dak-v4.open{transform:none!important;}

  /* Formal app bar */
  .dak-v4-header{
    min-height:64px;
    gap:10px;
    padding:10px 11px 10px 12px;
    color:var(--chat-text);
    background:#fff;
    border-bottom:1px solid rgba(16,36,58,.08);
  }
  .dak-v4-header::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:3px;
    background:#0aa6b7;
  }
  .dak-v4-header::after{display:none;}
  .dak-v4-avatar{
    width:40px;
    height:40px;
    flex:0 0 40px;
    border-radius:12px;
    background:#f5f8fa;
    border:1px solid rgba(16,36,58,.09);
    box-shadow:none;
  }
  .dak-v4-avatar img{width:34px;height:34px;}
  .dak-v4-title{
    color:#10243a;
    font:800 14px/1.25 "DM Sans",sans-serif;
    letter-spacing:-.01em;
  }
  .dak-v4-status{
    margin-top:3px;
    gap:6px;
    color:#6f7f91;
    font:600 10px/1.2 "DM Sans",sans-serif;
  }
  .dak-v4-status-dot{
    width:6px;
    height:6px;
    background:#23b97b;
    box-shadow:none;
  }
  .dak-v4-tools{gap:2px;}
  .dak-v4-icon-btn{
    width:34px;
    height:34px;
    border-radius:10px;
    color:#64758a;
    background:transparent;
  }
  .dak-v4-icon-btn:hover,.dak-v4-icon-btn:focus-visible{
    color:#10243a;
    background:#f1f5f8;
    transform:none;
  }
  .dak-v4-icon-btn svg{width:16px;height:16px;}

  /* Conversation surface */
  .dak-v4-body{background:#f6f8fb;}
  .dak-ai-messages.dak-v4-messages{
    gap:13px!important;
    padding:15px 14px 16px!important;
    background:#f6f8fb!important;
    -webkit-overflow-scrolling:touch;
    scroll-padding-bottom:16px;
  }

  /* Welcome: compact, confident, institutional */
  .dak-v4-welcome{padding:1px 0 3px;}
  .dak-v4-eyebrow{
    min-height:auto;
    padding:0;
    gap:6px;
    border:0;
    border-radius:0;
    color:#0b7d8a;
    background:transparent;
    font:800 9.5px/1.2 "DM Sans",sans-serif;
    letter-spacing:.08em;
  }
  .dak-v4-eyebrow .dak-v4-status-dot{display:none;}
  .dak-v4-welcome h3{
    margin:8px 0 5px;
    color:#10243a;
    font:800 20px/1.18 "DM Sans",sans-serif;
    letter-spacing:-.025em;
  }
  .dak-v4-welcome p{
    margin:0;
    color:#657589;
    font:500 12px/1.52 "DM Sans",sans-serif;
  }
  .dak-v4-topic-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
    margin-top:13px;
  }
  .dak-v4-topic{
    min-height:51px;
    align-items:center;
    gap:10px;
    padding:8px 10px;
    border:1px solid rgba(16,36,58,.09);
    border-radius:13px;
    background:#fff;
    box-shadow:0 2px 8px rgba(9,31,52,.025);
  }
  .dak-v4-topic::after{
    content:"›";
    margin-inline-start:auto;
    color:#95a1af;
    font:500 20px/1 Arial,sans-serif;
  }
  html[dir="rtl"] .dak-v4-topic::after{content:"‹";}
  .dak-v4-topic:hover,.dak-v4-topic:focus-visible{
    transform:none;
    border-color:rgba(10,166,183,.28);
    background:#fbfefe;
    box-shadow:0 3px 10px rgba(9,31,52,.04);
  }
  .dak-v4-topic-icon{
    width:32px;
    height:32px;
    flex:0 0 32px;
    border-radius:9px;
    color:#087d8b;
    background:#edf8f9;
  }
  .dak-v4-topic-icon svg{width:15px;height:15px;}
  .dak-v4-topic-copy{min-width:0;}
  .dak-v4-topic-copy strong{
    font-size:11.5px;
    line-height:1.3;
    font-weight:800;
  }
  .dak-v4-topic-copy span{
    margin-top:2px;
    font-size:9.5px;
    line-height:1.25;
  }

  /* Messages */
  .dak-v4-message-row{gap:7px;align-items:flex-end;}
  .dak-v4-message-avatar{
    width:26px;
    height:26px;
    flex:0 0 26px;
    border-radius:8px;
    box-shadow:none;
  }
  .dak-v4-message-avatar img{width:22px;height:22px;}
  .dak-v4-message-stack{max-width:88%;}
  .dak-v4-message-meta{
    margin:0 0 4px;
    color:#8592a1;
    font-size:8.5px;
    font-weight:650;
  }
  .dak-msg.dak-v4-message{
    padding:10px 12px!important;
    border-radius:14px!important;
    font:500 13px/1.55 "DM Sans",sans-serif!important;
  }
  .dak-v4-message.dak-msg-bot{
    color:#1b2c40!important;
    background:#fff!important;
    border:1px solid rgba(16,36,58,.085)!important;
    border-bottom-left-radius:5px!important;
  }
  html[dir="rtl"] .dak-v4-message.dak-msg-bot{
    border-bottom-left-radius:14px!important;
    border-bottom-right-radius:5px!important;
  }
  .dak-v4-message.dak-msg-user{
    color:#fff!important;
    background:#123f5f!important;
    border:1px solid #123f5f!important;
    border-bottom-right-radius:5px!important;
  }
  html[dir="rtl"] .dak-v4-message.dak-msg-user{
    border-bottom-right-radius:14px!important;
    border-bottom-left-radius:5px!important;
  }
  .dak-v4-actions{gap:6px;margin-top:7px;}
  .dak-v4-action{
    min-height:30px;
    padding:6px 9px;
    border-radius:9px;
    color:#087d8b;
    background:#f0f8f9;
    border-color:rgba(8,125,139,.13);
    font-size:10px;
  }

  /* Suggested follow-ups */
  .dak-ai-suggestions.dak-v4-suggestions{
    gap:6px!important;
    padding:7px 12px 2px!important;
    background:#f6f8fb!important;
  }
  .dak-v4-suggestions button{
    min-height:31px;
    padding:6px 10px!important;
    border-radius:10px!important;
    color:#334b61!important;
    background:#fff!important;
    border-color:rgba(16,36,58,.09)!important;
    font-size:9.75px!important;
    font-weight:700!important;
  }

  /* Composer: white, precise, app-quality */
  .dak-v4-composer-wrap{
    padding:8px 9px calc(9px + env(safe-area-inset-bottom,0px));
    background:#fff;
    border-top:1px solid rgba(16,36,58,.08);
    box-shadow:none;
  }
  .dak-ai-input-row.dak-v4-composer{
    gap:7px!important;
    padding:4px 4px 4px 11px!important;
    border:1px solid rgba(16,36,58,.14)!important;
    border-radius:14px!important;
    background:#f7f9fb!important;
    box-shadow:none!important;
  }
  html[dir="rtl"] .dak-v4-composer{padding:4px 11px 4px 4px!important;}
  .dak-v4-composer:focus-within{
    border-color:rgba(10,166,183,.48)!important;
    box-shadow:0 0 0 3px rgba(10,166,183,.08)!important;
    background:#fff!important;
  }
  .dak-v4-composer textarea{
    min-height:38px;
    max-height:88px;
    padding:8px 0 7px!important;
    font-size:16px!important;
    line-height:1.4!important;
  }
  .dak-send-btn.dak-v4-send{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
    border-radius:11px!important;
    background:#0a91a2!important;
    box-shadow:none!important;
  }
  .dak-v4-send:hover,.dak-v4-send:focus-visible{
    transform:none;
    background:#087f8e!important;
    box-shadow:none!important;
  }
  .dak-v4-send svg{width:17px;height:17px;}
  .dak-v4-composer-note{padding-top:3px;font-size:8.5px;}

  .dak-v4-info{
    inset:64px 0 auto 0;
    padding:11px 13px;
    background:#fff;
    font-size:10px;
    box-shadow:0 10px 24px rgba(9,31,52,.08);
  }

  /* Dark mobile: same restrained hierarchy */
  html[data-theme="dark"] .dak-ai-chat.dak-v4{
    --chat-bg:#0d1724;
    --chat-panel:#132131;
    --chat-text:#eef4f8;
    --chat-muted:#9eacbb;
    --chat-border:rgba(168,190,210,.14);
    background:#0d1724!important;
  }
  html[data-theme="dark"] .dak-v4-header{
    color:#eef4f8;
    background:#111e2d;
    border-bottom-color:rgba(168,190,210,.10);
  }
  html[data-theme="dark"] .dak-v4-title{color:#eef4f8;}
  html[data-theme="dark"] .dak-v4-status{color:#9eacbb;}
  html[data-theme="dark"] .dak-v4-icon-btn{color:#aab8c6;}
  html[data-theme="dark"] .dak-v4-icon-btn:hover{color:#fff;background:#1a2b3d;}
  html[data-theme="dark"] .dak-v4-body,
  html[data-theme="dark"] .dak-ai-messages.dak-v4-messages,
  html[data-theme="dark"] .dak-ai-suggestions.dak-v4-suggestions{background:#0d1724!important;}
  html[data-theme="dark"] .dak-v4-welcome h3{color:#eef4f8;}
  html[data-theme="dark"] .dak-v4-welcome p{color:#9eacbb;}
  html[data-theme="dark"] .dak-v4-topic{background:#132131;border-color:rgba(168,190,210,.12);box-shadow:none;}
  html[data-theme="dark"] .dak-v4-topic:hover{background:#17283a;border-color:rgba(67,195,208,.24);}
  html[data-theme="dark"] .dak-v4-topic-icon{background:rgba(33,176,191,.10);color:#57cbd6;}
  html[data-theme="dark"] .dak-v4-message.dak-msg-bot{background:#132131!important;color:#eef4f8!important;border-color:rgba(168,190,210,.12)!important;}
  html[data-theme="dark"] .dak-v4-message.dak-msg-user{background:#16677b!important;border-color:#16677b!important;}
  html[data-theme="dark"] .dak-v4-suggestions button{background:#132131!important;color:#dce5ec!important;border-color:rgba(168,190,210,.12)!important;}
  html[data-theme="dark"] .dak-v4-composer-wrap{background:#111e2d;border-top-color:rgba(168,190,210,.10);}
  html[data-theme="dark"] .dak-v4-composer{background:#0e1926!important;border-color:rgba(168,190,210,.15)!important;}
  html[data-theme="dark"] .dak-v4-composer:focus-within{background:#111e2d!important;}
  html[data-theme="dark"] .dak-v4-info{background:#132131;border-color:rgba(168,190,210,.12);}
}

@media (max-width:370px){
  .dak-ai-chat.dak-v4{
    left:8px!important;
    right:8px!important;
    bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;
    height:min(72dvh,590px)!important;
    min-height:445px!important;
    max-height:calc(100dvh - 24px - env(safe-area-inset-bottom,0px))!important;
    border-radius:19px!important;
  }
  .dak-v4-header{min-height:60px;padding:8px 8px 8px 10px;}
  .dak-v4-avatar{width:36px;height:36px;flex-basis:36px;}
  .dak-v4-avatar img{width:31px;height:31px;}
  .dak-v4-icon-btn{width:31px;height:31px;}
  .dak-v4-title{font-size:13px;}
  .dak-v4-status{font-size:9px;}
  .dak-v4-welcome h3{font-size:18.5px;}
  .dak-v4-topic{min-height:48px;padding:7px 9px;}
  .dak-v4-info{inset:60px 0 auto 0;}
}

@media (max-height:620px) and (max-width:640px){
  .dak-ai-chat.dak-v4{
    height:calc(100dvh - 18px - env(safe-area-inset-bottom,0px))!important;
    min-height:0!important;
    max-height:calc(100dvh - 18px - env(safe-area-inset-bottom,0px))!important;
    bottom:calc(9px + env(safe-area-inset-bottom,0px))!important;
  }
  .dak-v4-header{min-height:58px;padding-top:7px;padding-bottom:7px;}
  .dak-v4-info{inset:58px 0 auto 0;}
}

@keyframes dakV4Backdrop{from{opacity:0}to{opacity:1}}


/* DAK CSS: mobile-v18.css */
/* ======================================================================
   DORAT AL KHALEEJ — MOBILE UI REBUILD 2026
   Phone interface rebuilt from zero. Desktop styles are intentionally left
   untouched. Targets modern iPhone and Android widths up to 767px.
   ====================================================================== */

@media (max-width: 767px) {
  :root {
    --m-bg: #f4f7f9;
    --m-surface: #ffffff;
    --m-surface-2: #eef3f6;
    --m-text: #172637;
    --m-muted: #647486;
    --m-line: #dbe4e9;
    --m-line-strong: #cbd7de;
    --m-navy: #10263d;
    --m-teal: #0799a8;
    --m-purple: #6b4ba0;
    --m-gold: #d69a32;
    --m-danger: #9d3f43;
    --m-radius: 16px;
    --m-radius-lg: 22px;
    --m-shadow: 0 8px 24px rgba(15,38,61,.07);
    --m-gutter: 18px;
    --m-nav-h: 64px;
  }

  html[data-theme="dark"] {
    --m-bg: #09131f;
    --m-surface: #111f2e;
    --m-surface-2: #172838;
    --m-text: #edf4f8;
    --m-muted: #a8b7c5;
    --m-line: #2a3d4e;
    --m-line-strong: #385064;
    --m-navy: #edf4f8;
    --m-shadow: 0 8px 26px rgba(0,0,0,.22);
  }

  * { box-sizing: border-box !important; }
  html {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: calc(var(--m-nav-h) + 12px) !important;
  }
  body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    background: var(--m-bg) !important;
    color: var(--m-text) !important;
    font-family: 'DM Sans','Noto Sans Arabic',Arial,sans-serif !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  html[dir="rtl"] body,
  html[lang="ar"] body { font-family: 'Noto Sans Arabic','DM Sans',Arial,sans-serif !important; }

  img, svg, video, canvas, iframe { max-width: 100% !important; }
  button, a, input, select, textarea { touch-action: manipulation; }
  button, input, select, textarea { font: inherit; }
  input, select, textarea { font-size: 16px !important; }
  a, button { -webkit-tap-highlight-color: transparent; }
  :focus-visible { outline: 3px solid rgba(7,153,168,.28) !important; outline-offset: 2px !important; }

  .container,
  .page-hero-inner,
  .branch-hero-inner,
  .pa-shell,
  .fv-hero-content,
  .fv-wrap,
  .privacy-wrap {
    width: 100% !important;
    max-width: none !important;
    margin-inline: auto !important;
    padding-inline: var(--m-gutter) !important;
  }

  /* ---------- Header ---------- */
  #navbar,
  nav#navbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 9000 !important;
    height: var(--m-nav-h) !important;
    min-height: var(--m-nav-h) !important;
    padding: 0 max(var(--m-gutter), env(safe-area-inset-left)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: color-mix(in srgb, var(--m-surface) 94%, transparent) !important;
    border-bottom: 1px solid var(--m-line) !important;
    box-shadow: none !important;
    backdrop-filter: blur(14px) saturate(130%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
  }
  #navbar.scrolled { box-shadow: 0 4px 18px rgba(15,38,61,.07) !important; }
  .logo {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    text-decoration: none !important;
  }
  .logo img,
  #navbar .logo img {
    width: auto !important;
    height: 43px !important;
    max-width: 174px !important;
    object-fit: contain !important;
  }
  .nav-links { display: none !important; }
  .hamburger {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    padding: 0 !important;
    border: 1px solid var(--m-line) !important;
    border-radius: 13px !important;
    background: var(--m-surface-2) !important;
    box-shadow: none !important;
  }
  .hamburger span {
    width: 19px !important;
    height: 2px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: var(--m-text) !important;
  }
  .mobile-menu {
    position: fixed !important;
    top: var(--m-nav-h) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    z-index: 8999 !important;
    display: none !important;
    max-height: calc(100dvh - var(--m-nav-h)) !important;
    overflow-y: auto !important;
    padding: 10px var(--m-gutter) max(20px, env(safe-area-inset-bottom)) !important;
    flex-direction: column !important;
    gap: 4px !important;
    background: var(--m-surface) !important;
    border-bottom: 1px solid var(--m-line) !important;
    box-shadow: 0 16px 36px rgba(15,38,61,.12) !important;
  }
  .mobile-menu.open { display: flex !important; }
  .mobile-menu a,
  .mobile-menu .lang-toggle {
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 11px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: transparent !important;
    color: var(--m-text) !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
    box-shadow: none !important;
  }
  .mobile-menu .nav-portal-btn {
    margin-top: 4px !important;
    background: rgba(7,153,168,.08) !important;
    color: var(--m-teal) !important;
  }
  .mobile-menu .lang-toggle {
    margin-top: 6px !important;
    justify-content: center !important;
    border: 1px solid var(--m-line) !important;
    background: var(--m-surface-2) !important;
  }
  html[dir="rtl"] .mobile-menu a,
  html[dir="rtl"] .mobile-menu .lang-toggle { justify-content: flex-start !important; text-align: right !important; }

  /* ---------- Base typography / spacing ---------- */
  .section {
    padding: 38px 0 !important;
    background: var(--m-bg) !important;
  }
  .section-gray { background: var(--m-surface-2) !important; }
  .section-label {
    margin: 0 0 7px !important;
    color: var(--m-teal) !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
    letter-spacing: .11em !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    text-align: center !important;
  }
  .section-title,
  .home-adm-title,
  .path-tools-intro h2 {
    margin: 0 auto 9px !important;
    color: var(--m-text) !important;
    font-family: 'Playfair Display','Noto Sans Arabic',serif !important;
    font-size: clamp(24px, 7.1vw, 29px) !important;
    line-height: 1.16 !important;
    letter-spacing: -.025em !important;
    text-align: center !important;
  }
  html[dir="rtl"] .section-title,
  html[lang="ar"] .section-title { line-height: 1.36 !important; letter-spacing: 0 !important; }
  .section-sub,
  .home-adm-sub {
    max-width: 34rem !important;
    margin: 0 auto 24px !important;
    color: var(--m-muted) !important;
    font-size: 13.5px !important;
    line-height: 1.65 !important;
    text-align: center !important;
  }
  .btn,
  a.btn,
  button.btn {
    min-height: 44px !important;
    padding: 11px 15px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
  }

  /* ---------- Homepage hero: one coherent mobile card ---------- */
  .hero {
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 14px var(--m-gutter) 24px !important;
    background: var(--m-bg) !important;
    overflow: visible !important;
  }
  .hero-right {
    order: 0 !important;
    position: relative !important;
    width: 100% !important;
    height: 210px !important;
    min-height: 210px !important;
    overflow: hidden !important;
    border-radius: var(--m-radius-lg) var(--m-radius-lg) 0 0 !important;
    box-shadow: none !important;
  }
  .carousel, .slide, .photo-slide { border-radius: 0 !important; }
  .hero-left {
    order: 1 !important;
    min-height: 0 !important;
    padding: 23px 20px 18px !important;
    display: block !important;
    background: linear-gradient(155deg,#0b2035 0%,#132e49 100%) !important;
    border-radius: 0 0 var(--m-radius-lg) var(--m-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: var(--m-shadow) !important;
  }
  .hero-left::before,
  .hero-left::after { opacity: .55 !important; }
  .hero-badge {
    max-width: 100% !important;
    margin: 0 0 11px !important;
    padding: 5px 10px !important;
    border-radius: 999px !important;
    font-size: 9px !important;
    line-height: 1.35 !important;
    letter-spacing: .07em !important;
    white-space: normal !important;
  }
  .hero-title {
    max-width: 100% !important;
    margin: 0 0 10px !important;
    color: #fff !important;
    font-size: clamp(30px, 8.6vw, 37px) !important;
    line-height: 1.06 !important;
    letter-spacing: -.035em !important;
  }
  html[dir="rtl"] .hero-title { font-size: clamp(28px, 8.1vw, 34px) !important; line-height: 1.32 !important; letter-spacing: 0 !important; }
  .hero-desc {
    max-width: none !important;
    margin: 0 0 15px !important;
    color: rgba(255,255,255,.72) !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
  }
  .hero-actions {
    margin: 0 !important;
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }
  .hero-actions .btn,
  .hero-actions a {
    flex: 1 1 150px !important;
    min-width: 0 !important;
    min-height: 42px !important;
    padding: 10px 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;
    font-size: 12px !important;
  }
  .hero-stats {
    margin: 17px 0 0 !important;
    padding: 13px 0 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 0 !important;
    border-top: 1px solid rgba(255,255,255,.10) !important;
  }
  .hero-stat,
  .hero-stats > div {
    min-width: 0 !important;
    padding: 0 6px !important;
    text-align: center !important;
    background: transparent !important;
    border: 0 !important;
  }
  .hero-stat + .hero-stat { border-inline-start: 1px solid rgba(255,255,255,.09) !important; }
  .stat-num {
    color: #fff !important;
    font-size: 18px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
  .stat-label {
    margin-top: 4px !important;
    color: rgba(255,255,255,.48) !important;
    font-size: 7.5px !important;
    line-height: 1.2 !important;
    letter-spacing: .04em !important;
    white-space: normal !important;
  }
  .hero-portal-badges,
  .hero-pill,
  .hero-right .office-status-card,
  .carousel-nav { display: none !important; }
  .carousel-dots { bottom: 11px !important; gap: 6px !important; }
  .carousel-dots .dot { width: 6px !important; height: 6px !important; }

  /* ---------- Homepage campuses ---------- */
  .branches-section { background: var(--m-bg) !important; }
  .branches-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .branch-card {
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: var(--m-radius) !important;
    box-shadow: none !important;
    border: 1px solid rgba(255,255,255,.16) !important;
  }
  .branch-eyebrow { margin-bottom: 5px !important; font-size: 9px !important; line-height: 1.3 !important; }
  .branch-name { margin-bottom: 6px !important; font-size: 21px !important; line-height: 1.18 !important; }
  .branch-quote { margin: 0 0 10px !important; font-size: 12px !important; line-height: 1.55 !important; }
  .branch-tags { gap: 5px !important; margin: 0 0 12px !important; flex-wrap: wrap !important; }
  .branch-tags .tag { padding: 4px 7px !important; font-size: 8.5px !important; line-height: 1.2 !important; border-radius: 999px !important; }
  .branch-footer { margin-top: 0 !important; padding-top: 10px !important; }
  .branch-link { font-size: 12px !important; }

  /* ---------- Homepage programmes ---------- */
  .programmes-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 10px !important;
  }
  .prog-card {
    min-height: 0 !important;
    padding: 15px 13px !important;
    border-radius: var(--m-radius) !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
    color: var(--m-text) !important;
  }
  .prog-card.c3 { grid-column: 1 / -1 !important; }
  .prog-icon { margin-bottom: 8px !important; font-size: 24px !important; line-height: 1 !important; }
  .prog-title { margin-bottom: 4px !important; color: var(--m-text) !important; font-size: 14px !important; line-height: 1.25 !important; }
  .prog-age { margin-bottom: 6px !important; font-size: 9.5px !important; line-height: 1.25 !important; }
  .prog-desc { margin: 0 !important; color: var(--m-muted) !important; font-size: 11px !important; line-height: 1.5 !important; }
  .prog-card.c3 .prog-track-options {
    margin: 7px 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 5px !important;
  }
  .prog-card.c3 .prog-track-option {
    min-height: 0 !important;
    padding: 6px 8px !important;
    border-radius: 9px !important;
    font-size: 9.5px !important;
    line-height: 1.3 !important;
  }
  .section-gray .container > div[style*="text-align:center"] { margin-top: 20px !important; }

  /* ---------- Why DAK ---------- */
  .why-section { background: var(--m-bg) !important; }
  .why-head { margin-bottom: 20px !important; }
  .why-cards {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 10px !important;
  }
  .why-card {
    min-height: 0 !important;
    padding: 14px !important;
    border-radius: var(--m-radius) !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
  }
  .why-card-icon { width: 35px !important; height: 35px !important; margin-bottom: 9px !important; font-size: 17px !important; border-radius: 10px !important; }
  .why-card h3 { margin: 0 0 5px !important; color: var(--m-text) !important; font-size: 13px !important; line-height: 1.3 !important; }
  .why-card p { margin: 0 !important; color: var(--m-muted) !important; font-size: 10.5px !important; line-height: 1.45 !important; }

  /* ---------- News ---------- */
  .news-section { background: var(--m-surface-2) !important; }
  .news-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }
  .news-card {
    min-height: 0 !important;
    padding: 14px 15px !important;
    border-radius: 14px !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
  }
  .news-date { margin-bottom: 4px !important; color: var(--m-muted) !important; font-size: 9px !important; }
  .news-title-text { margin: 0 0 5px !important; color: var(--m-text) !important; font-size: 13.5px !important; line-height: 1.38 !important; }
  .news-excerpt { margin: 0 0 7px !important; color: var(--m-muted) !important; font-size: 10.5px !important; line-height: 1.5 !important; }
  .news-tag { display: inline-flex !important; padding: 4px 7px !important; border-radius: 999px !important; font-size: 8px !important; }

  /* ---------- Day at DAK: compact story, no oversized illustration ---------- */
  .day-at-dak { background: var(--m-bg) !important; overflow: hidden !important; }
  .day-at-dak::before, .day-at-dak::after { display: none !important; }
  .day-head { margin: 0 auto 20px !important; }
  .day-showcase { display: block !important; }
  .day-picture { display: none !important; }
  .day-panel {
    width: 100% !important;
    padding: 17px !important;
    border-radius: var(--m-radius-lg) !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
  }
  .day-panel-title { margin: 0 0 6px !important; color: var(--m-text) !important; font-size: 18px !important; line-height: 1.25 !important; }
  .day-panel-text { margin: 0 0 14px !important; color: var(--m-muted) !important; font-size: 11.5px !important; line-height: 1.55 !important; }
  .day-steps-list.compact {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 7px !important;
  }
  .day-step-btn {
    min-height: 64px !important;
    margin: 0 !important;
    padding: 9px !important;
    display: grid !important;
    grid-template-columns: 28px 1fr !important;
    gap: 7px !important;
    align-items: center !important;
    border-radius: 11px !important;
    border: 1px solid var(--m-line) !important;
    background: var(--m-surface-2) !important;
    color: var(--m-text) !important;
    text-align: start !important;
    box-shadow: none !important;
  }
  .day-step-btn i { font-size: 18px !important; }
  .day-step-btn strong { display: block !important; font-size: 10.5px !important; line-height: 1.25 !important; }
  .day-step-btn span span { display: none !important; }
  .day-insight-grid,
  .day-note { display: none !important; }

  /* ---------- Child journey ---------- */
  .journey-section { background: var(--m-surface-2) !important; }
  .journey-premium-card {
    display: block !important;
    padding: 0 !important;
    border-radius: var(--m-radius-lg) !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
  }
  .journey-story-panel { display: none !important; }
  .journey-form-panel {
    width: 100% !important;
    padding: 17px !important;
    border-radius: var(--m-radius-lg) !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
  }
  .journey-form-head { margin-bottom: 12px !important; }
  .journey-form-head h3 { margin: 0 !important; color: var(--m-text) !important; font-size: 18px !important; line-height: 1.25 !important; }
  .journey-inputs,
  .journey-premium-inputs { display: grid !important; grid-template-columns: 1fr !important; gap: 9px !important; }
  .journey-input-group { width: 100% !important; }
  .journey-input-group label { margin-bottom: 5px !important; color: var(--m-muted) !important; font-size: 10px !important; }
  .journey-input-group input,
  .journey-input-group select {
    width: 100% !important;
    min-height: 45px !important;
    padding: 10px 11px !important;
    border: 1px solid var(--m-line) !important;
    border-radius: 11px !important;
    background: var(--m-bg) !important;
    color: var(--m-text) !important;
  }
  .journey-premium-btn { width: 100% !important; margin-top: 2px !important; }

  /* ---------- Path tools / Quick access ---------- */
  .path-tools-section { background: var(--m-bg) !important; }
  .path-tools-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .path-tool-card {
    min-height: 0 !important;
    padding: 15px !important;
    border-radius: var(--m-radius) !important;
    box-shadow: none !important;
  }
  .path-tool-card h3 { margin: 0 0 4px !important; font-size: 15px !important; }
  .path-tool-card p { margin: 0 !important; font-size: 10.5px !important; line-height: 1.45 !important; }
  .quick-access-premium { background: var(--m-surface-2) !important; }
  .quick-access-head { margin-bottom: 18px !important; }
  .quick-directory { padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
  .ql-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
  }
  .ql-card {
    min-height: 84px !important;
    padding: 12px !important;
    border-radius: 13px !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
    color: var(--m-text) !important;
  }
  .ql-card h3,.ql-card strong { font-size: 11px !important; line-height: 1.25 !important; color: var(--m-text) !important; }
  .ql-card p,.ql-card span:not(.ql-icon) { font-size: 9px !important; line-height: 1.35 !important; color: var(--m-muted) !important; }
  .quick-directory-note { display: none !important; }

  /* ---------- Apps ---------- */
  .icampus-section,
  .premium-apps-section { padding: 38px 0 !important; background: var(--m-bg) !important; }
  .premium-apps-grid,
  .apps-grid,
  .icampus-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .premium-app-card,
  .app-card {
    min-height: 0 !important;
    padding: 16px !important;
    border-radius: var(--m-radius) !important;
    box-shadow: none !important;
  }
  .app-card-glow { display: none !important; }
  .app-card h3 { font-size: 16px !important; line-height: 1.25 !important; }
  .app-card p { font-size: 10.5px !important; line-height: 1.5 !important; }

  /* ---------- Newsletter ---------- */
  .newsletter { padding: 0 var(--m-gutter) 38px !important; background: var(--m-bg) !important; }
  .newsletter-card {
    display: block !important;
    padding: 17px !important;
    border-radius: var(--m-radius-lg) !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }
  .newsletter-copy { margin-bottom: 13px !important; }
  .newsletter-copy h2 { margin: 0 0 6px !important; font-size: 21px !important; line-height: 1.2 !important; }
  .newsletter-copy p { margin: 0 !important; font-size: 11px !important; line-height: 1.5 !important; }
  .newsletter-pills { display: none !important; }
  .newsletter-form-panel { padding: 13px !important; border-radius: 13px !important; box-shadow: none !important; }
  .newsletter-form-title { font-size: 13px !important; }
  .newsletter-form-text { font-size: 10px !important; }
  .newsletter-form { display: grid !important; grid-template-columns: 1fr !important; gap: 7px !important; }
  .newsletter-form input { min-height: 44px !important; width: 100% !important; }
  .newsletter-form button { width: 100% !important; min-height: 44px !important; }

  /* ---------- Standard internal page hero ---------- */
  .page-hero {
    min-height: 0 !important;
    padding: 30px 0 29px !important;
    background-position: center !important;
  }
  .page-hero-inner { text-align: start !important; }
  .breadcrumb {
    margin-bottom: 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    font-size: 9.5px !important;
    line-height: 1.3 !important;
  }
  .page-hero-badge {
    margin-bottom: 9px !important;
    padding: 5px 9px !important;
    font-size: 8.5px !important;
    line-height: 1.3 !important;
    border-radius: 999px !important;
  }
  .page-hero h1,
  .page-hero-title {
    margin: 0 0 8px !important;
    max-width: 100% !important;
    font-size: clamp(28px,8.3vw,35px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.03em !important;
  }
  html[dir="rtl"] .page-hero h1,
  html[lang="ar"] .page-hero h1 { line-height: 1.34 !important; letter-spacing: 0 !important; }
  .page-hero p,
  .page-hero-sub {
    max-width: 34rem !important;
    margin: 0 !important;
    font-size: 12.5px !important;
    line-height: 1.6 !important;
  }

  /* ---------- Universal mobile card system ---------- */
  :is(
    .mission-card,.team-general,.branch-detail,.home-adm-panel,.home-adm-side-block,.home-adm-card,
    .contact-form-card,.office-hours-card,.map-card,.facility-card,.bus-card,.step-card,.dress-card,.faq-item,
    .privacy-section,.info-card,.prog-full-card,.subject-item,.curriculum-card,.key-card,.calendar-board,
    .pa-route-box,.pa-workspace,.pa-result-card,.fv-form,.fv-result
  ) {
    border-radius: var(--m-radius) !important;
    box-shadow: none !important;
  }

  /* ---------- About ---------- */
  .mission-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .mission-card { padding: 17px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; color: var(--m-text) !important; }
  .mission-card h3 { margin: 0 0 7px !important; font-size: 16px !important; line-height: 1.3 !important; }
  .mission-card p { margin: 0 !important; font-size: 11.5px !important; line-height: 1.58 !important; color: var(--m-muted) !important; }
  .mission-card.values { padding-bottom: 14px !important; }
  .mission-card.values .values-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }
  .value-item { padding: 10px !important; border-radius: 11px !important; }
  .value-icon { font-size: 19px !important; }
  .value-title { font-size: 10.5px !important; }
  .value-desc { font-size: 9px !important; line-height: 1.4 !important; }
  .team-section { padding-top: 34px !important; }
  .team-general { margin-top: 16px !important; padding: 17px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .team-general p { margin: 0 !important; color: var(--m-muted) !important; font-size: 12px !important; line-height: 1.65 !important; }
  .branch-detail-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 11px !important; margin-top: 20px !important; }
  .branch-detail { overflow: hidden !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .branch-detail-header { min-height: 112px !important; padding: 18px !important; }
  .branch-detail-header h3 { font-size: 22px !important; }
  .branch-detail-header p { font-size: 9px !important; }
  .branch-detail-header .campus-no { width: 38px !important; height: 38px !important; top: 14px !important; right: 14px !important; border-radius: 11px !important; }
  html[dir="rtl"] .branch-detail-header .campus-no { right: auto !important; left: 14px !important; }
  .branch-detail-body { padding: 12px !important; gap: 6px !important; background: var(--m-surface) !important; }
  .branch-detail-row,
  html[dir="rtl"] .branch-detail-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2px !important;
    padding: 9px 10px !important;
    border-radius: 9px !important;
    background: var(--m-surface-2) !important;
    border: 1px solid var(--m-line) !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  /* ---------- Programmes page ---------- */
  .prog-tabs {
    margin: 0 0 18px !important;
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 7px !important;
  }
  .prog-tab {
    min-height: 48px !important;
    padding: 9px 8px !important;
    border-radius: 11px !important;
    font-size: 10.5px !important;
    line-height: 1.3 !important;
  }
  .prog-full-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow: hidden !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
  }
  .prog-full-left,
  .prog-full-right { padding: 18px !important; }
  .prog-full-left h2,.prog-full-left h3 { font-size: 21px !important; line-height: 1.2 !important; }
  .prog-full-left p,.prog-full-right p { font-size: 11.5px !important; line-height: 1.6 !important; }
  .prog-features { gap: 6px !important; }
  .prog-features li { font-size: 10.5px !important; line-height: 1.45 !important; }
  .subject-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 7px !important; }
  .subject-item { min-height: 0 !important; padding: 10px !important; background: var(--m-surface-2) !important; border: 1px solid var(--m-line) !important; font-size: 10px !important; }
  .secondary-programmes { gap: 6px !important; }
  .secondary-programme { min-height: 0 !important; padding: 8px !important; border-radius: 9px !important; font-size: 9.5px !important; line-height: 1.35 !important; }
  .curriculum-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .curriculum-card,
  .credential-card { min-height: 0 !important; padding: 17px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .credential-logo-frame { min-height: 92px !important; padding: 12px !important; border-radius: 12px !important; }
  .credential-logo-frame img { max-height: 70px !important; object-fit: contain !important; }
  .credential-copy h3,.curriculum-card h3 { font-size: 17px !important; line-height: 1.25 !important; }
  .credential-copy p,.curriculum-card p { font-size: 11px !important; line-height: 1.55 !important; }

  /* ---------- Admissions ---------- */
  .steps-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 9px !important; }
  .step-card { min-height: 0 !important; padding: 13px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .step-num { width: 30px !important; height: 30px !important; margin-bottom: 8px !important; font-size: 12px !important; }
  .step-card h4 { margin: 0 0 5px !important; color: var(--m-text) !important; font-size: 11.5px !important; line-height: 1.3 !important; }
  .step-card p { margin: 0 !important; color: var(--m-muted) !important; font-size: 9.5px !important; line-height: 1.45 !important; }
  .dress-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 9px !important; }
  .dress-card { padding: 14px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .faq-list { gap: 7px !important; }
  .faq-item { background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .faq-question { min-height: 48px !important; padding: 12px !important; gap: 8px !important; }
  .faq-num { width: 28px !important; height: 28px !important; min-width: 28px !important; font-size: 10px !important; }
  .faq-text { color: var(--m-text) !important; font-size: 11.5px !important; line-height: 1.4 !important; }
  .faq-answer { padding: 0 12px 12px 48px !important; color: var(--m-muted) !important; font-size: 11px !important; line-height: 1.55 !important; }
  html[dir="rtl"] .faq-answer { padding: 0 48px 12px 12px !important; }

  /* ---------- Admission requirements ---------- */
  .home-adm-head { display: block !important; margin-bottom: 18px !important; }
  .home-adm-head .section-label,
  .home-adm-head .section-title { text-align: center !important; }
  .home-adm-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .home-adm-panel,
  .home-adm-side-block,
  .home-adm-card { padding: 14px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .home-adm-title { font-size: 23px !important; }
  .home-adm-panel h3 { font-size: 15px !important; }
  .home-adm-chip { padding: 5px 8px !important; font-size: 8px !important; }
  .home-adm-table-wrap { width: 100% !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .age-table,.home-adm-age-table { min-width: 520px !important; font-size: 10px !important; }
  .age-table th,.age-table td,.home-adm-age-table th,.home-adm-age-table td { padding: 8px 7px !important; }
  .uniform-poster-wrap { padding: 0 !important; }
  .uniform-poster-static { border-radius: var(--m-radius) !important; overflow: hidden !important; }

  /* ---------- Facilities ---------- */
  .facilities-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .facility-card { overflow: hidden !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .facility-header { min-height: 0 !important; padding: 16px !important; }
  .facility-icon { font-size: 25px !important; }
  .facility-header h3 { margin: 5px 0 4px !important; font-size: 16px !important; }
  .facility-header p { margin: 0 !important; font-size: 10.5px !important; line-height: 1.5 !important; }
  .facility-body { padding: 13px 15px !important; background: var(--m-surface) !important; }
  .facility-body li { margin-bottom: 5px !important; color: var(--m-muted) !important; font-size: 10.5px !important; line-height: 1.4 !important; }
  .activities-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 7px !important; }
  .activity-chip { min-height: 44px !important; padding: 9px !important; border-radius: 10px !important; font-size: 10px !important; }
  .bus-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 9px !important; }
  .bus-card { padding: 14px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }

  /* ---------- Contact ---------- */
  .contact-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; }
  .contact-info { gap: 9px !important; }
  .contact-form-card,
  .office-hours-card,
  .info-card,
  .map-card { padding: 15px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .contact-form-card h3,.office-hours-card h3,.info-card h3 { color: var(--m-text) !important; font-size: 16px !important; }
  .form-row { display: grid !important; grid-template-columns: 1fr !important; gap: 9px !important; }
  .form-group { margin-bottom: 10px !important; }
  .form-group label { margin-bottom: 5px !important; color: var(--m-muted) !important; font-size: 10px !important; }
  .form-group input,.form-group textarea,.form-group select {
    width: 100% !important;
    min-height: 45px !important;
    padding: 10px 11px !important;
    border: 1px solid var(--m-line) !important;
    border-radius: 10px !important;
    background: var(--m-bg) !important;
    color: var(--m-text) !important;
  }
  .maps-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 9px !important; }
  .map-card { min-height: 0 !important; }
  .office-status-card { padding: 13px !important; border-radius: 13px !important; }
  .office-status-actions { flex-wrap: wrap !important; gap: 6px !important; }
  .office-status-action { min-height: 38px !important; padding: 8px 10px !important; font-size: 10px !important; }
  .hours-row-item,.info-row { padding: 8px 0 !important; font-size: 10.5px !important; }

  /* ---------- Campus pages ---------- */
  .branch-hero {
    min-height: 0 !important;
    padding: 32px 0 30px !important;
  }
  .branch-hero-badge { margin-bottom: 10px !important; padding: 5px 9px !important; font-size: 8.5px !important; }
  .branch-hero h1 { margin-bottom: 9px !important; font-size: clamp(29px,8.5vw,36px) !important; line-height: 1.12 !important; }
  .branch-hero p { margin-bottom: 14px !important; font-size: 12px !important; line-height: 1.6 !important; }
  .portal-big { width: auto !important; min-height: 43px !important; padding: 9px 12px !important; font-size: 11px !important; }
  .portal-big::after { width: 24px !important; height: 24px !important; font-size: 12px !important; }
  .info-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 9px !important; }
  .info-card { min-height: 0 !important; }
  .prog-tags { gap: 5px !important; }
  .prog-tag { padding: 5px 7px !important; font-size: 9px !important; }

  /* ---------- Calendar ---------- */
  .calendar-view-switch {
    margin: 0 0 16px !important;
    padding: 4px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4px !important;
    border-radius: 13px !important;
    background: var(--m-surface-2) !important;
  }
  .calendar-view-tab { min-height: 42px !important; padding: 8px 7px !important; border-radius: 10px !important; font-size: 10px !important; line-height: 1.25 !important; }
  .calendar-shell { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .calendar-board { padding: 12px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .calendar-topline { margin-bottom: 12px !important; padding-bottom: 12px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; flex-direction: row !important; }
  html[dir="rtl"] .calendar-topline { flex-direction: row !important; }
  .calendar-brand { min-width: 0 !important; display: flex !important; flex-direction: row !important; align-items: center !important; gap: 8px !important; }
  .calendar-brand img { height: 38px !important; width: auto !important; }
  .calendar-brand-title { font-size: 16px !important; line-height: 1.1 !important; color: var(--m-text) !important; }
  .calendar-year-pill { flex: 0 0 auto !important; padding: 7px 9px !important; border-radius: 9px !important; font-size: 11px !important; }
  .month-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
  .month-card { border-radius: 11px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; box-shadow: none !important; }
  .month-head { min-height: 46px !important; padding: 7px 9px !important; grid-template-columns: 1fr 94px !important; }
  .month-title { font-size: 12px !important; }
  .school-days { width: 94px !important; min-height: 29px !important; font-size: 9px !important; }
  .mini-cal th { padding: 5px 1px !important; font-size: 8px !important; }
  .mini-cal td { height: 27px !important; font-size: 10.5px !important; }
  .month-note { min-height: 0 !important; padding: 6px 8px !important; font-size: 8.5px !important; background: var(--m-surface-2) !important; color: var(--m-muted) !important; }
  .key-panel { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
  .key-card { padding: 14px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .key-card.dark { background: #10263d !important; }
  .key-card h3 { margin-bottom: 10px !important; font-size: 16px !important; }
  .key-row { padding-bottom: 7px !important; gap: 7px !important; }
  .key-text strong { font-size: 10.5px !important; }
  .key-date { font-size: 8.5px !important; }
  .summary-table th,.summary-table td { padding: 7px 6px !important; font-size: 9.5px !important; }
  .calendar-note { padding: 12px !important; border-radius: 12px !important; font-size: 10px !important; box-shadow: none !important; }
  .calendar-actions { margin-top: 12px !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 7px !important; }
  .calendar-actions .btn { width: 100% !important; padding: 9px !important; font-size: 9.5px !important; }
  .print-tip { font-size: 8.5px !important; }
  .events-calendar { border-radius: var(--m-radius) !important; overflow: hidden !important; }
  .events-calendar-head { padding: 15px !important; }
  .events-title { font-size: 22px !important; line-height: 1.2 !important; }
  .events-subtitle { font-size: 10.5px !important; line-height: 1.45 !important; }
  .events-head-badges { gap: 5px !important; }
  .events-head-badges span,.events-year-badge { padding: 5px 7px !important; font-size: 8px !important; }
  .events-body { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; padding: 12px !important; }
  .events-toolbar { gap: 8px !important; }
  .semester-switch { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 5px !important; }
  .semester-btn { min-height: 41px !important; padding: 8px !important; font-size: 9.5px !important; }
  .event-filters { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; }
  .event-filter-label { font-size: 8.5px !important; }
  .event-filter-wrap button { min-height: 34px !important; padding: 6px 8px !important; font-size: 8.5px !important; }
  .events-mini-stats { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 6px !important; }
  .events-month-heading { font-size: 16px !important; }
  .events-list { gap: 6px !important; }
  .events-source { padding: 12px !important; }
  .events-footnote,.events-note { font-size: 9px !important; line-height: 1.45 !important; }

  /* ---------- Privacy ---------- */
  .privacy-wrap { padding-top: 0 !important; }
  .privacy-intro { margin-bottom: 16px !important; font-size: 12px !important; line-height: 1.65 !important; }
  .privacy-last-updated { margin-bottom: 14px !important; font-size: 9px !important; }
  .privacy-section { margin-bottom: 9px !important; padding: 15px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .privacy-section h2 { margin-bottom: 7px !important; font-size: 16px !important; color: var(--m-text) !important; }
  .privacy-section p,.privacy-section li { font-size: 11px !important; line-height: 1.6 !important; color: var(--m-muted) !important; }

  /* ---------- Pathway Advisor ---------- */
  .pa-page { background: var(--m-bg) !important; }
  .pa-hero { padding: 30px 0 24px !important; min-height: 0 !important; }
  .pa-hero-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 13px !important; }
  .pa-eyebrow { margin-bottom: 7px !important; font-size: 8.5px !important; }
  .pa-hero h1 { margin-bottom: 8px !important; font-size: 30px !important; line-height: 1.1 !important; }
  .pa-hero p { margin-bottom: 12px !important; font-size: 11.5px !important; line-height: 1.55 !important; }
  .pa-trust-row { gap: 5px !important; }
  .pa-trust-row span { padding: 5px 7px !important; font-size: 8px !important; }
  .pa-route-box { padding: 13px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .pa-route-box-title { font-size: 15px !important; }
  .pa-route-mini { min-height: 54px !important; padding: 9px !important; border-radius: 10px !important; }
  .pa-route-mini-code { width: 30px !important; height: 30px !important; font-size: 10px !important; }
  .pa-route-mini strong { font-size: 10.5px !important; }
  .pa-route-mini small { font-size: 8.5px !important; }
  .pa-advisor-section { padding: 30px 0 !important; }
  .pa-workspace-shell { display: block !important; }
  .pa-workspace { padding: 14px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .pa-question-title { font-size: 20px !important; }
  .pa-question-sub { font-size: 10.5px !important; }
  .pa-options { gap: 7px !important; }
  .pa-options button { min-height: 45px !important; padding: 9px 10px !important; font-size: 10px !important; border-radius: 10px !important; }
  .pa-question-nav { gap: 7px !important; }
  .pa-btn { min-height: 42px !important; padding: 9px 11px !important; font-size: 10px !important; }
  .pa-result-grid,.pa-route-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
  .pa-result-card,.pa-route-card { padding: 13px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }

  /* ---------- Future Vision ---------- */
  .fv-hero { min-height: 0 !important; padding: 34px 0 30px !important; }
  .fv-badge { margin-bottom: 9px !important; padding: 5px 9px !important; font-size: 8.5px !important; }
  .fv-hero h1 { margin-bottom: 8px !important; font-size: 30px !important; line-height: 1.1 !important; }
  .fv-hero p { font-size: 11.5px !important; line-height: 1.55 !important; }
  .fv-section { padding: 34px 0 40px !important; background: var(--m-bg) !important; }
  .fv-form { padding: 16px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; }
  .fv-form-title { font-size: 19px !important; color: var(--m-text) !important; }
  .fv-form-sub { font-size: 10.5px !important; color: var(--m-muted) !important; }
  .fv-field { margin-bottom: 10px !important; }
  .fv-label { margin-bottom: 5px !important; font-size: 9.5px !important; color: var(--m-muted) !important; }
  .fv-input,.fv-select { min-height: 45px !important; padding: 10px !important; border-radius: 10px !important; background: var(--m-bg) !important; color: var(--m-text) !important; border: 1px solid var(--m-line) !important; }
  .fv-dreams { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 7px !important; }
  .fv-generate-btn { min-height: 45px !important; font-size: 11px !important; }
  .fv-poster-wrap { padding: 10px !important; border-radius: 12px !important; }
  .fv-result-actions { display: grid !important; grid-template-columns: 1fr !important; gap: 7px !important; }
  .fv-action-btn { width: 100% !important; min-height: 43px !important; }

  /* ---------- Footer ---------- */
  .footer {
    padding: 34px var(--m-gutter) max(24px, env(safe-area-inset-bottom)) !important;
  }
  .footer-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 20px 14px !important;
  }
  .footer-grid > :first-child { grid-column: 1 / -1 !important; }
  .footer-brand-name { margin-bottom: 7px !important; font-size: 17px !important; line-height: 1.25 !important; }
  .footer-brand-name span { margin-top: 2px !important; font-size: 9px !important; }
  .footer-desc { max-width: none !important; margin-bottom: 9px !important; font-size: 10px !important; line-height: 1.55 !important; }
  .footer-contact { font-size: 10px !important; line-height: 1.65 !important; }
  .footer-col h4 { margin-bottom: 8px !important; font-size: 11px !important; }
  .footer-col li { margin-bottom: 5px !important; }
  .footer-col a { font-size: 9.5px !important; }
  .footer-bottom {
    margin-top: 22px !important;
    padding-top: 14px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 9px !important;
    font-size: 8.5px !important;
  }
  .footer-bottom-links { gap: 8px 12px !important; flex-wrap: wrap !important; }
  .footer-bottom-links a { font-size: 8.5px !important; }

  /* ---------- Floating actions ---------- */
  .back-to-top {
    width: 40px !important;
    height: 40px !important;
    right: calc(12px + env(safe-area-inset-right)) !important;
    bottom: calc(72px + env(safe-area-inset-bottom)) !important;
    border-radius: 12px !important;
  }
  .dak-ai-bubble {
    width: 48px !important;
    height: 48px !important;
    right: calc(12px + env(safe-area-inset-right)) !important;
    bottom: calc(14px + env(safe-area-inset-bottom)) !important;
  }
  .dak-ai-bubble svg { width: 32px !important; height: 32px !important; }
  .dak-ai-chat {
    left: var(--m-gutter) !important;
    right: var(--m-gutter) !important;
    bottom: calc(72px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(66dvh, 540px) !important;
    border-radius: 16px !important;
  }
  .wa-fab {
    width: 48px !important;
    height: 48px !important;
    left: calc(12px + env(safe-area-inset-left)) !important;
    right: auto !important;
    bottom: calc(14px + env(safe-area-inset-bottom)) !important;
  }
  .wa-menu {
    left: var(--m-gutter) !important;
    right: var(--m-gutter) !important;
    bottom: calc(70px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
  }
  html[dir="rtl"] .wa-fab { left: calc(12px + env(safe-area-inset-left)) !important; right: auto !important; }

  /* ---------- Dark mode: final mobile surface ownership ---------- */
  html[data-theme="dark"] body,
  html[data-theme="dark"] .section,
  html[data-theme="dark"] .branches-section,
  html[data-theme="dark"] .why-section,
  html[data-theme="dark"] .day-at-dak,
  html[data-theme="dark"] .path-tools-section,
  html[data-theme="dark"] .icampus-section,
  html[data-theme="dark"] .premium-apps-section,
  html[data-theme="dark"] .newsletter,
  html[data-theme="dark"] .fv-section,
  html[data-theme="dark"] .pa-page { background: var(--m-bg) !important; }
  html[data-theme="dark"] .section-gray,
  html[data-theme="dark"] .news-section,
  html[data-theme="dark"] .journey-section,
  html[data-theme="dark"] .quick-access-premium { background: var(--m-surface-2) !important; }
  html[data-theme="dark"] :is(
    .prog-card,.why-card,.news-card,.day-panel,.journey-form-panel,.ql-card,.newsletter-form-panel,
    .mission-card,.team-general,.branch-detail,.branch-detail-body,.branch-detail-row,.prog-full-card,.prog-full-right,
    .subject-item,.curriculum-card,.credential-card,.step-card,.dress-card,.faq-item,.home-adm-panel,.home-adm-side-block,
    .home-adm-card,.facility-card,.facility-body,.bus-card,.contact-form-card,.office-hours-card,.info-card,.map-card,
    .calendar-board,.month-card,.key-card:not(.dark),.privacy-section,.pa-route-box,.pa-workspace,.pa-result-card,.pa-route-card,
    .fv-form,.fv-result
  ) {
    background: var(--m-surface) !important;
    border-color: var(--m-line) !important;
    color: var(--m-text) !important;
  }
  html[data-theme="dark"] :is(
    .section-title,.home-adm-title,.prog-title,.why-card h3,.news-title-text,.day-panel-title,.journey-form-head h3,
    .ql-card h3,.ql-card strong,.mission-card h3,.team-general h3,.branch-detail-row strong,.prog-full-card h2,.prog-full-card h3,
    .credential-copy h3,.curriculum-card h3,.step-card h4,.faq-text,.home-adm-panel h3,.contact-form-card h3,.office-hours-card h3,
    .info-card h3,.calendar-brand-title,.privacy-section h2,.fv-form-title
  ) { color: var(--m-text) !important; }
  html[data-theme="dark"] :is(
    .section-sub,.prog-desc,.why-card p,.news-date,.news-excerpt,.day-panel-text,.journey-input-group label,.ql-card p,
    .mission-card p,.team-general p,.branch-detail-row span,.prog-full-card p,.credential-copy p,.curriculum-card p,.step-card p,
    .faq-answer,.home-adm-sub,.facility-body li,.form-group label,.privacy-section p,.privacy-section li,.fv-form-sub,.fv-label
  ) { color: var(--m-muted) !important; }
  html[data-theme="dark"] :is(input,select,textarea,.journey-input-group input,.journey-input-group select,.fv-input,.fv-select) {
    background: var(--m-bg) !important;
    border-color: var(--m-line) !important;
    color: var(--m-text) !important;
  }
  html[data-theme="dark"] .credential-logo-frame,
  html[data-theme="dark"] .official-logo-plate { background: rgba(255,255,255,.96) !important; }

  /* ---------- RTL alignment ---------- */
  html[dir="rtl"] :is(.page-hero-inner,.branch-hero-inner,.pa-hero-copy,.privacy-section,.contact-form-card,.info-card,.facility-card,.step-card,.dress-card) { text-align: right !important; }
  html[dir="rtl"] :is(.prog-card,.why-card,.news-card,.ql-card,.pa-route-card,.pa-result-card) { text-align: right !important; }
}

/* Small phones: iPhone SE / compact Android */
@media (max-width: 374px) {
  :root { --m-gutter: 15px; }
  .logo img,#navbar .logo img { height: 39px !important; max-width: 154px !important; }
  .hero-right { height: 188px !important; min-height: 188px !important; }
  .hero-left { padding: 20px 16px 16px !important; }
  .hero-title { font-size: 29px !important; }
  html[dir="rtl"] .hero-title { font-size: 27px !important; }
  .stat-num { font-size: 16px !important; }
  .stat-label { font-size: 7px !important; }
  .programmes-grid,.why-cards,.steps-grid,.ql-grid,.day-steps-list.compact,.activities-grid,.fv-dreams { grid-template-columns: 1fr !important; }
  .prog-card.c3 { grid-column: auto !important; }
  .footer-grid { grid-template-columns: 1fr !important; }
  .footer-grid > :first-child { grid-column: auto !important; }
}

/* Landscape phones: reduce vertical bulk, keep touch targets */
@media (max-width: 767px) and (orientation: landscape) and (max-height: 520px) {
  .hero { display: grid !important; grid-template-columns: .9fr 1.1fr !important; padding-top: 10px !important; }
  .hero-right { order: 0 !important; height: 310px !important; min-height: 310px !important; border-radius: var(--m-radius-lg) 0 0 var(--m-radius-lg) !important; }
  .hero-left { order: 1 !important; min-height: 310px !important; padding: 18px !important; border-radius: 0 var(--m-radius-lg) var(--m-radius-lg) 0 !important; }
  .hero-title { font-size: 28px !important; }
  .hero-desc { font-size: 11px !important; }
  .hero-stats { margin-top: 12px !important; padding-top: 10px !important; }
  .page-hero,.branch-hero,.fv-hero,.pa-hero { padding-top: 22px !important; padding-bottom: 22px !important; }
}

@media (prefers-reduced-motion: reduce) {
  @media (max-width: 767px) {
    *,*::before,*::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; }
  }
}

/* ======================================================================
   MOBILE REFINEMENT PASS — compact homepage components
   ====================================================================== */
@media (max-width: 767px) {
  #navbar { background: var(--m-surface) !important; }

  .hero-actions { flex-direction: row !important; align-items: stretch !important; }
  .hero-actions .btn,
  .hero-actions a { flex: 1 1 auto !important; height: auto !important; }

  /* Slim school-office strip */
  .home-office-status {
    padding: 0 var(--m-gutter) !important;
    margin: -8px 0 0 !important;
    background: var(--m-bg) !important;
  }
  .home-office-status .container { padding-inline: 0 !important; }
  .home-office-status .office-status-card.compact {
    padding: 12px 13px !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 8px 10px !important;
    align-items: center !important;
    border-radius: 14px !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
  }
  .home-office-status .office-status-main { min-width: 0 !important; }
  .home-office-status .office-status-dot { width: 9px !important; height: 9px !important; }
  .home-office-status .office-status-kicker { font-size: 8px !important; }
  .home-office-status .office-status-title { font-size: 11.5px !important; line-height: 1.25 !important; color: var(--m-text) !important; }
  .home-office-status .office-status-note { grid-column: 1 / -1 !important; margin: 0 !important; font-size: 9px !important; color: var(--m-muted) !important; }
  .home-office-status .office-status-actions { grid-column: 2 !important; grid-row: 1 !important; display: flex !important; gap: 4px !important; }
  .home-office-status .office-status-action { min-height: 32px !important; padding: 6px 8px !important; font-size: 8.5px !important; border-radius: 9px !important; }

  /* Why DAK side panel becomes a concise proof strip */
  .why-showcase { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .why-panel {
    min-height: 0 !important;
    padding: 15px !important;
    border-radius: var(--m-radius) !important;
    box-shadow: none !important;
  }
  .why-panel-content { min-height: 0 !important; display: block !important; }
  .why-panel-kicker { margin-bottom: 4px !important; font-size: 8.5px !important; }
  .why-panel-title { margin-bottom: 5px !important; font-size: 18px !important; line-height: 1.22 !important; }
  .why-panel-text { margin: 0 0 11px !important; font-size: 10.5px !important; line-height: 1.5 !important; }
  .why-metrics { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 5px !important; }
  .why-metric { min-height: 62px !important; padding: 8px 3px !important; border-radius: 10px !important; }
  .why-metric .n { font-size: 17px !important; line-height: 1 !important; }
  .why-metric .l { margin-top: 5px !important; font-size: 6.8px !important; line-height: 1.2 !important; }

  /* News becomes a clean list */
  .news-card { position: relative !important; }
  .news-excerpt {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }
  .mobile-news-more { margin-top: 8px !important; }
  .mobile-news-more > summary {
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    list-style: none !important;
    cursor: pointer !important;
    border-radius: 11px !important;
    border: 1px solid var(--m-line) !important;
    background: var(--m-surface) !important;
    color: var(--m-text) !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
  }
  .mobile-news-more > summary::-webkit-details-marker { display: none !important; }
  .mobile-news-more > summary::after { content: '＋'; margin-inline-start: 6px; color: var(--m-teal); }
  .mobile-news-more[open] > summary::after { content: '−'; }
  .mobile-news-more .news-card { margin-top: 8px !important; }
  .mobile-news-more .ar-only { display: none !important; }
  html[lang="ar"] .mobile-news-more .en-only { display: none !important; }
  html[lang="ar"] .mobile-news-more .ar-only { display: inline !important; }

  /* Guided tools: remove decorative bulk */
  .path-tools-panel {
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }
  .path-tools-intro {
    padding: 0 !important;
    margin: 0 0 18px !important;
    text-align: center !important;
    background: transparent !important;
    border: 0 !important;
  }
  .path-tools-intro .section-label { text-align: center !important; }
  .path-tools-intro h2 { color: var(--m-text) !important; }
  .path-tools-intro p { max-width: 32rem !important; margin: 0 auto !important; color: var(--m-muted) !important; font-size: 11.5px !important; line-height: 1.55 !important; }
  .path-tools-route { display: none !important; }
  .path-tools-grid { gap: 8px !important; }
  .path-tool-card {
    position: relative !important;
    min-height: 0 !important;
    padding: 14px 52px 14px 14px !important;
    background: var(--m-surface) !important;
    border: 1px solid var(--m-line) !important;
    color: var(--m-text) !important;
  }
  html[dir="rtl"] .path-tool-card { padding: 14px 14px 14px 52px !important; }
  .path-tool-index { width: 32px !important; height: 32px !important; margin-bottom: 8px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 9px !important; font-size: 10px !important; }
  .path-tool-icon { position: absolute !important; top: 14px !important; right: 14px !important; width: 34px !important; height: 34px !important; font-size: 13px !important; border-radius: 50% !important; }
  html[dir="rtl"] .path-tool-icon { right: auto !important; left: 14px !important; }
  .path-tool-card h3 { margin: 0 0 4px !important; color: var(--m-text) !important; font-size: 14px !important; line-height: 1.28 !important; }
  .path-tool-card p { margin: 0 0 9px !important; color: var(--m-muted) !important; font-size: 9.5px !important; line-height: 1.45 !important; }
  .path-tool-action { width: fit-content !important; min-height: 33px !important; padding: 6px 8px !important; font-size: 9px !important; border-radius: 9px !important; }
  .path-tool-arrow { width: 22px !important; height: 22px !important; font-size: 9px !important; }

  /* Quick access is a readable list, not squeezed tiles */
  .ql-grid { grid-template-columns: 1fr !important; gap: 6px !important; }
  .ql-card {
    min-height: 66px !important;
    padding: 9px 10px !important;
    display: grid !important;
    grid-template-columns: 36px minmax(0,1fr) 28px !important;
    align-items: center !important;
    gap: 9px !important;
    border-radius: 12px !important;
  }
  .ql-icon { width: 36px !important; height: 36px !important; min-width: 36px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 10px !important; font-size: 17px !important; }
  .ql-content { min-width: 0 !important; }
  .ql-title { color: var(--m-text) !important; font-size: 11.5px !important; line-height: 1.25 !important; }
  .ql-desc { margin-top: 2px !important; color: var(--m-muted) !important; font-size: 9px !important; line-height: 1.35 !important; }
  .ql-arrow { width: 28px !important; height: 28px !important; min-width: 28px !important; font-size: 10px !important; }

  /* School apps */
  .apps-showcase {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }
  .premium-app-card,.app-card {
    min-height: 0 !important;
    height: auto !important;
    padding: 14px !important;
    background: var(--m-surface) !important;
    color: var(--m-text) !important;
    border: 1px solid var(--m-line) !important;
  }
  .app-card-top { margin-bottom: 9px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; }
  .app-icon-wrap { width: 38px !important; height: 38px !important; min-width: 38px !important; border-radius: 10px !important; font-size: 18px !important; }
  .app-badge { padding: 5px 7px !important; border-radius: 999px !important; font-size: 8px !important; line-height: 1.2 !important; }
  .app-info { margin-bottom: 9px !important; }
  .app-name { margin: 0 0 3px !important; color: var(--m-text) !important; font-size: 16px !important; line-height: 1.2 !important; }
  .app-desc { margin: 0 !important; color: var(--m-muted) !important; font-size: 10px !important; line-height: 1.45 !important; }
  .app-feature-row { display: none !important; }
  .app-btns { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; }
  .store-btn {
    min-height: 48px !important;
    padding: 7px 8px !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    border-radius: 10px !important;
  }
  .store-icon { font-size: 16px !important; }
  .store-text span { font-size: 7px !important; line-height: 1.1 !important; }
  .store-text strong { font-size: 9.5px !important; line-height: 1.15 !important; }

  /* Newsletter actual form class */
  .nl-form { display: grid !important; grid-template-columns: 1fr !important; gap: 7px !important; }
  .nl-form input,.nl-form button { width: 100% !important; min-height: 44px !important; }

  /* Mobile appearance control */
  .mobile-menu .theme-control--mobile {
    margin-top: 7px !important;
    padding: 9px !important;
    border-radius: 12px !important;
    background: var(--m-surface-2) !important;
    border: 1px solid var(--m-line) !important;
    box-shadow: none !important;
  }
  .theme-mobile-heading { color: var(--m-text) !important; font-size: 10px !important; }
  .theme-segment { background: var(--m-bg) !important; }
  .theme-segment-option { min-height: 39px !important; padding: 5px 3px !important; color: var(--m-muted) !important; }
  .theme-segment-option.is-active { background: var(--m-surface) !important; border-color: var(--m-line) !important; color: var(--m-text) !important; box-shadow: none !important; }
}
/* Desktop preservation for mobile-only news disclosure markup */
@media (min-width: 768px) {
  .mobile-news-more { display: contents; }
  .mobile-news-more > summary { display: none; }
  .mobile-news-more > .news-card { display: block; }
}
@media (max-width: 767px) {
  /* Final homepage clarity details */
  .home-office-status .office-status-card.compact { grid-template-columns: 1fr !important; }
  .home-office-status .office-status-actions { display: none !important; }
  .home-office-status .office-status-note { grid-column: 1 !important; }
  .prog-card.c4 { grid-column: 1 / -1 !important; }
  .day-step-btn strong { color: var(--m-text) !important; }
  .day-step-btn i { font-style: normal !important; }

  .premium-apps-section,
  .icampus-section {
    background: var(--m-bg) !important;
  }
  .premium-apps-section::before,
  .premium-apps-section::after,
  .icampus-section::before,
  .icampus-section::after { display: none !important; }
  .premium-apps-section .section-label { color: var(--m-teal) !important; }
  .premium-apps-section .section-title { color: var(--m-text) !important; text-shadow: none !important; }
  .premium-apps-section .section-sub { color: var(--m-muted) !important; }

  .newsletter-card {
    background: var(--m-surface) !important;
    color: var(--m-text) !important;
    border: 1px solid var(--m-line) !important;
  }
  .newsletter-card::before,.newsletter-card::after { display: none !important; }
  .newsletter-badge { color: var(--m-teal) !important; background: rgba(7,153,168,.08) !important; border-color: rgba(7,153,168,.18) !important; }
  .newsletter-copy h2 { color: var(--m-text) !important; text-shadow: none !important; }
  .newsletter-copy p { color: var(--m-muted) !important; }
  .newsletter-form-panel { background: var(--m-surface-2) !important; border: 1px solid var(--m-line) !important; }
  .newsletter-form-title { color: var(--m-text) !important; }
  .newsletter-form-text,.newsletter-trust { color: var(--m-muted) !important; }
}
@media (max-width: 767px) {
  .mission-card h3,
  .mission-card.values h3,
  .value-title { color: var(--m-text) !important; }
  .value-desc { color: var(--m-muted) !important; }
  .mission-card.values .value-item { background: var(--m-surface-2) !important; border: 1px solid var(--m-line) !important; }
}
@media (max-width: 767px) {
  .news-grid > .news-card:nth-child(n+4) { display: none !important; }
  .news-grid.mobile-news-expanded > .news-card:nth-child(n+4) { display: block !important; }
  .mobile-news-toggle {
    width: 100% !important;
    min-height: 42px !important;
    margin-top: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid var(--m-line) !important;
    border-radius: 11px !important;
    background: var(--m-surface) !important;
    color: var(--m-text) !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    cursor: pointer !important;
  }
  .mobile-news-toggle::after { content: '＋'; margin-inline-start: 6px; color: var(--m-teal); }
  .mobile-news-toggle.is-open::after { content: '−'; }
  .mobile-news-toggle .ar-only { display: none !important; }
  html[lang="ar"] .mobile-news-toggle .en-only { display: none !important; }
  html[lang="ar"] .mobile-news-toggle .ar-only { display: inline !important; }
}
@media (min-width: 768px) { .mobile-news-toggle { display: none !important; } }


/* DAK CSS: theme-v27.css */
/* ======================================================================
   DORAT AL KHALEEJ — THEME QA v27
   Final contrast and theme-isolation pass.
   Loaded after v26. Keeps the v24 mobile layout while fixing remaining
   low-contrast text, legacy white-card overrides and mixed light/dark UI.
   ====================================================================== */

:root{
  --v27-bg:#f4f8fa;
  --v27-surface:#ffffff;
  --v27-surface-soft:#edf4f7;
  --v27-surface-raised:#ffffff;
  --v27-text:#142436;
  --v27-heading:#102033;
  --v27-muted:#516171;
  --v27-muted-2:#697a89;
  --v27-border:#d5e1e7;
  --v27-border-strong:#bfd0d9;
  --v27-teal:#007783;
  --v27-teal-soft:#e2f5f6;
  --v27-purple:#684299;
  --v27-gold:#8b5b08;
  --v27-shadow:0 10px 28px rgba(16,32,51,.07);
}
html[data-theme="dark"]{
  --v27-bg:#07131f;
  --v27-surface:#0f2030;
  --v27-surface-soft:#15283a;
  --v27-surface-raised:#193047;
  --v27-text:#f5f8fb;
  --v27-heading:#ffffff;
  --v27-muted:#c3cfda;
  --v27-muted-2:#a9b8c6;
  --v27-border:#334b61;
  --v27-border-strong:#47637c;
  --v27-teal:#66e5ef;
  --v27-teal-soft:#123840;
  --v27-purple:#c3a6ef;
  --v27-gold:#ffd66e;
  --v27-shadow:0 10px 30px rgba(0,0,0,.22);
}
html[data-theme="light"]{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
html,body{background:var(--v27-bg)!important;color:var(--v27-text)!important}

/* ---------- Core text ---------- */
html[data-theme="light"] :is(.section-label,.page-hero .accent,.page-hero-title .accent,.fv-badge){color:var(--v27-teal)!important}
html[data-theme="dark"] :is(.section-label,.page-hero .accent,.page-hero-title .accent,.fv-badge){color:var(--v27-teal)!important}
:is(.section-sub,.prog-desc,.news-excerpt,.news-date,.ql-desc,.value-desc,.print-tip,.events-subtitle,.events-footnote,.events-source-meta,.events-month-heading p,.privacy-section p,.privacy-section li){color:var(--v27-muted)!important}

/* Breadcrumb slash inherited legacy white and vanished in light mode. */
html[data-theme="light"] .breadcrumb>span{color:#8a99a6!important}
html[data-theme="dark"] .breadcrumb>span{color:#7f92a4!important}

/* ---------- Header and navigation ---------- */
html[data-theme="light"] #navbar{background:rgba(255,255,255,.97)!important;border-bottom-color:var(--v27-border)!important}
html[data-theme="dark"] #navbar{background:rgba(7,19,31,.97)!important;border-bottom-color:var(--v27-border)!important}
#navbar .nav-links a:not(.nav-portal-btn),#navbar .lang-toggle{color:var(--v27-text)!important}
.hamburger{background:var(--v27-surface-soft)!important;border-color:var(--v27-border)!important}
.hamburger span{background:var(--v27-text)!important}
.mobile-menu{background:var(--v27-surface)!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important}
.mobile-menu a,.mobile-menu .lang-toggle{color:var(--v27-text)!important}
.theme-control--mobile,.theme-segment{background:var(--v27-surface-soft)!important;border-color:var(--v27-border)!important}
.theme-segment-option{color:var(--v27-muted)!important}
.theme-segment-option.is-active{background:var(--v27-surface)!important;color:var(--v27-text)!important}

/* ---------- Internal page hero ---------- */
html[data-theme="light"] .page-hero{
  background:radial-gradient(circle at 8% 8%,rgba(0,151,167,.10),transparent 34%),radial-gradient(circle at 92% 90%,rgba(107,63,160,.08),transparent 36%),linear-gradient(135deg,#f8fcfd 0%,#edf6f8 52%,#f5f2fa 100%)!important;
  border-bottom:1px solid var(--v27-border)!important;
}
html[data-theme="dark"] .page-hero{
  background:radial-gradient(circle at 8% 8%,rgba(102,229,239,.09),transparent 34%),radial-gradient(circle at 92% 90%,rgba(195,166,239,.08),transparent 36%),linear-gradient(135deg,#0d1d2b 0%,#102235 52%,#121b2d 100%)!important;
  border-bottom:1px solid var(--v27-border)!important;
}
html[data-theme="light"] .page-hero :is(h1,.page-hero-title){color:var(--v27-heading)!important}
html[data-theme="dark"] .page-hero :is(h1,.page-hero-title){color:#fff!important}
html[data-theme="light"] .page-hero :is(p,.page-hero-sub){color:var(--v27-muted)!important}
html[data-theme="dark"] .page-hero :is(p,.page-hero-sub){color:var(--v27-muted)!important}
.page-hero-badge{color:var(--v27-teal)!important;border-color:rgba(0,119,131,.28)!important;background:rgba(0,119,131,.07)!important}
html[data-theme="dark"] .page-hero-badge{border-color:rgba(102,229,239,.30)!important;background:rgba(102,229,239,.07)!important}

/* Special branded heroes stay dark in both modes; never inherit page-heading colours. */
.pa-hero,.branch-hero,.fv-hero{color:#fff!important}
.pa-hero h1,.pa-hero h2,.pa-hero-copy>p,.branch-hero h1,.branch-hero p,.branch-hero-badge,.fv-hero h1,.fv-hero p{color:#fff!important}
.pa-hero-copy>p,.branch-hero p,.fv-hero p{color:rgba(255,255,255,.82)!important}
.pa-hero .pa-eyebrow,.pa-hero .pa-trust-row span{color:rgba(255,255,255,.82)!important}

/* ---------- General cards/surfaces ---------- */
html[data-theme="light"] :is(.mission-card,.team-general,.branch-detail,.branch-detail-body,.home-adm-panel,.home-adm-side-block,.home-adm-card,.contact-form-card,.office-hours-card,.map-card,.facility-card,.facility-body,.bus-card,.step-card,.dress-card,.faq-item,.privacy-section,.info-card:not(.navy):not(.purple),.prog-full-card,.prog-full-right,.subject-item,.calendar-board,.month-card,.pa-route-box,.pa-workspace,.pa-result-card,.fv-form,.fv-result,.prog-card,.why-card,.news-card,.journey-form-panel,.journey-premium-card,.ql-card,.app-card,.newsletter-form-panel,.path-tool-card,.events-calendar,.event-item){background:var(--v27-surface)!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important}
html[data-theme="dark"] :is(.mission-card,.team-general,.branch-detail,.branch-detail-body,.home-adm-panel,.home-adm-side-block,.home-adm-card,.contact-form-card,.office-hours-card,.map-card,.facility-card,.facility-body,.bus-card,.step-card,.dress-card,.faq-item,.privacy-section,.info-card:not(.navy):not(.purple),.prog-full-card,.prog-full-right,.subject-item,.calendar-board,.month-card,.pa-route-box,.pa-workspace,.pa-result-card,.fv-form,.fv-result,.prog-card,.why-card,.news-card,.journey-form-panel,.journey-premium-card,.ql-card,.app-card,.newsletter-form-panel,.path-tool-card,.events-calendar,.event-item){background:var(--v27-surface)!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important;box-shadow:none!important}

/* ---------- About / branch detail ---------- */
html[data-theme="light"] .branch-detail-body{background:var(--v27-surface)!important}
html[data-theme="dark"] .branch-detail-body{background:var(--v27-surface)!important}
html[data-theme="light"] .branch-detail-row{background:var(--v27-surface-soft)!important;border-color:var(--v27-border)!important}
html[data-theme="dark"] .branch-detail-row{background:var(--v27-surface-soft)!important;border-color:var(--v27-border)!important}
html[data-theme="light"] .branch-detail-row strong{color:var(--v27-heading)!important}
html[data-theme="dark"] .branch-detail-row strong{color:var(--v27-heading)!important}
.branch-detail-row span{color:var(--v27-muted)!important}

/* Branch page information cards and links. */
html[data-theme="light"] .info-card:not(.navy):not(.purple){background:var(--v27-surface)!important}
html[data-theme="dark"] .info-card:not(.navy):not(.purple){background:var(--v27-surface)!important}
.info-card:not(.navy):not(.purple) .info-row{background:transparent!important;border-color:var(--v27-border)!important}
.info-card:not(.navy):not(.purple) .info-row .lbl{color:var(--v27-muted)!important}
.info-card:not(.navy):not(.purple) .info-row .val{color:var(--v27-text)!important}
html[data-theme="light"] .info-card:not(.navy):not(.purple) .info-row a{color:#006875!important}
html[data-theme="dark"] .info-card:not(.navy):not(.purple) .info-row a{color:#72e8f0!important}

/* ---------- Contact: legacy mobile CSS used white card + navy text in dark mode ---------- */
@media(max-width:760px){
  html[data-theme="light"] body.contact-page .office-hours-card{background:#fff!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important}
  html[data-theme="dark"] body.contact-page .office-hours-card{background:var(--v27-surface)!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important}
  html[data-theme="light"] body.contact-page .office-hours-card h4,
  html[data-theme="light"] body.contact-page .office-hours-card .hours-row-item strong{color:var(--v27-heading)!important}
  html[data-theme="dark"] body.contact-page .office-hours-card h4,
  html[data-theme="dark"] body.contact-page .office-hours-card .hours-row-item strong{color:#fff!important}
  body.contact-page .office-hours-card p,
  body.contact-page .office-hours-card .hours-row-item small{color:var(--v27-muted)!important}
  body.contact-page .office-hours-card .hours-row-item{color:var(--v27-text)!important;border-bottom-color:var(--v27-border)!important;background:transparent!important}
  html[data-theme="light"] body.contact-page .office-hours-card .hours-row-item span{color:#005f69!important;background:#e4f6f7!important;border-color:#acdfe3!important}
  html[data-theme="dark"] body.contact-page .office-hours-card .hours-row-item span{color:#b9f7fb!important;background:#123640!important;border-color:#2e6670!important}
  html[data-theme="dark"] body.contact-page .office-hours-card .hours-row-item.closed span{color:#ffdd7c!important;background:#3d321a!important;border-color:#6a5625!important}
  body.contact-page .office-hours-card .hours-kicker{color:var(--v27-teal)!important;background:var(--v27-teal-soft)!important;border-color:var(--v27-border)!important}
}

/* Contact coloured campus cards intentionally remain branded. */
body.contact-page .contact-info .info-card.navy{background:linear-gradient(135deg,#16293c,#203a52)!important}
body.contact-page .contact-info .info-card.purple{background:linear-gradient(135deg,#4b2a78,#64399a)!important}
body.contact-page .contact-info .info-card.navy :is(h4,.info-row span,.info-row a),
body.contact-page .contact-info .info-card.purple :is(h4,.info-row span,.info-row a){color:#fff!important}
body.contact-page .contact-info .info-card.navy .info-row strong,
body.contact-page .contact-info .info-card.purple .info-row strong{color:rgba(255,255,255,.72)!important}
body.contact-page .contact-info .info-card.navy .info-row a{color:#69e7ef!important}
body.contact-page .contact-info .info-card.purple .info-row a{color:#ffe27c!important}

/* ---------- Forms ---------- */
:is(input,select,textarea,.journey-input-group input,.journey-input-group select,.fv-input,.fv-select){background:var(--v27-surface)!important;color:var(--v27-text)!important;border-color:var(--v27-border-strong)!important}
:is(input,textarea)::placeholder{color:var(--v27-muted-2)!important;opacity:1!important}
:is(.form-group label,.journey-input-group label,.journey-field label,.fv-label,.newsletter-form-panel label){color:var(--v27-text)!important}
html[data-theme="dark"] select option{background:#0e1d2b!important;color:#f5f8fb!important}

/* ---------- Admissions / FAQ ---------- */
html[data-theme="light"] .faq-num{color:#63358f!important;background:linear-gradient(135deg,#e5f5f7,#eee8f7)!important}
html[data-theme="dark"] .faq-num{color:#d6c0f5!important;background:linear-gradient(135deg,#153a42,#2a2440)!important}
.faq-question,.faq-text{color:var(--v27-heading)!important}
.faq-arrow{color:var(--v27-muted)!important}
.faq-answer{color:var(--v27-muted)!important}

/* ---------- Facilities: original brand teal/orange were too bright for white copy ---------- */
.facility-header.c-teal{background:#007a86!important}
.facility-header.c-purple{background:#5a3588!important}
.facility-header.c-orange{background:#a95f00!important}
.facility-header.c-yellow{background:#f1c232!important}
.facility-header.c-teal :is(h3,p),.facility-header.c-purple :is(h3,p),.facility-header.c-orange :is(h3,p){color:#fff!important}
.facility-header.c-teal p,.facility-header.c-purple p,.facility-header.c-orange p{color:rgba(255,255,255,.88)!important}
.facility-header.c-yellow :is(h3,p){color:#172333!important}
.facility-header .facility-icon{color:inherit!important}
.facility-body ul li{color:var(--v27-muted)!important;border-color:var(--v27-border)!important}
.activity-chip{background:var(--v27-surface)!important;color:var(--v27-heading)!important;border-color:var(--v27-border)!important}

/* ---------- Programmes ---------- */
.prog-full-left.c1{background:#007a86!important}
.prog-full-left.c2{background:#5a3588!important}
.prog-full-left.c3{background:#a95f00!important}
.prog-full-left.c4{background:#14263a!important}
.prog-full-left :is(h2,p,.age,.secondary-programmes-title,.secondary-programme){color:#fff!important}
.prog-full-left p{color:rgba(255,255,255,.88)!important}
.prog-full-left .secondary-programmes-title{color:rgba(255,255,255,.82)!important}
.prog-full-left .age{background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.20)!important}
html[data-theme="dark"] .prog-full-right{background:var(--v27-surface)!important}
html[data-theme="light"] .prog-full-right{background:#fff!important}

/* Pearson/Ministry official logo artwork needs a neutral plate in both modes. */
.official-logo-plate,.credential-logo-frame,.ministry-card-logo,.edexcel-card-logo,.edexcel-logo-wrap img,.home-edexcel-left img{background:#fff!important}

/* ---------- Find Your Path ---------- */
.pa-hero h1{color:#fff!important}
.pa-hero-copy>p{color:rgba(255,255,255,.82)!important}
html[data-theme="light"] .pa-route-number{color:#6f7f8d!important}
html[data-theme="dark"] .pa-route-number{color:#9fb4c6!important}
html[data-theme="light"] .pa-route-tag{color:#006f7a!important}
html[data-theme="dark"] .pa-route-tag{color:#66e5ef!important}
html[data-theme="dark"] .pa-route-card.senior .pa-route-tag{color:#ffd58b!important}
html[data-theme="dark"] :is(.pa-route-card,.pa-route-mini,.pa-result-card,.pa-result-section,.pa-question-wrap,.pa-option){background:var(--v27-surface)!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important}
html[data-theme="dark"] :is(.pa-route-card h3,.pa-route-card .pa-route-cta,.pa-question-title,.pa-result-main){color:var(--v27-heading)!important}
html[data-theme="dark"] :is(.pa-route-card p,.pa-route-meta span,.pa-question-sub){color:var(--v27-muted)!important}

/* ---------- Future Vision ---------- */
html[data-theme="light"] .fv-badge{color:#006f7a!important}
html[data-theme="dark"] .fv-badge{color:#66e5ef!important}
.fv-form-title{color:var(--v27-heading)!important}
.fv-form-sub{color:var(--v27-muted)!important}

/* ---------- Calendar ---------- */
.calendar-view-switch{background:var(--v27-surface-soft)!important;border-color:var(--v27-border)!important;box-shadow:none!important}
.calendar-view-tab{color:var(--v27-muted)!important}
.calendar-view-tab[aria-selected="true"]{background:var(--v27-surface)!important;color:var(--v27-heading)!important;border-color:var(--v27-border)!important;box-shadow:none!important}
.calendar-brand-title,.key-card:not(.dark) h3{color:var(--v27-heading)!important}
.month-card,.calendar-board,.key-card:not(.dark){background:var(--v27-surface)!important;border-color:var(--v27-border)!important}
.mini-cal th,.summary-table th{background:var(--v27-surface-soft)!important;color:var(--v27-heading)!important}
.mini-cal td,.summary-table td{background:var(--v27-surface)!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important}
.mini-cal td.muted{background:var(--v27-surface-soft)!important;color:var(--v27-muted-2)!important}
.month-note{background:var(--v27-surface-soft)!important;color:var(--v27-muted)!important;border-color:var(--v27-border)!important}
.summary-table .total td{background:rgba(241,194,50,.15)!important;color:var(--v27-heading)!important}

/* ---------- Homepage dark-mode leftover dark copy ---------- */
html[data-theme="dark"] .why-icon{color:#fff!important;background:#1b3348!important;border-color:#38546c!important}
html[data-theme="dark"] .premium-app-card .store-btn.google :is(.store-icon,.store-text span,.store-text strong){color:#102033!important}
html[data-theme="dark"] .newsletter-form-panel button{color:#102033!important}
html[data-theme="dark"] .newsletter-form-title{color:#fff!important}
html[data-theme="dark"] .newsletter-form-text,.newsletter-trust{color:var(--v27-muted)!important}

/* ---------- Assistant / WhatsApp ---------- */
html[data-theme="light"] .dak-ai-chat{background:rgba(255,255,255,.98)!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important}
html[data-theme="dark"] .dak-ai-chat{background:#0f2030!important;color:var(--v27-text)!important;border-color:var(--v27-border)!important;box-shadow:0 22px 66px rgba(0,0,0,.42)!important}
html[data-theme="dark"] .dak-ai-suggestions,html[data-theme="dark"] .dak-ai-input-row{background:#0f2030!important;border-color:var(--v27-border)!important}
html[data-theme="dark"] .dak-ai-suggestions button{background:#15283a!important;color:#f5f8fb!important;border-color:#334b61!important}
html[data-theme="dark"] .dak-ai-input-row input{background:#0a1825!important;color:#f5f8fb!important;border-color:#47637c!important}

html[data-theme="light"] .wa-menu{background:#fff!important;color:#24323d!important}
html[data-theme="dark"] .wa-menu{background:#102233!important;color:#f5f8fb!important;border:1px solid var(--v27-border)!important}
html[data-theme="dark"] .wa-menu-body{background:#0b1a26!important}
html[data-theme="dark"] .wa-greeting,html[data-theme="dark"] .wa-option{background:#15283a!important;color:#f5f8fb!important}
html[data-theme="dark"] .wa-option-name{color:#fff!important}
html[data-theme="dark"] .wa-option-sub{color:#b9c6d1!important}

/* ---------- Buttons / links ---------- */
.btn-outline{color:var(--v27-heading)!important;border-color:var(--v27-border-strong)!important;background:transparent!important}
.btn-outline:hover{background:var(--v27-surface-soft)!important}
html[data-theme="light"] :is(.map-open,.map-card .map-open){background:#fff!important;color:#173047!important;border-color:var(--v27-border)!important}
html[data-theme="dark"] :is(.map-open,.map-card .map-open){background:#162a3d!important;color:#fff!important;border-color:#36536c!important}

/* ---------- Footer remains intentionally dark in both themes ---------- */
.footer{background:#0f1f31!important;color:#fff!important}
.footer :is(.footer-brand-name,.footer-col h4){color:#fff!important}
.footer :is(.footer-desc,.footer-contact,.footer-col li,.footer-bottom,.footer-bottom-links a){color:rgba(255,255,255,.80)!important}
.footer a{color:#dceff3!important}
.footer-contact a{color:#77e7ef!important}

/* ---------- Mobile: neutralise legacy white !important overrides ---------- */
@media(max-width:760px){
  html[data-theme="light"] .branch-detail-body,
  html[data-theme="light"] .branch-detail-row,
  html[data-theme="light"] .info-card:not(.navy):not(.purple){background:var(--v27-surface)!important}
  html[data-theme="dark"] .branch-detail-body,
  html[data-theme="dark"] .branch-detail-row,
  html[data-theme="dark"] .info-card:not(.navy):not(.purple){background:var(--v27-surface)!important}
  html[data-theme="light"] .branch-detail-row{border-color:var(--v27-border)!important}
  html[data-theme="dark"] .branch-detail-row{border-color:var(--v27-border)!important}
  html[data-theme="dark"] .branch-detail-row strong{color:#fff!important}
  html[data-theme="dark"] .branch-detail-row span{color:var(--v27-muted)!important}
  html[data-theme="dark"] .info-card:not(.navy):not(.purple) .info-row{border-bottom-color:var(--v27-border)!important}
  html[data-theme="dark"] .info-card:not(.navy):not(.purple) .info-row .lbl{color:var(--v27-muted)!important}
  html[data-theme="dark"] .info-card:not(.navy):not(.purple) .info-row .val{color:#fff!important}

  /* Keep body copy comfortably legible without re-expanding the compact layout. */
  :is(.section-sub,.prog-desc,.news-excerpt,.mission-card p,.team-general p,.branch-detail-row span,.curriculum-card p,.step-card p,.faq-answer,.facility-body,.privacy-section p,.privacy-section li){font-size:12.5px!important;line-height:1.62!important}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}}

/* ===== v27 final visibility refinements ===== */
html[data-theme="light"] .breadcrumb>span{color:#647583!important}
html[data-theme="dark"] .breadcrumb>span{color:#9aabbb!important}

/* Programme coloured panels must always keep light copy in both themes. */
html[data-theme="light"] body .prog-full-card .prog-full-left>p,
html[data-theme="dark"] body .prog-full-card .prog-full-left>p,
html[data-theme="light"] body .prog-full-card .prog-full-left .secondary-programmes-title,
html[data-theme="dark"] body .prog-full-card .prog-full-left .secondary-programmes-title{
  color:rgba(255,255,255,.93)!important;
}
html[data-theme="light"] body .prog-full-card .prog-full-left :is(h2,.age,.secondary-programme),
html[data-theme="dark"] body .prog-full-card .prog-full-left :is(h2,.age,.secondary-programme){color:#fff!important}

/* Dark homepage controls: explicit backgrounds avoid inherited dark-on-dark text. */
html[data-theme="dark"] .premium-app-card .store-btn.google{
  background:#57dce7!important;
  background-image:linear-gradient(135deg,#72e8ef,#46cbd8)!important;
  border-color:rgba(255,255,255,.18)!important;
}
html[data-theme="dark"] .newsletter-form-panel button{
  background:#57dce7!important;
  background-image:linear-gradient(135deg,#72e8ef,#46cbd8)!important;
  color:#102033!important;
  border-color:rgba(255,255,255,.18)!important;
}

/* Yellow facility header uses dark copy and icon for reliable contrast. */
.facility-header.c-yellow .facility-icon{color:#172333!important}

/* Admission age table: fit on phones instead of forcing a 520px horizontal table. */
@media (max-width: 600px){
  .age-table-wrap{overflow:visible!important;max-width:100%!important}
  table.age-table.home-adm-age-table{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:fixed!important;
  }
  .age-table thead th,.home-adm-age-table thead th{
    padding:9px 5px!important;
    font-size:9px!important;
    line-height:1.25!important;
    letter-spacing:.015em!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .age-table tbody td,.home-adm-age-table tbody td{
    padding:9px 5px!important;
    font-size:10px!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .age-table th:first-child,.age-table td:first-child{width:43%!important}
  .age-table th:nth-child(2),.age-table td:nth-child(2),
  .age-table th:nth-child(3),.age-table td:nth-child(3){width:28.5%!important}
}

/* Decorative app glow stays inside desktop cards; omit it on tablets to avoid visual clipping. */
@media (max-width: 900px){.app-card-glow{display:none!important}}


/* DAK CSS: production-final.css */
/* ======================================================================
   DORAT AL KHALEEJ — PRODUCTION FINAL QA
   Release candidate: unified visual identity + responsive fit
   Canonical device policy:
   - Phone: <= 767px
   - Tablet/iPad: 768–1199px, touch-first
   - Laptop/Desktop/PC: base desktop; compact safeguards for scaled monitors
   This file intentionally loads LAST and replaces all retired hotfix layers.
   ====================================================================== */

/* ---------- Canonical palette ---------- */
:root{
  --pf-bg:#f4f8fa;
  --pf-surface:#ffffff;
  --pf-surface-soft:#edf4f7;
  --pf-surface-raised:#ffffff;
  --pf-text:#142436;
  --pf-heading:#102033;
  --pf-muted:#586a7c;
  --pf-muted-2:#748494;
  --pf-border:#d5e1e7;
  --pf-border-strong:#bfd0d9;
  --pf-teal:#007783;
  --pf-teal-bright:#00bcd4;
  --pf-purple:#684299;
  --pf-gold:#d69a32;
  --pf-navy:#1a2332;
  --pf-shadow:0 12px 32px rgba(16,32,51,.08);
}
html[data-theme="dark"]{
  --pf-bg:#07131f;
  --pf-surface:#0f2030;
  --pf-surface-soft:#15283a;
  --pf-surface-raised:#193047;
  --pf-text:#f5f8fb;
  --pf-heading:#ffffff;
  --pf-muted:#c3cfda;
  --pf-muted-2:#a9b8c6;
  --pf-border:#334b61;
  --pf-border-strong:#47637c;
  --pf-teal:#66e5ef;
  --pf-teal-bright:#66e5ef;
  --pf-purple:#c3a6ef;
  --pf-gold:#ffd66e;
  --pf-shadow:0 12px 34px rgba(0,0,0,.25);
}
html[data-theme="light"]{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
html,body{max-width:100%;background:var(--pf-bg)!important;color:var(--pf-text)!important}
body{overflow-x:hidden!important}
*,*::before,*::after{box-sizing:border-box}
img,svg,video,canvas,iframe{max-width:100%}

/* ---------- Text/contrast baseline ---------- */
:is(.section-title,.home-adm-title,.calendar-brand-title,.privacy-section h2,.fv-form-title){color:var(--pf-heading)!important}
:is(.section-sub,.prog-desc,.news-excerpt,.news-date,.ql-desc,.print-tip,.events-subtitle,.events-footnote,.privacy-section p,.privacy-section li){color:var(--pf-muted)!important}
.section-label{color:var(--pf-teal)!important}
.form-group label,.journey-input-group label,.journey-field label,.fv-label{color:var(--pf-text)!important;font-weight:700}
input::placeholder,textarea::placeholder{color:var(--pf-muted-2)!important;opacity:1}
html[data-theme="dark"] :is(input,select,textarea){color-scheme:dark}

/* ---------- Header/navigation ---------- */
html[data-theme="light"] #navbar{background:rgba(255,255,255,.97)!important;border-bottom-color:var(--pf-border)!important}
html[data-theme="dark"] #navbar{background:rgba(7,19,31,.97)!important;border-bottom-color:var(--pf-border)!important}
#navbar .nav-links a:not(.nav-portal-btn),#navbar .lang-toggle{color:var(--pf-text)!important}
.hamburger{background:var(--pf-surface-soft)!important;border-color:var(--pf-border)!important}
.hamburger span{background:var(--pf-text)!important}
.mobile-menu{background:var(--pf-surface)!important;color:var(--pf-text)!important;border-color:var(--pf-border)!important}
.mobile-menu a,.mobile-menu .lang-toggle{color:var(--pf-text)!important}
.theme-control--mobile,.theme-segment{background:var(--pf-surface-soft)!important;border-color:var(--pf-border)!important}
.theme-segment-option{color:var(--pf-muted)!important}
.theme-segment-option.is-active{background:var(--pf-surface)!important;color:var(--pf-text)!important}

/* ---------- Internal page hero: exact legacy identity, every device/theme ---------- */
.page-hero,
html[data-theme="light"] .page-hero,
html[data-theme="dark"] .page-hero{
  background:#1A2332!important;
  color:#fff!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
}
.page-hero::before{content:''!important;position:absolute!important;top:-80px!important;left:-80px!important;width:420px!important;height:420px!important;border-radius:50%!important;background:radial-gradient(circle,rgba(0,188,212,.11),transparent 70%)!important;opacity:1!important;pointer-events:none!important}
.page-hero::after{content:''!important;position:absolute!important;right:-40px!important;bottom:-60px!important;width:300px!important;height:300px!important;border-radius:50%!important;background:radial-gradient(circle,rgba(107,63,160,.14),transparent 70%)!important;opacity:1!important;pointer-events:none!important}
.page-hero :is(h1,.page-hero-title){color:#fff!important;-webkit-text-fill-color:#fff!important}
.page-hero :is(h1,.page-hero-title) .accent,.page-hero .accent{color:#00BCD4!important;-webkit-text-fill-color:#00BCD4!important}
.page-hero :is(p,.page-hero-sub){color:rgba(255,255,255,.66)!important;-webkit-text-fill-color:rgba(255,255,255,.66)!important}
.page-hero-badge{color:#00BCD4!important;background:rgba(0,188,212,.10)!important;border-color:rgba(0,188,212,.28)!important}
.page-hero .breadcrumb a{color:rgba(255,255,255,.48)!important}
.page-hero .breadcrumb>span{color:rgba(255,255,255,.30)!important}
.page-hero .breadcrumb strong{color:rgba(255,255,255,.82)!important}

/* Special branded heroes always keep their intended dark identity. */
.pa-hero,.branch-hero,.fv-hero{color:#fff!important}
.pa-hero :is(h1,h2),.branch-hero h1,.fv-hero h1{color:#fff!important;-webkit-text-fill-color:#fff!important}
.pa-hero-copy>p,.branch-hero p,.fv-hero p{color:rgba(255,255,255,.82)!important}

/* ---------- Canonical generic surfaces ---------- */
html[data-theme="light"] :is(
  .team-general,.branch-detail,.branch-detail-body,.home-adm-panel,.home-adm-side-block,.home-adm-card,
  .contact-form-card,.office-hours-card,.map-card,.facility-card,.facility-body,.bus-card,.step-card,.dress-card,
  .faq-item,.privacy-section,.info-card:not(.navy):not(.purple),.prog-full-card,.prog-full-right,.subject-item,
  .calendar-board,.month-card,.key-card:not(.dark),.pa-route-box,.pa-workspace,.pa-result-card,.fv-form,.fv-result,
  .prog-card,.why-card,.news-card,.journey-form-panel,.ql-card,.newsletter-form-panel,.path-tool-card,.events-calendar,.event-item
){background:var(--pf-surface)!important;color:var(--pf-text)!important;border-color:var(--pf-border)!important}
html[data-theme="dark"] :is(
  .team-general,.branch-detail,.branch-detail-body,.home-adm-panel,.home-adm-side-block,.home-adm-card,
  .contact-form-card,.office-hours-card,.map-card,.facility-card,.facility-body,.bus-card,.step-card,.dress-card,
  .faq-item,.privacy-section,.info-card:not(.navy):not(.purple),.prog-full-card,.prog-full-right,.subject-item,
  .calendar-board,.month-card,.key-card:not(.dark),.pa-route-box,.pa-workspace,.pa-result-card,.fv-form,.fv-result,
  .prog-card,.why-card,.news-card,.journey-form-panel,.ql-card,.newsletter-form-panel,.path-tool-card,.events-calendar,.event-item
){background:var(--pf-surface)!important;color:var(--pf-text)!important;border-color:var(--pf-border)!important}

/* ---------- Branded cards: SAME identity in Light & Dark ---------- */
.branch-card.teal{background:linear-gradient(135deg,#075c66 0%,#0b8792 48%,#12bfd0 100%)!important;color:#fff!important}
.branch-card.purple{background:linear-gradient(135deg,#2b1d54 0%,#5f36a1 55%,#7b4dc1 100%)!important;color:#fff!important}
.branch-card :is(.branch-name,.branch-eyebrow,.branch-quote,.branch-link){color:#fff!important;-webkit-text-fill-color:#fff!important}
.branch-card .branch-name span{color:#FDD835!important;-webkit-text-fill-color:#FDD835!important}
.branch-card .branch-tags .tag{color:#fff!important;background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.28)!important}
.branch-card .branch-link{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:max-content!important;max-width:100%!important;min-height:46px!important;padding:13px 22px!important;border-radius:12px!important;background:rgba(10,29,47,.90)!important;border:1px solid rgba(255,255,255,.20)!important;box-shadow:0 12px 26px rgba(0,0,0,.18)!important;text-decoration:none!important}

/* About foundation cards return to their original coloured identity in both themes. */
html[data-theme="light"] body .mission-grid .mission-card.vision,
html[data-theme="dark"] body .mission-grid .mission-card.vision{background:linear-gradient(145deg,#007b86 0%,#0797a4 100%)!important;background-color:#007b86!important;color:#fff!important;border-color:rgba(255,255,255,.14)!important}
html[data-theme="light"] body .mission-grid .mission-card.mission,
html[data-theme="dark"] body .mission-grid .mission-card.mission{background:linear-gradient(145deg,#543083 0%,#7045a5 100%)!important;background-color:#543083!important;color:#fff!important;border-color:rgba(255,255,255,.14)!important}
html[data-theme="light"] body .mission-grid .mission-card.values,
html[data-theme="dark"] body .mission-grid .mission-card.values{background:linear-gradient(145deg,#12263a 0%,#1b344c 100%)!important;background-color:#12263a!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important}
html[data-theme] body .mission-grid .mission-card :is(h3,.value-title){color:#fff!important;-webkit-text-fill-color:#fff!important;background:transparent!important;background-image:none!important;text-shadow:none!important;opacity:1!important;visibility:visible!important}
html[data-theme] body .mission-grid .mission-card>p{color:rgba(255,255,255,.86)!important;-webkit-text-fill-color:rgba(255,255,255,.86)!important;background:transparent!important;background-image:none!important;opacity:1!important;visibility:visible!important}
html[data-theme] body .mission-grid .mission-card .value-desc{color:rgba(255,255,255,.74)!important;-webkit-text-fill-color:rgba(255,255,255,.74)!important;background:transparent!important;background-image:none!important;opacity:1!important;visibility:visible!important}
html[data-theme] body .mission-grid .mission-card .value-item{background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important;color:#fff!important}

/* Coloured campus detail headers. */
.branch-detail-header h3,.branch-detail-header p{color:#fff!important;-webkit-text-fill-color:#fff!important}
.branch-detail-header.teal::before{background:linear-gradient(135deg,#073744 0%,#0097a7 100%)!important}
.branch-detail-header.purple::before{background:linear-gradient(135deg,#241943 0%,#6b3fa0 100%)!important}
.branch-detail-body{background:var(--pf-surface)!important}
.branch-detail-row{background:var(--pf-surface-soft)!important;border-color:var(--pf-border)!important}
.branch-detail-row strong{color:var(--pf-heading)!important}
.branch-detail-row span{color:var(--pf-muted)!important}

/* Premium dark homepage panels stay dark in both themes. */
.premium-apps-section{background:linear-gradient(135deg,#0d2133 0%,#10283c 55%,#242242 100%)!important;color:#fff!important}
.premium-apps-section .section-title{color:#fff!important}
.premium-apps-section .section-sub{color:rgba(255,255,255,.72)!important}
html[data-theme="light"] body .premium-apps-section .app-card.premium-app-card,
html[data-theme="dark"] body .premium-apps-section .app-card.premium-app-card{background:linear-gradient(145deg,rgba(255,255,255,.125),rgba(255,255,255,.055))!important;background-color:transparent!important;border-color:rgba(255,255,255,.14)!important;color:#fff!important}
html[data-theme] body .premium-apps-section .app-card.premium-app-card :is(.app-name){color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-theme] body .premium-apps-section .app-card.premium-app-card .app-desc{color:rgba(255,255,255,.74)!important;-webkit-text-fill-color:rgba(255,255,255,.74)!important}
html[data-theme] body .premium-apps-section .app-card.premium-app-card .app-feature-row span{color:rgba(255,255,255,.80)!important;-webkit-text-fill-color:rgba(255,255,255,.80)!important;background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.10)!important}
html[data-theme] body .premium-apps-section .app-card.premium-app-card .store-btn.google :is(.store-icon,.store-text span,.store-text strong){color:#102033!important;-webkit-text-fill-color:#102033!important}

.day-panel,.journey-story-panel{background:linear-gradient(135deg,#132131,#1a2e44 58%,#241e45)!important;color:#fff!important}
.day-panel-title,.journey-story-panel h3{color:#fff!important;-webkit-text-fill-color:#fff!important}
.day-panel-text,.journey-story-panel p{color:rgba(255,255,255,.74)!important;-webkit-text-fill-color:rgba(255,255,255,.74)!important}

/* Events header is permanently dark. */
.events-hero,.events-calendar-hero,.events-header,.events-intro{color:#fff}
.events-hero :is(h1,h2,h3),.events-calendar-hero :is(h1,h2,h3),.events-header :is(h1,h2,h3),.events-intro :is(h1,h2,h3){color:#fff!important;-webkit-text-fill-color:#fff!important}
.events-hero p,.events-calendar-hero p,.events-header p,.events-intro p{color:rgba(255,255,255,.72)!important}

/* Contact coloured campus cards remain branded. */
body.contact-page .contact-info .info-card.navy{background:linear-gradient(135deg,#16293c,#203a52)!important;color:#fff!important}
body.contact-page .contact-info .info-card.purple{background:linear-gradient(135deg,#4b2a78,#64399a)!important;color:#fff!important}
body.contact-page .contact-info .info-card.navy :is(h4,.info-row span,.info-row a),
body.contact-page .contact-info .info-card.purple :is(h4,.info-row span,.info-row a){color:#fff!important}
body.contact-page .contact-info .info-card.navy .info-row strong,
body.contact-page .contact-info .info-card.purple .info-row strong{color:rgba(255,255,255,.72)!important}
body.contact-page .contact-info .info-card.navy .info-row a{color:#69e7ef!important}
body.contact-page .contact-info .info-card.purple .info-row a{color:#ffe27c!important}

/* School Office: no invisible copy, no empty fixed-height shell. */
body.contact-page .office-hours-card{height:auto!important;min-height:0!important;overflow:hidden!important;align-self:start!important}
body.contact-page .office-hours-card :is(.hours-card-head,.hours-list,.hours-row-item,.hours-row-item>div){opacity:1!important;visibility:visible!important}
html[data-theme="light"] body.contact-page .office-hours-card{background:#fff!important;color:#142436!important;border-color:#d5e1e7!important;box-shadow:0 14px 36px rgba(16,32,51,.08)!important}
html[data-theme="dark"] body.contact-page .office-hours-card{background:#0f2030!important;color:#f5f8fb!important;border-color:#334b61!important;box-shadow:0 14px 36px rgba(0,0,0,.24)!important}
body.contact-page .office-hours-card :is(h3,h4,.hours-row-item strong){color:var(--pf-heading)!important;-webkit-text-fill-color:var(--pf-heading)!important}
body.contact-page .office-hours-card :is(p,.hours-row-item small){color:var(--pf-muted)!important;-webkit-text-fill-color:var(--pf-muted)!important}
body.contact-page .office-hours-card .hours-row-item{background:transparent!important;border-color:var(--pf-border)!important}
html[data-theme="light"] body.contact-page .office-hours-card .hours-row-item>span{color:#00606b!important;background:#e4f6f7!important;border-color:#acdfe3!important}
html[data-theme="dark"] body.contact-page .office-hours-card .hours-row-item>span{color:#b9f7fb!important;background:#123640!important;border-color:#2e6670!important}
html[data-theme="light"] body.contact-page .office-hours-card .hours-row-item.closed>span{color:#8a6200!important;background:#fff5cf!important;border-color:#efd990!important}
html[data-theme="dark"] body.contact-page .office-hours-card .hours-row-item.closed>span{color:#ffdd7c!important;background:#3d321a!important;border-color:#6a5625!important}

/* ---------- Forms ---------- */
:is(input,select,textarea,.journey-input-group input,.journey-input-group select,.fv-input,.fv-select){background:var(--pf-surface)!important;color:var(--pf-text)!important;border-color:var(--pf-border-strong)!important}
html[data-theme="dark"] select option{background:#0e1d2b!important;color:#f5f8fb!important}
.newsletter-form input[type="email"],.nl-form input[type="email"]{display:block!important;visibility:visible!important;opacity:1!important;position:static!important;clip:auto!important;transform:none!important}

/* ---------- Programmes/facilities coloured panels ---------- */
.prog-full-left.c1{background:#007a86!important}.prog-full-left.c2{background:#5a3588!important}.prog-full-left.c3{background:#a95f00!important}.prog-full-left.c4{background:#14263a!important}
.prog-full-left :is(h2,p,.age,.secondary-programmes-title,.secondary-programme){color:#fff!important;-webkit-text-fill-color:#fff!important}
.prog-full-left p{color:rgba(255,255,255,.88)!important}
.facility-header.c-teal{background:#007a86!important}.facility-header.c-purple{background:#5a3588!important}.facility-header.c-orange{background:#a95f00!important}.facility-header.c-yellow{background:#f1c232!important}
.facility-header.c-teal :is(h3,p),.facility-header.c-purple :is(h3,p),.facility-header.c-orange :is(h3,p){color:#fff!important}
.facility-header.c-yellow :is(h3,p){color:#172333!important}
.official-logo-plate,.credential-logo-frame,.ministry-card-logo,.edexcel-card-logo,.edexcel-logo-wrap img,.home-edexcel-left img{background:#fff!important}

/* ---------- Calendar ---------- */
.calendar-view-switch{background:var(--pf-surface-soft)!important;border-color:var(--pf-border)!important;box-shadow:none!important}
.calendar-view-tab{color:var(--pf-muted)!important}
.calendar-view-tab[aria-selected="true"]{background:var(--pf-surface)!important;color:var(--pf-heading)!important;border-color:var(--pf-border)!important;box-shadow:none!important}
.calendar-brand-title,.key-card:not(.dark) h3{color:var(--pf-heading)!important}
.month-card,.calendar-board,.key-card:not(.dark){background:var(--pf-surface)!important;border-color:var(--pf-border)!important}
.mini-cal th,.summary-table th{background:var(--pf-surface-soft)!important;color:var(--pf-heading)!important}
.mini-cal td,.summary-table td{background:var(--pf-surface)!important;color:var(--pf-text)!important;border-color:var(--pf-border)!important}
.mini-cal td.muted{background:var(--pf-surface-soft)!important;color:var(--pf-muted-2)!important}
.month-note{background:var(--pf-surface-soft)!important;color:var(--pf-muted)!important;border-color:var(--pf-border)!important}
.calendar-official-logo{display:flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important}
.calendar-official-logo img{width:clamp(150px,15vw,230px)!important;height:auto!important;object-fit:contain!important}
html[data-theme="light"] .calendar-logo-light{display:block!important} html[data-theme="light"] .calendar-logo-dark{display:none!important}
html[data-theme="dark"] .calendar-logo-light{display:none!important} html[data-theme="dark"] .calendar-logo-dark{display:block!important}

/* ---------- Assistant / WhatsApp / footer ---------- */
.footer{background:#0f1f31!important;color:#fff!important}
.footer :is(.footer-brand-name,.footer-col h4){color:#fff!important}
.footer :is(.footer-desc,.footer-contact,.footer-col li,.footer-bottom,.footer-bottom-links a){color:rgba(255,255,255,.80)!important}
.footer a{color:#dceff3!important}.footer-contact a{color:#77e7ef!important}
html[data-theme="light"] .dak-ai-chat{background:rgba(255,255,255,.98)!important;color:var(--pf-text)!important;border-color:var(--pf-border)!important}
html[data-theme="dark"] .dak-ai-chat{background:#0f2030!important;color:var(--pf-text)!important;border-color:var(--pf-border)!important}
html[data-theme="light"] .wa-menu{background:#fff!important;color:#24323d!important}
html[data-theme="dark"] .wa-menu{background:#102233!important;color:#f5f8fb!important;border-color:var(--pf-border)!important}

/* ---------- Equal-height / exact box rhythm ---------- */
:is(.branches-grid,.apps-showcase,.mission-grid,.branch-detail-grid,.programmes-grid,.news-grid,.why-cards,.ql-grid,.facilities-grid,.activities-grid,.bus-grid,.maps-grid,.info-grid,.steps-grid,.dress-grid,.curriculum-grid,.subject-grid){align-items:stretch!important}
:is(.branches-grid,.apps-showcase,.branch-detail-grid,.programmes-grid,.news-grid,.why-cards,.ql-grid,.facilities-grid,.activities-grid,.bus-grid,.maps-grid,.info-grid,.steps-grid,.dress-grid,.curriculum-grid,.subject-grid)>*{height:100%}
.branch-card,.premium-app-card,.branch-detail,.prog-card,.news-card,.why-card,.ql-card,.facility-card,.bus-card,.map-card,.info-card,.step-card,.dress-card,.curriculum-card,.subject-item{display:flex;flex-direction:column;min-width:0}
.branch-detail-body,.facility-body{flex:1}
.premium-app-card .app-btns,.branch-card .branch-link{margin-top:auto}

/* Avoid content forcing unequal/overflowing boxes. */
:where(.container,.hero,.hero-left,.hero-right,.branch-card,.prog-card,.news-card,.why-card,.ql-card,.mission-card,.branch-detail,.contact-grid,.contact-info,.contact-form-card,.office-hours-card,.calendar-shell,.calendar-board,.key-panel,.footer-grid,.footer-col,.journey-premium-card,.journey-story-panel,.journey-form-panel){min-width:0}
:where(h1,h2,h3,h4,h5,h6,p,a,button,span,strong,small,label,li,td,th){overflow-wrap:break-word;word-break:normal}

/* ---------- Responsive tables: never move the entire page ---------- */
.responsive-table-shell,.home-adm-table-wrap{width:100%;max-width:100%;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
.responsive-table-shell>table{margin-inline:0!important}

/* ---------- Mobile/tablet menu behaves like a modal drawer ---------- */
@media (max-width:1199px){
  body.dak-menu-open{width:100%!important;overflow:hidden!important;overscroll-behavior:none!important}
  .mobile-menu-backdrop{position:fixed;inset:0;z-index:8997;display:none;background:rgba(8,20,34,.42);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
  .mobile-menu-backdrop.is-open{display:block}
  html[data-theme="dark"] .mobile-menu-backdrop{background:rgba(0,0,0,.58)}
  #hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  #hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(.5)}
  #hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
  #hamburger span{transform-origin:center}
  .mobile-menu{z-index:8999!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important}
}

/* ---------- PHONE: same order/identity as laptop, mobile fit only ---------- */
@media (max-width:767px){
  :root{--m-bg:var(--pf-bg);--m-surface:var(--pf-surface);--m-surface-2:var(--pf-surface-soft);--m-text:var(--pf-text);--m-muted:var(--pf-muted);--m-line:var(--pf-border);--m-line-strong:var(--pf-border-strong);--m-teal:var(--pf-teal);--m-purple:var(--pf-purple);--m-gold:var(--pf-gold)}
  body{background:var(--pf-bg)!important;color:var(--pf-text)!important}
  .section,.section-gray{padding-block:46px!important}
  .section-title{font-size:clamp(25px,7.4vw,31px)!important;line-height:1.13!important}
  .section-sub{font-size:14px!important;line-height:1.65!important;margin-bottom:28px!important}
  .page-hero{padding:0!important}
  .page-hero-inner{padding-top:42px!important;padding-bottom:42px!important}
  .page-hero h1{font-size:clamp(31px,9vw,40px)!important}
  .page-hero p{font-size:14px!important;line-height:1.65!important}

  /* Preserve DOM/laptop order; only stack. */
  .hero,.day-showcase,.journey-premium-card,.contact-grid,.home-adm-grid,.fv-wrap{grid-template-columns:1fr!important}
  .hero-left,.hero-right,.day-picture,.day-panel,.journey-story-panel,.journey-form-panel{order:initial!important}

  /* Equal boxes for any side-by-side mobile grids. */
  :is(.why-cards,.ql-grid,.day-insight-grid,.journey-accuracy-summary,.values-grid,.subject-grid,.steps-grid,.dress-grid){grid-auto-rows:1fr!important;align-items:stretch!important}
  :is(.why-cards,.ql-grid,.day-insight-grid,.journey-accuracy-summary,.values-grid,.subject-grid,.steps-grid,.dress-grid)>*{height:100%!important}

  .mission-card{padding:18px!important}
  .mission-card.values .values-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .mission-card.values .value-item{padding:0!important;min-height:0!important}

  .branch-card{min-height:0!important;padding:24px 20px!important}
  .branch-card .branch-tags{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .branch-card .branch-tags .tag{width:100%!important;min-height:34px!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;white-space:normal!important}

  .mobile-menu{top:var(--m-nav-h,64px)!important;left:10px!important;right:10px!important;width:auto!important;max-height:calc(100dvh - var(--m-nav-h,64px) - 20px)!important;border:1px solid var(--pf-border)!important;border-radius:0 0 18px 18px!important;box-shadow:0 20px 46px rgba(15,38,61,.20)!important}

  /* A Day at DAK mobile journey, keeping same semantic order. */
  .day-at-dak{overflow:visible!important}
  .day-picture{display:none!important}
  .day-panel{padding:18px 16px!important;border-radius:20px!important}
  .day-panel-title{font-size:20px!important;line-height:1.25!important}
  .day-panel-text{font-size:13px!important;line-height:1.62!important;margin-bottom:18px!important}
  .day-steps-list.compact{position:relative!important;display:flex!important;flex-direction:column!important;gap:10px!important;padding:2px 0 2px 22px!important;overflow:visible!important;max-height:none!important}
  .day-steps-list.compact::before{content:'';position:absolute;left:17px;top:16px;bottom:16px;width:2px;border-radius:999px;background:linear-gradient(180deg,#00bcd4 0%,#f5a623 52%,#8b5ed7 100%);opacity:.62}
  .day-step-btn{position:relative!important;width:100%!important;min-height:0!important;padding:12px 12px 12px 18px!important;display:grid!important;grid-template-columns:40px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;border-radius:14px!important;background:var(--pf-surface)!important;border:1px solid var(--pf-border)!important;box-shadow:0 5px 16px rgba(15,38,61,.04)!important;text-align:start!important}
  .day-step-btn::before{content:'';position:absolute;left:-10px;top:50%;width:10px;height:10px;border-radius:50%;transform:translateY(-50%);background:var(--pf-surface)!important;border:2px solid var(--pf-teal)!important;box-shadow:0 0 0 4px var(--pf-bg)!important}
  .day-step-btn i{width:40px!important;height:40px!important;display:grid!important;place-items:center!important;border-radius:12px!important;background:var(--pf-surface-soft)!important;font-size:21px!important;font-style:normal!important}
  .day-step-btn strong{color:var(--pf-text)!important;font-size:13px!important}.day-step-btn span span{color:var(--pf-muted)!important;font-size:10.5px!important}
  html[dir="rtl"] .day-steps-list.compact{padding:2px 22px 2px 0!important}html[dir="rtl"] .day-steps-list.compact::before{right:17px;left:auto}html[dir="rtl"] .day-step-btn{padding:12px 18px 12px 12px!important}html[dir="rtl"] .day-step-btn::before{right:-10px;left:auto}


  /* Paired cards stay identical in height even when copy length differs. */
  .branches-grid,.apps-showcase{grid-auto-rows:1fr!important}
  .branches-grid>.branch-card,.apps-showcase>.premium-app-card{height:100%!important}

  /* Keep the same child-journey order/content as laptop, but compact it for phones. */
  .journey-story-panel{display:flex!important;flex-direction:column!important;align-items:stretch!important;min-height:0!important;padding:22px!important;gap:14px!important}
  .journey-story-panel h3{font-size:24px!important;line-height:1.12!important;margin:0!important}
  .journey-story-panel p{font-size:13px!important;line-height:1.58!important;margin:0!important}
  .journey-story-top{margin-bottom:2px!important}
  .journey-story-badge{font-size:9.5px!important;padding:7px 10px!important}
  .journey-story-icon{width:42px!important;height:42px!important;font-size:18px!important}
  .glowing-journey-path{display:none!important}
  .journey-path-pills{margin-top:2px!important;gap:6px!important}
  .journey-path-pills span{font-size:10px!important;padding:6px 9px!important}

  /* School office actions/email remain visible. */
  .home-office-status .office-status-card.compact{grid-template-columns:1fr!important}
  .home-office-status .office-status-actions{display:flex!important;grid-column:1!important;grid-row:auto!important;width:100%!important;flex-wrap:wrap!important;gap:6px!important;margin-top:2px!important}
  .home-office-status .office-status-action{display:inline-flex!important;flex:1 1 0!important;align-items:center!important;justify-content:center!important;min-height:34px!important;font-size:10px!important}

  /* Tables stay readable and scroll only locally. */
  .age-table,.home-adm-age-table{min-width:540px!important;width:max-content!important;max-width:none!important;font-size:11px!important}
  .summary-table{min-width:470px!important;width:max-content!important;max-width:none!important;font-size:10px!important}
  .mini-cal{width:100%!important;table-layout:fixed!important}

  /* Reduce GPU-heavy decoration on phones without changing appearance. */
  .app-card-glow,.premium-apps-section::before,.premium-apps-section::after{animation:none!important}
  .premium-app-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .branch-card:hover,.premium-app-card:hover,.news-card:hover,.why-card:hover,.ql-card:hover{transform:none!important}
}

/* ---------- TABLET/iPAD: laptop identity, tablet proportions ---------- */
@media (min-width:768px) and (max-width:1199px){
  html,body{max-width:100%;overflow-x:hidden}
  .container,.page-hero-inner,.branch-hero-inner,.pa-hero-grid,.fv-hero-content{width:min(100% - 44px,1080px)!important;max-width:1080px!important;margin-inline:auto!important}
  .section,.section-gray{padding-block:54px!important}
  .section-title{font-size:clamp(30px,4.1vw,42px)!important;line-height:1.12!important;margin-bottom:12px!important}
  .section-sub{font-size:clamp(14.5px,1.7vw,16.5px)!important;line-height:1.66!important;margin-bottom:36px!important}
  .page-hero-inner,.branch-hero-inner{padding-block:50px!important}
  .page-hero h1,.branch-hero h1,.pa-hero h1,.fv-hero h1,.page-hero-title{font-size:clamp(38px,5vw,52px)!important;line-height:1.07!important}
  .page-hero p,.branch-hero p,.pa-hero p,.fv-hero p,.page-hero-sub{font-size:15.5px!important;line-height:1.68!important;max-width:720px!important}

  /* Tablet navigation: same identity, touch-safe menu. */
  #navbar{height:78px!important;padding:0 22px!important}
  #navbar .logo img{height:58px!important;max-width:min(220px,31vw)!important}
  .nav-links>a{display:none!important}
  .nav-links .theme-control--desktop,.nav-links>.lang-toggle{display:inline-flex!important}
  .hamburger{display:flex!important;min-width:44px!important;min-height:44px!important}
  .mobile-menu{top:78px!important;right:20px!important;left:auto!important;width:min(440px,calc(100vw - 40px))!important;max-height:calc(100dvh - 98px)!important;padding:14px!important;border-radius:0 0 18px 18px!important}
  html[dir="rtl"] .mobile-menu{right:auto!important;left:20px!important}
  .mobile-menu .theme-control--mobile,.mobile-menu>.lang-toggle{display:none!important}

  /* Core layout mirrors laptop order, only adapts columns. */
  .hero{grid-template-columns:1fr!important;min-height:0!important;height:auto!important}
  .hero-left{padding:50px 38px 38px!important;min-height:0!important}.hero-right{height:320px!important;min-height:320px!important}
  .hero-title{font-size:clamp(40px,5.7vw,58px)!important}.hero-desc{font-size:16px!important;line-height:1.7!important}
  .hero-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}

  :is(.branches-grid,.programmes-grid,.news-grid,.why-cards,.ql-grid,.mission-grid,.branch-detail-grid,.facilities-grid,.activities-grid,.bus-grid,.maps-grid,.info-grid,.steps-grid,.dress-grid,.curriculum-grid,.subject-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important;align-items:stretch!important}
  :is(.branches-grid,.programmes-grid,.news-grid,.why-cards,.ql-grid,.mission-grid,.branch-detail-grid,.facilities-grid,.activities-grid,.bus-grid,.maps-grid,.info-grid,.steps-grid,.dress-grid,.curriculum-grid,.subject-grid)>*{height:100%!important}
  .mission-card.values{grid-column:1 / -1!important}.mission-card.values .values-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .branch-card,.prog-card,.news-card,.why-card,.ql-card,.mission-card,.branch-detail,.facility-card,.bus-card,.map-card,.info-card,.step-card,.dress-card,.curriculum-card,.subject-item{min-height:0!important;height:100%!important}

  /* Branch programme bubbles: equal, never clipped. */
  .branches-section .branch-tags-single-line{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%!important}
  .branches-section .branch-tags-single-line .tag{width:100%!important;min-height:36px!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:7px 9px!important;text-align:center!important;white-space:normal!important}

  .day-showcase{grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr)!important;gap:22px!important;align-items:stretch!important}.day-picture,.day-panel{height:auto!important;min-width:0!important}
  .journey-premium-card{grid-template-columns:1fr!important}.journey-story-panel,.journey-form-panel{min-height:0!important;padding:30px!important}
  .journey-premium-inputs,.journey-inputs{grid-template-columns:repeat(2,minmax(0,1fr))!important}.journey-premium-inputs .wide,.journey-premium-btn,.journey-input-group:first-child{grid-column:1/-1!important}
  .home-adm-grid{grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr)!important;gap:20px!important;align-items:start!important}
  .contact-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;gap:22px!important;align-items:start!important}.form-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .month-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
  .age-table,.home-adm-age-table{min-width:650px!important;width:max-content!important;max-width:none!important}.summary-table{min-width:520px!important;width:max-content!important;max-width:none!important}

  /* Tablet visual performance. */
  .app-card-glow{animation:none!important}.premium-app-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}

@media (min-width:768px) and (max-width:899px){
  .container,.page-hero-inner,.branch-hero-inner,.pa-hero-grid,.fv-hero-content{width:min(100% - 36px,840px)!important}
  .home-adm-grid,.contact-grid,.fv-wrap,.day-showcase{grid-template-columns:1fr!important}
  .mission-card.values .values-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.footer-brand{grid-column:1/-1!important}
}

@media (min-width:900px) and (max-width:1199px){
  .hero{grid-template-columns:minmax(0,1.04fr) minmax(340px,.96fr)!important;align-items:stretch!important}
  .hero-right{height:auto!important;min-height:500px!important}.hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* ---------- LAPTOP / PC / EXTERNAL MONITOR safeguards ---------- */
@media (min-width:900px) and (hover:hover) and (pointer:fine){
  /* Use laptop-like section geometry even if Windows scaling reduces CSS width. */
  .branches-grid,.branch-detail-grid,.apps-showcase{align-items:stretch!important}
  .branch-card,.branch-detail,.premium-app-card{height:100%!important}
}

@media (min-width:1200px){
  :where(.branches-grid,.programmes-grid,.why-showcase,.why-cards,.news-grid,.day-showcase,.contact-grid,.calendar-shell,.home-adm-grid,.footer-grid)>*{min-width:0!important}
  .branch-tags .tag,.nav-links a,.btn{white-space:normal}
}

@media (min-width:1200px) and (max-width:1450px){
  #navbar{padding-inline:28px!important}
  #navbar .logo img{max-width:218px!important;height:auto!important;max-height:68px!important}
  .nav-links{gap:1px!important;min-width:0!important}
  .nav-links a{padding-inline:8px!important;font-size:12px!important}
  .nav-links .lang-toggle{padding-inline:8px!important}
  .branch-tags-single-line{display:flex!important;flex-wrap:wrap!important}.branch-tags-single-line .tag{width:auto!important;min-width:0!important;white-space:normal!important}
}

/* Scaled laptop/monitor: keep desktop visual rhythm without collisions. */
@media (min-width:900px) and (max-width:1199px) and (hover:hover) and (pointer:fine){
  #navbar{padding-inline:16px!important}
  #navbar .logo img{max-width:180px!important;height:auto!important;max-height:58px!important}
  /* Keep the menu drawer at this width instead of crushing the full desktop nav. */
  .nav-links>a{display:none!important}.hamburger{display:flex!important}
  .section,.section-gray{padding-block:58px!important}
  .branches-grid,.branch-detail-grid,.apps-showcase,.mission-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}


/* ---------- Journey accuracy ---------- */
.journey-premium-inputs select,.journey-premium-inputs input[type="date"]{width:100%;min-height:68px;border:1px solid var(--pf-border-strong)!important;border-radius:18px;background:var(--pf-surface)!important;color:var(--pf-text)!important;padding:0 18px;font:inherit;font-size:16px;outline:none;box-sizing:border-box}
.journey-premium-inputs select:focus,.journey-premium-inputs input[type="date"]:focus{border-color:var(--pf-teal)!important;box-shadow:0 0 0 3px rgba(0,167,188,.12)}
.journey-accuracy-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:8px 0 28px}
.journey-accuracy-item{padding:16px 18px;border:1px solid var(--pf-border)!important;border-radius:18px;background:var(--pf-surface)!important;min-width:0}
.journey-accuracy-item small{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--pf-muted)!important;margin-bottom:7px;font-weight:800}
.journey-accuracy-item strong{display:block;color:var(--pf-heading)!important;font-size:18px;line-height:1.3;overflow-wrap:anywhere}
.journey-accuracy-item.is-warning{background:#fff8e8!important;border-color:#efd28a!important}
.journey-accuracy-item.is-ok{background:#effaf5!important;border-color:#a7dec7!important}
html[data-theme="dark"] .journey-accuracy-item.is-warning{background:#3a3020!important;border-color:#8a6a2c!important}
html[data-theme="dark"] .journey-accuracy-item.is-ok{background:#17362d!important;border-color:#2f775f!important}
@media(max-width:767px){.journey-accuracy-summary{grid-template-columns:1fr 1fr}.journey-accuracy-item{padding:13px}.journey-accuracy-item strong{font-size:15px}.journey-premium-inputs select,.journey-premium-inputs input[type="date"]{min-height:54px;font-size:16px}}
@media(min-width:768px) and (max-width:1199px){.journey-accuracy-summary{grid-template-columns:1fr 1fr}}

/* ---------- Motion/performance ---------- */
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}}
body.is-scrolling :is(.premium-apps-section::before,.premium-apps-section::after,.app-card-glow,.day-panel::before,.journey-story-glow){animation-play-state:paused!important}

/* ======================================================================
   PHONE-ONLY CORRECTIONS — 2026-09-22
   Desktop/laptop (>=768px) intentionally untouched.
   ====================================================================== */
@media (max-width:767px){
  /* Programmes: centre every subject/support card and keep long labels fitted. */
  .prog-full-right .subject-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    align-items:stretch!important;
  }
  .prog-full-right .subject-item{
    min-width:0!important;
    min-height:132px!important;
    height:auto!important;
    padding:12px 8px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    text-align:center!important;
    font-size:clamp(13px,3.55vw,15.5px)!important;
    line-height:1.28!important;
    font-weight:600!important;
    overflow:hidden!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
    hyphens:none!important;
  }
  .prog-full-right .subject-item>span:first-child{
    display:block!important;
    flex:0 0 auto!important;
    margin:0!important;
    font-size:20px!important;
    line-height:1!important;
    text-align:center!important;
  }
  .prog-full-right .subject-item>span:last-child{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    text-align:center!important;
  }

  /* Calendar: replace the cramped desktop-like header with a clean phone stack. */
  .calendar-board{
    padding:15px!important;
  }
  .calendar-topline{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:12px!important;
    margin-bottom:16px!important;
    padding:4px 0 16px!important;
    text-align:center!important;
  }
  html[dir="rtl"] .calendar-topline{flex-direction:column!important}
  .calendar-brand{
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    text-align:center!important;
  }
  .calendar-official-logo{
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .calendar-brand img{
    width:auto!important;
    max-width:min(82%,280px)!important;
    height:auto!important;
    max-height:60px!important;
    object-fit:contain!important;
    margin:0 auto!important;
  }
  .calendar-brand-copy{
    width:100%!important;
    min-width:0!important;
    text-align:center!important;
  }
  .calendar-brand-title{
    margin:0!important;
    font-size:clamp(24px,7.2vw,30px)!important;
    line-height:1.08!important;
    text-align:center!important;
  }
  .calendar-brand-copy .section-label{
    display:none!important;
  }
  .calendar-year-pill{
    width:auto!important;
    min-width:142px!important;
    max-width:100%!important;
    padding:10px 18px!important;
    border-radius:13px!important;
    font-size:16px!important;
    line-height:1.2!important;
    text-align:center!important;
    align-self:center!important;
  }
  .calendar-view-switch{
    gap:5px!important;
    padding:5px!important;
  }
  .calendar-view-tab{
    min-width:0!important;
    min-height:46px!important;
    padding:9px 6px!important;
    font-size:11px!important;
    text-align:center!important;
    white-space:normal!important;
  }

  /* Child journey: compact, phone-native form controls. */
  .journey-form-panel{
    padding:20px 18px 22px!important;
  }
  .journey-form-panel .journey-form-head{
    grid-template-columns:46px minmax(0,1fr)!important;
    gap:12px!important;
    align-items:center!important;
    padding:0 0 16px!important;
    margin:0 0 18px!important;
  }
  .journey-form-panel .journey-form-icon{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    border-radius:14px!important;
    font-size:19px!important;
  }
  .journey-form-panel .journey-form-head strong{
    font-size:clamp(21px,6.4vw,26px)!important;
    line-height:1.08!important;
    margin:0 0 4px!important;
  }
  .journey-form-panel .journey-form-head small{
    font-size:12px!important;
    line-height:1.4!important;
  }
  .journey-premium-inputs{
    gap:12px!important;
  }
  .journey-input-group label{
    font-size:11px!important;
    line-height:1.25!important;
    margin-bottom:4px!important;
  }
  .journey-premium-inputs input,
  .journey-premium-inputs select,
  .journey-premium-inputs input[type="date"]{
    width:100%!important;
    min-width:0!important;
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
    padding:0 13px!important;
    border-radius:13px!important;
    font-size:16px!important;
    line-height:52px!important;
    box-sizing:border-box!important;
  }
  .journey-premium-inputs input[type="date"]{
    -webkit-appearance:auto!important;
    appearance:auto!important;
  }
  .journey-premium-btn{
    min-height:52px!important;
    height:auto!important;
    margin-top:2px!important;
    padding:12px 14px!important;
    border-radius:14px!important;
    font-size:13px!important;
  }
  .journey-note{
    display:none!important;
  }

  /* Newsletter/email: explicitly keep the email signup visible on phones. */
  .newsletter{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    padding:0 var(--m-gutter) 32px!important;
  }
  .newsletter-card,
  .newsletter-copy,
  .newsletter-form-panel{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  .newsletter-form-panel{
    margin-top:12px!important;
  }
  .nl-form{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
  }
  .nl-form input[type="email"]{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    width:100%!important;
    min-width:0!important;
    height:48px!important;
    min-height:48px!important;
    padding:0 13px!important;
    border-radius:11px!important;
    font-size:16px!important;
    position:static!important;
    transform:none!important;
    clip:auto!important;
  }
  .nl-form button{
    width:100%!important;
    min-height:46px!important;
  }
  .footer-contact,
  .footer-contact a{
    visibility:visible!important;
    opacity:1!important;
  }
}


/* DAK CSS: privacy-v2.css */
/* =========================================================
   DAK Privacy Policy — responsive bilingual polish
   Scoped to body.privacy-page so no other page is affected.
   ========================================================= */

body.privacy-page .section {
  padding-block: clamp(34px, 5vw, 72px) !important;
}

body.privacy-page .privacy-wrap {
  width: min(100%, 1080px) !important;
  max-width: 1080px !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

body.privacy-page .privacy-intro {
  position: relative !important;
  margin: 0 0 22px !important;
  padding: clamp(20px, 3vw, 30px) clamp(20px, 3.6vw, 36px) !important;
  border: 1px solid var(--pf-border, #d8e1e7) !important;
  border-inline-start: 5px solid var(--pf-purple, #684299) !important;
  border-radius: 20px !important;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--pf-purple, #684299) 7%, transparent), transparent 54%),
    var(--pf-surface, #fff) !important;
  box-shadow: 0 12px 32px rgba(20, 37, 55, .06) !important;
  overflow: hidden !important;
}

body.privacy-page .privacy-intro::after {
  content: '' !important;
  position: absolute !important;
  inline-size: 150px !important;
  block-size: 150px !important;
  inset-inline-end: -64px !important;
  inset-block-start: -72px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, color-mix(in srgb, var(--pf-teal, #0799a8) 14%, transparent), transparent 70%) !important;
  pointer-events: none !important;
}

body.privacy-page .privacy-intro p {
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  max-width: 92ch !important;
  color: var(--pf-muted, #667584) !important;
  font-size: clamp(14px, 1.25vw, 16px) !important;
  line-height: 1.78 !important;
  letter-spacing: 0 !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

body.privacy-page .privacy-intro strong {
  color: var(--pf-heading, #172637) !important;
  font-weight: 750 !important;
}

body.privacy-page .privacy-section {
  position: relative !important;
  margin: 0 0 18px !important;
  padding: clamp(22px, 3vw, 32px) !important;
  border: 1px solid var(--pf-border, #d8e1e7) !important;
  border-radius: 20px !important;
  background: var(--pf-surface, #fff) !important;
  color: var(--pf-text, #172637) !important;
  box-shadow: 0 10px 28px rgba(20, 37, 55, .055) !important;
  overflow: hidden !important;
}

body.privacy-page .privacy-section::before {
  content: '' !important;
  position: absolute !important;
  inset-block-start: 0 !important;
  inset-inline-start: 0 !important;
  inline-size: 100% !important;
  block-size: 3px !important;
  background: linear-gradient(90deg, var(--pf-teal, #0799a8), var(--pf-purple, #684299)) !important;
  opacity: .78 !important;
}

body.privacy-page .privacy-section h2 {
  margin: 0 0 16px !important;
  padding: 0 0 13px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--pf-border, #d8e1e7) !important;
  color: var(--pf-heading, #172637) !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(22px, 2.2vw, 28px) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -.015em !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

body.privacy-page .privacy-section h3 {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 20px 0 10px !important;
  padding: 7px 11px !important;
  border: 1px solid color-mix(in srgb, var(--pf-teal, #0799a8) 24%, var(--pf-border, #d8e1e7)) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--pf-teal, #0799a8) 7%, var(--pf-surface-soft, #eef3f6)) !important;
  color: var(--pf-heading, #172637) !important;
  font-family: 'DM Sans', Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
  letter-spacing: .01em !important;
  text-wrap: balance !important;
}

body.privacy-page .privacy-section p {
  margin: 0 0 13px !important;
  max-width: 94ch !important;
  color: var(--pf-muted, #667584) !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  letter-spacing: 0 !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  hyphens: auto !important;
}

body.privacy-page .privacy-section ul {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px 12px !important;
  margin: 14px 0 2px !important;
  padding: 0 !important;
  list-style: none !important;
}

body.privacy-page .privacy-section li {
  position: relative !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 11px 13px 11px 40px !important;
  border: 1px solid var(--pf-border, #d8e1e7) !important;
  border-radius: 13px !important;
  background: var(--pf-surface-soft, #f3f6f8) !important;
  color: var(--pf-muted, #667584) !important;
  font-size: 14px !important;
  line-height: 1.62 !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  hyphens: auto !important;
}

body.privacy-page .privacy-section li::before {
  content: '✓' !important;
  position: absolute !important;
  inset-block-start: 11px !important;
  left: 13px !important;
  right: auto !important;
  display: grid !important;
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: color-mix(in srgb, var(--pf-teal, #0799a8) 13%, transparent) !important;
  color: var(--pf-teal, #0799a8) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

body.privacy-page .privacy-last-updated {
  width: fit-content !important;
  max-width: 100% !important;
  margin: 24px auto 0 !important;
  padding: 9px 14px !important;
  border: 1px solid var(--pf-border, #d8e1e7) !important;
  border-radius: 999px !important;
  background: var(--pf-surface-soft, #f3f6f8) !important;
  color: var(--pf-muted, #667584) !important;
  font-size: 12px !important;
  font-style: normal !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

/* Arabic: use an Arabic face for every heading and preserve natural RTL flow. */
html[dir="rtl"] body.privacy-page .privacy-wrap,
html[lang="ar"] body.privacy-page .privacy-wrap {
  font-family: 'Noto Sans Arabic', 'DM Sans', Arial, sans-serif !important;
}

html[dir="rtl"] body.privacy-page .privacy-section h2,
html[lang="ar"] body.privacy-page .privacy-section h2,
html[dir="rtl"] body.privacy-page .privacy-section h3,
html[lang="ar"] body.privacy-page .privacy-section h3 {
  font-family: 'Noto Sans Arabic', 'DM Sans', Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

html[dir="rtl"] body.privacy-page .privacy-section h2,
html[dir="rtl"] body.privacy-page .privacy-section h3,
html[dir="rtl"] body.privacy-page .privacy-section p,
html[dir="rtl"] body.privacy-page .privacy-section li,
html[dir="rtl"] body.privacy-page .privacy-intro p {
  text-align: right !important;
}

html[dir="rtl"] body.privacy-page .privacy-section li {
  padding: 11px 40px 11px 13px !important;
}

html[dir="rtl"] body.privacy-page .privacy-section li::before {
  right: 13px !important;
  left: auto !important;
}

html[dir="rtl"] body.privacy-page .privacy-intro {
  border-left: 1px solid var(--pf-border, #d8e1e7) !important;
  border-right: 5px solid var(--pf-purple, #684299) !important;
}

/* Dark mode: keep depth without muddy shadows. */
html[data-theme="dark"] body.privacy-page .privacy-intro,
html[data-theme="dark"] body.privacy-page .privacy-section {
  box-shadow: 0 12px 30px rgba(0, 0, 0, .16) !important;
}

html[data-theme="dark"] body.privacy-page .privacy-section li,
html[data-theme="dark"] body.privacy-page .privacy-last-updated {
  background: var(--pf-surface-soft, #15283a) !important;
}

/* Tablet */
@media (max-width: 1024px) {
  body.privacy-page .privacy-wrap {
    max-width: 900px !important;
  }

  body.privacy-page .privacy-section ul {
    grid-template-columns: 1fr !important;
  }

  body.privacy-page .privacy-section {
    border-radius: 18px !important;
  }
}

/* Phone */
@media (max-width: 760px) {
  /* The mobile stylesheet gives both .container and .privacy-wrap gutters.
     Remove the nested second gutter so the policy no longer looks cramped. */
  body.privacy-page .section > .container {
    padding-inline: var(--m-gutter, 18px) !important;
  }

  body.privacy-page .section > .container > .privacy-wrap {
    width: 100% !important;
    max-width: none !important;
    padding-inline: 0 !important;
  }

  body.privacy-page .section {
    padding-block: 24px 34px !important;
  }

  body.privacy-page .privacy-intro {
    margin-bottom: 14px !important;
    padding: 18px 17px !important;
    border-radius: 16px !important;
  }

  body.privacy-page .privacy-intro p {
    font-size: 14px !important;
    line-height: 1.72 !important;
  }

  body.privacy-page .privacy-section {
    margin-bottom: 12px !important;
    padding: 18px 16px !important;
    border-radius: 16px !important;
  }

  body.privacy-page .privacy-section h2 {
    margin-bottom: 13px !important;
    padding-bottom: 11px !important;
    font-size: 20px !important;
    line-height: 1.28 !important;
  }

  body.privacy-page .privacy-section h3 {
    margin-top: 16px !important;
    margin-bottom: 9px !important;
    padding: 6px 10px !important;
    font-size: 13.5px !important;
  }

  body.privacy-page .privacy-section p {
    margin-bottom: 11px !important;
    font-size: 14px !important;
    line-height: 1.72 !important;
  }

  body.privacy-page .privacy-section ul {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    margin-top: 11px !important;
  }

  body.privacy-page .privacy-section li {
    padding: 10px 11px 10px 37px !important;
    border-radius: 11px !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
  }

  body.privacy-page .privacy-section li::before {
    inset-block-start: 10px !important;
    left: 11px !important;
    width: 17px !important;
    height: 17px !important;
  }

  html[dir="rtl"] body.privacy-page .privacy-section li {
    padding: 10px 37px 10px 11px !important;
  }

  html[dir="rtl"] body.privacy-page .privacy-section li::before {
    right: 11px !important;
    left: auto !important;
  }

  body.privacy-page .privacy-last-updated {
    margin-top: 18px !important;
    margin-bottom: 4px !important;
    padding: 8px 12px !important;
    font-size: 11px !important;
  }

  body.privacy-page .page-hero-title {
    text-wrap: balance !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  body.privacy-page .page-hero-sub {
    max-width: 36ch !important;
    line-height: 1.55 !important;
  }
}

/* Narrow phones */
@media (max-width: 390px) {
  body.privacy-page .privacy-section {
    padding: 16px 14px !important;
  }

  body.privacy-page .privacy-section h2 {
    font-size: 19px !important;
  }

  body.privacy-page .privacy-section p,
  body.privacy-page .privacy-section li,
  body.privacy-page .privacy-intro p {
    font-size: 13.5px !important;
  }
}

html[dir="rtl"] body.privacy-page .page-hero-title,
html[lang="ar"] body.privacy-page .page-hero-title {
  font-family: 'Noto Sans Arabic', 'DM Sans', Arial, sans-serif !important;
  letter-spacing: 0 !important;
  line-height: 1.28 !important;
}


/* DAK CSS: mobile-final-polish.css */
/* ======================================================================
   DORAT AL KHALEEJ — MOBILE FINAL POLISH
   Scope: PHONE ONLY (<= 767px). Desktop/laptop/tablet remain unchanged.
   Goal: calm, readable, touch-friendly, premium mobile experience.
   ====================================================================== */

@media (max-width: 767px) {
  :root {
    --mf-gutter: 16px;
    --mf-radius: 18px;
    --mf-radius-lg: 24px;
    --mf-touch: 48px;
    --mf-section: 40px;
    --mf-shadow: 0 10px 30px rgba(16, 38, 61, .07);
  }

  html {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
  }

  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    font-size: 15px !important;
    line-height: 1.62 !important;
    letter-spacing: 0 !important;
  }

  html[lang="ar"] body,
  html[dir="rtl"] body {
    line-height: 1.72 !important;
  }

  *, *::before, *::after { box-sizing: border-box !important; }
  img, svg, video, canvas, iframe { max-width: 100% !important; height: auto; }
  :where(.container,.page-hero-inner,.branch-hero-inner,.pa-shell,.fv-wrap,.privacy-wrap) {
    width: 100% !important;
    max-width: none !important;
    padding-inline: var(--mf-gutter) !important;
    margin-inline: auto !important;
  }
  :where(section,article,div,form,fieldset,ul,ol,li) { min-width: 0; }
  :where(h1,h2,h3,h4,h5,h6,p,li,a,button,label,span,strong,small,td,th) {
    overflow-wrap: break-word;
    word-break: normal;
  }

  /* ---------- Navigation ---------- */
  #navbar,
  nav#navbar {
    min-height: 70px !important;
    height: 70px !important;
    padding-inline: max(var(--mf-gutter), env(safe-area-inset-left)) max(var(--mf-gutter), env(safe-area-inset-right)) !important;
  }
  #navbar .logo img,
  .logo img {
    height: 46px !important;
    width: auto !important;
    max-width: min(230px, 64vw) !important;
    object-fit: contain !important;
  }
  .hamburger {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    border-radius: 13px !important;
  }
  .mobile-menu {
    top: 70px !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-height: calc(100dvh - 82px) !important;
    padding: 10px 10px max(16px, env(safe-area-inset-bottom)) !important;
    border-radius: 0 0 18px 18px !important;
  }
  .mobile-menu a,
  .mobile-menu .lang-toggle {
    min-height: 46px !important;
    padding: 11px 12px !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
  }

  /* ---------- Global typography ---------- */
  .section,
  .section-gray {
    padding-block: var(--mf-section) !important;
  }
  .section-label,
  .page-hero-badge,
  .branch-hero-badge {
    font-size: 10.5px !important;
    line-height: 1.35 !important;
    letter-spacing: .1em !important;
  }
  .section-title,
  .home-adm-title,
  .path-tools-intro h2 {
    max-width: 22rem !important;
    margin-inline: auto !important;
    margin-bottom: 10px !important;
    font-size: clamp(25px, 7.4vw, 31px) !important;
    line-height: 1.15 !important;
  }
  .section-sub,
  .home-adm-sub {
    max-width: 35rem !important;
    margin-inline: auto !important;
    margin-bottom: 25px !important;
    font-size: 14px !important;
    line-height: 1.68 !important;
  }
  html[lang="ar"] .section-title,
  html[dir="rtl"] .section-title {
    line-height: 1.38 !important;
  }

  .page-hero,
  .branch-hero {
    min-height: 0 !important;
    padding: 0 !important;
  }
  .page-hero-inner,
  .branch-hero-inner {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }
  .page-hero h1,
  .page-hero-title,
  .branch-hero h1,
  .pa-hero h1,
  .fv-hero h1 {
    font-size: clamp(30px, 8.6vw, 38px) !important;
    line-height: 1.09 !important;
    letter-spacing: -.025em !important;
  }
  .page-hero p,
  .page-hero-sub,
  .branch-hero p,
  .pa-hero p,
  .fv-hero p {
    font-size: 14px !important;
    line-height: 1.68 !important;
  }
  html[lang="ar"] :is(.page-hero h1,.page-hero-title,.branch-hero h1,.pa-hero h1,.fv-hero h1),
  html[dir="rtl"] :is(.page-hero h1,.page-hero-title,.branch-hero h1,.pa-hero h1,.fv-hero h1) {
    line-height: 1.38 !important;
    letter-spacing: 0 !important;
  }

  /* ---------- Buttons / form controls ---------- */
  :where(.btn, a.btn, button.btn, .journey-premium-btn, .path-tool-action, .office-status-action) {
    min-height: var(--mf-touch) !important;
    padding: 12px 16px !important;
    border-radius: 13px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
  }
  :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),select,textarea) {
    width: 100% !important;
    min-width: 0 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
  }
  :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),select) {
    min-height: 52px !important;
    height: 52px !important;
    padding-inline: 14px !important;
    border-radius: 13px !important;
  }
  textarea {
    min-height: 118px !important;
    padding: 13px 14px !important;
    border-radius: 13px !important;
  }
  input[type="date"] {
    padding-block: 0 !important;
    line-height: normal !important;
    -webkit-appearance: auto !important;
    appearance: auto !important;
  }

  /* ---------- Homepage hero ---------- */
  .hero {
    min-height: 0 !important;
    padding: 12px var(--mf-gutter) 22px !important;
    gap: 0 !important;
  }
  .hero-right {
    height: 190px !important;
    min-height: 190px !important;
    border-radius: var(--mf-radius-lg) var(--mf-radius-lg) 0 0 !important;
    overflow: hidden !important;
  }
  .hero-left {
    padding: 22px 20px 24px !important;
    border-radius: 0 0 var(--mf-radius-lg) var(--mf-radius-lg) !important;
  }
  .hero-title {
    font-size: clamp(31px, 9vw, 39px) !important;
    line-height: 1.05 !important;
    margin-bottom: 11px !important;
  }
  .hero-desc {
    font-size: 14px !important;
    line-height: 1.66 !important;
    margin-bottom: 18px !important;
  }
  .hero-actions {
    gap: 8px !important;
    align-items: stretch !important;
  }
  .hero-actions .btn { flex: 1 1 0 !important; }
  .hero-stats {
    gap: 8px !important;
    margin-top: 18px !important;
  }
  .hero-stat {
    padding: 11px 9px !important;
    border-radius: 13px !important;
  }
  .hero-stat strong { font-size: 17px !important; }
  .hero-stat span { font-size: 10.5px !important; line-height: 1.35 !important; }

  /* ---------- Universal cards ---------- */
  :is(
    .branch-card,.prog-card,.news-card,.why-card,.ql-card,.mission-card,.branch-detail,
    .facility-card,.bus-card,.map-card,.info-card,.step-card,.dress-card,.curriculum-card,
    .subject-item,.contact-form-card,.office-hours-card,.home-adm-card,.home-adm-panel,
    .home-adm-side-block,.faq-item,.privacy-section,.key-card,.calendar-board,.month-card,
    .pa-route-card,.pa-workspace,.pa-result-card,.fv-form,.fv-result,.premium-app-card
  ) {
    border-radius: var(--mf-radius) !important;
    box-shadow: var(--mf-shadow) !important;
  }
  :is(.branch-card,.prog-card,.news-card,.why-card,.ql-card,.mission-card,.branch-detail,.facility-card,.bus-card,.map-card,.info-card,.step-card,.dress-card,.curriculum-card,.home-adm-card,.key-card,.pa-route-card) {
    padding: 18px !important;
  }
  :is(.branch-card,.prog-card,.news-card,.why-card,.ql-card,.facility-card,.bus-card,.map-card,.info-card,.step-card,.dress-card,.curriculum-card,.subject-item,.premium-app-card):hover {
    transform: none !important;
  }

  /* ---------- Homepage grids ---------- */
  .branches-grid,
  .programmes-grid,
  .news-grid,
  .apps-showcase,
  .premium-apps-grid,
  .icampus-grid,
  .branch-detail-grid,
  .facilities-grid,
  .activities-grid,
  .bus-grid,
  .maps-grid,
  .info-grid,
  .steps-grid,
  .dress-grid,
  .curriculum-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .why-cards,
  .ql-grid,
  .values-grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 10px !important;
  }
  .why-card,
  .ql-card,
  .value-item {
    min-height: 0 !important;
    padding: 15px !important;
  }
  .why-card h3,
  .ql-title,
  .value-title { font-size: 14px !important; line-height: 1.3 !important; }
  .why-card p,
  .ql-desc,
  .value-desc { font-size: 12px !important; line-height: 1.55 !important; }

  /* ---------- Branch cards ---------- */
  .branch-card {
    min-height: 0 !important;
    padding: 20px !important;
  }
  .branch-name { font-size: 23px !important; line-height: 1.15 !important; }
  .branch-quote { font-size: 13px !important; line-height: 1.58 !important; }
  .branch-tags,
  .branch-tags-single-line {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 7px !important;
  }
  .branch-tags .tag,
  .branch-tags-single-line .tag {
    width: 100% !important;
    min-height: 36px !important;
    padding: 7px 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: normal !important;
    text-align: center !important;
    font-size: 10.5px !important;
    line-height: 1.3 !important;
  }

  /* ---------- Programmes ---------- */
  .prog-card { min-height: 0 !important; }
  .prog-title { font-size: 17px !important; line-height: 1.28 !important; }
  .prog-desc { font-size: 12.5px !important; line-height: 1.58 !important; }
  .prog-age { font-size: 10.5px !important; }
  .prog-full-card {
    border-radius: var(--mf-radius-lg) !important;
    overflow: hidden !important;
  }
  .prog-full-left,
  .prog-full-right { padding: 20px 18px !important; }
  .prog-full-left h2 { font-size: 25px !important; line-height: 1.14 !important; }
  .prog-full-left p { font-size: 13.5px !important; line-height: 1.64 !important; }
  .prog-full-right :is(h2,h3) { font-size: 23px !important; line-height: 1.18 !important; }
  .prog-full-right .subject-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 10px !important;
  }
  .prog-full-right .subject-item {
    min-height: 126px !important;
    height: auto !important;
    padding: 14px 10px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    text-align: center !important;
    font-size: clamp(13.5px,3.8vw,15.5px) !important;
    line-height: 1.35 !important;
    box-shadow: none !important;
  }
  .prog-full-right .subject-item > span:first-child { font-size: 21px !important; line-height: 1 !important; }
  .prog-full-right .subject-item > span:last-child { width: 100% !important; text-align: center !important; }
  .secondary-programmes { gap: 9px !important; }
  .secondary-programme { font-size: 12.5px !important; line-height: 1.45 !important; }

  /* ---------- News ---------- */
  .news-card { padding: 17px !important; }
  .news-date,.news-tag { font-size: 10px !important; }
  .news-title-text { font-size: 17px !important; line-height: 1.32 !important; }
  .news-excerpt { font-size: 12.5px !important; line-height: 1.62 !important; }

  /* ---------- A Day at DAK ---------- */
  .day-panel {
    padding: 18px !important;
    border-radius: var(--mf-radius-lg) !important;
  }
  .day-panel-title { font-size: 22px !important; line-height: 1.22 !important; }
  .day-panel-text { font-size: 13px !important; line-height: 1.62 !important; }
  .day-step-btn {
    min-height: 62px !important;
    padding: 11px 12px 11px 17px !important;
    grid-template-columns: 40px minmax(0,1fr) !important;
    gap: 10px !important;
  }
  .day-step-btn strong { font-size: 13px !important; line-height: 1.3 !important; }
  .day-step-btn span span { font-size: 11px !important; line-height: 1.35 !important; }

  /* ---------- Journey ---------- */
  .journey-premium-card {
    border-radius: var(--mf-radius-lg) !important;
    overflow: hidden !important;
  }
  .journey-story-panel,
  .journey-form-panel { padding: 20px 18px !important; }
  .journey-story-panel h3 { font-size: 24px !important; line-height: 1.12 !important; }
  .journey-story-panel p { font-size: 13px !important; line-height: 1.62 !important; }
  .journey-form-panel .journey-form-head {
    grid-template-columns: 44px minmax(0,1fr) !important;
    gap: 11px !important;
    margin-bottom: 17px !important;
    padding-bottom: 15px !important;
  }
  .journey-form-panel .journey-form-icon {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
  }
  .journey-form-panel .journey-form-head strong {
    font-size: clamp(21px,6vw,25px) !important;
    line-height: 1.1 !important;
  }
  .journey-form-panel .journey-form-head small { font-size: 12.5px !important; line-height: 1.45 !important; }
  .journey-premium-inputs { gap: 12px !important; }
  .journey-input-group label { font-size: 12px !important; line-height: 1.35 !important; margin-bottom: 6px !important; }
  .journey-premium-inputs input,
  .journey-premium-inputs select,
  .journey-premium-inputs input[type="date"] {
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    line-height: normal !important;
    padding: 0 14px !important;
    border-radius: 13px !important;
  }
  .journey-premium-btn { margin-top: 2px !important; font-size: 14px !important; }
  .journey-note,[data-i18n="journey_note"] { display: none !important; }

  /* ---------- Guided tools / quick access ---------- */
  .path-tools-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .path-tool-card { padding: 17px !important; border-radius: var(--mf-radius) !important; }
  .path-tool-card h3 { font-size: 17px !important; line-height: 1.3 !important; }
  .path-tool-card p { font-size: 12.5px !important; line-height: 1.58 !important; }
  .ql-card { min-height: 112px !important; }
  .ql-icon { font-size: 21px !important; }

  /* ---------- Apps ---------- */
  .premium-app-card,
  .app-card {
    min-height: 0 !important;
    padding: 17px !important;
    border-radius: var(--mf-radius) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .app-name,.app-card h3 { font-size: 17px !important; line-height: 1.25 !important; }
  .app-desc,.app-card p { font-size: 12.5px !important; line-height: 1.55 !important; }
  .app-btns { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }
  .store-btn {
    min-height: 52px !important;
    padding: 8px 10px !important;
    border-radius: 12px !important;
  }
  .store-icon { font-size: 18px !important; }
  .store-text span { font-size: 8px !important; line-height: 1.15 !important; }
  .store-text strong { font-size: 10.5px !important; line-height: 1.18 !important; }

  /* ---------- Stay in the Loop: must always be visible ---------- */
  .newsletter {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 8px var(--mf-gutter) 34px !important;
    background: var(--pf-bg) !important;
    overflow: visible !important;
  }
  .newsletter-card,
  .newsletter-card.reveal,
  .newsletter-card.reveal.visible {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: var(--mf-radius-lg) !important;
    background: linear-gradient(145deg,#10263d 0%,#142c44 54%,#27203f 100%) !important;
    box-shadow: 0 18px 40px rgba(15,38,61,.16) !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    overflow: hidden !important;
  }
  .newsletter-card::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg,var(--pf-teal),var(--pf-purple),var(--pf-gold)) !important;
    opacity: .95 !important;
  }
  .newsletter-card::after { display: none !important; }
  .newsletter-copy {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 !important;
    padding: 23px 20px 20px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }
  .newsletter-copy::before,.newsletter-copy::after { display: none !important; }
  .newsletter-badge {
    margin-bottom: 10px !important;
    padding: 6px 9px !important;
    font-size: 9.5px !important;
    color: #76eef4 !important;
    background: rgba(0,188,212,.11) !important;
    border-color: rgba(118,238,244,.22) !important;
  }
  .newsletter h2,
  .newsletter-copy h2 {
    margin: 0 0 8px !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-size: clamp(27px,8vw,33px) !important;
    line-height: 1.08 !important;
    text-align: start !important;
  }
  .newsletter p,
  .newsletter-copy p {
    margin: 0 !important;
    color: rgba(255,255,255,.78) !important;
    -webkit-text-fill-color: rgba(255,255,255,.78) !important;
    font-size: 13.5px !important;
    line-height: 1.62 !important;
    text-align: start !important;
  }
  .newsletter-pills { display: none !important; }
  .newsletter-form-panel {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 2 !important;
    margin: 0 10px 10px !important;
    padding: 18px !important;
    border: 1px solid rgba(16,38,61,.08) !important;
    border-radius: 17px !important;
    background: #fff !important;
    box-shadow: none !important;
    overflow: visible !important;
  }
  .newsletter-form-panel::before { display: none !important; }
  .newsletter-form-title {
    margin-bottom: 5px !important;
    color: #172637 !important;
    -webkit-text-fill-color: #172637 !important;
    font-size: 17px !important;
    line-height: 1.28 !important;
  }
  .newsletter-form-text {
    margin-bottom: 13px !important;
    color: #687687 !important;
    -webkit-text-fill-color: #687687 !important;
    font-size: 12.5px !important;
    line-height: 1.55 !important;
  }
  .nl-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .nl-form input[type="email"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 14px !important;
    border: 1.5px solid #d3dee6 !important;
    border-radius: 13px !important;
    background: #fff !important;
    color: #172637 !important;
    -webkit-text-fill-color: #172637 !important;
    font-size: 16px !important;
    position: static !important;
    transform: none !important;
    clip: auto !important;
    -webkit-appearance: none !important;
    appearance: none !important;
  }
  .nl-form input[type="email"]::placeholder { color: #8795a5 !important; opacity: 1 !important; }
  .nl-form button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    min-height: 50px !important;
    border-radius: 13px !important;
    font-size: 14px !important;
  }
  .newsletter-trust {
    margin-top: 10px !important;
    color: #6f7b89 !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }
  html[data-theme="dark"] .newsletter-form-panel {
    background: #132638 !important;
    border-color: #2f4558 !important;
  }
  html[data-theme="dark"] .newsletter-form-title { color: #f4f8fb !important; -webkit-text-fill-color:#f4f8fb !important; }
  html[data-theme="dark"] .newsletter-form-text,
  html[data-theme="dark"] .newsletter-trust { color: #aebcca !important; -webkit-text-fill-color:#aebcca !important; }
  html[data-theme="dark"] .nl-form input[type="email"] { background:#0d1d2c !important; color:#f4f8fb !important; -webkit-text-fill-color:#f4f8fb !important; border-color:#385066 !important; }

  /* ---------- About ---------- */
  .mission-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .mission-card { padding: 18px !important; }
  .mission-card h3 { font-size: 18px !important; line-height: 1.3 !important; }
  .mission-card p { font-size: 13px !important; line-height: 1.62 !important; }
  .mission-card.values .values-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; }
  .mission-card.values .value-item { padding: 13px !important; border-radius: 14px !important; }
  .branch-detail-body { font-size: 13px !important; line-height: 1.6 !important; }

  /* ---------- Admissions ---------- */
  .steps-grid,.dress-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .step-card,.dress-card { min-height: 0 !important; }
  .step-card h3,.dress-card h3 { font-size: 17px !important; line-height: 1.3 !important; }
  .step-card p,.dress-card p { font-size: 13px !important; line-height: 1.62 !important; }
  .home-adm-grid { grid-template-columns: 1fr !important; gap: 13px !important; }
  .home-adm-panel,.home-adm-card,.home-adm-side-block { padding: 18px !important; }
  .home-adm-card h3 { font-size: 17px !important; line-height: 1.3 !important; }
  .home-adm-card p { font-size: 13px !important; line-height: 1.62 !important; }
  .faq-list { gap: 9px !important; }
  .faq-item { padding: 0 !important; }
  .faq-question { min-height: 56px !important; padding: 14px 14px !important; gap: 10px !important; }
  .faq-text { font-size: 14px !important; line-height: 1.45 !important; }
  .faq-answer { padding: 0 14px 14px !important; font-size: 13px !important; line-height: 1.62 !important; }

  /* ---------- Calendar ---------- */
  .calendar-view-switch {
    width: 100% !important;
    padding: 5px !important;
    gap: 5px !important;
    border-radius: 16px !important;
  }
  .calendar-view-tab {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 9px 7px !important;
    border-radius: 12px !important;
    font-size: 11.5px !important;
    line-height: 1.28 !important;
    white-space: normal !important;
  }
  .calendar-board { padding: 16px !important; }
  .calendar-topline {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    margin-bottom: 15px !important;
    padding-bottom: 15px !important;
    text-align: center !important;
  }
  .calendar-brand {
    width: 100% !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 9px !important;
    text-align: center !important;
  }
  .calendar-official-logo img,
  .calendar-brand img {
    width: auto !important;
    max-width: 235px !important;
    max-height: 58px !important;
    margin-inline: auto !important;
  }
  .calendar-brand-copy { width: 100% !important; text-align: center !important; }
  .calendar-brand-title { font-size: 27px !important; line-height: 1.08 !important; text-align: center !important; }
  .calendar-brand-copy .section-label { display: none !important; }
  .calendar-year-pill {
    min-width: 138px !important;
    padding: 9px 15px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    text-align: center !important;
  }
  .month-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .month-card { padding: 15px !important; }
  .month-card h3,.events-month-heading { font-size: 18px !important; line-height: 1.25 !important; }
  .month-note,.events-note,.events-footnote { font-size: 12px !important; line-height: 1.55 !important; }
  .key-panel { grid-template-columns: 1fr !important; gap: 10px !important; }
  .key-card { padding: 16px !important; }
  .key-card h3 { font-size: 20px !important; line-height: 1.25 !important; }
  .key-list { font-size: 12.5px !important; line-height: 1.6 !important; }
  .events-toolbar,.events-head-badges,.events-mini-stats { gap: 8px !important; }
  .event-filters { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
  .event-filter-wrap { flex: 1 1 140px !important; min-width: 0 !important; }
  .events-list { gap: 9px !important; }

  /* ---------- Tables: local scrolling only ---------- */
  .responsive-table-shell,
  .home-adm-table-wrap,
  .table-wrap,
  .summary-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-inline: contain !important;
    border-radius: 14px !important;
  }
  .age-table,.home-adm-age-table { min-width: 540px !important; width: max-content !important; max-width: none !important; font-size: 11.5px !important; }
  .summary-table { min-width: 470px !important; width: max-content !important; max-width: none !important; font-size: 11px !important; }
  .mini-cal { width: 100% !important; table-layout: fixed !important; font-size: 11px !important; }

  /* ---------- Facilities ---------- */
  .facility-card,.bus-card { overflow: hidden !important; }
  .facility-header { padding: 18px !important; }
  .facility-header h3 { font-size: 19px !important; line-height: 1.25 !important; }
  .facility-header p,.facility-body p,.bus-card p { font-size: 13px !important; line-height: 1.6 !important; }
  .facility-body { padding: 16px 18px 18px !important; }

  /* ---------- Contact ---------- */
  .contact-grid { grid-template-columns: 1fr !important; gap: 13px !important; }
  .contact-form-card,.office-hours-card,.info-card,.map-card { padding: 18px !important; }
  .form-row { grid-template-columns: 1fr !important; gap: 11px !important; }
  .form-group label { font-size: 12px !important; margin-bottom: 6px !important; }
  .info-card h4,.office-hours-card h3 { font-size: 18px !important; line-height: 1.3 !important; }
  .info-row,.hours-row-item { font-size: 13px !important; line-height: 1.55 !important; }

  /* ---------- Path advisor / future vision ---------- */
  .pa-hero-grid,.fv-wrap { grid-template-columns: 1fr !important; gap: 14px !important; }
  .pa-route-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .pa-route-card { padding: 17px !important; }
  .pa-route-card h3 { font-size: 17px !important; line-height: 1.3 !important; }
  .pa-route-card p,.pa-mini-list { font-size: 12.5px !important; line-height: 1.58 !important; }
  .pa-workspace { padding: 16px !important; }
  .pa-question-wrap { font-size: 14px !important; line-height: 1.55 !important; }
  .fv-form { padding: 18px !important; }
  .fv-form-title { font-size: 21px !important; line-height: 1.25 !important; }
  .fv-form-sub { font-size: 13px !important; line-height: 1.6 !important; }

  /* ---------- Privacy ---------- */
  body.privacy-page .privacy-wrap { padding-inline: var(--mf-gutter) !important; }
  body.privacy-page .privacy-intro { font-size: 14px !important; line-height: 1.72 !important; }
  body.privacy-page .privacy-section { padding: 18px !important; margin-bottom: 12px !important; }
  body.privacy-page .privacy-section h2 { font-size: 20px !important; line-height: 1.28 !important; margin-bottom: 10px !important; }
  body.privacy-page .privacy-section :is(p,li) { font-size: 13.5px !important; line-height: 1.72 !important; }
  body.privacy-page .privacy-section ul { padding-inline-start: 20px !important; }
  html[dir="rtl"] body.privacy-page .privacy-section ul { padding-inline-start: 0 !important; padding-inline-end: 20px !important; }

  /* ---------- Footer ---------- */
  .footer { padding: 36px var(--mf-gutter) max(26px, env(safe-area-inset-bottom)) !important; }
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px 14px !important;
  }
  .footer-grid > div:first-child { grid-column: 1 / -1 !important; }
  .footer-brand-name { font-size: 24px !important; line-height: 1.15 !important; }
  .footer-brand-name span { font-size: 10px !important; letter-spacing: .08em !important; margin-top: 5px !important; }
  .footer-desc { max-width: 34rem !important; font-size: 13px !important; line-height: 1.65 !important; }
  .footer-contact {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 13px !important;
    line-height: 1.85 !important;
  }
  .footer-contact a { visibility: visible !important; opacity: 1 !important; }
  .footer-col h4 { margin-bottom: 10px !important; font-size: 11px !important; letter-spacing: .14em !important; }
  .footer-col li { margin-bottom: 8px !important; }
  .footer-col a { font-size: 12.5px !important; line-height: 1.45 !important; }
  .footer-bottom {
    margin-top: 26px !important;
    padding-top: 18px !important;
    gap: 13px !important;
    font-size: 10.5px !important;
    line-height: 1.5 !important;
  }
  .footer-bottom-links { gap: 9px 12px !important; flex-wrap: wrap !important; }
  .footer-bottom-links a { font-size: 10.5px !important; }

  /* ---------- Floating controls ---------- */
  .wa-float,
  .whatsapp-float,
  #whatsappBtn {
    left: max(14px, env(safe-area-inset-left)) !important;
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
  }
  .wa-float,
  .whatsapp-float,
  #whatsappBtn,
  .dak-ai-bubble {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
  }
  .dak-ai-bubble {
    right: max(14px, env(safe-area-inset-right)) !important;
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
  }
  .dak-ai-bubble svg { width: 34px !important; height: 34px !important; }
  .back-to-top {
    right: max(14px, env(safe-area-inset-right)) !important;
    bottom: calc(max(16px, env(safe-area-inset-bottom)) + 66px) !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 13px !important;
  }

  /* ---------- Mobile motion/performance ---------- */
  .app-card-glow,
  .premium-apps-section::before,
  .premium-apps-section::after,
  .icampus-section::before,
  .icampus-section::after,
  .newsletter::before,
  .newsletter::after {
    animation: none !important;
  }
  :is(.branch-card,.prog-card,.news-card,.why-card,.ql-card,.premium-app-card,.facility-card,.bus-card,.map-card,.info-card) {
    transition-duration: .18s !important;
  }
}

@media (max-width: 359px) {
  :root { --mf-gutter: 13px; }
  .hero-actions { flex-direction: column !important; }
  .why-cards,.ql-grid,.values-grid { grid-template-columns: 1fr !important; }
  .prog-full-right .subject-grid { grid-template-columns: 1fr !important; }
  .footer-grid { grid-template-columns: 1fr !important; }
  .footer-grid > div:first-child { grid-column: auto !important; }
  .app-btns { grid-template-columns: 1fr !important; }
}

@media (max-width: 767px) and (orientation: landscape) {
  .hero-right { height: 160px !important; min-height: 160px !important; }
  .page-hero-inner,.branch-hero-inner { padding-top: 26px !important; padding-bottom: 26px !important; }
  .mobile-menu { max-height: calc(100dvh - 70px) !important; }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *,*::before,*::after { animation: none !important; transition-duration: .01ms !important; }
}

/* Final mobile legibility sweep */
@media (max-width: 767px) {
  .hero-badge { font-size: 10px !important; }
  .stat-label { font-size: 9.5px !important; line-height: 1.3 !important; letter-spacing: .05em !important; }
  .stat-num { font-size: 19px !important; }
  .breadcrumb,
  .breadcrumb a,
  .breadcrumb span { font-size: 10.5px !important; line-height: 1.35 !important; }

  .home-office-status .office-status-kicker { font-size: 10px !important; }
  .home-office-status .office-status-title { font-size: 13.5px !important; line-height: 1.3 !important; }
  .home-office-status .office-status-note { font-size: 11px !important; line-height: 1.45 !important; }
  .home-office-status .office-status-action { min-height: 38px !important; font-size: 10.5px !important; }

  .pa-hero :is(.pa-kicker,.pa-chip,.pa-mini-list span),
  .pa-advisor-section :is(.pa-kicker,.pa-chip,.pa-mini-list span) { font-size: 10px !important; line-height: 1.35 !important; }
  .fv-label,.fv-form label { font-size: 12px !important; line-height: 1.35 !important; }

  .calendar-board :is(.calendar-kicker,.calendar-tip,.events-footnote,.events-source-meta) { font-size: 11px !important; line-height: 1.45 !important; }
  .calendar-board .calendar-action,
  .calendar-board .btn { font-size: 11.5px !important; }

  .footer { padding-bottom: max(96px, calc(env(safe-area-inset-bottom) + 82px)) !important; }
  .footer-bottom,
  .footer-bottom *,
  .footer-bottom-links a { font-size: 10.5px !important; line-height: 1.5 !important; }
}


/* DAK CSS: mobile-edge-fit.css */
/* ======================================================================
   DORAT AL KHALEEJ — MOBILE EDGE FIT
   Scope: PHONE ONLY (<= 767px)
   Goal: use the full phone width, remove awkward side strips/gaps, keep
         every important element visible, readable, touch-friendly and calm.
   Desktop/laptop/tablet are intentionally untouched.
   ====================================================================== */

@media (max-width: 767px) {
  :root {
    --mef-content: 12px;
    --mef-card-gap: 8px;
    --mef-safe-left: max(var(--mef-content), env(safe-area-inset-left));
    --mef-safe-right: max(var(--mef-content), env(safe-area-inset-right));
  }

  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: clip !important;
  }

  body {
    font-size: 15.5px !important;
    line-height: 1.64 !important;
  }

  main,
  #main,
  .main-content,
  .page-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    overflow: visible !important;
  }

  /* Make section backgrounds genuinely full-bleed. Content receives its own
     small, consistent inner gutter instead of nested 16–32px side gaps. */
  :is(
    .section,.section-gray,.hero,.page-hero,.branch-hero,.newsletter,.footer,
    .premium-apps-section,.icampus-section,.path-tools-section,.home-adm-section,
    .calendar-section,.events-section,.privacy-page main
  ) {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  :where(
    .section > .container,
    .section-gray > .container,
    .premium-apps-section > .container,
    .icampus-section > .container,
    .path-tools-section > .container,
    .home-adm-section > .container,
    .calendar-section > .container,
    .events-section > .container,
    .privacy-wrap,
    .pa-shell,
    .fv-wrap
  ) {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-left: var(--mef-safe-left) !important;
    padding-right: var(--mef-safe-right) !important;
  }

  /* Keep headings readable but do not let them create a narrow column. */
  .section-title,
  .section-sub,
  .home-adm-title,
  .home-adm-sub,
  .path-tools-intro h2,
  .path-tools-intro p {
    max-width: min(100%, 38rem) !important;
  }

  /* ---------- Navbar / menu ---------- */
  #navbar,
  nav#navbar {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: var(--mef-safe-left) !important;
    padding-right: var(--mef-safe-right) !important;
  }

  .mobile-menu {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-radius: 0 0 16px 16px !important;
    padding-left: var(--mef-safe-left) !important;
    padding-right: var(--mef-safe-right) !important;
  }

  /* ---------- Homepage hero: full-width surface ---------- */
  .hero {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .hero-left,
  .hero-right {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }

  .hero-left {
    padding: 24px var(--mef-safe-right) 25px var(--mef-safe-left) !important;
  }

  .hero-right {
    height: 205px !important;
    min-height: 205px !important;
    overflow: hidden !important;
  }

  .hero-right :is(img,picture,video),
  .hero-slider,
  .hero-slide,
  .hero-slide img {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .hero-title {
    max-width: 100% !important;
    font-size: clamp(32px, 9.3vw, 40px) !important;
    line-height: 1.05 !important;
  }

  .hero-desc {
    max-width: 100% !important;
    font-size: 14.5px !important;
    line-height: 1.68 !important;
  }

  /* ---------- Inner page heroes: background reaches screen edges ---------- */
  .page-hero,
  .branch-hero {
    margin: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }

  .page-hero-inner,
  .branch-hero-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: var(--mef-safe-left) !important;
    padding-right: var(--mef-safe-right) !important;
  }

  /* ---------- Cards / grids: near edge-to-edge without looking cramped ---------- */
  :is(
    .branches-grid,.programmes-grid,.news-grid,.apps-showcase,.premium-apps-grid,
    .icampus-grid,.branch-detail-grid,.facilities-grid,.activities-grid,.bus-grid,
    .maps-grid,.info-grid,.steps-grid,.dress-grid,.curriculum-grid,.home-adm-grid,
    .mission-grid,.contact-grid,.path-tools-grid,.pa-route-grid,.month-grid
  ) {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  :is(
    .branch-card,.prog-card,.news-card,.why-card,.ql-card,.mission-card,.branch-detail,
    .facility-card,.bus-card,.map-card,.info-card,.step-card,.dress-card,.curriculum-card,
    .subject-item,.contact-form-card,.office-hours-card,.home-adm-card,.home-adm-panel,
    .home-adm-side-block,.faq-item,.privacy-section,.key-card,.calendar-board,.month-card,
    .pa-route-card,.pa-workspace,.pa-result-card,.fv-form,.fv-result,.premium-app-card,
    .journey-premium-card,.day-panel
  ) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Slightly tighter global edge gutter than the previous pass. */
  :where(.section > .container,.section-gray > .container) {
    padding-left: max(var(--mef-card-gap), env(safe-area-inset-left)) !important;
    padding-right: max(var(--mef-card-gap), env(safe-area-inset-right)) !important;
  }

  /* Headings inside those sections still need breathing room. */
  :where(.section > .container,.section-gray > .container) > :is(.section-label,.section-title,.section-sub) {
    margin-left: 4px !important;
    margin-right: 4px !important;
  }

  /* ---------- Programme full cards / subject grids ---------- */
  .prog-full-card,
  .journey-premium-card,
  .calendar-board,
  body.privacy-page .privacy-section {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  .prog-full-right .subject-grid {
    width: 100% !important;
    max-width: 100% !important;
  }

  .prog-full-right .subject-item {
    min-width: 0 !important;
    max-width: 100% !important;
    padding-inline: 10px !important;
    overflow: visible !important;
  }

  .prog-full-right .subject-item > span:last-child {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    hyphens: auto;
  }

  /* ---------- Forms: never clipped on narrow iPhones ---------- */
  :is(form,fieldset,.form-row,.form-group,.journey-premium-inputs,.journey-input-group,.nl-form) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  :is(input:not([type="hidden"]),select,textarea,button) {
    max-width: 100% !important;
  }

  input[type="date"] {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* ---------- Stay in the Loop: full-width, guaranteed visible ---------- */
  .newsletter {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 0 30px !important;
    overflow: visible !important;
  }

  .newsletter-card,
  .newsletter-card.reveal,
  .newsletter-card.reveal.visible {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }

  .newsletter-copy {
    width: 100% !important;
    max-width: 100% !important;
    padding: 24px var(--mef-safe-right) 20px var(--mef-safe-left) !important;
  }

  .newsletter-form-panel {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 var(--mef-safe-right) 12px var(--mef-safe-left) !important;
    padding: 18px !important;
  }

  .nl-form,
  .nl-form input[type="email"],
  .nl-form button {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .nl-form button {
    display: flex !important;
  }

  /* ---------- Calendar ---------- */
  .calendar-view-switch {
    width: calc(100% - (var(--mef-card-gap) * 2)) !important;
    margin-left: var(--mef-card-gap) !important;
    margin-right: var(--mef-card-gap) !important;
  }

  .calendar-board {
    border-radius: 16px !important;
  }

  .calendar-topline,
  .calendar-brand,
  .calendar-brand-copy {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .calendar-official-logo img,
  .calendar-brand img {
    max-width: min(100%, 245px) !important;
  }

  /* ---------- Tables: full available width, scroll only inside table shell ---------- */
  .responsive-table-shell,
  .home-adm-table-wrap,
  .table-wrap,
  .summary-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  /* ---------- Privacy ---------- */
  body.privacy-page .privacy-wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: var(--mef-safe-left) !important;
    padding-right: var(--mef-safe-right) !important;
  }

  body.privacy-page .privacy-section {
    padding: 18px 16px !important;
  }

  /* ---------- Footer: full bleed, content safe ---------- */
  .footer {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: var(--mef-safe-left) !important;
    padding-right: var(--mef-safe-right) !important;
  }

  .footer-grid,
  .footer-bottom {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .footer-contact,
  .footer-desc,
  .footer-col,
  .footer-col a {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  /* ---------- Reveal animation safety: content must never stay invisible ---------- */
  .reveal,
  .reveal.visible {
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }

  /* ---------- Generic anti-clipping ---------- */
  :is(
    .hero-left,.hero-right,.page-hero-inner,.branch-hero-inner,.container,
    .branch-card,.prog-card,.prog-full-card,.subject-item,.journey-premium-card,
    .journey-form-panel,.calendar-board,.privacy-section,.newsletter-copy,
    .newsletter-form-panel,.footer-grid
  ) > * {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  :where(h1,h2,h3,h4,h5,h6,p,a,span,strong,small,label,li,td,th) {
    max-width: 100% !important;
  }

  /* Local horizontal scrollers are allowed; the page itself is not. */
  body > :not(.responsive-table-shell):not(.table-wrap) {
    max-width: 100% !important;
  }
}

@media (max-width: 359px) {
  :root {
    --mef-content: 10px;
    --mef-card-gap: 6px;
  }

  .hero-left {
    padding-top: 21px !important;
    padding-bottom: 22px !important;
  }

  .hero-right {
    height: 190px !important;
    min-height: 190px !important;
  }

  .newsletter-form-panel {
    padding: 15px !important;
  }
}

@media (max-width: 767px) and (orientation: landscape) {
  .hero-right {
    height: 180px !important;
    min-height: 180px !important;
  }
}


/* DAK CSS: mobile-footer-safe.css */
/*
 * DAK mobile footer readability and safe spacing.
 * Narrow phones only: desktop and tablet layouts remain exactly as approved.
 * This file must load AFTER mobile-edge-fit.css to restore the footer's inner
 * content gutter while allowing its navy background to extend edge-to-edge.
 */
@media only screen and (max-width: 767px) {
  html body .footer {
    --footer-phone-gutter: clamp(18px, 5vw, 24px);
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 36px max(var(--footer-phone-gutter), env(safe-area-inset-left))
      max(142px, calc(120px + env(safe-area-inset-bottom)))
      max(var(--footer-phone-gutter), env(safe-area-inset-right)) !important;
    border-radius: 28px 28px 0 0 !important;
  }

  .footer .footer-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 26px clamp(15px, 4.5vw, 24px) !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 30px !important;
    padding: 0 !important;
    min-width: 0 !important;
    align-items: start;
  }

  .footer .footer-grid > div:first-child {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  .footer .footer-brand-name {
    max-width: 100% !important;
    font-size: clamp(25px, 7vw, 30px) !important;
    line-height: 1.22 !important;
    overflow-wrap: break-word !important;
    letter-spacing: -.025em !important;
    margin-bottom: 12px !important;
  }

  .footer .footer-brand-name span {
    display: block !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    letter-spacing: .065em !important;
    margin-top: 5px !important;
  }

  .footer .footer-desc {
    max-width: 34rem !important;
    margin: 0 0 18px !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    overflow-wrap: normal !important;
  }

  .footer .footer-contact {
    display: block !important;
    max-width: 100% !important;
    font-size: 13.5px !important;
    line-height: 1.9 !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
  }

  .footer .footer-contact a {
    display: inline !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 3px !important;
  }

  .footer .footer-col {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .footer .footer-col h4 {
    margin: 0 0 10px !important;
    font-size: 11.5px !important;
    line-height: 1.5 !important;
    letter-spacing: .115em !important;
    overflow-wrap: break-word !important;
  }

  .footer .footer-col ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .footer .footer-col li {
    margin: 0 !important;
  }

  .footer .footer-col li a {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 42px !important;
    padding-block: 8px !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
  }

  .footer .footer-bottom {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 23px 0 0 !important;
    gap: 19px !important;
    text-align: center !important;
    min-width: 0 !important;
  }

  .footer .footer-bottom > span {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 5px !important;
    font-size: 12px !important;
    line-height: 1.65 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    text-wrap: pretty;
  }

  .footer .footer-bottom-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    direction: inherit !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 0 !important;
  }

  .footer .footer-bottom-links a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    padding: 9px 7px !important;
    background: rgba(255, 255, 255, .055) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 12px !important;
    font-size: 12.5px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    text-decoration: none !important;
  }

  /* Some secondary pages have three rather than four footer links. */
  .footer .footer-bottom-links a:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
    justify-self: center !important;
    width: min(100%, 240px) !important;
  }

  .footer .footer-bottom-links a:focus-visible,
  .footer .footer-contact a:focus-visible,
  .footer .footer-col a:focus-visible {
    outline: 2px solid #77e7ef !important;
    outline-offset: 3px !important;
  }

  html[dir="rtl"] .footer,
  html[dir="rtl"] .footer .footer-grid,
  html[dir="rtl"] .footer .footer-col,
  html[dir="rtl"] .footer .footer-contact {
    direction: rtl !important;
    text-align: right !important;
  }

  html[dir="rtl"] .footer .footer-brand-name {
    letter-spacing: 0 !important;
    line-height: 1.5 !important;
  }

  html[dir="rtl"] .footer .footer-brand-name span,
  html[dir="rtl"] .footer .footer-col h4 {
    letter-spacing: 0 !important;
  }

  html[dir="rtl"] .footer .footer-bottom,
  html[dir="rtl"] .footer .footer-bottom > span,
  html[dir="rtl"] .footer .footer-bottom-links a {
    text-align: center !important;
  }
}

/* 2026-09-23: compact phone footer final pass.
   Keep the footer edge-to-edge, but remove the excess blank space above and
   below the content while preserving a safe zone for the floating controls. */
@media only screen and (max-width: 767px) {
  html body .footer {
    padding-top: 22px !important;
    padding-bottom: max(78px, calc(62px + env(safe-area-inset-bottom))) !important;
  }

  .footer .footer-grid {
    gap: 20px clamp(15px, 4.5vw, 24px) !important;
    margin-bottom: 20px !important;
  }

  .footer .footer-bottom {
    padding-top: 18px !important;
    gap: 14px !important;
  }

  .footer .footer-bottom-links {
    gap: 8px !important;
  }
}

/* 2026-09-23: tighten the first mobile footer block.
   Removes the two small empty bands the user identified: above the school
   name and below the contact/e-mail block. Phone only. */
@media only screen and (max-width: 767px) {
  html body .footer {
    padding-top: 12px !important;
  }

  .footer .footer-brand-name {
    margin-top: 0 !important;
    margin-bottom: 6px !important;
  }

  .footer .footer-brand-name span {
    margin-top: 3px !important;
  }

  .footer .footer-desc {
    margin-bottom: 10px !important;
    line-height: 1.58 !important;
  }

  .footer .footer-contact {
    margin: 0 !important;
    line-height: 1.72 !important;
  }

  .footer .footer-grid {
    row-gap: 12px !important;
  }
}

/* ================================================================
   V6.4 — PHONE FOOTER TOP SEAM / WHITE GAP FIX
   Phone only. Makes the footer background fully cover the top edge on
   every page, including the former white sliver/rounded-corner exposure.
   Tablet and desktop remain unchanged.
   ================================================================ */
@media only screen and (max-width: 767px) {
  html body .footer {
    margin-top: -2px !important;
    border-radius: 0 !important;
    background: #172435 !important;
    background-clip: border-box !important;
    position: relative !important;
    z-index: 2 !important;
    box-shadow: 0 -3px 0 #172435 !important;
  }

  html body .footer::before,
  html body .footer::after {
    top: -3px !important;
  }
}

/* ================================================================
   V6.5 — PHONE FOOTER BOTTOM HEIGHT REFINEMENT
   Keep the V6.4 full background coverage, but remove the unnecessary
   long empty space below the footer content on phones.
   ================================================================ */
@media only screen and (max-width: 767px) {
  html body .footer {
    padding-bottom: max(42px, calc(16px + env(safe-area-inset-bottom))) !important;
  }

  .footer .footer-bottom {
    margin-bottom: 0 !important;
  }

  .footer .footer-bottom-links {
    margin-bottom: 0 !important;
  }
}



/* DAK CSS: responsive-final-pass.css */
/* ======================================================================
   DAK RESPONSIVE FINAL PASS — 2026-09-23
   Phone + touch-tablet fixes only. Approved laptop/desktop layout remains
   untouched. Tablet rules are gated by html.dak-tablet.
   ====================================================================== */

/* ---------- Phone + tablet: remove the white separator below newsletter ---------- */
@media (max-width: 767px) {
  .newsletter {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    background: linear-gradient(135deg,#10263d 0%,#15283c 54%,#241d3a 100%) !important;
  }
  .newsletter + .footer,
  .footer { margin-top: 0 !important; }
}

html.dak-tablet .newsletter {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  background: linear-gradient(135deg,#10263d 0%,#15283c 54%,#241d3a 100%) !important;
}
html.dak-tablet .newsletter + .footer,
html.dak-tablet .footer { margin-top: 0 !important; }

/* ---------- Tablet navigation: language + theme are always visible ---------- */
html.dak-tablet #navbar {
  height: 76px !important;
  padding: 0 20px !important;
  gap: 10px !important;
}
html.dak-tablet #navbar .logo { min-width: 0 !important; flex: 0 1 auto !important; }
html.dak-tablet #navbar .logo img {
  width: auto !important;
  height: 54px !important;
  max-width: min(215px, 31vw) !important;
  object-fit: contain !important;
}
html.dak-tablet #navbar .nav-links {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin-inline-start: auto !important;
  min-width: 0 !important;
}
html.dak-tablet #navbar .nav-links > a { display: none !important; }
html.dak-tablet #navbar .nav-links > .theme-control--desktop,
html.dak-tablet #navbar .nav-links > .lang-toggle { display: inline-flex !important; }
html.dak-tablet #navbar .theme-control--desktop { margin: 0 !important; }
html.dak-tablet #navbar .theme-trigger {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  border-radius: 13px !important;
}
html.dak-tablet #navbar .theme-trigger-chevron { display: none !important; }
html.dak-tablet #navbar .theme-trigger-icon svg { width: 20px !important; height: 20px !important; }
html.dak-tablet #navbar .lang-toggle {
  min-width: 72px !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border-radius: 13px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
html.dak-tablet #navbar .hamburger {
  display: inline-flex !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  flex: 0 0 44px !important;
  margin: 0 !important;
}

/* Also keep the same controls available inside the opened tablet menu. */
html.dak-tablet .mobile-menu {
  top: 76px !important;
  width: min(430px, calc(100vw - 32px)) !important;
  max-height: calc(100dvh - 92px) !important;
  padding: 14px !important;
  gap: 3px !important;
  overflow-y: auto !important;
}
html.dak-tablet .mobile-menu > .lang-toggle {
  display: flex !important;
  width: 100% !important;
  min-height: 46px !important;
  margin-top: 7px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--pf-border, #dbe3e9) !important;
  border-radius: 12px !important;
  background: var(--pf-surface-2, #f3f6f8) !important;
}
html.dak-tablet .mobile-menu .theme-control--mobile {
  display: block !important;
  width: 100% !important;
  margin-top: 8px !important;
  padding: 9px !important;
  border: 1px solid var(--pf-border, #dbe3e9) !important;
  border-radius: 13px !important;
  background: var(--pf-surface-2, #f3f6f8) !important;
}

/* ---------- Tablet child-journey form ---------- */
html.dak-tablet .journey-premium-card {
  grid-template-columns: 1fr !important;
  gap: 20px !important;
}
html.dak-tablet .journey-story-panel,
html.dak-tablet .journey-form-panel {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 28px !important;
}
html.dak-tablet .journey-form-head {
  display: grid !important;
  grid-template-columns: 52px minmax(0,1fr) !important;
  gap: 14px !important;
  align-items: center !important;
  margin: 0 0 22px !important;
  padding: 0 0 18px !important;
}
html.dak-tablet .journey-form-icon {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  border-radius: 15px !important;
}
html.dak-tablet .journey-form-head strong {
  display: block !important;
  font-size: 27px !important;
  line-height: 1.08 !important;
  margin: 0 0 4px !important;
}
html.dak-tablet .journey-form-head small {
  display: block !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
html.dak-tablet .journey-premium-inputs,
html.dak-tablet .journey-inputs {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 18px 16px !important;
  align-items: start !important;
}
html.dak-tablet .journey-premium-inputs .wide,
html.dak-tablet .journey-premium-btn,
html.dak-tablet .journey-input-group:first-child { grid-column: 1 / -1 !important; }
html.dak-tablet .journey-input-group {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  gap: 7px !important;
}
html.dak-tablet .journey-input-group label {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  text-align: start !important;
  white-space: normal !important;
}
html.dak-tablet .journey-premium-inputs input,
html.dak-tablet .journey-premium-inputs select,
html.dak-tablet .journey-premium-inputs input[type="date"] {
  width: 100% !important;
  min-width: 0 !important;
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  margin: 0 !important;
  padding: 0 15px !important;
  border-radius: 14px !important;
  font-size: 16px !important;
  line-height: normal !important;
  box-sizing: border-box !important;
}
html.dak-tablet .journey-premium-btn {
  min-height: 54px !important;
  margin-top: 2px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
}

/* ---------- Tablet floating actions: never overlap ---------- */
html.dak-tablet .dak-ai-bubble {
  right: max(24px, env(safe-area-inset-right)) !important;
  bottom: max(26px, calc(env(safe-area-inset-bottom) + 18px)) !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 19px !important;
}
html.dak-tablet .dak-ai-bubble .dak-bot-mark,
html.dak-tablet .dak-ai-bubble svg { width: 36px !important; height: 36px !important; }
html.dak-tablet .back-to-top {
  right: max(27px, env(safe-area-inset-right)) !important;
  bottom: max(102px, calc(env(safe-area-inset-bottom) + 94px)) !important;
  width: 50px !important;
  height: 50px !important;
  border-radius: 15px !important;
}
html.dak-tablet .wa-fab,
html.dak-tablet[dir="rtl"] .wa-fab {
  left: max(24px, env(safe-area-inset-left)) !important;
  right: auto !important;
  bottom: max(26px, calc(env(safe-area-inset-bottom) + 18px)) !important;
  width: 56px !important;
  height: 56px !important;
}

/* ---------- Tablet calendar ---------- */
html.dak-tablet .calendar-view-switch {
  width: min(620px, 100%) !important;
  margin: 0 auto 20px !important;
  padding: 5px !important;
  gap: 5px !important;
  border-radius: 16px !important;
}
html.dak-tablet .calendar-view-tab {
  min-width: 0 !important;
  min-height: 50px !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  border-radius: 12px !important;
  white-space: normal !important;
}
html.dak-tablet .calendar-shell {
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  min-width: 0 !important;
}
html.dak-tablet .calendar-board {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 22px !important;
  border-radius: 20px !important;
  overflow: hidden !important;
}
html.dak-tablet .calendar-topline {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  margin: 0 0 20px !important;
  padding: 2px 0 18px !important;
  text-align: center !important;
}
html.dak-tablet .calendar-brand {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(150px,190px) minmax(0,1fr) !important;
  gap: 20px !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
}
html.dak-tablet[dir="rtl"] .calendar-brand { grid-template-columns: minmax(0,1fr) minmax(150px,190px) !important; }
html.dak-tablet .calendar-official-logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
}
html.dak-tablet .calendar-brand img {
  width: 100% !important;
  max-width: 185px !important;
  height: auto !important;
  max-height: 62px !important;
  object-fit: contain !important;
}
html.dak-tablet .calendar-brand-copy {
  min-width: 0 !important;
  text-align: start !important;
}
html.dak-tablet[dir="rtl"] .calendar-brand-copy { text-align: right !important; }
html.dak-tablet .calendar-brand-title {
  margin: 0 0 6px !important;
  font-size: 30px !important;
  line-height: 1.08 !important;
  white-space: normal !important;
}
html.dak-tablet .calendar-brand-copy .section-label {
  display: block !important;
  margin: 0 !important;
  font-size: 10.5px !important;
  line-height: 1.5 !important;
  letter-spacing: .14em !important;
  text-align: inherit !important;
  white-space: normal !important;
}
html.dak-tablet .calendar-year-pill {
  min-width: 0 !important;
  width: auto !important;
  padding: 10px 18px !important;
  border-radius: 12px !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
  align-self: center !important;
}
html.dak-tablet .month-grid {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 14px !important;
  min-width: 0 !important;
}
html.dak-tablet .month-card { min-width: 0 !important; overflow: hidden !important; }
html.dak-tablet .month-head {
  grid-template-columns: minmax(0,1fr) 104px !important;
  gap: 7px !important;
  min-height: 54px !important;
  padding: 8px 10px !important;
}
html.dak-tablet[dir="rtl"] .month-head { grid-template-columns: 104px minmax(0,1fr) !important; }
html.dak-tablet .school-days { width: 104px !important; font-size: 10.5px !important; }
html.dak-tablet .mini-cal { width: 100% !important; table-layout: fixed !important; }
html.dak-tablet .mini-cal th { font-size: 9px !important; padding: 7px 0 !important; }
html.dak-tablet .mini-cal td { height: 30px !important; font-size: 12px !important; }
html.dak-tablet .key-panel {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 14px !important;
  min-width: 0 !important;
}
html.dak-tablet .key-card { min-width: 0 !important; padding: 18px !important; }
html.dak-tablet .summary-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
}
html.dak-tablet .summary-table th,
html.dak-tablet .summary-table td {
  padding: 8px 5px !important;
  font-size: 10.5px !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
html.dak-tablet .events-calendar { width: 100% !important; max-width: 100% !important; overflow: hidden !important; }
html.dak-tablet .events-calendar-head { grid-template-columns: minmax(0,1fr) auto !important; gap: 16px !important; padding: 24px !important; }
html.dak-tablet .events-body { grid-template-columns: 1fr !important; }
html.dak-tablet .events-side { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 14px !important; }
html.dak-tablet .month-strip { max-width: 100% !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }

/* ---------- Tablet assistant window ---------- */
html.dak-tablet .dak-ai-chat.dak-v4 {
  right: max(24px, env(safe-area-inset-right)) !important;
  bottom: max(24px, calc(env(safe-area-inset-bottom) + 16px)) !important;
  width: min(430px, calc(100vw - 48px)) !important;
  height: min(640px, calc(100dvh - 72px)) !important;
  min-height: 500px !important;
  border-radius: 24px !important;
}
html.dak-tablet .dak-v4-header { min-height: 66px !important; padding: 11px 12px !important; }
html.dak-tablet .dak-ai-messages.dak-v4-messages { padding: 16px !important; }
html.dak-tablet .dak-v4-topic-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }
html.dak-tablet .dak-v4-topic { min-height: 72px !important; }
html.dak-tablet .dak-v4-composer textarea { font-size: 16px !important; }

/* ---------- General tablet overflow / touch QA ---------- */
html.dak-tablet body { overflow-x: hidden !important; }
html.dak-tablet :is(.container,.calendar-shell,.calendar-board,.month-grid,.key-panel,.journey-premium-card,.journey-form-panel,.journey-story-panel,.events-calendar,.events-body) { min-width: 0 !important; }
html.dak-tablet :is(input,select,textarea,button,a) { -webkit-tap-highlight-color: transparent; }
html.dak-tablet :is(input,select,textarea) { font-size: 16px; }

@media (max-width: 820px) {
  html.dak-tablet .calendar-brand {
    grid-template-columns: 150px minmax(0,1fr) !important;
    gap: 14px !important;
  }
  html.dak-tablet[dir="rtl"] .calendar-brand { grid-template-columns: minmax(0,1fr) 150px !important; }
  html.dak-tablet .calendar-brand img { max-width: 150px !important; }
  html.dak-tablet .calendar-brand-title { font-size: 27px !important; }
  html.dak-tablet .calendar-brand-copy .section-label { font-size: 9.5px !important; }
  html.dak-tablet .key-panel { grid-template-columns: 1fr !important; }
  html.dak-tablet .events-side { grid-template-columns: 1fr !important; }
}

@media (max-width: 740px) {
  /* If a small tablet reports a narrow CSS viewport, keep the calendar readable. */
  html.dak-tablet .month-grid { grid-template-columns: 1fr !important; }
}

/* ---------- Assistant focus mode: keep floating controls out of the conversation ---------- */
@media (max-width: 767px) {
  body.dak-chat-open .back-to-top,
  body.dak-chat-open .wa-fab,
  body.dak-chat-open .wa-menu {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

html.dak-tablet body.dak-chat-open {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
html.dak-tablet body.dak-chat-open::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 10010;
  background: rgba(8,20,36,.28);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
html.dak-tablet body.dak-chat-open .back-to-top,
html.dak-tablet body.dak-chat-open .wa-fab,
html.dak-tablet body.dak-chat-open .wa-menu {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ---------- Tablet tables: never create page-level horizontal overflow ---------- */
html.dak-tablet :is(.home-adm-table-wrap,.age-table-wrap,.responsive-table-shell,.table-wrap) {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-inline: contain !important;
}
html.dak-tablet :is(.age-table,.home-adm-age-table) {
  min-width: 620px !important;
  width: max-content !important;
  max-width: none !important;
}


/* DAK CSS: tablet-laptop-header.css */
/* ======================================================================
   DAK iPad / Tablet Header — Laptop-style navigation
   2026-09-23
   Applies only when tablet-detect.js adds html.dak-tablet.
   Desktop/laptop and phone layouts are intentionally untouched.
   ====================================================================== */

html.dak-tablet #navbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 9000 !important;
  width: 100% !important;
  min-height: 126px !important;
  height: auto !important;
  padding: 12px 18px 10px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 8px 12px !important;
  background: rgba(255,255,255,.985) !important;
  border-bottom: 1px solid rgba(26,35,50,.09) !important;
  box-shadow: 0 8px 24px rgba(15,38,61,.055) !important;
  overflow: visible !important;
}

html.dak-tablet #navbar .logo {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  height: 58px !important;
  line-height: 0 !important;
}
html.dak-tablet #navbar .logo img {
  display: block !important;
  width: auto !important;
  height: 58px !important;
  max-width: min(300px, 44vw) !important;
  max-height: 58px !important;
  object-fit: contain !important;
}

/* No mobile drawer on iPad/tablet: all navigation is visible like laptop. */
html.dak-tablet #navbar .hamburger {
  display: none !important;
}
html.dak-tablet .mobile-menu,
html.dak-tablet .mobile-menu.open,
html.dak-tablet .mobile-menu-backdrop,
html.dak-tablet .mobile-menu-backdrop.is-open {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

html.dak-tablet #navbar .nav-links {
  order: 3 !important;
  position: static !important;
  display: flex !important;
  flex: 1 0 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 2px 0 0 !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 4px 5px !important;
  overflow: visible !important;
}

html.dak-tablet #navbar .nav-links > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 6px 9px !important;
  border-radius: 8px !important;
  color: var(--text, #1A2332) !important;
  font-size: 11.4px !important;
  font-weight: 650 !important;
  line-height: 1.18 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
html.dak-tablet #navbar .nav-links > a:not(.nav-portal-btn):hover,
html.dak-tablet #navbar .nav-links > a:not(.nav-portal-btn):focus-visible {
  background: var(--gray, #F5F7FA) !important;
  color: var(--purple, #6B3FA0) !important;
}

html.dak-tablet #navbar .nav-links > a.nav-portal-btn,
html.dak-tablet #navbar .nav-links > a.nav-portal-btn:visited {
  color: #fff !important;
  background: linear-gradient(135deg,#6B3FA0 0%,#7B4CC4 100%) !important;
  border: 1px solid rgba(107,63,160,.28) !important;
  box-shadow: 0 5px 13px rgba(107,63,160,.11) !important;
  padding-inline: 10px !important;
}

/* Laptop-style appearance and language controls stay at the top right. */
html.dak-tablet #navbar .nav-links > .theme-control--desktop,
html.dak-tablet #navbar .nav-links > .lang-toggle {
  display: inline-flex !important;
  position: absolute !important;
  top: 14px !important;
  z-index: 2 !important;
}
html.dak-tablet #navbar .nav-links > .theme-control--desktop {
  inset-inline-end: 96px !important;
  margin: 0 !important;
}
html.dak-tablet #navbar .theme-trigger {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  border: 1px solid rgba(26,35,50,.13) !important;
  background: #fff !important;
  box-shadow: 0 5px 16px rgba(26,35,50,.06) !important;
}
html.dak-tablet #navbar .theme-trigger-text,
html.dak-tablet #navbar .theme-trigger-chevron {
  display: none !important;
}
html.dak-tablet #navbar .theme-trigger-icon,
html.dak-tablet #navbar .theme-trigger-icon svg {
  width: 21px !important;
  height: 21px !important;
}

html.dak-tablet #navbar .nav-links > .lang-toggle {
  inset-inline-end: 18px !important;
  min-width: 70px !important;
  width: 70px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 9px !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  border: 1px solid rgba(26,35,50,.13) !important;
  background: #fff !important;
  color: var(--navy, #1A2332) !important;
  box-shadow: 0 5px 16px rgba(26,35,50,.06) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
html.dak-tablet #navbar .nav-links > .lang-toggle .lang-toggle-track {
  display: none !important;
}
html.dak-tablet #navbar .nav-links > .lang-toggle .lang-toggle-label {
  display: inline !important;
}

/* Dark theme keeps the exact same geometry. */
html.dak-tablet[data-theme="dark"] #navbar {
  background: rgba(12,25,40,.985) !important;
  border-bottom-color: rgba(255,255,255,.10) !important;
  box-shadow: 0 8px 26px rgba(0,0,0,.20) !important;
}
html.dak-tablet[data-theme="dark"] #navbar .nav-links > a:not(.nav-portal-btn) {
  color: #eef4f8 !important;
}
html.dak-tablet[data-theme="dark"] #navbar .theme-trigger,
html.dak-tablet[data-theme="dark"] #navbar .nav-links > .lang-toggle {
  background: #14243a !important;
  color: #eef4f8 !important;
  border-color: rgba(255,255,255,.13) !important;
}

/* Larger iPads can use a true single-row laptop header. */
@media (min-width: 1000px) {
  html.dak-tablet #navbar {
    min-height: 82px !important;
    height: 82px !important;
    padding: 0 14px !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
  }
  html.dak-tablet #navbar .logo {
    height: 58px !important;
  }
  html.dak-tablet #navbar .logo img {
    height: 58px !important;
    max-height: 58px !important;
    max-width: 238px !important;
  }
  html.dak-tablet #navbar .nav-links {
    order: initial !important;
    position: static !important;
    flex: 1 1 auto !important;
    width: auto !important;
    margin-inline-start: auto !important;
    padding: 0 !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    gap: 1px !important;
  }
  html.dak-tablet #navbar .nav-links > a {
    min-height: 32px !important;
    padding: 5px 5px !important;
    font-size: 10.1px !important;
  }
  html.dak-tablet #navbar .nav-links > a.nav-portal-btn {
    padding-inline: 7px !important;
  }
  html.dak-tablet #navbar .nav-links > .theme-control--desktop,
  html.dak-tablet #navbar .nav-links > .lang-toggle {
    position: static !important;
    inset: auto !important;
    flex: 0 0 auto !important;
  }
  html.dak-tablet #navbar .theme-trigger {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 10px !important;
  }
  html.dak-tablet #navbar .nav-links > .lang-toggle {
    width: 62px !important;
    min-width: 62px !important;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 10px !important;
    padding-inline: 7px !important;
    font-size: 11px !important;
  }
}

/* Intermediate iPads: keep all links visible and readable without a drawer. */
@media (min-width: 700px) and (max-width: 999px) {
  html.dak-tablet #navbar .nav-links {
    padding-inline: 2px !important;
  }
  html.dak-tablet #navbar .nav-links > a {
    font-size: 11.2px !important;
    padding-inline: 8px !important;
  }
}

/* ======================================================================
   iPad logo visibility hard-fix
   Only one official lockup may be visible at a time. The generic tablet
   image rule above intentionally sizes logo images, but must not override
   the light/dark visibility rules from dark-mode.css.
   ====================================================================== */
html.dak-tablet #navbar .logo .logo-light {
  display: block !important;
}
html.dak-tablet #navbar .logo .logo-dark {
  display: none !important;
}
html.dak-tablet[data-theme="dark"] #navbar .logo .logo-light {
  display: none !important;
}
html.dak-tablet[data-theme="dark"] #navbar .logo .logo-dark {
  display: block !important;
}


/* ======================================================================
   iPad calendar/header single-row compact fix
   Keep all top navigation items on one row on iPad landscape and wide
   tablet widths, especially on Calendar where long labels + portals used
   to wrap into a second line.
   ====================================================================== */
@media (min-width: 1000px) and (max-width: 1199px) {
  html.dak-tablet #navbar {
    min-height: 76px !important;
    height: 76px !important;
    padding: 0 10px !important;
    gap: 6px !important;
  }
  html.dak-tablet #navbar .logo {
    height: 50px !important;
  }
  html.dak-tablet #navbar .logo img {
    height: 50px !important;
    max-height: 50px !important;
    max-width: 180px !important;
  }
  html.dak-tablet #navbar .nav-links {
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    overflow: visible !important;
  }
  html.dak-tablet #navbar .nav-links > a {
    min-height: 30px !important;
    padding: 4px 4px !important;
    font-size: 9.2px !important;
    letter-spacing: -0.01em !important;
  }
  html.dak-tablet #navbar .nav-links > a.nav-portal-btn {
    padding-inline: 6px !important;
    border-radius: 8px !important;
  }
  html.dak-tablet #navbar .theme-trigger {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }
  html.dak-tablet #navbar .nav-links > .lang-toggle {
    width: 56px !important;
    min-width: 56px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding-inline: 6px !important;
    font-size: 10px !important;
  }
}


/* ======================================================================
   iPad Calendar — keep both portal buttons on one line
   Prevents "Portal" from wrapping below the campus name.
   Calendar page/tablet only.
   ====================================================================== */
@media (min-width: 700px) and (max-width: 1199px) {
  html.dak-tablet body.page-calendar #navbar .nav-links > a.nav-portal-btn,
  html.dak-tablet body.page-calendar #navbar .nav-links > a.nav-portal-btn:visited {
    flex: 0 0 auto !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    text-wrap: nowrap !important;
    line-height: 1 !important;
  }
}

/* Give the portals a little extra room on common iPad landscape widths
   without changing the approved laptop/desktop header. */
@media (min-width: 1000px) and (max-width: 1199px) {
  html.dak-tablet body.page-calendar #navbar .nav-links {
    column-gap: 0 !important;
  }
  html.dak-tablet body.page-calendar #navbar .nav-links > a.nav-portal-btn {
    padding-inline: 6px !important;
    font-size: 9px !important;
  }
}


/* DAK CSS: tablet-final-refinement.css */
/* ======================================================================
   DAK iPad / Tablet Final Refinement — 2026-09-23
   Tablet-only. Keeps approved phone + laptop/desktop layouts untouched.
   ====================================================================== */

/* ---------- Journey: retain the polished laptop visual language ---------- */
html.dak-tablet .journey-premium-card {
  max-width: 1080px !important;
  margin: 34px auto 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  background: rgba(255,255,255,.82) !important;
  border: 1px solid rgba(26,35,50,.08) !important;
  box-shadow: 0 24px 62px rgba(26,35,50,.10) !important;
}

html.dak-tablet .journey-story-panel {
  padding: 40px 40px 34px !important;
  min-height: 450px !important;
}
html.dak-tablet .journey-story-top { margin-bottom: 28px !important; }
html.dak-tablet .journey-story-panel h3 {
  max-width: 560px !important;
  font-size: clamp(31px,4.2vw,40px) !important;
  line-height: 1.08 !important;
  margin-bottom: 12px !important;
}
html.dak-tablet .journey-story-panel p {
  max-width: 610px !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin-bottom: 18px !important;
}

/* Undo the generic <=980px stacked-road treatment on real tablets. */
html.dak-tablet .glowing-journey-path {
  min-height: 238px !important;
  margin-top: 18px !important;
  padding: 0 !important;
  border-radius: 26px !important;
}
html.dak-tablet .journey-road {
  display: block !important;
  inset: 16px 18px 18px !important;
  width: calc(100% - 36px) !important;
  height: calc(100% - 34px) !important;
}
html.dak-tablet .journey-moving-light { display: block !important; }
html.dak-tablet .journey-road-step {
  position: absolute !important;
  width: 142px !important;
  margin: 0 !important;
  display: block !important;
  padding: 13px 13px 14px !important;
  border-radius: 20px !important;
  transform: none !important;
}
html.dak-tablet .journey-road-step .road-icon {
  margin: 0 0 9px !important;
  flex: none !important;
}
html.dak-tablet .journey-road-step.step-start {
  left: 20px !important;
  right: auto !important;
  bottom: 20px !important;
  top: auto !important;
}
html.dak-tablet .journey-road-step.step-grow {
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translate(-50%,-50%) !important;
}
html.dak-tablet .journey-road-step.step-grad {
  right: 20px !important;
  left: auto !important;
  top: 20px !important;
  bottom: auto !important;
}
html.dak-tablet[dir="rtl"] .journey-road-step.step-start,
html.dak-tablet[lang="ar"] .journey-road-step.step-start {
  right: 20px !important;
  left: auto !important;
}
html.dak-tablet[dir="rtl"] .journey-road-step.step-grad,
html.dak-tablet[lang="ar"] .journey-road-step.step-grad {
  left: 20px !important;
  right: auto !important;
}
html.dak-tablet .journey-path-pills {
  margin-top: 18px !important;
  justify-content: center !important;
  gap: 9px !important;
}

/* Laptop-like two-panel layout where tablet width genuinely allows it. */
@media (min-width: 1000px) {
  html.dak-tablet .journey-premium-card {
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.82fr) !important;
  }
  html.dak-tablet .journey-story-panel,
  html.dak-tablet .journey-form-panel {
    min-height: 100% !important;
  }
}
@media (max-width: 999px) {
  html.dak-tablet .journey-premium-card { grid-template-columns: 1fr !important; }
}

/* ---------- Journey form: clean labels, no overlap, comfortable fields ---------- */
html.dak-tablet .journey-form-panel {
  padding: 34px 36px 36px !important;
}
html.dak-tablet .journey-form-panel::before { display: none !important; }
html.dak-tablet .journey-form-head {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 0 0 24px !important;
  padding: 0 0 20px !important;
}
html.dak-tablet .journey-form-icon {
  width: 50px !important;
  height: 50px !important;
  min-width: 50px !important;
  flex: 0 0 50px !important;
}
html.dak-tablet .journey-form-head strong {
  font-size: 22px !important;
  line-height: 1.12 !important;
  margin: 0 0 5px !important;
}
html.dak-tablet .journey-form-head small {
  font-size: 13px !important;
  line-height: 1.5 !important;
}
html.dak-tablet .journey-premium-inputs,
html.dak-tablet .journey-inputs {
  display: grid !important;
  grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr) !important;
  gap: 20px 18px !important;
  align-items: start !important;
}
html.dak-tablet .journey-premium-inputs .wide,
html.dak-tablet .journey-premium-btn,
html.dak-tablet .journey-input-group:first-child {
  grid-column: 1 / -1 !important;
}
html.dak-tablet .journey-input-group,
html.dak-tablet .journey-dob-field,
html.dak-tablet .journey-grade-field {
  position: static !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  align-self: start !important;
}
html.dak-tablet .journey-input-group label,
html.dak-tablet .journey-dob-field label,
html.dak-tablet .journey-grade-field label {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  text-align: start !important;
  white-space: normal !important;
}
html.dak-tablet .journey-premium-inputs input,
html.dak-tablet .journey-premium-inputs select,
html.dak-tablet .journey-premium-inputs input[type="date"] {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 58px !important;
  min-height: 58px !important;
  max-height: 58px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 15px !important;
  box-sizing: border-box !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
html.dak-tablet .journey-premium-inputs select:disabled {
  opacity: 1 !important;
  -webkit-text-fill-color: currentColor !important;
}
html.dak-tablet .journey-premium-btn {
  min-height: 56px !important;
  margin: 0 !important;
  border-radius: 15px !important;
  font-size: 15px !important;
}

@media (max-width: 760px) {
  html.dak-tablet .journey-form-panel { padding: 30px 26px 32px !important; }
  html.dak-tablet .journey-premium-inputs,
  html.dak-tablet .journey-inputs { grid-template-columns: 1fr !important; }
  html.dak-tablet .journey-dob-field,
  html.dak-tablet .journey-grade-field { grid-column: 1 / -1 !important; }
}

/* ---------- Tablet footer: compact, laptop-like, no white wedges ---------- */
html.dak-tablet .newsletter {
  margin: 0 !important;
  padding-bottom: 0 !important;
  background: linear-gradient(135deg,#10263d 0%,#15283c 54%,#241d3a 100%) !important;
}
html.dak-tablet .newsletter-card {
  margin-bottom: 0 !important;
}
html.dak-tablet .newsletter + .footer,
html.dak-tablet .footer {
  margin-top: 0 !important;
  border-radius: 0 !important;
}
html.dak-tablet .footer {
  padding: 34px 30px 24px !important;
  overflow: hidden !important;
}
html.dak-tablet .footer-grid {
  width: min(100%,1120px) !important;
  grid-template-columns: minmax(0,1.45fr) minmax(150px,.75fr) minmax(150px,.75fr) !important;
  gap: 32px !important;
  margin: 0 auto 22px !important;
  align-items: start !important;
}
html.dak-tablet .footer-grid > div:first-child,
html.dak-tablet .footer-col {
  min-width: 0 !important;
}
html.dak-tablet .footer-brand-name { font-size: 19px !important; margin-bottom: 9px !important; }
html.dak-tablet .footer-brand-name span { font-size: 10.5px !important; }
html.dak-tablet .footer-desc {
  font-size: 12.5px !important;
  line-height: 1.58 !important;
  margin-bottom: 12px !important;
  max-width: 480px !important;
}
html.dak-tablet .footer-contact {
  font-size: 12.5px !important;
  line-height: 1.75 !important;
}
html.dak-tablet .footer-col h4 {
  margin-bottom: 12px !important;
  font-size: 11px !important;
}
html.dak-tablet .footer-col ul li { margin-bottom: 7px !important; }
html.dak-tablet .footer-col ul li a { font-size: 12.5px !important; }
html.dak-tablet .footer-bottom {
  width: min(100%,1120px) !important;
  margin: 0 auto !important;
  padding-top: 17px !important;
  gap: 12px 20px !important;
  font-size: 11.5px !important;
  flex-wrap: wrap !important;
}
html.dak-tablet .footer-bottom-links {
  gap: 14px !important;
  flex-wrap: wrap !important;
}
html.dak-tablet .footer-bottom-links a { font-size: 11.5px !important; }

@media (max-width: 900px) {
  html.dak-tablet .footer { padding: 30px 26px 22px !important; }
  html.dak-tablet .footer-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 24px 30px !important;
  }
  html.dak-tablet .footer-grid > div:first-child {
    grid-column: 1 / -1 !important;
  }
  html.dak-tablet .footer-bottom {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }
}


/* ======================================================================
   DAK iPad / Tablet Journey Form Clean Fix — 2026-09-23
   Final tablet-only override. Keeps phone and laptop/desktop untouched.
   ====================================================================== */
html.dak-tablet .journey-premium-inputs,
html.dak-tablet .journey-inputs {
  grid-template-columns: minmax(0,1fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
}
html.dak-tablet .journey-premium-inputs .wide,
html.dak-tablet .journey-premium-inputs .compact,
html.dak-tablet .journey-dob-field,
html.dak-tablet .journey-grade-field,
html.dak-tablet .journey-premium-btn,
html.dak-tablet .journey-input-group:first-child {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
}
html.dak-tablet .journey-input-group,
html.dak-tablet .journey-dob-field,
html.dak-tablet .journey-grade-field {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  gap: 7px !important;
  min-width: 0 !important;
  width: 100% !important;
  align-items: stretch !important;
}
html.dak-tablet .journey-input-group label,
html.dak-tablet .journey-dob-field label,
html.dak-tablet .journey-grade-field label {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13.5px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
html.dak-tablet .journey-premium-inputs input,
html.dak-tablet .journey-premium-inputs input[type="date"],
html.dak-tablet .journey-premium-inputs select {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
  font-size: 16px !important;
  line-height: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html.dak-tablet .journey-premium-inputs select {
  padding-inline-end: 44px !important;
}
html.dak-tablet .journey-premium-inputs select:disabled {
  opacity: .9 !important;
  cursor: default !important;
}
html.dak-tablet .journey-premium-btn {
  min-height: 56px !important;
  height: auto !important;
  margin-top: 2px !important;
  padding: 14px 18px !important;
  border-radius: 15px !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
}
/* Give the tablet form its own calm readable measure. */
html.dak-tablet .journey-form-panel {
  min-width: 0 !important;
}
@media (max-width: 999px) {
  html.dak-tablet .journey-form-panel {
    padding: 30px 30px 32px !important;
  }
}
@media (max-width: 780px) {
  html.dak-tablet .journey-form-panel {
    padding: 28px 24px 30px !important;
  }
  html.dak-tablet .journey-form-head strong {
    font-size: 21px !important;
  }
}

/* 2026-09-23 — iPad/tablet DOB value alignment polish */
html.dak-tablet #journeyDob {
  text-align: center !important;
  text-align-last: center !important;
  padding-inline: 46px !important;
  line-height: 56px !important;
}
html.dak-tablet #journeyDob::-webkit-date-and-time-value {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}
html.dak-tablet #journeyDob::-webkit-datetime-edit {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}
html.dak-tablet #journeyDob::-webkit-datetime-edit-fields-wrapper {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}
html.dak-tablet #journeyDob::-webkit-calendar-picker-indicator {
  margin: 0 !important;
}


/* DAK CSS: tablet-journey-stability.css */
/* DAK Tablet Journey Stability Fix — 2026-09-23
   Tablet-only. Prevents iPad form stretching, clipping and awkward field layout. */
html.dak-tablet .journey-premium-section,
html.dak-tablet .journey-premium-section .container {
  overflow-x: clip !important;
}

html.dak-tablet .journey-premium-card {
  width: calc(100% - 40px) !important;
  max-width: 1120px !important;
  min-width: 0 !important;
  margin: 30px auto 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

html.dak-tablet .journey-story-panel,
html.dak-tablet .journey-form-panel {
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* The form itself stays calm and readable on tablets. */
html.dak-tablet .journey-form-panel {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 30px 32px 32px !important;
}

html.dak-tablet .journey-form-head {
  margin: 0 0 22px !important;
  padding: 0 0 18px !important;
}

html.dak-tablet .journey-premium-inputs,
html.dak-tablet .journey-inputs {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 16px !important;
  width: 100% !important;
  min-width: 0 !important;
  align-items: stretch !important;
}

html.dak-tablet .journey-premium-inputs .wide,
html.dak-tablet .journey-premium-inputs .compact,
html.dak-tablet .journey-premium-btn,
html.dak-tablet .journey-input-group {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html.dak-tablet .journey-input-group,
html.dak-tablet .journey-dob-field,
html.dak-tablet .journey-grade-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  overflow: visible !important;
}

html.dak-tablet .journey-input-group label,
html.dak-tablet .journey-dob-field label,
html.dak-tablet .journey-grade-field label {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  text-align: start !important;
  white-space: normal !important;
}

html.dak-tablet .journey-premium-inputs input,
html.dak-tablet .journey-premium-inputs select,
html.dak-tablet .journey-premium-inputs input[type="date"] {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  margin: 0 !important;
  padding: 0 15px !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
  font-size: 16px !important;
  line-height: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html.dak-tablet .journey-premium-inputs input[type="date"] {
  -webkit-appearance: auto !important;
  appearance: auto !important;
  padding-inline: 14px !important;
}

html.dak-tablet .journey-premium-inputs select {
  padding-inline-end: 42px !important;
}

html.dak-tablet .journey-premium-btn {
  min-height: 56px !important;
  height: auto !important;
  margin: 2px 0 0 !important;
  padding: 13px 18px !important;
  border-radius: 14px !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
}

/* Portrait iPads: one calm vertical composition. */
@media (max-width: 899px) {
  html.dak-tablet .journey-premium-card {
    grid-template-columns: 1fr !important;
    width: calc(100% - 32px) !important;
  }
  html.dak-tablet .journey-story-panel {
    padding: 34px 30px 30px !important;
  }
  html.dak-tablet .journey-form-panel {
    padding: 28px 30px 30px !important;
  }
}

/* Landscape / larger tablets: use the laptop-style two-panel composition,
   while keeping the form controls stacked so they never crush each other. */
@media (min-width: 900px) {
  html.dak-tablet .journey-premium-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr) !important;
    gap: 0 !important;
  }
  html.dak-tablet .journey-story-panel {
    min-height: 100% !important;
    padding: 38px 36px 34px !important;
  }
  html.dak-tablet .journey-form-panel {
    min-height: 100% !important;
    padding: 34px 32px !important;
  }
}

html.dak-tablet[dir="rtl"] .journey-premium-inputs input,
html.dak-tablet[dir="rtl"] .journey-premium-inputs select,
html.dak-tablet[lang="ar"] .journey-premium-inputs input,
html.dak-tablet[lang="ar"] .journey-premium-inputs select {
  text-align: right !important;
}


/* DAK CSS: all-pages-phone-card-polish.css */

/* =================================================================
   DAK — ALL INNER PAGES PHONE CARD POLISH V1.3
   Phone only (<=620px). iPad / Tablet / Laptop / Desktop unchanged.
   Purpose: smaller, calmer, more consistent cards without harming
   readability, touch targets, tables, forms, or branded identities.
   ================================================================= */
@media (max-width:620px){

  body.dak-inner-page{
    --pc-radius:16px;
    --pc-radius-lg:18px;
    --pc-pad:15px;
    --pc-gap:10px;
    --pc-shadow:0 8px 22px rgba(26,35,50,.065);
  }

  /* ---------------------------------------------------------------
     Shared card rhythm
     --------------------------------------------------------------- */
  body.dak-inner-page :is(
    .team-general,
    .branch-detail,
    .home-adm-panel,
    .home-adm-card,
    .step-card,
    .dress-card,
    .faq-item,
    .calendar-board,
    .month-card,
    .key-card,
    .events-calendar,
    .event-item,
    .contact-form-card,
    .office-hours-card,
    .map-card,
    .info-card,
    .facility-card,
    .bus-card,
    .pa-route-box,
    .pa-route-card,
    .pa-route-mini,
    .pa-workspace,
    .pa-question-wrap,
    .pa-option,
    .pa-result-card,
    .pa-result-section,
    .pa-official-resource,
    .pa-ig-verified,
    .pa-verified-section,
    .fv-form,
    .fv-result,
    .fv-poster-frame,
    .prog-full-card,
    .subject-item,
    .curriculum-card,
    .credential-card,
    .error-card
  ){
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  body.dak-inner-page :is(
    .team-general,
    .branch-detail,
    .home-adm-panel,
    .step-card,
    .dress-card,
    .faq-item,
    .month-card,
    .key-card,
    .contact-form-card,
    .office-hours-card,
    .map-card,
    .info-card,
    .facility-card,
    .bus-card,
    .pa-route-box,
    .pa-route-card,
    .pa-workspace,
    .pa-question-wrap,
    .pa-result-card,
    .pa-result-section,
    .pa-official-resource,
    .pa-verified-section,
    .fv-form,
    .fv-result,
    .prog-full-card,
    .curriculum-card,
    .credential-card,
    .error-card
  ){
    border-radius:var(--pc-radius-lg) !important;
    box-shadow:var(--pc-shadow) !important;
  }

  /* Touch devices should not jump on hover */
  body.dak-inner-page :is(
    .branch-detail,.home-adm-card,.step-card,.dress-card,.faq-item,
    .month-card,.key-card,.event-item,.info-card,.facility-card,.bus-card,
    .pa-route-card,.pa-route-mini,.pa-option,.pa-result-section,
    .subject-item,.curriculum-card,.credential-card
  ):hover{
    transform:none !important;
  }

  /* ---------------------------------------------------------------
     ABOUT — Mission / Values / Campuses
     --------------------------------------------------------------- */
  body.dak-inner-page .mission-grid{
    gap:10px !important;
  }
  body.dak-inner-page .mission-card{
    min-height:0 !important;
    padding:18px 16px !important;
    border-radius:17px !important;
  }
  body.dak-inner-page .mission-card h3{
    margin-bottom:8px !important;
    font-size:19px !important;
    line-height:1.18 !important;
  }
  body.dak-inner-page .mission-card > p{
    font-size:12.5px !important;
    line-height:1.58 !important;
  }
  body.dak-inner-page .mission-card.values .values-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    margin-top:14px !important;
  }
  body.dak-inner-page .mission-card.values .value-item{
    padding:4px 2px !important;
  }
  body.dak-inner-page .value-icon{
    margin-bottom:5px !important;
    font-size:22px !important;
  }
  body.dak-inner-page .value-title{
    font-size:11.5px !important;
  }
  body.dak-inner-page .value-desc{
    font-size:10.5px !important;
    line-height:1.45 !important;
  }
  body.dak-inner-page .team-general{
    margin-top:20px !important;
    padding:18px 16px !important;
  }
  body.dak-inner-page .team-general p{
    font-size:12.5px !important;
    line-height:1.65 !important;
  }
  body.dak-inner-page .branch-detail-grid{
    gap:11px !important;
    margin-top:28px !important;
  }
  body.dak-inner-page .branch-detail-header{
    min-height:118px !important;
    padding:19px 17px !important;
  }
  body.dak-inner-page .branch-detail-header h3{
    margin-bottom:5px !important;
    font-size:24px !important;
  }
  body.dak-inner-page .branch-detail-header p{
    font-size:10px !important;
  }
  body.dak-inner-page .branch-detail-body{
    padding:15px !important;
  }
  body.dak-inner-page .branch-detail-row{
    gap:5px !important;
    padding:11px 13px !important;
    box-sizing:border-box !important;
  }
  body.dak-inner-page .branch-detail-row strong{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    font-size:11px !important;
    line-height:1.4 !important;
  }
  body.dak-inner-page .branch-detail-row span{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    font-size:11.5px !important;
    line-height:1.52 !important;
    overflow-wrap:anywhere !important;
  }
  body.dak-inner-page .branch-detail-row a{
    display:inline !important;
    line-height:1.52 !important;
    overflow-wrap:anywhere !important;
  }

  /* ---------------------------------------------------------------
     ADMISSION REQUIREMENTS
     --------------------------------------------------------------- */
  body.dak-inner-page .home-adm-grid{
    gap:11px !important;
  }
  body.dak-inner-page .home-adm-panel{
    padding:16px !important;
  }
  body.dak-inner-page .home-adm-panel-top{
    margin-bottom:12px !important;
  }
  body.dak-inner-page .home-adm-panel-top h3{
    font-size:20px !important;
    line-height:1.16 !important;
  }
  body.dak-inner-page .home-adm-panel-top p{
    font-size:11.5px !important;
    line-height:1.55 !important;
  }
  body.dak-inner-page .home-adm-cards{
    gap:8px !important;
    margin-top:12px !important;
  }
  body.dak-inner-page .home-adm-card{
    gap:9px !important;
    padding:11px 12px !important;
    border-radius:13px !important;
    box-shadow:none !important;
  }
  body.dak-inner-page .home-adm-card span{
    margin-top:1px !important;
    font-size:16px !important;
  }
  body.dak-inner-page .home-adm-card strong{
    font-size:11.5px !important;
    line-height:1.45 !important;
  }
  body.dak-inner-page .home-adm-side-cta{
    gap:12px !important;
  }
  body.dak-inner-page .home-adm-cta-title{
    font-size:16px !important;
  }
  body.dak-inner-page .home-adm-cta-sub{
    font-size:11px !important;
    line-height:1.5 !important;
  }

  /* ---------------------------------------------------------------
     ADMISSIONS — Steps / Dress cards
     --------------------------------------------------------------- */
  body.dak-inner-page .steps-grid,
  body.dak-inner-page .dress-grid{
    gap:10px !important;
  }
  body.dak-inner-page .step-card,
  body.dak-inner-page .dress-card{
    min-height:0 !important;
    padding:16px 14px !important;
  }
  body.dak-inner-page .step-num{
    width:36px !important;
    height:36px !important;
    margin-bottom:9px !important;
    font-size:15px !important;
  }
  body.dak-inner-page .step-card h3,
  body.dak-inner-page .dress-card h3{
    margin-bottom:6px !important;
    font-size:16.5px !important;
    line-height:1.24 !important;
  }
  body.dak-inner-page .step-card p,
  body.dak-inner-page .dress-card p,
  body.dak-inner-page .dress-card li{
    font-size:11.5px !important;
    line-height:1.55 !important;
  }
  body.dak-inner-page .dress-card ul li{
    padding:6px 0 !important;
  }

  /* ---------------------------------------------------------------
     FAQ — tighter but touch-safe
     --------------------------------------------------------------- */
  body.dak-inner-page .faq-list{
    gap:8px !important;
  }
  body.dak-inner-page .faq-item{
    border-radius:14px !important;
    box-shadow:0 5px 16px rgba(26,35,50,.055) !important;
  }
  body.dak-inner-page .faq-question{
    min-height:58px !important;
    grid-template-columns:34px minmax(0,1fr) 30px !important;
    gap:9px !important;
    padding:11px 12px !important;
    font-size:12.5px !important;
    line-height:1.42 !important;
  }
  body.dak-inner-page .faq-num{
    width:34px !important;
    height:34px !important;
    border-radius:11px !important;
    font-size:10.5px !important;
  }
  body.dak-inner-page .faq-arrow{
    width:30px !important;
    height:30px !important;
    font-size:13px !important;
  }
  body.dak-inner-page .faq-answer{
    padding-left:55px !important;
    padding-right:12px !important;
    font-size:11.5px !important;
    line-height:1.62 !important;
  }
  body[dir="rtl"].dak-inner-page .faq-answer,
  html[dir="rtl"] body.dak-inner-page .faq-answer{
    padding-right:55px !important;
    padding-left:12px !important;
  }

  /* ---------------------------------------------------------------
     CALENDAR — cards only; table/grid logic preserved
     --------------------------------------------------------------- */
  body.dak-inner-page.page-calendar .calendar-shell{
    gap:12px !important;
  }
  body.dak-inner-page.page-calendar .calendar-board{
    padding:12px !important;
    border-radius:18px !important;
  }
  body.dak-inner-page.page-calendar .month-grid{
    gap:9px !important;
  }
  body.dak-inner-page.page-calendar .month-card{
    border-radius:14px !important;
    overflow:hidden !important;
  }
  body.dak-inner-page.page-calendar .month-head{
    padding:9px 10px !important;
  }
  body.dak-inner-page.page-calendar .month-title{
    font-size:14px !important;
  }
  body.dak-inner-page.page-calendar .month-eyebrow{
    font-size:8px !important;
  }
  body.dak-inner-page.page-calendar .month-note{
    padding:8px 9px !important;
    font-size:9px !important;
    line-height:1.4 !important;
  }
  body.dak-inner-page.page-calendar .key-panel{
    gap:9px !important;
  }
  body.dak-inner-page.page-calendar .key-card{
    padding:13px 12px !important;
    border-radius:14px !important;
  }
  body.dak-inner-page.page-calendar .key-date{
    font-size:12px !important;
  }
  body.dak-inner-page.page-calendar .key-text{
    font-size:10.5px !important;
    line-height:1.45 !important;
  }
  body.dak-inner-page.page-calendar .events-calendar{
    border-radius:16px !important;
  }
  body.dak-inner-page.page-calendar .events-calendar-head{
    gap:10px !important;
    padding:16px 14px !important;
  }
  body.dak-inner-page.page-calendar .events-title{
    font-size:23px !important;
  }
  body.dak-inner-page.page-calendar .events-subtitle{
    font-size:11px !important;
    line-height:1.5 !important;
  }
  body.dak-inner-page.page-calendar .events-body{
    gap:10px !important;
    padding:12px !important;
  }
  body.dak-inner-page.page-calendar .event-item{
    grid-template-columns:48px 30px minmax(0,1fr) !important;
    gap:6px !important;
    border-radius:12px !important;
    box-shadow:none !important;
  }
  body.dak-inner-page.page-calendar .event-symbol{
    width:29px !important;
    height:29px !important;
    border-radius:9px !important;
  }
  body.dak-inner-page.page-calendar .event-copy strong{
    font-size:11.5px !important;
    line-height:1.4 !important;
  }
  body.dak-inner-page.page-calendar .event-type{
    font-size:8px !important;
  }
  body.dak-inner-page.page-calendar .events-side{
    gap:9px !important;
  }

  /* ---------------------------------------------------------------
     CONTACT + CAMPUS DETAIL PAGES
     --------------------------------------------------------------- */
  body.dak-inner-page .contact-grid,
  body.dak-inner-page .info-grid{
    gap:11px !important;
  }
  body.dak-inner-page :is(.contact-form-card,.office-hours-card,.info-card){
    padding:17px 15px !important;
  }
  body.dak-inner-page .info-card h2,
  body.dak-inner-page .info-card h3,
  body.dak-inner-page .contact-form-card h2,
  body.dak-inner-page .office-hours-card h3{
    font-size:20px !important;
    line-height:1.18 !important;
  }
  body.dak-inner-page .info-card p{
    margin-bottom:12px !important;
    font-size:12px !important;
    line-height:1.58 !important;
  }
  body.dak-inner-page .info-row{
    gap:4px !important;
    padding:9px 0 !important;
  }
  body.dak-inner-page .info-row .lbl{
    font-size:10.5px !important;
  }
  body.dak-inner-page .info-row .val{
    font-size:11.5px !important;
    line-height:1.45 !important;
  }
  body.dak-inner-page .info-icon{
    width:38px !important;
    height:38px !important;
    border-radius:12px !important;
    font-size:17px !important;
  }
  body.dak-inner-page .map-card{
    border-radius:17px !important;
  }
  body.dak-inner-page .map-card iframe{
    height:230px !important;
  }
  body.dak-inner-page .map-open{
    min-height:44px !important;
    padding:10px 12px !important;
    font-size:10.5px !important;
  }
  body.dak-inner-page .hours-row-item{
    padding:12px 14px !important;
    gap:10px !important;
    font-size:11.5px !important;
    border-radius:15px !important;
    box-sizing:border-box !important;
  }
  body.dak-inner-page .hours-row-item strong{
    display:block !important;
    margin:0 !important;
    line-height:1.22 !important;
  }
  body.dak-inner-page .hours-row-item small{
    display:block !important;
    margin-top:4px !important;
    line-height:1.4 !important;
  }
  body.dak-inner-page .hours-row-item span{
    line-height:1.2 !important;
  }
  body.dak-inner-page .portal-big{
    min-height:44px !important;
    padding:9px 13px !important;
    font-size:11px !important;
  }
  body.dak-inner-page .portal-big::after{
    width:25px !important;
    height:25px !important;
    font-size:13px !important;
  }

  /* Contact office card remains fully usable */
  body.dak-inner-page .office-status-card{
    padding:14px !important;
    border-radius:16px !important;
  }
  body.dak-inner-page .office-status-title{
    font-size:13px !important;
  }
  body.dak-inner-page .office-status-note{
    font-size:10.5px !important;
  }
  body.dak-inner-page .office-status-actions{
    gap:7px !important;
  }
  body.dak-inner-page .office-status-action{
    min-height:42px !important;
    padding:8px 10px !important;
    font-size:10px !important;
  }

  /* ---------------------------------------------------------------
     FACILITIES
     --------------------------------------------------------------- */
  body.dak-inner-page .facilities-grid,
  body.dak-inner-page .bus-grid{
    gap:10px !important;
  }
  body.dak-inner-page .facility-card,
  body.dak-inner-page .bus-card{
    min-height:0 !important;
    padding:0 !important;
    border-radius:16px !important;
    overflow:hidden !important;
  }
  body.dak-inner-page .facility-header{
    padding:15px 14px !important;
  }
  body.dak-inner-page .facility-icon{
    width:38px !important;
    height:38px !important;
    border-radius:12px !important;
    font-size:18px !important;
  }
  body.dak-inner-page .facility-header h3{
    font-size:17px !important;
  }
  body.dak-inner-page .facility-body{
    padding:14px !important;
    font-size:11.5px !important;
    line-height:1.55 !important;
  }
  body.dak-inner-page .activity-chip{
    padding:5px 8px !important;
    font-size:9px !important;
  }

  /* ---------------------------------------------------------------
     STUDENT PATHWAY ADVISOR
     --------------------------------------------------------------- */
  body.dak-inner-page.pa-page .pa-shell{
    padding-left:14px !important;
    padding-right:14px !important;
  }
  body.dak-inner-page.pa-page .pa-route-box{
    padding:15px !important;
  }
  body.dak-inner-page.pa-page .pa-route-box-head{
    margin-bottom:11px !important;
  }
  body.dak-inner-page.pa-page .pa-route-box-title{
    font-size:21px !important;
  }
  body.dak-inner-page.pa-page .pa-route-mini{
    min-height:58px !important;
    gap:9px !important;
    padding:10px 11px !important;
    border-radius:14px !important;
  }
  body.dak-inner-page.pa-page .pa-route-mini-code{
    width:36px !important;
    height:36px !important;
    border-radius:11px !important;
    font-size:12px !important;
  }
  body.dak-inner-page.pa-page .pa-route-mini strong{
    font-size:11.5px !important;
  }
  body.dak-inner-page.pa-page .pa-route-mini small{
    font-size:9px !important;
  }
  body.dak-inner-page.pa-page .pa-route-grid{
    gap:10px !important;
  }
  body.dak-inner-page.pa-page .pa-route-card{
    min-height:0 !important;
    padding:16px 15px !important;
    border-radius:16px !important;
  }
  body.dak-inner-page.pa-page .pa-route-top{
    margin-bottom:13px !important;
  }
  body.dak-inner-page.pa-page .pa-route-tag{
    font-size:8.5px !important;
  }
  body.dak-inner-page.pa-page .pa-route-number{
    font-size:11px !important;
  }
  body.dak-inner-page.pa-page .pa-route-card h3{
    margin-bottom:7px !important;
    font-size:20px !important;
    line-height:1.12 !important;
  }
  body.dak-inner-page.pa-page .pa-route-card p{
    font-size:11px !important;
    line-height:1.5 !important;
  }
  body.dak-inner-page.pa-page .pa-route-meta{
    gap:5px !important;
    margin-top:11px !important;
  }
  body.dak-inner-page.pa-page .pa-route-meta span{
    padding:5px 7px !important;
    font-size:8.5px !important;
  }
  body.dak-inner-page.pa-page .pa-route-cta{
    min-height:42px !important;
    margin-top:12px !important;
    font-size:10px !important;
  }
  body.dak-inner-page.pa-page .pa-workspace{
    padding:13px !important;
  }
  body.dak-inner-page.pa-page .pa-workspace-top{
    gap:8px !important;
    margin-bottom:11px !important;
  }
  body.dak-inner-page.pa-page .pa-question-wrap{
    padding:15px !important;
    border-radius:16px !important;
  }
  body.dak-inner-page.pa-page .pa-question-title{
    font-size:20px !important;
    line-height:1.14 !important;
  }
  body.dak-inner-page.pa-page .pa-question-sub{
    font-size:11px !important;
    line-height:1.5 !important;
  }
  body.dak-inner-page.pa-page .pa-options{
    gap:8px !important;
  }
  body.dak-inner-page.pa-page .pa-option{
    min-height:52px !important;
    padding:10px 11px !important;
    border-radius:13px !important;
  }
  body.dak-inner-page.pa-page .pa-option strong{
    font-size:11.5px !important;
  }
  body.dak-inner-page.pa-page .pa-option small{
    font-size:9.5px !important;
    line-height:1.4 !important;
  }
  body.dak-inner-page.pa-page .pa-result-card{
    padding:15px !important;
  }
  body.dak-inner-page.pa-page .pa-result-grid{
    gap:9px !important;
  }
  body.dak-inner-page.pa-page .pa-result-section{
    padding:13px !important;
    border-radius:14px !important;
  }
  body.dak-inner-page.pa-page .pa-result-section h3{
    font-size:14px !important;
  }
  body.dak-inner-page.pa-page .pa-result-section :is(li,p){
    font-size:10.5px !important;
    line-height:1.5 !important;
  }
  body.dak-inner-page.pa-page .pa-mini-row{
    padding:8px 0 !important;
    font-size:10.5px !important;
  }
  body.dak-inner-page.pa-page .pa-official-resource{
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:10px !important;
    padding:13px !important;
  }
  body.dak-inner-page.pa-page .pa-official-resource-mark{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
  }
  body.dak-inner-page.pa-page .pa-ig-verified{
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:10px !important;
    padding:13px !important;
    border-radius:14px !important;
  }
  body.dak-inner-page.pa-page .pa-ig-verified-mark{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
  }
  body.dak-inner-page.pa-page .pa-ig-verified-copy strong{
    font-size:11.5px !important;
  }
  body.dak-inner-page.pa-page .pa-ig-verified-copy p{
    font-size:9.5px !important;
    line-height:1.5 !important;
  }
  body.dak-inner-page.pa-page .pa-source-actions,
  body.dak-inner-page.pa-page .pa-result-actions{
    gap:7px !important;
  }
  body.dak-inner-page.pa-page .pa-btn,
  body.dak-inner-page.pa-page .pa-source-link{
    min-height:42px !important;
    padding:8px 10px !important;
    font-size:9.5px !important;
  }

  /* ---------------------------------------------------------------
     FUTURE VISION
     --------------------------------------------------------------- */
  body.dak-inner-page .fv-wrap{
    gap:11px !important;
  }
  body.dak-inner-page .fv-form{
    padding:17px 15px !important;
    border-radius:17px !important;
  }
  body.dak-inner-page .fv-form-title{
    font-size:21px !important;
    line-height:1.16 !important;
  }
  body.dak-inner-page .fv-form-sub{
    font-size:11.5px !important;
    line-height:1.5 !important;
  }
  body.dak-inner-page .fv-field{
    margin-bottom:11px !important;
  }
  body.dak-inner-page .fv-label{
    margin-bottom:5px !important;
    font-size:10.5px !important;
  }
  body.dak-inner-page :is(.fv-input,.fv-select){
    min-height:44px !important;
    padding:9px 11px !important;
    border-radius:12px !important;
    font-size:16px !important; /* prevents iOS input zoom */
  }
  body.dak-inner-page .fv-dreams{
    gap:7px !important;
  }
  body.dak-inner-page .fv-dreams button{
    min-height:44px !important;
    padding:8px 9px !important;
    border-radius:12px !important;
    font-size:10px !important;
  }
  body.dak-inner-page .fv-generate-btn,
  body.dak-inner-page .fv-action-btn{
    min-height:44px !important;
    padding:9px 12px !important;
    font-size:10.5px !important;
  }
  body.dak-inner-page .fv-result{
    padding:14px !important;
    border-radius:17px !important;
  }
  body.dak-inner-page .fv-poster-frame{
    border-radius:16px !important;
  }

  /* ---------------------------------------------------------------
     PROGRAMMES — programme panels / subject / credentials
     --------------------------------------------------------------- */
  body.dak-inner-page .prog-tabs{
    gap:6px !important;
  }
  body.dak-inner-page .prog-tab{
    min-height:42px !important;
    padding:7px 10px !important;
    font-size:10px !important;
  }
  body.dak-inner-page .prog-full-card{
    border-radius:17px !important;
  }
  body.dak-inner-page .prog-full-left,
  body.dak-inner-page .prog-full-right{
    padding:17px 15px !important;
  }
  body.dak-inner-page .prog-full-left .icon{
    margin-bottom:10px !important;
    font-size:36px !important;
  }
  body.dak-inner-page .prog-full-left h2{
    font-size:22px !important;
  }
  body.dak-inner-page .prog-full-left p,
  body.dak-inner-page .prog-full-right p{
    font-size:11.5px !important;
    line-height:1.55 !important;
  }
  body.dak-inner-page .secondary-programmes{
    gap:5px !important;
    margin-bottom:10px !important;
  }
  body.dak-inner-page .secondary-programme{
    min-height:36px !important;
    padding:7px 9px !important;
    border-radius:10px !important;
    font-size:10px !important;
  }
  body.dak-inner-page .subject-grid{
    gap:7px !important;
    margin-bottom:18px !important;
  }
  body.dak-inner-page .subject-item{
    min-height:76px !important;
    padding:10px 8px !important;
    border-radius:12px !important;
    gap:7px !important;
    font-size:10.5px !important;
  }
  body.dak-inner-page .subject-item span{
    font-size:15px !important;
  }
  body.dak-inner-page .prog-features{
    margin-bottom:18px !important;
  }
  body.dak-inner-page .prog-features li{
    gap:7px !important;
    padding:6px 0 !important;
    font-size:10.5px !important;
    line-height:1.48 !important;
  }
  body.dak-inner-page .curriculum-grid{
    gap:9px !important;
  }
  body.dak-inner-page .curriculum-card,
  body.dak-inner-page .credential-card{
    min-height:0 !important;
    padding:14px !important;
    border-radius:16px !important;
  }
  body.dak-inner-page .credential-stage{
    min-height:118px !important;
    border-radius:13px !important;
  }
  body.dak-inner-page .credential-logo-frame{
    min-height:86px !important;
    padding:8px !important;
  }
  body.dak-inner-page .credential-copy{
    padding-top:11px !important;
  }
  body.dak-inner-page .credential-copy h3{
    font-size:16.5px !important;
    line-height:1.2 !important;
  }
  body.dak-inner-page .credential-copy p{
    font-size:10.5px !important;
    line-height:1.5 !important;
  }

  /* ---------------------------------------------------------------
     404 / simple utility cards
     --------------------------------------------------------------- */
  body.dak-inner-page .error-card{
    padding:20px 16px !important;
  }
}

/* Very narrow phones: small final trim, no squeezed controls. */
@media (max-width:360px){
  body.dak-inner-page .hours-row-item{
    padding:11px 12px !important;
  }

  body.dak-inner-page .branch-detail-row{
    padding-left:12px !important;
    padding-right:12px !important;
  }
  body.dak-inner-page :is(
    .mission-card,.team-general,.branch-detail-body,.home-adm-panel,
    .step-card,.dress-card,.contact-form-card,.office-hours-card,.info-card,
    .pa-route-card,.pa-question-wrap,.pa-result-card,.fv-form,.fv-result,
    .prog-full-left,.prog-full-right,.curriculum-card,.credential-card
  ){
    padding-left:13px !important;
    padding-right:13px !important;
  }

  body.dak-inner-page.pa-page .pa-route-card h3,
  body.dak-inner-page .prog-full-left h2{
    font-size:19px !important;
  }

  body.dak-inner-page.page-calendar .event-item{
    grid-template-columns:45px 28px minmax(0,1fr) !important;
  }
}


/* DAK CSS: site-life.css */
/* ================================================================
   DAK SITE LIFE V2.6
   Quiet page/scroll motion. No content is hidden if JavaScript fails.
   ================================================================ */
body.dak-life-ready{animation:dakLifePageSettle .32s ease-out}
.dak-life-watch.dak-life-inview{animation:dakLifeSectionIn .58s cubic-bezier(.2,.72,.2,1)}
@keyframes dakLifePageSettle{from{opacity:.985}to{opacity:1}}
@keyframes dakLifeSectionIn{from{opacity:.94;transform:translateY(8px)}to{opacity:1;transform:none}}

/* A very quiet ambient drift on large screens only; keeps mobile GPU work low. */
@media (min-width:701px) and (prefers-reduced-motion:no-preference){
  .dak-live-section::before{animation:dakLifeGridDrift 24s ease-in-out infinite alternate}
  .branches-section::before{animation:dakLifeGlowA 18s ease-in-out infinite alternate}
  .branches-section::after{animation:dakLifeGlowB 22s ease-in-out infinite alternate}
}
@keyframes dakLifeGridDrift{from{transform:translate3d(-5px,-3px,0)}to{transform:translate3d(7px,5px,0)}}
@keyframes dakLifeGlowA{from{transform:translate3d(-5px,0,0) scale(.98)}to{transform:translate3d(10px,8px,0) scale(1.04)}}
@keyframes dakLifeGlowB{from{transform:translate3d(5px,3px,0) scale(1)}to{transform:translate3d(-9px,-5px,0) scale(1.035)}}

/* Touch acknowledgement without changing layouts. */
@media (hover:none){
  :where(.branch-link,.ql-card,.dak-live-calendar-link,.dak-live-card-link,.dak-live-mini-link,.office-status-action):active{transform:scale(.985)}
}

@media (prefers-reduced-motion:reduce){
  body.dak-life-ready,.dak-life-watch.dak-life-inview{animation:none!important}
  .dak-live-section::before,.branches-section::before,.branches-section::after{animation:none!important}
}


/* DAK CSS: quality-production.css */
/* ================================================================
   DAK PRODUCTION QUALITY LAYER — V7.8
   Non-layout polish only. Keeps approved responsive geometry intact.
   ================================================================ */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
  font-kerning: normal;
  scroll-padding-top: 96px;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button,
input,
select,
textarea {
  font: inherit;
}

img,
svg {
  max-width: 100%;
}

img {
  image-rendering: auto;
}

a,
button,
[role="button"],
input,
select,
textarea {
  touch-action: manipulation;
}

::selection {
  background: rgba(0, 188, 212, .22);
  color: #142436;
}

html[data-theme="dark"] ::selection {
  background: rgba(0, 188, 212, .34);
  color: #ffffff;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(0, 188, 212, .48);
  outline-offset: 3px;
}

@supports (text-wrap: balance) {
  .hero-title,
  .page-title,
  .section-title,
  .branch-name,
  .journey-form-head strong,
  .pa-hero h1,
  .pa-intro-head h2,
  .fv-title,
  h1,
  h2 {
    text-wrap: balance;
  }
}

@media (min-width: 900px) {
  html {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 151, 167, .55) rgba(20, 36, 54, .06);
  }

  html::-webkit-scrollbar {
    width: 10px;
  }

  html::-webkit-scrollbar-track {
    background: rgba(20, 36, 54, .045);
  }

  html::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(0, 188, 212, .72), rgba(107, 63, 160, .64));
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
  }
}

@media (max-width: 899px) {
  html {
    scroll-padding-top: 82px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}