/* ALBASSAMI_CAR_PREMIUM_V1 - dark showroom page */
.cp{--cp-bg:#ffffff;--cp-panel:#f6f7f9;--cp-panel2:#eef0f3;--cp-line:#e6e8ec;--cp-ink:#141b26;--cp-muted:#5c6575;--cp-red:#d0191f;background:var(--cp-bg);color:var(--cp-ink)}
.cp a{text-decoration:none}
.cp-wrap{max-width:1680px;margin:0 auto;padding:0 clamp(16px,3vw,40px)}
.cp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:16px}
.cp-head h2{margin:0;font-size:clamp(20px,2.2vw,28px);font-weight:900;position:relative;padding-bottom:10px}
.cp-head h2::after{content:"";position:absolute;bottom:0;inset-inline-start:0;width:46px;height:3px;border-radius:2px;background:var(--cp-red)}
.cp-head a{color:var(--cp-red);font-weight:800;font-size:14px;white-space:nowrap}
.cp-head a i,.cp-btn i{font-style:normal}
.cp-ico{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex:0 0 38px}
.cp-ico svg{width:30px;height:30px;fill:none;stroke:var(--cp-red);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cp-ico-lg{width:52px;height:52px;flex-basis:52px}
.cp-ico-lg svg{width:40px;height:40px}

/* hero (viewer in premium mode) */
.cv.cv-premium{padding:0;background:#fff}
.cv.cv-premium > .abv-container,.cv.cv-premium.is-wide > .abv-container{max-width:none;width:100%;padding:0;margin:0}
.cv.cv-premium .cv-stage,.cv.cv-premium.is-wide .cv-stage.has-bg{border-radius:0;box-shadow:none;aspect-ratio:auto;width:100%;max-height:none;min-height:0;height:clamp(380px,45vw,calc(100vh - 90px))}
.cv.cv-premium .cv-credit{margin:0;padding:8px 16px;color:#7d8594;background:#fff}
.cv.cv-premium .cv-credit a{color:#5c6575}
.cv.cv-premium .cv-stage.has-bg{background-position:center 72%}
.cv-top{position:absolute;z-index:4;top:18px;left:50%;transform:translateX(-50%)}
.cv-top .cv-views{margin:0;flex-wrap:nowrap;gap:4px;background:rgba(10,12,16,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px}
.cv-top .cv-view{background:transparent;border:0;color:#e8ebf0;font-size:13px;padding:8px 16px;border-radius:999px;white-space:nowrap}
.cv-top .cv-view:hover{background:rgba(255,255,255,.08)}
.cv-top .cv-view.is-on{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px var(--cp-red,#e0141c)}
.cv-dial{position:absolute;z-index:4;bottom:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:14px;background:rgba(10,12,16,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px}
.cv-dial-btn{width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.1);cursor:pointer;display:flex;align-items:center;justify-content:center}
.cv-dial-btn:hover{background:rgba(255,255,255,.2)}
.cv-dial-btn svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
[dir="rtl"] .cv-dial-btn svg{transform:scaleX(-1)}
.cv-dial-txt{display:flex;flex-direction:column;align-items:center;line-height:1.15;color:#fff;min-width:110px}
.cv-dial-txt b{color:#ff3b42;font-size:17px;font-weight:900}
.cv-dial-txt small{font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:#cfd4dc}
.cv-title{position:absolute;z-index:3;bottom:22px;inset-inline-start:clamp(16px,3vw,40px);color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.6);pointer-events:none}
.cv-title span{font-size:12px;font-weight:900;letter-spacing:2px;color:#ff3b42}
.cv-title h1{margin:2px 0 0;font-size:clamp(22px,2.6vw,36px);font-weight:900;line-height:1.1}
.cv.cv-premium .cv-tools{background:rgba(10,12,16,.55);border:1px solid rgba(255,255,255,.12)}
.cv.cv-premium .cv-tools svg{stroke:#fff}
.cv.cv-premium .cv-tools button:hover{background:rgba(255,255,255,.12)}
.cv.cv-premium .cv-tools button[aria-pressed="true"]{background:var(--cp-red,#e0141c)}

/* specs band */
.cp-specs{padding:30px 0 8px;background:#fff}
.cp-spec-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--cp-line);border-bottom:1px solid var(--cp-line)}
.cp-spec-list li{display:flex;align-items:center;gap:12px;padding:16px 14px;border-inline-start:1px solid var(--cp-line)}
.cp-spec-list li:first-child{border-inline-start:0}
.cp-spec-list b{display:block;font-size:20px;font-weight:900;line-height:1.2}
.cp-spec-list small{display:block;font-size:12.5px;color:var(--cp-muted);margin-top:2px}
.cp-note{margin:8px 0 0;font-size:12px;color:#7d8594}

/* why */
.cp-why{padding:28px 0 8px}
.cp-why-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cp-why-card{position:relative;overflow:hidden;min-height:150px;border-radius:14px;padding:20px 22px;padding-inline-end:40%;background:var(--cp-panel);border:1px solid var(--cp-line);display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr;column-gap:14px;align-content:start}
.cp-why-card::before{content:"";position:absolute;inset:0;background:var(--cp-img) no-repeat;background-size:auto 115%;background-position:right -6% center;opacity:.9}
[dir="rtl"] .cp-why-card::before{background-position:left -6% center}
.cp-why-card::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f6f7f9 40%,rgba(246,247,249,.6) 70%,rgba(246,247,249,0))}
[dir="rtl"] .cp-why-card::after{background:linear-gradient(270deg,#f6f7f9 40%,rgba(246,247,249,.6) 70%,rgba(246,247,249,0))}
.cp-why-card > *{position:relative;z-index:1}
.cp-why-card .cp-ico{grid-row:1/3}
.cp-why-card h3{margin:4px 0 6px;font-size:17px;font-weight:900}
.cp-why-card p{margin:0;color:var(--cp-muted);font-size:14px;line-height:1.7;grid-column:2}

/* cta */
.cp-cta{padding:26px 0 8px}
.cp-cta-box{position:relative;overflow:hidden;border-radius:18px;border:1px solid #f3d6d7;background:radial-gradient(120% 140% at 85% 50%,#ffe1e2 0%,#fff6f6 60%);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);min-height:190px}
.cp-cta-txt{padding:26px clamp(18px,3vw,36px);position:relative;z-index:1}
.cp-kick{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:900;letter-spacing:1px;text-transform:uppercase;color:var(--cp-red)}
.cp-kick::after{content:"";width:34px;height:2px;background:var(--cp-red)}
.cp-cta-txt h2{margin:8px 0 6px;font-size:clamp(20px,2.4vw,30px);font-weight:900;line-height:1.25}
.cp-cta-txt p{margin:0 0 16px;color:var(--cp-muted);font-size:14.5px;line-height:1.7}
.cp-acts{display:flex;flex-wrap:wrap;gap:10px}
.cp-btn{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:14px;border-radius:10px;padding:11px 20px;transition:transform .15s,background .15s}
.cp-btn:hover{transform:translateY(-2px)}
.cp-btn-red{background:var(--cp-red);color:#fff;box-shadow:0 10px 24px rgba(224,20,28,.35)}
.cp-btn-line{border:1.5px solid var(--cp-ink);color:var(--cp-ink)}
.cp-btn-line:hover{background:rgba(20,27,38,.05)}
.cp-cta-pic{background:var(--cp-cta-img) no-repeat;background-size:230% auto;background-position:22% 42%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%);mask-image:linear-gradient(90deg,transparent,#000 35%)}
[dir="rtl"] .cp-cta-pic{-webkit-mask-image:linear-gradient(270deg,transparent,#000 35%);mask-image:linear-gradient(270deg,transparent,#000 35%)}

/* more */
.cp-more{padding:28px 0 46px}
.cp-more-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}

@media (max-width:1100px){
  .cp-spec-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cp-spec-list li:nth-child(4){border-inline-start:0}
  .cp-spec-list li:nth-child(n+4){border-top:1px solid var(--cp-line)}
  .cp-why-grid,.cp-more-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .cv.cv-premium .cv-stage,.cv.cv-premium.is-wide .cv-stage.has-bg{height:min(108vw,640px)}
  .cv.cv-premium .cv-stage.has-bg .cv-angle{inset:30% 4% 14%}
  .cv-top{top:62px;max-width:calc(100% - 20px)}
  .cv-top .cv-view{padding:7px 11px;font-size:12px}
  .cv-title{bottom:auto;top:14px;inset-inline-start:14px}
  .cv-title h1{font-size:20px}
  .cp-spec-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cp-spec-list li{border-inline-start:0;border-top:1px solid var(--cp-line)}
  .cp-cta-box{grid-template-columns:1fr}
  .cp-cta-pic{min-height:150px;-webkit-mask-image:linear-gradient(180deg,transparent,#000 40%);mask-image:linear-gradient(180deg,transparent,#000 40%)}
  .cp-why-card{padding-inline-end:22px}
  .cp-why-card::before{opacity:.3}
  .cv.cv-premium [data-cv-zin],.cv.cv-premium [data-cv-zout],.cv.cv-premium [data-cv-reset]{display:none}
  .cv.cv-premium .cv-tools{bottom:auto;top:116px;flex-direction:column}
}

/* CP_MORE_PHOTO_V1 - big photo cards for "More from <brand>" */
.cp-more-grid{gap:20px}
.cp-more-card{position:relative;display:block;aspect-ratio:16/10;border-radius:18px;overflow:hidden;background:radial-gradient(120% 120% at 70% 20%,#3a1418 0%,#140d10 75%);color:#fff;box-shadow:0 14px 34px rgba(15,26,43,.14);isolation:isolate;transition:transform .3s ease,box-shadow .3s ease}
.cp-more-card:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(15,26,43,.22)}
.cp-more-pic{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:-2}
.cp-more-pic img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.cp-more-card:hover .cp-more-pic img{transform:scale(1.06)}
.cp-more-pic .car-ico{width:42%;opacity:.8;margin-bottom:12%}
.cp-more-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(8,10,14,.88) 0%,rgba(8,10,14,.45) 34%,rgba(8,10,14,0) 62%)}
.cp-more-txt{position:absolute;inset-inline:20px;bottom:18px;display:flex;flex-direction:column;gap:2px}
.cp-more-txt small{align-self:flex-start;background:var(--cp-red);color:#fff;font-weight:900;font-size:10.5px;letter-spacing:1.6px;padding:3px 9px;border-radius:999px;margin-bottom:6px}
.cp-more-txt b{font-size:24px;font-weight:900;line-height:1.1;direction:ltr;text-align:start;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.cp-more-txt em{font-style:normal;color:rgba(255,255,255,.78);font-size:13.5px}
.cp-more-go{position:absolute;top:14px;inset-inline-end:14px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:17px;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.32);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .2s,border-color .2s}
.cp-more-card:hover .cp-more-go{background:var(--cp-red);border-color:var(--cp-red)}
.car-photo-credits{margin:14px 0 0;color:var(--cp-muted,#5c6575);font-size:11.5px;line-height:1.6}
.car-photo-credits a{color:inherit;text-decoration:underline}
@media (max-width:900px){.cp-more-grid{grid-template-columns:1fr}.cp-more-txt b{font-size:22px}}
/* CV_EXPLODE_V1 - view tabs never clip; title clear of the floating WhatsApp / top buttons */
.cv-top{width:max-content;max-width:calc(100% - 24px)}
.cv-top .cv-views{overflow-x:auto;scrollbar-width:none}
.cv-top .cv-views::-webkit-scrollbar{display:none}
.cv-top .cv-view{flex:0 0 auto;max-width:none;overflow:visible}
@media (min-width:761px){html[dir="rtl"] .cv.cv-premium .cv-title{inset-inline-start:clamp(96px,6vw,120px)}}

/* CP_VERSIONS_V1 - per-version specs / why / CTA fade in when the car changes */
.cp-ver{animation:cpVerIn .35s ease}
@keyframes cpVerIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.cp-ver{animation:none}}

/* CP_NSPEC_V1 - grade comparison table inside the premium page */
.cp-vt{padding:26px 0 8px;background:transparent}
.cp-vt .car-vtable-wrap{margin-top:0}

/* CP_FIT_V1 - single-photo versions (trucks): whole vehicle in the why cards and the CTA */
.cp-why-card.cp-fit::before{background-size:auto 80%;background-position:right 4% bottom 10%}
[dir="rtl"] .cp-why-card.cp-fit::before{background-position:left 4% bottom 10%}
.cp-cta-box.cp-fit .cp-cta-pic{background-size:contain;background-position:center;background-repeat:no-repeat;margin:18px 22px}
@media (max-width:760px){.cp-cta-box.cp-fit .cp-cta-pic{margin:10px}}

/* CP_QUOTE_V1 - quote request form + WhatsApp button in the CTA box */
button.cp-btn{font:inherit;cursor:pointer}
.cp-btn-wa{background:#1fa855;color:#fff;border:1.5px solid #1fa855;display:inline-flex;align-items:center;gap:8px}
.cp-btn-wa:hover{background:#178a45;border-color:#178a45;color:#fff}
.cp-btn-wa svg{width:18px;height:18px;fill:currentColor;flex:0 0 18px}
html.cp-q-lock{overflow:hidden}
.cp-q{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:16px}
.cp-q[hidden]{display:none}
.cp-q-bg{position:absolute;inset:0;background:rgba(10,12,16,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.cp-q-box{position:relative;width:min(460px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;color:#111;border-radius:18px;padding:26px 24px 22px;box-shadow:0 24px 60px rgba(0,0,0,.35);animation:cpQIn .22s ease;text-align:start}
@keyframes cpQIn{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.cp-q-x{position:absolute;top:10px;inset-inline-end:12px;border:0;background:transparent;font-size:28px;line-height:1;cursor:pointer;color:#64748b;padding:4px}
.cp-q-x:hover{color:#c8151b}
.cp-q h3{margin:0 0 4px;font-size:20px;font-weight:900;color:#111}
.cp-q-car{margin:0 0 16px;color:#c8151b;font-weight:800;font-size:15px}
.cp-q-f{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.cp-q-f label{font-size:13px;font-weight:700;color:#334155}
.cp-q-f input,.cp-q-f textarea{width:100%;box-sizing:border-box;border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 12px;font:inherit;font-size:15px;background:#fff;color:#111}
.cp-q-f textarea{resize:vertical;min-height:70px}
.cp-q-f input:focus,.cp-q-f textarea:focus{outline:none;border-color:#c8151b;box-shadow:0 0 0 3px rgba(200,21,27,.12)}
.cp-q-f .is-error{border-color:#c8151b;background:#fff5f5}
.cp-q-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.cp-q-send{width:100%;justify-content:center;border:0;margin-top:4px}
.cp-q-send[disabled]{opacity:.7;cursor:wait}
.cp-q-err{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:#fef2f2;border:1px solid #fecaca;color:#b3261e;font-weight:600;font-size:14px;line-height:1.5}
.cp-q-err[hidden],.cp-q-ok[hidden],.cp-q-form[hidden]{display:none}
.cp-q-ok{text-align:center;padding:8px 0 4px}
.cp-q-ok p{color:#475569;margin:6px 0 16px}
.cp-q-tick{width:58px;height:58px;border-radius:50%;background:#e3f6ee;color:#0f6e56;display:inline-flex;align-items:center;justify-content:center;font-size:28px;font-weight:900;margin-bottom:10px}
@media (prefers-reduced-motion:reduce){.cp-q-box{animation:none}}

/* CP_QUOTE_V2 - full-detail form; overrides the site's global input styles inside the dialog */
.cp-q .cp-q-box{width:min(640px,100%);overflow-x:hidden}
.cp-q-sub{margin:0 0 16px;color:#64748b;font-size:14px}
.cp-q-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.cp-q-full{grid-column:1/-1}
.cp-q .cp-q-f label,.cp-q .cp-q-lbl{font-size:13px;font-weight:700;color:#334155}
.cp-q .cp-q-f input:not([type=radio]),.cp-q .cp-q-f select,.cp-q .cp-q-f textarea{width:100%;box-sizing:border-box;border:1.5px solid #e2e8f0 !important;border-radius:10px;padding:10px 12px;font:inherit;font-size:15px;background:#fff !important;color:#111 !important;box-shadow:none !important;outline:none}
.cp-q .cp-q-f select{appearance:auto;height:auto;min-height:44px}
.cp-q .cp-q-f input:not([type=radio]):focus,.cp-q .cp-q-f select:focus,.cp-q .cp-q-f textarea:focus{border-color:#c8151b !important;box-shadow:0 0 0 3px rgba(200,21,27,.12) !important}
.cp-q .cp-q-f .is-error{border-color:#c8151b !important;background:#fff5f5 !important}
.cp-q-ferr{color:#b3261e;font-size:12px;font-weight:700}
.cp-q-ferr[hidden]{display:none}
.cp-q-radios{display:flex;gap:10px;flex-wrap:wrap;padding-top:2px}
.cp-q-radios label{display:inline-flex;align-items:center;gap:6px;border:1.5px solid #e2e8f0;border-radius:999px;padding:8px 14px;cursor:pointer;font-weight:700;font-size:14px;color:#111;background:#fff}
.cp-q-radios input{width:auto;margin:0;accent-color:#c8151b}
.cp-q-radios label:has(input:checked){border-color:#c8151b;background:#fff5f5}
.cp-q .cp-q-f input[type=file]{padding:8px !important;background:#f8fafc !important;cursor:pointer}
.cp-q-hint{color:#64748b;font-size:12px}
.cp-q-prev{display:block;max-width:150px;max-height:110px;border-radius:8px;border:1px solid #e2e8f0;margin-top:6px;object-fit:cover}
.cp-q-prev[hidden]{display:none}
.cp-q .cp-q-send{display:flex;width:100%;align-items:center;justify-content:center;margin-top:8px;padding:13px 18px;border:0;border-radius:12px;background:#c8151b !important;color:#fff !important;font:inherit;font-size:16px;font-weight:800;cursor:pointer;box-shadow:0 10px 24px rgba(200,21,27,.25)}
.cp-q .cp-q-send:hover{background:#a51015 !important}
.cp-q .cp-q-send[disabled]{opacity:.7;cursor:wait}
.cp-q .cp-q-hp{position:absolute !important;left:auto !important;top:0;width:1px !important;height:1px !important;overflow:hidden !important;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;opacity:0;pointer-events:none}
@media (max-width:560px){.cp-q-grid{grid-template-columns:1fr}}

/* SEO_PATCH1_V1 - hidden showroom versions use a div instead of a second H1; same look */
.cv-title .cv-h1{display:block;margin:2px 0 0;font-size:clamp(22px,2.6vw,36px);font-weight:900;line-height:1.1}
@media (max-width:760px){.cv-title .cv-h1{font-size:20px}}
