/*
 * TST Lift responsive hardening
 * Loaded after page-specific styles. Keeps text readable and layouts usable
 * from small phones to wide desktop screens.
 */
:root{
  --text:var(--ink);
  --dark:#07131f;
  --page-gutter:clamp(14px,3vw,40px);
}
[data-theme="dark"]{--text:var(--ink);--dark:#050b12}

html{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  min-width:0;
}
main,section,article,aside,header,footer,nav,form,fieldset,div{min-width:0}
img,svg,video,canvas,iframe{max-width:100%}
img,video{height:auto}
h1,h2,h3,h4,h5,h6,p,li,a,button,label,span,strong,small,dt,dd,th,td{
  overflow-wrap:anywhere;
}
button,input,select,textarea{max-width:100%;min-width:0}
select{color-scheme:light dark}
.wrap{
  width:min(1180px,calc(100% - (var(--page-gutter) * 2)))!important;
  max-width:100%;
}
.section,.content-section,.contact-page{padding-block:clamp(58px,7vw,105px)}
h1{font-size:clamp(38px,6vw,88px)}
h2{font-size:clamp(31px,4.4vw,62px)}
.page-intro,.hero-copy,.blog-lead,.prose,.about-copy>p:not(.eyebrow){max-width:72ch}

/* Readability fixes for theme-dependent components. */
.catalog-card button,.certificate-showcase button,.search-pagination button,
.product-family summary,.family-side-nav,.quality-table,.contact-cards article{
  color:var(--ink);
}
html[data-theme="light"] .btn-catalog{color:var(--ink)!important}
html[data-theme="light"] .site-header nav.open,
html[data-theme="light"] .product-submenu{color:var(--ink)}
html[data-theme="light"] .vehicle-search label{color:var(--ink)}
html[data-theme="light"] .theme-banner-copy .eyebrow{color:var(--red)}
html[data-theme="light"] .certificate-showcase strong,
html[data-theme="light"] .certificate-showcase button{color:var(--ink)!important}


/* Content must remain readable even when reveal animation support is unavailable. */
@media (prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important}}

/* Header and navigation: stable at all widths. */
.site-header,.site-header.scrolled{
  width:100%;
  max-width:100%;
  min-width:0;
}
.site-header .brand{flex:0 1 auto;min-width:0!important}
.site-header .brand-copy{min-width:0}
.site-header nav{min-width:0}
.site-header nav.open{
  max-height:calc(100dvh - 76px);
  overflow-y:auto;
  overscroll-behavior:contain;
  box-shadow:0 20px 45px rgba(0,0,0,.2);
}
.site-header nav.open>a,.site-header nav.open>.nav-products{width:100%}
.site-header nav.open a{white-space:normal;line-height:1.35}
.nav-products{position:relative;min-width:0}
.product-submenu{max-width:min(360px,calc(100vw - 28px));max-height:min(520px,70dvh);overflow-y:auto}
.header-actions{min-width:0}
.header-actions>*{min-width:0}
.language-picker,.language-trigger{max-width:100%}
.language-trigger span:not(.locale-flag){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* General grid hardening. */
.split,.surface,.contact-grid,.prose-grid,.vehicle-heading,.section-heading,
.family-overview,.family-rich-detail,.sector-details,.cfg-hero-grid{
  min-width:0;
}
.product-grid,.blog-grid,.contact-cards,.cert-grid,.official-cert-grid,
.certificate-showcase,.reason-grid,.process-grid,.catalog-grid,.sector-gallery,
.vehicle-category-grid,.managed-connection-grid{
  grid-auto-flow:row;
}
.product-card,.blog-card,.catalog-card,.detail-card,.process-card,.contact-cards article,
.cert-grid article,.certificate-showcase article,.vehicle-category,.managed-connection-card{
  min-width:0;
}
.section-heading>*,.vehicle-heading>*,.contact-grid>*,.prose-grid>*,.split>*{min-width:0}

/* Heroes and large media. */
.hero,.page-hero,.sector-hero,.cfg-hero{isolation:isolate}
.hero-content,.page-hero .wrap,.sector-hero .wrap,.cfg-hero-grid{max-width:100%}
.hero h1,.page-hero h1,.sector-hero h1,.cfg-hero h1{overflow-wrap:normal;word-break:normal}
.hero-copy,.page-intro,.sector-hero p,.cfg-lead{line-height:1.65}
.media-feature,.media-feature img{max-width:100%}
.media-caption{right:var(--page-gutter);max-width:min(760px,calc(100% - (var(--page-gutter) * 2)))}
.inline-visual img,.content-image,.detail-visual img{width:100%}

/* Tables remain usable on phones. */
.table-scroll,.sector-oem-table{
  width:100%;
  max-width:100%;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
.quality-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
.vehicle-table,.sector-oem-table table,.quality-table table{max-width:none}
.vehicle-table th,.vehicle-table td,.quality-table th,.quality-table td{white-space:normal;vertical-align:top}

/* Forms and buttons. */
form{max-width:100%}
form input,form select,form textarea{width:100%}
textarea{max-width:100%;resize:vertical}
.btn{max-width:100%;text-align:center;white-space:normal;line-height:1.25;padding-block:10px}
.contact-grid form,.vehicle-search,.sector-oem-search,.oem-filter-grid{min-width:0}

/* Modals and fixed widgets must never leave the viewport. */
.certificate-modal,.corporate-video-modal,.flipbook-modal,.whatsapp-popup{
  max-width:calc(100vw - 20px);
}
.certificate-modal{max-height:calc(100dvh - 20px);overflow:auto}
.corporate-video-modal{max-height:calc(100dvh - 20px)}
.corporate-video-modal video{max-height:calc(100dvh - 110px)}
.whatsapp-widget{max-width:calc(100vw - 20px)}
.whatsapp-popup{max-height:calc(100dvh - 90px);overflow-y:auto}

/* Catalog flipbook: two pages on large screens, one page on compact screens. */
body .flip-page{max-width:100%;max-height:100%}
.flip-toolbar{max-width:100%;flex-wrap:wrap;justify-content:flex-end}
.flip-toolbar>*{flex:0 0 auto}

/* Product family details. */
.product-family summary>span{min-width:0}
.product-family summary small{overflow-wrap:anywhere}
.family-side-nav nav a{white-space:normal}
.family-model>div{min-width:0}
.family-model img{max-width:100%}

/* Sector product pages. */
.sector-oem-table{border:1px solid var(--line)}
.sector-download>*{min-width:0}

/* ========================= TABLET ========================= */
@media (max-width:1180px){
  .section-heading,.vehicle-heading{gap:30px}
  .split,.prose-grid,.contact-grid{gap:clamp(32px,5vw,58px)}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reason-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-hero{min-height:clamp(430px,56vw,600px)}
  .surface-page-hero{min-height:clamp(480px,58vw,610px)}
  .detail-card{padding:clamp(24px,3vw,34px)}
}

@media (max-width:900px){
  .site-header,.site-header.scrolled{
    grid-template-columns:auto minmax(0,1fr) auto;
    min-height:76px!important;
    height:76px!important;
    padding:7px 14px!important;
    gap:10px!important;
  }
  .site-header .brand img,.site-header.scrolled .brand img{
    width:78px!important;height:46px!important;max-width:78px!important;max-height:46px!important;
  }
  .site-header .brand-copy{display:none!important}
  .menu-toggle{display:block!important;grid-column:3;justify-self:end;order:initial!important}
  .header-actions{grid-column:2;justify-self:end;display:flex!important;gap:7px!important}
  .header-actions .header-catalog-btn{display:none!important}
  .header-actions .header-quote-btn{display:inline-flex!important;width:auto!important;min-height:40px!important;padding:0 12px!important;font-size:12px!important}
  .header-actions .language-picker{min-width:112px;max-width:130px}
  .header-actions .theme-toggle{width:68px;min-width:68px;grid-template-columns:30px 30px;height:40px}
  .header-actions .theme-icon{width:29px;height:32px}
  .site-header nav,.site-header.scrolled nav{top:76px!important;padding:14px!important}
  .site-header nav.open{display:flex!important;align-items:stretch;gap:3px}
  .site-header nav.open>a,.site-header nav.open>.nav-products>a{width:100%;min-height:44px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .site-header nav.open .nav-products{display:block}
  .site-header nav.open .product-submenu{
    position:static!important;width:100%!important;max-width:none!important;
    margin:0;padding:6px;border:0;box-shadow:none;background:var(--surface-2);
  }
  .site-header nav.open .nav-products.open .product-submenu,
  .site-header nav.open .nav-products:focus-within .product-submenu{display:grid!important}
  .site-header nav.open .product-submenu a{min-height:42px!important}
  .hero-stage,.hero-scroll.is-static-media .hero-stage{top:0!important;height:calc(100svh - 76px)!important;min-height:600px}
  .hero-scroll.is-static-media{min-height:calc(100svh - 76px)}
  .banner-scroll-hint{display:none}
  .hero-carousel-controls,.banner-switcher{bottom:15px}
  .theme-banner-hint{display:none}
  .split,.prose-grid,.contact-grid,.vehicle-heading,.family-overview{grid-template-columns:1fr!important}
  .prose-grid h2{position:static}
  .surface{grid-template-columns:1fr}
  .section-heading{display:grid;grid-template-columns:1fr;align-items:start;margin-bottom:36px}
  .section-heading>p{max-width:70ch;margin:0}
  .vehicle-search{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .vehicle-search .btn{width:100%}
  .sector-details{grid-template-columns:1fr!important}
  .sector-gallery{grid-template-columns:1fr 1fr}
  .sector-hero{min-height:540px}
  .sector-hero>img{width:100%!important;opacity:.42}
  .sector-hero:after{background:linear-gradient(90deg,rgba(7,19,31,.97),rgba(7,19,31,.65))}
  .family-rich-detail{grid-template-columns:1fr!important}
  .family-side-nav{position:static!important;top:auto!important}
  .family-model{grid-template-columns:44px minmax(0,1fr)!important}
  .family-model img{display:none}
  .flipbook-dialog{width:100%;height:100dvh}
  body .flip-stage{padding:10px}
  body .flip-page{width:min(94vw,760px);height:72dvh}
}

/* ========================= PHONE ========================= */
@media (max-width:700px){
  :root{--page-gutter:14px}
  .wrap{width:calc(100% - 28px)!important}
  .section,.content-section,.contact-page{padding-block:56px}
  h2{line-height:1.05;letter-spacing:-.04em}
  .page-hero,.surface-page-hero{min-height:430px;padding-block:64px}
  .page-hero h1{font-size:clamp(36px,11.5vw,56px);line-height:1}
  .page-intro{font-size:16px}
  .breadcrumbs{display:flex;flex-wrap:wrap;gap:6px 10px}

  .site-header,.site-header.scrolled{
    grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-rows:60px auto;
    min-height:116px!important;
    height:auto!important;
    padding:4px 12px 8px!important;
  }
  .site-header .brand{grid-column:1;grid-row:1}
  .menu-toggle{grid-column:3;grid-row:1}
  .header-actions{
    grid-column:1/-1!important;grid-row:2!important;justify-self:stretch!important;
    display:grid!important;grid-template-columns:minmax(0,1fr) 68px minmax(0,1fr)!important;
    gap:7px!important;width:100%!important;padding-top:7px;border-top:1px solid var(--line);
  }
  .header-actions .language-picker{width:100%;min-width:0;max-width:none}
  .header-actions .language-trigger{height:40px;padding-inline:8px;font-size:11px}
  .header-actions .theme-toggle{width:68px!important;min-width:68px!important;height:40px!important;padding:3px!important}
  .header-actions .theme-toggle .theme-name{display:none!important}
  .header-actions .header-quote-btn{
    display:inline-flex!important;width:100%!important;min-width:0!important;min-height:40px!important;
    padding:6px 8px!important;font-size:11px!important;line-height:1.15!important;
  }
  .site-header nav,.site-header.scrolled nav{top:116px!important}
  .site-header nav.open{max-height:calc(100dvh - 116px)}
  .hero-stage,.hero-scroll.is-static-media .hero-stage{height:calc(100svh - 116px)!important;min-height:570px}
  .hero-scroll.is-static-media{min-height:calc(100svh - 116px)}
  .hero-content{padding:62px 0 105px!important}
  .hero h1{font-size:clamp(39px,12vw,58px)!important;line-height:.98}
  .hero-copy{font-size:15px;margin-bottom:26px}
  .hero-buttons{display:grid;grid-template-columns:1fr}
  .hero-buttons .btn{width:100%}
  .hero-carousel-controls{left:14px}
  .hero-carousel-controls:before{display:none}
  .trust-grid{grid-template-columns:1fr!important}
  .trust-grid div{border-right:0;border-bottom:1px solid #263b4c}
  .trust-grid div:last-child{border-bottom:0}

  .product-grid,.blog-grid,.contact-cards,.reason-grid,.cert-grid,.official-cert-grid,
  .certificate-showcase,.catalog-grid,.process-grid,.sector-gallery,.managed-connection-grid{
    grid-template-columns:1fr!important;
  }
  .product-card{min-height:0!important}
  .product-image{height:210px}
  .product-body{padding:22px!important}
  .product-card a{position:static;display:inline-flex;margin-top:18px}
  .mini-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .factory-caption{align-items:flex-start;flex-direction:column}
  .number-grid{grid-template-columns:1fr!important}
  .number-grid>div{border-right:0!important;border-bottom:1px solid var(--line);padding-bottom:22px}
  .number-grid>div:last-child{border-bottom:0}
  .contact-grid form{padding:20px}
  .contact li{grid-template-columns:1fr!important;gap:4px}
  .footer-grid{grid-template-columns:1fr!important}
  .copyright{align-items:flex-start;flex-direction:column}

  .detail-card{grid-template-columns:1fr!important;gap:16px;padding:22px}
  .detail-card h2,.process-card h2{font-size:clamp(27px,8vw,36px)}
  .process-card{padding:24px}
  .media-feature,.media-feature img{height:330px!important;min-height:330px!important}
  .media-caption{left:14px!important;right:14px!important;bottom:24px}
  .inline-visual figcaption{padding:14px}

  .vehicle-category-grid{grid-template-columns:1fr!important}
  .vehicle-category:first-child{grid-column:auto!important}
  .vehicle-search{grid-template-columns:1fr!important;padding:18px}
  .results-heading{align-items:flex-start;flex-direction:column}
  .search-pagination{gap:8px;flex-wrap:wrap}
  .search-pagination button{flex:1 1 120px}

  .sector-hero{min-height:480px}
  .sector-hero h1{font-size:clamp(38px,12vw,58px)!important;line-height:1}
  .sector-hero p{font-size:16px!important}
  .sector-gallery figure{height:230px!important}
  .sector-download{grid-template-columns:1fr!important;padding:18px}
  .sector-download img{width:100%!important;height:190px!important}
  .oem-filter-grid{grid-template-columns:1fr!important}
  .oem-filter-grid>*{grid-column:auto!important}

  .product-family summary{grid-template-columns:42px minmax(70px,86px) minmax(0,1fr)!important;gap:11px;padding:13px!important}
  .product-family summary>b{width:38px;height:38px}
  .product-family-thumb{width:100%!important;height:68px!important}
  .product-family summary strong{font-size:17px!important}
  .product-family summary small{font-size:12px}
  .product-family summary em{display:none}
  .family-rich-detail{padding-inline:14px!important}
  .family-side-nav nav{grid-template-columns:1fr!important}
  .family-facts{grid-template-columns:1fr!important}
  .family-model{grid-template-columns:36px minmax(0,1fr)!important;gap:10px!important;padding-block:25px}
  .family-model>span{width:34px;height:34px}
  .family-actions{display:grid;grid-template-columns:1fr}
  .family-actions .btn{width:100%}
  .family-back-bottom{margin-left:0!important}

  .theme-banner-scroll{height:440px!important}
  .theme-banner-copy{left:18px!important;width:calc(100% - 36px)!important}
  .theme-banner-copy h2{font-size:clamp(34px,10vw,46px)!important}
  .theme-banner-copy>p:not(.eyebrow){max-width:100%!important}

  .flipbook-modal{padding:0!important}
  .flipbook-dialog{height:100dvh!important;border:0}
  .flipbook-dialog>header{padding:8px!important}
  .flip-toolbar{gap:5px}
  .flip-toolbar .flip-tool,.flip-toolbar [data-flip-close]{width:38px;height:36px;min-width:38px}
  .flip-toolbar .flip-download{display:none}
  body .flip-stage{padding:6px!important;overflow:auto}
  body .flip-page{width:calc(100vw - 12px)!important;height:calc(100dvh - 64px)!important}
  body .flip-page.is-single-page{grid-template-columns:1fr!important}
  body .flip-page.is-single-page .book-page-left{display:none!important}
  body .flip-page.is-single-page .book-page-right{grid-column:1!important;border-radius:4px!important}

  .whatsapp-widget{right:10px!important;bottom:10px!important}
  .whatsapp-popup{right:0;width:calc(100vw - 20px)}
}

@media (max-width:430px){
  .site-header,.site-header.scrolled{padding-inline:9px!important}
  .site-header .brand img,.site-header.scrolled .brand img{width:70px!important;max-width:70px!important}
  .header-actions{grid-template-columns:minmax(0,1fr) 62px minmax(0,1fr)!important;gap:5px!important}
  .header-actions .theme-toggle{width:62px!important;min-width:62px!important;grid-template-columns:27px 27px!important}
  .header-actions .theme-icon{width:26px!important}
  .header-actions .language-trigger{grid-template-columns:20px minmax(0,1fr) 10px;gap:5px;padding-inline:6px}
  .header-actions .header-quote-btn{font-size:10px!important;padding-inline:5px!important}
  .hero h1{font-size:clamp(36px,12vw,50px)!important}
  .hero-content{padding-top:48px!important}
  .mini-features{grid-template-columns:1fr}
  .certificate-showcase article{min-height:0!important}
  .certificate-showcase button{grid-template-rows:auto auto auto auto!important;gap:12px}
  .certificate-showcase .certificate-thumb{height:auto;max-height:240px}
  .product-family summary{grid-template-columns:38px 68px minmax(0,1fr)!important;padding:10px!important}
  .product-family-thumb{height:58px!important}
  .product-family summary strong{font-size:15px!important}
  .product-family summary small{display:none}
  .whatsapp-fab{min-width:50px;padding-inline:10px}
}

/* Configurator-specific responsive hardening. */
.configurator-page .wrap{width:min(1720px,calc(100% - 36px))!important}
.configurator-page .cfg-shell,.configurator-page .cfg-form,.configurator-page .cfg-summary{min-width:0}
.configurator-page .cfg-panel h2,.configurator-page .cfg-panel>header>span,
.configurator-page .choice-card,.configurator-page .code-result,.configurator-page .fitting-card{
  overflow-wrap:anywhere;
}
@media (max-width:1320px){
  .configurator-page .wrap{width:min(1320px,calc(100% - 28px))!important}
}
@media (max-width:1180px){
  .configurator-page .cfg-shell{grid-template-columns:150px minmax(0,1fr) 300px!important;gap:15px!important}
  .configurator-page .cfg-panel{padding:26px}
}
@media (max-width:1050px){
  .configurator-page .cfg-shell{grid-template-columns:minmax(0,1fr) 290px!important;grid-template-areas:"steps steps" "form summary"!important}
  .configurator-page .cfg-steps{max-width:100%;overflow-x:auto}
  .configurator-page .cfg-summary{max-height:none!important;overflow:visible!important}
}
@media (max-width:790px){
  .configurator-page .wrap{width:calc(100% - 24px)!important}
  .configurator-page .cfg-hero-grid{grid-template-columns:1fr!important}
  .configurator-page .cfg-shell{grid-template-columns:1fr!important;grid-template-areas:"steps" "form" "summary"!important}
  .configurator-page .cfg-panel{padding:20px!important}
  .configurator-page .cfg-grid--2,.configurator-page .cfg-grid--3,
  .configurator-page .fitting-grid,.configurator-page .fitting-controls,
  .configurator-page .choice-cards,.configurator-page .final-summary{grid-template-columns:1fr!important}
  .configurator-page .code-result{grid-template-columns:1fr 1fr!important}
  .configurator-page .code-result>:first-child{grid-column:1/-1}
}
@media (max-width:520px){
  .configurator-page .cfg-hero{padding:48px 0 38px!important}
  .configurator-page .cfg-hero h1{font-size:clamp(35px,11vw,48px)!important}
  .configurator-page .cfg-lead{font-size:15px}
  .configurator-page .cfg-panel{padding:16px!important}
  .configurator-page .cfg-steps button{min-width:135px}
  .configurator-page .code-search,.configurator-page .code-result{grid-template-columns:1fr!important}
  .configurator-page .cfg-navigation{display:grid;grid-template-columns:1fr 1fr;padding:10px!important}
  .configurator-page .cfg-nav-btn{width:100%!important;min-width:0!important}
  .configurator-page .spring-stage--hero{min-height:190px}
  .configurator-page .spring-measure{font-size:9px}
  .configurator-page .dimension-lines{font-size:9px;grid-template-columns:20px auto 1fr 20px auto}
}
