/* Valentini Auto — responsive layer for desktop, tablet and mobile */
html{max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%}
body{max-width:100%;overflow-x:hidden}
img,svg,video,iframe{max-width:100%}
button,a,input,textarea{touch-action:manipulation}
input,textarea,button{font:inherit}

/* Homepage — tablet */
@media(max-width:1100px){
  .homePage .container{width:min(94%,960px)}
  .homePage .links{display:none}
  .homePage .navCtas .navPhone{display:none}
  .homePage .cars,.homePage .sold,.homePage .services,.homePage .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .homePage .priceBox,.homePage .contact,.homePage .reviewsGrid,.homePage .listingPackage{grid-template-columns:1fr}
  .homePage .listingPackagePrice{align-items:flex-start}
  .homePage .hero{min-height:84svh;background-position:64% center}
  .homePage .section{padding:82px 0}
}

/* Homepage — phone */
@media(max-width:720px){
  .homePage{padding-bottom:82px}
  .homePage .header{background:rgba(244,245,245,.94)}
  .homePage .nav{height:68px;gap:10px}
  .homePage .logo{height:42px;max-width:148px;object-fit:contain}
  .homePage .navCtas{gap:6px}
  .homePage .navCtas>a:not(.dark){display:none}
  .homePage .navCtas .btn{min-height:42px;padding:10px 14px;font-size:12px}
  .homePage .hero{min-height:78svh;padding:112px 0 64px;background-position:69% center;align-items:end}
  .homePage .hero h1{font-size:clamp(45px,14.5vw,66px);line-height:.9;margin:15px 0 20px}
  .homePage .hero p{font-size:16px;line-height:1.55;max-width:92%}
  .homePage .heroActions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:25px}
  .homePage .heroActions .btn{min-height:46px;padding:11px 12px;text-align:center}
  .homePage .heroActions .btn:first-child{grid-column:1/-1}
  .homePage .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .homePage .stat{min-width:0;padding:22px 12px}
  .homePage .stat b{font-size:23px}
  .homePage .stat span{font-size:10px;line-height:1.35}
  .homePage .section{padding:66px 0}
  .homePage .head{display:block;margin-bottom:28px}
  .homePage .head h2{font-size:clamp(38px,12vw,52px)}
  .homePage .head p{margin-top:17px;font-size:15px}
  .homePage .cars,.homePage .sold,.homePage .services,.homePage .steps{grid-template-columns:1fr}
  .homePage .carBody{padding:18px}
  .homePage .carTop{flex-direction:column;gap:8px}
  .homePage .car .price{font-size:18px}
  .homePage .card{padding:23px}
  .homePage .priceMain{padding:28px 24px}
  .homePage .priceMain strong{font-size:56px}
  .homePage .check{grid-template-columns:1fr}
  .homePage .listingPackage{padding:25px;gap:24px}
  .homePage .listingPackagePrice .btn{width:100%;min-height:46px}
  .homePage .googleCard{padding:25px;min-height:auto}
  .homePage .mapWrap,.homePage .mapWrap iframe{min-height:270px}
  .homePage #kontakt{padding-bottom:120px}
  .homePage .contact{gap:28px}
  .homePage .contact h2{font-size:clamp(41px,12vw,56px)}
  .homePage .formRow{grid-template-columns:1fr}
  .homePage .formRow>*{grid-column:1!important}
  .homePage .formRow input,.homePage .formRow textarea{font-size:16px;min-height:50px}
  .homePage .formRow button{min-height:48px}
  .homePage .brandOutro{min-height:58svh;background-position:center center}
  .homePage .outroContent{padding:86px 18px 78px}
  .homePage .outroContent h2{font-size:clamp(38px,11.5vw,56px)}
  .homePage .outroLogo{width:min(260px,70vw)}
  .homePage .footerIn{align-items:flex-start;flex-direction:column;padding:3px 0}
  .homePage .footerDetails{width:100%;align-items:flex-start;flex-direction:column;gap:16px}
  .homePage .footerDetails>span{line-height:1.7}
  .homePage .mobilebar{left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));grid-template-columns:repeat(3,minmax(0,1fr));padding:6px}
  .homePage .mobilebar a{min-width:0;padding:12px 5px;font-size:12px}
}

@media(max-width:420px){
  .homePage .container{width:91%}
  .homePage .navCtas .btn{padding:9px 12px}
  .homePage .hero{background-position:72% center}
  .homePage .heroActions{grid-template-columns:1fr}
  .homePage .heroActions .btn:first-child{grid-column:auto}
  .homePage .stat span{letter-spacing:.04em}
  .homePage .listingPackagePrice strong{font-size:50px}
}

/* Vehicle inventory */
@media(max-width:1000px){
  .inventoryPage .wrap{width:100%;padding-left:24px!important;padding-right:24px!important}
  .inventoryPage .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important}
  .inventoryPage .carMedia img{height:auto!important;aspect-ratio:16/10;object-fit:cover}
}

@media(max-width:650px){
  .inventoryPage .wrap{padding:20px 14px 45px!important}
  .inventoryPage .top{align-items:center;margin-bottom:20px;padding:4px 0 20px}
  .inventoryPage .brand{justify-content:flex-start}
  .inventoryPage .brand-logo{height:44px!important;max-width:155px}
  .inventoryPage .nav a{min-height:44px;padding:11px 13px;text-align:center}
  .inventoryPage h1{font-size:31px;margin-top:8px}
  .inventoryPage .sub{font-size:14px}
  .inventoryPage .filters{flex-wrap:nowrap;overflow-x:auto;margin:20px -14px 24px;padding:0 14px 5px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .inventoryPage .filters::-webkit-scrollbar{display:none}
  .inventoryPage .filterBtn{flex:0 0 auto;min-height:43px;white-space:nowrap}
  .inventoryPage .grid{grid-template-columns:1fr!important;gap:16px!important}
  .inventoryPage .carCard{border-radius:18px!important}
  .inventoryPage .carBody{padding:18px!important}
  .inventoryPage .carTitle{align-items:flex-start;flex-direction:column;gap:6px}
  .inventoryPage .price{text-align:left}
  .inventoryPage .actions{display:grid;grid-template-columns:1fr 1fr}
  .inventoryPage .actions .btn{min-height:44px;text-align:center}
  .inventoryPage .site-footer .footer-inner{align-items:flex-start;padding:18px 16px 22px}
  .inventoryPage .site-footer .footer-left{line-height:1.6}
}

/* Vehicle detail pages */
@media(max-width:1024px){
  .vehiclePage .wrap,.vehiclePage .container{width:100%;padding-left:24px!important;padding-right:24px!important}
  .vehiclePage .grid{grid-template-columns:1fr!important}
  .vehiclePage .thumbs{grid-template-columns:repeat(5,minmax(0,1fr))}
  .vehiclePage .heroimg{aspect-ratio:16/9}
}

@media(max-width:700px){
  .vehiclePage{padding-bottom:88px!important}
  .vehiclePage header .wrap{padding-left:15px!important;padding-right:15px!important}
  .vehiclePage .bar{min-height:66px;padding:8px 0}
  .vehiclePage .brand-logo{height:43px!important;max-width:158px}
  .vehiclePage main{padding:18px 0 36px}
  .vehiclePage main>.wrap{padding-left:14px!important;padding-right:14px!important}
  .vehiclePage .back{margin:3px 0 14px;min-height:40px}
  .vehiclePage .topline{display:block}
  .vehiclePage h1{font-size:clamp(29px,9vw,40px);line-height:1.03;overflow-wrap:anywhere}
  .vehiclePage .price{font-size:22px;margin-top:18px;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid var(--line)}
  .vehiclePage .contactStrip{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
  .vehiclePage .contactStrip .cbtn{min-height:45px;padding:10px;text-align:center}
  .vehiclePage .contactStrip .cbtnPrimary{grid-column:1/-1;grid-row:1}
  .vehiclePage .sub{font-size:14px;line-height:1.55}
  .vehiclePage .chips{gap:7px}
  .vehiclePage .chip{max-width:100%;overflow-wrap:anywhere}
  .vehiclePage .grid{gap:14px;margin-top:18px}
  .vehiclePage .panel{border-radius:18px}
  .vehiclePage .heroimg{aspect-ratio:4/3;border-radius:0}
  .vehiclePage .heroimg img{border-radius:0}
  .vehiclePage .thumbs{display:flex;gap:8px;overflow-x:auto;padding:10px;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .vehiclePage .thumbs::-webkit-scrollbar{display:none}
  .vehiclePage .thumb{flex:0 0 88px;scroll-snap-align:start}
  .vehiclePage .thumb img{height:62px}
  .vehiclePage .side,.vehiclePage .desc{padding:16px}
  .vehiclePage .row{align-items:flex-start;flex-wrap:wrap;line-height:1.45}
  .vehiclePage .row .v{text-align:right;margin-left:auto;overflow-wrap:anywhere}
  .vehiclePage .ctaBox{display:grid;grid-template-columns:1fr;gap:9px}
  .vehiclePage .ctaBox .btn,.vehiclePage .ctaBox .cta{width:100%;min-height:45px;text-align:center}
  .vehiclePage .zoomTop{align-items:flex-start;flex-direction:column;padding:10px}
  .vehiclePage .zoomTitle{max-width:100%}
  .vehiclePage .zoomBtns{width:100%;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:3px}
  .vehiclePage .zbtn{flex:0 0 auto;min-height:42px}
  .vehiclePage .zoomHint{display:none}
  .vehiclePage .site-footer{margin-bottom:0}
  .vehiclePage .site-footer .footer-inner{align-items:flex-start;padding:18px 16px 26px}
  .vehiclePage .site-footer .footer-left{line-height:1.6}
  .vehiclePage .mobileContact{left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));grid-template-columns:repeat(3,minmax(0,1fr));padding:6px}
  .vehiclePage .mobileContact a{min-width:0;padding:12px 4px;font-size:12px}
}

@media(max-width:390px){
  .vehiclePage .contactStrip{grid-template-columns:1fr}
  .vehiclePage .contactStrip .cbtnPrimary{grid-column:auto}
  .vehiclePage .thumb{flex-basis:80px}
}

/* Loading screen */
@media(max-width:700px){
  .brandLoaderInner{width:min(285px,72vw)}
  .brandLoaderTrack{margin-top:20px}
  .brandLoaderText{font-size:9px;letter-spacing:.18em}
}

@media(hover:none){
  .car:hover,.card:hover,.googleCard:hover,.carCard:hover{transform:none!important;box-shadow:inherit!important}
}
