/* ============================================================CarZoon — Single Car Detail Page============================================================ */

/* ── Wrapper ── */.czs-wrap {max-width: 1160px;margin: 0 auto;padding: 24px 20px 60px;font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;color: #1a1a2e;}

/* ── Not found ── */.czs-not-found {padding: 48px;text-align: center;font-size: 16px;color: #64748b;}.czs-not-found a { color: #003399; font-weight: 600; }

/* ── Breadcrumb ── */.czs-breadcrumb {display: flex;align-items: center;gap: 6px;font-size: 13px;color: #64748b;margin-bottom: 18px;}.czs-breadcrumb a { color: #003399; text-decoration: none; font-weight: 600; }.czs-breadcrumb a { text-decoration: underline; }.czs-bc-sep { color: #c0c8d8; font-size: 16px; }

/* ── Page header ── */.czs-page-header {display: flex;justify-content: space-between;align-items: flex-start;gap: 20px;margin-bottom: 22px;flex-wrap: wrap;}.czs-page-title {font-size: 18px;font-weight: 800;color: #0f172a;margin: 0 0 10px;text-transform: uppercase;letter-spacing: .3px;line-height: 1.2;}.czs-page-meta {display: flex;align-items: center;gap: 10px;flex-wrap: wrap;}.czs-reg-plate {display: inline-block;background: #ffd84c;border: 2.5px solid #f0b800;border-radius: 8px;padding: 4px 14px;font-size: 15px;font-weight: 800;letter-spacing: 2px;color: #111;text-transform: uppercase;}.czs-loc-pill {display: inline-flex;align-items: center;gap: 5px;font-size: 13px;color: #475569;background: #f1f5f9;border-radius: 99px;padding: 4px 10px;}.czs-cond-pill {display: inline-block;background: #e0f2fe;color: #0369a1;border-radius: 99px;padding: 4px 12px;font-size: 12px;font-weight: 700;text-transform: uppercase;letter-spacing: .4px;}.czs-page-header-right { flex-shrink: 0; text-align: right; }.czs-header-price { display: flex; flex-direction: column; align-items: flex-end; }.czs-price-label { font-size: 12px; color: #64748b; font-weight: 600; margin-bottom: 2px; }.czs-price-amount {font-size: 18px;font-weight: 900;color: #0f172a;line-height: 1;}.czs-price-sub { font-size: 12px; color: #94a3b8; margin-top: 3px; }

/* ── Layout ── */.czs-layout {display: grid;grid-template-columns: 1fr 300px;gap: 28px;align-items: start;}.czs-col-main { display: flex; flex-direction: column; gap: 28px; }.czs-col-sidebar { display: flex; flex-direction: column; gap: 18px; position: sticky; top: 80px; }

/* ── Gallery ── */.czs-main-img-wrap {position: relative;border-radius: 16px;overflow: hidden;background: #0f172a;aspect-ratio: 16/10;}.czs-main-img {width: 100%;height: 100%;object-fit: cover;display: block;transition: opacity .25s;}.czs-nav-btn {position: absolute;top: 50%;transform: translateY(-50%);background: rgba(15,23,42,.65);color: #fff;border: none;width: 44px;height: 44px;border-radius: 50%;font-size: 26px;line-height: 1;cursor: pointer;display: flex;align-items: center;justify-content: center;transition: background .18s;z-index: 2;}.czs-nav-btn { background: rgba(0,51,153,.85); }.czs-nav-prev { left: 14px; }.czs-nav-next { right: 14px; }.czs-img-counter {position: absolute;bottom: 14px;right: 14px;background: rgba(0,0,0,.52);color: #fff;border-radius: 99px;padding: 4px 12px;font-size: 12px;font-weight: 600;}.czs-thumbs {display: grid;grid-template-columns: repeat(6, 1fr);gap: 8px;margin-top: 10px;}.czs-thumb {aspect-ratio: 4/3;object-fit: cover;border-radius: 9px;cursor: pointer;border: 1px solid transparent;transition: border-color .15s;width: 100%;display: block;}.czs-thumb { border-color: #003399; }.czs-thumb-active { border-color: #003399 !important; }.czs-no-photo {display: flex;flex-direction: column;align-items: center;justify-content: center;aspect-ratio: 16/10;background: #f1f5f9;border-radius: 16px;color: #94a3b8;font-size: 15px;gap: 12px;}

/* ── Action pills ── */.czs-action-pills { display: flex; gap: 10px; flex-wrap: wrap; }.czs-pill {display: inline-flex;align-items: center;gap: 7px;padding: 9px 18px;border-radius: 99px;font-size: 13px;font-weight: 600;color: #0f172a !important;background: #fff;border: 1.5px solid #d1d9e8;cursor: pointer;text-decoration: none;transition: border-color .18s, background .18s, color .18s;font-family: inherit;}.czs-pill { border-color: #003399; color: #003399; background: #eff4ff; }.czs-pill-primary { background: #003399; color: #fff !important; border-color: #003399; }.czs-pill-primary { background: #002580; color: #fff; border-color: #002580; }

/* ── Sections ── */.czs-section {}.czs-section-title {font-size: 14px;font-weight: 800;color: #0f172a;text-transform: uppercase;letter-spacing: .7px;margin: 0 0 14px;padding-bottom: 10px;border-bottom: 2px solid #0f172a;}

/* ── Vehicle details table ── */.czs-details-table {display: grid;grid-template-columns: repeat(2, 1fr);border: 1px solid #e2e8f0;border-radius: 12px;overflow: hidden;}.czs-detail-row {display: flex;justify-content: space-between;align-items: center;padding: 11px 16px;border-bottom: 1px solid #f0f4f8;border-right: 1px solid #f0f4f8;gap: 12px;}.czs-detail-row(2n) { border-right: none; }.czs-detail-row(-n+2) { border-bottom: none; }.czs-detail-key {font-size: 13px;color: #64748b;font-weight: 500;flex-shrink: 0;}.czs-detail-val {font-size: 13px;font-weight: 700;color: #0f172a;text-align: right;}

/* ── Description ── */.czs-description {font-size: 14px;color: #334155;line-height: 1.8;background: #f8fafc;border-radius: 12px;padding: 20px;border-left: 4px solid #003399;}

/* ── Features grid ── */.czs-features-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 10px;}.czs-feature-item {display: flex;align-items: center;gap: 8px;font-size: 13px;font-weight: 500;color: #334155;background: #f8fafc;border: 1px solid #e2e8f0;border-radius: 9px;padding: 9px 12px;}.czs-check-icon { color: #003399; flex-shrink: 0; }

/* ── Enquiry form ── */.czs-enquiry-section {background: #f8fafc;border-radius: 16px;padding: 24px;}.czs-enquiry-inner { display: flex; flex-direction: column; gap: 18px; }.czs-enquiry-seller {display: flex;align-items: center;gap: 14px;padding-bottom: 16px;border-bottom: 1px solid #e2e8f0;}.czs-seller-avatar {width: 44px; height: 44px;border-radius: 50%;background: linear-gradient(135deg, #003399, #2563eb);display: flex; align-items: center; justify-content: center;font-size: 18px; font-weight: 800; color: #fff;flex-shrink: 0;}.czs-seller-name { font-size: 15px; font-weight: 700; color: #0f172a; }.czs-seller-type { font-size: 12px; color: #94a3b8; }.czs-form { display: flex; flex-direction: column; gap: 14px; }.czs-form-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }.czs-form-field { display: flex; flex-direction: column; gap: 5px; }.czs-form-field label { font-size: 12px; font-weight: 700; color: #334155; }.czs-form-field label span { color: #dc2626; }.czs-form-field input,.czs-form-field textarea {border: 1.5px solid #d1d9e8;border-radius: 9px;padding: 10px 13px;font-size: 14px;color: #0f172a;background: #fff;outline: none;font-family: inherit;transition: border-color .18s;width: 100%;box-sizing: border-box;}.czs-form-field textarea { resize: vertical; min-height: 100px; }.czs-form-field input,.czs-form-field textarea { border-color: #003399; }.czs-terms-row {display: flex;align-items: flex-start;gap: 9px;font-size: 13px;color: #475569;cursor: pointer;line-height: 1.5;}.czs-terms-row input { width: 16px; height: 16px; accent-color: #003399; flex-shrink: 0; margin-top: 2px; }.czs-terms-row a { color: #003399; }.czs-submit-btn {padding: 13px 28px;background: #003399;color: #fff;border: none;border-radius: 10px;font-size: 15px;font-weight: 700;cursor: pointer;width: 100%;font-family: inherit;transition: background .18s;}.czs-submit-btn { background: #002580; }.czs-submit-btn { opacity: .6; cursor: not-allowed; }.czs-form-msg { font-size: 14px; font-weight: 600; min-height: 18px; margin-top: 4px; }.czs-form-msg.is-success { color: #059669; }.czs-form-msg.is-error   { color: #dc2626; }

/* ── Sidebar cards ── */.czs-sidebar-card {background: #fff;border: 1.5px solid #e2e8f0;border-radius: 16px;padding: 18px 20px;}.czs-sc-title {font-size: 14px;font-weight: 800;color: #0f172a;margin: 0 0 14px;text-transform: uppercase;letter-spacing: .5px;}

/* Seller card */.czs-sc-seller-row {display: flex;align-items: center;gap: 14px;margin-bottom: 16px;padding-bottom: 14px;border-bottom: 1px solid #f0f4f8;}.czs-seller-avatar-lg { width: 52px; height: 52px; font-size: 22px; }.czs-sc-btn {display: flex;align-items: center;gap: 8px;width: 100%;padding: 11px 16px;border-radius: 10px;font-size: 14px;font-weight: 700;cursor: pointer;border: none;text-decoration: none;font-family: inherit;transition: opacity .18s;margin-bottom: 8px;justify-content: center;}.czs-sc-btn { margin-bottom: 0; }.czs-sc-btn-phone { background: #003399; color: #fff !important; }.czs-sc-btn-phone { opacity: .88; color: #fff; }.czs-sc-btn-msg   { background: #f0f4f8; color: #0f172a !important; }.czs-sc-btn-msg { background: #e2e8f0; }

/* Facts card */.czs-facts-list { display: flex; flex-direction: column; gap: 0; }.czs-fact-row {display: flex;justify-content: space-between;align-items: center;padding: 9px 0;border-bottom: 1px solid #f0f4f8;font-size: 13px;}.czs-fact-row { border-bottom: none; }.czs-fact-key { color: #64748b; }.czs-fact-val { font-weight: 700; color: #0f172a; text-align: right; }

/* Location card */.czs-location-text {display: flex;align-items: center;gap: 8px;font-size: 14px;font-weight: 600;color: #334155;}.czs-location-text svg { color: #003399; flex-shrink: 0; }

/* ── Responsive ── */@media (max-width: 900px) {.czs-layout { grid-template-columns: 1fr; }.czs-col-sidebar { position: static; display: grid; grid-template-columns: repeat(2, 1fr); }.czs-features-grid { grid-template-columns: repeat(2, 1fr); }.czs-details-table { grid-template-columns: 1fr; }.czs-detail-row { border-right: none !important; }.czs-detail-row(-n+2) { border-bottom: 1px solid #f0f4f8; }.czs-detail-row { border-bottom: none; }}@media (max-width: 640px) {.czs-page-header { flex-direction: column; }.czs-page-header-right { text-align: left; }.czs-price-amount { font-size: 24px; }.czs-thumbs { grid-template-columns: repeat(4, 1fr); }.czs-form-row { grid-template-columns: 1fr; }.czs-features-grid { grid-template-columns: repeat(2, 1fr); }.czs-col-sidebar { grid-template-columns: 1fr; }.czs-wrap { padding: 16px 14px 40px; }}

/* ── Test Drive Button ────────────────────────────────────── */.czs-sc-btn-testdrive {width: 100%;display: flex;align-items: center;justify-content: center;gap: 8px;padding: 11px 16px;background: #0f2744;color: #fff;border: none;border-radius: 10px;font-size: 14px;font-weight: 700;cursor: pointer;transition: background 0.18s;margin-top: 8px;font-family: inherit;}.czs-sc-btn-testdrive { background: #1a3d6e; }

/* ── Test Drive Modal ─────────────────────────────────────── */.czs-td-modal {position: fixed;inset: 0;z-index: 99999;display: flex;align-items: center;justify-content: center;padding: 16px;}.czs-td-modal-backdrop {position: absolute;inset: 0;background: rgba(10, 20, 40, 0.55);backdrop-filter: blur(3px);}.czs-td-modal-box {position: relative;background: #fff;border-radius: 18px;box-shadow: 0 24px 64px rgba(15,39,68,0.22);width: 100%;max-width: 460px;max-height: 90vh;overflow-y: auto;z-index: 1;}.czs-td-modal-head {display: flex;align-items: center;justify-content: space-between;padding: 20px 22px 14px;border-bottom: 1.5px solid #e8edf8;}.czs-td-modal-head h3 {margin: 0;font-size: 16px;font-weight: 800;color: #0f172a;display: flex;align-items: center;gap: 8px;}.czs-td-modal-close {background: #f1f5f9;border: none;border-radius: 8px;width: 30px;height: 30px;font-size: 18px;cursor: pointer;color: #64748b;display: flex;align-items: center;justify-content: center;transition: 0.15s;}.czs-td-modal-close { background: #e2e8f0; color: #0f172a; }.czs-td-modal-body { padding: 20px 22px 24px; }.czs-td-intro {font-size: 13px;color: #64748b;margin: 0 0 18px;}.czs-td-field { margin-bottom: 14px; }.czs-td-label {display: block;font-size: 12px;font-weight: 700;color: #334155;margin-bottom: 5px;text-transform: uppercase;letter-spacing: 0.4px;}.czs-td-input {width: 100%;padding: 10px 13px;border: 1.5px solid #d1d9e8;border-radius: 10px;font-size: 14px;color: #0f172a;background: #fff;outline: none;transition: border-color 0.18s;font-family: inherit;box-sizing: border-box;}.czs-td-input { border-color: #2f68ff; box-shadow: 0 0 0 3px rgba(47,104,255,0.1); }.czs-td-textarea { resize: vertical; min-height: 80px; }.czs-td-submit {width: 100%;padding: 13px;background: #0f2744;color: #fff;border: none;border-radius: 12px;font-size: 14px;font-weight: 800;cursor: pointer;margin-top: 4px;transition: background 0.18s;font-family: inherit;}.czs-td-submit:hover() { background: #1a3d6e; }.czs-td-submit { opacity: 0.65; cursor: default; }.czs-td-msg {padding: 10px 14px;border-radius: 10px;font-size: 13px;font-weight: 600;margin-bottom: 12px;}.czs-td-msg.is-success { background: #f0fdf4; color: #059669; border: 1px solid #bbf7d0; }.czs-td-msg.is-error   { background: #fff1f2; color: #dc2626; border: 1px solid #fecdd3; }











/* ============================================================

CSS VARIABLES============================================================ */.czsgnle-single-root {--czblue: #1c3557;--czblue-mid: #1e4b8f;--czblue-btn: #1a4fd6;--czblue-light: #eef2fb;--czgreen: #27ae60;--czgreen-bg: #eafaf1;--czorange: #e67e22;--czorange-bg: #fef5ec;--czred: #e74c3c;--czgray-bg: #f4f5f7;--czgray-line: #e2e5ea;--czgray-mid: #8a93a2;--cztext: #1a1f2e;--cztext-soft: #4a5568;--czwhite: #ffffff;--czradius: 10px;--czradius-sm: 6px;--czfont: 'Manrope', sans-serif;--czshadow: 0 2px 12px rgba(28, 53, 87, .08);--czshadow-lg: 0 6px 32px rgba(28, 53, 87, .13);}

/* ============================================================

RESET & BASE============================================================ */.czsgnle-single-root,.czsgnle-single-root *,.czsgnle-single-root *::before,.czsgnle-single-root *::after {box-sizing: border-box;margin: 0;padding: 0;}

.czsgnle-single-root {
  font-size: 15px;
  scroll-behavior: smooth;
}

.czsgnle-single-root {
  font-family: var(--czfont);
  color: var(--cztext);
  /*background: var(--czgray-bg);*/
  line-height: 1.6;
}

.czsgnle-single-root a {
  color: inherit;
  text-decoration: none;
}

.czsgnle-single-root img {
  max-width: 100%;
  display: block;
}

.czsgnle-single-root ul {
  list-style: none;
}

.czsgnle-single-root button {
  cursor: pointer;
  border: none;
  background: none;
  font-family: var(--czfont);
}

/* ============================================================

UTILITY============================================================ */.czsgnle-container {width: 100%;/max-width: 1200px;/margin: 0 auto;padding: 0 20px;}

.czsgnle-card {
  background: var(--czwhite);
  border-radius: var(--czradius);
  box-shadow: var(--czshadow);
  padding: 22px 24px;
  margin-bottom: 16px;
}

.czsgnle-section-title {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--czblue);
  margin-bottom: 16px;
}

.czsgnle-label {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--czgray-mid);
}

.czsgnle-divider {
  border: none;
  border-top: 1px solid var(--czgray-line);
  margin: 18px 0;
}

.czsgnle-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .72rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 20px;
}

.czsgnle-badge--green {
  background: var(--czgreen-bg);
  color: var(--czgreen);
}

.czsgnle-badge--blue {
  background: var(--czblue-light);
  color: var(--czblue-btn);
}

.czsgnle-badge--orange {
  background: var(--czorange-bg);
  color: var(--czorange);
}

/* ============================================================

HEADER / NAV============================================================ */.czsgnle-header {background: var(--czwhite);border-bottom: 1px solid var(--czgray-line);position: sticky;top: 0;z-index: 100;}

.czsgnle-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
}

.czsgnle-logo {
  display: flex;
  align-items: center;
  gap: 8px;
}

.czsgnle-logo__icon {
  width: 36px;
  height: 36px;
  background: var(--czblue);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.czsgnle-logo__icon svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}

.czsgnle-logo__text {
  font-size: .9rem;
  font-weight: 800;
  color: var(--czblue);
  letter-spacing: -.02em;
}

.czsgnle-nav {
  display: flex;
  gap: 28px;
}

.czsgnle-nav a {
  font-size: .82rem;
  font-weight: 600;
  color: var(--cztext-soft);
  transition: color .2s;
}

.czsgnle-nav a:hover {
  color: var(--czblue);
}

.czsgnle-header__actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.czsgnle-btn-advert {
  background: var(--czblue);
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
  padding: 8px 18px;
  border-radius: 6px;
  transition: background .2s;
}

.czsgnle-btn-advert:hover {
  background: var(--czblue-mid);
}

.czsgnle-hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 4px;
}

.czsgnle-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--czblue);
  border-radius: 2px;
}

/* ============================================================

BREADCRUMB============================================================ */.czsgnle-breadcrumb {background: var(--czwhite);border-bottom: 1px solid var(--czgray-line);padding: 10px 0;}

.czsgnle-breadcrumb__list {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.czsgnle-breadcrumb__list li {
  font-size: .75rem;
  color: var(--czgray-mid);
}

.czsgnle-breadcrumb__list li a {
  color: var(--czblue-btn);
}

.czsgnle-breadcrumb__sep {
  color: var(--czgray-line);
}

/* ============================================================

PAGE LAYOUT============================================================ */.czsgnle-page {padding: 24px 0 48px;}

.czsgnle-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 20px;
  align-items: start;
}

/* ============================================================

LEFT COLUMN============================================================ */

/* Gallery */
.czsgnle-gallery {
  background: var(--czwhite);
  border-radius: var(--czradius);
  box-shadow: var(--czshadow);
  overflow: hidden;
  margin-bottom: 16px;
}

.czsgnle-gallery__main {
  position: relative;
  background: #f8f9fb;
  aspect-ratio: 16/9;
  overflow: hidden;
}

.czsgnle-gallery__main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.czsgnle-gallery__badge-row {
  position: absolute;
  top: 14px;
  left: 14px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.czsgnle-gallery__count {
  position: absolute;
  bottom: 14px;
  right: 14px;
  background: rgba(0, 0, 0, .55);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  padding: 5px 12px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 5px;
}

.czsgnle-gallery__thumbs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 3px;
  background: var(--czgray-line);
}

.czsgnle-gallery__thumb {
  aspect-ratio: 4/3;
  background: #e8eaf0;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.czsgnle-gallery__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s;
}

.czsgnle-gallery__thumb:hover img {
  transform: scale(1.05);
}

.czsgnle-gallery__thumb--active::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 3px solid var(--czblue-btn);
}

/* Title block */
.czsgnle-title-block {
  background: var(--czwhite);
  border-radius: var(--czradius);
  box-shadow: var(--czshadow);
  display: block;
  padding: 20px 16px;
  margin-bottom: 16px;
}

.czsgnle-title-block__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.czsgnle-title-block__title {
  font-size: 1.55rem;
  font-weight: 800;
  color: var(--czblue);
  line-height: 1.2;
  margin-bottom: 4px;
}

.czsgnle-title-block__sub {
  font-size: .8rem;
  color: var(--czgray-mid);
  margin-bottom: 14px;
}

.czsgnle-title-block__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.czsgnle-tag {
  background: var(--czgray-bg);
  border: 1px solid var(--czgray-line);
  border-radius: 20px;
  padding: 4px 12px;
  font-size: .72rem;
  font-weight: 600;
  color: var(--cztext-soft);
  display: flex;
  align-items: center;
  gap: 4px;
}

/* Overview */
.czsgnle-overview__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.czsgnle-overview__desc {
  font-size: .82rem;
  color: var(--cztext-soft);
  line-height: 1.75;
}

.czsgnle-overview__desc p {
  margin-bottom: 10px;
}

.czsgnle-overview__highlights {}

.czsgnle-overview__highlights h4 {
  font-size: .82rem;
  font-weight: 700;
  color: var(--czblue);
  margin-bottom: 8px;
}

.czsgnle-highlights-list li {
  font-size: .78rem;
  color: var(--cztext-soft);
  padding: 4px 0;
  display: flex;
  align-items: flex-start;
  gap: 7px;
}

.czsgnle-highlights-list li::before {
  content: '✓';
  color: var(--czgreen);
  font-weight: 700;
  margin-top: 1px;
  flex-shrink: 0;
}

.czsgnle-why-box {
  background: var(--czblue);
  color: #fff;
  border-radius: var(--czradius-sm);
  padding: 14px 16px;
  margin-top: 14px;
}

.czsgnle-why-box h5 {
  font-size: .78rem;
  font-weight: 700;
  color:#fff;
  margin-bottom: 6px;
}
.czsgnle-flex-row{
    display: flex;
    justify-content: space-between;
    /*align-items: end;*/
    gap: 30px;
    
}
.czsgnle-flex-row .czsgnle-highlights-list, .czsgnle-flex-row .czsgnle-why-box{ flex: 1;}

.czsgnle-why-box p {
  font-size: .75rem;
  opacity: .85;
  line-height: 1.6;
}

/* Key Specs */
.czsgnle-specs__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid var(--czgray-line);
  border-radius: var(--czradius-sm);
  overflow: hidden;
}

.czsgnle-spec-item {
  padding: 14px 16px;
  border-right: 1px solid var(--czgray-line);
  border-bottom: 1px solid var(--czgray-line);
}

.czsgnle-spec-item:nth-child(4n) {
  border-right: none;
}

.czsgnle-spec-item:nth-last-child(-n+4) {
  border-bottom: none;
}

.czsgnle-spec-item__label {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--czgray-mid);
  margin-bottom: 4px;
}

.czsgnle-spec-item__value {
  font-size: .85rem;
  font-weight: 700;
  color: var(--cztext);
}

/* Running costs */
.czsgnle-costs__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  text-align: center;
}

.czsgnle-cost-item__icon {
  width: 38px;
  height: 38px;
  background: var(--czblue-light);
  border-radius: 50%;
  margin: 0 auto 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.czsgnle-cost-item__icon svg {
  width: 18px;
  height: 18px;
  stroke: var(--czblue-btn);
  fill: none;
}

.czsgnle-cost-item__val {
  font-size: .85rem;
  font-weight: 800;
  color: var(--czblue);
  display: block;
}

.czsgnle-cost-item__sub {
  font-size: .65rem;
  color: var(--czgray-mid);
  display: block;
}

.czsgnle-cost-badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: .7rem;
  font-weight: 700;
}

/* Features tabs */
.czsgnle-tabs {
    display: none;
  /*display: flex;*/
  gap: 4px;
  margin-bottom: 16px;
  border-bottom: 2px solid var(--czgray-line);
  overflow-x: auto;
    max-width: 300px;
    min-width: 100%;
}

.czsgnle-tab {
  padding: 8px 18px;
  font-size: .78rem;
  font-weight: 700;
  color: var(--czgray-mid);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  white-space: nowrap;
  transition: color .2s, border-color .2s;
}

.czsgnle-tab:hover {
  color: var(--czblue);
}

.czsgnle-tab--active {
  color: var(--czblue-btn);
  border-bottom-color: var(--czblue-btn);
}

.czsgnle-features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px 20px;
}

.czsgnle-feature-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: .78rem;
  color: var(--cztext-soft);
}

.czsgnle-feature-item::before {
  content: '';
  width: 7px;
  height: 7px;
  background: var(--czblue-btn);
  border-radius: 50%;
  flex-shrink: 0;
}

/* Vehicle history */
.czsgnle-history__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.czsgnle-history__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 24px;
}

.czsgnle-history-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--czgray-line);
  font-size: .78rem;
}

.czsgnle-history-row:last-child {
  border-bottom: none;
}

.czsgnle-history-row__label {
  color: var(--czgray-mid);
}

.czsgnle-history-row__val {
  font-weight: 700;
  color: var(--cztext);
}

.czsgnle-history-row__val--green {
  color: var(--czgreen);
}

.czsgnle-history-row__val--red {
  color: var(--czred);
}

.czsgnle-btn-download {
  background: var(--czblue-light) !important;
  color: var(--cztext) !important;
  font-size: .75rem;
  font-weight: 700;
  padding: 7px 16px;
  border-radius: 6px;
  transition: background .2s !important;
}

.czsgnle-btn-download:hover {
  background: #dce6f8;
}

/* Dealer card */
.czsgnle-dealer {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}

.czsgnle-dealer__logo {
  width: 56px;
  height: 56px;
  background: var(--czblue-light);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .7rem;
  font-weight: 800;
  color: var(--czblue);
  text-align: center;
  flex-shrink: 0;
}

.czsgnle-dealer__name {
  font-size: .9rem;
  font-weight: 800;
  color: var(--czblue);
}

.czsgnle-dealer__meta {
  font-size: .72rem;
  color: var(--czgray-mid);
  margin-top: 2px;
}

.czsgnle-dealer__actions {
  margin-left: auto;
  display: flex;
  gap: 8px;
}

/* Contact form */
.czsgnle-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}

.czsgnle-form-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.czsgnle-form-group--full {
  grid-column: 1 / -1;
}

.czsgnle-form-label {
  font-size: .72rem;
  font-weight: 700;
  color: var(--cztext-soft);
}

.czsgnle-form-input,
.czsgnle-form-textarea {
  border: 1px solid var(--czgray-line);
  border-radius: 6px;
  padding: 10px 12px;
  font-size: .82rem;
  font-family: var(--czfont);
  color: var(--cztext);
  background: var(--czwhite);
  transition: border-color .2s;
  width: 100%;
}

.czsgnle-form-input:focus,
.czsgnle-form-textarea:focus {
  outline: none;
  border-color: var(--czblue-btn);
}

.czsgnle-form-textarea {
  resize: vertical;
  min-height: 90px;
}

.czsgnle-form-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.czsgnle-btn-primary {
  background: var(--czblue-btn) !important;
  color: #fff !important;
  font-size: .8rem;
  font-weight: 700;
  padding: 10px 22px;
  border-radius: 6px;
  transition: background .2s, transform .15s !important;
}

.czsgnle-btn-primary:hover {
  background: #1643b8;
  transform: translateY(-1px);
}

.czsgnle-btn-secondary {
  background: var(--czgray-bg) !important;
  border: 1px solid var(--czgray-line) !important;
  color: var(--cztext) !important;
  font-size: .8rem;
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 6px;
  transition: background .2s !important;
}

.czsgnle-btn-secondary:hover {
  background: var(--czgray-line);
}

/* Map */
.czsgnle-map {
  border-radius: var(--czradius-sm);
  overflow: hidden;
  aspect-ratio: 16/7;
  background: #d9e2ec;
  position: relative;
  margin-bottom: 14px;
}

.czsgnle-map iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.czsgnle-map__placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #d6e4f0 0%, #c3d5e8 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--czblue);
}

.czsgnle-map__placeholder svg {
  width: 36px;
  height: 36px;
  opacity: .5;
}

.czsgnle-map__placeholder p {
  font-size: .78rem;
  font-weight: 600;
  opacity: .6;
}

/* Safety accordion */
.czsgnle-accordion-item {
  border-bottom: 1px solid var(--czgray-line);
}

.czsgnle-accordion-item:last-child {
  border-bottom: none;
}

.czsgnle-accordion-trigger {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 0;
  font-size: .82rem;
  font-weight: 700;
  color: var(--cztext) !important;
  cursor: pointer;
  width: 100%;
  text-align: left;
}

.czsgnle-accordion-trigger svg {
  width: 16px;
  height: 16px;
  stroke: var(--czgray-mid);
  fill: none;
  transition: transform .2s;
}

/* Similar cars */
.czsgnle-similar {
  padding: 32px 0;
  background: var(--czwhite);
  border-top: 1px solid var(--czgray-line);
}

.czsgnle-similar__header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 22px;
}

.czsgnle-similar__title {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--czblue);
  letter-spacing: -.02em;
}

.czsgnle-similar__sub {
  font-size: .78rem;
  color: var(--czgray-mid);
}

.czsgnle-cars-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.czsgnle-car-card {
  background: var(--czgray-bg);
  border: 1px solid var(--czgray-line);
  border-radius: var(--czradius);
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}

.czsgnle-car-card:hover {
  box-shadow: var(--czshadow-lg);
  transform: translateY(-3px);
}

.czsgnle-car-card__img {
  aspect-ratio: 4/3;
  background: #e0e7ef;
  overflow: hidden;
}

.czsgnle-car-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s;
}

.czsgnle-car-card:hover .czsgnle-car-card__img img {
  transform: scale(1.04);
}

.czsgnle-car-card__body {
  padding: 12px 14px;
}

.czsgnle-car-card__name {
  font-size: .82rem;
  font-weight: 700;
  color: var(--czblue);
  margin-bottom: 2px;
}

.czsgnle-car-card__trim {
  font-size: .72rem;
  color: var(--czgray-mid);
  margin-bottom: 8px;
}

.czsgnle-car-card__price {
  font-size: 1rem;
  font-weight: 800;
  color: var(--czblue);
  margin-bottom: 10px;
}

.czsgnle-car-card__btn {
  display: block;
  text-align: center;
  background: var(--czblue);
  color: #fff;
  font-size: .75rem;
  font-weight: 700;
  padding: 8px;
  border-radius: 6px;
  transition: background .2s;
}

.czsgnle-car-card__btn:hover {
  background: var(--czblue-mid);
}

/* History section */
.czsgnle-history-banner {
  padding: 24px 0;
  background: var(--czgray-bg);
  border-top: 1px solid var(--czgray-line);
}

.czsgnle-history-banner__title {
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--czblue);
  margin-bottom: 16px;
}

.czsgnle-history-cars {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.czsgnle-history-car {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--czwhite);
  border: 1px solid var(--czgray-line);
  border-radius: var(--czradius-sm);
  padding: 10px;
}

.czsgnle-history-car__img {
  width: 60px;
  height: 44px;
  background: #e8edf5;
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
}

.czsgnle-history-car__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.czsgnle-history-car__name {
  font-size: .72rem;
  font-weight: 700;
  color: var(--czblue);
}

.czsgnle-history-car__price {
  font-size: .72rem;
  color: var(--czgray-mid);
}

/* ============================================================

RIGHT SIDEBAR============================================================ */.czsgnle-sidebar {position: sticky;top: 80px;}

/* Price card */
.czsgnle-price-card {
  background: var(--czwhite);
  border-radius: var(--czradius);
  box-shadow: var(--czshadow);
  padding: 20px 22px;
  margin-bottom: 14px;
}

.czsgnle-price-card__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 4px;
}

.czsgnle-price-card__price {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--czblue);
  line-height: 1;
}

.czsgnle-price-card__save {
  font-size: .7rem;
  color: var(--czgray-mid);
  margin-bottom: 12px;
}

.czsgnle-price-card__save strong {
  color: var(--czgreen);
}

.czsgnle-price-card__monthly {
  background: var(--czgray-bg);
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.czsgnle-price-card__monthly-val {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--czblue);
}

.czsgnle-price-card__monthly-label {
  font-size: .7rem;
  color: var(--czgray-mid);
}

.czsgnle-price-card__actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.czsgnle-btn-outline {
  border: 2px solid var(--czblue) !important;
  color: var(--czblue) !important;
  background: transparent;
  font-size: .82rem;
  font-weight: 700;
  padding: 11px;
  border-radius: 6px;
  text-align: center;
  transition: background .2s, color .2s !important;
}

.czsgnle-btn-outline:hover {
  background: var(--czblue) !important;
  color: #fff !important;
}

.czsgnle-btn-call {
  background: var(--czgreen);
  color: #fff;
  font-size: .82rem;
  font-weight: 700;
  padding: 11px;
  border-radius: 6px;
  text-align: center;
  transition: background .2s;
}

.czsgnle-btn-call:hover {
  background: #219a52;
}

/* Reserve card */
.czsgnle-reserve-card {
  background: var(--czblue);
  border-radius: var(--czradius);
  padding: 20px 22px;
  margin-bottom: 14px;
  color: #fff;
}

.czsgnle-reserve-card h4 {
  font-size: .9rem;
  font-weight: 800;
  color: #fff !important;
  margin-bottom: 6px;
}

.czsgnle-reserve-card p {
  font-size: .75rem;
  opacity: .8;
  margin-bottom: 14px;
}

.czsgnle-btn-reserve {
  display: block;
  background: #fff;
  color: var(--czblue) !important;
  font-size: .82rem;
  font-weight: 800;
  padding: 11px;
  border-radius: 6px;
  text-align: center;
  transition: opacity .2s;
}

.czsgnle-btn-reserve:hover {
  opacity: .9;
}

/* Finance breakdown */
.czsgnle-finance-row {
  display: flex;
  justify-content: space-between;
  padding: 7px 0;
  border-bottom: 1px solid var(--czgray-line);
  font-size: .78rem;
}

.czsgnle-finance-row:last-child {
  border-bottom: none;
}

.czsgnle-finance-row__label {
  color: var(--czgray-mid);
}

.czsgnle-finance-row__val {
  font-weight: 700;
}

/* ============================================================

FINANCE SECTION (full width)============================================================ */.czsgnle-finance-section {background: var(--czwhite);border-radius: var(--czradius);box-shadow: var(--czshadow);padding: 22px 24px;margin-bottom: 16px;}

.czsgnle-finance-section__headline {
  font-size: .9rem;
  font-weight: 800;
  color: var(--czblue);
  margin-bottom: 4px;
}

.czsgnle-finance-section__tagline {
  font-size: 1.55rem;
  font-weight: 800;
  color: var(--czblue);
  margin-bottom: 16px;
}

.czsgnle-finance-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.czsgnle-finance-big-price {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--czblue);
  line-height: 1;
  margin-bottom: 4px;
}

.czsgnle-finance-sub {
  font-size: .72rem;
  color: var(--czgray-mid);
  margin-bottom: 14px;
}

/* ============================================================

FOOTER============================================================ */.czsgnle-footer {background: var(--czblue);color: rgba(255, 255, 255, .7);padding: 28px 0 20px;}

.czsgnle-footer__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
}

.czsgnle-footer__logo {
  font-size: .9rem;
  font-weight: 800;
  color: #fff;
}

.czsgnle-footer__links {
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
}

.czsgnle-footer__links a {
  font-size: .72rem;
  color: rgba(255, 255, 255, .65);
  transition: color .2s;
}

.czsgnle-footer__links a:hover {
  color: #fff;
}

.czsgnle-footer__copy {
  font-size: .7rem;
  width: 100%;
  text-align: center;
  margin-top: 10px;
}

/* ============================================================

RESPONSIVE — TABLET============================================================ */@media (max-width: 1024px) {.czsgnle-layout {grid-template-columns: 1fr;}

  .czsgnle-sidebar {
    position: static;
  }

  .czsgnle-sidebar-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  .czsgnle-costs__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .czsgnle-cars-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .czsgnle-history-cars {
    grid-template-columns: repeat(2, 1fr);
  }

  .czsgnle-features-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .czsgnle-specs__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .czsgnle-specs__grid .czsgnle-spec-item:nth-child(3n) {
    border-right: none;
  }

  .czsgnle-specs__grid .czsgnle-spec-item:nth-child(4n) {
    border-right: 1px solid var(--czgray-line);
  }
}

/* ============================================================

RESPONSIVE — MOBILE============================================================ */@media (max-width: 640px) {.czsgnle-nav {display: none;}

.czsgnle-container {

  padding: 0 0px;
}

  .czsgnle-header__actions .czsgnle-btn-advert {
    display: none;
  }

  .czsgnle-hamburger {
    display: flex;
  }

  .czsgnle-overview__grid {
    grid-template-columns: 1fr;
  }

  .czsgnle-form-grid {
    grid-template-columns: 1fr;
  }

  .czsgnle-finance-inner {
    grid-template-columns: 1fr;
  }

  .czsgnle-costs__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .czsgnle-cars-grid {
    grid-template-columns: 1fr 1fr;
  }

  .czsgnle-history-cars {
    grid-template-columns: 1fr;
  }

  .czsgnle-features-grid {
    grid-template-columns: 1fr;
  }

  .czsgnle-specs__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .czsgnle-specs__grid .czsgnle-spec-item:nth-child(3n) {
    border-right: 1px solid var(--czgray-line);
  }

  .czsgnle-specs__grid .czsgnle-spec-item:nth-child(2n) {
    border-right: none;
  }

  .czsgnle-sidebar-row {
    grid-template-columns: 1fr;
  }

  .czsgnle-gallery__thumbs {
    grid-template-columns: repeat(4, 1fr);
  }

  .czsgnle-title-block__title {
    font-size: 1.2rem;
  }

  .czsgnle-similar__title {
    font-size: 1.15rem;
  }

  .czsgnle-dealer {
    flex-wrap: wrap;
  }

  .czsgnle-dealer__actions {
    margin-left: 0;
  }

  .czsgnle-form-actions {
    flex-direction: column;
  }

  .czsgnle-form-actions button {
    width: 100%;
  }
}

/* Mobile nav overlay */
.czsgnle-mobile-nav {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(28, 53, 87, .92);
  z-index: 200;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 28px;
}

.czsgnle-mobile-nav.open {
  display: flex;
}

.czsgnle-mobile-nav a {
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
}

.czsgnle-mobile-nav__close {
  position: absolute;
  top: 20px;
  right: 20px;
  color: #fff;
  font-size: 1.8rem;
  font-weight: 300;
  background: none;
  border: none;
}

/* Plugin-safe additions for dynamic renderer */.czsgnle-no-photo {min-height: 360px;display: flex;flex-direction: column;align-items: center;justify-content: center;color: var(--czgray-mid);gap: 10px;background: #f8f9fb;}.czsgnle-form-msg { font-size:.78rem; margin-top:10px; }.czsgnle-form-msg.success { color: var(--czgreen); }.czsgnle-form-msg.error { color: var(--czred); }.czsgnle-hidden-old-hook { display !important; }

.czsgnle-accordion-item {border-bottom: 1px solid var(--czgray-line);}

.czsgnle-accordion-item {border-bottom: none;}

.czsgnle-accordion-trigger {display: flex;justify-content: space-between;align-items: center;gap: 12px;padding: 13px 0;font-size: .82rem;font-weight: 700;color: var(--cztext);cursor: pointer;width: 100%;text-align: left;background: transparent;border: none;}

.czsgnle-accordion-trigger svg {width: 16px;height: 16px;stroke: var(--czgray-mid);fill: none;transition: transform .2s ease;flex-shrink: 0;}

.czsgnle-accordion-content {display: none;padding: 0 0 14px;}

.czsgnle-accordion-content p {font-size: .76rem;line-height: 1.65;color: var(--cztext-soft);margin: 0;}

.czsgnle-accordion-item.is-open .czsgnle-accordion-content {display: block;}

.czsgnle-accordion-item.is-open .czsgnle-accordion-trigger svg {transform: rotate(180deg);}

/*new css                       */

/* Hide by default (desktop) */.czsgnle-title-block-mobile {display: none;}

/* Show only on mobile */@media (max-width: 768px) {.czsgnle-title-block-mobile {display: block;margin: 6px 0;}.czsgnle-title-block {display: none;}.czsgnle-card {padding: 14px 10px;}}




.czsgnle-mobile-hero {
    background: #fff;
    box-shadow: none;
    border-radius: 0;
    padding: 16px 0 22px;
    margin-bottom: 16px;
}

.czsgnle-mobile-hero__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
}

.czsgnle-mobile-hero__info {
    flex: 3;
    /*min-width: 0;*/
}

.czsgnle-mobile-hero__title {
    font-size: 38px;
    line-height: 1.1;
    font-weight: 900;
    color: #071d4d;
    margin: 0 0 8px;
    letter-spacing: -0.04em;
}

.czsgnle-mobile-hero__title span {
    color: #08783b;
    font-weight: 900;
    margin-left: 2px;
    white-space: nowrap;
}

.czsgnle-mobile-hero__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 20px;
    color: #303442;
    font-weight: 500;
}

.czsgnle-mobile-hero__meta-item {
    display: inline-flex;
    align-items: center;
    gap:2px;
}

.czsgnle-mobile-hero__meta-item svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: #303442;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex-shrink: 0;
}

.czsgnle-mobile-hero__verified {
    color: #176c3b;
}

.czsgnle-mobile-hero__verified svg {
    fill: #35415d;
    stroke: #fff;
}

.czsgnle-mobile-hero__divider {
    color: #1f2636;
    font-weight: 700;
}

.czsgnle-mobile-hero__price {
    text-align: right;
    /*min-width: 185px;*/
    padding-top: 2px;
}

.czsgnle-mobile-hero__price strong {
    display: block;
    font-size: 40px;
    line-height: 1;
    font-weight: 900;
    color: #071d4d;
    letter-spacing: -0.04em;
    margin-bottom: 12px;
}

.czsgnle-mobile-hero__price small {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    font-size: 19px;
    color: #303442;
    font-weight: 500;
}

.czsgnle-mobile-hero__price small span {
    width: 15px;
    height: 15px;
    border: 2px solid #071d4d;
    color: #071d4d;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
}

.czsgnle-mobile-hero__specs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    font-size: 19px;
    color: #303442;
    font-weight: 500;
}

.czsgnle-mobile-hero__specs span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.czsgnle-mobile-hero__specs span:not(:last-child)::after {
    content: "";
    width: 5px;
    height: 5px;
    background: #1f2636;
    border-radius: 50%;
    margin-left: 10px;
}

.czsgnle-mobile-hero__specs svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: #303442;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .czsgnle-mobile-hero {
        padding: 0px 0 18px;
    }

    .czsgnle-mobile-hero__top {
        gap: 6px;
        margin-bottom: 10px;
    }

    .czsgnle-mobile-hero__title {
        font-size: 28px;
    }

    .czsgnle-mobile-hero__meta,
    .czsgnle-mobile-hero__specs {
        font-size: 14px;
        gap: 2px;
    }

    .czsgnle-mobile-hero__meta-item svg,
    .czsgnle-mobile-hero__specs svg {
        width: 15px;
        height: 15px;
    }

    .czsgnle-mobile-hero__price {
        min-width: 120px;
    }

    .czsgnle-mobile-hero__price strong {
        font-size: 16px;
    }

    .czsgnle-mobile-hero__price small {
        font-size: 13px;
    }

    .czsgnle-mobile-hero__specs span:not(:last-child)::after {
        width: 4px;
        height: 4px;
        margin-left: 6px;
    }
}

@media (max-width: 520px) {
    .czsgnle-mobile-hero__top {
        flex-direction: row;
    }
    
    .czsgnle-mobile-hero__price {
        text-align: right;
        flex: 1;
        /*min-width: 100%;*/
    }

    .czsgnle-mobile-hero__price small {
        justify-content: flex-start;
    }

    .czsgnle-mobile-hero__title {
        font-size: 17px;
    }
}






/*5 15 2026 11:30 new css*/


.czsgnle-running-card {
  padding: 34px 36px;
  border-radius: 18px;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08);
  border: 1px solid #eef1f5;
}

.czsgnle-running-title {
  font-size: 38px;
  line-height: 1.1;
  font-weight: 800;
  color: #071d4d;
  margin: 0 0 14px;
  letter-spacing: -0.04em;
}

.czsgnle-running-subtitle {
  font-size: 19px;
  color: #4b5567;
  margin: 0 0 30px;
  font-weight: 500;
}

.czsgnle-running-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.czsgnle-running-item {
  background: #fff;
  border: 1px solid #e6e8ee;
  border-radius: 16px;
  min-height: 230px;
  padding: 30px 18px 26px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.czsgnle-running-icon {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
}

.czsgnle-running-icon svg {
  width: 52px;
  height: 52px;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.czsgnle-running-icon--green {
  background: #eaf7ef;
}

.czsgnle-running-icon--green svg {
  stroke: #138a45;
}

.czsgnle-running-icon--blue {
  background: #eef2ff;
}

.czsgnle-running-icon--blue svg {
  stroke: #155bc7;
}

.czsgnle-running-icon--purple {
  background: #f1efff;
}

.czsgnle-running-icon--purple svg {
  stroke: #4b3ca0;
}

.czsgnle-running-label {
  font-size: 19px;
  line-height: 1.3;
  color: #07142f;
  font-weight: 500;
  margin-bottom: 6px;
}

.czsgnle-running-value {
  display: block;
  font-size: 32px;
  line-height: 1.15;
  font-weight: 700;
  color: #071d4d;
  margin-bottom: 6px;
  letter-spacing: -0.03em;
}

.czsgnle-running-value--green {
  color: #118342;
}

.czsgnle-running-value--purple {
  color: #4b3ca0;
}

.czsgnle-running-note {
  font-size: 17px;
  color: #5a6475;
  font-weight: 500;
}

.czsgnle-running-info {
  margin-top: 28px;
  background: #f3f5fb;
  border-radius: 12px;
  padding: 22px 28px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.czsgnle-running-info-icon {
  width: 44px;
  height: 44px;
  background: #2563d9;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  font-weight: 800;
  flex-shrink: 0;
}

.czsgnle-running-info strong {
  display: block;
  font-size: 17px;
  color: #071d4d;
  font-weight: 700;
  line-height: 1.35;
}

.czsgnle-running-info span {
  display: block;
  font-size: 17px;
  color: #5a6475;
  line-height: 1.45;
}

/* Tablet */
@media (max-width: 1024px) {
  .czsgnle-running-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .czsgnle-running-title {
    font-size: 32px;
  }
}

/* Mobile */
@media (max-width: 640px) {
  .czsgnle-running-card {
    padding: 22px 10px;
    border-radius: 14px;
  }

  .czsgnle-running-title {
    font-size: 20px;
  }

  .czsgnle-running-subtitle {
    font-size: 15px;
    margin-bottom: 20px;
  }

  .czsgnle-running-grid {
    /*grid-template-columns: 1fr;*/
    gap: 4px;
  }

  .czsgnle-running-item {
    min-height: auto;
    padding: 8px 8px;
  }

  .czsgnle-running-icon {
    width: 48px;
    height: 48px;
    margin-bottom: 8px;
  }

  .czsgnle-running-icon svg {
    width: 28px;
    height: 28px;
  }

  .czsgnle-running-label {
    font-size: 12px;
  }

  .czsgnle-running-value {
    font-size: 16px;
  }

  .czsgnle-running-note {
    font-size: 14px;
  }

  .czsgnle-running-info {
    padding: 8px;
    gap: 8px;
    align-items: flex-start;
  }

  .czsgnle-running-info-icon {
    width: 22px;
    height: 22px;
    font-size: 14px;
  }

  .czsgnle-running-info strong,
  .czsgnle-running-info span {
    font-size: 14px;
  }
}

/* Desktop section: show on desktop, hide on mobile */
.hide-no-mobile {
  display: block;
}

/* Mobile section: hide on desktop */
.hide-desktop {
  display: none;
}

/* Mobile only */
@media (max-width: 768px) {
  .hide-no-mobile {
    display: none !important;
  }

  .hide-desktop {
    display: block !important;
  }
}

/* Desktop only */
@media (min-width: 769px) {
  .hide-no-mobile {
    display: block !important;
  }

  .hide-desktop {
    display: none !important;
  }
}