/* Shared screen layout for the homepage and design studio. */
@media screen {
  :root{--tp-gutter:clamp(16px,3vw,48px);--tp-width:1440px;--tp-orange:#ff5a00;--tp-ink:#081f2c}
  html{scroll-padding-top:110px}
  body{min-width:0}
  body :is(.hero-content,.hero-inner,.interior-grid,.model-detail,.intro-grid,.grid2,.grid3,.grid4,.choice-grid,.model-grid,.catalogue-grid,.selected-grid,.footer-top)>*{min-width:0}
  body :is(.hero .actions>.button,.hero .actions>.tp-brochure-button,.hero-btn,.nav-cta,.tp-header-ctas>a,.tp-header-ctas>button,.tp-brochure-button,.tp-interior-actions>.button,.interior-copy>.text-link,.studio-integration .button,.btn.primary){
    display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;
    min-height:48px;height:auto;max-width:100%;padding:12px 18px;border:2px solid var(--tp-orange)!important;
    border-radius:12px;background:var(--tp-orange)!important;color:var(--tp-ink)!important;
    font-family:inherit;font-size:15px;font-weight:800;line-height:1.35;text-align:center;
    white-space:normal;overflow-wrap:break-word;text-decoration:none!important;transform:none;
    transition:background-color .18s,border-color .18s,box-shadow .18s
  }
  body :is(.hero .actions>.button,.hero .actions>.tp-brochure-button,.hero-btn,.nav-cta,.tp-header-ctas>a,.tp-header-ctas>button,.tp-brochure-button,.tp-interior-actions>.button,.interior-copy>.text-link,.studio-integration .button,.btn.primary):hover:not(:disabled){background:#ff7b29!important;border-color:#ff7b29!important;filter:none;transform:none;box-shadow:0 4px 14px #0002}
  body :is(.hero .actions>.button,.hero-btn,.nav-cta,.tp-header-ctas>*,.tp-brochure-button,.tp-interior-actions>.button,.btn.primary):active:not(:disabled){background:#eb4e00!important;border-color:#eb4e00!important;filter:none;transform:none}

  /* Homepage: natural section height prevents wrapped CTAs being clipped. */
  .tp-main .container{width:calc(100% - var(--tp-gutter)*2);max-width:var(--tp-width);margin-inline:auto}
  .tp-main main{overflow:visible}
  .tp-main .section{padding-block:clamp(36px,4.5vw,72px)}
  .tp-main .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;height:auto;min-height:0;overflow:visible;padding:0;background:#102631}
  .tp-main .hero-content{grid-column:1;grid-row:1;width:100%;max-width:none;height:auto;min-width:0;padding:clamp(36px,4.5vw,72px) var(--tp-gutter);background:none}
  .tp-main .hero-image{grid-column:2;grid-row:1;position:relative;inset:auto;order:0;z-index:0;width:100%;height:auto;max-height:680px;aspect-ratio:4/3;object-fit:contain;object-position:center}
  .tp-main .hero-shade{display:none}
  .tp-main .hero h1{font-size:clamp(38px,3.6vw,66px);line-height:1.08;overflow-wrap:break-word}
  .tp-main .hero-subtitle{font-size:clamp(17px,1.5vw,23px);margin:20px 0 28px}
  .tp-main .hero-caption{position:static;grid-column:2;grid-row:2;justify-self:center;max-width:calc(100% - 32px);margin:0 16px 20px;font-size:13px;text-align:center}
  .tp-main .hero .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:12px;width:100%;overflow:visible}
  .tp-main .hero .actions>*{width:100%;min-width:0;margin:0;visibility:visible;opacity:1}
  .tp-main .tp-interior-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:12px;margin-top:28px}
  .tp-main .tp-interior-actions>*{width:100%;min-width:0}
  .tp-main .interior-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(24px,3vw,44px);align-items:center}
  .tp-main .interior-copy{display:block}
  .tp-main .interior-grid>.photo-button{aspect-ratio:3/2}
  .tp-main .interior-grid>.photo-button img{width:100%;height:100%;object-fit:contain}
  .tp-main .benefits{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:20px}
  .tp-main .benefits>div{height:100%;align-items:flex-start;min-width:0;padding:22px}
  .tp-main .benefits>div>div{display:block;min-width:0}
  .tp-main .models-section .model-detail{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
  .tp-main .models-section .model-image{width:100%;min-height:0;aspect-ratio:auto;align-self:center}
  .tp-main .models-section .model-image img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}
  .tp-main .models-section .model-info{padding:clamp(20px,2.5vw,36px)}
  .tp-main .models-section .model-info dl{grid-template-columns:1fr;gap:12px}
  .tp-main .models-section .model-info dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
  .tp-main .models-section .model-info dd{margin:0;font-size:20px;white-space:normal;text-align:right}
  .tp-main .models-section .premium-specs ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px}
  .tp-main #business-pages{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;align-items:stretch}
  .tp-main #business-pages a{grid-column:span 2;min-width:0;height:100%;min-height:0;padding:24px;align-items:flex-start}
  .tp-main #business-pages a:nth-last-child(-n+2){grid-column:span 3}
  .tp-main #business-pages .tp-concept-copy{align-self:stretch;flex:1}
  .tp-main #business-pages .tp-concept-action{margin-top:auto;background:var(--tp-orange);border-color:var(--tp-orange);border-radius:12px;min-height:44px}
  .tp-main .studio-integration>.container{max-width:var(--tp-width);flex-wrap:wrap;gap:24px}
  .tp-main .studio-integration>.container>div{flex:1 1 420px;min-width:0}
  .tp-main .tp-brochure-inner{width:calc(100% - var(--tp-gutter)*2);max-width:var(--tp-width);grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px}
  .tp-main .intro-screen video{width:min(100%,1440px);max-height:min(68svh,740px);object-fit:contain}
  .tp-main .intro-toolbar{width:100%;max-width:1440px;flex-wrap:wrap;gap:12px;padding:14px var(--tp-gutter)}
  .tp-main .intro-controls{display:flex;flex-wrap:wrap;gap:10px}
  .tp-main .header{display:flex;flex-wrap:nowrap;min-height:78px;height:auto;padding:10px 24px;gap:12px}
  .tp-main .header>.brand{font-size:1.35rem;flex-shrink:0}
  .tp-main .header #nav{display:flex;position:static;flex:1;min-width:0;margin-left:auto;padding:0;gap:2px;border:0;background:transparent}
  .tp-main .header #nav a{padding:8px;font-size:12px;line-height:1.3;white-space:normal;text-align:center}
  .tp-main .header .tp-header-ctas{display:flex;width:auto;margin-left:auto;gap:8px;flex-shrink:0}
  .tp-main .header .tp-header-ctas>*{font-size:13px;padding:11px 12px;min-height:48px;max-width:185px}
  .tp-main .header .header-actions{margin:0;gap:8px;flex-shrink:0}
  .tp-main .header .language-control{flex-basis:160px;width:160px;height:54px}
  .tp-main .header .menu-button{display:none;flex-shrink:0}

  /* Designer: consistent containers and readable, equal-width cards. */
  .tp-designer :is(.navbar,.hero-inner,.site-section,.studio,.footer-inner){max-width:var(--tp-width);width:100%;margin-inline:auto;padding-inline:var(--tp-gutter)}
  .tp-designer .hero{min-height:0;height:auto}
  .tp-designer .hero-inner{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);padding-block:clamp(36px,5vw,76px)}
  .tp-designer .hero h1{font-size:clamp(38px,4.5vw,72px);line-height:1.06}
  .tp-designer .hero-card{width:100%;max-width:none;min-width:0;padding:clamp(16px,2vw,28px)}
  .tp-designer .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
  .tp-designer .hero-actions>*{min-width:0}
  .tp-designer .hero-card-copy{flex-wrap:wrap;align-items:center}
  .tp-designer .site-section,.tp-designer .studio{padding-block:clamp(36px,4.5vw,64px)}
  .tp-designer .panel{width:100%;min-width:0;padding:clamp(18px,2.5vw,32px);margin-block:20px}
  .tp-designer :is(.grid2,.choice-grid){grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
  .tp-designer .grid3,.tp-designer .model-grid,.tp-designer .catalogue-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
  .tp-designer .model-card{min-width:0;width:100%;height:100%;padding:20px;text-align:left}
  .tp-designer .choice{height:100%;min-width:0}
  .tp-designer .selected-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .tp-designer .selected-product{min-width:0;grid-template-columns:100px minmax(0,1fr);gap:16px;padding:16px}
  .tp-designer .catalogue-filters{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;position:static}
  .tp-designer .equipment-heading{flex-wrap:wrap;gap:16px}
  .tp-designer .selection-pill{white-space:normal}
  .tp-designer .phone-fields{min-width:0}
  .tp-designer .phone-fields #dialCode{width:105px;flex-basis:105px}
  .tp-designer .field :is(input,select,textarea){min-width:0;font-size:16px}
  .tp-designer .progress{grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
  .tp-designer .prog{min-width:0;white-space:normal;overflow-wrap:break-word}
  .tp-designer .navbar{min-height:78px;height:auto;padding-block:10px;gap:16px}
  .tp-designer .navbar .brand-image{width:clamp(100px,12vw,160px);height:50px}
  .tp-designer .site-header .langs{display:block;flex-basis:160px;width:160px;height:54px;margin-left:auto}
  .tp-designer .desktop-nav{gap:12px;font-size:13px}
  .tp-designer .desktop-nav a{line-height:1.3;text-align:center}
  .tp-designer .navbar>.nav-cta{display:inline-flex;font-size:13px;max-width:185px}
  .tp-designer .mobile-menu-btn{flex-shrink:0;margin-left:0}
  body :is(.tp-brochure-dialog,#productDialog,.lightbox){max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
}
@media screen and (min-width:1800px){.tp-main .hero .actions{grid-template-columns:repeat(4,minmax(0,1fr))}.tp-main .hero-content{padding-left:max(var(--tp-gutter),calc((100vw - 1680px)/2))}}
@media screen and (max-width:1199px){
  .tp-main .header #nav{display:none;position:absolute;top:100%;left:0;right:0;max-height:65dvh;overflow:auto;padding:16px 24px;background:white;border-bottom:1px solid #dce1e3}
  .tp-main .header #nav.open{display:flex;flex-direction:column;align-items:stretch}
  .tp-main .header #nav a{text-align:left;font-size:15px;padding:10px}
  .tp-main .header .menu-button{display:block}
  .tp-designer .desktop-nav{display:none}.tp-designer .mobile-menu-btn{display:block}
  .tp-designer .selected-grid{grid-template-columns:1fr}
  .tp-main .models-section .premium-specs ul{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media screen and (max-width:999px){
  .tp-main .hero{grid-template-columns:1fr}
  .tp-main .hero-content{grid-column:1;grid-row:1;max-width:780px;margin-inline:auto;padding:40px var(--tp-gutter)}
  .tp-main .hero-image{grid-column:1;grid-row:2;max-height:480px;aspect-ratio:16/9}
  .tp-main .hero-caption{grid-column:1;grid-row:3}
  .tp-main .hero h1{font-size:clamp(36px,5.5vw,54px)}
  .tp-main .interior-grid{grid-template-columns:1fr;max-width:800px;margin-inline:auto}
  .tp-main .interior-copy .feature-list{margin-block:16px}
  .tp-main .interior-copy .feature-list li{padding-block:5px}
  .tp-main .tp-interior-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp-main .benefits{gap:16px}.tp-main .benefits>div{display:block;padding:18px}.tp-main .benefits svg{margin-bottom:12px}
  .tp-main #business-pages{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .tp-main #business-pages a,.tp-main #business-pages a:nth-last-child(-n+2){grid-column:auto;padding:22px;gap:16px}
  .tp-main #business-pages a:last-child{grid-column:1/-1}
  .tp-main .tp-brochure-inner{gap:24px}
  .tp-designer .hero-inner{grid-template-columns:1fr;max-width:820px}
  .tp-designer .hero h1{font-size:clamp(38px,6vw,60px)}
  .tp-designer .intro-grid{grid-template-columns:1fr;gap:24px}
  .tp-designer .grid3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp-designer .model-grid{grid-template-columns:1fr;max-width:680px;margin-inline:auto}
  .tp-designer .catalogue-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp-designer .navbar>.nav-cta{display:none}
}
@media screen and (max-width:899px){
  html{scroll-padding-top:165px}
  .tp-main .header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:10px 16px}
  .tp-main .header>.brand{grid-column:1;grid-row:1;font-size:1.2rem}
  .tp-main .header .header-actions{grid-column:2;grid-row:1}
  .tp-main .header .tp-header-ctas{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;margin:0}
  .tp-main .header .tp-header-ctas>*{max-width:none;width:100%;font-size:14px}
}
@media screen and (max-width:699px){
  .tp-main .models-section .model-detail,.tp-main .tp-brochure-inner{grid-template-columns:1fr}
  .tp-main .models-section .premium-specs ul{grid-template-columns:1fr}
  .tp-main .benefits{grid-template-columns:1fr}
  .tp-main .benefits>div{display:flex;align-items:center}.tp-main .benefits svg{margin:0}
  .tp-main #business-pages{grid-template-columns:1fr}
  .tp-main #business-pages a:last-child{grid-column:auto}
  .tp-main .studio-integration>.container{display:flex;flex-direction:column;align-items:stretch}
  .tp-main .studio-integration>.container>div{flex:auto}
  .tp-main .studio-integration .button{width:100%}
  .tp-designer :is(.grid2,.grid3,.grid4,.choice-grid,.catalogue-grid,.tech,.elevations,.boards,.final-overview){grid-template-columns:1fr}
  .tp-designer .business-presets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp-designer .progress{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp-designer .catalogue-filters{grid-template-columns:1fr}
  .tp-designer .catalogue-filters span{padding:0}
  .tp-designer .site-header .langs{width:145px;flex-basis:145px}
  .tp-designer .navbar{gap:10px}
  .tp-main .intro-controls{width:100%}.tp-main .intro-controls .button{flex:1 1 140px}
}
@media screen and (max-width:399px){
  .tp-main .header{padding-inline:12px}.tp-main .header>.brand{font-size:1.1rem}.tp-main .header .brand-mark{display:none}
  .tp-main .header .language-control{width:140px;flex-basis:140px}
  .tp-main .hero .actions,.tp-main .tp-interior-actions,.tp-designer .hero-actions{grid-template-columns:1fr}
  .tp-designer .navbar .brand-image{width:88px}.tp-designer .site-header .langs{width:138px;flex-basis:138px}
  .tp-designer .selected-product{grid-template-columns:75px minmax(0,1fr);gap:10px;padding:12px}
  .tp-designer .equipment-controls{grid-template-columns:1fr}
}
@media screen and (orientation:landscape) and (max-height:600px){
  html{scroll-padding-top:24px}
  .tp-main .header,.tp-designer .site-header{position:relative;top:auto}
  .tp-main .hero,.tp-designer .hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;align-items:center}
  .tp-main .hero-content{grid-column:1;grid-row:1;padding:28px var(--tp-gutter)}
  .tp-main .hero-image{grid-column:2;grid-row:1;max-height:none;aspect-ratio:4/3}
  .tp-main .hero-caption{grid-column:2;grid-row:2;font-size:11px}
  .tp-main .hero h1,.tp-designer .hero h1{font-size:clamp(28px,3.8vw,42px)}
  .tp-main .hero .eyebrow{margin-bottom:14px}.tp-main .hero-subtitle{margin:16px 0;font-size:16px}
  .tp-main .hero .actions,.tp-designer .hero-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .tp-main .hero .actions>*,.tp-designer .hero-actions>*{font-size:13px;padding:10px;min-height:48px}
  .tp-main .intro-screen video{max-height:65svh}.tp-main .intro-toolbar{flex-wrap:wrap;padding-block:10px}
  .tp-designer .hero-inner{padding-block:28px;gap:20px}
  .tp-designer .hero p{font-size:15px;margin-bottom:18px}
  .tp-designer .hero-card-copy{display:block}.tp-designer .hero-card-copy span{display:block;text-align:left;margin-top:8px}
  .tp-designer .catalogue-filters{position:static}
  body :is(.tp-brochure-dialog,#productDialog){padding:16px;max-height:calc(100dvh - 16px)}
}
@media screen and (orientation:landscape) and (max-height:600px) and (min-width:760px){
  .tp-main .header{display:flex;gap:10px;padding:8px 16px}
  .tp-main .header .tp-header-ctas{display:flex;width:auto;margin-left:auto;gap:8px}
  .tp-main .header .tp-header-ctas>*{font-size:12px;max-width:160px;padding:10px}
  .tp-main .header>.brand{font-size:1.1rem}.tp-main .header .brand-mark{display:none}
  .tp-main .header .language-control{width:145px;flex-basis:145px}
}
@media(prefers-reduced-motion:reduce){body :is(.button,.hero-btn,.nav-cta,.tp-header-ctas>*,.tp-brochure-button,.btn){transition:none!important;transform:none!important}}

/* Shared header layout: logo, evenly distributed navigation, actions, language. */
@media screen {
.tp-main .header,.tp-designer .site-header{background:#fff;color:#0a202d}
.tp-main .header,.tp-designer .site-header .navbar{max-width:none;width:100%;min-height:78px;height:auto;margin:0;padding:10px 24px;display:flex;align-items:center;gap:24px;flex-wrap:nowrap}
.tp-main .header>.brand,.tp-designer .navbar>.logo{display:inline-flex;align-items:center;gap:9px;flex-shrink:0;font-family:Montserrat,Arial,sans-serif;font-size:1.35rem;font-weight:800;line-height:1;letter-spacing:-.065em;text-decoration:none!important;color:#0a202d}
.tp-main .header .brand-mark,.tp-designer .navbar .brand-mark{display:block;width:42px;height:37px;flex:0 0 42px;background:url('https://trailerpop.eu/assets/trailerpop-logo.png') -25px -10px/90px 67.5px no-repeat}
.tp-designer .navbar .orange{color:#ff5a00}
.tp-main .header #nav,.tp-designer .navbar .desktop-nav{display:flex;position:static;flex:1;min-width:0;justify-content:space-evenly;align-items:center;margin:0;padding:0;gap:12px;background:transparent;border:0}
.tp-main .header #nav a,.tp-designer .desktop-nav a{font:650 14px/1.3 Inter,Arial,sans-serif;text-align:center;white-space:nowrap;padding:10px 0;text-decoration:none!important;color:#0a202d}
.tp-main .header .tp-header-ctas,.tp-designer .navbar .tp-header-ctas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;flex-shrink:0;margin:0;width:auto}
.tp-main .header .tp-header-ctas>*,.tp-designer .navbar .tp-header-ctas>*{display:flex;width:100%;max-width:none;min-height:54px;align-items:center;justify-content:center;padding:12px 18px;font:800 14px/1.3 Inter,Arial,sans-serif;text-align:center;text-decoration:none!important;background:#ff5a00;color:#081f2c;border-radius:12px}
.tp-main .header .header-actions{margin:0;gap:12px}
.tp-main .header .language-control,.tp-designer .site-header .langs{display:block;width:170px;flex:0 0 170px;height:58px;margin:0;border-color:#ff5a00}
.tp-main .header .language-label{display:none}
.tp-main .header .language-control #language,.tp-designer .site-header .langs #designLanguage{position:absolute;inset:0;opacity:1;box-sizing:border-box;width:100%;max-width:none;height:100%;min-height:0;padding:22px 25px 3px 38px;margin:0;border:0;border-radius:10px;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23102936' stroke-width='2'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E") right 8px center/16px no-repeat;appearance:none;-webkit-appearance:none;color:#102936;font:750 15px/20px Arial,sans-serif;cursor:pointer;z-index:2;color-scheme:light}
.tp-main .header .menu-button,.tp-designer .navbar .mobile-menu-btn{display:none}
}
@media screen and (max-width:1199px){
.tp-main .header,.tp-designer .site-header .navbar{gap:16px}
.tp-main .header #nav{display:none;position:absolute;top:100%;left:0;right:0;max-height:65dvh;overflow:auto;padding:16px 24px;background:white;border-bottom:1px solid #dce1e3}
.tp-main .header #nav.open{display:flex;flex-direction:column;align-items:stretch}
.tp-main .header #nav a{text-align:left}
.tp-designer .navbar .desktop-nav{display:none}
.tp-main .header .tp-header-ctas,.tp-designer .navbar .tp-header-ctas{margin-left:auto}
.tp-main .header .menu-button,.tp-designer .navbar .mobile-menu-btn{display:block;flex-shrink:0;margin:0}
}
@media screen and (max-width:899px){
.tp-main .header,.tp-designer .site-header .navbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;padding:10px 16px;gap:10px}
.tp-main .header>.brand,.tp-designer .navbar>.logo{grid-column:1;grid-row:1;font-size:1.2rem;gap:5px;min-width:0}
.tp-main .header .header-actions{grid-column:2/4;grid-row:1}
.tp-designer .navbar .langs{grid-column:2;grid-row:1}
.tp-designer .navbar .mobile-menu-btn{grid-column:3;grid-row:1}
.tp-main .header .tp-header-ctas,.tp-designer .navbar .tp-header-ctas{grid-column:1/-1;grid-row:2;width:100%;margin:0;gap:10px}
.tp-main .header .language-control,.tp-designer .site-header .langs{width:150px;flex-basis:150px;height:54px}
.tp-main .header .tp-header-ctas>*,.tp-designer .navbar .tp-header-ctas>*{min-height:48px;font-size:14px;padding:10px}
}
@media screen and (max-width:420px){
.tp-main .header,.tp-designer .site-header .navbar{padding-inline:12px;gap:8px}
.tp-main .header .brand-mark,.tp-designer .navbar .brand-mark{display:none}
.tp-main .header>.brand,.tp-designer .navbar>.logo{font-size:1.1rem}
.tp-main .header .language-control,.tp-designer .site-header .langs{width:140px;flex-basis:140px}
}