
/* ============================================================
   CHANGAN PUEBLA — MODEL PAGE MODERN V2
   ============================================================ */

.model-page{
  --model-blue:#0B457F;
  --model-blue-2:#1267aa;
  --model-sky:#B3CFE4;
  --model-ink:#101923;
  --model-muted:#667987;
  --model-line:#dce7ef;
  background:#fff;
  color:var(--model-ink);
}

.model-page section[id]{
  scroll-margin-top:calc(var(--header) + 54px);
}

/* ---------------- HERO ---------------- */
.model-hero{
  position:relative;
  overflow:hidden;
  min-height:760px;
  padding-top:var(--header);
  background:
    radial-gradient(circle at 78% 28%,rgba(179,207,228,.72),transparent 25%),
    radial-gradient(circle at 90% 70%,rgba(112,142,201,.20),transparent 30%),
    linear-gradient(120deg,#f9fcff 0%,#edf6fc 50%,#dcecf7 100%);
}

.hero-horizon{
  position:absolute;
  left:-5%;
  right:-5%;
  bottom:132px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(11,69,127,.26),transparent);
}

.hero-horizon::after{
  content:"";
  position:absolute;
  left:15%;
  right:0;
  top:-18px;
  height:38px;
  background:linear-gradient(90deg,transparent,rgba(179,207,228,.22),transparent);
  filter:blur(16px);
}

.hero-orbit{
  position:absolute;
  border:1px solid rgba(11,69,127,.08);
  border-radius:50%;
  pointer-events:none;
}

.orbit-one{
  width:660px;
  height:660px;
  right:-190px;
  top:30px;
}

.orbit-two{
  width:820px;
  height:820px;
  right:-320px;
  top:-70px;
}

.model-hero-grid{
  position:relative;
  z-index:2;
  min-height:630px;
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  align-items:center;
  gap:20px;
}

.model-back{
  display:inline-flex;
  margin-bottom:22px;
  color:#607482;
  font-size:11px;
  font-weight:600;
}

.model-hero-copy{
  position:relative;
  z-index:5;
  max-width:550px;
}

.model-hero h1{
  margin:7px 0 18px;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:clamp(64px,6.5vw,96px);
  line-height:.88;
  letter-spacing:-.035em;
  font-weight:400;
  color:var(--model-blue);
  text-transform:uppercase;
}

.model-hero-copy>p{
  max-width:470px;
  font-size:16px;
  line-height:1.68;
  color:#4d6475;
}

.model-hero-price{
  margin-top:27px;
}

.model-hero-price small,
.model-hero-price span{
  display:block;
  color:#667986;
}

.model-hero-price small{
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.model-hero-price strong{
  display:block;
  margin:3px 0 5px;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:39px;
  line-height:1;
  font-weight:400;
  color:#0b1620;
}

.model-hero-price span{
  font-size:11px;
}

.model-hero-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:25px;
}

.model-stage{
  position:relative;
  min-height:530px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.model-ghost-name{
  position:absolute;
  top:13%;
  left:2%;
  right:0;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:clamp(84px,10vw,150px);
  letter-spacing:-.05em;
  line-height:.8;
  color:rgba(11,69,127,.055);
  white-space:nowrap;
  text-align:center;
  pointer-events:none;
}

.model-stage-glow{
  position:absolute;
  left:12%;
  right:4%;
  bottom:9%;
  height:32%;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(22,99,160,.24),rgba(179,207,228,.15) 36%,transparent 70%);
  filter:blur(18px);
}

.model-car{
  position:relative;
  z-index:2;
  width:108%;
  max-width:930px;
  object-fit:contain;
  filter:drop-shadow(0 30px 24px rgba(28,56,82,.18));
}

.floating-fact{
  position:absolute;
  z-index:4;
  min-width:118px;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.85);
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(13px);
  box-shadow:0 13px 28px rgba(24,56,84,.10);
}

.floating-fact small,
.floating-fact strong{
  display:block;
}

.floating-fact small{
  font-size:9px;
  color:#70818d;
}

.floating-fact strong{
  margin-top:2px;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  color:var(--model-blue);
  font-size:20px;
  font-weight:400;
}

.fact-a{left:5%;bottom:20%}
.fact-b{right:5%;top:26%}
.fact-c{right:1%;bottom:18%}

.hero-spec-bar{
  position:relative;
  z-index:6;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  min-height:102px;
  margin-bottom:-51px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
  border:1px solid rgba(211,226,237,.92);
  box-shadow:0 18px 40px rgba(25,61,90,.10);
}

.hero-spec-bar>div{
  padding:22px 26px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-right:1px solid var(--model-line);
}

.hero-spec-bar>div:last-child{border-right:0}

.hero-spec-bar strong{
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:29px;
  line-height:1;
  font-weight:400;
  color:var(--model-blue);
}

.hero-spec-bar span{
  margin-top:7px;
  color:#72828e;
  font-size:10px;
}

/* ---------------- MODEL NAV ---------------- */
.model-anchor-nav{
  position:sticky;
  top:var(--header);
  z-index:75;
  padding-top:51px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(220,231,239,.95);
}

.model-anchor-nav .container{
  min-height:55px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:32px;
  overflow-x:auto;
  scrollbar-width:none;
}

.model-anchor-nav .container::-webkit-scrollbar{display:none}

.model-anchor-nav a{
  flex:0 0 auto;
  position:relative;
  padding:18px 1px 17px;
  color:#71818c;
  font-size:11px;
  font-weight:600;
}

.model-anchor-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  transform:scaleX(0);
  background:var(--model-blue);
  transition:transform .22s ease;
}

.model-anchor-nav a:hover,
.model-anchor-nav a.active{
  color:var(--model-blue);
}

.model-anchor-nav a.active::after{
  transform:scaleX(1);
}

/* ---------------- SHARED HEADING ---------------- */
.modern-heading{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  gap:70px;
  align-items:end;
  margin-bottom:44px;
}

.modern-heading h2{
  max-width:850px;
  margin:8px 0 0;
  font-size:clamp(48px,5.4vw,74px);
  line-height:.94;
}

.modern-heading>p{
  margin:0 0 5px;
  color:#647785;
  font-size:14px;
  line-height:1.7;
}

/* ---------------- INTRO / VERSION ---------------- */
.model-intro{
  padding-top:120px;
  background:#fff;
}

.pillar-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.pillar-card{
  min-height:250px;
  padding:30px;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(241,247,251,.96));
  border:1px solid var(--model-line);
  transition:transform .25s ease,box-shadow .25s ease;
}

.pillar-card::before{
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  right:-90px;
  bottom:-90px;
  border:1px solid rgba(11,69,127,.12);
  border-radius:50%;
}

.pillar-card:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 36px rgba(25,56,81,.09);
}

.pillar-card>span{
  color:#93a4b0;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:14px;
}

.pillar-card h3{
  margin:64px 0 10px;
  font-size:28px;
  color:var(--model-blue);
}

.pillar-card p{
  max-width:315px;
  margin:0;
  color:#607482;
  font-size:12px;
  line-height:1.65;
}

.version-modern{
  margin-top:18px;
  min-height:210px;
  display:grid;
  grid-template-columns:.72fr 1.55fr auto;
  gap:34px;
  align-items:center;
  padding:32px 34px;
  background:#0a2237;
  color:#fff;
}

.version-modern-price small,
.version-modern-price span,
.version-modern-price strong{
  display:block;
}

.version-modern-price small{
  color:#b9cbd8;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.version-modern-price strong{
  margin:5px 0;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:34px;
  font-weight:400;
}

.version-modern-price span{
  color:#91a8b9;
  font-size:9px;
}

.version-modern-features{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px 18px;
}

.version-modern-features span{
  position:relative;
  padding-left:13px;
  color:#d4e0e8;
  font-size:10px;
  line-height:1.45;
}

.version-modern-features span::before{
  content:"";
  position:absolute;
  left:0;
  top:.52em;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#8ab8dd;
}

/* ---------------- EXTERIOR ---------------- */
.exterior-showcase{
  padding-top:88px;
  background:#fff;
}

.exterior-hero{
  position:relative;
  min-height:680px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background:#0a1723;
}

.exterior-hero>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.exterior-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(5,16,27,0) 36%,rgba(5,16,27,.15) 54%,rgba(5,16,27,.88) 100%);
}

.exterior-copy{
  position:relative;
  z-index:2;
  padding-bottom:60px;
  color:#fff;
}

.exterior-copy h2{
  max-width:720px;
  margin:8px 0 14px;
  font-size:clamp(54px,6.2vw,82px);
  line-height:.92;
  color:#fff;
}

.exterior-copy p{
  max-width:500px;
  color:#dce7ee;
  line-height:1.65;
  font-size:13px;
}

.media-bento{
  display:grid;
  grid-template-columns:1.3fr .7fr;
  grid-template-rows:repeat(2,300px);
  gap:14px;
  margin-top:14px;
}

.media-card{
  position:relative;
  overflow:hidden;
  background:#e7eef3;
}

.media-card-1{
  grid-row:1 / 3;
}

.media-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}

.media-card:hover img{
  transform:scale(1.035);
}

.media-card-gradient{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 42%,rgba(5,14,22,.8) 100%);
}

.media-caption{
  position:absolute;
  left:25px;
  right:25px;
  bottom:24px;
  color:#fff;
}

.media-caption span{
  font-size:9px;
  color:#c5d5e0;
}

.media-caption h3{
  margin:5px 0 4px;
  color:#fff;
  font-size:23px;
}

.media-caption p{
  max-width:380px;
  margin:0;
  color:#d7e2ea;
  font-size:10px;
  line-height:1.5;
}

/* ---------------- INTERIOR ---------------- */
.interior-modern{
  padding-top:100px;
  background:
    radial-gradient(circle at 82% 20%,rgba(179,207,228,.22),transparent 25%),
    #f5f9fc;
}

.interior-feature-hero{
  position:relative;
  min-height:600px;
  overflow:hidden;
}

.interior-feature-hero>img{
  width:100%;
  height:600px;
  object-fit:cover;
}

.interior-feature-copy{
  position:absolute;
  left:28px;
  bottom:28px;
  min-width:230px;
  padding:19px 22px;
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(12px);
}

.interior-feature-copy small{
  color:#8899a5;
  font-size:9px;
}

.interior-feature-copy h3{
  margin:3px 0 0;
  color:var(--model-blue);
  font-size:24px;
}

.interior-cards{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.interior-card{
  position:relative;
  min-height:280px;
  overflow:hidden;
  background:#d9e3e9;
}

.interior-card img{
  width:100%;
  height:280px;
  object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}

.interior-card:hover img{transform:scale(1.035)}

.interior-card>div{
  position:absolute;
  left:16px;
  right:16px;
  bottom:16px;
  padding:13px 15px;
  background:rgba(8,23,36,.74);
  backdrop-filter:blur(8px);
  color:#fff;
}

.interior-card small{
  color:#b9cbd7;
  font-size:8px;
}

.interior-card h3{
  margin:3px 0 0;
  color:#fff;
  font-size:16px;
}

.tech-feature-grid{
  margin-top:30px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-left:1px solid var(--model-line);
  border-top:1px solid var(--model-line);
}

.tech-feature{
  min-height:112px;
  padding:24px;
  background:#fff;
  border-right:1px solid var(--model-line);
  border-bottom:1px solid var(--model-line);
}

.tech-feature>span{
  display:block;
  width:22px;
  height:2px;
  margin-bottom:19px;
  background:var(--model-blue);
}

.tech-feature p{
  margin:0;
  color:#506575;
  font-size:11px;
  line-height:1.55;
}

/* ---------------- PERFORMANCE ---------------- */
.performance-modern{
  position:relative;
  padding:0 0 90px;
  overflow:hidden;
  background:#071725;
  color:#fff;
}

.performance-media{
  position:relative;
  height:660px;
  overflow:hidden;
}

.performance-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.performance-image-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(5,17,28,.92) 0%,rgba(5,17,28,.58) 44%,rgba(5,17,28,.12) 76%),
    linear-gradient(180deg,transparent 60%,#071725 100%);
}

.performance-content{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  height:660px;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:50px;
  align-items:center;
  z-index:2;
}

.performance-copy{
  max-width:560px;
}

.performance-copy h2{
  margin:8px 0 16px;
  color:#fff;
  font-size:clamp(54px,6vw,80px);
  line-height:.92;
}

.performance-copy p{
  max-width:470px;
  color:#d6e2ea;
  font-size:13px;
  line-height:1.7;
}

.performance-big-stats{
  align-self:end;
  margin-bottom:70px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  background:rgba(8,25,39,.66);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.12);
}

.performance-big-stats>div{
  min-height:125px;
  padding:22px;
  border-right:1px solid rgba(255,255,255,.12);
}

.performance-big-stats>div:last-child{border-right:0}

.performance-big-stats strong{
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:42px;
  font-weight:400;
  line-height:1;
}

.performance-big-stats>div>span{
  margin-left:4px;
  font-size:11px;
  color:#b7cad8;
}

.performance-big-stats small{
  display:block;
  margin-top:9px;
  color:#8ea5b6;
  font-size:9px;
}

.performance-detail-grid{
  margin-top:24px;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:16px;
}

.engine-card{
  min-height:470px;
  overflow:hidden;
  background:#edf3f6;
}

.engine-card img{
  width:100%;
  height:100%;
  min-height:470px;
  object-fit:cover;
}

.spec-list-modern{
  padding:14px 30px;
  background:#0c2234;
}

.spec-list-modern>div{
  min-height:55px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:20px;
  border-bottom:1px solid rgba(255,255,255,.09);
}

.spec-list-modern>div:last-child{border-bottom:0}

.spec-list-modern span{
  color:#91a7b7;
  font-size:10px;
}

.spec-list-modern strong{
  color:#fff;
  text-align:right;
  font-size:12px;
  font-weight:600;
}

.dimensions-modern{
  margin-top:16px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:rgba(255,255,255,.09);
}

.dimension-modern{
  min-height:120px;
  padding:24px;
  background:#0b2031;
}

.dimension-modern span,
.dimension-modern strong{
  display:block;
}

.dimension-modern span{
  color:#7890a2;
  font-size:9px;
}

.dimension-modern strong{
  margin-top:7px;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  color:#fff;
  font-size:23px;
  font-weight:400;
}

/* ---------------- SAFETY ---------------- */
.safety-modern{
  background:#fff;
}

.safety-showcase{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  gap:14px;
  min-height:560px;
}

.safety-main,
.safety-side{
  position:relative;
  overflow:hidden;
  min-height:560px;
  background:#dce6ec;
}

.safety-main img,
.safety-side img{
  width:100%;
  height:100%;
  min-height:560px;
  object-fit:cover;
}

.safety-badge{
  position:absolute;
  left:24px;
  bottom:24px;
  width:180px;
  padding:18px;
  background:rgba(7,27,43,.82);
  backdrop-filter:blur(10px);
  color:#fff;
}

.safety-badge strong,
.safety-badge span{
  display:block;
}

.safety-badge strong{
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:31px;
  font-weight:400;
}

.safety-badge span{
  margin-top:3px;
  color:#bfd0db;
  font-size:9px;
}

.safety-chip-grid{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:1px;
  background:var(--model-line);
}

.safety-chip-grid span{
  min-height:94px;
  padding:19px;
  display:flex;
  align-items:center;
  background:#f5f9fb;
  color:#4c6272;
  font-size:10px;
  line-height:1.45;
}

/* ---------------- QUOTE ---------------- */
.quote-premium{
  position:relative;
  overflow:hidden;
  padding:90px 0;
  color:#fff;
  background:
    radial-gradient(circle at 80% 20%,rgba(179,207,228,.24),transparent 26%),
    linear-gradient(120deg,#082f55 0%,#0B457F 58%,#1267aa 100%);
}

.quote-horizon{
  position:absolute;
  width:680px;
  height:680px;
  right:-280px;
  top:-310px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
}

.quote-horizon::before,
.quote-horizon::after{
  content:"";
  position:absolute;
  inset:70px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:50%;
}

.quote-horizon::after{inset:150px}

.quote-premium-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:72px;
  align-items:center;
}

.quote-copy h2{
  max-width:610px;
  margin:8px 0 18px;
  color:#fff;
  font-size:clamp(52px,5.5vw,74px);
  line-height:.93;
}

.quote-copy>p{
  max-width:470px;
  color:#d7e4ed;
  line-height:1.7;
  font-size:13px;
}

.quote-mini-contact{
  margin-top:30px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.quote-mini-contact a{
  min-width:190px;
  padding:15px 18px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(8px);
}

.quote-mini-contact small,
.quote-mini-contact strong{
  display:block;
  color:#fff;
}

.quote-mini-contact small{
  color:#b9ccda;
  font-size:9px;
}

.quote-mini-contact strong{
  margin-top:3px;
  font-size:11px;
}

.premium-form{
  padding:34px;
  display:grid;
  gap:16px;
  background:#fff;
  color:#13212d;
  box-shadow:0 24px 60px rgba(1,17,31,.20);
}

.form-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:17px;
  margin-bottom:3px;
  border-bottom:1px solid #dfe8ee;
}

.form-topline span{
  color:var(--model-blue);
  font-size:11px;
  font-weight:700;
}

.form-topline b{
  color:#a4b5c0;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-weight:400;
}

.premium-form>label{
  display:grid;
  gap:7px;
  color:#647581;
  font-size:10px;
  font-weight:600;
}

.premium-form input[type="text"],
.premium-form input[type="tel"],
.premium-form input:not([type]),
.premium-form input[name="name"],
.premium-form input[name="phone"]{
  width:100%;
  min-height:52px;
  padding:0 15px;
  border:1px solid #dbe5ec;
  background:#f9fbfc;
  border-radius:0;
  outline:none;
}

.premium-form input:focus{
  border-color:#7da9ce;
  box-shadow:0 0 0 3px rgba(11,69,127,.07);
}

.premium-form fieldset{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  padding:0;
  margin:0;
  border:0;
}

.premium-form legend{
  width:100%;
  margin-bottom:5px;
  color:#647581;
  font-size:10px;
  font-weight:600;
}

.premium-form fieldset label{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:11px;
}

.premium-privacy{
  display:flex !important;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:8px !important;
  font-weight:400 !important;
}

/* ---------------- TEST DRIVE ---------------- */
.testdrive-premium{
  min-height:620px;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:#061522;
}

.testdrive-premium>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.testdrive-premium-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(4,16,27,.91) 0%,rgba(4,16,27,.57) 45%,rgba(4,16,27,.05) 78%);
}

.testdrive-premium-copy{
  position:relative;
  z-index:2;
  color:#fff;
}

.testdrive-premium-copy h2{
  margin:8px 0 16px;
  color:#fff;
  font-size:clamp(58px,6.7vw,88px);
  line-height:.9;
}

.testdrive-premium-copy p{
  color:#d7e3eb;
}

.testdrive-premium-copy .btn{
  margin-top:20px;
}

/* ---------------- DISCLAIMER ---------------- */
.model-disclaimer{
  padding:27px 0;
  background:#f2f6f9;
  border-top:1px solid #dfe7ed;
}

.model-disclaimer .container{
  display:flex;
  gap:28px;
  justify-content:space-between;
  align-items:center;
}

.model-disclaimer p{
  max-width:930px;
  margin:0;
  color:#71818d;
  font-size:9px;
  line-height:1.55;
}

.model-disclaimer a{
  flex:0 0 auto;
  color:var(--model-blue);
  font-size:10px;
  font-weight:600;
}

/* ---------------- RESPONSIVE ---------------- */
@media(max-width:1180px){
  .model-hero-grid{
    grid-template-columns:.8fr 1.2fr;
  }
  .model-car{width:116%}
  .floating-fact{display:none}
  .modern-heading{gap:45px}
  .version-modern{
    grid-template-columns:.72fr 1.28fr;
  }
  .version-modern>.btn{
    grid-column:1 / -1;
    width:max-content;
  }
  .safety-chip-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:1024px){
  .model-hero{
    min-height:auto;
  }
  .model-hero-grid{
    min-height:700px;
    grid-template-columns:1fr;
    padding-top:58px;
  }
  .model-hero-copy{
    max-width:660px;
  }
  .model-stage{
    min-height:340px;
  }
  .model-car{
    width:min(930px,112%);
  }
  .model-ghost-name{
    top:0;
  }
  .hero-spec-bar{
    grid-template-columns:repeat(2,1fr);
  }
  .hero-spec-bar>div:nth-child(2){
    border-right:0;
  }
  .hero-spec-bar>div:nth-child(-n+2){
    border-bottom:1px solid var(--model-line);
  }
  .model-anchor-nav{
    padding-top:51px;
  }
  .modern-heading{
    grid-template-columns:1fr;
    gap:18px;
    align-items:start;
  }
  .modern-heading>p{
    max-width:650px;
  }
  .pillar-grid{
    grid-template-columns:1fr 1fr;
  }
  .pillar-card:last-child{
    grid-column:1 / -1;
  }
  .version-modern{
    grid-template-columns:1fr;
  }
  .version-modern>.btn{
    grid-column:auto;
  }
  .performance-content{
    grid-template-columns:1fr;
    align-content:center;
  }
  .performance-big-stats{
    align-self:auto;
    margin:10px 0 0;
    max-width:620px;
  }
  .performance-detail-grid{
    grid-template-columns:1fr;
  }
  .engine-card,
  .engine-card img{
    min-height:380px;
  }
  .quote-premium-grid{
    grid-template-columns:1fr;
    gap:38px;
  }
  .quote-copy{
    max-width:680px;
  }
}

@media(max-width:768px){
  .model-hero h1{
    font-size:58px;
  }
  .model-anchor-nav .container{
    justify-content:flex-start;
    gap:24px;
  }
  .pillar-grid{
    grid-template-columns:1fr;
  }
  .pillar-card:last-child{
    grid-column:auto;
  }
  .version-modern-features{
    grid-template-columns:1fr;
  }
  .exterior-hero{
    min-height:590px;
  }
  .media-bento{
    grid-template-columns:1fr;
    grid-template-rows:auto;
  }
  .media-card,
  .media-card-1{
    grid-row:auto;
    min-height:330px;
  }
  .interior-feature-hero,
  .interior-feature-hero>img{
    min-height:450px;
    height:450px;
  }
  .interior-cards{
    grid-template-columns:1fr;
  }
  .interior-card,
  .interior-card img{
    min-height:360px;
    height:360px;
  }
  .tech-feature-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .performance-media{
    height:720px;
  }
  .performance-content{
    height:720px;
  }
  .performance-big-stats{
    grid-template-columns:repeat(3,1fr);
  }
  .dimensions-modern{
    grid-template-columns:repeat(2,1fr);
  }
  .safety-showcase{
    grid-template-columns:1fr;
  }
  .safety-main,
  .safety-side,
  .safety-main img,
  .safety-side img{
    min-height:390px;
  }
  .model-disclaimer .container{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:620px){
  .model-hero-grid{
    min-height:660px;
    padding-top:38px;
    padding-bottom:10px;
  }
  .model-hero h1{
    font-size:45px;
  }
  .model-hero-copy>p{
    font-size:14px;
  }
  .model-hero-price strong{
    font-size:32px;
  }
  .model-hero-actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }
  .model-hero-actions .btn{
    width:100%;
  }
  .model-stage{
    min-height:250px;
    margin-left:-12px;
    margin-right:-12px;
  }
  .model-car{
    width:122%;
  }
  .model-ghost-name{
    font-size:65px;
  }
  .hero-spec-bar{
    width:calc(100% - 28px);
    margin-bottom:-43px;
  }
  .hero-spec-bar>div{
    min-height:76px;
    padding:14px;
  }
  .hero-spec-bar strong{
    font-size:22px;
  }
  .model-anchor-nav{
    padding-top:43px;
  }
  .model-anchor-nav .container{
    width:100%;
    padding-left:14px;
    padding-right:14px;
  }
  .model-intro{
    padding-top:85px;
  }
  .modern-heading{
    margin-bottom:28px;
  }
  .modern-heading h2{
    font-size:40px;
  }
  .pillar-card{
    min-height:205px;
    padding:24px;
  }
  .pillar-card h3{
    margin-top:45px;
  }
  .version-modern{
    padding:24px;
  }
  .version-modern-price strong{
    font-size:30px;
  }
  .exterior-showcase{
    padding-top:64px;
  }
  .exterior-hero{
    min-height:520px;
  }
  .exterior-hero>img{
    object-position:55% center;
  }
  .exterior-copy{
    padding-bottom:38px;
  }
  .exterior-copy h2{
    font-size:43px;
  }
  .media-card,
  .media-card-1{
    min-height:260px;
  }
  .interior-modern{
    padding-top:64px;
  }
  .interior-feature-hero,
  .interior-feature-hero>img{
    min-height:300px;
    height:300px;
  }
  .interior-feature-copy{
    left:14px;
    bottom:14px;
    min-width:190px;
  }
  .interior-card,
  .interior-card img{
    min-height:260px;
    height:260px;
  }
  .tech-feature-grid{
    grid-template-columns:1fr;
  }
  .performance-media{
    height:690px;
  }
  .performance-content{
    height:690px;
    align-content:end;
    padding-bottom:36px;
  }
  .performance-copy h2{
    font-size:44px;
  }
  .performance-image-overlay{
    background:
      linear-gradient(180deg,rgba(5,17,28,.08) 0%,rgba(5,17,28,.45) 40%,rgba(5,17,28,.96) 76%,#071725 100%);
  }
  .performance-big-stats{
    width:100%;
  }
  .performance-big-stats>div{
    min-height:100px;
    padding:15px 10px;
  }
  .performance-big-stats strong{
    font-size:30px;
  }
  .engine-card,
  .engine-card img{
    min-height:270px;
  }
  .spec-list-modern{
    padding:10px 18px;
  }
  .dimensions-modern{
    grid-template-columns:1fr;
  }
  .dimension-modern{
    min-height:95px;
  }
  .safety-main,
  .safety-side,
  .safety-main img,
  .safety-side img{
    min-height:290px;
  }
  .safety-chip-grid{
    grid-template-columns:1fr;
  }
  .safety-chip-grid span{
    min-height:66px;
  }
  .quote-premium{
    padding:64px 0;
  }
  .quote-copy h2{
    font-size:43px;
  }
  .quote-mini-contact{
    display:grid;
    grid-template-columns:1fr;
  }
  .premium-form{
    padding:22px;
  }
  .premium-form input[name="name"],
  .premium-form input[name="phone"]{
    font-size:16px;
  }
  .testdrive-premium{
    min-height:560px;
    align-items:flex-end;
  }
  .testdrive-premium-overlay{
    background:linear-gradient(180deg,rgba(4,16,27,.04) 20%,rgba(4,16,27,.92) 78%,rgba(4,16,27,.98) 100%);
  }
  .testdrive-premium-copy{
    padding-bottom:45px;
  }
  .testdrive-premium-copy h2{
    font-size:48px;
  }
}

@media(max-width:390px){
  .model-hero h1{font-size:40px}
  .hero-spec-bar strong{font-size:20px}
  .modern-heading h2{font-size:37px}
  .performance-big-stats strong{font-size:27px}
  .quote-copy h2{font-size:39px}
}


/* ============================================================
   MODEL PAGE V3 — CAROUSEL GALLERIES + LIGHTBOX + TECH SHEET
   ============================================================ */

.model-sheet-link{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  padding:0 3px;
  color:#0B457F;
  font-size:11px;
  font-weight:700;
  border-bottom:1px solid rgba(11,69,127,.28);
}

.model-sheet-link:hover{
  border-bottom-color:#0B457F;
}

/* -------- Gallery sections -------- */
.gallery-section{
  padding:105px 0 92px;
  overflow:hidden;
}

.gallery-section-light{
  background:#f8fbfd;
}

.gallery-section-dark{
  background:
    radial-gradient(circle at 76% 12%,rgba(112,142,201,.13),transparent 28%),
    #071725;
  color:#fff;
}

.gallery-section-dark .modern-heading h2{
  color:#fff;
}

.gallery-section-dark .modern-heading>p{
  color:#a9bdcb;
}

.gallery-heading{
  margin-bottom:38px;
}

.vehicle-gallery{
  position:relative;
}

.gallery-viewport{
  overflow:hidden;
}

.gallery-track{
  display:flex;
  will-change:transform;
  transition:transform .62s cubic-bezier(.22,.72,.2,1);
}

.gallery-slide{
  flex:0 0 100%;
  min-width:0;
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 315px;
  min-height:590px;
  background:#fff;
}

.gallery-section-dark .gallery-slide{
  background:#0b2132;
}

.gallery-image-button{
  position:relative;
  display:block;
  width:100%;
  min-height:590px;
  padding:0;
  overflow:hidden;
  border:0;
  background:#dce7ee;
  cursor:zoom-in;
  text-align:left;
}

.gallery-image-button img{
  width:100%;
  height:100%;
  min-height:590px;
  object-fit:cover;
  display:block;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}

.gallery-image-button:hover img{
  transform:scale(1.018);
}

.gallery-zoom{
  position:absolute;
  right:18px;
  bottom:18px;
  min-height:38px;
  display:flex;
  align-items:center;
  padding:0 14px;
  background:rgba(6,20,32,.72);
  backdrop-filter:blur(9px);
  color:#fff;
  font-size:10px;
  font-weight:600;
}

.gallery-slide-copy{
  padding:38px 32px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:
    linear-gradient(160deg,#fff 0%,#eff6fa 100%);
}

.gallery-section-dark .gallery-slide-copy{
  background:
    linear-gradient(160deg,#102b40 0%,#091d2c 100%);
}

.gallery-slide-copy small{
  color:#8295a3;
  font-size:9px;
  letter-spacing:.08em;
}

.gallery-slide-copy h3{
  margin:10px 0 10px;
  color:#0B457F;
  font-size:30px;
  line-height:1.05;
}

.gallery-section-dark .gallery-slide-copy h3{
  color:#fff;
}

.gallery-slide-copy p{
  margin:0;
  color:#647986;
  font-size:11px;
  line-height:1.65;
}

.gallery-section-dark .gallery-slide-copy p{
  color:#a9bfcd;
}

.gallery-controls{
  min-height:68px;
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:24px;
  align-items:center;
}

.gallery-progress{
  position:relative;
  height:2px;
  overflow:hidden;
  background:#d8e4ec;
}

.gallery-section-dark .gallery-progress{
  background:rgba(255,255,255,.12);
}

.gallery-progress span{
  position:absolute;
  inset:0 auto 0 0;
  width:20%;
  background:#0B457F;
  transition:width .45s ease;
}

.gallery-section-dark .gallery-progress span{
  background:#8cb8da;
}

.gallery-counter{
  display:flex;
  gap:5px;
  align-items:baseline;
  min-width:50px;
}

.gallery-counter b{
  color:#0B457F;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:21px;
  font-weight:400;
}

.gallery-section-dark .gallery-counter b{
  color:#fff;
}

.gallery-counter span{
  color:#8b9ba6;
  font-size:10px;
}

.gallery-arrows{
  display:flex;
  gap:7px;
}

.gallery-arrows button{
  width:43px;
  height:43px;
  display:grid;
  place-items:center;
  border:1px solid #cad9e4;
  background:#fff;
  color:#0B457F;
  cursor:pointer;
  font-size:17px;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}

.gallery-arrows button:hover{
  background:#0B457F;
  border-color:#0B457F;
  color:#fff;
}

.gallery-section-dark .gallery-arrows button{
  background:#102b40;
  border-color:rgba(255,255,255,.16);
  color:#fff;
}

.gallery-section-dark .gallery-arrows button:hover{
  background:#fff;
  border-color:#fff;
  color:#0B457F;
}

.gallery-tech-features{
  margin-top:42px;
}

.gallery-section-dark .gallery-tech-features{
  border-color:rgba(255,255,255,.09);
}

.gallery-section-dark .tech-feature{
  background:#0b2132;
  border-color:rgba(255,255,255,.09);
}

.gallery-section-dark .tech-feature p{
  color:#b6c8d4;
}

.gallery-section-dark .tech-feature>span{
  background:#8ab8dc;
}

/* -------- Lightbox -------- */
.vehicle-lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  grid-template-columns:78px minmax(0,1fr) 78px;
  align-items:center;
  padding:30px;
  background:rgba(2,10,17,.96);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease,visibility .22s ease;
}

.vehicle-lightbox.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

body.lightbox-open{
  overflow:hidden !important;
}

.lightbox-stage{
  position:relative;
  width:min(1450px,100%);
  height:min(84vh,900px);
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:center;
}

.lightbox-stage>img{
  display:block;
  max-width:100%;
  max-height:calc(100% - 64px);
  width:auto;
  height:auto;
  object-fit:contain;
  box-shadow:0 22px 70px rgba(0,0,0,.28);
}

.lightbox-caption{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  min-height:58px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  color:#fff;
}

.lightbox-caption>div:first-child{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.lightbox-caption span{
  color:#8da4b5;
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.lightbox-caption strong{
  font-size:14px;
  font-weight:600;
}

.lightbox-number{
  display:flex;
  align-items:baseline;
  gap:5px;
}

.lightbox-number b{
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  font-size:25px;
  font-weight:400;
}

.lightbox-close,
.lightbox-nav{
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.05);
  color:#fff;
  cursor:pointer;
}

.lightbox-close:hover,
.lightbox-nav:hover{
  background:#fff;
  color:#0B457F;
}

.lightbox-close{
  position:absolute;
  top:24px;
  right:25px;
  z-index:3;
  width:46px;
  height:46px;
  font-size:28px;
  line-height:1;
}

.lightbox-nav{
  width:50px;
  height:50px;
  justify-self:center;
  font-size:18px;
}

/* -------- Ficha Técnica links -------- */
.disclaimer-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:20px;
}

.sheet-download-small{
  color:#0B457F;
  font-weight:700 !important;
}

/* -------- Responsive gallery -------- */
@media(max-width:1024px){
  .gallery-slide{
    grid-template-columns:1fr;
  }

  .gallery-image-button,
  .gallery-image-button img{
    min-height:500px;
  }

  .gallery-slide-copy{
    min-height:180px;
    padding:26px;
  }

  .vehicle-lightbox{
    grid-template-columns:60px minmax(0,1fr) 60px;
    padding:22px;
  }
}

@media(max-width:620px){
  .model-sheet-link{
    justify-content:center;
    min-height:42px;
  }

  .gallery-section{
    padding:68px 0 60px;
  }

  .gallery-heading{
    margin-bottom:25px;
  }

  .gallery-image-button,
  .gallery-image-button img{
    min-height:310px;
    height:310px;
  }

  .gallery-slide-copy{
    min-height:155px;
    padding:21px;
  }

  .gallery-slide-copy h3{
    font-size:25px;
  }

  .gallery-controls{
    grid-template-columns:1fr auto;
    gap:14px;
  }

  .gallery-progress{
    grid-column:1 / -1;
    grid-row:1;
  }

  .gallery-counter{
    grid-column:1;
    grid-row:2;
  }

  .gallery-arrows{
    grid-column:2;
    grid-row:2;
  }

  .vehicle-lightbox{
    grid-template-columns:1fr;
    padding:58px 14px 14px;
  }

  .lightbox-stage{
    height:calc(100svh - 88px);
  }

  .lightbox-stage>img{
    max-height:calc(100% - 82px);
  }

  .lightbox-nav{
    position:absolute;
    top:50%;
    z-index:5;
    width:44px;
    height:44px;
    background:rgba(3,14,23,.68);
  }

  .lightbox-prev{
    left:8px;
  }

  .lightbox-next{
    right:8px;
  }

  .lightbox-close{
    top:10px;
    right:10px;
  }

  .lightbox-caption{
    align-items:flex-start;
    padding-top:10px;
  }

  .disclaimer-actions{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }
}


/* ===== V4 RELIABILITY FIX =====
   Model content stays visible even if JavaScript fails or is blocked.
   Reveal animation is progressively enhanced only when model-page.js runs.
*/
.model-page .reveal{
  opacity:1 !important;
  transform:none !important;
}

.model-js-ready .model-page .reveal{
  opacity:0 !important;
  transform:translateY(18px) !important;
  transition:opacity .7s ease,transform .7s ease !important;
}

.model-js-ready .model-page .reveal.visible{
  opacity:1 !important;
  transform:none !important;
}


/* ============================================================
   MODEL PAGE V5 — RELATED MODELS
   ============================================================ */

.related-models-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 12%,rgba(179,207,228,.26),transparent 28%),
    linear-gradient(180deg,#f8fbfd 0%,#ffffff 100%);
}

.related-heading{
  margin-bottom:36px;
}

.related-models-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.related-model-card{
  position:relative;
  overflow:hidden;
  background:#fff;
  border:1px solid #dce7ef;
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.related-model-card:hover{
  transform:translateY(-6px);
  border-color:#cadbe7;
  box-shadow:0 22px 48px rgba(24,56,83,.11);
}

.related-model-image{
  position:relative;
  min-height:260px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:
    linear-gradient(145deg,#f8fcff 0%,#eaf4fa 100%);
}

.related-model-orb{
  position:absolute;
  width:235px;
  height:235px;
  right:-50px;
  top:-70px;
  border-radius:50%;
  border:1px solid rgba(11,69,127,.08);
}

.related-model-orb::after{
  content:"";
  position:absolute;
  inset:38px;
  border-radius:50%;
  border:1px solid rgba(11,69,127,.06);
}

.related-model-image img{
  position:relative;
  z-index:1;
  width:92%;
  max-height:210px;
  object-fit:contain;
  transition:transform .5s cubic-bezier(.2,.7,.2,1);
  filter:drop-shadow(0 20px 18px rgba(35,64,88,.12));
}

.related-model-card:hover .related-model-image img{
  transform:scale(1.035);
}

.related-model-body{
  padding:24px;
}

.related-model-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.related-model-meta span{
  padding:6px 9px;
  border:1px solid #dce7ef;
  color:#607482;
  font-size:8px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.related-model-body h3{
  margin:15px 0 13px;
  color:#0B457F;
  font-size:29px;
  line-height:1;
}

.related-model-specs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-bottom:22px;
  border-bottom:1px solid #e1e9ef;
}

.related-model-specs span{
  position:relative;
  padding-right:9px;
  color:#6b7d89;
  font-size:9px;
}

.related-model-specs span:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  width:2px;
  height:2px;
  border-radius:50%;
  background:#9aabb6;
}

.related-model-footer{
  margin-top:18px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
}

.related-model-footer small,
.related-model-footer strong{
  display:block;
}

.related-model-footer small{
  color:#82919b;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.related-model-footer strong{
  margin-top:4px;
  font-family:"Changan Uni","Arial Narrow",sans-serif;
  color:#15232e;
  font-size:21px;
  font-weight:400;
}

.related-model-footer>a{
  flex:0 0 auto;
  color:#0B457F;
  font-size:10px;
  font-weight:700;
}

@media(max-width:1024px){
  .related-models-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .related-model-card:last-child{
    grid-column:1 / -1;
  }

  .related-model-card:last-child .related-model-image{
    min-height:300px;
  }
}

@media(max-width:620px){
  .related-models-section{
    padding-top:62px;
    padding-bottom:62px;
  }

  .related-models-grid{
    display:flex;
    gap:13px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    margin-left:-14px;
    margin-right:-14px;
    padding:0 14px 8px;
  }

  .related-models-grid::-webkit-scrollbar{
    display:none;
  }

  .related-model-card,
  .related-model-card:last-child{
    flex:0 0 88%;
    grid-column:auto;
    scroll-snap-align:start;
  }

  .related-model-image,
  .related-model-card:last-child .related-model-image{
    min-height:225px;
  }

  .related-model-image img{
    max-height:180px;
  }

  .related-model-body{
    padding:20px;
  }

  .related-model-body h3{
    font-size:26px;
  }

  .related-model-footer{
    align-items:flex-start;
    flex-direction:column;
  }
}


/* ============================================================
   MODEL PAGE V6 — GALLERY CONTROLS SAFE POSITION
   Keeps carousel arrows away from sticky Phone / WhatsApp buttons.
   ============================================================ */

.gallery-controls-safe{
  position:relative;
  padding-right:92px;
}

/* Place arrows toward the center-left instead of the far-right edge. */
.gallery-controls-safe .gallery-arrows{
  justify-self:start;
  margin-right:0;
}

/* Keep progress/counter compact so arrows have breathing room. */
.gallery-controls-safe{
  grid-template-columns:minmax(160px,1fr) auto auto;
}

/* Desktop: floating contact buttons live on the right side,
   so cap gallery controls width and keep arrows inside content. */
@media(min-width:901px){
  .gallery-controls-safe{
    width:calc(100% - 92px);
  }

  .gallery-controls-safe .gallery-arrows{
    padding-left:4px;
  }
}

/* Tablet: no need for the extra reserve once floating buttons disappear. */
@media(max-width:900px){
  .gallery-controls-safe{
    width:100%;
    padding-right:0;
  }
}

/* Mobile: put arrows on the left and counter on the right,
   well above the sticky bottom contact bar. */
@media(max-width:620px){
  .gallery-controls-safe{
    grid-template-columns:auto 1fr;
    gap:12px 16px;
    padding-top:10px;
    padding-bottom:18px;
  }

  .gallery-controls-safe .gallery-progress{
    grid-column:1 / -1;
    grid-row:1;
  }

  .gallery-controls-safe .gallery-arrows{
    grid-column:1;
    grid-row:2;
    justify-self:start;
  }

  .gallery-controls-safe .gallery-counter{
    grid-column:2;
    grid-row:2;
    justify-self:end;
  }

  .gallery-controls-safe .gallery-arrows button{
    width:46px;
    height:46px;
  }
}

/* Extra-small phones: slightly smaller buttons but keep comfortable tap size. */
@media(max-width:390px){
  .gallery-controls-safe .gallery-arrows button{
    width:44px;
    height:44px;
  }
}


/* ============================================================
   MODEL PAGE V7 — RESPONSIVE QA PASS
   Final responsive tuning before cloning the master page.
   ============================================================ */

/* Prevent accidental horizontal overflow from oversized car renders,
   decorative circles and gallery content. */
.model-page,
.model-page main,
.model-hero,
.gallery-section,
.performance-modern,
.related-models-section{
  max-width:100%;
  overflow-x:hidden;
}

/* Better touch behavior for carousels. Vertical page scrolling stays natural. */
.gallery-viewport,
.related-models-grid{
  touch-action:pan-y;
}

/* When the image lightbox is open, remove contact UI from the interaction layer. */
body.lightbox-open .sticky-contact,
body.lightbox-open .mobile-sticky-contact{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* Keep gallery controls safely inside the content area on desktop.
   The floating phone / WhatsApp buttons occupy the far-right edge. */
@media(min-width:901px){
  .gallery-controls-safe{
    width:100%;
    padding-right:112px;
  }
}

/* -------- Small desktop / landscape tablet -------- */
@media(max-width:1180px) and (min-width:1025px){
  .model-hero-grid{
    min-height:610px;
  }

  .model-hero h1{
    font-size:clamp(58px,6vw,76px);
  }

  .model-stage{
    min-height:500px;
  }

  .model-car{
    width:110%;
  }

  .hero-spec-bar{
    min-height:96px;
  }

  .gallery-slide{
    grid-template-columns:minmax(0,1fr) 285px;
  }

  .gallery-image-button,
  .gallery-image-button img{
    min-height:545px;
  }

  .quote-premium-grid{
    gap:48px;
  }
}

/* -------- 1024 / tablet landscape -------- */
@media(max-width:1024px){
  .model-hero-grid{
    min-height:760px;
    padding-top:52px;
    padding-bottom:22px;
  }

  .model-hero-copy{
    max-width:620px;
  }

  .model-hero h1{
    font-size:clamp(54px,7vw,68px);
  }

  .model-stage{
    min-height:355px;
  }

  .model-car{
    width:min(900px,108%);
  }

  .hero-spec-bar{
    margin-bottom:-46px;
  }

  .model-anchor-nav{
    padding-top:46px;
  }

  .model-anchor-nav .container{
    justify-content:flex-start;
  }

  .gallery-controls-safe{
    width:100%;
    padding-right:96px;
  }

  .modern-heading h2{
    max-width:760px;
  }

  .performance-content{
    padding-top:38px;
    padding-bottom:38px;
  }

  .quote-premium-grid{
    gap:34px;
  }
}

/* Desktop sticky disappears at 900px, so stop reserving right-side space. */
@media(max-width:900px){
  .gallery-controls-safe{
    width:100%;
    padding-right:0;
  }
}

/* -------- 768 / portrait tablet -------- */
@media(max-width:768px){
  .model-hero-grid{
    min-height:735px;
    padding-top:46px;
  }

  .model-hero h1{
    font-size:52px;
  }

  .model-stage{
    min-height:315px;
  }

  .model-car{
    width:108%;
  }

  .hero-spec-bar{
    width:100%;
  }

  .model-anchor-nav a{
    padding-top:16px;
    padding-bottom:16px;
  }

  .model-intro{
    padding-top:102px;
  }

  .version-modern{
    gap:24px;
  }

  .gallery-section{
    padding-top:82px;
    padding-bottom:72px;
  }

  .gallery-image-button,
  .gallery-image-button img{
    min-height:430px;
    height:430px;
  }

  .gallery-slide-copy{
    min-height:165px;
  }

  .performance-content{
    padding-top:42px;
    padding-bottom:42px;
  }

  .performance-big-stats{
    width:min(100%,620px);
  }

  .premium-form{
    max-width:680px;
  }

  .related-model-card:last-child .related-model-image{
    min-height:260px;
  }
}

/* -------- Phones -------- */
@media(max-width:620px){
  .model-page section[id]{
    scroll-margin-top:calc(var(--header) + 50px);
  }

  .model-hero-grid{
    min-height:720px;
    padding-top:32px;
    padding-bottom:14px;
  }

  .model-back{
    margin-bottom:15px;
  }

  .model-hero h1{
    font-size:43px;
  }

  .model-hero-copy>p{
    max-width:350px;
    line-height:1.55;
  }

  .model-hero-price{
    margin-top:21px;
  }

  .model-hero-actions{
    margin-top:20px;
    gap:9px;
  }

  .model-sheet-link{
    width:100%;
    min-height:42px;
    justify-content:center;
    border:1px solid rgba(11,69,127,.18);
    background:rgba(255,255,255,.55);
  }

  .model-stage{
    min-height:245px;
    margin-top:6px;
  }

  .model-car{
    width:116%;
  }

  .model-ghost-name{
    top:7%;
    font-size:59px;
  }

  .hero-spec-bar{
    width:calc(100% - 28px);
    margin-bottom:-39px;
  }

  .hero-spec-bar>div{
    min-height:74px;
  }

  .model-anchor-nav{
    padding-top:39px;
  }

  .model-anchor-nav .container{
    gap:21px;
  }

  .model-anchor-nav a{
    padding-top:15px;
    padding-bottom:15px;
    font-size:10px;
  }

  .model-intro{
    padding-top:78px;
  }

  .modern-heading h2{
    font-size:39px;
  }

  .gallery-section{
    padding-top:62px;
    padding-bottom:54px;
  }

  .gallery-image-button,
  .gallery-image-button img{
    min-height:295px;
    height:295px;
  }

  .gallery-slide-copy{
    min-height:150px;
  }

  .gallery-controls-safe{
    padding-top:12px;
    padding-bottom:24px;
  }

  .gallery-controls-safe .gallery-arrows button{
    width:48px;
    height:48px;
  }

  .gallery-zoom{
    right:12px;
    bottom:12px;
  }

  .performance-content{
    padding-bottom:30px;
  }

  .performance-big-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .performance-big-stats>div{
    min-width:0;
  }

  .performance-big-stats strong{
    font-size:29px;
  }

  .performance-big-stats>div>span{
    display:block;
    margin:3px 0 0;
  }

  .safety-badge{
    left:14px;
    bottom:14px;
    width:165px;
  }

  .premium-form{
    width:100%;
  }

  .premium-form fieldset{
    gap:11px;
  }

  .related-models-grid{
    padding-bottom:14px;
  }

  .related-model-card,
  .related-model-card:last-child{
    flex-basis:86%;
  }

  .testdrive-premium-copy{
    padding-bottom:72px;
  }

  .model-disclaimer{
    padding-bottom:calc(28px + env(safe-area-inset-bottom));
  }
}

/* -------- 430 -------- */
@media(max-width:430px){
  .model-hero-grid{
    min-height:705px;
  }

  .model-hero h1{
    font-size:41px;
  }

  .model-stage{
    min-height:230px;
  }

  .model-car{
    width:119%;
  }

  .hero-spec-bar strong{
    font-size:21px;
  }

  .hero-spec-bar span{
    font-size:9px;
  }

  .modern-heading h2{
    font-size:37px;
  }

  .gallery-image-button,
  .gallery-image-button img{
    height:270px;
    min-height:270px;
  }

  .gallery-slide-copy h3{
    font-size:24px;
  }

  .performance-copy h2{
    font-size:41px;
  }

  .performance-big-stats strong{
    font-size:27px;
  }

  .related-model-card,
  .related-model-card:last-child{
    flex-basis:88%;
  }

  .quote-copy h2{
    font-size:40px;
  }

  .testdrive-premium-copy h2{
    font-size:45px;
  }
}

/* -------- 390 -------- */
@media(max-width:390px){
  .model-hero-grid{
    min-height:690px;
  }

  .model-hero h1{
    font-size:38px;
  }

  .model-stage{
    min-height:215px;
  }

  .model-car{
    width:122%;
  }

  .model-ghost-name{
    font-size:51px;
  }

  .hero-spec-bar>div{
    padding:12px 10px;
  }

  .hero-spec-bar strong{
    font-size:19px;
  }

  .gallery-image-button,
  .gallery-image-button img{
    height:250px;
    min-height:250px;
  }

  .gallery-controls-safe .gallery-arrows button{
    width:46px;
    height:46px;
  }

  .performance-big-stats>div{
    padding-left:7px;
    padding-right:7px;
  }

  .performance-big-stats strong{
    font-size:25px;
  }

  .performance-big-stats small{
    font-size:8px;
  }

  .premium-form{
    padding:19px;
  }

  .related-model-card,
  .related-model-card:last-child{
    flex-basis:90%;
  }
}

/* -------- 360 -------- */
@media(max-width:360px){
  .model-hero-grid{
    min-height:675px;
  }

  .model-hero h1{
    font-size:36px;
  }

  .model-hero-copy>p{
    font-size:13px;
  }

  .model-hero-price strong{
    font-size:29px;
  }

  .model-stage{
    min-height:205px;
  }

  .model-car{
    width:124%;
  }

  .hero-spec-bar{
    width:calc(100% - 20px);
  }

  .hero-spec-bar strong{
    font-size:18px;
  }

  .model-anchor-nav .container{
    gap:18px;
    padding-left:10px;
    padding-right:10px;
  }

  .modern-heading h2{
    font-size:35px;
  }

  .gallery-slide-copy{
    padding:18px;
  }

  .gallery-image-button,
  .gallery-image-button img{
    height:235px;
    min-height:235px;
  }

  .gallery-controls-safe{
    gap:10px 12px;
  }

  .performance-big-stats strong{
    font-size:23px;
  }

  .performance-big-stats>div>span{
    font-size:9px;
  }

  .related-model-card,
  .related-model-card:last-child{
    flex-basis:92%;
  }

  .quote-copy h2{
    font-size:37px;
  }

  .testdrive-premium-copy h2{
    font-size:42px;
  }
}


/* ===== BATCH 1 MASTER GENERALIZATION ===== */
.model-hero-price em,
.version-modern-price em{
  display:block;
  margin-top:5px;
  color:#748794;
  font-size:9px;
  font-style:normal;
  line-height:1.45;
}

.version-modern-price em{
  color:#9fb3c2;
}

@media(max-width:620px){
  .model-ghost-name{
    max-width:100%;
    overflow:hidden;
    text-overflow:clip;
  }
}


/* ============================================================
   BATCH 1 — RESPONSIVE QA FINAL REFINEMENTS
   Tested at 1440, 1180, 1024, 900, 768, 620, 430, 390 and 360px.
   ============================================================ */

/* Horizontal model navigation is intentional on very small screens.
   Improve touch scrolling and make the last item easier to reach. */
.model-anchor-nav .container{
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  scroll-padding-inline:14px;
}

.model-anchor-nav a{
  scroll-snap-align:start;
}

@media(max-width:430px){
  .model-anchor-nav .container{
    scroll-snap-type:x proximity;
    padding-right:22px;
  }
}

/* Keep the fixed mobile contact bar completely constrained to its 3 columns. */
@media(max-width:620px){
  .mobile-sticky-contact a{
    min-width:0 !important;
    max-width:100%;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
  }

  /* Avoid accidental contact-bar overlap with the last page content. */
  .model-page{
    padding-bottom:calc(60px + env(safe-area-inset-bottom));
  }

  /* Comfortable carousel interaction without interfering with vertical scroll. */
  .gallery-viewport,
  .related-models-grid{
    touch-action:pan-y;
  }
}

/* On the narrowest phones keep gallery controls compact and fully tappable. */
@media(max-width:390px){
  .gallery-controls-safe{
    padding-left:0;
    padding-right:0;
  }

  .gallery-controls-safe .gallery-arrows button{
    flex:0 0 46px;
  }
}

/* On 360px devices leave a little breathing room after the last nav item. */
@media(max-width:360px){
  .model-anchor-nav .container{
    padding-right:28px;
  }
}


/* ============================================================
   BATCH 2 — RESPONSIVE QA V1
   Refinements after reviewing Eado Plus, Eado Plus iDD,
   Hunter E, CS75 Plus and CS95 Plus.
   ============================================================ */

/* Keep 1024px landscape layouts more compact:
   text and vehicle stay side-by-side instead of creating
   an unnecessarily tall stacked hero. */
@media(min-width:901px) and (max-width:1024px){
  .model-hero-grid{
    min-height:650px;
    grid-template-columns:minmax(330px,.82fr) minmax(0,1.18fr);
    gap:12px;
    padding-top:34px;
    padding-bottom:0;
  }

  .model-hero-copy{
    max-width:430px;
  }

  .model-hero h1{
    font-size:clamp(46px,5.3vw,58px);
  }

  .model-hero-copy>p{
    font-size:15px;
    line-height:1.6;
  }

  .model-stage{
    min-height:470px;
    margin:0;
  }

  .model-car{
    width:118%;
    max-width:760px;
  }

  .hero-spec-bar{
    margin-bottom:-46px;
  }

  .model-anchor-nav{
    padding-top:46px;
  }
}

/* On phones, remove the desktop gallery minimum height.
   This eliminates the large empty block between the image
   and the gallery caption. */
@media(max-width:620px){
  .gallery-slide{
    min-height:0;
    height:auto;
    align-content:start;
  }

  .gallery-slide-copy{
    min-height:145px;
    height:auto;
    justify-content:flex-start;
  }

  .gallery-controls-safe{
    margin-top:0;
  }

  /* More comfortable space after forms and before the fixed
     Call / WhatsApp / Quote bar. */
  .quote-premium{
    padding-bottom:calc(84px + env(safe-area-inset-bottom));
  }

  .testdrive-premium-copy{
    padding-bottom:calc(86px + env(safe-area-inset-bottom));
  }
}

/* Extra-tight screens */
@media(max-width:390px){
  .gallery-slide-copy{
    min-height:138px;
  }

  .gallery-slide-copy p{
    line-height:1.5;
  }
}


/* ============================================================
   BATCH 4 — RESPONSIVE QA V1
   Deepal + Commercial model hardening.
   ============================================================ */

/* Long EV/range labels and commercial-model names must never
   force the hero or stat grids wider than the viewport. */
.model-hero-copy,
.model-stage,
.hero-spec-bar > div,
.performance-big-stats > div{
  min-width:0;
}

@media(max-width:430px){
  .model-hero h1{
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
  }

  .hero-spec-bar strong{
    font-size:clamp(18px,5vw,21px);
    white-space:nowrap;
  }

  .hero-spec-bar span{
    line-height:1.3;
  }

  .performance-big-stats strong{
    font-size:clamp(22px,7vw,27px);
    white-space:nowrap;
  }
}

@media(max-width:360px){
  .hero-spec-bar > div{
    padding-left:9px;
    padding-right:9px;
  }

  .hero-spec-bar strong{
    font-size:18px;
  }
}
