html{-webkit-text-size-adjust:100%;text-size-adjust:100%;font-size:16px}
body{font-size:.95rem;overflow-wrap:break-word}
h1{font-size:clamp(1.9rem,6.2vw,3.4rem)}h2{font-size:clamp(1.45rem,4.6vw,2.2rem)}h3{font-size:1.12rem}h4{font-size:.98rem}
.hero p.lead{font-size:clamp(.95rem,2.6vw,1.12rem)}p{font-size:.95rem}.small,.muted.small{font-size:.82rem}
.card h3,.card h4,.tk,.price,.stat b{overflow-wrap:anywhere}
.grid.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}.grid.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))}.grid.g5{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.stats{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px}.stat{padding:16px 10px}.stat b{font-size:clamp(1.25rem,4vw,1.8rem)}.stat span{font-size:.8rem}
.price{font-size:clamp(1.25rem,4vw,1.7rem)}.page{padding:30px 0 70px}.sec{padding:clamp(44px,8vw,84px) 0}.card{padding:clamp(16px,3.5vw,26px)}.head{margin-bottom:clamp(24px,5vw,44px)}
input,textarea,select{padding:11px 13px;font-size:16px}textarea{min-height:84px}label{font-size:.82rem;margin:12px 0 5px}.btn{padding:12px 22px;font-size:.92rem}.btn.sm{padding:9px 16px}
.foot-g{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}.foot{padding:40px 0 26px}
.band{padding:clamp(28px,6vw,54px) clamp(18px,5vw,54px)}.band h2{font-size:clamp(1.35rem,4.5vw,2rem)}
.chips{gap:10px 16px;font-size:.82rem}.kick{font-size:.72rem}
.tank{padding:14px}.tank h4{font-size:.95rem}
.fade{animation:fi2 .35s ease both}@keyframes fi2{from{opacity:0}}
#app{min-height:75vh}.boot{display:grid;place-items:center;min-height:70vh}.boot span{width:30px;height:40px;background:linear-gradient(160deg,#22d3ee,#06b6d4);border-radius:50% 50% 50% 50%/62% 62% 38% 38%;animation:fl 1.1s ease-in-out infinite}
.sum .dh{display:none}
@media(max-width:1024px){
.hero .wrap,.bk{grid-template-columns:1fr}.hero{padding:44px 0 80px}.hero-img{max-width:420px;aspect-ratio:16/11}.sum{position:static}
.burger{display:block}#links{position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--bg);border-bottom:1px solid var(--line);padding:10px 16px;margin:0;display:none}.nav.open #links{display:flex}
.nav{gap:10px;padding:10px 16px}.nav-r .btn{padding:8px 14px}}
@media(max-width:520px){.hero h1{font-size:clamp(1.8rem,9vw,2.3rem)}.cta .btn{flex:1 1 100%}.steps span{min-width:84px;font-size:.72rem}.story h3{font-size:1.05rem}.pc b{font-size:1rem}.nav .logo{font-size:1.15rem}}

/* ===== Mobile responsiveness pass (320-425px): no horizontal overflow ===== */
html,body{overflow-x:clip}
@supports not (overflow:clip){html,body{overflow-x:hidden}}
/* grid/flex children must be allowed to shrink (root cause of the booking-step overflow) */
.bk>*,.hero .wrap>*,.grid>*,.foot-g>*,.story>*,.rb>*,.promo>*,.stats>*{min-width:0}
.row>.grow,.tank .grow{min-width:0}
input,textarea,select{min-width:0;max-width:100%}
.btn{white-space:normal;text-align:center;line-height:1.3}
h1,h2,h3{overflow-wrap:break-word}
.card p,.card h3,.card h4,.card b,.foot a,.foot span,.legal p,.legal li{overflow-wrap:anywhere}
.line{flex-wrap:wrap}.line>*{min-width:0}.line b{overflow-wrap:anywhere}
.kick{max-width:100%;white-space:normal}
/* date strip scrolls inside its card instead of stretching the page */
.days{max-width:100%;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none}.days::-webkit-scrollbar{display:none}.day{scroll-snap-align:start}
.slot{max-width:100%;overflow-wrap:anywhere}
.steps{scroll-snap-type:x proximity}.steps span{scroll-snap-align:start}
/* modals */
dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
#toast{width:max-content;max-width:calc(100vw - 24px)}
@media(max-width:1024px){
.hero .wrap,.bk{grid-template-columns:minmax(0,1fr)}
.nav-r{margin-left:auto;gap:6px}
.icon,.burger{width:44px;height:44px;min-height:44px;padding:0;flex:none}
.nav{padding:8px 12px}.steps{top:60px}
#links{max-height:calc(100dvh - 70px);overflow-y:auto}}
@media(max-width:900px){.sum.dr.open{max-height:70dvh}}
@media(max-width:520px){
.wrap{padding:0 14px}
.stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid[style*="210px"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.grid[style*="210px"] .card{padding:14px}
dialog{width:calc(100vw - 24px);padding:22px 18px;border-radius:20px}
.bnav{left:8px;right:8px}
.band .btn{width:100%}
.story{gap:16px}
.foot-g{grid-template-columns:minmax(0,1fr)}}
@media(max-width:425px){
.bk .row:has(>.btn.grow){flex-wrap:wrap}
.bk .row:has(>.btn.grow)>.btn.grow{flex:1 1 100%;order:-1}
.bk .row:has(>.btn.grow)>.btn.ghost{flex:1 1 100%}
.tank.row{gap:10px}.tank .qty{gap:8px}
.cbar .cbtn{flex:1 1 auto}
.page{padding:24px 0 60px}}
@media(max-width:360px){
.nav{gap:4px;padding:8px 10px}.nav-r{gap:4px}
.nav .logo{font-size:1.05rem;gap:6px}.drop{width:16px;height:21px}
.nav-r .btn{padding:6px 10px;font-size:.8rem}
.icon,.burger{width:40px}
.wrap{padding:0 12px}
#cd{letter-spacing:.15em!important;font-size:1.15rem!important}
.steps span{min-width:76px}
.pc{padding:12px 14px}.pc button{padding:0 12px}}
