/* Ser Vital responsive layer — 2026-09-06 */
img,svg,video,canvas{max-width:100%;height:auto}
button,input,select,textarea{max-width:100%}
.main,.admin-shell,.container,.card,.table-wrap{min-width:0}
.table-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;border-radius:14px}
.table-wrap table{min-width:720px}
.small-table table{min-width:420px}
.tabs,.growth-tabs{scrollbar-width:thin}
.metric strong,.growth-metric strong{overflow-wrap:anywhere}

@media (min-width:851px){
  .sidebar{position:sticky;top:0;align-self:start;height:100vh;overflow:auto}
}

@media (max-width:980px){
  .container{width:min(94%,1120px)}
  .hero-grid{gap:28px}
  .hero h1{font-size:clamp(2.5rem,7.5vw,4.4rem)}
  .main{padding:22px}
  .toolbar{align-items:flex-start}
}

@media (max-width:850px){
  .nav .container{gap:10px}
  .navlinks{margin-left:auto;min-width:0}
  .navlinks .btn{min-height:42px}
  .hero-grid,.two,.grid3,.blog-list{grid-template-columns:1fr}
  .hero-grid>*,.two>*{min-width:0}
  .hero-card{width:min(100%,620px);margin-inline:auto}
  .section{padding:46px 0}
  .admin-shell{display:block}
  .sidebar{display:grid;grid-template-columns:1fr auto;gap:10px 16px;align-items:center;padding:16px 18px}
  .sidebar h2{margin:0}
  .sidebar p,.sidebar small{margin:0}
  .sidebar p[style]{grid-column:2;grid-row:1 / span 3;margin:0!important;align-self:center}
  .sidebar p[style] .btn{width:auto!important;min-width:150px}
  .main{padding:18px 14px 34px}
  .toolbar{margin-bottom:10px}
  .toolbar h1{font-size:clamp(1.8rem,7vw,2.5rem);margin:.2rem 0}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .metric{padding:16px}
  .metric strong{font-size:1.65rem}
  .tabs,.growth-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding:2px 2px 9px;margin:18px -2px 20px;scroll-snap-type:x proximity}
  .tab-btn,.growth-tab{flex:0 0 auto;scroll-snap-align:start;white-space:nowrap}
  .table-wrap{margin:10px 0 18px;border:1px solid rgba(142,112,142,.12);background:#fff}
  th,td{padding:10px 9px;font-size:.86rem;white-space:nowrap}
  td:last-child,th:last-child{padding-right:14px}
  .form.card{width:100%;max-width:none!important}
  .cta{padding:26px 22px}
  .footer .container{align-items:flex-start}
}

@media (max-width:640px){
  html{scroll-padding-top:74px}
  .container{width:min(94%,1120px)}
  .nav .container{min-height:64px}
  .brand{font-size:1rem;gap:8px}
  .brand::before{width:42px;height:42px;flex-basis:42px}
  .navlinks .btn{padding:9px 11px;font-size:.8rem}
  .hero{padding:38px 0 34px}
  .hero h1{font-size:clamp(2.15rem,12vw,3.15rem);line-height:1.05}
  .hero p{font-size:1rem;line-height:1.55}
  .hero p .btn,.hero p button{width:100%;margin:5px 0}
  .chips{gap:6px}
  .chip{font-size:.78rem}
  .section{padding:38px 0}
  .card{padding:18px;border-radius:16px}
  .price{font-size:1.7rem}
  .slot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .slot{width:100%}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sidebar{grid-template-columns:1fr;padding:14px}
  .sidebar h2{font-size:1.35rem}
  .sidebar h2::before{width:46px;height:46px;flex-basis:46px}
  .sidebar p[style]{grid-column:auto;grid-row:auto;width:100%}
  .sidebar p[style] .btn{width:100%!important}
  .tabs,.growth-tabs{margin-left:-4px;margin-right:-4px;padding-left:4px;padding-right:4px}
  .table-wrap table{min-width:650px}
  .small-table table{min-width:100%}
  .cta .btn,.form .btn,.growth-nav .btn,.growth-nav button,.engine-box .btn{width:100%}
  .cta{border-radius:20px}
  .footer .container{display:grid;grid-template-columns:auto 1fr;gap:12px}
  .footer .container::before{width:52px;height:52px}
  ol,ul{padding-left:1.25rem}
}

@media (max-width:430px){
  .container{width:calc(100% - 24px)}
  .nav .container{width:calc(100% - 20px)}
  .brand{font-size:.95rem}
  .brand::before{width:38px;height:38px;flex-basis:38px}
  .navlinks .btn{font-size:.75rem;padding:8px 10px}
  .hero h1{font-size:clamp(2rem,12vw,2.8rem)}
  .hero-card,.brand-lockup-card{padding:8px}
  .metrics{grid-template-columns:1fr}
  .metric{padding:14px 16px}
  .metric strong{font-size:1.55rem}
  .main{padding:14px 10px 28px}
  .toolbar{gap:8px}
  .toolbar .btn{width:100%}
  .slot-grid{grid-template-columns:1fr}
  .card{padding:16px}
  .cta{padding:22px 18px}
  .turnstile-slot{overflow:hidden}
}

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