/* Autotire — component overrides not expressible via theme.json. */

/* ===================================================================== */
/* ===                    ACCESSIBILITY                               === */
/* ===================================================================== */

/* Skip-to-content link — visually hidden until focused. */
.at-skip-link {
  position: absolute;
  top: -999px;
  inset-inline-start: 0;
  z-index: 9999;
  background: var(--at-navy, #193348);
  color: #fff;
  padding: 0.75rem 1.5rem;
  font-weight: 700;
  border-radius: 0 0 var(--at-radius, 12px) 0;
  text-decoration: none;
  font-size: 1rem;
}
.at-skip-link:focus {
  top: 0;
  outline: 3px solid var(--at-primary, #1EBDE3);
  outline-offset: 2px;
}

:root {
  --at-radius: 12px;
  --at-shadow-card: 0 1px 0 #0f1e3c0a, 0 12px 32px -16px #0f1e3c2e;
  --at-shadow-soft: 0 1px 2px #0f1e3c0f, 0 8px 24px -12px #0f1e3c1f;
}

html, body {
  overflow-x: hidden;       /* never allow horizontal scroll bleed-through */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background: var(--wp--preset--color--background);
  color: var(--wp--preset--color--foreground);
}

/* Every direct section inside main goes truly edge-to-edge but never overflows. */
main > .at-hero,
main > section,
main > .wp-block-group {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* Common rail used by sections that want centered content with consistent gutters. */
.at-rail {
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 2.5rem);
  box-sizing: border-box;
}

/* Force RTL-correct logical defaults — site is Hebrew. */
[dir="rtl"] .wp-block-buttons,
[dir="rtl"] .wp-block-button {
  text-align: right;
}

/* Buttons rendered through the editor pick up the radius set in theme.json,
   but free-form .wp-element-button needs a manual hook. */
.wp-element-button,
.wp-block-button__link {
  border-radius: var(--at-radius);
  font-weight: 700;
  transition: background-color .15s ease, color .15s ease, transform .15s ease;
}

.wp-element-button:hover,
.wp-block-button__link:hover {
  transform: translateY(-1px);
}

/* Outline button variant — apply via `is-style-outline` */
.wp-block-button.is-style-outline > .wp-block-button__link {
  background: transparent;
  border: 2px solid currentColor;
  color: inherit;
}

/* ---------- Announcement bar ---------- */
.at-announcement {
  background: var(--wp--preset--color--navy);
  color: #fff;
  font-size: 0.875rem;
  padding: 0.5rem 1rem;
  text-align: center;
}
.at-announcement a { color: var(--wp--preset--color--primary-light); }
.at-announcement__chip {
  display: inline-block;
  background: var(--wp--preset--color--accent-yellow);
  color: var(--wp--preset--color--navy-dark);
  font-weight: 800;
  padding: 0.125rem 0.625rem;
  border-radius: 999px;
  margin-inline-start: 0.5rem;
  font-size: 0.75rem;
}

/* ---------- Header ---------- */
.at-header {
  background: var(--wp--preset--color--background);
  border-bottom: 1px solid var(--wp--preset--color--border);
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
  isolation: isolate; /* anchor full-width mega-menu dropdowns */
}
.at-header__row {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 0.875rem clamp(1rem, 3vw, 2.5rem);
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
  box-sizing: border-box;
}
/* Shortcode block between HTML chunks — don't break the flex row */
.at-header__row > .wp-block-shortcode {
  display: contents;
}
.at-logo img { display: block; max-height: 50px; width: auto; }

/* ── Primary nav (legacy mega-menu parity) ── */
.at-nav {
  display: flex;
  flex: 1 1 auto;
  justify-content: center;
  min-width: 0;
}
.at-nav__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.125rem 0.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.at-nav__item {
  margin: 0;
  padding: 0;
}
/* Mega items: dropdown spans full header width */
.at-nav__item--mega {
  position: static;
}
.at-nav__item--has-menu:not(.at-nav__item--mega) {
  position: relative;
}
/* h2/h3 in nav — reset browser defaults, keep visual nav styling */
.at-nav__group-heading,
.at-nav__panel-title {
  margin: 0;
  padding: 0;
  font: inherit;
  line-height: inherit;
}
.at-nav__group-heading {
  display: contents;
}
.at-nav__link,
.at-nav__trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none;
  color: var(--at-navy, #193348);
  font-weight: 600;
  font-size: 0.875rem;
  white-space: nowrap;
  background: transparent;
  border: 0;
  padding: 0.5rem 0.65rem;
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
  line-height: 1.3;
  transition: color 0.15s ease, background 0.15s ease;
}
.at-nav__link:hover,
.at-nav__trigger:hover,
.at-nav__item.is-current > .at-nav__link,
.at-nav__item.is-current > .at-nav__trigger {
  color: var(--at-primary-dark, #00A0D7);
  background: rgba(30, 189, 227, 0.08);
}
.at-nav__item--has-menu.at-nav__item--open > .at-nav__trigger {
  color: var(--at-primary-dark, #00A0D7);
  background: rgba(30, 189, 227, 0.1);
}
.at-nav__caret {
  display: inline-block;
  width: 0;
  height: 0;
  border-inline-start: 4px solid transparent;
  border-inline-end: 4px solid transparent;
  border-top: 5px solid currentColor;
  margin-top: 2px;
  opacity: 0.7;
  transition: transform 0.2s ease;
}
.at-nav__item--open > .at-nav__trigger .at-nav__caret,
.at-nav__item--has-menu.at-nav__item--open > .at-nav__trigger .at-nav__caret {
  transform: rotate(180deg);
}

/* ── Desktop mega-menu dropdown ── */
@media (min-width: 901px) {
  .at-nav__dropdown {
    display: block;
    visibility: hidden;
    position: absolute;
    top: 100%;
    inset-inline: 0;
    z-index: 300;
    padding: 0;
    pointer-events: none;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
  }
  .at-nav__item--has-menu:focus-within > .at-nav__dropdown,
  .at-nav__item--has-menu.at-nav__item--open > .at-nav__dropdown {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0);
    /* Overlap the header gap so the pointer path trigger → panel stays inside */
    margin-top: -16px;
    padding-top: 16px;
  }
  /* Visual-only spacer — does not intercept clicks on other nav items */
  .at-nav__dropdown::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: 8px;
    pointer-events: none;
  }
  .at-nav__dropdown--mega .at-nav__panel--grid .at-nav__columns {
    max-height: min(420px, 55vh);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--at-border) transparent;
  }
  .at-nav__dropdown--mega .at-nav__panel--grid .at-nav__columns--no-scroll {
    max-height: none;
    overflow: visible;
  }
}
.at-nav__dropdown-inner {
  width: min(var(--at-max-width, 1400px), calc(100vw - 2rem));
  margin-inline: auto;
  padding: 0 clamp(1rem, 3vw, 2.5rem) 1.25rem;
  box-sizing: border-box;
}
.at-nav__dropdown--mega .at-nav__dropdown-inner {
  background: linear-gradient(180deg, #fff 0%, #fafbfc 100%);
  border: 1px solid var(--at-border, #DFE6EB);
  border-top: 3px solid var(--at-primary, #1EBDE3);
  border-radius: 0 0 16px 16px;
  box-shadow: var(--at-shadow-soft, 0 8px 32px -8px rgba(15, 30, 60, 0.18));
  padding-top: 1.25rem;
  padding-bottom: 1.5rem;
}
.at-nav__item--has-menu:not(.at-nav__item--mega) .at-nav__dropdown-inner {
  width: auto;
  min-width: 220px;
  max-width: 320px;
  margin-inline: 0;
  inset-inline-end: 0;
  margin-inline-start: auto;
  background: #fff;
  border: 1px solid var(--at-border, #DFE6EB);
  border-radius: 12px;
  box-shadow: var(--at-shadow-soft);
  padding: 1rem 1.125rem;
}
/* Non-mega dropdowns align under their trigger (RTL: rightmost items) */
.at-nav__item--has-menu:not(.at-nav__item--mega) .at-nav__dropdown {
  inset-inline: auto;
  inset-inline-end: 0;
  width: max-content;
  max-width: min(320px, calc(100vw - 2rem));
}

.at-nav__dropdown--mega .at-nav__dropdown-inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}
.at-nav__dropdown--mega .at-nav__panel--grid {
  padding-bottom: 0.75rem;
}
.at-nav__dropdown--mega .at-nav__panel--links {
  border-top: 1px solid var(--at-border, #DFE6EB);
  padding-top: 1rem;
  margin-top: 0.25rem;
  background: rgba(239, 242, 245, 0.5);
  margin-inline: -1.25rem;
  padding-inline: 1.25rem;
  border-radius: 0 0 14px 14px;
}

.at-nav__panel-title {
  margin: 0 0 0.875rem;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--at-navy, #193348);
  line-height: 1.3;
}
.at-nav__panel--grid .at-nav__panel-title::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 1rem;
  background: var(--at-primary, #1EBDE3);
  border-radius: 2px;
  margin-inline-end: 0.5rem;
  vertical-align: -2px;
}

.at-nav__columns {
  display: grid;
  gap: 0.25rem 1.5rem;
}
.at-nav__columns--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.at-nav__columns--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.at-nav__columns--5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.25rem 1rem;
}
.at-nav__columns--no-scroll .at-nav__col a {
  padding-block: 0.35rem;
}
.at-nav__columns--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.at-nav__col,
.at-nav__panel-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.at-nav__col {
  border-inline-start: 1px solid var(--at-border, #DFE6EB);
  padding-inline-start: 1.25rem;
}
.at-nav__col:first-child {
  border-inline-start: 0;
  padding-inline-start: 0;
}
.at-nav__col--extra {
  background: rgba(239, 242, 245, 0.55);
  border-radius: 10px;
  padding: 0.75rem 1rem 0.875rem;
  margin-inline-start: 0.25rem;
  border-inline-start: 0;
}
.at-nav__col-title {
  list-style: none;
  margin: 0 0 0.5rem;
  padding: 0;
}
.at-nav__col-title span {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--at-navy, #193348);
  line-height: 1.35;
  padding-bottom: 0.375rem;
  border-bottom: 1px solid var(--at-border, #DFE6EB);
}
.at-nav__col--extra a {
  font-weight: 600;
}
.at-nav__col li,
.at-nav__panel-list li {
  margin: 0;
  padding: 0;
}
.at-nav__col a,
.at-nav__panel-list a {
  display: block;
  padding: 0.45rem 0.625rem;
  margin-inline: -0.625rem;
  text-decoration: none;
  color: var(--at-navy, #193348);
  font-size: 0.9375rem;
  line-height: 1.45;
  font-weight: 500;
  border-radius: 6px;
  transition: color 0.12s ease, background 0.12s ease;
}
.at-nav__col a:hover,
.at-nav__panel-list a:hover {
  color: var(--at-primary-dark, #00A0D7);
  background: rgba(30, 189, 227, 0.1);
}
.at-nav__col a[aria-current="page"],
.at-nav__panel-list a[aria-current="page"] {
  color: var(--at-primary-dark, #00A0D7);
  background: rgba(30, 189, 227, 0.12);
  font-weight: 600;
}

/* Compact inline chips for short link panels (e.g. "מידע נוסף" utilities) */
.at-nav__panel-list--inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.at-nav__panel-list--inline li {
  margin: 0;
}
.at-nav__panel-list--inline a {
  display: inline-block;
  margin: 0;
  padding: 0.55rem 1.125rem;
  background: #fff;
  border: 1px solid var(--at-border, #DFE6EB);
  border-radius: 999px;
  font-size: 0.9375rem;
  font-weight: 600;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(15, 30, 60, 0.04);
}
.at-nav__panel-list--inline a:hover {
  border-color: var(--at-primary, #1EBDE3);
  background: rgba(30, 189, 227, 0.08);
}

/* "מידע נוסף" — driver guides + brands side-by-side */
.at-nav__item--mega .at-nav__dropdown-inner:has(> .at-nav__panel--links:first-child + .at-nav__panel--links) {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  align-items: start;
}
.at-nav__item--mega .at-nav__dropdown-inner:has(> .at-nav__panel--links:first-child + .at-nav__panel--links) .at-nav__panel--links {
  background: transparent;
  border: 0;
  margin: 0;
  padding: 0;
  border-radius: 0;
}
.at-nav__item--mega .at-nav__dropdown-inner:has(> .at-nav__panel--links:first-child + .at-nav__panel--links) .at-nav__panel-list:not(.at-nav__panel-list--inline) {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.125rem 1rem;
}

/* Legacy alias */
.at-nav-link {
  text-decoration: none;
  color: var(--wp--preset--color--navy);
  font-weight: 600;
  font-size: 0.95rem;
  white-space: nowrap;
}
.at-nav-link:hover { color: var(--wp--preset--color--primary-dark); }

.at-header__actions {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  flex-shrink: 0;
}
@media (max-width: 1080px) {
  .at-header__search { display: none; }
}
@media (max-width: 900px) {
  /* Mobile header: logo + hamburger only (cart/phone hidden below). */
  .at-header__row {
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
  }

  .at-header__cart,
  .at-header__phone {
    display: none !important;
  }

  .at-header__actions {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 0;
    margin: 0;
    padding: 0;
  }

  .at-logo {
    flex: 0 1 auto;
    min-width: 0;
  }

  .at-logo img {
    max-height: 42px;
    width: auto;
  }
}
.at-header__search {
  position: relative;
  min-width: 220px;
}
.at-header__search input {
  width: 100%;
  background: var(--wp--preset--color--muted);
  border: 0;
  border-radius: 999px;
  padding: 0.5rem 2.5rem 0.5rem 0.875rem;
  font: inherit;
  color: var(--wp--preset--color--foreground);
}
.at-header__search::before {
  content: "⌕";
  position: absolute;
  inset-inline-end: 0.875rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--wp--preset--color--muted-foreground);
  font-size: 1.125rem;
  pointer-events: none;
}
.at-header__cart {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--wp--preset--color--muted);
  border-radius: 999px;
  padding: 0.375rem 0.875rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--navy);
  font-weight: 600;
  text-decoration: none;
}
.at-header__cart-icon {
  display: inline-grid;
  place-items: center;
  width: 22px; height: 22px;
  background: var(--wp--preset--color--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 0.875rem;
}
.at-header__phone {
  font-weight: 800;
  color: var(--wp--preset--color--navy);
  text-decoration: none;
  white-space: nowrap;
}
.at-logo {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  text-decoration: none;
  color: inherit;
}
.at-logo__mark {
  width: 40px; height: 40px;
  border-radius: var(--at-radius);
  background: var(--wp--preset--gradient--cyan);
  color: #fff;
  font-weight: 800;
  font-size: 1.25rem;
  display: grid; place-items: center;
}
.at-logo__name {
  font-weight: 800;
  font-size: 1.125rem;
  line-height: 1.1;
  color: var(--wp--preset--color--navy);
}
.at-logo__tagline {
  font-size: 0.75rem;
  color: var(--wp--preset--color--muted-foreground);
}

/* ---------- Hero (tire-photo bg with dark gradient overlay) ---------- */
.at-hero {
  color: #fff;
  /* Hero is intentionally TALL — value-props cards overlap upward into the
     bottom 70% of their height, so the hero must remain visually solid behind
     them. Top padding 3-5rem gives room above the search card; bottom padding
     includes a +9rem "overlap reserve" so the navy hero backdrop sits behind
     ~70% of each card. Cards lift -10rem from the section that follows (see
     .at-vp__grid margin-top below). */
  padding: clamp(3rem, 6vw, 5rem) clamp(1rem, 4vw, 3rem)
           calc(clamp(2rem, 4vw, 3rem) + 6.5rem);
  position: relative;
  overflow: visible;          /* so the cards can poke out the bottom */
  width: 100%;
  max-width: 100% !important;
  margin-inline: 0 !important;
  background-color: var(--wp--preset--color--navy-dark);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.at-hero__inner {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: right; /* RTL */
}
.at-hero__social-proof {
  background: rgba(255,255,255,0.96);
  border-radius: 14px;
  padding: 0.75rem 0.875rem;
  color: var(--wp--preset--color--navy, #0F1E3C);
  box-shadow: 0 16px 34px -18px rgba(0,0,0,0.35);
}
.at-hero__social-proof-title {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
  font-weight: 800;
  text-align: right;
}
.at-hero__social-proof {
  min-height: 305px;
}
.at-hero__social-proof .ti-widget-container {
  max-height: none;
  overflow: visible;
}
@media (min-width: 961px) {
  .at-hero__inner {
    max-width: 1320px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
  }
  .at-hero__social-proof {
    grid-column: 2;
    grid-row: 1;
  }
  .at-finder {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    margin: 0;
  }
}
@media (max-width: 960px) {
  .at-hero__social-proof {
    display: none;
  }
}
.at-hero__h1 {
  font-size: clamp(1.75rem, 3.8vw, 3rem);
  font-weight: 800;
  line-height: 1.15;
  color: #fff;
  margin: 0 0 0.75rem;
  letter-spacing: -0.01em;
  text-shadow: 0 2px 20px rgba(0,0,0,0.4);
  white-space: normal;
}
.at-hero__sub {
  font-size: clamp(0.95rem, 1.2vw, 1.125rem);
  line-height: 1.5;
  color: rgba(255,255,255,0.92);
  margin: 0 0 1.5rem;
  max-width: none;
  text-shadow: 0 1px 10px rgba(0,0,0,0.4);
}
@media (min-width: 720px) {
  .at-hero__h1, .at-hero__sub { white-space: nowrap; }
}
.at-hero h1 { color: #fff; }
.at-hero .at-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.875rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  color: var(--wp--preset--color--primary-light);
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1.25rem;
}
.at-hero__eyebrow .at-dot {
  width: 6px; height: 6px; border-radius: 999px;
  background: var(--wp--preset--color--accent-yellow);
  display: inline-block;
}
.at-hero .at-hero__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 2.5rem;
  border-top: 1px solid rgba(255,255,255,0.16);
  padding-top: 2rem;
}
.at-hero .at-stat__value {
  font-size: 2rem;
  font-weight: 800;
  color: var(--wp--preset--color--primary-light);
  line-height: 1.1;
}
.at-hero .at-stat__label {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.78);
  margin-top: 0.25rem;
}

/* Yellow primary CTA — used in hero + contact strip */
.at-btn-yellow {
  background: var(--wp--preset--color--accent-yellow) !important;
  color: var(--wp--preset--color--navy-dark) !important;
}
.at-btn-yellow:hover { filter: brightness(1.05); }

/* ---------- Cards ---------- */
.at-card {
  background: #fff;
  border-radius: var(--at-radius);
  box-shadow: var(--at-shadow-card);
  padding: 1.5rem;
}

/* Value-props row — overlaps the hero (50/50). */
.at-vp__grid {
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  position: relative;
  z-index: 5;
  margin-top: -9rem;              /* keep clear margin below stacked search boxes */
}
.at-vp__card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  grid-template-areas:
    "icon pre"
    "icon title"
    "body body"
    "more more";
  column-gap: 0.875rem;
  row-gap: 0.25rem;
  align-items: start;
  direction: ltr; /* keeps icon physically left and heading block right */
  text-align: right;
  box-shadow: 0 14px 40px -18px rgba(15,30,60,0.35);
}
.at-vp__card .at-icon-chip {
  grid-area: icon;
  align-self: center;
  justify-self: start;
  margin: 0;
  width: 52px;
  height: 52px;
  font-size: 1.65rem;
}
.at-vp__pre {
  grid-area: pre;
  align-self: end;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--wp--preset--color--primary-dark);
  margin: 0;
}
.at-vp__title {
  grid-area: title;
  font-size: 1.35rem;
  margin: 0 0 0.375rem;
  color: var(--wp--preset--color--navy);
}
.at-vp__body {
  grid-area: body;
  color: var(--wp--preset--color--muted-foreground);
  margin: 0 0 0.875rem;
  font-size: 1.03rem;
  line-height: 1.65;
}
.at-vp__more {
  grid-area: more;
  color: var(--wp--preset--color--primary-dark);
  font-weight: 700;
  font-size: 1rem;
  text-decoration: none;
}
@media (max-width: 980px) {
  /* 2-col tablet: cards are taller (more wrapping), keep ~70/30 with -7rem lift */
  .at-vp__grid { grid-template-columns: repeat(2, 1fr); margin-top: -6.5rem; }
}
@media (max-width: 600px) {
  /* 1-col mobile: each card stacks, full-width, mild overlap so the hero still
     "introduces" the first card without burying the rest */
  .at-vp__grid { grid-template-columns: 1fr; margin-top: -3rem; }
  .at-vp__card {
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 0.75rem;
  }
  .at-vp__card .at-icon-chip {
    width: 44px;
    height: 44px;
    font-size: 1.35rem;
  }
}

/* Icon chip used on value props, how-it-works, etc. */
.at-icon-chip {
  display: inline-grid;
  place-items: center;
  width: 48px; height: 48px;
  border-radius: 12px;
  background: color-mix(in oklab, var(--wp--preset--color--primary) 14%, #fff);
  color: var(--wp--preset--color--primary-dark);
  font-size: 1.5rem;
  margin-bottom: 1rem;
}
.at-icon-chip--yellow {
  background: color-mix(in oklab, var(--wp--preset--color--accent-yellow) 28%, #fff);
  color: #8a6500;
}
.at-icon-chip--navy {
  background: color-mix(in oklab, var(--wp--preset--color--navy) 12%, #fff);
  color: var(--wp--preset--color--navy);
}

/* ---------- Category tile (image on top) ---------- */
.at-cat-tile {
  background: #fff;
  border-radius: var(--at-radius);
  box-shadow: var(--at-shadow-card);
  overflow: hidden;
  display: block;
  text-decoration: none;
  color: inherit;
  transition: transform .15s ease, box-shadow .15s ease;
}
.at-cat-tile:hover { transform: translateY(-3px); box-shadow: 0 20px 40px -20px rgba(15,30,60,0.30); }
.at-cat-tile__media {
  aspect-ratio: 4 / 3;
  background: var(--wp--preset--color--muted);
  overflow: hidden;
}
.at-cat-tile__media img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.at-cat-tile__body { padding: 1rem 1.25rem 1.25rem; }
.at-cat-tile__title {
  font-weight: 700;
  font-size: 1.125rem;
  color: var(--wp--preset--color--navy);
  margin: 0;
}
.at-cat-tile__sub {
  color: var(--wp--preset--color--muted-foreground);
  font-size: 0.875rem;
  margin: 0.25rem 0 0;
}
.at-cat-tile__cta {
  margin-top: 0.625rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--primary-dark);
  font-weight: 600;
  display: inline-block;
}

/* ---------- How-it-works number bubble ---------- */
.at-step__num {
  display: inline-grid; place-items: center;
  width: 36px; height: 36px;
  border-radius: 12px;
  background: var(--wp--preset--color--navy);
  color: var(--wp--preset--color--accent-yellow);
  font-weight: 800;
  font-size: 0.875rem;
  margin-bottom: 0.75rem;
}

/* ---------- Testimonial cards ---------- */
.at-testimonial {
  background: #fff;
  border-radius: var(--at-radius);
  box-shadow: var(--at-shadow-card);
  padding: 1.5rem;
  position: relative;
}
.at-testimonial::before {
  content: "";
  position: absolute;
  top: 1.25rem; inset-inline-end: 1.25rem;
  width: 10px; height: 10px; border-radius: 999px;
  background: var(--wp--preset--color--primary);
}
.at-testimonial__quote {
  color: var(--wp--preset--color--foreground);
  line-height: 1.6;
  margin: 0 0 1.25rem;
}
.at-testimonial__author {
  display: flex; align-items: center; gap: 0.75rem;
}
.at-avatar {
  width: 36px; height: 36px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--wp--preset--color--primary) 20%, #fff);
  color: var(--wp--preset--color--primary-dark);
  display: grid; place-items: center;
  font-weight: 800;
}

/* ---------- Tire-finder (now embedded inside hero) ---------- */
/* Keep all three tab panels (plate / size / vehicle) the same height so the
   card doesn't jump in size as the user switches tabs. Tallest is the vehicle
   tab with 4 selects + a 30px-ish label row → ~120px. The plate tab's initial
   single-input state is shorter; min-height lifts it to match. The plate result
   panel still expands the card naturally when a vehicle is found. */
.at-finder [role="tabpanel"]:not([hidden]) {
  min-height: 120px;
}
.at-finder {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.875rem;
  position: relative;
  z-index: 5;
  color: var(--wp--preset--color--foreground);
  margin: 0;
}
.at-finder__card {
  background: #fff;
  border-radius: var(--at-radius);
  box-shadow: 0 20px 50px -20px rgba(0,0,0,0.45);
  padding: 1.25rem 1.5rem 1.5rem;
}
.at-finder__card--catalog {
  padding-bottom: 1rem;
}
@media (max-width: 960px) {
  .at-finder__card--catalog {
    margin-bottom: -0.35rem;
  }
}
.at-finder__card-title {
  margin: 0 0 0.75rem;
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy);
}

/* Desktop compact mode: reduce hero finder vertical footprint */
@media (min-width: 961px) {
  .at-finder {
    gap: 0.625rem;
  }
  .at-finder [role="tabpanel"]:not([hidden]) {
    min-height: 0;
  }
  .at-finder__card {
    padding: 0.875rem 1.125rem 1rem;
  }
  .at-finder__card-title {
    margin: 0 0 0.5rem;
    font-size: 1.05rem;
  }
  .at-finder__tabs {
    margin-bottom: 0.75rem;
  }
  .at-finder__tab {
    padding: 0.6rem 0.65rem;
    font-size: 0.97rem;
  }
  .at-finder__row {
    gap: 0.55rem;
  }
  .at-finder__row > .at-finder-steps {
    margin-bottom: 0.45rem;
  }
  .at-finder__row label {
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
  }
  .at-finder__row select,
  .at-finder__row input[type="text"],
  .at-finder__row input[type="search"],
  .at-finder__row input[type="number"] {
    height: 42px;
    padding: 0.5rem 0.7rem;
    font-size: 0.95rem;
  }
  .at-finder__row button {
    height: 44px;
    font-size: 0.95rem;
  }
  .at-finder__hint {
    margin-top: 0.4rem;
    font-size: 0.85rem;
  }
}
/* Plate-number search card: keep heading centered and hide redundant label
   on all breakpoints (desktop + mobile). */
.at-finder__card--plate .at-finder__card-title {
  text-align: center;
}
.at-finder__card--plate label[for="at-plate"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.at-finder__tabs {
  display: flex;
  gap: 0.625rem;
  border-bottom: 1px solid var(--wp--preset--color--border);
  margin-bottom: 1.25rem;
}
.at-finder__tab {
  flex: 1 1 0;
  background: transparent;
  border: 0;
  padding: 0.9rem 0.75rem;
  font-weight: 700;
  font-size: 1.05rem;
  text-align: center;
  color: var(--wp--preset--color--muted-foreground);
  cursor: pointer;
  position: relative;
  font-family: inherit;
}
.at-finder__tab[aria-selected="true"] {
  color: var(--wp--preset--color--navy);
}
.at-finder__tab[aria-selected="true"]::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: -1px;
  height: 3px;
  background: var(--wp--preset--color--primary);
  border-radius: 999px 999px 0 0;
}

/* Catalog finder (desktop + mobile): minimal style without step row or labels */
#at-tab-size .at-finder-steps,
#sf-tab-size .at-finder-steps {
  display: none !important;
  margin: 0 !important;
}
#at-tab-size .at-finder__row > div:not(:has(button[type="submit"])) > label,
#sf-tab-size .at-finder__row > div:not(:has(button[type="submit"])) > label,
#at-tab-vehicle .at-finder__row > div:not(:has(button[type="submit"])) > label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@media (max-width: 960px) {
  .at-finder {
    grid-template-columns: 1fr;
  }
}

/* Catalog finder (size + vehicle) — minimal mobile: no steps, no labels (placeholders only). */
@media (max-width: 720px) {
  #at-tab-size .at-finder-steps,
  #sf-tab-size .at-finder-steps {
    display: none !important;
    margin: 0 !important;
  }
  #at-tab-size .at-finder__row > div:not(:has(button[type="submit"])) > label,
  #sf-tab-size .at-finder__row > div:not(:has(button[type="submit"])) > label,
  #at-tab-vehicle .at-finder__row > div:not(:has(button[type="submit"])) > label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
  #at-tab-size[role="tabpanel"]:not([hidden]),
  #sf-tab-size[role="tabpanel"]:not([hidden]),
  #at-tab-vehicle[role="tabpanel"]:not([hidden]) {
    min-height: 0;
  }
  #at-tab-size .at-finder__row,
  #sf-tab-size .at-finder__row,
  #at-tab-vehicle .at-finder__row {
    gap: 0.5rem;
    margin-top: 0;
  }
  #at-tab-size .at-finder__row > div:not(:has(button[type="submit"])),
  #sf-tab-size .at-finder__row > div:not(:has(button[type="submit"])),
  #at-tab-vehicle .at-finder__row > div:not(:has(button[type="submit"])) {
    flex: 1 1 100%;
  }
  .at-finder__card--catalog {
    padding: 1rem 1rem 0.875rem;
  }
  .at-finder__card--catalog .at-finder__tabs {
    margin-bottom: 0.75rem;
  }
}
/* .at-finder__row layout is now defined in the "form row layout" section above. */
/* This rule block is kept as a marker so existing templates still compile. */
.at-finder__row .at-finder__span-4 { flex: 1 1 100%; }
.at-finder__row label {
  display: block;
  font-size: 1rem;
  color: var(--wp--preset--color--navy);
  font-weight: 600;
  margin-bottom: 0.375rem;
}
.at-finder__row select {
  width: 100%;
  background: var(--wp--preset--color--input);
  border: 0;
  border-radius: var(--at-radius);
  padding: 0.75rem 0.875rem;
  font: inherit;
  color: var(--wp--preset--color--foreground);
}
.at-finder__row input[type="text"],
.at-finder__row input[type="search"],
.at-finder__row input[type="number"] {
  width: 100%;
  background: var(--wp--preset--color--input);
  border: 0;
  border-radius: var(--at-radius);
  padding: 0.75rem 0.875rem;
  font-size: 1rem;
  font-family: inherit;
  height: 46px;
  box-sizing: border-box;
  color: var(--wp--preset--color--foreground);
}
.at-finder__row select {
  height: 46px;
  box-sizing: border-box;
  font-size: 1rem;
}
.at-finder__row button {
  background: var(--wp--preset--color--primary);
  color: #fff;
  border: 0;
  border-radius: var(--at-radius);
  padding: 0 1rem;
  width: 100%;
  min-width: 100%;
  font-size: 1rem;
  font-family: inherit;
  font-weight: 700;
  cursor: pointer;
  height: 50px;
  white-space: nowrap;
  box-sizing: border-box;
}
.at-finder__hint {
  margin-top: 0.75rem;
  font-size: 0.95rem;
  color: var(--wp--preset--color--muted-foreground);
}

/* License-plate tab */
.at-finder__plate-label {
  display: block;
  font-size: 0.875rem;
  color: var(--wp--preset--color--navy);
  font-weight: 600;
  margin-bottom: 0.5rem;
}
.at-finder__plate-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.75rem;
}
.at-finder__plate-row input {
  background: var(--wp--preset--color--input);
  border: 0;
  border-radius: var(--at-radius);
  padding: 0.875rem 1rem;
  font: inherit;
  font-size: 1rem;
  color: var(--wp--preset--color--foreground);
  text-align: center;
  letter-spacing: 0.05em;
}
.at-finder__plate-row button {
  border: 0;
  border-radius: var(--at-radius);
  padding: 0.875rem 1.5rem;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

/* ---------- Cascading finder: form row layout (Change 4 — single row) ---------- */

/*
 * Override the grid layout so all 4 dropdowns + submit sit in ONE flex row.
 * On mobile (< 640px) they wrap vertically.
 * Each step wrapper (.at-finder__step-wrap or the bare div) gets equal flex.
 * The submit button does NOT grow — it stays auto-width.
 */
.at-finder__row {
  display: flex !important;
  gap: 0.75rem;
  align-items: end;
  flex-wrap: wrap;          /* allow step-indicator to break to its own line */
}
.at-finder__row > div {
  flex: 1 1 0;
  min-width: 0;
}
/* Step indicator (injected as the form's first child) always takes a full row
   ABOVE the dropdowns, never sits beside them. */
.at-finder__row > .at-finder-steps {
  flex: 1 1 100%;
  margin-bottom: 0.75rem;
}
/* Submit-button column: only as wide as needed, never stretches. */
.at-finder__row > div:has(button[type="submit"]) {
  flex: 1 1 100%;
  align-self: end;
}
/* Hide the placeholder <label>&nbsp;</label> above the submit button — looks empty/ugly. */
.at-finder__row > div:has(button[type="submit"]) > label:empty,
.at-finder__row > div:has(button[type="submit"]) > label:has(+ button) {
  display: none;
}
@media (max-width: 640px) {
  .at-finder__row { flex-wrap: wrap; }
  .at-finder__row > div { flex: 1 1 100%; }
  .at-finder__row > div:has(button[type="submit"]) { flex: 1 1 100%; }
}
/* Span-4 on license-plate tab still works. */
.at-finder__row .at-finder__span-4 { flex: 1 1 100%; }

/* ---------- Progressive disclosure: locked / unlocked steps (Change 5) ---------- */

/*
 * All 4 dropdowns are ALWAYS visible (no progressive hide). Downstream
 * steps that aren't yet reachable just look disabled — same width, same
 * height, lower opacity, not interactive. Step indicator above the row
 * communicates "where you are" in the cascade.
 */
.at-finder__step--locked select {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: var(--wp--preset--color--muted, #f3f4f6);
}
.at-finder__step--unlocked select {
  opacity: 1;
}

/* ---------- Cascading finder: step indicator (Changes 3 + existing) ---------- */

/*
 * Structural:
 *   .at-finder-steps         — flex row, RTL, sits ABOVE the form row (full width)
 *   .at-finder-step          — one dot + label pair
 *   .at-finder-step__dot     — the numbered circle
 *   .at-finder-step__label   — text beneath the dot
 *   .at-finder-step__line    — connector between dots
 *
 * States (set by JS):
 *   --completed   user has made a choice here
 *   --active      the next choice to make (highlighted, pulsing)
 *   --pending     not yet reachable
 *
 * The step indicator is now the FIRST child of the <form>, making it
 * naturally appear above the flex row of selects (Change 3).
 */
.at-finder-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 1.25rem;
  width: 100%;               /* spans full form width */
  direction: rtl;            /* matches page RTL so step 1 is on the right */
}
.at-finder-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  flex-shrink: 0;
  position: relative;
}
.at-finder-step__dot {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  font-size: 0.85rem;
  font-weight: 700;
  background: var(--wp--preset--color--muted);
  color: var(--wp--preset--color--muted-foreground);
  border: 2px solid transparent;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.at-finder-step__label {
  /* Labels removed visually — the dropdown headings already say רוחב/חתך/קוטר/מותג.
     Kept in DOM for accessibility/screen-readers. */
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.at-finder-step__line {
  flex: 1 1 auto;
  min-width: 1.5rem;
  height: 2px;
  background: var(--wp--preset--color--border);
  margin-bottom: 1.1rem;   /* align vertically with the centres of the dots */
  transition: background 0.25s ease;
}
.at-finder-step__line--done {
  background: var(--wp--preset--color--primary);
}

/* Completed step */
.at-finder-step--completed .at-finder-step__dot {
  background: var(--wp--preset--color--primary);
  color: #fff;
  border-color: var(--wp--preset--color--primary);
}
.at-finder-step--completed .at-finder-step__label {
  color: var(--wp--preset--color--primary-dark);
}

/* Active step — calls attention with a ring + subtle pulse */
.at-finder-step--active .at-finder-step__dot {
  background: var(--wp--preset--color--navy);
  color: var(--wp--preset--color--accent-yellow);
  border-color: var(--wp--preset--color--accent-yellow);
  animation: at-step-pulse 1.8s ease-in-out infinite;
}
.at-finder-step--active .at-finder-step__label {
  color: var(--wp--preset--color--navy);
  font-weight: 700;
}
@keyframes at-step-pulse {
  0%, 100% { transform: scale(1);    box-shadow: 0 0 0 0   color-mix(in oklab, var(--wp--preset--color--primary) 50%, transparent); }
  50%       { transform: scale(1.1); box-shadow: 0 0 0 6px color-mix(in oklab, var(--wp--preset--color--primary) 0%, transparent); }
}

/* Disabled selects — subtle opacity so they're visually "locked" */
.at-finder__row select:disabled,
.at-side-finder__grid select:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Submit button disabled state */
.at-finder__row button:disabled,
.at-side-finder__cta:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* The next-in-line enabled select gets a subtle cyan ring to attract the eye */
.at-finder__row select:not(:disabled):focus,
.at-finder__row select:not(:disabled):focus-visible,
.at-side-finder__grid select:not(:disabled):focus,
.at-side-finder__grid select:not(:disabled):focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

/* First newly-enabled select (aspect after width picked) gets a brief highlight ring */
@keyframes at-field-arrive {
  0%   { box-shadow: 0 0 0 0px color-mix(in oklab, var(--wp--preset--color--primary) 60%, transparent); }
  60%  { box-shadow: 0 0 0 5px color-mix(in oklab, var(--wp--preset--color--primary) 20%, transparent); }
  100% { box-shadow: 0 0 0 0px color-mix(in oklab, var(--wp--preset--color--primary) 0%, transparent); }
}
.at-finder__row select:not(:disabled),
.at-side-finder__grid select:not(:disabled) {
  animation: at-field-arrive 0.55s ease forwards;
}

/* ---------- Product cards (WooCommerce loop tweaks) ---------- */
.woocommerce ul.products li.product,
.wc-block-grid__product {
  border-radius: var(--at-radius);
  box-shadow: var(--at-shadow-card);
  background: #fff;
  padding: 1rem;
  transition: transform .15s ease;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-2px);
}
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price {
  color: var(--wp--preset--color--navy);
  font-weight: 800;
}
.woocommerce ul.products li.product .price del {
  color: var(--wp--preset--color--muted-foreground);
  font-weight: 500;
}
.woocommerce span.onsale {
  background: var(--wp--preset--color--destructive);
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  padding: 0.25rem 0.625rem;
  min-width: auto;
}

/* ---------- Badges (custom .at-badge--{variant}) ---------- */
.at-badge {
  display: inline-block;
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
}
.at-badge--sale     { background: var(--wp--preset--color--destructive); color: #fff; }
.at-badge--popular  { background: var(--wp--preset--color--primary);     color: #fff; }
.at-badge--premium  { background: var(--wp--preset--color--navy);        color: #fff; }

/* ---------- SEO highlights (homepage) ---------- */
.at-seo__rail {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
}
.at-seo__intro { text-align: center; margin-bottom: 3rem; }
.at-seo__eyebrow {
  color: var(--wp--preset--color--primary-dark);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0;
}
.at-seo__h2 {
  color: var(--wp--preset--color--navy);
  font-size: clamp(1.5rem,2.5vw,2rem);
  margin: 0.5rem 0 0.5rem;
}
.at-seo__lead {
  color: var(--wp--preset--color--muted-foreground);
  font-size: 1rem;
  margin: 0;
}

.at-seo__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: center;
  padding: 1.75rem 0;
}
.at-seo__row + .at-seo__row { border-top: 1px solid var(--wp--preset--color--border); }
.at-seo__row--reverse .at-seo__media { order: 2; }
.at-seo__row--reverse .at-seo__text  { order: 1; }
.at-seo__media img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--at-radius);
  box-shadow: var(--at-shadow-card);
}
.at-seo__pre {
  color: var(--wp--preset--color--primary-dark);
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 0.25rem;
}
.at-seo__h3 {
  color: var(--wp--preset--color--navy);
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  margin: 0 0 0.75rem;
}
.at-seo__body {
  color: var(--wp--preset--color--foreground);
  line-height: 1.7;
  margin: 0;
}
/* Grid of compact text panels with topical icons. */
.at-seo__grid {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.at-seo__panel {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: var(--at-radius);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
}
.at-seo__panel--accent {
  background: linear-gradient(135deg, color-mix(in oklab, var(--wp--preset--color--primary) 8%, #fff), #fff);
  border-color: color-mix(in oklab, var(--wp--preset--color--primary) 28%, var(--wp--preset--color--border));
}
.at-seo__icon {
  width: 48px; height: 48px; border-radius: 12px;
  background: color-mix(in oklab, var(--wp--preset--color--primary) 14%, #fff);
  color: var(--wp--preset--color--primary-dark);
  display: grid; place-items: center;
  margin-bottom: 1rem;
}
.at-seo__panel--accent .at-seo__icon {
  background: color-mix(in oklab, var(--wp--preset--color--accent-yellow) 30%, #fff);
  color: #8a6500;
}
.at-seo__panel p { margin: 0 0 0.75rem; line-height: 1.65; color: var(--wp--preset--color--foreground); }
.at-seo__panel p:last-child { margin-bottom: 0; }
.at-seo__cta { margin-top: auto; padding-top: 1rem; }
.at-seo__more-btn {
  display: inline-block;
  padding: 0.75rem 1.25rem;
  border-radius: 12px;
  font-weight: 800;
  text-decoration: none;
}
@media (max-width: 980px) { .at-seo__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .at-seo__grid { grid-template-columns: 1fr; } }
@media (max-width: 780px) {
  .at-seo__row { grid-template-columns: 1fr; gap: 1.25rem; }
  .at-seo__row--reverse .at-seo__media,
  .at-seo__row--reverse .at-seo__text  { order: initial; }
}

/* ---------- Brand marquee ---------- */
.at-brands {
  background: linear-gradient(120deg, #091C2C 0%, #0E2E48 45%, #103C5A 100%);
  color: #fff;
  padding: clamp(3rem, 5vw, 4.5rem) clamp(1rem, 4vw, 2.5rem);
  position: relative;
  overflow: hidden;
  width: 100%;
}
.at-brands::before,
.at-brands::after {
  content: "";
  position: absolute;
  inset-inline: 0; height: 1px;
  background: linear-gradient(to inline-end, transparent, rgba(255,255,255,0.18), transparent);
}
.at-brands::before { top: 0; }
.at-brands::after  { bottom: 0; }

.at-brands__rail { width: 100%; max-width: 1400px; margin-inline: auto; text-align: center; }

.at-brands__pre {
  color: var(--wp--preset--color--accent-yellow);
  font-size: 0.875rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  margin: 0;
}
.at-brands__h2 { color: #fff; font-size: clamp(1.5rem, 2.6vw, 2rem); margin: 0.5rem 0 0.5rem; text-shadow: 0 2px 18px rgba(0,0,0,0.35); }
.at-brands__sub { color: rgba(255,255,255,0.75); margin: 0 0 2rem; font-size: 0.95rem; }

/* Marquee — pure CSS scrolling track. Fade-mask the edges so logos fade in/out.
   No `gap` on the track: every chip uses margin-inline-end so the strip's
   total width is exactly 2× the original set, making the 50% translate
   land precisely where the duplicate set starts (zero stutter). */
.at-brands__viewport {
  width: 100%;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
}
.at-brands__track {
  display: flex;
  width: max-content;
  animation: at-brands-scroll 48s linear infinite;
  /* The chip+margin sequence repeats identically twice in the markup,
     so translating by exactly -50% snaps to the duplicate boundary. */
}
.at-brands__viewport:hover .at-brands__track { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .at-brands__track { animation: none; flex-wrap: wrap; justify-content: center; width: 100%; }
  .at-brands__chip { margin-inline-end: 1rem; margin-bottom: 1rem; }
}
.at-brands__chip {
  background: #fff;
  border-radius: 14px;
  padding: 0;
  width: 200px;
  height: 110px;
  box-shadow: 0 6px 24px -10px rgba(0,0,0,0.45);
  display: grid; place-items: center;
  flex-shrink: 0;
  margin-inline-end: 1.5rem;             /* uniform spacing — see comment above */
  transition: transform .2s ease, box-shadow .2s ease;
}
.at-brands__chip:hover { transform: translateY(-3px); box-shadow: 0 14px 32px -10px rgba(0,0,0,0.6); }
.at-brands__chip img {
  display: block;
  max-width: 78%;          /* uniform breathing room around each logo */
  max-height: 60%;
  width: auto; height: auto;
  object-fit: contain;
}

@keyframes at-brands-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
/* No direction override — translateX(-50%) moves the strip leftward in pixel
   space regardless of `dir`, which is the natural "next logo enters from the
   trailing edge" motion for both LTR and RTL viewers. */

.at-brands__more {
  margin: 2rem 0 0;
}
.at-brands__cta {
  display: inline-block;
  padding: 0.75rem 1.25rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.22);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: 0.9375rem;
  transition: background .15s ease, transform .15s ease;
}
.at-brands__cta:hover { background: var(--wp--preset--color--accent-yellow); color: var(--wp--preset--color--navy-dark); border-color: transparent; transform: translateY(-1px); }

/* ---------- Contact CTA strip (inline lead form, no extra clicks) ---------- */
.at-cta__rail {
  width: 100%; max-width: 1200px; margin-inline: auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center;
}
.at-cta__copy { color: #fff; }
.at-cta__eyebrow {
  color: var(--wp--preset--color--primary-light);
  font-size: 0.875rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  margin: 0 0 0.5rem;
}
.at-cta__h2 { color: #fff; font-size: clamp(1.5rem, 2.8vw, 2.25rem); margin: 0 0 0.75rem; }
.at-cta__sub { color: rgba(255,255,255,0.85); font-size: 1.0625rem; margin: 0 0 1rem; line-height: 1.5; }
.at-cta__tel { color: rgba(255,255,255,0.85); margin: 0; }
.at-cta__tel a { color: var(--wp--preset--color--accent-yellow); text-decoration: none; font-size: 1.25rem; }

.at-cta__form {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 16px;
  padding: 1.25rem;
  backdrop-filter: blur(8px);
}
.at-cta__form .wpcf7-form-control-wrap { display: block; }
.at-cta__form .at-leadrow {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem;
}
.at-cta__form .at-leadrow > label:last-child { grid-column: 1 / -1; }
.at-cta__form label {
  display: block;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
}
.at-cta__form input[type="text"],
.at-cta__form input[type="email"],
.at-cta__form input[type="tel"] {
  width: 100%;
  background: rgba(255,255,255,0.95);
  color: var(--wp--preset--color--foreground);
  border: 0;
  border-radius: 10px;
  padding: 0.7rem 0.875rem;
  font: inherit;
  margin-top: 0.25rem;
  box-sizing: border-box;
}
.at-cta__form input[type="submit"],
.at-cta__form .wpcf7-submit {
  background: var(--wp--preset--color--accent-yellow);
  color: var(--wp--preset--color--navy-dark);
  border: 0; border-radius: 10px;
  padding: 0.9rem 1.5rem;
  font: inherit; font-weight: 800; cursor: pointer;
  margin-top: 0.75rem; width: 100%;
}
.at-cta__form .wpcf7-response-output {
  color: #fff; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.2);
  border-radius: 10px; padding: 0.75rem; margin-top: 0.75rem;
}
@media (max-width: 880px) {
  .at-cta__rail { grid-template-columns: 1fr; gap: 1.5rem; }
  .at-cta__form .at-leadrow { grid-template-columns: 1fr; }
}

/* ===================================================================== */
/* ===                  SHOP / PRODUCT ARCHIVE                       === */
/* ===================================================================== */

/* Category pills directly below the breadcrumb (mirror Lovable category bar). */
.at-shop__cats {
  background: #fff;
  border-bottom: 1px solid var(--wp--preset--color--border);
  padding: 0.625rem clamp(1rem, 4vw, 2.5rem);
}
.at-shop__cats-rail {
  display: flex; gap: 0.5rem; flex-wrap: wrap;
  width: 100%; max-width: 1400px; margin-inline: auto;
}
.at-shop__cat {
  display: inline-block;
  padding: 0.4rem 0.875rem;
  background: var(--wp--preset--color--muted);
  border-radius: 999px;
  font-size: 0.875rem; font-weight: 600;
  color: var(--wp--preset--color--navy);
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s, color .15s;
}
.at-shop__cat:hover { background: var(--wp--preset--color--primary); color: #fff; }
.at-shop__cat.is-active {
  background: var(--wp--preset--color--navy);
  color: #fff;
  box-shadow: 0 4px 14px -6px rgba(15,30,60,0.4);
}

/* Section divider title inside the sidebar. */
.at-shop__sidebar-section {
  font-size: 1rem;
  color: var(--wp--preset--color--navy);
  font-weight: 800;
  margin: 1.25rem 0 0.75rem;
  letter-spacing: 0;
}

/* ===== Sidebar Card 1: Size / vehicle finder (Lovable-matched) ===== */
.at-side-finder {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: var(--at-radius);
  padding: 1.25rem;
  box-shadow: var(--at-shadow-card);
}
.at-side-finder__title {
  margin: 0 0 1rem;
  font-size: 1rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy);
}
.at-side-finder__tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--wp--preset--color--border);
  margin-bottom: 1rem;
}
.at-side-finder__tab {
  background: transparent;
  border: 0;
  padding: 0.625rem 0.5rem;
  font: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--wp--preset--color--muted-foreground);
  cursor: pointer;
  position: relative;
  flex: 1;
  text-align: center;
}
.at-side-finder__tab[aria-selected="true"] { color: var(--wp--preset--color--navy); }
.at-side-finder__tab[aria-selected="true"]::after {
  content: "";
  position: absolute;
  inset-inline: 0; bottom: -1px;
  height: 2px;
  background: var(--wp--preset--color--primary);
  border-radius: 999px 999px 0 0;
}

/* Yellow tip banner */
.at-side-finder__tip {
  background: #FFF7DA;             /* warm pale yellow */
  border: 1px solid #FCE3A2;
  border-radius: 10px;
  padding: 0.625rem 0.75rem;
  font-size: 0.8125rem;
  color: #6E5300;
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
  line-height: 1.4;
}
.at-side-finder__tip-icon { font-size: 1rem; line-height: 1; }

/* License plate input */
.at-side-finder__plate { margin-bottom: 0.875rem; }
.at-side-finder__plate input {
  width: 100%;
  background: var(--wp--preset--color--muted);
  border: 0;
  border-radius: 10px;
  padding: 0.625rem 0.875rem;
  font: inherit;
  font-size: 0.875rem;
  color: var(--wp--preset--color--foreground);
  text-align: center;
}

/* 2-column grid of dropdowns + full-width CTA */
.at-side-finder__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem 0.625rem;
}
.at-side-finder__grid > div { display: flex; flex-direction: column; }
.at-side-finder__grid label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--wp--preset--color--navy);
  margin-bottom: 0.25rem;
}
.at-side-finder__grid select {
  width: 100%;
  background: var(--wp--preset--color--muted);
  border: 0;
  border-radius: 10px;
  padding: 0.5rem 0.625rem;
  font: inherit;
  font-size: 0.875rem;
  color: var(--wp--preset--color--foreground);
}
.at-side-finder__cta {
  grid-column: 1 / -1;
  background: var(--wp--preset--color--primary);
  color: #fff;
  border: 0;
  border-radius: 10px;
  padding: 0.75rem 1rem;
  font: inherit;
  font-weight: 700;
  font-size: 0.9375rem;
  cursor: pointer;
  margin-top: 0.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  transition: background .15s;
}
.at-side-finder__cta:hover { background: var(--wp--preset--color--primary-dark); }
.at-side-finder__cta-icon { font-size: 1rem; }

/* Brand row on catalog cards — Hebrew (right in RTL) + English (left). */
.at-card__brand-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  margin: 0 0 0.35rem;
  min-width: 0;
}

.at-card__brand {
  margin: 0;
  line-height: 1.15;
}

/* Hebrew brand — prominent, same as before */
.at-card__brand--he {
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--wp--preset--color--primary-dark);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  flex: 1 1 auto;
  min-width: 0;
}

/* English brand — muted, sits on the visual left in RTL */
.at-card__brand--en {
  flex: 0 0 auto;
  margin-inline-start: auto;
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}


/* Hero band with breadcrumb at the top of the shop page — slim and quiet
   so it doesn't compete with the page title underneath. */
.at-shop__hero,
.at-brand-page__breadcrumb-band {
  background: var(--wp--preset--color--muted);
  padding: 0.5rem clamp(1rem, 4vw, 2.5rem);
  border-bottom: 1px solid var(--wp--preset--color--border);
}
.at-brand-page__breadcrumb-band {
  margin-bottom: 0;
}
.at-breadcrumb--brand-catalog .at-breadcrumb__sep {
  margin-inline: 0.125rem;
  color: var(--wp--preset--color--muted-foreground);
  font-weight: 400;
}
.at-shop__hero-rail { width: 100%; max-width: 1400px; margin-inline: auto; }
.at-breadcrumb {
  font-size: 0.75rem;
  color: var(--wp--preset--color--muted-foreground);
  display: flex; gap: 0.375rem; align-items: center; flex-wrap: wrap;
  line-height: 1.3;
}
.at-breadcrumb a {
  color: var(--wp--preset--color--muted-foreground);
  text-decoration: none;
}
.at-breadcrumb a:hover { color: var(--wp--preset--color--primary-dark); }
/* The query-title block inside the breadcrumb renders as an h1 with big
   default styling — we tame it down so it reads as inline text. */
.at-breadcrumb__current,
.at-breadcrumb__current * {
  color: var(--wp--preset--color--navy);
  font-weight: 600;
  font-size: 0.75rem !important;
  margin: 0 !important;
  display: inline !important;
  line-height: inherit !important;
}

/* Two-column layout: sidebar (visual right in RTL) + main. */
.at-shop {
  padding: 1.5rem clamp(1rem, 4vw, 2.5rem) 3rem;
}
.at-shop__rail {
  width: 100%; max-width: 1400px; margin-inline: auto;
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 2rem;
  align-items: start;
}
@media (max-width: 980px) {
  .at-shop__rail { grid-template-columns: 1fr; }
  .at-shop__sidebar { order: 2; }
}

/* ===== Sidebar (two stacked cards, Lovable-style) ===== */
.at-shop__sidebar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* The filter group is its own white card with header + collapsible sections. */
.at-shop__sidebar .wp-block-woocommerce-product-filters {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: var(--at-radius);
  padding: 0;
  overflow: hidden;
}
.at-shop__sidebar > .at-shop__sidebar-section { display: none; }

/* "סינון" panel header with a small filter icon on the visual right (start). */
.at-shop__sidebar .wp-block-woocommerce-product-filters::before {
  content: "סינון";
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 1rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy);
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--wp--preset--color--border);
}

/* Each filter section: a vertical stack divided by a hairline rule. */
.at-shop__sidebar .wp-block-woocommerce-product-filters > * {
  border-top: 1px solid var(--wp--preset--color--border);
  padding: 1rem 1.25rem;
  margin: 0;
}
.at-shop__sidebar .wp-block-woocommerce-product-filters > *:first-of-type { border-top: 0; }

/* Section heading: bold title + chevron (chevron on visual left = inline-start in RTL). */
.at-shop__sidebar .wp-block-woocommerce-product-filters h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy);
  margin: 0 0 0.75rem;
  padding: 0;
  border-bottom: 0;
  cursor: pointer;
  user-select: none;
}
.at-shop__sidebar .wp-block-woocommerce-product-filters h3::after {
  content: "▾";
  font-size: 0.7rem;
  color: var(--wp--preset--color--muted-foreground);
  transition: transform .15s ease;
  font-weight: 400;
}
.at-shop__sidebar .is-collapsed h3 { margin-bottom: 0; }
.at-shop__sidebar .is-collapsed h3::after { transform: rotate(-90deg); }
.at-shop__sidebar .is-collapsed > :not(h3) { display: none; }

/* Checkbox list inside a filter section — clean spacing, RTL-friendly. */
.at-shop__sidebar .wc-block-product-filter-checkbox-list,
.at-shop__sidebar .wc-block-product-filter-checkbox-list ul,
.at-shop__sidebar .wp-block-woocommerce-product-filter-checkbox-list,
.at-shop__sidebar .wp-block-woocommerce-product-filter-checkbox-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-height: 240px;
  overflow-y: auto;   /* tame extremely long brand lists, but the SIDEBAR itself never scrolls */
}
.at-shop__sidebar .wc-block-product-filter-checkbox-list__item,
.at-shop__sidebar .wc-block-components-checkbox {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--foreground);
  cursor: pointer;
}
.at-shop__sidebar .wc-block-components-checkbox label { flex: 1; }

/* Native checkbox: square w/ rounded corner, primary color when checked. */
.at-shop__sidebar input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border: 1.5px solid var(--wp--preset--color--border);
  border-radius: 4px;
  background: #fff;
  display: inline-block;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .12s, border-color .12s;
}
.at-shop__sidebar input[type="checkbox"]:hover {
  border-color: var(--wp--preset--color--primary);
}
.at-shop__sidebar input[type="checkbox"]:checked {
  background: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
}
.at-shop__sidebar input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 4px; top: 1px;
  width: 6px; height: 11px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Price range slider styling. */
.at-shop__sidebar .wp-block-woocommerce-product-filter-price input[type="range"] {
  width: 100%;
  accent-color: var(--wp--preset--color--primary);
}
.at-shop__sidebar .wp-block-woocommerce-product-filter-price .wc-block-components-price-slider__range-input-wrapper {
  margin: 0.5rem 0;
}
.at-shop__sidebar .wc-block-components-formatted-money-amount,
.at-shop__sidebar .wp-block-woocommerce-product-filter-price__numbers {
  color: var(--wp--preset--color--navy);
  font-weight: 700;
  font-size: 0.875rem;
}

/* Active filter chips. */
.at-shop__sidebar .wc-block-product-filter-removable-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  padding-top: 0.5rem;
}
.at-shop__sidebar .wc-block-product-filter-removable-chips__item,
.at-shop__sidebar .wc-block-product-filter-removable-chips > * {
  background: var(--wp--preset--color--muted);
  border-radius: 999px;
  padding: 0.25rem 0.625rem;
  font-size: 0.75rem;
  color: var(--wp--preset--color--navy);
}
/* (Older single-card filter styles removed — see the new two-card sidebar
   rules above, which match the Lovable layout: standalone size-finder card
   stacked above a separate "סינון" panel with header + collapsible sections.) */
.at-shop__sidebar .wp-block-woocommerce-product-filter-checkbox-list,
.at-shop__sidebar .wp-block-woocommerce-product-filter-checkbox-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.at-shop__sidebar .wc-block-product-filter-checkbox-list__item {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.25rem 0;
  font-size: 0.9375rem;
  color: var(--wp--preset--color--foreground);
}
.at-shop__sidebar input[type="checkbox"] {
  accent-color: var(--wp--preset--color--primary);
  width: 16px; height: 16px;
}
.at-shop__sidebar .wp-block-woocommerce-product-filter-price input[type="range"] {
  accent-color: var(--wp--preset--color--primary);
}

/* ===== Custom accordion catalog filters (shop + brand pages) ===== */
.at-cat-filter {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: var(--at-radius);
  overflow: hidden;
}
.at-cat-filter__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--wp--preset--color--border);
}
.at-cat-filter__title {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 1rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy);
}
.at-cat-filter__clear {
  flex: 0 0 auto;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--wp--preset--color--primary-dark);
  text-decoration: none;
  white-space: nowrap;
}
.at-cat-filter__clear:hover { text-decoration: underline; }

.at-cat-filter__section {
  border-top: 1px solid var(--wp--preset--color--border);
}
.at-cat-filter__section:first-of-type { border-top: 0; }

.at-cat-filter__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy);
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.at-cat-filter__summary::-webkit-details-marker { display: none; }
.at-cat-filter__summary::after {
  content: "▾";
  font-size: 2rem;
  line-height: 1;
  color: var(--wp--preset--color--muted-foreground);
  transition: transform 0.15s ease;
  font-weight: 400;
  flex-shrink: 0;
  margin-inline-start: 0.625rem;
}
.at-cat-filter__section:not([open]) > .at-cat-filter__summary::after {
  transform: rotate(-90deg);
}

.at-cat-filter__body {
  padding: 0 1.25rem 0.875rem;
}
.at-cat-filter__hint {
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--wp--preset--color--muted-foreground);
}

.at-cat-filter__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.at-cat-filter__option {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.3125rem 0;
  font-size: 0.875rem;
  color: var(--wp--preset--color--foreground);
  text-decoration: none;
  line-height: 1.3;
  -webkit-tap-highlight-color: transparent;
}
.at-cat-filter__option:hover {
  color: var(--wp--preset--color--primary-dark);
}
.at-cat-filter__option:focus {
  outline: none;
  box-shadow: none;
}
.at-cat-filter__option:focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
  border-radius: 4px;
}

.at-cat-filter__summary:focus {
  outline: none;
}
.at-cat-filter__summary:focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: -2px;
}

.at-cat-filter__clear:focus {
  outline: none;
  box-shadow: none;
}
.at-cat-filter__clear:focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
  border-radius: 4px;
}

.at-cat-filter__check {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--wp--preset--color--border);
  border-radius: 4px;
  background: #fff;
  position: relative;
  transition: background 0.12s, border-color 0.12s;
}
.at-cat-filter__item.is-active .at-cat-filter__check {
  background: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
}
.at-cat-filter__item.is-active .at-cat-filter__check::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 6px;
  height: 11px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.at-cat-filter__name { flex: 1 1 auto; min-width: 0; }
.at-cat-filter__count {
  flex-shrink: 0;
  font-size: 0.75rem;
  color: var(--wp--preset--color--muted-foreground);
}

.at-cat-filter__locked {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.at-cat-filter__chip {
  display: inline-flex;
  align-items: center;
  padding: 0.3125rem 0.75rem;
  border-radius: 999px;
  font-size: 0.875rem;
  font-weight: 800;
}
.at-cat-filter__chip--locked {
  background: linear-gradient(135deg, #0F1E3C 0%, #1A2B4A 100%);
  color: var(--wp--preset--color--accent-yellow, #FFD100);
  align-self: flex-start;
}
.at-cat-filter__locked-note {
  font-size: 0.75rem;
  color: var(--wp--preset--color--muted-foreground);
}

/* Top bar above the product grid.
   In RTL the sort dropdown appears at the visual right (= start) and the
   result count at the visual left, matching Lovable. We use `flex-direction:
   row-reverse` on the underlying block group to swap their visual order
   without touching markup. */
.at-shop__topbar {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: var(--at-radius);
  padding: 0.75rem 1rem;
  margin-bottom: 1.25rem;
  font-size: 0.9375rem;
  display: flex !important;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}
.at-shop__topbar .woocommerce-result-count,
.at-shop__topbar p { margin: 0; color: var(--wp--preset--color--muted-foreground); }
.at-shop__topbar form { margin: 0; }
.at-shop__topbar select {
  background: var(--wp--preset--color--muted);
  border: 0;
  border-radius: 999px;
  padding: 0.4rem 0.875rem;
  font: inherit;
  color: var(--wp--preset--color--navy);
  font-weight: 600;
  cursor: pointer;
}
.at-shop__topbar label,
.at-shop__topbar .wp-block-woocommerce-catalog-sorting > * {
  display: inline-block;
  vertical-align: middle;
}

/* Product grid — 4 columns at desktop, all products on one page. */
.wp-block-woocommerce-product-collection .wc-block-product-template,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-template {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
@media (max-width: 1280px) {
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-template { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-template { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-template { grid-template-columns: 1fr; }
}
.wp-block-woocommerce-product-collection .wc-block-product,
.wp-block-woocommerce-product-collection .wp-block-post {
  background: #fff;
  border-radius: var(--at-radius);
  box-shadow: 0 6px 20px -10px rgba(15,30,60,0.18);
  padding: 0;                                   /* image goes EDGE TO EDGE at the top */
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
  display: flex; flex-direction: column;
}
.wp-block-woocommerce-product-collection .wp-block-post:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 36px -14px rgba(15,30,60,0.28);
}
/* Product image: no grey background, no inner border-radius, no padding inside the anchor.
   Tire PNGs are transparent — let the white card body show through naturally. */
.wp-block-woocommerce-product-collection .wc-block-components-product-image,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image {
  margin: 0;
  border-radius: 0;
  overflow: hidden;
  background: #fff;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
}
.wp-block-woocommerce-product-collection .wc-block-components-product-image a,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0.375rem;
  box-sizing: border-box;
}

/* Card text area: pad here instead of around the whole card so image stays edge-to-edge */
.wp-block-woocommerce-product-collection .wp-block-post > .wp-block-group,
.wp-block-woocommerce-product-collection .wc-block-product > .wp-block-group {
  padding: 0.625rem 0.625rem 0.75rem !important;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button {
  padding: 0;
}
.wp-block-woocommerce-product-collection .wc-block-components-product-image img,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto !important;       /* override WC inline width/height attributes */
  height: auto !important;
  object-fit: contain;
}
.wp-block-woocommerce-product-collection .wc-block-components-sale-badge,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-sale-badge {
  background: var(--wp--preset--color--destructive);
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.75rem;
  padding: 0.2rem 0.625rem;
}
.wp-block-woocommerce-product-collection .wp-block-post-terms a {
  color: var(--wp--preset--color--primary-dark);
  text-decoration: none;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.wp-block-woocommerce-product-collection .wp-block-post-title {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--wp--preset--color--navy);
  /* Clamp to EXACTLY 3 lines — reserve the space so every card is the same
     height regardless of the actual title length. Longer titles get an
     ellipsis; shorter titles still occupy 3 lines of space. */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: calc(3 * 1.35em);
}
/* Anchor inside the clamped title must also act as -webkit-box to inherit clip */
.wp-block-woocommerce-product-collection .wp-block-post-title a {
  display: inline;
}
.wp-block-woocommerce-product-collection .wp-block-post-title a {
  color: var(--wp--preset--color--navy);
  text-decoration: none;
}
.wp-block-woocommerce-product-collection .wc-block-components-product-price,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price {
  width: 100%;
  align-self: stretch;
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy);
}
.wp-block-woocommerce-product-collection .wc-block-components-product-price__regular,
.wp-block-woocommerce-product-collection del {
  color: var(--wp--preset--color--muted-foreground);
  font-weight: 500;
  font-size: 0.875rem;
  margin-inline-end: 0.5rem;
}
.wp-block-woocommerce-product-collection .wc-block-components-product-button,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button {
  margin-top: auto;
  padding-top: 0.5rem;
}
.wp-block-woocommerce-product-collection .wp-block-button__link,
.wp-block-woocommerce-product-collection .wc-block-components-product-button .wp-block-button__link,
.wp-block-woocommerce-product-collection a.at-loop-cta,
.wp-block-woocommerce-product-collection a.wp-element-button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: var(--wp--preset--color--primary) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  padding: 0 1rem !important;
  font-weight: 700 !important;
  font-size: 0.9375rem !important;
  width: 100% !important;
  min-height: 44px !important;       /* same as the original WC product button */
  height: auto !important;
  text-align: center;
  text-decoration: none !important;
  box-sizing: border-box !important;
  line-height: 1.3 !important;
  margin-top: 0.625rem !important;   /* WC's inline style preserved here */
  font-family: inherit !important;
  cursor: pointer;
}
.wp-block-woocommerce-product-collection a.at-loop-cta:hover,
.wp-block-woocommerce-product-collection .wp-block-button__link:hover {
  background: var(--wp--preset--color--primary-dark, #00A0D7) !important;
  color: #fff !important;
}
.wp-block-woocommerce-product-collection .wp-block-button__link:hover {
  background: var(--wp--preset--color--primary-dark);
}

/* Pagination */
.wp-block-woocommerce-product-collection .wp-block-query-pagination {
  margin-top: 2rem;
  gap: 0.375rem;
  justify-content: center;
}
.wp-block-woocommerce-product-collection .wp-block-query-pagination a,
.wp-block-woocommerce-product-collection .wp-block-query-pagination .page-numbers {
  display: inline-grid; place-items: center;
  min-width: 36px; height: 36px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  color: var(--wp--preset--color--navy);
  text-decoration: none;
  font-weight: 600;
  padding: 0 0.625rem;
}
.wp-block-woocommerce-product-collection .wp-block-query-pagination .page-numbers.current {
  background: var(--wp--preset--color--primary);
  color: #fff;
  border-color: transparent;
}

/* ===================================================================== */
/* ===  MOBILE LIST CARDS — compact catalog rows (shop + brand pages)  === */
/* ===  Backup before this change: docs/migration/backups/             === */
/* ===  catalog-product-card-mobile-grid-2026-05-31.md                 === */
/* ===  Revert: delete this entire section.                            === */
/* ===================================================================== */
@media (max-width: 540px) {
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-template {
    gap: 0.625rem;
  }

  .wp-block-woocommerce-product-collection .wc-block-product,
  .wp-block-woocommerce-product-collection .wp-block-post {
    display: grid !important;
    grid-template-columns: 92px minmax(0, 1fr);
    grid-template-rows: auto auto auto auto;
    gap: 0.125rem 0.625rem;
    padding: 0.625rem !important;
    align-items: start;
    justify-items: stretch;
  }

  .wp-block-woocommerce-product-collection .wp-block-post:hover {
    transform: none;
    box-shadow: 0 6px 20px -10px rgba(15, 30, 60, 0.18);
  }

  /* RTL: col 1 = visual right (thumb), col 2 = visual left (info stack) */
  .wp-block-woocommerce-product-collection .wc-block-components-product-image,
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image {
    grid-column: 1;
    grid-row: 1 / 4;
    width: 92px !important;
    height: 92px !important;
    max-width: 92px;
    aspect-ratio: 1 / 1 !important;
    margin: 0 !important;
    border-radius: 8px;
    align-self: start;
    flex-shrink: 0;
  }

  .wp-block-woocommerce-product-collection .wc-block-components-product-image a,
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image a {
    padding: 0.25rem;
    border-radius: 8px;
  }

  .wp-block-woocommerce-product-collection .wc-block-components-product-image img,
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image img {
    max-height: 84px;
  }

  .wp-block-woocommerce-product-collection .wp-block-post > .wp-block-group,
  .wp-block-woocommerce-product-collection .wc-block-product > .wp-block-group {
    display: contents !important;
  }

  .wp-block-woocommerce-product-collection .at-card__brand-row {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    min-width: 0;
  }

  .wp-block-woocommerce-product-collection .wp-block-post-title {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    font-size: 0.875rem;
    line-height: 1.35;
    -webkit-line-clamp: 2;
    min-height: 0;
  }

  .wp-block-woocommerce-product-collection .wc-block-components-product-price,
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price,
  .wp-block-woocommerce-product-collection .at-price-block--card {
    grid-column: 2;
    grid-row: 3;
    min-width: 0;
  }

  .wp-block-woocommerce-product-collection .at-card__brand--he {
    font-size: 0.8125rem;
    letter-spacing: 0.04em;
  }

  .wp-block-woocommerce-product-collection .at-card__brand--en {
    font-size: 0.625rem;
  }

  .wp-block-woocommerce-product-collection .at-price-block--card {
    gap: 0.125rem;
  }

  /* Prefer install price row when both rows exist */
  .wp-block-woocommerce-product-collection .at-price-block--card .at-price__row--compact:first-child:not(:only-child) {
    display: none;
  }

  .wp-block-woocommerce-product-collection .at-price-block--card .at-price__row--compact {
    padding: 0.3125rem 0.4375rem;
  }

  .wp-block-woocommerce-product-collection .at-price-block--card .at-price__label {
    font-size: 0.6875rem;
  }

  .wp-block-woocommerce-product-collection .at-price-block--card .at-price__value {
    font-size: 0.9375rem;
  }

  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button,
  .wp-block-woocommerce-product-collection .wc-block-components-product-button,
  .wp-block-woocommerce-product-collection .wp-block-post > .wp-block-group > p:has(> a.at-loop-cta),
  .wp-block-woocommerce-product-collection .wc-block-product > .wp-block-group > p:has(> a.at-loop-cta),
  .wp-block-woocommerce-product-collection .wp-block-post > .wp-block-group > a.at-loop-cta,
  .wp-block-woocommerce-product-collection .wc-block-product > .wp-block-group > a.at-loop-cta {
    grid-column: 1 / -1;
    grid-row: 4;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    justify-self: stretch;
    align-self: stretch;
    margin: 0.375rem 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
  }

  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button .wp-block-button,
  .wp-block-woocommerce-product-collection .wc-block-components-product-button .wp-block-button {
    width: 100%;
    display: block;
  }

  .wp-block-woocommerce-product-collection .wp-block-button__link,
  .wp-block-woocommerce-product-collection .wc-block-components-product-button .wp-block-button__link,
  .wp-block-woocommerce-product-collection a.at-loop-cta {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 40px !important;
    font-size: 0.875rem !important;
    margin-top: 0 !important;
    padding: 0 0.75rem !important;
    box-sizing: border-box !important;
  }

  .at-set4-gallery-badge.at-set4-gallery-badge--card {
    top: 4px;
    inset-inline-end: 4px;
    padding: 3px 5px 4px;
    max-width: 72px;
    border-width: 1.5px;
    border-radius: 6px;
  }

  .at-set4-gallery-badge--card .at-set4-gallery-badge__line {
    font-size: 8px;
    line-height: 1.15;
  }

  .wp-block-woocommerce-product-collection .wc-block-components-sale-badge,
  .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-sale-badge {
    font-size: 0.625rem;
    padding: 0.125rem 0.375rem;
  }
}

/* Multi-size picker  — shown above the product grid          === */
/* ===     when a customer searches by car and we have multiple        === */
/* ===     compatible sizes to offer.                                   === */
/* ===================================================================== */
.at-size-picker {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: var(--at-radius);
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.25rem;
}
.at-size-picker__eyebrow {
  color: var(--wp--preset--color--primary-dark);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0;
}
.at-size-picker__title {
  color: var(--wp--preset--color--navy);
  font-size: clamp(1.125rem, 1.6vw, 1.375rem);
  margin: 0.25rem 0 0.375rem;
}
.at-size-picker__sub {
  color: var(--wp--preset--color--muted-foreground);
  font-size: 0.9rem;
  margin: 0 0 1rem;
}
.at-size-picker__list {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 0.625rem;
}
.at-size-pill {
  display: flex; flex-direction: column; align-items: center;
  background: var(--wp--preset--color--muted);
  border-radius: 12px;
  padding: 0.875rem 1rem;
  text-decoration: none;
  transition: transform .15s, background .15s, color .15s;
}
.at-size-pill:hover {
  background: var(--wp--preset--color--primary);
  transform: translateY(-2px);
}
.at-size-pill:hover .at-size-pill__label,
.at-size-pill:hover .at-size-pill__count { color: #fff; }
.at-size-pill__label {
  font-weight: 800;
  font-size: 1.0625rem;
  color: var(--wp--preset--color--navy);
}
.at-size-pill__count {
  font-size: 0.8125rem;
  color: var(--wp--preset--color--muted-foreground);
  margin-top: 0.125rem;
}

/* ===================================================================== */
/* ===                SINGLE PRODUCT PAGE                            === */
/* ===================================================================== */

/* Two-column product hero — image on the visual left (source-end in RTL),
   info on the visual right (source-start). */
/* Top padding tightened 2026-05-27 — less gap between breadcrumb and content. */
.at-product { padding: 0.75rem clamp(1rem, 4vw, 2.5rem) 0; }
.at-product__rail {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
  display: grid;
  /* 3-column layout with `direction: rtl`:
     - FIRST track is on the visual RIGHT (gallery)
     - LAST  track is on the visual LEFT  (trust)
     - Middle track absorbs leftover pixels (info)
     2026-05-28: gallery and trust SWAPPED — photo on the right, badges on
     the left. Track sizes 420 / 1fr / 200 with a 2rem base gap (32px).
     Gallery gets an extra `margin-inline-end: 1rem` below so the
     gallery ↔ info gap is 48px (32 + 16) — visibly bigger than the
     info ↔ trust gap, keeping the photo feeling like its own card. */
  grid-template-columns: 420px minmax(0, 1fr) 200px;
  column-gap: 2rem;        /* 32px between info ↔ trust; gallery adds more below */
  row-gap: 1rem;
  align-items: start;
  direction: rtl;
}
.at-product__gallery { order: 1; }   /* visually RIGHT */
.at-product__info    { order: 2; }   /* visually MIDDLE */
.at-product__trust   { order: 3; }   /* visually LEFT  */
/* ============================================================
 * RESPONSIVE BREAKPOINTS (2026-05-28 — mobile-first overhaul)
 * ============================================================ */

/* TABLET (≤ 1180px) — gallery + info side-by-side, trust as a
   FULL-WIDTH horizontal strip below them. Need to reset the trust
   column's desktop sidebar styling (200px sticky) at this size. */
@media (max-width: 1180px) {
  .at-product__rail {
    grid-template-columns: 1fr 1fr;
    column-gap: 1rem;
  }
  /* Gallery loses its asymmetric desktop margin on tablet */
  .at-product__gallery { margin-inline-end: 0; }

  /* Trust strip becomes a full-width row below the 2-col grid */
  .at-product__trust {
    grid-column: 1 / -1;
    order: 4;
    width: 100%;
    max-width: none;
    position: static;
    top: auto;
    margin-top: 0.5rem;
  }
  .at-product__trust .at-trust-strip {
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin: 0;
  }
  .at-product__trust .at-trust-strip__item {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 0.5rem;
    padding: 0.85rem 0.5rem;
  }
  .at-product__trust .at-trust-strip__icon {
    width: 2.4rem;
    height: 2.4rem;
    font-size: 1.15rem;
  }
}

/* MOBILE (≤ 720px) — single column stack, everything full-width and
   centered. No sticky, no fixed sidebar widths. */
@media (max-width: 720px) {
  /* Global safety net — prevent horizontal scroll from any rogue child */
  .at-product { padding: 0.5rem clamp(0.75rem, 4vw, 1.25rem) 1rem; overflow-x: hidden; }

  .at-product__rail {
    display: flex;
    flex-direction: column;
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: 1rem;
  }
  .at-product__gallery,
  .at-product__trust {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }
  .at-product__info {
    display: contents; /* let mobile reorder title / buy block / gallery */
  }
  .at-product__info > * { min-width: 0; max-width: 100%; }

  /* Mobile section order: title -> trust pills -> price+buy -> photo */
  .at-product__info .at-product__brand,
  .at-product__info .wp-block-post-title,
  .at-product__info h1.product_title { order: 10; }
  .at-product__trust { order: 20; text-align: center; }
  .at-product__info .at-set4-title-strip,
  .at-product__info .at-product__size,
  .at-product__info .at-price-block,
  .at-product__info .wp-block-woocommerce-add-to-cart-form,
  .at-product__info form.cart { order: 30; }
  .at-product__gallery { order: 40; }

  /* Gallery — no sticky pinning, no asymmetric margin, capped height
     so a tall tire image doesn't push the buy box off-screen. */
  .at-product__gallery {
    position: static;
    top: auto;
    margin-inline-end: 0;
    margin-inline-start: 0;
    padding: 0.75rem;
  }
  .at-product__gallery img {
    max-height: 320px !important;
    min-height: 200px !important;
  }

  /* Info column — full width, centered text, allow long English product
     names ("KLEBER DYNAXER HP5 SUV") to break instead of overflowing. */
  .at-product__info {
    padding: 0.25rem 0;
    text-align: center;
    overflow-wrap: anywhere;
    word-wrap: break-word;
  }

  .at-product__info .wp-block-post-title,
  .at-product__info h1.product_title {
    text-align: center;
    font-size: clamp(1.15rem, 4.5vw, 1.45rem) !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* "מבצע סט 4 צמיגים" + "מידה: 215/60R17" — STACK vertically on mobile
     instead of inline-block (which can overflow at narrow widths). */
  .at-product__info .at-set4-title-strip,
  .at-product__info .at-product__size {
    display: inline-flex;
    margin: 0.25rem 0;
    max-width: 100%;
  }

  .at-product__info .at-compat-line,
  .at-product__info .at-spec-grid {
    display: none !important;
  }
  .at-product__info form.cart { justify-content: center; }

  /* Inner cards keep their own readable left-aligned text */
  .at-price-block,
  .at-install-place { text-align: start; }

  /* Price block — mobile PDP: only "מחיר כולל מעמ והרכבה" (hide ללא התקנה) */
  .at-product__info .at-price-block { gap: 0.5rem; grid-template-columns: 1fr; }
  .at-product__info .at-price-block .at-price__row--secondary {
    display: none !important;
  }
  .at-product__info .at-price-block .at-price__value { font-size: 1.125rem; }
  .at-product__info .at-price-block .at-price__label { font-size: 0.8125rem; }

  .at-product__trust .at-trust-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  /* =========================================================
   * MOBILE BUY FLOW (2026-05-28 user request):
   * Drop "הוסף לסל" entirely on mobile — show ONLY the
   * "המשך לרכישה" button which goes straight to checkout
   * (handled server-side by autotire_buy_now_redirect_to_checkout).
   * Quantity stepper stays so customers can pick 1–4 tires.
   * ========================================================= */
  .at-product__info form.cart .single_add_to_cart_button {
    display: none !important;
  }

  /* Buy-now becomes the SOLE primary CTA — full width, taller, bigger
     font, no top margin (replaces the previous "stacked under cart" spacing). */
  .at-product__info .at-buy-now-button,
  .at-product__info form.cart > .at-buy-now-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    height: 56px;
    font-size: 1.05rem;
    font-weight: 800;
    /* Keep the yellow accent on mobile too — high contrast against the
       gray "disabled" state when no install-place is picked yet. */
  }

  /* Quantity stepper sits on its own row above the CTA, centered */
  .at-product__info form.cart .quantity {
    flex: 0 0 auto !important;
    margin-inline: auto !important;
  }
}

/* SMALL MOBILE (≤ 480px) — tighter spacing, smaller title, fully
   single-column spec grid + stacked price block + stacked buttons. */
@media (max-width: 480px) {
  .at-product { padding: 0.5rem 0.625rem 1rem; }

  .at-product__info .wp-block-post-title,
  .at-product__info h1.product_title {
    font-size: 1.0625rem !important;
    line-height: 1.3 !important;
  }

  /* Spec grid: 2 columns is still readable down to 320px when label+value
     are stacked. Keep 2 columns but tighten padding and font. */
  .at-spec-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0.5rem;
    gap: 0.4rem;
  }
  .at-spec-grid__cell {
    padding: 0.4rem 0.3rem;
  }
  .at-spec-grid__label { font-size: 0.6875rem; }
  .at-spec-grid__value { font-size: 0.875rem; }

  /* Price block stacks (this also exists in the base @media at ~line 2785) */
  .at-price-block { grid-template-columns: 1fr; }

  /* Trust strip: 2x2 grid (matches base .at-trust-strip @media at line ~4316) */
  .at-product__trust .at-trust-strip {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }
  .at-product__trust .at-trust-strip__label {
    font-size: 0.75rem;
  }
}

/* EXTRA-SMALL (≤ 360px) — final compaction so iPhone SE-class devices
   still render the whole page without horizontal scroll. */
@media (max-width: 360px) {
  .at-spec-grid { grid-template-columns: 1fr; }
  .at-spec-grid__cell {
    flex-direction: row;
    justify-content: space-between;
    text-align: start;
    padding: 0.45rem 0.6rem;
  }
}

/* Below-the-fold sections on mobile — tighten generous desktop padding
   so the accordion + related products don't dwarf the buy box above. */
@media (max-width: 720px) {
  .at-product__accordion-wrap { padding: 0 clamp(0.75rem, 4vw, 1.25rem) 1rem; }
  .at-product__related { padding: 2rem clamp(0.75rem, 4vw, 1.25rem); }
  .at-product__related h2 { font-size: 1.25rem; margin-bottom: 1rem; }
  .at-product__details { padding: 2rem clamp(0.75rem, 4vw, 1.25rem); }
  .at-accordion__body { padding: 1rem 1.125rem 1.25rem; font-size: 0.875rem; }
  .at-accordion__summary { padding: 0.625rem 1rem; font-size: 0.9375rem; }
}

/* TRUST COLUMN — narrow vertical stack on the LEFT (since 2026-05-28).
   Total width capped at 200px so it hugs the icons + text and doesn't eat
   real estate from the main info column. */
.at-product__trust { position: sticky; top: 1rem; width: 200px; max-width: 200px; }
.at-product__trust .at-trust-strip {
  grid-template-columns: 1fr;
  gap: 0.6rem;
  margin: 0;
}
.at-product__trust .at-trust-strip__item {
  flex-direction: row;
  justify-content: flex-start;
  text-align: start;
  gap: 0.6rem;
  padding: 0.625rem 0.75rem;
}
.at-product__trust .at-trust-strip__icon { width: 2rem; height: 2rem; font-size: 1.05rem; }
.at-product__trust .at-trust-strip__label { font-size: 0.8125rem; }

/* Image gallery — clean white card, light border (Touchstore-style).
   2026-05-27: padding 0.5rem so the tire image visually fills the card.
   2026-05-28: gallery moved to the visual RIGHT — its info-facing edge is
   now its LEFT (inline-END in RTL), so `margin-inline-end: 1rem` adds 16px
   extra gap on that side, giving a total gallery ↔ info channel of
   32 + 16 = 48px. */
.at-product__gallery {
  background: #fff;
  border-radius: 16px;
  padding: 0.5rem;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  box-shadow: none;
  position: sticky;
  top: 1rem;
  margin-inline-end: 1rem;
}
.at-product__gallery .wp-block-woocommerce-product-image-gallery,
.at-product__gallery .wc-block-product-image-gallery,
.at-product__gallery .woocommerce-product-gallery {
  background: #fff;
  border-radius: 12px;
  padding: 0;
  opacity: 1 !important;          /* override WC's opacity:0 + flexslider init */
}
.at-product__gallery .woocommerce-product-gallery__wrapper { display: block !important; }
.at-product__gallery .woocommerce-product-gallery__image,
.at-product__gallery .woocommerce-product-gallery__image--placeholder {
  display: block !important;
  width: 100%;
}
.at-product__gallery img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 620px;
  object-fit: contain;
  margin-inline: auto;
}

/* ============================================================
 * GALLERY CORNER STICKER — "מבצע סט 4 צמיגים" (rev 2026-05-28)
 * Two-line premium sale chip overlaid on the product photo. Rendered by
 * the [autotire_set4_gallery_badge] shortcode inside .at-product__gallery
 * (templates/single-product.html). The gallery card has position:sticky
 * which establishes the containing block for this absolute child.
 *
 * Hard size constraints (width: max-content + max-width) prevent the chip
 * from stretching to fill the gallery card if a parent ever switches to
 * flex/grid layout.
 * ============================================================ */
.at-set4-gallery-badge {
  position: absolute;
  top: 16px;
  inset-inline-end: 16px;        /* RTL: 16px from the LEFT edge of the gallery */
  z-index: 5;

  /* Block-level flex column — predictable size, never stretches */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 240px;
  min-width: 0;
  box-sizing: border-box;

  /* Bold red gradient — impossible to miss */
  background:
    linear-gradient(135deg, #FF3B3B 0%, #E10E0E 55%, #B70000 100%);
  color: #fff;

  padding: 14px 22px 15px;
  border-radius: 14px;
  border: 3px solid #fff;

  font-family: var(--wp--preset--font-family--heebo, 'Heebo', sans-serif);
  text-align: center;
  line-height: 1.05;
  letter-spacing: 0;
  white-space: nowrap;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);

  /* Dramatic layered shadow + bright red glow */
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.35) inset,
    0 -2px 0 rgba(0, 0, 0, 0.12) inset,
    0 10px 24px -6px rgba(225, 14, 14, 0.55),
    0 4px 10px rgba(15, 30, 60, 0.25);

  pointer-events: none;
  direction: rtl;
  unicode-bidi: isolate;

  /* Tilt anchored to the LEFT edge of the gallery (badge's own corner) */
  transform: rotate(-4deg);
  transform-origin: top left;

  animation: at-set4-pop 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.at-set4-gallery-badge__line {
  display: block;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: 0.01em;
}

.at-set4-gallery-badge__line + .at-set4-gallery-badge__line {
  margin-top: 2px;
}

@keyframes at-set4-pop {
  0%   { transform: scale(0.5)  rotate(-14deg); opacity: 0; }
  60%  { transform: scale(1.08) rotate(-2deg);  opacity: 1; }
  100% { transform: scale(1)    rotate(-4deg);  opacity: 1; }
}

/* Tablet — slightly smaller but still bold */
@media (max-width: 1180px) {
  .at-set4-gallery-badge {
    top: 14px;
    inset-inline-end: 14px;
    padding: 12px 18px 13px;
    max-width: 210px;
    border-width: 2px;
  }
  .at-set4-gallery-badge__line { font-size: 17px; }
}

/* Mobile — keep it punchy without dominating the tire */
@media (max-width: 720px) {
  .at-set4-gallery-badge {
    top: 12px;
    inset-inline-end: 12px;
    padding: 10px 16px 11px;
    border-radius: 12px;
    border-width: 2px;
    max-width: 180px;
  }
  .at-set4-gallery-badge__line { font-size: 15px; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .at-set4-gallery-badge { animation: none; }
}

/* ------------------------------------------------------------
 * Pin the WC zoom trigger to the RIGHT corner of the gallery
 * (WooCommerce's woocommerce-rtl.css flips it to the left edge
 * — we want it opposite the .at-set4-gallery-badge sticker).
 * ------------------------------------------------------------ */
.at-product__gallery .woocommerce-product-gallery__trigger {
  left: auto !important;
  right: 0.75rem !important;
  top: 0.75rem !important;
  z-index: 6;                    /* above the badge if they ever cross paths */
}

/* Info column — increased block spacing to match Touchstore rhythm. */
.at-product__info { padding: 0.5rem 0; }

/* H1 — Touchstore-style: 22-28px, bold but not huge */
.at-product__info .wp-block-post-title,
.at-product__info h1.product_title {
  font-size: clamp(1.25rem, 2vw, 1.625rem) !important;  /* 20-26px */
  font-weight: 700 !important;
  line-height: 1.3;
  color: var(--wp--preset--color--navy, #193348);
  margin-block: 0.25rem 0.4rem;
}

/* Price values — readable but not overwhelming */
.at-product__info .at-price__value {
  font-size: 1.125rem !important;       /* 18px */
}
.at-product__info .at-price__label {
  font-size: 0.8125rem !important;      /* 13px */
}
.at-product__info .at-price-block {
  margin-block: 0.875rem 0.5rem;
}

/* Tighter vertical rhythm between blocks */
.at-product__info > * + * {
  margin-block-start: 0.875rem;
}
.at-product__info .at-stock-badge,
.at-product__info .at-price-block,
.at-product__info form.cart {
  margin-block-start: 0.875rem;
}
.at-product__brand {
  margin: 0 0 0.5rem;
  font-size: 1.625rem;                  /* 26px — was 12px (bumped 2026-05-28) */
  font-weight: 900;
  color: var(--wp--preset--color--primary-dark);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  line-height: 1.15;
}
.at-product__size {
  margin: 0 0 0.6rem;
  color: var(--wp--preset--color--muted-foreground);
  font-size: 0.875rem;                  /* 14px */
}
.at-product__size strong {
  color: var(--wp--preset--color--navy);
  font-weight: 700;
}

/* Compat line — also a tad smaller */
.at-product__info .at-compat-line { font-size: 0.8125rem; padding: 0.5rem 0.75rem; }

/* Star rating row */
.at-product__rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.4rem 0 0.75rem;
  font-size: 0.8125rem;                 /* 13px */
  color: var(--wp--preset--color--muted-foreground);
}
.at-product__rating-stars { display: inline-flex; gap: 1px; }
.at-product__star { font-size: 1rem; line-height: 1; }
.at-product__star.is-on  { color: var(--wp--preset--color--accent-yellow); }
.at-product__star.is-off { color: var(--wp--preset--color--border); }
.at-product__rating-value {
  color: var(--wp--preset--color--navy);
  font-weight: 700;
}

/* Selling-point bullet list. */
.at-product__bullets {
  list-style: none;
  margin: 1rem 0 1.25rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.at-product__bullets li {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  color: var(--wp--preset--color--foreground);
  font-size: 0.9375rem;
}
.at-product__bullet-mark {
  display: inline-grid;
  place-items: center;
  width: 22px; height: 22px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--wp--preset--color--primary) 18%, #fff);
  color: var(--wp--preset--color--primary-dark);
  font-size: 0.75rem;
  font-weight: 800;
  flex-shrink: 0;
}

/* Add to cart form — navy CTA button + matching qty input. */
.at-product__info .wp-block-woocommerce-add-to-cart-form,
.at-product__info form.cart {
  /* Override WC block's grid so we control the layout via flex. */
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.625rem;
  align-items: center;
  margin: 1rem 0;
}
/* The WC block wraps the form in a div; keep that wrapper out of the way. */
.at-product__info .wc-block-add-to-cart-form {
  width: 100%;
}
.at-product__info form.cart .quantity {
  display: flex;
  align-items: center;
  background: var(--wp--preset--color--muted);
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 10px;
  padding: 0 0.375rem;
  height: 48px;
  flex-shrink: 0;
}
.at-product__info form.cart .quantity input[type="number"] {
  width: 52px;
  height: 100%;
  text-align: center;
  background: transparent;
  border: 0;
  font: inherit;
  font-weight: 700;
  font-size: 1rem;
  color: var(--wp--preset--color--navy);
  -moz-appearance: textfield;
}
.at-product__info form.cart .quantity input::-webkit-outer-spin-button,
.at-product__info form.cart .quantity input::-webkit-inner-spin-button {
  -webkit-appearance: none; margin: 0;
}
/* Navy CTA — compact, sits in one row with qty + buy-now */
.at-product__info form.cart .single_add_to_cart_button,
.at-product__info button[name="add-to-cart"] {
  flex: 1 1 0;
  min-width: 10rem;
  height: 42px;                         /* tighter — was 48 */
  background: var(--wp--preset--color--navy);
  color: #fff;
  border: 0;
  border-radius: 10px;
  padding: 0 1rem;
  font: inherit;
  font-weight: 700;
  font-size: 0.9375rem;                 /* 15px */
  line-height: 1;
  cursor: pointer;
  transition: background .15s;
  white-space: nowrap;
  grid-column: unset !important;
  justify-self: unset !important;
}
/* Buy-now in same flex row, slightly smaller */
.at-product__info .at-buy-now-button {
  flex: 1 1 0;
  min-width: 9rem;
  height: 42px;
  font-size: 0.9375rem;
  margin-top: 0;
}
/* Qty stepper matching height */
.at-product__info form.cart .quantity { height: 42px; }
/* WC's long screen-reader qty label is sometimes visible on block themes —
   force-hide it accessibly. */
.at-product__info form.cart .screen-reader-text,
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}
.at-product__info form.cart .single_add_to_cart_button:hover,
.at-product__info button[name="add-to-cart"]:hover {
  background: var(--wp--preset--color--primary-dark);
}
@media (max-width: 600px) {
  .at-product__info form.cart .single_add_to_cart_button,
  .at-product__info button[name="add-to-cart"] {
    height: 56px;
    font-size: 1.05rem;
  }
}

/* NOTE: Old horizontal-trust-row rules removed 2026-05-27.
   They targeted `.at-product__trust` itself with display:grid + repeat(3, 1fr)
   + margin-top/padding-top/border-top, overriding the new vertical sidebar
   layout from earlier in this file (line ~1822) and adding 48px of empty
   space + a horizontal line above the trust badges. The HTML no longer uses
   `.at-product__trust-item` / `.at-product__trust-icon`; the new trust strip
   renders via the `[autotire_trust_strip]` shortcode which outputs
   `<ul class="at-trust-strip"><li class="at-trust-strip__item">...`. */

/* Details + description two-column. */
.at-product__details {
  background: var(--wp--preset--color--muted);
  padding: 3rem clamp(1rem, 4vw, 2.5rem);
}
.at-product__details-rail {
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 2rem;
  align-items: start;
}
@media (max-width: 880px) {
  .at-product__details-rail { grid-template-columns: 1fr; }
}
.at-product__specs,
.at-product__desc {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 12px;
  padding: 1.5rem;
}
.at-product__specs h2,
.at-product__desc h2 {
  color: var(--wp--preset--color--navy);
  font-size: 1.125rem;
  margin: 0 0 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--wp--preset--color--border);
}
.at-product__specs-table { display: flex; flex-direction: column; }
.at-spec-row {
  display: flex;
  justify-content: space-between;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--wp--preset--color--border);
  font-size: 0.9375rem;
}
.at-spec-row:last-child { border-bottom: 0; }
.at-spec-row__label { color: var(--wp--preset--color--muted-foreground); }
.at-spec-row__value { color: var(--wp--preset--color--navy); font-weight: 700; }

.at-product__desc p { line-height: 1.65; color: var(--wp--preset--color--foreground); }

/* Related products. */
.at-product__related { padding: 3rem clamp(1rem, 4vw, 2.5rem); }
.at-product__related-rail { width: 100%; max-width: 1400px; margin-inline: auto; }
.at-product__related h2 {
  color: var(--wp--preset--color--navy);
  font-size: 1.5rem;
  margin: 0 0 1.5rem;
  text-align: center;
}

/* ---------- Imported SEO landing page polish ---------- */
.wp-block-post-content {
  max-width: 920px;
  margin-inline: auto;
  padding: 0 clamp(1rem, 4vw, 2.5rem);
}
.wp-block-post-content p { line-height: 1.7; color: var(--wp--preset--color--foreground); }
.wp-block-post-content h1,
.wp-block-post-content h2,
.wp-block-post-content h3 {
  color: var(--wp--preset--color--navy);
  margin: 1.75rem 0 0.5rem;
}
.wp-block-post-content h2 { font-size: clamp(1.375rem, 2.4vw, 1.75rem); font-weight: 800; }
.wp-block-post-content h3 { font-size: 1.125rem; font-weight: 700; }
.wp-block-post-content a  { color: var(--wp--preset--color--primary-dark); }
.wp-block-post-content table {
  border-collapse: collapse;
  margin: 1rem 0;
  /* Legacy ASP content uses border=0 layout tables for centering copy.
     Strip the visual table frame so they render as plain text blocks. */
  border: 0;
  width: 100%;
}
.wp-block-post-content table[border="0"] {
  /* Layout table — collapse to a flat block; preserve text content. */
  display: block;
}
.wp-block-post-content table[border="0"] tr {
  display: block;
}
.wp-block-post-content table[border="0"] td {
  display: block;
  border: 0;
  padding: 0.25rem 0;
}
.wp-block-post-content table:not([border="0"]) td,
.wp-block-post-content table:not([border="0"]) th {
  border: 1px solid var(--wp--preset--color--border);
  padding: 0.5rem 0.75rem;
  font-size: 0.9rem;
}

.at-landing-cta {
  margin: 2rem 0 1rem;
  padding: 1.25rem;
  text-align: center;
  background: var(--wp--preset--color--muted);
  border-radius: 12px;
}
.at-landing-cta .wp-element-button {
  padding: 0.875rem 1.5rem;
  border-radius: 12px;
  font-weight: 800;
  text-decoration: none;
}

/* =====================================================================
 * VEHICLE FIT LANDING — /צמיגים-ל{make}/ model / year / size guide
 * Modern card grid: 3 columns per row (model | years | sizes).
 * ===================================================================== */

body.has-at-vehicle-fit #at-content > .wp-block-post-title {
  display: none !important;
}

body.has-at-vehicle-fit .wp-site-blocks,
body.has-at-vehicle-fit #at-content,
body.has-at-vehicle-fit .wp-block-post-content,
body.has-at-vehicle-fit .at-vehicle-fit {
  max-width: none !important;
  width: 100% !important;
}

.at-vehicle-fit {
  background: var(--wp--preset--color--background, #fff);
  padding-bottom: clamp(2rem, 4vw, 3rem);
  box-sizing: border-box;
}

.at-vehicle-fit__hero {
  background:
    radial-gradient(1100px 380px at 100% 0%, rgba(30, 189, 227, 0.12), transparent 58%),
    radial-gradient(900px 320px at 0% 100%, rgba(255, 209, 0, 0.1), transparent 62%),
    linear-gradient(180deg, var(--at-muted, #EFF2F5) 0%, #fff 100%);
  border-bottom: 1px solid var(--at-border, #DFE6EB);
  padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1rem, 3vw, 2.5rem);
}

.at-vehicle-fit__hero-inner {
  max-width: var(--at-max-width, 1140px);
  margin: 0 auto;
  text-align: center;
}

.at-vehicle-fit__title {
  margin: 0 0 1rem;
  font-size: clamp(1.625rem, 3.2vw, 2.125rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--at-navy, #193348);
  line-height: 1.25;
}

.at-vehicle-fit__tip {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  margin: 0 auto;
  padding: 0.625rem 1.125rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #9a3412;
  background: rgba(254, 226, 226, 0.65);
  border: 1px solid rgba(248, 113, 113, 0.35);
  border-radius: 999px;
  line-height: 1.4;
}

.at-vehicle-fit__tip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 1.375rem;
  border-radius: 50%;
  background: #ef4444;
  color: #fff;
  font-size: 0.8125rem;
  font-weight: 800;
  flex-shrink: 0;
}

.at-vehicle-fit__panel {
  max-width: var(--at-max-width, 1140px);
  margin: clamp(1.25rem, 3vw, 2rem) auto 0;
  padding-inline: clamp(1rem, 3vw, 2.5rem);
  box-sizing: border-box;
}

.at-vehicle-fit__colheads {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.1fr) minmax(0, 1.45fr);
  gap: 0.75rem;
  padding: 0 1.25rem 0.625rem;
}

.at-vehicle-fit__colhead {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--at-navy, #193348);
  opacity: 0.55;
}

.at-vehicle-fit__grid {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.at-vehicle-fit__model-group {
  background: #fff;
  border: 1px solid var(--at-border, #DFE6EB);
  border-radius: 14px;
  box-shadow: 0 2px 12px -4px rgba(15, 30, 60, 0.08);
  overflow: hidden;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.at-vehicle-fit__model-group:hover {
  border-color: rgba(30, 189, 227, 0.45);
  box-shadow: 0 8px 28px -10px rgba(15, 30, 60, 0.14);
  transform: translateY(-1px);
}

/* Desktop: model | years | sizes grid */
@media (min-width: 901px) {
  .at-vehicle-fit__model-group {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 2fr);
    align-items: stretch;
  }

  .at-vehicle-fit__model-heading {
    grid-column: 1;
    grid-row: 1 / -1;
    margin: 0;
    padding: 1.125rem 1.25rem;
    padding-inline-start: calc(1.25rem + 0.75rem);
    display: flex;
    align-items: center;
    font-size: clamp(1.0625rem, 1.8vw, 1.3125rem);
    font-weight: 800;
    line-height: 1.35;
    color: var(--at-navy, #193348);
    background: linear-gradient(135deg, rgba(30, 189, 227, 0.06) 0%, rgba(255, 255, 255, 0) 100%);
    border-inline-end: 1px solid var(--at-border, #DFE6EB);
    position: relative;
  }

  .at-vehicle-fit__model-heading::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 0.875rem;
    bottom: 0.875rem;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--at-primary, #1EBDE3);
  }

  .at-vehicle-fit__ranges {
    grid-column: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  }

  .at-vehicle-fit__range {
    display: contents;
  }

  .at-vehicle-fit__year-line {
    padding: 1.125rem 1.25rem;
    border-bottom: 1px solid var(--at-border, #DFE6EB);
    border-inline-end: 1px solid var(--at-border, #DFE6EB);
    margin: 0;
    display: flex;
    align-items: center;
  }

  .at-vehicle-fit__size-list {
    padding: 1.125rem 1.25rem;
    border-bottom: 1px solid var(--at-border, #DFE6EB);
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
  }

  .at-vehicle-fit__range:last-child .at-vehicle-fit__year-line,
  .at-vehicle-fit__range:last-child .at-vehicle-fit__size-list {
    border-bottom: 0;
  }
}

.at-vehicle-fit__year-line {
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.5;
  color: var(--at-navy, #193348);
}

.at-vehicle-fit__size-link {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  text-decoration: none;
  transition: color 0.14s ease, background 0.14s ease, transform 0.14s ease;
}

a.at-vehicle-fit__size-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.5rem;
  padding: 0.45rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--at-navy, #193348);
  background: var(--at-muted, #EFF2F5);
  border: 1px solid var(--at-border, #DFE6EB);
  border-radius: 8px;
}

a.at-vehicle-fit__size-link:hover {
  color: #fff;
  background: var(--at-primary, #1EBDE3);
  border-color: var(--at-primary-dark, #00A0D7);
  transform: translateY(-1px);
}

.at-vehicle-fit__size-link--text {
  display: inline-block;
  font-size: 0.875rem;
  color: var(--at-navy, #193348);
}

.at-vehicle-fit__size-link--empty {
  opacity: 0.45;
}

.at-vehicle-fit__cta {
  max-width: var(--at-max-width, 1140px);
  margin: 2rem auto 0;
  padding-inline: clamp(1rem, 3vw, 2.5rem);
  text-align: center;
}

.at-vehicle-fit__cta .wp-element-button {
  padding: 0.875rem 1.75rem;
  border-radius: 12px;
  font-weight: 800;
  box-shadow: 0 4px 14px -4px rgba(255, 193, 7, 0.55);
}

@media (max-width: 900px) {
  .at-vehicle-fit {
    padding-bottom: 1.5rem;
  }

  .at-vehicle-fit__hero {
    background: #fff;
    border-bottom: 0;
    padding: 1.25rem 1rem 0.5rem;
  }

  .at-vehicle-fit__hero-inner {
    text-align: start;
  }

  .at-vehicle-fit__title {
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
  }

  .at-vehicle-fit__tip {
    display: block;
    padding: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #c0392b;
    background: transparent;
    border: 0;
    border-radius: 0;
    line-height: 1.5;
  }

  .at-vehicle-fit__tip-icon {
    display: none;
  }

  .at-vehicle-fit__panel {
    margin-top: 0.75rem;
    padding-inline: 0;
  }

  .at-vehicle-fit__colheads {
    display: none;
  }

  .at-vehicle-fit__grid {
    gap: 0;
  }

  .at-vehicle-fit__model-group {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: #fafafa;
    border-bottom: 1px solid #e3e3e3;
    padding: 1rem 1.125rem 1.125rem;
    transform: none;
  }

  .at-vehicle-fit__model-group:hover {
    border-color: #e3e3e3;
    box-shadow: none;
    transform: none;
  }

  .at-vehicle-fit__model-group:first-child {
    border-top: 1px solid #e3e3e3;
  }

  .at-vehicle-fit__model-heading {
    margin: 0 0 0.625rem;
    padding: 0;
    padding-inline-start: 0;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.35;
    color: #111;
    background: transparent;
    border: 0;
  }

  .at-vehicle-fit__model-heading::before {
    display: none;
  }

  .at-vehicle-fit__range {
    display: block;
    padding-top: 0.75rem;
    margin-top: 0.75rem;
    border-top: 1px solid #e3e3e3;
  }

  .at-vehicle-fit__range:first-child {
    padding-top: 0;
    margin-top: 0;
    border-top: 0;
  }

  .at-vehicle-fit__year-line {
    margin: 0 0 0.5rem;
    padding: 0;
    border: 0;
    font-size: 1rem;
    font-weight: 400;
    color: #222;
  }

  .at-vehicle-fit__size-list {
    padding: 0;
    border: 0;
    display: block;
  }

  a.at-vehicle-fit__size-link {
    display: block;
    min-width: 0;
    margin: 0;
    padding: 0.25rem 0;
    font-size: 1rem;
    font-weight: 400;
    color: #0066cc;
    text-decoration: underline;
    background: transparent;
    border: 0;
    border-radius: 0;
    transform: none;
  }

  a.at-vehicle-fit__size-link:hover {
    color: #004999;
    background: transparent;
    transform: none;
  }

  .at-vehicle-fit__size-link--text {
    display: block;
    padding: 0.25rem 0;
    font-size: 1rem;
  }

  .at-vehicle-fit__cta {
    padding-inline: 1rem;
  }
}

/* =====================================================================
 * BRAND LANDING PAGE — premium hero / catalog / about / advantages
 * Rendered by autotire_render_brand_landing_page() in autotire-core.
 * Replaces the scraped legacy content on /צמיגי-<brand>/ pages.
 * ===================================================================== */

/* Block themes inject a `<h1 class="wp-block-post-title">` block above the
   post_content (see templates/page.html). Our hero already renders a bigger
   H1, so hide only that page-level title — NOT product card titles inside
   the Product Collection grid. */
body.has-at-brand-landing #at-content > .wp-block-post-title {
  display: none !important;
}

/* Full-bleed brand landing — strip every block-theme width cap on the path
   from .wp-site-blocks down to .at-brand-page (see templates/page.html). */
body.has-at-brand-landing .wp-site-blocks,
body.has-at-brand-landing #at-content,
body.has-at-brand-landing .wp-block-post-content,
body.has-at-brand-landing .at-brand-page {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

.at-brand-page {
  display: block;
  background: var(--wp--preset--color--background, #fff);
}

/* Section bands span the full viewport; only inner copy gets side gutters */
.at-brand-page__hero,
.at-brand-page__about,
.at-brand-page__advantages,
.at-brand-page__catalog {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.at-brand-page__hero-inner,
.at-brand-page__about-inner,
.at-brand-page__advantages-inner {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: clamp(1rem, 3vw, 2.5rem);
  box-sizing: border-box;
}

.at-brand-page__catalog {
  padding-inline: clamp(1rem, 3vw, 2.5rem);
}

/* ---------- HERO ---------- */
.at-brand-page__hero {
  background:
    radial-gradient(1200px 400px at 100% 0%, rgba(6,182,212,0.10), transparent 60%),
    radial-gradient(900px 300px at 0% 100%, rgba(255,209,0,0.12), transparent 65%),
    var(--wp--preset--color--muted, #EFF2F5);
  padding: clamp(1.5rem, 3vw, 2.25rem) 0 clamp(1rem, 2vw, 1.5rem);
  border-bottom: 1px solid var(--wp--preset--color--border, #DFE6EB);
}
.at-brand-page__title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  flex-wrap: wrap;
  margin-bottom: 0.625rem;
}
.at-brand-page__title-row .at-brand-page__title {
  margin: 0;
  flex: 1 1 auto;
  min-width: min(100%, 16rem);
}
.at-brand-page__eyebrow {
  display: inline-block;
  margin: 0;
  flex: 0 0 auto;
  align-self: center;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  text-transform: uppercase;
  background: #fff;
  padding: 0.3125rem 0.75rem;
  border-radius: 999px;
  border: 1px solid rgba(6,182,212,0.25);
  white-space: nowrap;
}
.at-brand-page__title {
  margin: 0 0 1rem;
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-weight: 900;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  line-height: 1.1;
  letter-spacing: -0.015em;
}
.at-brand-page__lede {
  max-width: none;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  line-height: 1.7;
}
.at-brand-page__lede p {
  margin: 0 0 0.625rem;
}
.at-brand-page__lede strong {
  color: var(--wp--preset--color--primary-dark, #00A0D7);
}

.at-brand-page__finder-wrap {
  /* Same horizontal rhythm as homepage: .at-hero padding + .at-hero__inner */
  width: 100%;
  max-width: 1100px;
  margin: 0 auto 1rem;
  padding-inline: clamp(1rem, 4vw, 3rem);
  box-sizing: border-box;
}

@media (max-width: 900px) {
  .at-brand-page__finder-wrap {
    margin-bottom: 0.75rem;
  }
}

/* Imported SEO prose from legacy autotire.co.il brand pages */
.at-brand-page__legacy-content {
  max-width: none;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  font-size: clamp(1rem, 1.2vw, 1.0625rem);
  line-height: 1.75;
  text-align: start;
}
.at-brand-page__about .at-brand-page__legacy-content {
  text-align: center;
}
.at-brand-page__legacy-content p,
.at-brand-page__legacy-content li {
  margin: 0 0 0.875rem;
}
.at-brand-page__legacy-content p:last-child,
.at-brand-page__legacy-content ul:last-child,
.at-brand-page__legacy-content ol:last-child {
  margin-bottom: 0;
}
.at-brand-page__legacy-content h2,
.at-brand-page__legacy-content h3,
.at-brand-page__legacy-content h4 {
  margin: 1.25rem 0 0.625rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  line-height: 1.3;
}
.at-brand-page__legacy-content ul,
.at-brand-page__legacy-content ol {
  margin: 0 0 1rem;
  padding-inline-start: 1.25rem;
  text-align: start;
}
.at-brand-page__legacy-content strong {
  color: var(--wp--preset--color--primary-dark, #00A0D7);
}
.at-brand-page__legacy-content a {
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Rally chip — bold inline CTA-style sentence; --link variant scrolls to catalog */
.at-brand-page__rally {
  margin-top: 0.875rem;
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.75rem 1.125rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #0F1E3C 0%, #1A2B4A 100%);
  color: #fff;
  font-weight: 800;
  font-size: clamp(0.9375rem, 1.1vw, 1.0625rem);
  box-shadow: 0 8px 22px -8px rgba(15, 30, 60, 0.45);
}
a.at-brand-page__rally--link {
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
a.at-brand-page__rally--link:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px -10px rgba(15, 30, 60, 0.55);
  color: #fff;
}
.at-brand-page__rally-arrow {
  font-size: 1.125rem;
  line-height: 1;
  opacity: 0.85;
  animation: at-brand-rally-bounce 1.6s ease-in-out infinite;
}
@keyframes at-brand-rally-bounce {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(3px); }
}

/* Catalog anchor — offset for sticky header when jumping from hero CTA */
#at-brand-catalog {
  scroll-margin-top: 5.5rem;
}

.at-brand-page__rally strong { color: var(--wp--preset--color--accent-yellow, #FFD100); }
.at-brand-page__rally-emoji  { font-size: 1.25em; line-height: 1; }

/* ---------- CATALOG ---------- */
.at-brand-page__catalog {
  padding-block: clamp(0.75rem, 1.5vw, 1.25rem) clamp(2.5rem, 5vw, 4rem);
}
.at-brand-page__catalog-rail {
  max-width: none;
  width: 100%;
}
.at-brand-page__catalog-main {
  min-width: 0;
}
.at-brand-page__catalog-topbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 1rem;
  padding: 0.875rem 1rem;
  background: #fff;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: var(--at-radius);
}
.at-brand-page__catalog-heading {
  margin: 0 0 0.125rem;
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 900;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  line-height: 1.2;
}
.at-brand-page__catalog-topbar .at-brand-page__catalog-note {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}
.at-brand-page__catalog-topbar .at-brand-page__result-count {
  margin: 0;
  margin-inline-start: auto;
}
.at-brand-page__catalog .wp-block-woocommerce-product-collection {
  margin-top: 0;
}

@media (max-width: 980px) {
  .at-brand-page__catalog-rail {
    grid-template-columns: 1fr;
  }
  .at-brand-page__catalog-rail .at-cat-filter {
    order: 2;
  }
  .at-brand-page__catalog-main {
    order: 1;
  }
}

/* ---------- BRAND PAGE — unified catalog + filter box ---------- */
.at-brand-finder {
  margin: 0 0 1rem;
  padding: 0;
  background:
    linear-gradient(135deg, rgba(6,182,212,0.06) 0%, rgba(255,209,0,0.05) 100%),
    #fff;
  border: 1px solid rgba(6, 182, 212, 0.22);
  border-radius: 14px;
  box-shadow: 0 8px 24px -14px rgba(15, 30, 60, 0.2);
  overflow: hidden;
}

.at-brand-finder__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  padding: 0.875rem 1rem 0.75rem;
  border-bottom: 1px solid rgba(15, 30, 60, 0.06);
}

.at-brand-finder__intro {
  flex: 1 1 auto;
  min-width: 0;
}

.at-brand-finder__catalog-title {
  margin: 0 0 0.125rem;
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 900;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.at-brand-finder__catalog-note {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  line-height: 1.4;
}

.at-brand-finder__brand-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 0.3125rem 0.75rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #0F1E3C 0%, #1A2B4A 100%);
  color: var(--wp--preset--color--accent-yellow, #FFD100);
  font-size: 0.8125rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  white-space: nowrap;
  box-shadow: 0 4px 12px -6px rgba(15, 30, 60, 0.45);
}

/* Toolbar: [סינון לפי מידה] [width / aspect R diameter] [button] */
.at-brand-finder__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.625rem 0.875rem;
  padding: 0.75rem 1rem;
}

.at-brand-finder__filter-label {
  flex: 0 0 auto;
  align-self: center;
  font-size: 0.8125rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  white-space: nowrap;
  padding-bottom: 0.375rem;
}

.at-brand-finder__form {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.625rem 0.875rem;
  min-width: min(100%, 20rem);
  padding: 0;
  margin: 0;
}

.at-brand-finder__size-row {
  display: flex;
  flex: 1 1 auto;
  align-items: flex-end;
  gap: 0.375rem;
  min-width: min(100%, 28rem);
}

.at-brand-finder__field {
  flex: 1 1 0;
  min-width: 4.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.at-brand-finder__label {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}

.at-brand-finder__select {
  width: 100%;
  height: 2.75rem;
  padding: 0 0.75rem;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-size: 1rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  text-align: center;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235A656E' d='M1.4.6 6 5.2 10.6.6 12 2l-6 6-6-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 0.625rem center;
  padding-inline: 1.75rem 0.5rem;
}

.at-brand-finder__select:focus {
  outline: none;
  border-color: var(--wp--preset--color--primary, #06B6D4);
  box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.18);
}

.at-brand-finder__select:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  background-color: var(--wp--preset--color--muted, #EFF2F5);
}

.at-brand-finder__sep {
  flex: 0 0 auto;
  align-self: flex-end;
  padding-bottom: 0.625rem;
  font-size: 1.375rem;
  font-weight: 300;
  line-height: 1;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  user-select: none;
}

.at-brand-finder__sep--r {
  font-size: 1rem;
  font-weight: 800;
  padding-bottom: 0.75rem;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
}

.at-brand-finder__cta {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  height: 2.75rem;
  padding: 0 1.375rem;
  border: 0;
  border-radius: 10px;
  background: var(--wp--preset--color--primary, #06B6D4);
  color: #fff;
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease, transform 0.12s ease, box-shadow 0.15s ease;
  box-shadow: 0 6px 16px -8px rgba(6, 182, 212, 0.65);
}

.at-brand-finder__cta:hover:not(:disabled) {
  background: var(--wp--preset--color--primary-dark, #00A0D7);
  transform: translateY(-1px);
}

.at-brand-finder__cta:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  box-shadow: none;
}

.at-brand-finder__cta-icon {
  font-size: 1.0625rem;
  line-height: 1;
}

.at-brand-finder__shop-link {
  flex: 0 0 auto;
  align-self: center;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  text-decoration: none;
  white-space: nowrap;
}

.at-brand-finder__shop-link:hover {
  text-decoration: underline;
}

/* Override generic locked-step fade inside brand finder — keep fields visible */
.at-brand-finder .at-finder__step--locked .at-brand-finder__select {
  opacity: 0.55;
}

/* Active filters + result count — inside the unified finder box */
.at-brand-finder__meta.at-brand-page__filters-bar {
  margin: 0;
  padding: 0.5rem 1rem;
  background: rgba(15, 30, 60, 0.03);
  border: 0;
  border-top: 1px solid rgba(15, 30, 60, 0.06);
  border-radius: 0;
}

.at-brand-finder__meta.at-brand-page__filters-bar:not(.at-brand-page__filters-bar--active) {
  background: rgba(15, 30, 60, 0.03);
  border-top: 1px solid rgba(15, 30, 60, 0.06);
  padding: 0.5rem 1rem;
}

.at-brand-page__filters-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem 1rem;
  margin-bottom: 1.25rem;
  padding: 0.75rem 1rem;
  background: var(--wp--preset--color--muted, #EFF2F5);
  border-radius: 12px;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-brand-page__filters-bar:not(.at-brand-page__filters-bar--active) {
  background: transparent;
  border: 0;
  padding: 0 0 0.75rem;
  border-bottom: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: 0;
}

.at-brand-page__active-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.625rem;
}

.at-brand-page__catalog-main .at-brand-page__active-filters {
  margin-bottom: 1rem;
  padding: 0.625rem 0.875rem;
  background: var(--wp--preset--color--muted, #EFF2F5);
  border-radius: 10px;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-brand-page__filters-label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}

.at-brand-page__filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3125rem 0.625rem 0.3125rem 0.75rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(6, 182, 212, 0.35);
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  font-size: 0.875rem;
  font-weight: 800;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease;
  direction: ltr; /* tire size reads LTR: 205/55 R16 */
}

.at-brand-page__filter-chip:hover {
  background: rgba(6, 182, 212, 0.08);
  border-color: var(--wp--preset--color--primary, #06B6D4);
}

.at-brand-page__filter-chip-x {
  display: inline-grid;
  place-items: center;
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 50%;
  background: rgba(15, 30, 60, 0.08);
  font-size: 0.625rem;
  line-height: 1;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}

.at-brand-page__clear-filters {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  text-decoration: none;
}

.at-brand-page__clear-filters:hover {
  text-decoration: underline;
}

.at-brand-page__result-count {
  margin: 0;
  margin-inline-start: auto;
  font-size: 0.875rem;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}

.at-brand-page__result-count strong {
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  font-weight: 900;
}

@media (max-width: 860px) {
  .at-brand-finder__toolbar {
    flex-direction: column;
    align-items: stretch;
  }
  .at-brand-finder__filter-label {
    align-self: flex-start;
    padding-bottom: 0;
  }
  .at-brand-finder__form {
    flex-direction: column;
    align-items: stretch;
    min-width: 100%;
  }
  .at-brand-finder__size-row {
    min-width: 0;
    width: 100%;
  }
  .at-brand-finder__cta {
    width: 100%;
  }
}

@media (max-width: 540px) {
  .at-brand-finder__header {
    flex-direction: column;
    align-items: stretch;
    gap: 0.625rem;
  }
  .at-brand-finder__brand-badge {
    align-self: flex-start;
  }
  .at-brand-finder__size-row {
    flex-wrap: wrap;
    row-gap: 0.5rem;
  }
  .at-brand-finder__field {
    flex: 1 1 calc(33% - 1rem);
    min-width: 4rem;
  }
  .at-brand-finder__sep {
    display: none;
  }
  .at-brand-finder__meta.at-brand-page__filters-bar {
    flex-direction: column;
    align-items: flex-start;
  }
  .at-brand-page__result-count {
    margin-inline-start: 0;
  }
}

/* Brand-page catalog uses the same grid + card styles as the main shop
   (see global .wp-block-woocommerce-product-collection rules above). */

/* ---------- ABOUT ---------- */
.at-brand-page__about {
  background: #fff;
  padding: clamp(2rem, 4vw, 3.5rem) 0;
  border-top: 1px solid var(--wp--preset--color--border, #DFE6EB);
}
.at-brand-page__about-inner {
  text-align: center;
}
.at-brand-page__about p {
  margin: 0 0 1rem;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  font-size: 1.0625rem;
  line-height: 1.75;
}
.at-brand-page__about strong {
  color: var(--wp--preset--color--primary-dark, #00A0D7);
}
.at-brand-page__about-links {
  margin-top: 1.25rem !important;
  margin-bottom: 0 !important;
  font-size: 0.9375rem !important;
}
.at-brand-page__about-link {
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  font-weight: 600;
  text-decoration: none;
}
.at-brand-page__about-link:hover {
  text-decoration: underline;
}
.at-brand-page__about-links-sep {
  color: var(--wp--preset--color--muted-foreground, #6B7C93);
  margin-inline: 0.35rem;
}

/* ---------- ADVANTAGES ---------- */
.at-brand-page__advantages {
  background: linear-gradient(180deg, var(--wp--preset--color--muted, #EFF2F5) 0%, #fff 100%);
  padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(2.5rem, 5vw, 4rem);
}

.at-brand-page__adv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.25rem;
  margin-top: 1.5rem;
}

.at-adv-card {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: 16px;
  padding: 1.5rem 1.25rem 1.25rem;
  text-align: center;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.at-adv-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px -10px rgba(15, 30, 60, 0.18);
  border-color: rgba(6, 182, 212, 0.35);
}
.at-adv-card--legacy .at-adv-card__body {
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  font-size: 1rem;
  line-height: 1.65;
  font-weight: 600;
}

.at-adv-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin: 0 auto 0.875rem;
  background: linear-gradient(135deg, rgba(6,182,212,0.10), rgba(255,209,0,0.10));
  border-radius: 16px;
  font-size: 1.875rem;
  line-height: 1;
}
.at-adv-card__title {
  margin: 0 0 0.5rem;
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  line-height: 1.25;
}
.at-adv-card__body {
  margin: 0;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  font-size: 0.9375rem;
  line-height: 1.6;
}

/* ---------- SHARED ---------- */
.at-brand-page__h2 {
  margin: 0 0 0.5rem;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-weight: 900;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  line-height: 1.2;
  letter-spacing: -0.005em;
}
.at-brand-page__h2--center {
  text-align: center;
  margin-bottom: 1.25rem;
}
.at-brand-page__h2--center::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  margin: 0.625rem auto 0;
  background: linear-gradient(90deg, var(--wp--preset--color--primary, #06B6D4), var(--wp--preset--color--accent-yellow, #FFD100));
  border-radius: 999px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 720px) {
  .at-brand-page__rally {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}

@media (max-width: 600px) {
  .at-brand-page__hero { padding-top: 1.25rem; }
  .at-brand-page__title-row {
    flex-wrap: nowrap;
    gap: 0.5rem;
  }
  .at-brand-page__title-row .at-brand-page__title {
    font-size: clamp(1.5rem, 6vw, 1.875rem);
    min-width: 0;
  }
  .at-brand-page__eyebrow {
    font-size: 0.625rem;
    padding: 0.25rem 0.5rem;
    letter-spacing: 0.06em;
  }
  .at-brand-page__lede p { font-size: 0.9375rem; }
  .at-brand-page__about p { font-size: 0.9375rem; }
  .at-adv-card { padding: 1.125rem 1rem 1rem; }
  .at-adv-card__icon { width: 48px; height: 48px; font-size: 1.5rem; }
  .at-adv-card__title { font-size: 1rem; }
  .at-brand-page__adv-grid { gap: 0.875rem; }
}

/* ---------- Footer SEO link clusters — fully open, no dropdowns ---------- */
.at-seo-footer {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem 1.25rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(255,255,255,0.12);
  margin-bottom: 1.5rem;
}
.at-seo-footer__group { /* plain block — no card border / no toggle affordance */ }
.at-seo-footer__title {
  font-weight: 700;
  font-size: 0.95rem;
  color: #fff;
  margin: 0 0 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.18);
}
.at-seo-footer__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
.at-seo-footer__list li { margin: 0; }
.at-seo-footer__list a {
  color: rgba(255,255,255,0.75);
  text-decoration: none;
  font-size: 0.875rem;
  line-height: 1.6;
}
.at-seo-footer__list a:hover {
  color: var(--wp--preset--color--primary-light);
  text-decoration: underline;
}

/* ===================================================================== */
/* ===                  MOBILE NAV DRAWER                            === */
/* ===================================================================== */

/* Hamburger button — visible only below 900px where the nav wraps. */
.at-hamburger {
  display: none;
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 0.25rem;
  color: var(--wp--preset--color--navy);
  font-size: 1.5rem;
  line-height: 1;
  margin-inline-start: auto;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .at-hamburger {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline-start: 0;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border-radius: 10px;
    background: var(--wp--preset--color--muted, #eff2f5);
  }

  /* Overlay (z-index 199) sits above page content but below the header drawer
     (header z-index 201 when open) so submenu triggers and links stay clickable. */
  body.at-body--nav-open .at-header {
    z-index: 201;
  }

  /* Drawer: pinned to the RIGHT edge of viewport (the natural side for an
     RTL Hebrew site), hidden off-screen by `translateX(100%)`, slides in
     when `.at-nav--open` is added. Uses PHYSICAL `right: 0` not logical
     `inset-inline-end: 0` — the latter flips to the LEFT in RTL and then
     `translateX(100%)` would slide it INTO the viewport instead of out. */
  .at-nav {
    position: fixed !important;
    top: 0;
    right: 0;
    left: auto;
    width: min(320px, 92vw);
    height: 100dvh;
    background: var(--wp--preset--color--background, #fff);
    box-shadow: -4px 0 24px rgba(0,0,0,0.18);
    flex-direction: column;
    justify-content: flex-start;
    padding: 4rem 0 2rem;
    transform: translateX(100%);
    transition: transform 0.25s ease;
    z-index: 200;
    gap: 0;
    order: unset;
    border-top: 0;
    margin-top: 0;
    overflow-y: auto;
    flex: none;
    max-width: none;
  }
  .at-nav.at-nav--open {
    transform: translateX(0) !important;
  }
  .at-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
  }
  .at-nav__item {
    border-bottom: 1px solid var(--wp--preset--color--border, #e2e8f0);
  }
  .at-nav__link,
  .at-nav__trigger {
    width: 100%;
    justify-content: space-between;
    padding: 0.875rem 1.25rem;
    font-size: 1rem;
    white-space: normal;
    text-align: start;
  }
  .at-nav__dropdown {
    position: static;
    display: none;
    inset: auto;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    transition: none;
  }
  .at-nav__dropdown-inner {
    width: 100%;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .at-nav__dropdown--mega .at-nav__dropdown-inner,
  .at-nav__item--has-menu:not(.at-nav__item--mega) .at-nav__dropdown-inner {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    background: var(--at-muted, #EFF2F5);
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .at-nav__dropdown--mega .at-nav__panel--links {
    margin-inline: 0;
    padding-inline: 1.25rem;
    border-radius: 0;
  }
  .at-nav__item--has-menu.at-nav__item--open > .at-nav__dropdown {
    display: block;
  }
  .at-nav__item--mega .at-nav__dropdown-inner:has(> .at-nav__panel--links:first-child + .at-nav__panel--links) {
    display: block;
    grid-template-columns: 1fr;
  }
  .at-nav__item--mega .at-nav__dropdown-inner:has(> .at-nav__panel--links:first-child + .at-nav__panel--links) .at-nav__panel-list:not(.at-nav__panel-list--inline) {
    grid-template-columns: 1fr;
  }
  .at-nav__panel {
    padding: 0.5rem 1.25rem 0;
  }
  .at-nav__panel + .at-nav__panel {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--at-border, #DFE6EB);
  }
  .at-nav__columns--3,
  .at-nav__columns--4,
  .at-nav__columns--5,
  .at-nav__columns--2 {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .at-nav__col {
    border-inline-start: 0;
    padding-inline-start: 0;
  }
  .at-nav__col--extra {
    background: transparent;
    margin-inline-start: 0;
    padding: 0;
  }
  .at-nav__col a,
  .at-nav__panel-list a {
    font-size: 0.9375rem;
    padding: 0.45rem 0.625rem;
    margin-inline: 0;
  }
  .at-nav__panel-list--inline {
    flex-direction: column;
    gap: 0.25rem;
  }
  .at-nav__panel-list--inline a {
    border-radius: 8px;
    white-space: normal;
  }
  .at-nav-link {
    padding: 0.875rem 1.25rem;
    border-bottom: 1px solid var(--wp--preset--color--border);
    width: 100%;
    font-size: 1.0625rem;
  }
  /* Overlay behind the drawer */
  .at-nav-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(9,28,44,0.5);
    z-index: 199;
  }
  .at-nav-overlay.is-visible { display: block; }
}

@media (max-width: 1200px) and (min-width: 901px) {
  .at-nav__link,
  .at-nav__trigger {
    font-size: 0.8125rem;
  }
  .at-nav__list {
    gap: 0.25rem 0.75rem;
  }
}

@media (min-width: 901px) {
  .at-nav__item--has-menu.at-nav__item--open > .at-nav__trigger,
  .at-nav__item--has-menu:focus-within > .at-nav__trigger {
    color: var(--at-primary-dark, #00A0D7);
  }
}

/* ===================================================================== */
/* ===                  BRANCHES PAGE                                === */
/* ===================================================================== */

.at-branches {
  padding: clamp(2.5rem, 5vw, 4rem) clamp(1rem, 4vw, 2.5rem);
  background: var(--wp--preset--color--muted);
  min-height: 60vh;
}
.at-branches__rail {
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
}
.at-branches__intro { margin-bottom: 2rem; text-align: center; }
.at-branches__eyebrow {
  color: var(--wp--preset--color--primary-dark);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0;
}
.at-branches__h1 {
  color: var(--wp--preset--color--navy);
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-weight: 800;
  margin: 0.5rem 0 0.5rem;
  line-height: 1.15;
}
.at-branches__sub {
  color: var(--wp--preset--color--muted-foreground);
  font-size: 1.0625rem;
  margin: 0;
}

/* Search input */
.at-branches__search-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 2.5rem;
}
.at-branches__search {
  width: 100%;
  max-width: 480px;
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 999px;
  padding: 0.75rem 1.25rem;
  font: inherit;
  font-size: 1rem;
  color: var(--wp--preset--color--foreground);
  box-shadow: var(--at-shadow-soft);
}
.at-branches__search:focus {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

/* Region heading */
.at-branches__region { margin-bottom: 2.5rem; }
.at-branches__region-title {
  color: var(--wp--preset--color--navy);
  font-size: 1.25rem;
  font-weight: 800;
  margin: 0 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--wp--preset--color--primary);
  display: inline-block;
}

/* Cards grid */
.at-branches__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.25rem;
}

/* Individual branch card */
.at-branch-card {
  background: #fff;
  border-radius: var(--at-radius);
  box-shadow: var(--at-shadow-card);
  padding: 1.25rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.at-branch-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px -16px rgba(15,30,60,0.28);
}
.at-branch-card__city {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary-dark);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
}
.at-branch-card__name {
  color: var(--wp--preset--color--navy);
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0 0 0.25rem;
}
.at-branch-card__address {
  font-style: normal;
  font-size: 0.875rem;
  color: var(--wp--preset--color--muted-foreground);
}
.at-branch-card__address-placeholder {
  font-style: italic;
  color: var(--wp--preset--color--border);
  font-size: 0.8125rem;
}
.at-branch-card__phone {
  color: var(--wp--preset--color--primary-dark);
  font-weight: 700;
  font-size: 0.9375rem;
  text-decoration: none;
}
.at-branch-card__phone:hover { text-decoration: underline; }
.at-branch-card__hours {
  font-size: 0.8125rem;
  color: var(--wp--preset--color--muted-foreground);
  margin: 0;
}
.at-branch-card__cta {
  margin-top: auto;
  padding-top: 0.875rem;
  background: var(--wp--preset--color--primary);
  color: #fff;
  border: 0;
  border-radius: 10px;
  padding: 0.625rem 1rem;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s;
  text-align: center;
}
.at-branch-card__cta:hover { background: var(--wp--preset--color--primary-dark); }
.at-branch-card__cta.is-selected {
  background: var(--wp--preset--color--navy);
}

/* ===================================================================== */
/* ===                  ABOUT PAGE                                   === */
/* ===================================================================== */

.at-about__hero {
  background: var(--wp--preset--gradient--hero);
  color: #fff;
  padding: clamp(3rem, 6vw, 5rem) clamp(1rem, 4vw, 2.5rem);
  text-align: center;
}
.at-about__hero-inner {
  max-width: 800px;
  margin-inline: auto;
}
.at-about__eyebrow {
  color: var(--wp--preset--color--primary-light);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 0.75rem;
}
.at-about__h1 {
  color: #fff;
  font-size: clamp(2rem, 4.5vw, 3.25rem);
  font-weight: 800;
  margin: 0 0 1rem;
  line-height: 1.1;
}
.at-about__sub {
  color: rgba(255,255,255,0.88);
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  line-height: 1.55;
  margin: 0;
  max-width: 640px;
  margin-inline: auto;
}

/* Stats strip */
.at-about__stats {
  background: var(--wp--preset--color--navy);
  padding: 2rem clamp(1rem, 4vw, 2.5rem);
}
.at-about__stats-rail {
  width: 100%;
  max-width: 1000px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  text-align: center;
}
@media (max-width: 640px) {
  .at-about__stats-rail { grid-template-columns: repeat(2, 1fr); }
}
.at-about__stat-value {
  display: block;
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 800;
  color: var(--wp--preset--color--primary-light);
  line-height: 1.1;
}
.at-about__stat-label {
  display: block;
  font-size: 0.875rem;
  color: rgba(255,255,255,0.75);
  margin-top: 0.25rem;
}

/* Pillars cards */
.at-about__pillars {
  padding: clamp(2.5rem, 5vw, 4rem) clamp(1rem, 4vw, 2.5rem);
  background: var(--wp--preset--color--muted);
}
.at-about__pillars-rail {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
@media (max-width: 780px) {
  .at-about__pillars-rail { grid-template-columns: 1fr; }
}
.at-about__pillar-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy);
  margin: 0 0 0.5rem;
}

/* About page body content */
.at-about__content {
  padding: clamp(2.5rem, 5vw, 4rem) clamp(1rem, 4vw, 2.5rem);
}

/* Trust trio (reuses .at-card but in a 3-col grid) */
.at-about__trust {
  background: var(--wp--preset--color--muted);
  padding: clamp(2.5rem, 5vw, 4rem) clamp(1rem, 4vw, 2.5rem);
}
.at-about__trust-rail {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
@media (max-width: 780px) {
  .at-about__trust-rail { grid-template-columns: 1fr; }
}
.at-about__trust-rail h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy);
  margin: 0 0 0.5rem;
}

/* ===================================================================== */
/* ===                  CONTACT PAGE                                 === */
/* ===================================================================== */

.at-contact {
  padding: clamp(2.5rem, 5vw, 4rem) clamp(1rem, 4vw, 2.5rem);
  background: var(--wp--preset--color--muted);
  min-height: 60vh;
}
.at-contact__rail {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
}
@media (max-width: 780px) {
  .at-contact__rail { grid-template-columns: 1fr; }
}

/* Form column */
.at-contact__h1 {
  color: var(--wp--preset--color--navy);
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 800;
  margin: 0 0 0.5rem;
  line-height: 1.15;
}
.at-contact__intro {
  color: var(--wp--preset--color--muted-foreground);
  margin: 0 0 1.5rem;
  line-height: 1.55;
}

/* CF7 form fields inherit global input styles; tighten for contact page */
.at-contact__form-col .wpcf7-form label {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--wp--preset--color--navy);
  margin-bottom: 0.25rem;
  margin-top: 0.75rem;
}
.at-contact__form-col .wpcf7-form input[type="text"],
.at-contact__form-col .wpcf7-form input[type="email"],
.at-contact__form-col .wpcf7-form input[type="tel"],
.at-contact__form-col .wpcf7-form select,
.at-contact__form-col .wpcf7-form textarea {
  width: 100%;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid var(--wp--preset--color--border);
  border-radius: var(--at-radius);
  padding: 0.75rem 0.875rem;
  font: inherit;
  color: var(--wp--preset--color--foreground);
  transition: border-color 0.15s;
}
.at-contact__form-col .wpcf7-form input:focus,
.at-contact__form-col .wpcf7-form select:focus,
.at-contact__form-col .wpcf7-form textarea:focus {
  outline: 0;
  border-color: var(--wp--preset--color--primary);
}
.at-contact__form-col .wpcf7-form textarea { min-height: 120px; resize: vertical; }
.at-contact__form-col .wpcf7-form input[type="submit"] {
  background: var(--wp--preset--color--primary);
  color: #fff;
  border: 0;
  border-radius: var(--at-radius);
  padding: 0.875rem 2rem;
  font: inherit;
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
  margin-top: 1rem;
  width: 100%;
  transition: background 0.15s;
}
.at-contact__form-col .wpcf7-form input[type="submit"]:hover {
  background: var(--wp--preset--color--primary-dark);
}

/* Info column */
.at-contact__info-col {
  background: #fff;
  border-radius: var(--at-radius);
  box-shadow: var(--at-shadow-card);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.at-contact__info-block {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.at-contact__info-icon {
  font-size: 1.5rem;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 0.125rem;
}
.at-contact__info-label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--muted-foreground);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0 0 0.125rem;
}
.at-contact__info-value {
  color: var(--wp--preset--color--navy);
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  margin: 0;
}
a.at-contact__info-value:hover { color: var(--wp--preset--color--primary-dark); }
.at-contact__branches-link {
  color: var(--wp--preset--color--primary-dark);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  margin-top: 0.25rem;
  display: inline-block;
}
.at-contact__branches-link:hover { text-decoration: underline; }

/* Screen-reader only utility */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* ---------- Footer ---------- */
.at-footer {
  background: var(--wp--preset--color--navy);
  color: #fff;
  padding: 3rem 1rem 1.5rem;
}
.at-footer h2, .at-footer h3, .at-footer h4 { color: #fff; }
.at-footer a { color: rgba(255,255,255,0.78); }
.at-footer a:hover { color: var(--wp--preset--color--primary-light); }
.at-footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.12);
  margin-top: 2.5rem;
  padding-top: 1rem;
  font-size: 0.875rem;
  color: rgba(255,255,255,0.6);
}

/* ===================================================================== */
/* ===           DUAL PRICE BLOCK  (single product + shop card)      === */
/* ===================================================================== */

/*
 * .at-price-block wraps both "ללא התקנה" and "עם התקנה" rows.
 * Rendered by autotire_single_product_dual_price_html() and
 * autotire_loop_dual_price_html() in autotire-core.
 *
 * RTL: labels on the right (start), amounts on the left (end) — the flex
 * direction is row with space-between so they spread naturally in RTL.
 */
.at-price-block {
  display: grid;
  grid-template-columns: 1fr 1fr;        /* two prices SIDE BY SIDE */
  gap: 0.5rem;
  margin-block: 0.75rem 0.25rem;
}
@media (max-width: 480px) {
  .at-price-block { grid-template-columns: 1fr; }   /* stack on small mobile */
  /* DOM order is without-install -> with-install (so RTL puts the headline
     on the LEFT on desktop). When stacked on mobile we still want the
     headline (with installation) on TOP. */
  .at-price-block .at-price__row--primary   { order: 1; }
  .at-price-block .at-price__row--secondary { order: 2; }
}
/* Card-mode (shop cards) keeps the original single-column stack */
.at-price-block--card {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  width: 100%;
  align-self: stretch;
  box-sizing: border-box;
}

.at-price-block--card .at-price__row,
.at-price-block--card .at-price__row--compact {
  width: 100%;
  box-sizing: border-box;
  padding: 0.4rem 0.5rem;
  min-width: 0;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.375rem;
}

.at-price-block--card .at-price__label {
  white-space: nowrap;
  line-height: 1.2;
  flex: 1 1 auto;
  min-width: 0;
  flex-shrink: 0;
  font-size: 0.8125rem;
}

.at-price-block--card .at-price__value {
  flex: 0 0 auto;
  text-align: end;
  max-width: none;
  white-space: nowrap;
}

.at-price-block--card .at-price__value--sale {
  display: inline-flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: 0.25rem;
  white-space: nowrap;
}

/* Each label + value row */
.at-price__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.5rem 0.875rem;
  background: var(--wp--preset--color--muted, #EFF2F5);
  border-radius: 10px;
  line-height: 1.2;
}

/* PRIMARY price row — "מחיר כולל מעמ והרכבה" (with installation).
   This is the headline price shown by default. Bigger, bolder, in the brand's
   primary cyan to draw the eye. 2026-05-28 user request. */
.at-price__row--primary {
  background: linear-gradient(135deg, rgba(6,182,212,0.10), rgba(0,160,215,0.04));
  border: 1px solid rgba(6,182,212,0.35);
  padding: 0.75rem 1rem;
}
.at-price__row--primary .at-price__label {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy, #0F1E3C);
}
.at-price__row--primary .at-price__value {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--wp--preset--color--primary-dark, #00A0D7);
}

/* SECONDARY price row — "מחיר כולל מעמ ללא התקנה" (without installation).
   Smaller and muted so it sits as a supporting note under the primary. */
.at-price__row--secondary {
  background: transparent;
  border: 0;
  padding: 0.3rem 0.875rem;
}
.at-price__row--secondary .at-price__label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}
.at-price__row--secondary .at-price__value {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}

/* Compact variant for shop cards — tighter padding, smaller type */
.at-price__row--compact {
  padding: 0.35rem 0.625rem;
}

.at-price__label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  white-space: nowrap;
  flex-shrink: 0;
}

.at-price__value {
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy, #193348);
  white-space: nowrap;
}

/* On a card the value can be slightly smaller */
.at-price-block--card .at-price__value {
  font-size: 1rem;
}

/* "עם התקנה" price in primary cyan */
.at-price__value--install {
  color: var(--wp--preset--color--primary-dark, #00A0D7);
}

/* Sale price: strikethrough regular, highlighted sale */
.at-price__value--sale del.at-price__regular {
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  font-weight: 500;
  font-size: 0.875em;
  text-decoration: line-through;
  margin-inline-end: 0.375rem;
}

.at-price__value--sale ins.at-price__sale {
  text-decoration: none;
  color: var(--wp--preset--color--destructive, #E62C2C);
  font-weight: 800;
}

/* ===================================================================== */
/* ===      TIRE COMPATIBILITY BOX  (single product page only)       === */
/* ===================================================================== */

/*
 * .at-compat-box rendered by autotire_single_product_compatibility_box()
 * via woocommerce_before_add_to_cart_form at priority 10.
 */
.at-compat-box {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: var(--at-radius, 12px);
  padding: 1rem 1.25rem;
  margin-block: 1rem;
  box-shadow: var(--at-shadow-soft, 0 1px 2px #0f1e3c0f, 0 8px 24px -12px #0f1e3c1f);
}

.at-compat-box__title {
  font-size: 0.9375rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy, #193348);
  margin: 0 0 0.75rem;
  padding-bottom: 0.625rem;
  border-bottom: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-compat-box__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.4rem 0;
  font-size: 0.875rem;
  border-bottom: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-compat-box__row:last-of-type {
  border-bottom: 0;
}

.at-compat-box__label {
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  font-weight: 600;
}

.at-compat-box__value {
  color: var(--wp--preset--color--navy, #193348);
  font-weight: 700;
  white-space: nowrap;
}

/* OEM approval badge row */
.at-compat-box__oem {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.625rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-compat-box__oem-badge {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--wp--preset--color--primary, #1EBDE3) 18%, #fff);
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  font-size: 0.75rem;
  font-weight: 900;
  flex-shrink: 0;
}

.at-compat-box__oem-label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary-dark, #00A0D7);
}

/* ===================================================================== */
/* ===          SET-OF-4 BADGE  (מבצע סט 4 צמיגים)                  === */
/* ===================================================================== */

/*
 * Rendered by autotire_product_template_inject_brand() (shop archive card)
 * and autotire_single_product_inject_brand() (single product title area).
 *
 * Shop card and single-product gallery both use .at-set4-gallery-badge
 * (the red two-line ribbon defined further up in this file). Shop cards
 * add the `--card` modifier to scale it down for the ~200-280px card image.
 *
 * Single product: .at-set4-title-strip is a full-width inline strip just
 * below the H1, styled like a call-out chip.
 */

/* --- Shop archive card variant — smaller red ribbon overlaid on the
       product photo (top-LEFT in RTL via inset-inline-end). Specificity
       bumped with double class so it wins over the responsive rules on
       .at-set4-gallery-badge regardless of source order. --- */
.at-set4-gallery-badge.at-set4-gallery-badge--card {
  top: 8px;
  inset-inline-end: 8px;
  inset-inline-start: auto;       /* override any inherited start position */
  padding: 6px 10px 7px;
  border-radius: 8px;
  border-width: 2px;
  max-width: 130px;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.35) inset,
    0 5px 12px -3px rgba(225, 14, 14, 0.45),
    0 2px 4px rgba(15, 30, 60, 0.18);
}
.at-set4-gallery-badge--card .at-set4-gallery-badge__line {
  font-size: 12px;
}
.at-set4-gallery-badge--card .at-set4-gallery-badge__line + .at-set4-gallery-badge__line {
  margin-top: 1px;
}

/* Tighter still on small mobile shop cards */
@media (max-width: 480px) {
  .at-set4-gallery-badge.at-set4-gallery-badge--card {
    top: 6px;
    inset-inline-end: 6px;
    padding: 5px 8px 6px;
    max-width: 110px;
  }
  .at-set4-gallery-badge--card .at-set4-gallery-badge__line { font-size: 10px; }
}

/*
 * Ensure the image wrappers for WC block-based product collections carry
 * position: relative so the absolute badge is contained within the image area.
 * WC core usually sets this already; this rule is a safety net.
 */
.wp-block-woocommerce-product-collection .wc-block-components-product-image,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image {
  position: relative;
}

/* --- Single product title-area strip --- */
.at-set4-title-strip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin: 0.5rem 0 0.25rem;

  background: var(--wp--preset--color--accent-yellow, #FFD100);
  color: var(--wp--preset--color--navy-dark, #0F1E3C);

  font-size: 0.8125rem;   /* 13px */
  font-weight: 800;
  padding: 0.3125rem 0.875rem;
  border-radius: 999px;
  line-height: 1.3;

  /* Leading icon — decorative tire emoji replaced with a CSS dot */
  direction: rtl;
  unicode-bidi: isolate;
}

/* Decorative dot before the text (CSS-only, no extra markup) */
.at-set4-title-strip::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--wp--preset--color--navy-dark, #0F1E3C);
  flex-shrink: 0;
}

/* ===================================================================== */
/* ===               LICENSE-PLATE LOOKUP RESULT BOX                 === */
/* ===================================================================== */

/*
 * .at-plate-result
 *   Appears below the plate-tab form after a successful or failed lookup.
 *   Fade-in on JS reveal via the --found / --error modifier classes.
 *   RTL Hebrew; card style consistent with the finder card.
 */
.at-plate-result {
  margin-top: 1rem;
  padding: 1rem 1.25rem;
  border-radius: var(--at-radius, 12px);
  background: #fff;
  direction: rtl;
  text-align: start;
  animation: at-plate-fadein 0.25s ease both;
}

@keyframes at-plate-fadein {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0);   }
}

/* Found state — cyan left (inline-end in RTL = right) border accent */
.at-plate-result--found {
  border: 1.5px solid var(--wp--preset--color--primary, #1EBDE3);
  box-shadow: 0 4px 20px rgba(30, 189, 227, 0.12);
}

/* Error state — muted red border */
.at-plate-result--error {
  border: 1.5px solid #f87171;
  box-shadow: 0 4px 16px rgba(248, 113, 113, 0.10);
  background: #fff5f5;
}

/* Loading state */
.at-plate-result--loading {
  border: 1.5px solid var(--wp--preset--color--primary, #1EBDE3);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--wp--preset--color--navy, #193348);
  font-size: 0.9375rem;
}

/* Spinner animation */
.at-plate-result__spinner {
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  border: 2px solid rgba(30, 189, 227, 0.25);
  border-top-color: var(--wp--preset--color--primary, #1EBDE3);
  border-radius: 50%;
  animation: at-spin 0.7s linear infinite;
  flex-shrink: 0;
}

@keyframes at-spin {
  to { transform: rotate(360deg); }
}

/* "נמצא רכב" heading */
.at-plate-result__heading {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary, #1EBDE3);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 0.75rem;
}

/* Label / value rows */
.at-plate-result__row {
  display: flex;
  gap: 0.5rem;
  align-items: baseline;
  padding: 0.375rem 0;
  border-bottom: 1px solid rgba(15, 30, 60, 0.06);
}

.at-plate-result__row:last-child {
  border-bottom: none;
}

.at-plate-result__label {
  flex: 0 0 7rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--wp--preset--color--muted-foreground, #64748b);
}

.at-plate-result__value {
  flex: 1;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--wp--preset--color--navy-dark, #0F1E3C);
  display: flex;
  align-items: center;
  gap: 0.625rem;
  flex-wrap: wrap;
}

/* CTA "ראו צמיגים" button — yellow, matches existing at-btn-yellow style */
.at-plate-result__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  background: var(--wp--preset--color--accent-yellow, #FFD100) !important;
  color: var(--wp--preset--color--navy-dark, #0F1E3C) !important;
  font-size: 0.875rem;
  font-weight: 800;
  padding: 0.375rem 1rem;
  border-radius: var(--at-radius, 12px);
  text-decoration: none;
  transition: filter 0.15s ease, transform 0.15s ease;
  white-space: nowrap;
}

.at-plate-result__cta:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

/* Product count badge inside the CTA */
.at-plate-result__count {
  display: inline-block;
  background: rgba(15, 30, 60, 0.15);
  border-radius: 999px;
  padding: 0 0.4rem;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.5;
}

/* Smaller inline link for secondary (rear) tire size */
.at-plate-result__link-sm {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--wp--preset--color--primary, #1EBDE3);
  text-decoration: none;
}

.at-plate-result__link-sm:hover {
  text-decoration: underline;
}

/* Error message text */
.at-plate-result__error-msg {
  margin: 0 0 0.75rem;
  font-size: 0.9375rem;
  color: #b91c1c;
  font-weight: 600;
}

/* "נסו שוב" button in error state */
.at-plate-result__retry {
  background: transparent;
  border: 1.5px solid #f87171;
  border-radius: var(--at-radius, 12px);
  color: #b91c1c;
  font: inherit;
  font-size: 0.875rem;
  font-weight: 700;
  padding: 0.375rem 1rem;
  cursor: pointer;
  transition: background 0.15s ease;
}

.at-plate-result__retry:hover {
  background: #fef2f2;
}

/* ---------- Focus outlines: clean on mouse click, visible on keyboard tab ---------- */

/* Kill default outline on mouse click (also kills the dotted Firefox box). */
button:focus,
a:focus,
select:focus,
input:focus,
textarea:focus,
[role="button"]:focus,
[role="tab"]:focus,
[tabindex]:focus {
  outline: none;
  box-shadow: none;
}

/* Keep a clear focus ring for keyboard navigation only. Uses the accent
   color so it matches the rest of the theme. */
button:focus-visible,
a:focus-visible,
select:focus-visible,
input:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--wp--preset--color--cyan, #06b6d4);
  outline-offset: 2px;
  border-radius: 2px;
}

/* Also suppress the WC product-collection block's focus ring on cards. */
.wc-block-product:focus,
.wp-block-post:focus,
.wc-block-components-product-image:focus,
.wc-block-components-product-image a:focus {
  outline: none;
  box-shadow: none;
}

/* ============================================================
 * Israeli license-plate input — real-plate look
 *
 * Structure (markup):
 *   <div class="at-plate-frame" dir="ltr">
 *     <span class="at-plate-frame__il">
 *       <span class="at-plate-frame__flag">🇮🇱</span>
 *       <span class="at-plate-frame__il-text">IL</span>
 *     </span>
 *     <input id="at-plate" />
 *   </div>
 *
 * Yellow body (gradient) + 3px black border. A blue vertical strip sits
 * flush against the LEFT edge of the plate body, containing the Israeli
 * flag emoji on top and "IL" text below — exactly like the EU-style
 * Israeli plate (https://www.license-plates-shop.com/israel/289-…).
 * The strip uses `position:absolute; left:0` against the dir=LTR frame
 * so it is always on the visual left even though the page is RTL.
 * ============================================================ */

.at-plate-frame {
  position: relative;
  display: block;
  width: 100%;
  max-width: 22rem;
  margin: 0 auto;
  background: linear-gradient(180deg, #FFD400 0%, #FFC000 100%);
  border: 3px solid #111;
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.55),
              inset 0 -2px 0 rgba(0,0,0,0.18),
              0 4px 14px -6px rgba(0,0,0,0.35);
  overflow: hidden;
  direction: ltr;
}

/* Blue strip on the LEFT of the plate */
.at-plate-frame__il {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2.75rem;
  background: linear-gradient(180deg, #003399 0%, #002277 100%);
  color: #FFD400;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.15rem;
  padding: 0.25rem 0;
  pointer-events: none;
  box-shadow: inset -1px 0 0 rgba(0,0,0,0.25);
}

.at-plate-frame__flag {
  font-size: 1rem;
  line-height: 1;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,0.25));
}

.at-plate-frame__il-text {
  font: 800 0.8rem/1 'Heebo', 'Arial Narrow', sans-serif;
  letter-spacing: 0.06em;
  color: #FFD400;
}

/* The input itself — transparent body, no border, padded to clear the IL strip */
.at-plate-frame #at-plate {
  background: transparent;
  border: 0;
  outline: none;
  width: 100%;
  display: block;
  color: #111;
  font-family: 'Heebo', 'Arial Narrow', 'Liberation Sans Narrow', sans-serif;
  font-weight: 900;
  font-size: clamp(1.4rem, 3vw, 2rem);
  letter-spacing: 0.08em;
  text-align: center;
  direction: ltr;
  padding: 0.625rem 0.75rem 0.625rem 3.5rem; /* left padding clears the IL strip */
  min-height: 3.25rem;
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  box-shadow: none;
}

.at-plate-frame #at-plate::placeholder {
  color: rgba(0,0,0,0.4);
  font-weight: 700;
  letter-spacing: 0.04em;
}

/* Focus state on the frame (cyan ring) — and kill native input focus */
.at-plate-frame:focus-within {
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.6),
              inset 0 -2px 0 rgba(0,0,0,0.2),
              0 0 0 3px rgba(6,182,212,0.5);
}
.at-plate-frame #at-plate:focus,
.at-plate-frame #at-plate:focus-visible {
  outline: none;
  box-shadow: none;
}

/* Center the label + hint */
.at-finder__card--plate .at-finder__span-4 {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.at-finder__card--plate label[for="at-plate"] {
  text-align: center;
  display: block;
  margin-bottom: 0.5rem;
}
.at-finder__card--plate .at-finder__hint {
  text-align: center;
  margin: 0.75rem auto 0 !important;
}

/* Mobile */
@media (max-width: 480px) {
  .at-plate-frame { max-width: 18rem; }
  .at-plate-frame #at-plate {
    font-size: 1.25rem;
    padding-left: 3rem;
  }
  .at-plate-frame__il { width: 2.4rem; }
}

/* =====================================================================
 * TIRE CONTENT SECTIONS — תיאור / מפרט טכני / מאפיינים בולטים
 * Added for Wave 2 product-description enrichment.
 * ===================================================================== */

.at-tire-content {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 3vw, 2rem);
  margin-block-start: 2.5rem;
  margin-block-end: 1rem;
}

/* Two-column row: description (60%) + spec table (40%) */
.at-tire-content__row {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 2rem;
  align-items: start;
}

/* ---- Shared section heading ---- */
.at-tire-section-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy, #193348);
  margin-block-end: 1rem;
  padding-block-end: 0.5rem;
  border-block-end: 2px solid var(--wp--preset--color--primary, #1EBDE3);
  font-family: 'Heebo', system-ui, sans-serif;
}

/* ---- Description column ---- */
.at-tire-desc {
  /* no extra box treatment — clean prose */
}

.at-tire-desc__body {
  font-size: 0.95rem;
  line-height: 1.75;
  color: var(--wp--preset--color--foreground, #1a2840);
  font-family: 'Heebo', system-ui, sans-serif;
}

.at-tire-desc__body p {
  margin-block-end: 0.875rem;
}

.at-tire-desc__body p:last-child {
  margin-block-end: 0;
}

/* ---- Spec table column ---- */
.at-tire-specs {
  background: var(--wp--preset--color--muted, #f1f5f9);
  border-radius: var(--at-radius, 12px);
  padding: 1.25rem 1.5rem;
}

.at-tire-specs__table {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.at-tire-specs__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.5rem;
  padding-block: 0.5rem;
  border-block-end: 1px solid rgba(25, 51, 72, 0.08);
}

.at-tire-specs__row:last-child {
  border-block-end: none;
}

.at-tire-specs__label {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--wp--preset--color--muted-foreground, #607589);
  font-family: 'Heebo', system-ui, sans-serif;
  /* dt resets */
  margin: 0;
}

.at-tire-specs__value {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy, #193348);
  font-family: 'Heebo', system-ui, sans-serif;
  text-align: start;
  /* dd resets */
  margin: 0;
}

/* ---- Features list (full-width row) ---- */
.at-tire-features {
  margin-block-start: 1.75rem;
  background: var(--wp--preset--color--muted, #f1f5f9);
  border-radius: var(--at-radius, 12px);
  padding: 1.25rem 1.5rem;
}

.at-tire-features__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 2rem;
}

.at-tire-features__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  color: var(--wp--preset--color--foreground, #1a2840);
  font-family: 'Heebo', system-ui, sans-serif;
}

.at-tire-features__check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 1.375rem;
  border-radius: 50%;
  background: var(--wp--preset--color--primary, #1EBDE3);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
}

.at-tire-features__text {
  font-weight: 500;
  line-height: 1.4;
}

/* ---- Mobile: stack columns vertically below 768 px ---- */
@media (max-width: 768px) {
  .at-tire-content__row {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .at-tire-features__list {
    flex-direction: column;
    gap: 0.5rem;
  }

  .at-tire-content {
    margin-block-start: 1.5rem;
  }
}

/* ============================================================
 * Quantity stepper buttons (− / +) around the WC qty input
 * Injected by single-product.php via woocommerce_before/after_quantity_input_field
 * Visual: single rounded pill with input centered between two buttons.
 * ============================================================ */

form.cart .quantity {
  display: inline-flex;
  align-items: stretch;
  height: 48px;
  border: 1px solid var(--wp--preset--color--border, #d6dce3);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  vertical-align: middle;
}

form.cart .at-qty-step {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: var(--wp--preset--color--muted, #f3f4f6);
  color: var(--wp--preset--color--navy, #0F1E3C);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  width: 2.5rem;
  cursor: pointer;
  user-select: none;
  transition: background 0.15s ease;
}
form.cart .at-qty-step:hover {
  background: var(--wp--preset--color--cyan, #06b6d4);
  color: #fff;
}
form.cart .at-qty-step:active {
  background: var(--wp--preset--color--cyan-dark, #00A0D7);
  color: #fff;
}

/* The qty input itself — strip native arrows, center the digit */
form.cart .quantity input.qty,
form.cart .quantity input[name="quantity"] {
  border: 0;
  border-left: 1px solid var(--wp--preset--color--border, #d6dce3);
  border-right: 1px solid var(--wp--preset--color--border, #d6dce3);
  background: transparent;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 700;
  width: 3.25rem;
  padding: 0;
  margin: 0;
  appearance: textfield;
  -moz-appearance: textfield;
  border-radius: 0;
  outline: none;
  box-shadow: none;
}
form.cart .quantity input.qty::-webkit-outer-spin-button,
form.cart .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Tighten alignment with the add-to-cart button — same row, same height */
form.cart {
  align-items: center;
}

/* ============================================================
 * Related-tires CAROUSEL (by-size)
 * Horizontal scroller with prev/next arrows + scroll-snap, RTL.
 * Replaces the WC Product Collection on single product pages
 * via render_block filter in related-tires.php
 * ============================================================ */

.at-related-carousel {
  position: relative;
  padding: 0 3rem;          /* room for absolute-positioned arrow buttons */
}

.at-related-carousel__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
  padding: 0.25rem 0 0.5rem; /* room so card box-shadow + scrollbar don't clip */
}
.at-related-carousel__track::-webkit-scrollbar { height: 6px; }
.at-related-carousel__track::-webkit-scrollbar-thumb {
  background: var(--wp--preset--color--border, #d6dce3);
  border-radius: 3px;
}

.at-related-carousel .at-related-card {
  flex: 0 0 auto;
  width: clamp(11rem, 16vw, 14rem);
  scroll-snap-align: start;
}

/* Prev / next nav buttons */
.at-related-carousel__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  border: 1px solid var(--wp--preset--color--border, #d6dce3);
  background: #fff;
  color: var(--wp--preset--color--navy, #0F1E3C);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  z-index: 5;
  box-shadow: 0 4px 12px -4px rgba(15,30,60,0.18);
  transition: background 0.15s ease, color 0.15s ease, transform 0.05s ease;
  display: grid;
  place-items: center;
}
.at-related-carousel__nav:hover {
  background: var(--wp--preset--color--navy, #0F1E3C);
  color: #fff;
}
.at-related-carousel__nav:active { transform: translateY(-50%) scale(0.95); }
/* RTL page: "previous" arrow visually on the RIGHT, "next" on the LEFT */
.at-related-carousel__nav--prev { right: 0; }
.at-related-carousel__nav--next { left: 0; }

@media (max-width: 600px) {
  .at-related-carousel { padding: 0 0.5rem; }
  .at-related-carousel__nav { display: none; }   /* mobile: swipe instead */
}

.at-related-card {
  background: #fff;
  border-radius: var(--at-radius, 14px);
  box-shadow: var(--at-shadow-card, 0 14px 36px -18px rgba(15,30,60,0.32));
  padding: 1rem;
  transition: transform .15s ease, box-shadow .15s ease;
}
.at-related-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px -16px rgba(15,30,60,0.34);
}
.at-related-card__link { color: inherit; text-decoration: none; display: block; }
.at-related-card__image {
  aspect-ratio: 1 / 1;
  border-radius: 10px;
  overflow: hidden;
  background: var(--wp--preset--color--muted, #f3f4f6);
  display: flex;
  align-items: center;
  justify-content: center;
}
.at-related-card__image img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.at-related-card__brand {
  margin: 0.6rem 0 0.1rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  letter-spacing: 0.04em;
}
.at-related-card__title {
  margin: 0.15rem 0 0.5rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy, #0F1E3C);
  line-height: 1.35;
}
.at-related-card__price { display: flex; flex-direction: column; gap: 0.15rem; margin-top: 0.4rem; }
.at-related-card__price-row { display: flex; justify-content: space-between; font-size: 0.85rem; }
.at-related-card__price-label { color: var(--wp--preset--color--muted-foreground, #4b5563); }
.at-related-card__price-value { font-weight: 800; color: var(--wp--preset--color--navy, #0F1E3C); }
.at-related-card__price-value--install { color: var(--wp--preset--color--primary-dark, #00A0D7); }

/* =====================================================================
 * IN-STOCK BADGE  (injected by autotire_single_product_stock_badge)
 * ===================================================================== */

.at-stock-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1;
  margin-block-end: 0.875rem;
}

.at-stock-badge--in {
  background: color-mix(in oklab, #16a34a 14%, #fff);
  color: #15803d;
}

.at-stock-badge__check {
  font-size: 0.9375rem;
  font-weight: 900;
}

.at-stock-badge--out {
  background: color-mix(in oklab, var(--wp--preset--color--destructive, #E62C2C) 12%, #fff);
  color: var(--wp--preset--color--destructive, #E62C2C);
}

/* =====================================================================
 * SHIPPING / INSTALL BLOCK  (injected by autotire_single_product_shipping_block)
 * ===================================================================== */

.at-shipping-block {
  background: var(--wp--preset--color--muted, #EFF2F5);
  border-radius: var(--at-radius, 12px);
  padding: 0.25rem 0;
  margin-block-start: 1rem;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-shipping-block__row {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border-block-end: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-shipping-block__row:last-child {
  border-block-end: 0;
}

.at-shipping-block__icon {
  font-size: 1.25rem;
  line-height: 1.4;
  flex-shrink: 0;
}

.at-shipping-block__text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--foreground, #1a2840);
}

.at-shipping-block__text strong {
  font-weight: 700;
  color: var(--wp--preset--color--navy, #193348);
  font-size: 0.9rem;
}

.at-shipping-block__text span {
  color: var(--wp--preset--color--muted-foreground, #5A656E);
}

.at-shipping-block__link {
  color: var(--wp--preset--color--primary-dark, #00A0D7);
  font-weight: 700;
  text-decoration: none;
}
.at-shipping-block__link:hover { text-decoration: underline; }

/* =====================================================================
 * ACCORDION  (rendered by autotire_single_product_accordion)
 * HTML5 <details>/<summary> — no JS, keyboard-native, multiple open.
 * ===================================================================== */

/* Outer wrapper — centered rail */
.at-product__accordion-wrap {
  padding: 0 clamp(1rem, 4vw, 2.5rem) 1rem;
}

.at-product__accordion-rail {
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
}

/* The accordion container itself */
.at-accordion {
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: var(--at-radius, 12px);
  overflow: hidden;
}

/* Each <details> item */
.at-accordion__item {
  border-block-end: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-accordion__item:last-child {
  border-block-end: 0;
}

/* Summary row — 56px tall, flex, chevron via ::after */
.at-accordion__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  padding: 0.4rem 1rem;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.9375rem;
  color: var(--wp--preset--color--navy, #193348);
  background: #fff;
  list-style: none;
  user-select: none;
  transition: background 0.12s ease;
}

/* Remove WebKit's default disclosure marker */
.at-accordion__summary::-webkit-details-marker { display: none; }

/* Chevron arrow after the label text */
.at-accordion__summary::after {
  content: '▼';
  font-size: 0.75rem;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  transition: transform 0.2s ease;
  flex-shrink: 0;
  margin-inline-start: 1rem;
}

/* RTL: in an open state the chevron points up */
.at-accordion__item[open] > .at-accordion__summary::after {
  transform: rotate(-180deg);
}

.at-accordion__summary:hover {
  background: var(--wp--preset--color--muted, #EFF2F5);
}

/* Body / content area */
.at-accordion__body {
  padding: 1.25rem 1.5rem 1.5rem;
  background: #fff;
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--wp--preset--color--foreground, #1a2840);
}

.at-accordion__body p { margin: 0 0 0.75rem; }
.at-accordion__body p:last-child { margin-block-end: 0; }

.at-accordion__empty {
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  font-style: italic;
  margin: 0;
}

/* Specs table inside accordion */
.at-accordion__specs {
  display: flex;
  flex-direction: column;
}

/* Features list inside accordion */
.at-accordion__features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 2rem;
}

.at-accordion__features li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
}

/* Description content inside accordion — keep prose readable */
.at-accordion__desc {
  max-width: 72ch;
}

/* Mobile: full width, body gets slightly tighter padding */
@media (max-width: 600px) {
  .at-accordion__summary { padding: 0 1rem; }
  .at-accordion__body { padding: 1rem; }
}

/* =====================================================================
 * ACCORDION RESTYLE — Touchstore tabs-nav visual feel
 * Keeps <details>/<summary> semantics, upgrades the visual layer.
 * ===================================================================== */

/* Light divider above every summary (Touchstore row separator) */
.at-accordion__item {
  border-block-start: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-block-end: 0; /* override previous rule — top-only dividers */
}
.at-accordion__item:first-child { border-block-start: 0; }
/* Last child still gets its bottom border from the container */

/* Summary: tight padding, chevron on the END side (RTL = left) */
.at-accordion__summary {
  padding: 0.4rem 1rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--wp--preset--color--navy, #193348);
  background: #fff;
  min-height: 36px;
}

/* Remove the old chevron '▼' and replace with a rotatable SVG-like char */
.at-accordion__summary::after {
  content: '\203A'; /* › chevron — rotated to point down when open */
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  transform: rotate(90deg);   /* points ▶ downward = ▼ */
  transition: transform 0.2s ease;
  flex-shrink: 0;
  margin-inline-start: 1rem;
}

/* Open: chevron points down (already rotated 90 → add another 90 = 180) */
.at-accordion__item[open] > .at-accordion__summary::after {
  transform: rotate(-90deg);
}

/* Open: subtle cyan tint on the summary row */
.at-accordion__item[open] > .at-accordion__summary {
  background: color-mix(in oklab, var(--wp--preset--color--primary, #1EBDE3) 7%, #fff);
  color: var(--wp--preset--color--navy, #193348);
  font-weight: 800;
}

/* Hover: muted bg */
.at-accordion__summary:hover {
  background: var(--wp--preset--color--muted, #EFF2F5);
}

/* =====================================================================
 * STOCK BY BRANCH — collapsible block in info column
 * ===================================================================== */

.at-stock-branches {
  margin-block: 0;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: var(--at-radius, 12px);
  background: #fff;
  overflow: hidden;
}

.at-stock-branches__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  cursor: pointer;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy, #193348);
  list-style: none;
  user-select: none;
  gap: 0.5rem;
}
.at-stock-branches__summary::-webkit-details-marker { display: none; }

/* Chevron indicator at the END (LTR: right; RTL: left) */
.at-stock-branches__summary::after {
  content: '\203A';
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  transform: rotate(90deg);
  transition: transform 0.2s ease;
  flex-shrink: 0;
  margin-inline-start: auto;
}
.at-stock-branches[open] > .at-stock-branches__summary::after {
  transform: rotate(-90deg);
}

.at-stock-branches__list {
  list-style: none;
  margin: 0;
  padding: 0.25rem 0 0.5rem;
  max-height: 250px;
  overflow-y: auto;
  border-top: 1px solid var(--wp--preset--color--border, #DFE6EB);
}

.at-stock-branches__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 1rem;
  font-size: 0.8125rem;
  color: var(--wp--preset--color--foreground, #1a2840);
}

.at-stock-branches__dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #16a34a;
  flex-shrink: 0;
}

.at-stock-branches__name {
  flex: 1;
}

.at-stock-branches__avail {
  font-size: 0.75rem;
  font-weight: 700;
  color: #15803d;
}

.at-stock-branches__more {
  padding: 0.35rem 1rem;
  font-size: 0.8rem;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  font-style: italic;
  list-style: none;
}

/* =====================================================================
 * CROSS-SELL TABS WIDGET
 * Mirrors Touchstore's tabs-nav + tab-content pattern.
 * ===================================================================== */

.at-crosssell {
  background: var(--wp--preset--color--muted, #EFF2F5);
  border-radius: var(--at-radius, 12px);
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  margin-block: 2rem;
  overflow: hidden;
}

/* Tab nav bar */
.at-tabs-nav {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  border-block-end: 2px solid var(--wp--preset--color--border, #DFE6EB);
  background: #fff;
  gap: 0;
  overflow-x: auto;
}

.at-tabs-nav__item {
  flex-shrink: 0;
}

.at-tabs-nav__btn {
  display: block;
  padding: 0.875rem 1.25rem;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  background: transparent;
  border: 0;
  border-block-end: 3px solid transparent;
  margin-block-end: -2px;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.15s, border-color 0.15s;
}

.at-tabs-nav__item.active .at-tabs-nav__btn,
.at-tabs-nav__btn[aria-selected="true"] {
  color: var(--wp--preset--color--navy, #193348);
  font-weight: 800;
  border-block-end-color: var(--wp--preset--color--primary, #1EBDE3);
}

.at-tabs-nav__btn:hover {
  color: var(--wp--preset--color--navy, #193348);
  background: var(--wp--preset--color--muted, #EFF2F5);
}

/* Tab content panels */
.at-tab-content {
  padding: 1.25rem 1rem;
  display: none;
}
.at-tab-content.active,
.at-tab-content:not([hidden]) {
  display: block;
}
.at-tab-content[hidden] { display: none; }

/* Override: force show when active class present */
.at-tab-content.active { display: block !important; }

/* Product card grid — 4 columns */
.at-crosssell__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
}
@media (max-width: 900px) {
  .at-crosssell__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .at-crosssell__grid { grid-template-columns: 1fr 1fr; }
}

/* Individual cross-sell card — checkbox label */
.at-crosssell__card {
  background: #fff;
  border: 1px solid var(--wp--preset--color--border, #DFE6EB);
  border-radius: 10px;
  padding: 0.75rem;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  transition: box-shadow 0.15s, border-color 0.15s;
  position: relative;
}
.at-crosssell__card:hover {
  box-shadow: var(--at-shadow-soft);
  border-color: var(--wp--preset--color--primary, #1EBDE3);
}

.at-crosssell__card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.at-crosssell__card-img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  border-radius: 6px;
  background: var(--wp--preset--color--muted, #EFF2F5);
  flex-shrink: 0;
}
.at-crosssell__card-img--placeholder {
  background: var(--wp--preset--color--muted, #EFF2F5);
  display: flex;
  align-items: center;
  justify-content: center;
}

.at-crosssell__check {
  width: 18px;
  height: 18px;
  accent-color: var(--wp--preset--color--primary-dark, #00A0D7);
  cursor: pointer;
  flex-shrink: 0;
  margin: 0;
}

/* Highlight selected card */
.at-crosssell__card:has(.at-crosssell__check:checked) {
  border-color: var(--wp--preset--color--primary, #1EBDE3);
  background: color-mix(in oklab, var(--wp--preset--color--primary, #1EBDE3) 5%, #fff);
}

.at-crosssell__card-body {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.at-crosssell__card-title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--wp--preset--color--navy, #193348);
  line-height: 1.3;
}

.at-crosssell__card-price {
  font-size: 0.9375rem;
  font-weight: 800;
  color: var(--wp--preset--color--primary-dark, #00A0D7);
}

/* Running total row */
.at-crosssell__total {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border-top: 1px solid var(--wp--preset--color--border, #DFE6EB);
  background: #fff;
  font-size: 0.9375rem;
}

.at-crosssell__total-label {
  color: var(--wp--preset--color--muted-foreground, #5A656E);
  font-weight: 600;
}

.at-crosssell__total-value {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--wp--preset--color--navy, #193348);
}

/* ============================================================
 * COMPATIBILITY LINE — single-line replacement for the old box
 * "תאימות צמיג: קודי עומס 96-109 · קודי מהירות T-V · ✓ <=96"
 * ============================================================ */
.at-compat-line {
  margin: 0.75rem 0;
  padding: 0.625rem 0.875rem;
  background: var(--wp--preset--color--muted, #f3f4f6);
  border-radius: 10px;
  font-size: 0.875rem;
  color: var(--wp--preset--color--navy, #0F1E3C);
  line-height: 1.5;
}
.at-compat-line__lead { color: var(--wp--preset--color--navy, #0F1E3C); margin-inline-end: 0.25rem; }
.at-compat-line__val  { font-weight: 700; color: var(--wp--preset--color--navy, #0F1E3C); }
.at-compat-line__oem  { color: var(--wp--preset--color--primary-dark, #00A0D7); font-weight: 700; }

/* ============================================================
 * TRUST STRIP — 4 reassurance badges below the cart
 * Each badge is a polished card with a tinted icon disc, hover lift.
 * ============================================================ */
.at-trust-strip {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
  margin: 1.25rem 0 0;
  padding: 0;
  background: transparent;
  border: 0;
}
.at-trust-strip__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  padding: 1.1rem 0.5rem 1rem;
  text-align: center;
  background: #fff;
  border: 1px solid var(--wp--preset--color--border, #d6dce3);
  border-radius: 14px;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.at-trust-strip__item:hover {
  transform: translateY(-3px);
  border-color: transparent;
  box-shadow: 0 14px 30px -14px rgba(15,30,60,0.22);
}
.at-trust-strip__icon {
  width: 2.75rem;
  height: 2.75rem;
  display: grid;
  place-items: center;
  font-size: 1.35rem;
  line-height: 1;
  border-radius: 50%;
  color: var(--wp--preset--color--navy, #0F1E3C);
  box-shadow: inset 0 -2px 0 rgba(15,30,60,0.06);
  /* per-icon tint — assigned via :nth-child below */
  background: linear-gradient(135deg, rgba(6,182,212,0.16), rgba(6,182,212,0.04));
}
.at-trust-strip__item:nth-child(1) .at-trust-strip__icon {
  background: linear-gradient(135deg, rgba(6,182,212,0.20), rgba(0,160,215,0.08));
}
.at-trust-strip__item:nth-child(2) .at-trust-strip__icon {
  background: linear-gradient(135deg, rgba(34,197,94,0.22), rgba(34,197,94,0.06));
}
.at-trust-strip__item:nth-child(3) .at-trust-strip__icon {
  background: linear-gradient(135deg, rgba(255,209,0,0.32), rgba(255,209,0,0.10));
}
.at-trust-strip__item:nth-child(4) .at-trust-strip__icon {
  background: linear-gradient(135deg, rgba(15,30,60,0.18), rgba(15,30,60,0.04));
}
.at-trust-strip__label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy, #0F1E3C);
  line-height: 1.3;
}
@media (max-width: 480px) {
  .at-trust-strip { grid-template-columns: repeat(2, 1fr); gap: 0.625rem; }
  .at-trust-strip__item { padding: 0.85rem 0.5rem; gap: 0.45rem; }
  .at-trust-strip__icon { width: 2.4rem; height: 2.4rem; font-size: 1.15rem; }
}

/* ============================================================
 * BUY-NOW button — secondary CTA next to "הוסף לסל"
 * Yellow accent so it's distinct without competing visually.
 * ============================================================ */
.at-buy-now-button {
  display: inline-block;
  width: 100%;
  margin-top: 0.5rem;
  padding: 0 1.5rem;
  height: 52px;
  border-radius: 10px;
  border: 2px solid var(--wp--preset--color--accent-yellow, #FFD100);
  background: var(--wp--preset--color--accent-yellow, #FFD100);
  color: var(--wp--preset--color--navy, #0F1E3C);
  font-weight: 800;
  font-size: 1.05rem;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.05s ease, box-shadow 0.15s ease;
  font-family: inherit;
}
.at-buy-now-button:hover {
  background: #FFC400;
  box-shadow: 0 6px 20px -6px rgba(255,209,0,0.55);
}
.at-buy-now-button:active { transform: scale(0.98); }

/* The two-button stack inside the cart form */
form.cart {
  flex-wrap: wrap;
  gap: 0.5rem;
}
form.cart .single_add_to_cart_button {
  width: 100%;
  min-width: 0;
}

/* ============================================================
 * INSTALL-PLACE dropdown inside the cart form
 * ============================================================ */
.at-product__info .at-install-place {
  flex: 1 1 100%;        /* full row of the cart form */
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin: 0 0 0.5rem;
  order: -1;             /* render BEFORE qty/buttons in the flex row */
}
.at-install-place__label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--navy, #0F1E3C);
}
.at-install-place__select {
  width: 100%;
  height: 42px;
  padding: 0 0.875rem;
  border: 1px solid var(--wp--preset--color--border, #d6dce3);
  border-radius: 10px;
  background: #fff;
  color: var(--wp--preset--color--navy, #0F1E3C);
  font: inherit;
  font-size: 0.9375rem;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  /* small chevron via background */
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(0% + 14px) 50%, calc(0% + 20px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-inline-start: 36px;
}
.at-install-place__select:focus {
  outline: none;
  border-color: var(--wp--preset--color--cyan, #06b6d4);
  box-shadow: 0 0 0 3px rgba(6,182,212,0.18);
}

/* ============================================================
 * Buttons disabled state (until install place is chosen)
 * ============================================================ */
.at-btn-disabled,
button.at-btn-disabled,
.at-product__info form.cart .single_add_to_cart_button.at-btn-disabled,
.at-product__info .at-buy-now-button.at-btn-disabled {
  background: #cbd5e1 !important;
  color: #475569 !important;
  border-color: #cbd5e1 !important;
  cursor: not-allowed !important;
  opacity: 0.85 !important;
  box-shadow: none !important;
  pointer-events: none;
}

/* ============================================================
 * SPEC GRID — compact icon strip of the key tire properties
 * Rendered under the size + compat line in the product info column
 * ============================================================ */
.at-spec-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
  margin: 0.75rem 0 1rem;
  padding: 0.75rem;
  background: var(--wp--preset--color--muted, #f3f4f6);
  border: 1px solid var(--wp--preset--color--border, #d6dce3);
  border-radius: 12px;
}
@media (min-width: 720px) {
  .at-spec-grid { grid-template-columns: repeat(3, 1fr); }
}
.at-spec-grid__cell {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: #fff;
  border-radius: 8px;
  border: 1px solid var(--wp--preset--color--border, #d6dce3);
  font-size: 0.8125rem;
}
.at-spec-grid__label {
  color: var(--wp--preset--color--muted-foreground, #4b5563);
  font-weight: 600;
}
.at-spec-grid__value {
  color: var(--wp--preset--color--navy, #0F1E3C);
  font-weight: 800;
  font-size: 0.875rem;
}

/* ============================================================
 * Put the "מבצע סט 4 צמיגים" strip and "מידה: 215/60R17" summary
 * on the SAME row (per user request 2026-05-27).
 * ============================================================ */
.at-product__info .at-set4-title-strip,
.at-product__info .at-product__size {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  margin-inline-end: 0.6rem;
}
.at-product__info .at-set4-title-strip + .at-product__size {
  margin-block-start: 0;
}

/* ============================================================
 * FILL info column — force the buy-box children to use the full width
 * of the info column (was: each child shrunk to content, leaving big
 * empty space around the prices / dropdown / buttons).
 * ============================================================ */
.at-product__info { width: 100%; }
.at-product__info > * { width: 100%; max-width: none; }
.at-product__info .wp-block-woocommerce-add-to-cart-form,
.at-product__info .wc-block-add-to-cart-form,
.at-product__info form.cart {
  width: 100% !important;
  max-width: none !important;
  justify-content: stretch;
}
.at-product__info .at-price-block,
.at-product__info .at-install-place,
.at-product__info .at-compat-line,
.at-product__info .at-spec-grid {
  width: 100%;
  max-width: none;
}
.at-product__info .at-install-place__select { width: 100%; }
/* qty stepper takes content width; cart + buy-now together fill the rest */
.at-product__info form.cart .quantity { flex: 0 0 auto; }
.at-product__info form.cart .single_add_to_cart_button,
.at-product__info form.cart button[name="add-to-cart"] { flex: 1 1 auto; min-width: 0; }
.at-product__info .at-buy-now-button { flex: 1 1 auto; min-width: 0; }

/* ============================================================
 * FINAL LAYOUT FIXES (2026-05-27)
 * - Tire image fills the gallery card
 * - Qty + cart + buy-now stay on ONE row, no wrap
 * - Info column content aligns to the RTL start (right edge)
 *   so there is no empty space between info and the trust badges
 * ============================================================ */

/* Image fills the gallery card: 320px square minimum, no centering quirks */
.at-product__gallery .woocommerce-product-gallery,
.at-product__gallery .woocommerce-product-gallery__wrapper,
.at-product__gallery .woocommerce-product-gallery__image,
.at-product__gallery .woocommerce-product-gallery__image a {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  opacity: 1 !important;
}
/* Desktop / tablet only — on mobile the gallery is capped tighter by the
   `@media (max-width: 720px)` rule near line ~1917 so a tall tire image
   doesn't push the buy box off the viewport. */
@media (min-width: 721px) {
  .at-product__gallery img {
    width: 100% !important;
    height: auto !important;
    max-width: none !important;
    max-height: 620px;
    min-height: 380px;       /* taller minimum to match the wider 520px card */
    object-fit: contain;
  }
}

/* Force the cart form into ONE horizontal row: install-place takes a full row
   above; qty + cart + buy-now share the next row equally without wrapping. */
.at-product__info form.cart {
  display: flex !important;
  flex-wrap: wrap;        /* only wraps for the install-place row */
  gap: 0.5rem;
  align-items: center;
  justify-content: flex-start;
}
.at-product__info .at-install-place { flex: 1 1 100%; order: -10; }

.at-product__info form.cart > .quantity,
.at-product__info form.cart > .single_add_to_cart_button,
.at-product__info form.cart > button[name="add-to-cart"],
.at-product__info form.cart > .at-buy-now-button {
  flex: 0 1 auto;
  width: auto !important;
  margin: 0 !important;
}
.at-product__info form.cart > .quantity { flex: 0 0 auto; }
.at-product__info form.cart > .single_add_to_cart_button,
.at-product__info form.cart > button[name="add-to-cart"] {
  flex: 2 1 auto;
  min-width: 0;
}
.at-product__info form.cart > .at-buy-now-button {
  flex: 2 1 auto;
  min-width: 0;
}
/* Mobile only: stack vertically */
@media (max-width: 600px) {
  .at-product__info form.cart > .quantity,
  .at-product__info form.cart > .single_add_to_cart_button,
  .at-product__info form.cart > button[name="add-to-cart"],
  .at-product__info form.cart > .at-buy-now-button {
    flex: 1 1 100%;
  }
}

/* Info column content aligns to RTL start (no centering, no auto margins) */
.at-product__info,
.at-product__info > * {
  text-align: start;
  margin-inline: 0 !important;
}
.at-product__info .at-price-block { justify-items: stretch; }

/* ============================================================
 * FORCE INFO COLUMN CONTENT TO FULL WIDTH
 * WC's block wrappers (wp-block-woocommerce-product-price,
 * wp-block-woocommerce-add-to-cart-form, .wc-block-add-to-cart-form,
 * etc.) cap themselves at ~50% on block themes — override every one.
 * ============================================================ */
.at-product__info,
.at-product__info > *,
.at-product__info .wp-block-woocommerce-product-price,
.at-product__info .wp-block-woocommerce-add-to-cart-form,
.at-product__info .wc-block-add-to-cart-form,
.at-product__info .wc-block-components-product-price,
.at-product__info form.cart,
.at-product__info .at-install-place,
.at-product__info .at-price-block,
.at-product__info .at-compat-line,
.at-product__info .at-spec-grid,
.at-product__info .at-set4-title-strip,
.at-product__info .at-product__size {
  width: 100% !important;
  max-width: none !important;
  margin-inline-start: 0 !important;
  margin-inline-end: 0 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
}
/* These are inline so they keep inline display but still expand naturally */
.at-product__info .at-set4-title-strip,
.at-product__info .at-product__size {
  width: auto !important;
}

/* ============================================================
 * NUCLEAR OVERRIDE for WC's add-to-cart-form block CSS
 * WC inlines: `display: grid; grid-template-columns: min-content auto auto`
 * on the form, which traps the price/install/qty/cart/buy-now in narrow
 * grid cells. Wipe the grid + restore our flex layout with !important all
 * the way down.
 * ============================================================ */

/* Outer block wrapper — full width */
.at-product__info .wp-block-woocommerce-add-to-cart-form,
.at-product__info .wp-block-woocommerce-add-to-cart-form > *,
.at-product__info .wc-block-add-to-cart-form,
.at-product__info .wc-block-add-to-cart-form > * {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  grid-auto-flow: initial !important;
}

/* Form itself — flex, ALL children grid-column/justify-self resets */
.at-product__info form.cart {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  justify-content: flex-start !important;
  align-items: center !important;
}
.at-product__info form.cart > * {
  grid-column: auto !important;
  grid-row: auto !important;
  justify-self: stretch !important;
  align-self: center !important;
  margin: 0 !important;
}

/* Install-place row spans full width (always above qty/buttons) */
.at-product__info form.cart > .at-install-place {
  flex: 1 1 100% !important;
  width: 100% !important;
  order: -10 !important;
}
/* Qty — fixed-width chunk */
.at-product__info form.cart > .quantity {
  flex: 0 0 auto !important;
  width: auto !important;
}
/* Cart + buy-now share the row */
.at-product__info form.cart > .single_add_to_cart_button,
.at-product__info form.cart > button[name="add-to-cart"],
.at-product__info form.cart > .at-buy-now-button {
  flex: 2 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
}

/* PRICE BLOCK — force the WC inner wrappers to full width too */
.at-product__info .wp-block-woocommerce-product-price,
.at-product__info .wc-block-components-product-price,
.at-product__info p.price,
.at-product__info span.price {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: start !important;
}
/* Desktop / tablet: prices side-by-side. Stays scoped so the mobile
   media query at ~line 3020 can stack to a single column. */
@media (min-width: 481px) {
  .at-product__info .at-price-block {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.5rem !important;
    width: 100% !important;
  }
}

/* Mobile (≤ 480px): force the two prices to stack — one card per row,
   each with full width and clearly visible labels + values. */
@media (max-width: 480px) {
  .at-product__info .at-price-block {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.625rem !important;
    width: 100% !important;
  }
}

/* Contact float bar — primary styles live in #at-contact-float-css (contact-bar.php footer). */

/* Mobile override: trust pillars as 2x2 grid on PDP. */
@media (max-width: 720px) {
  .at-product__trust {
    width: 100% !important;
    max-width: none !important;
    position: static !important;
    top: auto !important;
    align-self: stretch;
  }
  .at-product__trust .at-trust-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    margin: 0 !important;
  }
  .at-product__trust .at-trust-strip__item {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    text-align: start;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
  }
}