/* ============================================================
   CPQT Shipping Theme — theme.css v1.0
   Author: dev.com.vn
   ============================================================ */

/* ── CSS Variables (overridden by Customizer / Plugin settings) ── */
:root {
  --primary:       #0b63df;
  --primary-dark:  #073b86;
  --primary-soft:  rgba(11,99,223,.08);
  --secondary:     #ef3340;
  --red:           #ef3340;
  --green:         #16a34a;
  --orange:        #f97316;
  --yellow:        #f6b51d;
  --navy:          #073b82;
  --text:          #10213c;
  --muted:         #63728a;
  --line:          #e3ebf6;
  --surface:       #f7fbff;
  --card:          #ffffff;
  --shadow:        0 2px 12px rgba(15,68,150,.08);
  --shadow-hover:  0 8px 24px rgba(15,68,150,.15);
  --radius:        14px;
  --radius-sm:     8px;
  --container:     1360px;
  --font:          'Inter',system-ui,-apple-system,sans-serif;
  --sidebar-w:     280px;
  --header-h:      64px;
  --topbar-h:      36px;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 14px; }
body {
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.65;
  color: var(--text);
  background: var(--surface);
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; transition: color .15s; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
ul, ol { list-style: none; }
h1,h2,h3,h4,h5,h6 { line-height: 1.25; font-weight: 600; }

/* ── Layout ── */
.cpqt-container {
  width: min(calc(100% - 32px), var(--container));
  margin: 0 auto;
}
.cpqt-section       { padding: 48px 0; }
.cpqt-section-sm    { padding: 28px 0; }
.cpqt-main          { min-height: 60vh; }

/* Grid helpers */
.cpqt-grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
.cpqt-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.cpqt-grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }

/* ── Card ── */
.cpqt-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}
.cpqt-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.cpqt-card-body { padding: 18px; }

/* ── Buttons ── */
.cpqt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 10px 20px;
  border-radius: 10px;
  border: 1.5px solid transparent;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap;
  line-height: 1;
}
.cpqt-btn:hover { transform: translateY(-1px); }
.cpqt-btn-primary   { background: var(--primary); color: #fff; border-color: var(--primary); }
.cpqt-btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); }
.cpqt-btn-secondary { background: var(--secondary); color: #fff; border-color: var(--secondary); }
.cpqt-btn-outline   { background: #fff; color: var(--text); border-color: var(--line); }
.cpqt-btn-outline:hover { border-color: var(--primary); color: var(--primary); }
.cpqt-btn-sm  { padding: 7px 14px; font-size: 13px; border-radius: 8px; }
.cpqt-btn-lg  { padding: 14px 28px; font-size: 15px; border-radius: 12px; }
.cpqt-btn-full { width: 100%; justify-content: center; }

/* ── Section heading ── */
.cpqt-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}
.cpqt-section-title {
  font-size: 18px;
  font-weight: 700;
  color: #0d2a5e;
  text-transform: uppercase;
  letter-spacing: .02em;
  position: relative;
  padding-left: 14px;
}
.cpqt-section-title::before {
  content: '';
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  width: 4px; height: 20px;
  background: var(--primary);
  border-radius: 2px;
}
.cpqt-section-link { font-size: 13px; color: var(--primary); font-weight: 500; flex-shrink: 0; }
.cpqt-section-link:hover { text-decoration: underline; }

/* ── Badge ── */
.cpqt-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  background: var(--primary-soft);
  color: var(--primary);
}
.cpqt-badge-red    { background: #fff0f1; color: var(--red); }
.cpqt-badge-green  { background: #f0fdf4; color: var(--green); }
.cpqt-badge-orange { background: #fff7ed; color: var(--orange); }

/* ── Stars ── */
.cpqt-stars { color: var(--yellow); font-size: 14px; letter-spacing: .05em; }

/* ── Avatar / Initials ── */
.cpqt-avatar {
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
  flex-shrink: 0;
  overflow: hidden;
}
.cpqt-avatar img { width: 100%; height: 100%; object-fit: cover; }

/* Thumbnail initials fallback */
.cpqt-thumb-initials {
  width: 100%;
  aspect-ratio: 4/3;
  display: grid;
  place-items: center;
  font-size: 48px;
  font-weight: 700;
  color: var(--primary);
  background: linear-gradient(135deg, var(--primary-soft), #d7e7ff);
}

/* ── Post listing grid ── */
.cpqt-listing {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
}
.cpqt-post-card { display: flex; flex-direction: column; }
.cpqt-card-thumb {
  aspect-ratio: 4/3;
  overflow: hidden;
  position: relative;
  background: var(--primary-soft);
}
.cpqt-card-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.cpqt-post-card:hover .cpqt-card-thumb img { transform: scale(1.06); }
.cpqt-card-badge { position: absolute; top: 10px; left: 10px; }
.cpqt-card-body  { flex: 1; display: flex; flex-direction: column; }
.cpqt-card-meta  {
  display: flex; align-items: center; gap: 8px;
  flex-wrap: wrap; font-size: 12px; color: var(--muted); margin-bottom: 8px;
}
.cpqt-card-body h2,
.cpqt-card-body h3 {
  font-size: 15px; font-weight: 600; line-height: 1.4; margin-bottom: 8px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cpqt-card-excerpt {
  font-size: 13px; color: var(--muted); line-height: 1.6; flex: 1; margin-bottom: 12px;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.cpqt-card-footer {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding-top: 12px; border-top: 1px solid var(--line); flex-wrap: wrap;
}
.cpqt-card-price  { font-size: 15px; font-weight: 700; color: var(--primary); }
.cpqt-card-time   { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 4px; }

/* ── Content section (single page sections) ── */
.cpqt-content-section {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  margin-bottom: 20px;
}
.cpqt-content-section h2 {
  font-size: 16px; font-weight: 700; color: #112b57;
  margin-bottom: 14px; padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 8px;
}
.cpqt-entry-content {
  font-size: 15px; line-height: 1.85; color: #2c3e50;
}
.cpqt-entry-content p  { margin-bottom: 1em; }
.cpqt-entry-content ul,
.cpqt-entry-content ol { padding-left: 20px; margin-bottom: 1em; }
.cpqt-entry-content ul { list-style: disc; }
.cpqt-entry-content ol { list-style: decimal; }
.cpqt-entry-content h2,
.cpqt-entry-content h3 { margin: 1.5em 0 .75em; }
.cpqt-entry-content img { border-radius: 8px; max-width: 100%; }
.cpqt-entry-content a   { color: var(--primary); }
.cpqt-entry-content a:hover { text-decoration: underline; }
.cpqt-entry-content blockquote {
  border-left: 4px solid var(--primary);
  padding: 12px 16px;
  background: var(--primary-soft);
  border-radius: 0 8px 8px 0;
  margin: 1em 0;
  font-style: italic;
}

/* ── Single layout ── */
.cpqt-single-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 28px;
  align-items: start;
}
.cpqt-single-sidebar { position: sticky; top: calc(var(--header-h) + var(--topbar-h) + 16px); }
.cpqt-single-header h1 { font-size: 26px; line-height: 1.25; color: #0d2a5e; margin-bottom: 12px; }
.cpqt-single-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  font-size: 13px; color: var(--muted);
}

/* ── Archive layout ── */
.cpqt-archive-layout {
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  gap: 24px;
  align-items: start;
}
.cpqt-sidebar { position: sticky; top: calc(var(--header-h) + var(--topbar-h) + 16px); }

/* ── Filter sidebar ── */
.cpqt-filter-box {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 14px;
}
.cpqt-filter-box h4 {
  font-size: 12px; font-weight: 700; color: var(--muted);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 10px;
}
.cpqt-filter-list { display: flex; flex-direction: column; gap: 2px; }
.cpqt-filter-item {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; cursor: pointer;
  padding: 7px 10px; border-radius: 8px;
  transition: background .15s;
}
.cpqt-filter-item:hover, .cpqt-filter-item.active { background: var(--primary-soft); color: var(--primary); }
.cpqt-filter-item .count {
  margin-left: auto; font-size: 11px; color: var(--muted);
  background: var(--surface); padding: 1px 7px; border-radius: 999px;
}
.cpqt-filter-toggle {
  display: none; align-items: center; gap: 8px;
  padding: 10px 16px; background: #fff;
  border: 1px solid var(--line); border-radius: 10px;
  font-weight: 600; cursor: pointer; font-size: 14px;
  margin-bottom: 16px; width: 100%;
}

/* ── Widget ── */
.cpqt-widget {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px;
  margin-bottom: 16px;
}
.cpqt-widget h4,
.cpqt-widget-title {
  font-size: 13px; font-weight: 700; color: #112b57;
  text-transform: uppercase; letter-spacing: .05em;
  margin-bottom: 12px; padding-bottom: 10px;
  border-bottom: 2px solid var(--primary);
}

/* ── Contact sidebar (dark) ── */
.cpqt-contact-sidebar {
  background: linear-gradient(135deg, var(--navy), var(--primary));
  color: #fff;
  border-radius: var(--radius);
  padding: 20px;
  margin-bottom: 16px;
}
.cpqt-contact-sidebar h4,
.cpqt-contact-sidebar .cpqt-widget-title { color: #fff; border-bottom-color: rgba(255,255,255,.25); }
.cpqt-contact-row {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 13px; margin-bottom: 10px; color: #fff;
}
.cpqt-contact-row svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 2; fill: none; flex-shrink: 0; margin-top: 2px; opacity: .8; }
.cpqt-contact-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }

/* ── Search bar ── */
.cpqt-search-wrap { position: relative; }
.cpqt-search-bar {
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1.5px solid var(--line);
  border-radius: 10px; padding: 0 14px;
  transition: border-color .2s, box-shadow .2s;
}
.cpqt-search-bar:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(11,99,223,.1); }
.cpqt-search-bar input { flex: 1; border: none; outline: none; background: transparent; height: 44px; font-size: 14px; }
.cpqt-search-bar svg { color: var(--muted); flex-shrink: 0; }
.cpqt-search-bar button { background: none; border: none; cursor: pointer; color: var(--primary); display: grid; place-items: center; }
.cpqt-search-results {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.1); z-index: 200;
  max-height: 320px; overflow-y: auto; display: none;
}
.cpqt-sr-item { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--line); font-size: 13px; }
.cpqt-sr-item:hover { background: var(--primary-soft); }
.cpqt-sr-type { font-size: 11px; background: var(--line); padding: 2px 7px; border-radius: 999px; font-weight: 600; white-space: nowrap; }
.cpqt-sr-empty { padding: 14px; font-size: 13px; color: var(--muted); text-align: center; }

/* ── FAQ accordion ── */
.cpqt-faq-item { border: 1px solid var(--line); border-radius: 10px; margin-bottom: 8px; overflow: hidden; }
.cpqt-faq-q {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; cursor: pointer; font-weight: 600; font-size: 14px;
  background: #fff; gap: 12px; transition: background .15s;
}
.cpqt-faq-q:hover { background: var(--primary-soft); }
.cpqt-faq-q.is-open { color: var(--primary); background: var(--primary-soft); }
.cpqt-faq-q svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 2; fill: none; flex-shrink: 0; transition: transform .25s; }
.cpqt-faq-q.is-open svg { transform: rotate(180deg); }
.cpqt-faq-a { display: none; padding: 0 16px 14px; font-size: 13px; color: var(--muted); line-height: 1.7; }

/* ── Route card ── */
.cpqt-route-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px; display: flex; flex-direction: column; gap: 10px;
  box-shadow: var(--shadow); transition: box-shadow .2s, transform .2s;
}
.cpqt-route-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.cpqt-route-head  { display: flex; align-items: center; justify-content: space-between; font-weight: 700; font-size: 15px; }
.cpqt-route-flag  { font-size: 28px; }
.cpqt-route-price { font-size: 18px; font-weight: 700; color: var(--primary); }
.cpqt-route-time  { font-size: 12px; color: var(--muted); }

/* ── Carrier row ── */
.cpqt-carrier-row { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.cpqt-carrier-row:last-child { border-bottom: none; }
.cpqt-carrier-stats { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: var(--muted); margin-top: 4px; }

/* ── Testimonial ── */
.cpqt-testi-card { padding: 20px; }
.cpqt-testi-content { font-size: 14px; color: #3f5068; line-height: 1.75; font-style: italic; margin: 12px 0 16px; }
.cpqt-testi-author { display: flex; align-items: center; gap: 12px; }
.cpqt-testi-author strong { display: block; font-size: 14px; font-weight: 600; }
.cpqt-testi-author small  { font-size: 12px; color: var(--muted); }

/* ── Team card ── */
.cpqt-team-card .cpqt-team-photo {
  width: 100%; height: 200px; overflow: hidden;
  background: var(--primary-soft); display: grid; place-items: center;
  font-size: 64px; font-weight: 700; color: var(--primary);
}
.cpqt-team-card .cpqt-team-photo img { width: 100%; height: 200px; object-fit: cover; }
.cpqt-team-card .cpqt-card-body { text-align: center; }
.cpqt-team-card h3 { font-size: 15px; font-weight: 700; margin-bottom: 4px; }
.cpqt-team-card .cpqt-position { color: var(--primary); font-size: 13px; font-weight: 600; margin-bottom: 8px; }
.cpqt-team-social { display: flex; justify-content: center; gap: 8px; margin-top: 10px; }
.cpqt-team-social a {
  width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%;
  display: grid; place-items: center; font-size: 13px; transition: all .2s;
}
.cpqt-team-social a:hover { background: var(--primary); color: #fff; border-color: var(--primary); }

/* ── Price table ── */
.cpqt-price-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.cpqt-price-table th { background: var(--primary); color: #fff; padding: 10px 14px; text-align: left; font-weight: 600; }
.cpqt-price-table td { padding: 10px 14px; border-bottom: 1px solid var(--line); }
.cpqt-price-table tr:last-child td { border-bottom: none; }
.cpqt-price-table tr:nth-child(even) td { background: var(--surface); }
.cpqt-price-cell { font-weight: 700; color: var(--primary); }

/* ── Gallery ── */
.cpqt-gallery-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.cpqt-gallery-grid img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 8px; cursor: pointer; transition: transform .2s; }
.cpqt-gallery-grid img:hover { transform: scale(1.03); }

/* ── Video ── */
.cpqt-video-wrap { position: relative; padding-bottom: 56.25%; border-radius: 10px; overflow: hidden; background: #000; }
.cpqt-video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: none; }

/* ── Stats strip ── */
.cpqt-stats-strip { background: linear-gradient(135deg, var(--navy), var(--primary)); color: #fff; padding: 36px 0; }
.cpqt-stats-inner { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.cpqt-stat { display: flex; align-items: center; gap: 16px; }
.cpqt-stat-icon { width: 52px; height: 52px; border-radius: 14px; background: rgba(255,255,255,.15); display: grid; place-items: center; font-size: 24px; flex-shrink: 0; }
.cpqt-stat strong { display: block; font-size: 22px; font-weight: 700; }
.cpqt-stat small  { font-size: 13px; opacity: .85; }

/* ── Process steps ── */
.cpqt-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; position: relative; }
.cpqt-steps::before {
  content: ''; position: absolute; top: 28px; left: 10%; right: 10%;
  height: 2px; background: linear-gradient(90deg, var(--primary), var(--primary-dark)); z-index: 0;
}
.cpqt-step { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; position: relative; z-index: 1; }
.cpqt-step-num { width: 56px; height: 56px; border-radius: 50%; background: var(--primary); color: #fff; display: grid; place-items: center; font-size: 20px; font-weight: 700; box-shadow: 0 4px 14px rgba(11,99,223,.35); }
.cpqt-step h4 { font-size: 13px; font-weight: 600; }
.cpqt-step p  { font-size: 12px; color: var(--muted); }

/* ── Related grid ── */
.cpqt-related { margin-top: 28px; }
.cpqt-related-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }

/* ── News item compact ── */
.cpqt-news-item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); align-items: flex-start; }
.cpqt-news-item:last-child { border-bottom: none; }
.cpqt-news-item img { width: 80px; height: 60px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.cpqt-news-item h4 { font-size: 13px; font-weight: 600; line-height: 1.4; margin-bottom: 4px; }
.cpqt-news-item small { font-size: 12px; color: var(--muted); }

/* ── Tracking bar ── */
.cpqt-tracking { background: var(--primary); color: #fff; padding: 22px 0; }
.cpqt-tracking-inner { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.cpqt-tracking h3 { font-size: 17px; font-weight: 700; white-space: nowrap; }
.cpqt-tracking-form { display: flex; gap: 10px; flex: 1; min-width: 280px; }
.cpqt-tracking-form input {
  flex: 1; padding: 11px 16px; border: none; border-radius: 8px;
  font-size: 14px; background: rgba(255,255,255,.15); color: #fff; outline: none;
}
.cpqt-tracking-form input::placeholder { color: rgba(255,255,255,.6); }
.cpqt-tracking-form input:focus { background: rgba(255,255,255,.25); }
.cpqt-tracking-form button { background: #fff; color: var(--primary); font-weight: 700; border: none; padding: 11px 20px; border-radius: 8px; cursor: pointer; transition: opacity .2s; }
.cpqt-tracking-form button:hover { opacity: .9; }

/* ── Hero ── */
.cpqt-hero {
  background:
    linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.88) 42%,rgba(255,255,255,.18) 70%,transparent 100%),
    var(--hero-bg, url('')) center/cover no-repeat;
  border-bottom: 1px solid var(--line);
}
.cpqt-hero-inner { min-height: 420px; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; padding: 52px 0; }
.cpqt-hero h1 { font-size: 38px; line-height: 1.15; font-weight: 700; color: #0d2a5e; margin-bottom: 16px; letter-spacing: -.02em; }
.cpqt-hero h1 span { color: var(--primary); }
.cpqt-hero p   { font-size: 16px; color: #3f5068; line-height: 1.7; margin-bottom: 24px; max-width: 540px; }
.cpqt-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.cpqt-trust-badges { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 20px; }
.cpqt-trust-badges span { font-size: 13px; color: var(--muted); display: flex; align-items: center; gap: 5px; }

/* ── Form fields ── */
.cpqt-form-field { display: flex; flex-direction: column; gap: 6px; }
.cpqt-form-field label { font-size: 13px; font-weight: 600; color: #40506a; }
.cpqt-form-field input,
.cpqt-form-field select,
.cpqt-form-field textarea {
  padding: 10px 14px; border: 1.5px solid var(--line); border-radius: 8px;
  background: #fff; font-size: 14px; transition: border-color .2s, box-shadow .2s; outline: none;
}
.cpqt-form-field input:focus,
.cpqt-form-field select:focus,
.cpqt-form-field textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(11,99,223,.1); }
.cpqt-form-field textarea { resize: vertical; min-height: 100px; }
.cpqt-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cpqt-contact-form { display: grid; gap: 14px; }

/* ── Price calculator ── */
.cpqt-calc { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; }
.cpqt-calc h3 { font-size: 15px; font-weight: 700; margin-bottom: 14px; }
.cpqt-calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cpqt-calc-result { background: var(--primary-soft); border: 1px solid #d7e7ff; border-radius: 10px; padding: 16px; margin-top: 14px; text-align: center; }
.cpqt-calc-result .cpqt-amount { font-size: 28px; font-weight: 700; color: var(--primary); }

/* ── Breadcrumb ── */
.cpqt-breadcrumb { padding: 12px 0; font-size: 13px; color: var(--muted); }
.cpqt-breadcrumb a { color: var(--primary); }
.cpqt-breadcrumb a:hover { text-decoration: underline; }
.cpqt-breadcrumb span { margin: 0 5px; }

/* ── Pagination ── */
.cpqt-pagination { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 28px 0; flex-wrap: wrap; }
.cpqt-pagination ul { display: flex; gap: 6px; flex-wrap: wrap; list-style: none; }
.cpqt-pagination li a,
.cpqt-pagination li span {
  display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 8px;
  border-radius: 8px; border: 1px solid var(--line); font-size: 14px; font-weight: 500; transition: all .2s;
}
.cpqt-pagination li a:hover  { border-color: var(--primary); color: var(--primary); }
.cpqt-pagination li.current span { background: var(--primary); color: #fff; border-color: var(--primary); }

/* ────────────────────────────────────────
   HEADER
──────────────────────────────────────── */
.cpqt-site-header { z-index: 500; background: #fff; }

/* Topbar */
.cpqt-topbar { background: var(--primary); color: #fff; font-size: 13px; padding: 0; min-height: var(--topbar-h); }
.cpqt-topbar-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px; height: var(--topbar-h); }
.cpqt-topbar-left, .cpqt-topbar-right { display: flex; align-items: center; gap: 16px; }
.cpqt-topbar-item { display: flex; align-items: center; gap: 5px; color: #fff; font-size: 12px; }
.cpqt-topbar-item svg { width: 13px; height: 13px; stroke: currentColor; stroke-width: 2; fill: none; flex-shrink: 0; }
.cpqt-topbar-item:hover { opacity: .85; }
.cpqt-topbar-hours { opacity: .85; }

/* Main header */
.cpqt-header-main { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 2px 8px rgba(0,0,0,.04); }
.cpqt-header-inner { display: flex; align-items: center; gap: 20px; height: var(--header-h); }

/* Logo */
.cpqt-logo-wrap { flex-shrink: 0; }
.cpqt-logo-text { display: flex; align-items: center; gap: 10px; color: var(--text); }
.cpqt-logo-icon { width: 40px; height: 40px; background: var(--primary); border-radius: 10px; display: grid; place-items: center; color: #fff; font-size: 20px; flex-shrink: 0; }
.cpqt-logo-text strong { display: block; font-size: 17px; font-weight: 700; color: #0d2a5e; line-height: 1.15; }
.cpqt-logo-text small  { display: block; font-size: 11px; color: var(--muted); line-height: 1; }
.cpqt-logo-text img    { height: 48px; width: auto; }

/* Desktop nav */
.cpqt-primary-nav { flex: 1; display: flex; justify-content: center; }
.cpqt-nav-list    { display: flex; gap: 4px; list-style: none; }
.cpqt-nav-list > li { position: relative; }
.cpqt-nav-list > li > a {
  display: flex; align-items: center; gap: 4px;
  padding: 8px 12px; font-size: 14px; font-weight: 500;
  border-radius: 8px; transition: background .15s, color .15s;
  white-space: nowrap;
}
.cpqt-nav-list > li > a:hover,
.cpqt-nav-list > li.current-menu-item > a,
.cpqt-nav-list > li.current-menu-ancestor > a { background: var(--primary-soft); color: var(--primary); }
.cpqt-nav-chevron { display: flex; align-items: center; }
.cpqt-nav-chevron svg { transition: transform .2s; }

/* Dropdown level 2 */
.cpqt-nav-list .sub-menu {
  display: none; position: absolute; top: calc(100% + 6px); left: 0;
  min-width: 220px; background: #fff;
  border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 8px 28px rgba(0,0,0,.1); padding: 6px 0; z-index: 300;
}
.cpqt-nav-list li:hover > .sub-menu { display: block; }
.cpqt-nav-list .sub-menu li { position: relative; }
.cpqt-nav-list .sub-menu a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 9px 16px; font-size: 14px; color: var(--text); transition: background .15s;
}
.cpqt-nav-list .sub-menu a:hover { background: var(--primary-soft); color: var(--primary); }

/* Dropdown level 3 — opens to the right, NOT overlapping level 1 */
.cpqt-nav-list .sub-menu .sub-menu {
  top: 0;
  left: 100%;
  border-radius: 12px;
}
/* Prevent level-3 going off-screen right → flip to left */
.cpqt-nav-list li:last-child .sub-menu .sub-menu,
.cpqt-nav-list li:nth-last-child(-n+2) .sub-menu .sub-menu { left: auto; right: 100%; }

/* Header actions */
.cpqt-header-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

/* Hamburger toggle */
.cpqt-menu-toggle {
  display: none;
  flex-direction: column; justify-content: center; align-items: center;
  gap: 5px; width: 40px; height: 40px;
  background: none; border: 1px solid var(--line); border-radius: 8px; cursor: pointer;
}
.cpqt-menu-toggle span { display: block; width: 20px; height: 2px; background: var(--text); border-radius: 2px; transition: all .25s; }
.cpqt-menu-toggle.is-active span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.cpqt-menu-toggle.is-active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.cpqt-menu-toggle.is-active span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* Mobile overlay */
.cpqt-mobile-overlay {
  display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 600;
  opacity: 0; transition: opacity .3s;
}
.cpqt-mobile-overlay.is-open { display: block; opacity: 1; }

/* Mobile drawer */
.cpqt-mobile-drawer {
  position: fixed; top: 0; left: 0; bottom: 0;
  width: 300px; max-width: 88vw;
  background: #fff; z-index: 700;
  transform: translateX(-100%); transition: transform .3s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column; overflow-y: auto;
}
.cpqt-mobile-drawer.is-open { transform: translateX(0); }
.cpqt-drawer-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--line);
  font-size: 16px; font-weight: 700;
}
.cpqt-drawer-close { background: none; border: none; font-size: 20px; cursor: pointer; color: var(--muted); }
.cpqt-drawer-body  { flex: 1; padding: 8px 0; overflow-y: auto; }
.cpqt-drawer-footer { padding: 16px 20px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 8px; }

/* Mobile nav list */
.cpqt-mobile-nav-list, .cpqt-mobile-nav-list ul { list-style: none; }
.cpqt-mobile-item-row { display: flex; align-items: center; }
.cpqt-mobile-item-row a { flex: 1; display: block; padding: 12px 20px; font-size: 15px; font-weight: 500; color: var(--text); border-bottom: 1px solid #f5f5f5; }
.cpqt-mobile-item.is-active > .cpqt-mobile-item-row > a { color: var(--primary); font-weight: 600; }
.cpqt-mobile-toggle { background: none; border: none; padding: 12px 16px 12px 0; cursor: pointer; border-bottom: 1px solid #f5f5f5; }
.cpqt-mobile-submenu { background: var(--surface); }
.cpqt-mobile-submenu .cpqt-mobile-item-row a { padding-left: 36px; font-size: 14px; font-weight: 400; }

/* ────────────────────────────────────────
   FOOTER
──────────────────────────────────────── */
.cpqt-site-footer { background: #0d1e3d; color: #a8b9d0; padding: 52px 0 0; margin-top: 52px; }
.cpqt-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr;
  gap: 36px;
  padding-bottom: 36px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.cpqt-footer-heading { font-size: 13px; font-weight: 700; color: #fff; margin-bottom: 14px; text-transform: uppercase; letter-spacing: .05em; }
.cpqt-footer-desc { font-size: 13px; line-height: 1.7; margin: 10px 0 14px; }
.cpqt-footer-contact-row { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; color: #a8b9d0; margin-bottom: 8px; }
.cpqt-footer-contact-row svg { width: 15px; height: 15px; stroke: currentColor; stroke-width: 2; fill: none; flex-shrink: 0; margin-top: 2px; opacity: .7; }
.cpqt-footer-contact-row a, .cpqt-footer-contact-row span { color: #a8b9d0; }
.cpqt-footer-contact-row a:hover { color: #fff; }
.cpqt-footer-menu { display: flex; flex-direction: column; gap: 8px; }
.cpqt-footer-menu li a { font-size: 13px; color: #a8b9d0; transition: color .2s; }
.cpqt-footer-menu li a:hover { color: #fff; }
.cpqt-footer-socials { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.cpqt-social-icon {
  width: 36px; height: 36px;
  border: 1px solid rgba(255,255,255,.15); border-radius: 8px;
  display: grid; place-items: center; color: #a8b9d0; transition: all .2s;
}
.cpqt-social-icon:hover { background: var(--primary); border-color: var(--primary); color: #fff; }
.cpqt-logo-icon-sm { font-size: 20px; }
.cpqt-footer-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.cpqt-footer-logo strong { font-size: 16px; font-weight: 700; color: #fff; }
.cpqt-footer-logo img { height: 40px; }

/* Footer tracking */
.cpqt-footer-track { display: flex; flex-direction: column; gap: 8px; }
.cpqt-footer-track input { padding: 9px 12px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.08); border-radius: 8px; color: #fff; font-size: 13px; outline: none; }
.cpqt-footer-track input::placeholder { color: rgba(255,255,255,.45); }
.cpqt-footer-track input:focus { background: rgba(255,255,255,.15); }
.cpqt-footer-track button { padding: 9px 14px; background: var(--primary); color: #fff; border: none; border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 600; }

/* Footer newsletter */
.cpqt-footer-newsletter { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.cpqt-footer-newsletter input { padding: 9px 12px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.08); border-radius: 8px; color: #fff; font-size: 13px; outline: none; }
.cpqt-footer-newsletter button { padding: 9px; background: var(--primary); color: #fff; border: none; border-radius: 8px; cursor: pointer; font-weight: 600; font-size: 13px; }

/* Footer bottom */
.cpqt-footer-bottom { padding: 16px 0; border-top: 1px solid rgba(255,255,255,.06); }
.cpqt-footer-bottom-inner { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: #5f7590; flex-wrap: wrap; gap: 8px; }
.cpqt-footer-bottom a { color: #7a90a8; }
.cpqt-footer-bottom a:hover { color: #fff; }

/* ── Mobile bottom nav ── */
.cpqt-bottom-nav {
  display: none;
  position: fixed; bottom: 0; left: 0; right: 0;
  background: #fff; border-top: 1px solid var(--line);
  z-index: 400; padding: 6px 0 env(safe-area-inset-bottom,6px);
  box-shadow: 0 -4px 16px rgba(0,0,0,.07);
  grid-template-columns: repeat(4,1fr);
}
.cpqt-bnav-item {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 6px 4px; font-size: 11px; font-weight: 500; color: var(--muted); transition: color .2s;
}
.cpqt-bnav-item.is-active, .cpqt-bnav-item:hover { color: var(--primary); }
.cpqt-bnav-item svg { stroke-width: 1.8; }

/* ── Floating buttons ── */
.cpqt-floating-btns { position: fixed; bottom: 90px; right: 16px; display: flex; flex-direction: column; gap: 10px; z-index: 350; }
.cpqt-float-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px; border-radius: 999px;
  font-size: 13px; font-weight: 600; color: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.2); transition: transform .2s, box-shadow .2s;
}
.cpqt-float-btn:hover { transform: scale(1.05); box-shadow: 0 6px 20px rgba(0,0,0,.28); }
.cpqt-float-btn svg, .cpqt-float-btn span:first-child { width: 18px; height: 18px; }
.cpqt-float-phone { background: var(--green); }
.cpqt-float-zalo  { background: #0068ff; }
.cpqt-float-chat  { background: var(--primary); }
/* Hide label on mobile — show on desktop */
.cpqt-float-btn > span:last-child { display: none; }

/* ── WooCommerce overrides ── */
.woocommerce .products.columns-4 { display: grid !important; grid-template-columns: repeat(4,1fr) !important; gap: 18px !important; }
.woocommerce ul.products li.product { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; margin: 0 !important; padding: 0 !important; transition: box-shadow .2s, transform .2s; }
.woocommerce ul.products li.product:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.woocommerce ul.products li.product img { width: 100% !important; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 14px; font-weight: 600; padding: 10px 14px 4px; }
.woocommerce ul.products li.product .price { padding: 0 14px 8px; color: var(--primary); font-weight: 700; }
.woocommerce ul.products li.product .button { margin: 0 14px 14px; display: block; background: var(--primary); color: #fff; border-radius: 8px; padding: 9px; text-align: center; font-weight: 600; border: none; transition: background .2s; }
.woocommerce ul.products li.product .button:hover { background: var(--primary-dark); }
.woocommerce-breadcrumb { display: none !important; } /* use our breadcrumb */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--primary); }

/* ── Utility ── */
.cpqt-hide-mobile { display: inline-flex; }
.cpqt-show-mobile { display: none; }
.cpqt-empty { color: var(--muted); text-align: center; padding: 24px; }

/* ══════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════ */
@media (max-width: 1199px) {
  .cpqt-listing { grid-template-columns: repeat(3,1fr); }
  .cpqt-footer-grid { grid-template-columns: repeat(2,1fr); }
  .cpqt-stats-inner { grid-template-columns: repeat(2,1fr); }
  .cpqt-steps { grid-template-columns: repeat(3,1fr); }
  .woocommerce .products.columns-4 { grid-template-columns: repeat(3,1fr) !important; }
}

@media (max-width: 960px) {
  /* Header */
  .cpqt-primary-nav { display: none; }
  .cpqt-menu-toggle { display: flex; }
  .cpqt-hide-mobile { display: none; }
  .cpqt-show-mobile { display: inline-flex; }
  /* Archive layout */
  .cpqt-archive-layout { grid-template-columns: 1fr; }
  .cpqt-sidebar { display: none; position: static; }
  .cpqt-sidebar.is-open { display: block; }
  .cpqt-filter-toggle { display: flex; }
  /* Single layout */
  .cpqt-single-layout { grid-template-columns: 1fr; }
  /* Listing */
  .cpqt-listing { grid-template-columns: repeat(3,1fr); }
}

@media (max-width: 767px) {
  :root { --header-h: 56px; }
  .cpqt-listing { grid-template-columns: repeat(2,1fr); gap: 12px; }
  .cpqt-grid-2, .cpqt-grid-3, .cpqt-grid-4 { grid-template-columns: repeat(2,1fr); }
  .cpqt-form-row { grid-template-columns: 1fr; }
  .cpqt-footer-grid { grid-template-columns: repeat(2,1fr); gap: 24px; }
  .cpqt-related-grid { grid-template-columns: 1fr; }
  .cpqt-stats-inner { grid-template-columns: repeat(2,1fr); gap: 14px; }
  .cpqt-steps { grid-template-columns: repeat(2,1fr); }
  .cpqt-steps::before { display: none; }
  .cpqt-hero-inner { grid-template-columns: 1fr; min-height: auto; padding: 32px 0; }
  .cpqt-hero h1 { font-size: 26px; }
  .cpqt-hero-art { display: none; }
  .cpqt-gallery-grid { grid-template-columns: repeat(2,1fr); }
  /* Show bottom nav */
  .cpqt-bottom-nav { display: grid; }
  body { padding-bottom: 60px; }
  .cpqt-floating-btns { bottom: 74px; }
  .woocommerce .products.columns-4 { grid-template-columns: repeat(2,1fr) !important; }
  /* Footer */
  .cpqt-tracking-inner { flex-direction: column; align-items: flex-start; }
  .cpqt-topbar-left { gap: 10px; flex-wrap: wrap; }
  .cpqt-topbar-hours { display: none; }
}

@media (max-width: 480px) {
  .cpqt-listing { grid-template-columns: repeat(2,1fr); gap: 10px; }
  .cpqt-grid-2, .cpqt-grid-3, .cpqt-grid-4 { grid-template-columns: 1fr; }
  .cpqt-footer-grid { grid-template-columns: 1fr; }
  .cpqt-hero h1 { font-size: 22px; }
  .cpqt-single-header h1 { font-size: 20px; }
  .cpqt-steps { grid-template-columns: 1fr 1fr; }
  /* float btn — icon only on mobile */
  .cpqt-float-btn > *:last-child { display: none; }
  .cpqt-float-btn { padding: 12px; border-radius: 50%; width: 48px; height: 48px; justify-content: center; }
}

/* Large float labels on desktop */
@media (min-width: 1024px) {
  .cpqt-float-btn > span:last-child { display: inline; }
}


/* === CPQT v1.0.3 homefix/layout guard === */
:root{--cpqt-container:1200px;--cpqt-font:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
html,body{max-width:100%;overflow-x:hidden}
body,.cpqt-wrap,.cpqt-container,.cpqt-card,.cpqt-btn,input,button,select,textarea{font-family:var(--cpqt-font)!important;font-weight:400}
strong,b,h1,h2,h3,h4,h5,h6,.cpqt-btn,.menu a,.cpqt-section-title{font-weight:600!important}
.cpqt-container{width:min(calc(100% - 32px),var(--cpqt-container));margin-left:auto;margin-right:auto;box-sizing:border-box}
.cpqt-section{padding:32px 0;margin:0}
.cpqt-section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.cpqt-section-title{font-size:24px;line-height:1.25;margin:0;color:#0f172a}
.cpqt-section-link{font-size:14px;color:var(--primary,#0b63df);text-decoration:none}
.cpqt-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 2px 12px rgba(15,23,42,.06);box-sizing:border-box;overflow:hidden}
.cpqt-listing,.cpqt-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.cpqt-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cpqt-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.cpqt-post-card,.cpqt-route-card,.cpqt-team-card,.cpqt-testi-card{min-width:0}
.cpqt-card-thumb,.cpqt-card-thumb img{width:100%;aspect-ratio:4/3;object-fit:cover}
.cpqt-card-body{padding:16px}
.cpqt-card-body h3{font-size:17px;line-height:1.35;margin:0 0 8px}
.cpqt-card-excerpt{color:#64748b;font-size:14px;line-height:1.6}
.cpqt-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;padding:11px 18px;text-decoration:none;border:1px solid transparent;white-space:nowrap}
.cpqt-btn-primary{background:var(--primary,#0b63df);color:#fff}
.cpqt-btn-outline{background:#fff;color:var(--primary,#0b63df);border-color:#dbeafe}
.cpqt-btn-full{width:100%}
.cpqt-hero{padding:44px 0;background:linear-gradient(135deg,#f8fbff,#eef5ff);position:relative}
.cpqt-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,440px);gap:32px;align-items:center}
.cpqt-hero-copy h1{font-size:42px;line-height:1.15;letter-spacing:-.03em;margin:0 0 16px}
.cpqt-hero-copy p{font-size:16px;color:#475569;line-height:1.7;margin:0 0 22px}
.cpqt-hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.cpqt-hero-art{min-width:0}
.cpqt-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.cpqt-step{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:18px;box-shadow:0 2px 10px rgba(15,23,42,.05)}
.cpqt-route-card{display:block;background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:18px;text-decoration:none;box-shadow:0 2px 10px rgba(15,23,42,.05)}
.cpqt-news-item{display:grid;grid-template-columns:90px 1fr;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #eef2f7}
.cpqt-news-item img{width:90px;height:64px;border-radius:10px;object-fit:cover}
.cpqt-faq-item{background:#fff;border:1px solid #e5e7eb;border-radius:12px;margin-bottom:10px;overflow:hidden}
.cpqt-faq-q{padding:14px 16px;font-weight:600;display:flex;justify-content:space-between;gap:12px}
.cpqt-faq-a{padding:0 16px 14px;color:#64748b}
.cpqt-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cpqt-form-field{margin-bottom:12px}
.cpqt-form-field input,.cpqt-form-field select,.cpqt-form-field textarea{width:100%;border:1px solid #dbe3ef;border-radius:10px;padding:11px 12px;box-sizing:border-box}
.cpqt-form-field textarea{min-height:110px}
.site-header,.cpqt-site-header{max-width:100%;overflow:visible}
.site-header .container,.cpqt-header-inner{width:min(calc(100% - 32px),1200px);margin:auto}
.main-navigation ul,.cpqt-menu{display:flex;gap:18px;align-items:center;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.main-navigation li,.cpqt-menu li{list-style:none}
.main-navigation a,.cpqt-menu a{text-decoration:none;color:inherit;font-weight:500!important}
@media(max-width:1024px){
  .cpqt-hero-inner,.cpqt-section .cpqt-container>div[style*="grid-template-columns:1fr 360px"],.cpqt-section .cpqt-container>div[style*="grid-template-columns:1fr 400px"],.cpqt-section .cpqt-container>div[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important}
  .cpqt-listing,.cpqt-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpqt-grid-3,.cpqt-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .cpqt-container{width:min(calc(100% - 24px),var(--cpqt-container))}
  .cpqt-hero-copy h1{font-size:30px}
  .cpqt-section-title{font-size:20px}
  .cpqt-listing,.cpqt-grid-4,.cpqt-grid-3,.cpqt-grid-2,.cpqt-steps,.cpqt-form-row{grid-template-columns:1fr!important}
  .cpqt-btn{width:100%;white-space:normal}
  .cpqt-section-head{align-items:flex-start;flex-direction:column}
  .cpqt-hero{padding:30px 0}
}