/* SafaSoch V13.1.3 — Mobile Responsive QA Hotfix
   Targets iPhone, Samsung/Android and iPad widths without changing desktop design. */

html,body{max-width:100%;overflow-x:hidden}
*,*::before,*::after{box-sizing:border-box}
img,video,iframe,svg{max-width:100%}
img,video{height:auto}
main,section,article,aside,header,footer,.shell{min-width:0}

/* Prevent long copy, labels and URLs from forcing sideways scroll. */
body.ss-brand-system :is(h1,h2,h3,h4,p,a,span,li,strong,small,label,summary){overflow-wrap:anywhere}
body.ss-brand-system :is([class*="grid"],[class*="row"],[class*="card"],[class*="item"]){min-width:0}

/* Tap reliability across iOS Safari, Samsung Internet and Chrome Android. */
body.ss-brand-system :is(button,.btn,a[class*="btn"],a[class*="cta"],input,select,textarea){touch-action:manipulation}
body.ss-brand-system :is(button,.btn,a[class*="btn"],a[class*="cta"]){-webkit-tap-highlight-color:rgba(3,44,35,.12)}

/* Tablet: iPad portrait / smaller landscape tablets. */
@media (min-width:701px) and (max-width:1100px){
  body.ss-brand-system .shell{width:min(100% - 40px,1120px)!important}
  body.ss-brand-system .ss22-mainrow{grid-template-columns:auto auto 1fr!important;gap:14px!important}
  body.ss-brand-system .ss22-nav{display:none!important}
  body.ss-brand-system .ss22-menu-trigger{display:grid!important}
  body.ss-brand-system .ss22-actions{justify-self:end!important}
  body.ss-brand-system .ss22-school-cta{min-width:148px!important}

  /* Generic content grids: never allow cramped 3/4 column tablet cards. */
  body.ss-brand-system :is(.grid-3,.grid-4,.programme-grid,.program-grid,.pathway-grid,.journey-grid,.course-grid,.cards-3,.cards-4){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body.ss-brand-system :is(.hero-grid,.school-grid,.split,.two-col,.grid-2){gap:30px!important}
  body.ss-brand-system video{width:100%!important;height:auto!important}
}

/* Phones and compact tablets. */
@media (max-width:700px){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body.ss-brand-system .shell{width:100%!important;max-width:none!important;padding-left:max(17px,env(safe-area-inset-left))!important;padding-right:max(17px,env(safe-area-inset-right))!important}

  /* Header = Menu + Brand + School CTA. Search/language remain in full menu. */
  body.ss-brand-system .ss22-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#fbf8f1!important}
  body.ss-brand-system .ss22-mainrow{
    min-height:66px!important;
    grid-template-columns:44px minmax(88px,108px) minmax(0,1fr)!important;
    gap:8px!important;
    padding-top:5px!important;
    padding-bottom:5px!important;
  }
  body.ss-brand-system .ss22-menu-trigger{display:grid!important;width:44px!important;height:44px!important;min-width:44px!important}
  body.ss-brand-system .ss22-brand{width:100%!important;max-width:108px!important;height:50px!important;justify-self:start!important}
  body.ss-brand-system .ss22-brand img{width:100%!important;height:48px!important;object-fit:contain!important}
  body.ss-brand-system .ss22-nav,body.ss-brand-system .ss22-search,body.ss-brand-system .ss22-lang{display:none!important}
  body.ss-brand-system .ss22-actions{justify-self:end!important;min-width:0!important;width:auto!important}
  body.ss-brand-system .ss22-school-cta{
    width:min(100%,142px)!important;
    min-width:0!important;
    height:46px!important;
    padding:0 10px 0 12px!important;
    border-radius:12px!important;
  }
  body.ss-brand-system .ss22-school-cta span{font-size:8px!important;line-height:1!important}
  body.ss-brand-system .ss22-school-cta b{font-size:11px!important;line-height:1.1!important;white-space:nowrap!important}
  body.ss-brand-system .ss22-school-cta i{font-size:16px!important}

  /* Full-screen menu owns the phone viewport and respects notches/home indicator. */
  body.ss-brand-system .v11-site-menu{
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:calc(14px + env(safe-area-inset-top)) max(17px,env(safe-area-inset-right)) calc(22px + env(safe-area-inset-bottom)) max(17px,env(safe-area-inset-left))!important;
  }
  body.ss-brand-system .v11-menu-close{width:44px!important;height:44px!important;min-width:44px!important}
  body.ss-brand-system .v11-menu-grid{grid-template-columns:1fr!important;gap:0!important;padding:10px 0!important}
  body.ss-brand-system .v11-menu-grid section{padding:9px 0!important}
  body.ss-brand-system .v11-menu-grid a{min-height:44px!important;padding:8px 0!important;font-size:15px!important}
  body.ss-brand-system .v11-menu-vivarta{grid-template-columns:1fr!important;padding:14px!important}
  body.ss-brand-system .v11-menu-vivarta-stats{display:none!important}
  body.ss-brand-system .v11-menu-vivarta>a{width:100%!important;min-height:44px!important}
  body.ss-brand-system .v11-menu-foot{display:flex!important;flex-wrap:wrap!important;gap:6px 14px!important}
  body.ss-brand-system .v11-menu-foot a{min-height:44px!important;display:inline-flex!important;align-items:center!important}

  /* Readability and hero scaling. */
  body.ss-brand-system h1{font-size:clamp(38px,11vw,50px)!important;line-height:.98!important;letter-spacing:-.045em!important}
  body.ss-brand-system h2{font-size:clamp(30px,8.3vw,42px)!important;line-height:1.02!important}
  body.ss-brand-system h3{line-height:1.12!important}
  body.ss-brand-system p,body.ss-brand-system li{font-size:max(16px,1rem);line-height:1.58}

  /* One-column phone layout for the recurring SafaSoch grids. */
  body.ss-brand-system :is(.grid-2,.grid-3,.grid-4,.programme-grid,.program-grid,.pathway-grid,.journey-grid,.course-grid,.cards-2,.cards-3,.cards-4,.hero-grid,.school-grid,.split,.two-col){
    grid-template-columns:1fr!important;
  }

  /* Primary conversion controls become thumb-friendly and avoid awkward wraps. */
  body.ss-brand-system :is(.hero-actions,.cta-row,.button-group,.actions,.school-actions){
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:10px!important;
    width:100%!important;
  }
  body.ss-brand-system :is(.hero-actions,.cta-row,.button-group,.actions,.school-actions) :is(a,button){
    width:100%!important;
    min-height:50px!important;
    justify-content:center!important;
    text-align:center!important;
  }

  /* Forms: 16px prevents iOS auto-zoom; controls are comfortably tappable. */
  body.ss-brand-system :is(input,select,textarea){font-size:16px!important;max-width:100%!important}
  body.ss-brand-system :is(input,select){min-height:48px!important}
  body.ss-brand-system textarea{min-height:120px!important}
  body.ss-brand-system form :is(button,[type="submit"]){min-height:50px!important}

  /* Media / training proof. */
  body.ss-brand-system video,body.ss-brand-system iframe{width:100%!important;max-width:100%!important}
  body.ss-brand-system video{object-fit:cover}
  body.ss-brand-system iframe{border:0}

  /* Tables stay usable instead of widening the page. */
  body.ss-brand-system .table-wrap,body.ss-brand-system [class*="table-wrap"]{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  body.ss-brand-system table{max-width:100%}

  /* Footer: compact vertical flow and readable touch targets. */
  body.ss-brand-system .ss22-footer-intro{grid-template-columns:1fr!important;gap:22px!important;padding-top:34px!important;padding-bottom:30px!important}
  body.ss-brand-system .ss22-footer-message h2{font-size:clamp(34px,10vw,44px)!important}
  body.ss-brand-system .ss22-footer-actions{grid-template-columns:1fr!important}
  body.ss-brand-system .ss22-footer-actions a{min-height:50px!important}
  body.ss-brand-system .ss22-trust-strip{grid-template-columns:1fr 1fr!important}
  body.ss-brand-system .ss22-trust-strip span{min-height:50px!important;padding:9px 10px!important}
  body.ss-brand-system .ss22-footer-main{grid-template-columns:1fr!important;gap:26px!important;padding-top:30px!important;padding-bottom:24px!important}
  body.ss-brand-system .ss22-footer-main .ss-footer-group a{min-height:40px!important;display:flex!important;align-items:center!important}
  body.ss-brand-system .ss22-footer-bottom{flex-direction:column!important;align-items:flex-start!important;gap:12px!important}
}

/* Narrow Android and older iPhones: 360/375px safety pass. */
@media (max-width:390px){
  body.ss-brand-system .shell{padding-left:max(14px,env(safe-area-inset-left))!important;padding-right:max(14px,env(safe-area-inset-right))!important}
  body.ss-brand-system .ss22-mainrow{grid-template-columns:42px minmax(78px,94px) minmax(0,1fr)!important;gap:6px!important}
  body.ss-brand-system .ss22-menu-trigger{width:42px!important;height:42px!important;min-width:42px!important}
  body.ss-brand-system .ss22-brand{max-width:94px!important}
  body.ss-brand-system .ss22-school-cta{height:44px!important;max-width:128px!important;padding-inline:10px!important}
  body.ss-brand-system .ss22-school-cta span{font-size:7px!important}
  body.ss-brand-system .ss22-school-cta b{font-size:10px!important}
  body.ss-brand-system .ss22-school-cta i{display:none!important}
  body.ss-brand-system h1{font-size:clamp(36px,11vw,43px)!important}
  body.ss-brand-system .ss22-trust-strip{grid-template-columns:1fr!important}
}

/* iPhone Pro Max / large Android: allow a little more breathing room without desktop layout. */
@media (min-width:391px) and (max-width:480px){
  body.ss-brand-system .ss22-school-cta{max-width:146px!important}
}

/* iPad portrait-specific balance. */
@media (min-width:768px) and (max-width:900px) and (orientation:portrait){
  body.ss-brand-system .shell{width:min(100% - 46px,1120px)!important}
  body.ss-brand-system h1{font-size:clamp(54px,8vw,74px)!important}
  body.ss-brand-system :is(.grid-3,.grid-4,.programme-grid,.program-grid,.pathway-grid,.journey-grid,.course-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (prefers-reduced-motion:reduce){
  body.ss-brand-system *,body.ss-brand-system *::before,body.ss-brand-system *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}