/* Intellecta shared mobile layout — version 124 */
*,*::before,*::after{box-sizing:border-box}
html{max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:88px}
body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}

@media (max-width:900px){
  :root{--mobile-gutter:clamp(16px,4.5vw,28px)}
  body{min-width:0}
  main,section,article,aside,header,footer,nav,div{min-width:0}
  .container,.shell,.page-shell,.account-shell,.admin-shell,.checkout-shell,.dashboard-shell,.section-inner,.footer-inner,.site-footer-inner{width:100%!important;max-width:100%!important;padding-left:var(--mobile-gutter)!important;padding-right:var(--mobile-gutter)!important}
  section{scroll-margin-top:82px}

  /* Comfortable, consistent touch targets. */
  button,.button,.btn,[class*="-button"],[class*="-btn"],a.primary,a.secondary,input:not([type="checkbox"]):not([type="radio"]),select,textarea{min-height:44px}
  button,.button,.btn,[class*="-button"],[class*="-btn"]{max-width:100%}
  input,select,textarea{width:100%;max-width:100%;font-size:16px}
  textarea{min-height:112px;resize:vertical}
  label{line-height:1.35}

  /* Header and mobile navigation. */
  .site-header,.topbar{position:sticky!important;top:0;z-index:1000}
  .navbar,.nav-inner,.header-inner{min-height:68px;padding-left:var(--mobile-gutter)!important;padding-right:var(--mobile-gutter)!important}
  .brand,.logo{min-width:0;max-width:calc(100% - 58px)}
  .brand img,.logo img{max-height:48px;width:auto}
  .menu-toggle{display:inline-grid!important;place-items:center;min-width:44px;min-height:44px}
  .navlinks{max-height:calc(100dvh - 68px);overflow-y:auto;overscroll-behavior:contain;padding-bottom:calc(18px + env(safe-area-inset-bottom))!important}
  .navlinks>a,.nav-group>button,.header-welcome,.header-signout,.admin-access-link{width:100%;min-height:48px;justify-content:flex-start!important;text-align:left}
  .nav-group{width:100%}
  .nav-group .dropdown{position:static!important;width:100%!important;min-width:0!important;max-width:none!important;box-shadow:none!important;margin:0!important}
  .header-user{width:100%;display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
  .header-signout{width:auto!important;white-space:nowrap}
  .header-cta{width:100%;justify-content:center!important}

  /* Forms, popups and dialogs. */
  form,.form-grid,.form-row,.field-row,.fields,.contact-grid,.booking-form-grid,.profile-form-grid{min-width:0}
  .form-grid,.field-row,.fields,.contact-grid,.booking-form-grid,.profile-form-grid{grid-template-columns:1fr!important}
  dialog,.modal,.modal-card,.dialog-card,.popup,.popup-card,[class*="modal-content"],[class*="dialog-content"]{max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px)!important;margin:auto!important;overflow:auto!important}
  dialog[open]{inset:12px!important;width:auto!important}
  .modal,.popup,[class*="modal-backdrop"]{padding:12px!important;align-items:center!important}
  .modal-actions,.dialog-actions,.form-actions,.button-row,.action-row,.actions{display:flex;flex-wrap:wrap;gap:10px}
  .modal-actions>* ,.dialog-actions>* ,.form-actions>*{flex:1 1 180px}

  /* Student dashboard and account areas. */
  .account-layout,.dashboard-layout,.dashboard-grid,.overview-grid,.student-overview,.student-summary-grid,.quick-actions,.service-grid,.purchase-grid,.booking-grid,.records-grid,.pathway-grid,.revision-grid,.achievement-grid,.badge-grid{grid-template-columns:1fr!important}
  .account-sidebar,.dashboard-sidebar{position:static!important;width:100%!important}
  .account-nav,.dashboard-nav,.admin-tabs{display:flex!important;overflow-x:auto;scroll-snap-type:x proximity;gap:8px;padding-bottom:8px;-webkit-overflow-scrolling:touch}
  .account-nav a,.dashboard-nav a,.admin-tabs button,.admin-tab{flex:0 0 auto;white-space:nowrap;scroll-snap-align:start}
  .account-panel,.dashboard-panel,.overview-card,.service-card,.purchase-card,.booking-card,.pathway-card,.revision-card,.achievement-card,.badge-card{padding:clamp(16px,4vw,24px)!important;border-radius:16px!important}
  .dashboard-heading,.panel-heading,.section-heading,.card-heading{align-items:flex-start!important;flex-wrap:wrap;gap:10px}
  .dashboard-heading h1,.page-title,h1{overflow-wrap:anywhere}
  .cancellation-form,.cancellation-request-form{grid-template-columns:1fr!important}
  .class-card,.booking-card,.purchase-record,.history-record{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}

  /* Access Manager: priority totals remain first and usable. */
  .admin-shell{padding-top:20px!important}
  .admin-header,.admin-toolbar,.admin-section-header,.manager-heading{align-items:flex-start!important;flex-wrap:wrap!important;gap:12px!important}
  .admin-overview,.admin-stats,.manager-stats,.schedule-stats,.summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .admin-grid,.manager-grid,.request-grid,.availability-grid,.promo-grid,.user-grid,.class-grid,.history-grid,.cancellation-grid{grid-template-columns:1fr!important}
  .admin-card,.request-card,.availability-card,.promo-card,.user-card,.class-card,.history-card,.cancellation-card{padding:16px!important}
  .admin-card-actions,.request-actions,.class-actions,.cancellation-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .admin-card-actions>*,.request-actions>*,.class-actions>*,.cancellation-actions>*{flex:1 1 160px}
  .google-calendar-card,.calendar-connection{order:99}

  /* Checkout, services and booking. */
  .checkout-layout,.checkout-grid,.payment-layout,.order-layout,.catalogue-grid,.services-grid,.plans-grid,.pricing-grid,.booking-layout,.calendar-layout{grid-template-columns:1fr!important}
  .order-summary,.checkout-summary,.sticky-summary{position:static!important;top:auto!important;width:100%!important}
  .checkout-card,.payment-card,.order-summary,.service-option,.pricing-card,.booking-panel,.calendar-panel{padding:clamp(16px,4vw,24px)!important;border-radius:16px!important}
  .calendar-toolbar,.calendar-header,.booking-toolbar{align-items:center!important;flex-wrap:wrap!important;gap:8px!important}
  .calendar-grid,.time-slots,.slot-grid{min-width:0!important}
  .time-slot,.slot-button{min-height:44px}
  .document-links,.checkout-actions,.booking-actions{display:grid!important;grid-template-columns:1fr!important}

  /* Home page, resources and simulations. */
  .hero,.hero-inner,.hero-grid,.intro-grid,.about-grid,.feature-grid,.service-paths,.simulation-grid,.subject-grid,.resource-grid,.footer-grid{grid-template-columns:1fr!important}
  .hero{min-height:auto!important;padding-top:clamp(42px,9vw,76px)!important;padding-bottom:clamp(42px,9vw,76px)!important}
  .hero-copy,.hero-content{max-width:100%!important}
  .hero-actions,.cta-actions{display:flex!important;flex-wrap:wrap!important;gap:10px!important}
  .hero-actions>*,.cta-actions>*{flex:1 1 190px;text-align:center;justify-content:center}
  .simulation-card,.subject-card,.resource-card,.feature-card,.service-card{padding:clamp(16px,4vw,24px)!important}
  .simulation-workspace,.lab-layout,.builder-layout,.practice-layout,.challenge-layout,.tool-layout{grid-template-columns:1fr!important}
  .simulation-controls,.lab-controls,.challenge-controls{position:static!important;width:100%!important}
  .simulation-toolbar,.challenge-toolbar,.practice-toolbar{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .simulation-toolbar>*,.challenge-toolbar>*,.practice-toolbar>*{flex:1 1 135px}
  .simulation-modal,.lab-modal{padding:8px!important}
  .simulation-modal .modal-card,.lab-modal .modal-card{width:100%!important;max-width:100%!important;border-radius:16px!important}

  /* Tools and data tables stay readable without widening the page. */
  .table-scroll,.table-wrap,.data-table-wrap,.periodic-table-wrap,[class*="table-container"]{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
  table{max-width:none}
  .converter-grid,.tools-grid,.periodic-layout,.scale-layout,.balance-layout{grid-template-columns:1fr!important}
  .tool-card,.converter-card,.periodic-panel{padding:16px!important}
  .periodic-table{min-width:760px}
  .isotope-notation{white-space:nowrap}

  footer{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
}

@media (max-width:600px){
  :root{--mobile-gutter:16px}
  html{scroll-padding-top:74px}
  h1{font-size:clamp(30px,10vw,44px)!important;line-height:1.08!important}
  h2{font-size:clamp(24px,7vw,34px)!important;line-height:1.16!important}
  h3{line-height:1.25}
  p,li{overflow-wrap:anywhere}
  .admin-overview,.admin-stats,.manager-stats,.schedule-stats,.summary-cards{grid-template-columns:1fr!important}
  .stat-card,.summary-card{min-height:0!important;padding:15px!important}
  .header-user{grid-template-columns:1fr}
  .header-signout{width:100%!important}
  .hero-actions,.cta-actions,.modal-actions,.dialog-actions,.form-actions,.button-row,.action-row,.actions{display:grid!important;grid-template-columns:1fr!important;width:100%}
  .hero-actions>*,.cta-actions>*,.modal-actions>*,.dialog-actions>*,.form-actions>*{width:100%!important}
  .calendar-grid{gap:4px!important}
  .calendar-day,.calendar-cell{min-width:0!important;padding:6px 2px!important;font-size:12px!important}
  .time-slots,.slot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .account-panel,.dashboard-panel,.admin-card,.checkout-card,.payment-card,.order-summary{border-radius:14px!important}
}

@media (max-width:380px){
  :root{--mobile-gutter:12px}
  .time-slots,.slot-grid{grid-template-columns:1fr!important}
  .navbar,.nav-inner,.header-inner{padding-left:12px!important;padding-right:12px!important}
}

@media (max-height:560px) and (orientation:landscape){
  dialog,.modal-card,.dialog-card,.popup-card,[class*="modal-content"]{max-height:calc(100dvh - 12px)!important}
  .modal,.popup,[class*="modal-backdrop"]{align-items:flex-start!important;padding:6px!important}
}