/*
Theme Name:   AUTOKID Child v1.20.20
Template:     astra
Version:      1.20.20
Description:  AUTOKID child theme — ride-on cars, learning toys & gadgets store
Author:       AUTOKID
Text Domain:  autokid-child
*/

/* ============ Google Fonts (loaded via functions.php) ============ */

/* ============ Font metric overrides — prevent font-swap CLS ============
   Named local fallback faces whose ascent/descent/size-adjust values are
   calibrated to match the layout metrics of the corresponding Google Font.
   They sit second in the CSS font stack so the browser uses them while the
   woff2 files are in-flight. Because their character widths and line metrics
   match the real fonts, text does not reflow or shift on swap. */
@font-face {
  font-family: 'FrauncesLocal';
  src: local('Georgia'), local('Times New Roman');
  font-weight: 400 900;
  font-style: normal;
  ascent-override:  103%;
  descent-override:  24%;
  line-gap-override:   0%;
  size-adjust:        96%;
}
@font-face {
  font-family: 'FrauncesLocal';
  src: local('Georgia'), local('Times New Roman');
  font-weight: 400 900;
  font-style: italic;
  ascent-override:  103%;
  descent-override:  24%;
  line-gap-override:   0%;
  size-adjust:        96%;
}
@font-face {
  font-family: 'JBMonoLocal';
  src: local('Courier New'), local('Courier');
  font-weight: 400 700;
  font-style: normal;
  ascent-override:  96%;
  descent-override: 21%;
  line-gap-override:  0%;
  size-adjust:      100%;
}
@font-face {
  font-family: 'SGroteskLocal';
  src: local('Arial'), local('Helvetica Neue'), local('Helvetica');
  font-weight: 400 700;
  font-style: normal;
  ascent-override:  106%;
  descent-override:  27%;
  line-gap-override:   0%;
  size-adjust:        95%;
}

/* ============ Full-width layout — custom header/footer bypass Astra container ============ */
#content.site-content,
#primary.content-area {
	width: 100% !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	float: none !important;
}
.site-main { padding: 0 !important; margin: 0 !important; }

/* Hide WP entry-title on pages using custom section headers */
body.page .entry-header,
body.page .page-header,
body.woocommerce-page .woocommerce-products-header,
body.tax-product_cat .entry-header,
body.tax-product_cat .page-header,
body.tax-product_tag .entry-header,
body.tax-product_tag .page-header {
	display: none;
}

/* Admin bar offset for sticky header */
.admin-bar .ak-header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .ak-header { top: 46px; } }

/* ============ Header ============ */
.ak-header {
  background: var(--c-bg-2) !important; /* see css/critical.css for why */
  border-bottom: 2px solid var(--c-line);
  position: sticky;
  top: 0;
  z-index: 200;
  overflow: visible;  /* allow mobile dropdown to extend below */
}
.ak-header-inner {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  padding: 28px 32px;
  gap: 24px;
}
.ak-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  flex-shrink: 0;
}
.ak-logo-mark { display: inline-flex; flex-shrink: 0; }
.ak-logo-text {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 24px;
  letter-spacing: -0.04em;
  color: var(--c-ink);
  white-space: nowrap;
}
.ak-logo-text sup { font-size: 11px; font-weight: 500; }

/* Nav wrapper — takes up centre space */
.ak-nav-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}
ul.ak-nav {
  display: flex;
  gap: 2px;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
}
ul.ak-nav li { list-style: none; flex-shrink: 0; }
ul.ak-nav li a {
  display: block;
  padding: 9px 13px;
  font-weight: 500;
  font-size: 15px;
  border-radius: 999px;
  color: var(--c-ink-2) !important;
  text-decoration: none !important;
  transition: background .15s, color .15s;
  white-space: nowrap;
}
ul.ak-nav li a:hover {
  background: var(--c-bg);
  color: var(--c-ink) !important;
}
ul.ak-nav li.current-menu-item > a,
ul.ak-nav li.current-page-ancestor > a,
ul.ak-nav li.current-menu-ancestor > a {
  background: var(--c-ink);
  color: #fff !important;
}

/* Header action buttons */
.ak-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.ak-icon-btn {
  width: 40px; height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 2px solid transparent;
  border-radius: 50%;
  color: var(--c-ink);
  cursor: pointer;
  transition: background .15s, border-color .15s;
  text-decoration: none;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  flex-shrink: 0;
  -webkit-appearance: none;
  appearance: none;
  line-height: 1;
  vertical-align: middle;
}
.ak-icon-btn:hover { background: var(--c-bg); border-color: var(--c-line); }
.ak-cart-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 18px 9px 14px;
  background: var(--c-ink);
  color: #fff !important;
  border: 2px solid var(--c-line);
  border-radius: 999px;
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  text-decoration: none !important;
  transition: transform .1s;
  white-space: nowrap;
}
.ak-cart-btn:hover { transform: translateY(-1px); color: #fff !important; }
.ak-cart-pill {
  background: var(--c-accent);
  color: #fff;
  font-size: 12px;
  border-radius: 999px;
  padding: 2px 8px;
  font-weight: 700;
}

/* Mobile nav */
@media (max-width: 960px) {
  .ak-mobile-toggle { display: inline-flex !important; }
  .ak-nav-wrap {
    display: none;
    position: absolute;
    top: 100%;
    left: 0; right: 0;
    background: var(--c-bg-2);
    border-bottom: 2px solid var(--c-line);
    padding: 12px 16px;
    z-index: 99;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    justify-content: flex-start;
  }
  .ak-nav-wrap.ak-nav--open { display: block; }
  ul.ak-nav { flex-direction: column; gap: 2px; width: 100%; }
  ul.ak-nav li a { padding: 13px 16px; border-radius: var(--r-sm); font-size: 16px; }
}
@media (min-width: 961px) {
  .ak-mobile-toggle { display: none !important; }
  .ak-nav-wrap { display: flex !important; }
}

/* ============ Fix category-strip sticky top offset ============ */
.ak-cats { top: 0; }

/* ============ CSS var aliases — used by banner/popup inline styles ============ */
:root {
  --serif:         var(--f-display);
  --sans:          var(--f-sans);
  --ak-yellow:     #FFC43D;
  --ak-yellow-deep:#F2A900;
  --ak-red:        #E63946;
  --ak-red-deep:   #C92A37;
  --ak-ink:        #141414;
}

/* ============ AUTOKID design tokens ============ */
:root {
  --c-bg:      #FFF8E7;
  --c-bg-2:    #FFFFFF;
  --c-ink:     #141414;
  --c-ink-2:   #4A4A4A;
  --c-line:    #141414;

  --c-primary: #FFC43D;
  --c-accent:  #E63946;
  --c-accent-deep: #C92A37;
  --c-accent-2:#2E86DE;

  --c-red:    #E63946;
  --c-yellow: #FFC43D;
  --c-green:  #4CAF50;
  --c-blue:   #2E86DE;
  --c-pink:   #FF6B9D;
  --c-teal:   #1FB5A8;

  /* Muted text on dark surfaces (footer, dark CTA blocks) — --c-ink-2 is muted-on-light only */
  --c-muted-dark:   #B8B8B8;
  --c-muted-dark-2: #D9D9D9;
  /* Hairline divider — the de-facto dashed-border tint used sitewide */
  --c-divider: rgba(0,0,0,.12);
  /* Translucent dark badge fill on colored hero sections */
  --c-overlay-dark: rgba(0,0,0,.2);
  /* Success-state background (contact form, delivery ETA) */
  --c-success-bg: #DBF2DD;

  --r-sm:  10px;
  --r-md:  18px;
  --r-lg:  28px;
  --r-xl:  42px;

  --shadow-1: 0 2px 0 0 #141414;
  --shadow-2: 0 6px 0 0 #141414;
  --shadow-3: 0 10px 0 0 #141414;

  --f-display: 'Fraunces', 'FrauncesLocal', 'Hind Siliguri', Georgia, serif;
  --f-sans:    'Space Grotesk', 'SGroteskLocal', 'Hind Siliguri', -apple-system, 'Helvetica Neue', sans-serif;
  --f-mono:    'JetBrains Mono', 'JBMonoLocal', ui-monospace, Menlo, monospace;

  --fs-base: 16px;
  --fs-h1:   clamp(48px, 7vw, 96px);
  --fs-h2:   clamp(30px, 4vw, 52px);
  --fs-h3:   22px;
}

/* ============ Override Astra Global Colors (kills the blue) ============ */
:root {
  --ast-global-color-0: #FFC43D !important; /* Brand → AUTOKID yellow */
  --ast-global-color-1: #E63946 !important; /* Alt Brand → accent red */
  --ast-global-color-2: #141414 !important; /* Heading → near-black */
  --ast-global-color-3: #141414 !important; /* Text → near-black */
  --ast-global-color-4: #FFF8E7 !important; /* Primary BG */
  --ast-global-color-5: #FFFFFF !important; /* Secondary BG */
  --ast-global-color-6: #141414 !important; /* Border → dark */
  --ast-global-color-7: #FFF8E7 !important; /* Subtle BG */

  /* Astra button variables */
  --ast-btn-bg-color:      #141414 !important;
  --ast-btn-text-color:    #ffffff !important;
  --ast-btn-border-color:  #141414 !important;
  --ast-btn-bg-hover-color: #E63946 !important;
}

/* Kill Astra's blue on links globally (but NOT on button classes) */
a:not(.ak-btn):not(.ak-cart-btn):not(.ak-pill):not(.ak-feature-card):not(.ak-card-add),
a:not(.ak-btn):not(.ak-cart-btn):not(.ak-pill):not(.ak-feature-card):not(.ak-card-add):link,
a:not(.ak-btn):not(.ak-cart-btn):not(.ak-pill):not(.ak-feature-card):not(.ak-card-add):visited {
  color: var(--c-ink);
}

/* Ensure dark buttons always have white text regardless of link overrides */
.ak-btn--primary,
a.ak-btn--primary,
a.ak-btn--primary:link,
a.ak-btn--primary:visited,
a.ak-btn--primary:hover { color: #fff !important; }

.ak-btn--ghost,
a.ak-btn--ghost,
a.ak-btn--ghost:link,
a.ak-btn--ghost:visited { color: var(--c-ink) !important; }

.ak-btn--white,
a.ak-btn--white,
a.ak-btn--white:link,
a.ak-btn--white:visited { color: var(--c-ink) !important; }

h1, h2, h3, h4, h5, h6,
.ast-heading-color,
.entry-title,
.entry-title a,
.site-title,
.site-title a {
  font-family: var(--f-display) !important;
  color: var(--c-ink) !important;
}

/* Astra's body font override */
body,
p,
li,
input,
textarea,
select,
button {
  font-family: var(--f-sans) !important;
}

/* Astra's primary button — make it match our dark pill style */
.ast-btn-style-1,
.ast-btn-style-1:hover,
.ast-site-header-cart .button,
.astra-button,
.wp-block-button__link {
  background: var(--c-ink) !important;
  color: #fff !important;
  border-color: var(--c-ink) !important;
  border-radius: 999px !important;
  font-family: var(--f-sans) !important;
  font-weight: 600 !important;
}

/* ============ Base overrides for Astra ============ */
body {
  font-family: var(--f-sans) !important;
  font-size:   var(--fs-base) !important;
  color:       var(--c-ink) !important;
  background:  var(--c-bg) !important;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--f-display) !important;
  font-weight: 600;
  letter-spacing: -0.02em;
}
a { color: inherit; }
*, *::before, *::after { box-sizing: border-box; }

/* Disable Astra's own background on content area */
.ast-page-builder-template .site-content,
.site-content { background: transparent !important; }

.ak-wrap { max-width: 1340px; margin: 0 auto; padding: 0 32px; }

/* ============ Ticker (below Astra header) ============ */
.ak-ticker {
  background: var(--c-ink);
  color: var(--c-primary);
  border-top: 2px solid var(--c-line);
  overflow: hidden;
}
.ak-ticker-track {
  display: flex;
  gap: 48px;
  padding: 10px 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  white-space: nowrap;
  animation: akTicker 38s linear infinite;
  font-family: var(--f-mono);
}
.ak-ticker-track span { flex: none; }
@keyframes akTicker {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ============ Buttons ============ */
.ak-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 2px solid var(--c-line);
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 999px;
  cursor: pointer;
  transition: transform .12s, box-shadow .12s;
  box-shadow: 2px 2px 0 #141414;
  font-family: var(--f-sans);
  text-decoration: none;
}
.ak-btn:hover { transform: translate(-1px,-2px); box-shadow: 4px 4px 0 #141414; }
.ak-btn:active { transform: translate(0,0); box-shadow: none; }
.ak-btn--primary { background: var(--c-ink); color: #fff; }
.ak-btn--ghost   { background: transparent; }
.ak-btn--white   { background: #fff; color: var(--c-ink); }
.ak-btn--full    { width: 100%; justify-content: center; padding: 18px; font-size: 17px; }

/* ============ Keyboard focus — system-wide ============
   outline-offset draws the ring just outside each element's own
   fill, against the surrounding page background (consistently
   cream-paper/white across this site), so one ink outline reads
   clearly even on saturated card/button fills. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.ak-card:focus-visible,
.ak-feature-card:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--c-ink);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

/* ============ Hero ============ */
.ak-hero {
  background: var(--c-primary);
  border-bottom: 2px solid var(--c-line);
  padding: 64px 0 80px;
  position: relative;
  overflow: hidden;
}
.ak-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 12% 12%, rgba(0,0,0,.08) 2px, transparent 2.5px),
    radial-gradient(circle at 88% 78%, rgba(0,0,0,.06) 2px, transparent 2.5px);
  background-size: 80px 80px;
  pointer-events: none;
}
.ak-hero-inner {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 48px;
  align-items: center;
  position: relative;
}
.ak-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
}
.ak-eyebrow--dark { background: #fff; color: var(--c-ink); }
.ak-dot { width: 8px; height: 8px; background: var(--c-accent); border-radius: 50%; display: inline-block; }
.ak-hero-title {
  font-size: var(--fs-h1);
  line-height: 0.92;
  margin: 22px 0 18px;
  color: var(--c-ink);
}
.ak-hero-title-accent { color: var(--c-accent); font-style: italic; }
.ak-hero-sub {
  font-size: 19px;
  line-height: 1.55;
  color: var(--c-ink-2);
  max-width: 480px;
  margin: 0 0 30px;
}
.ak-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.ak-hero-stats {
  display: flex;
  gap: 40px;
  margin-top: 40px;
  padding-top: 22px;
  border-top: 2px dashed rgba(0,0,0,.22);
  /* min-height reserves layout space before fonts load; overflow:hidden prevents
     the container from growing when a font swap changes glyph metrics. */
  min-height: 86px;
  overflow: hidden;
}
.ak-hero-stats > div { display: flex; flex-direction: column; }
.ak-hero-stats b {
  font-family: var(--f-display);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1; /* locked: Fraunces swap cannot change this element's layout height */
}
.ak-hero-stats span {
  font-size: 13px;
  color: var(--c-ink-2);
  font-family: var(--f-mono);
  line-height: 1.4; /* locked: JetBrains Mono swap cannot change this element's layout height */
}

/* Hero visual / product card */
.ak-hero-visual { position: relative; min-height: 420px; }
.ak-hero-sun {
  position: absolute; top: -40px; right: -40px;
  width: 280px; height: 280px; border-radius: 50%;
  background: var(--c-accent); opacity: 0.9; z-index: 0;
}
.ak-hero-card {
  position: relative; z-index: 1;
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: 22px;
  box-shadow: var(--shadow-3);
  max-width: 460px;
  margin: 0 auto;
  transform: rotate(-1.5deg);
}
.ak-hero-tag {
  display: inline-block;
  background: var(--c-primary);
  border: 2px solid var(--c-line);
  padding: 4px 12px;
  border-radius: 999px;
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  margin-bottom: 12px;
}
.ak-hero-car {
  background: #F6F6F6;
  border: 2px dashed var(--c-line);
  border-radius: var(--r-md);
  overflow: hidden;
  aspect-ratio: 16 / 9;
  display: grid;
  place-items: center;
  margin-bottom: 14px;
}
.ak-hero-car img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ak-hero-car-name { font-family: var(--f-display); font-size: 20px; font-weight: 700; }
.ak-hero-card-foot { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; }
.ak-hero-price { font-family: var(--f-display); font-size: 28px; font-weight: 700; white-space: nowrap; }

.ak-hero-bubble {
  position: absolute;
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: 16px;
  padding: 10px 14px;
  font-size: 13px;
  font-family: var(--f-mono);
  line-height: 1.3;
  box-shadow: var(--shadow-2);
  z-index: 2;
}
.ak-hero-bubble b { font-family: var(--f-display); font-size: 16px; font-weight: 700; display: block; }
.ak-hero-bubble--1 { top: -10px; left: -20px; transform: rotate(-6deg); }
.ak-hero-bubble--2 { bottom: 20px; right: -10px; transform: rotate(5deg); background: var(--c-accent); color: #fff; }

/* ============ Hero image carousel (2+ angles; desktop/tablet ≥861px only — .ak-hero-visual hides below that) ============ */
.ak-hero-car.ak-hero-carousel {
  display: block;
  position: relative;
}
.ak-hero-carousel-track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform .3s ease-in-out;
  will-change: transform;
}
.ak-hero-carousel-slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
}
.ak-hero-carousel-slide img { width: 100%; height: 100%; object-fit: contain; display: block; }

.ak-hero-carousel-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: 50%;
  box-shadow: var(--shadow-1);
  color: var(--c-ink);
  cursor: pointer;
  opacity: 0;
  transition: opacity .2s, transform .15s;
  z-index: 3;
}
.ak-hero-carousel-arrow--prev { left: 10px; }
.ak-hero-carousel-arrow--next { right: 10px; }
.ak-hero-carousel:hover .ak-hero-carousel-arrow:not(:disabled) { opacity: 1; }
.ak-hero-carousel-arrow:hover:not(:disabled) { transform: translateY(-50%) translateY(-1px); }
.ak-hero-carousel-arrow:focus-visible { opacity: 1; }
.ak-hero-carousel-arrow:disabled { opacity: .25 !important; cursor: not-allowed; }
@media (hover: none) {
  .ak-hero-carousel-arrow { opacity: .85; }
  .ak-hero-carousel-arrow:disabled { opacity: .2 !important; }
}

.ak-hero-carousel-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 4px 0 2px;
}
.ak-hero-carousel-dot {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
}
.ak-hero-carousel-dot::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #E0E0E0;
  transition: background .2s, transform .2s;
}
.ak-hero-carousel-dot.is-active::before {
  background: var(--c-accent);
  transform: scale(1.3);
}

/* ============ Category strip ============ */
.ak-cats {
  background: var(--c-bg-2);
  border-bottom: 2px solid var(--c-line);
  padding: 18px 0;
  position: sticky;
  top: 0;
  z-index: 40;
}
.ak-cats-row { display: flex; gap: 10px; flex-wrap: wrap; }
.ak-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 18px;
  box-sizing: border-box;
  background: var(--c-bg);
  border: 2px solid var(--c-line);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: transform .15s;
  font-family: var(--f-sans);
  text-decoration: none;
  color: var(--c-ink);
}
.ak-pill:hover { transform: translateY(-1px); color: var(--c-ink); }
.ak-pill--on { background: var(--c-ink); color: #fff !important; }
.ak-pill-count {
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
  font-family: var(--f-mono);
}
.ak-pill--on .ak-pill-count { background: rgba(255,255,255,.2); }

/* ============ Catalog / product grid ============ */
.ak-catalog { padding: 80px 0; }
.ak-section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
  gap: 24px;
}
.ak-section-head h2 { font-size: var(--fs-h2); line-height: 1; }
.ak-section-sub { font-size: 17px; color: var(--c-ink-2); margin: 10px 0 0; max-width: 440px; }

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

/* ============ Product card ============ */
.ak-card {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  filter: drop-shadow(0 2px 0 #141414);
  transition: transform .15s, filter .15s;
}
.ak-card:hover { transform: translate(-2px, -4px); filter: drop-shadow(0 10px 0 #141414); }

.ak-card-badge {
  position: absolute; top: 14px; left: 14px; z-index: 2;
  background: var(--c-ink); color: #fff;
  font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.1em; font-weight: 700;
  padding: 4px 10px; border-radius: 999px; border: 2px solid var(--c-line);
}
.ak-card-badge--red    { background: var(--c-accent); }
.ak-card-badge--yellow { background: var(--c-primary); color: var(--c-ink); }
.ak-card-badge--green  { background: var(--c-green); }
.ak-card-badge--pink   { background: var(--c-pink); }

.ak-card-img {
  aspect-ratio: 4 / 3;
  background: var(--c-bg);
  border-bottom: 2px solid var(--c-line);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 16px;
  overflow: hidden;
  text-decoration: none;
}
.ak-card-img img {
  width: 100%; height: 100%;
  object-fit: contain;
  display: block;
}
.ak-card-img--red    { background: #FFE2E4; }
.ak-card-img--yellow { background: #FFF3C9; }
.ak-card-img--green  { background: #DBF2DD; }
.ak-card-img--blue   { background: #D9EAFF; }
.ak-card-img--pink   { background: #FFDCE9; }
.ak-card-img--teal   { background: #CFEEEA; }

.ak-card-body { padding: 18px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.ak-card-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ak-card-name {
  font-size: 18px; font-weight: 700;
  font-family: var(--f-display); line-height: 1.1;
  margin: 0;
}
.ak-card-name a { text-decoration: none; color: inherit; }
/* Price block — sale price big, original price small beside it */
.ak-card-price {
  font-family: var(--f-display);
  font-size: 20px;
  font-weight: 700;
  white-space: nowrap;
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}
.ak-card-price del,
.ak-card-price del .woocommerce-Price-amount {
  text-decoration: line-through;
  color: var(--c-ink-2) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}
.ak-card-price ins {
  text-decoration: none;
  font-size: 20px;
  font-weight: 700;
  color: var(--c-ink);
}
/* WooCommerce wraps price in .price span — same rules */
.ak-card .price {
  font-family: var(--f-display) !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
}
.ak-card .price del,
.ak-card .price del .woocommerce-Price-amount {
  font-size: 12px !important;
  color: var(--c-ink-2) !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
  opacity: 1 !important;
}
.ak-card .price ins .woocommerce-Price-amount {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
}
.ak-card-tag  { font-family: var(--f-mono); font-size: 12px; color: var(--c-ink-2); letter-spacing: 0.03em; }

.ak-card-highlights { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.ak-card-highlights li {
  font-size: 13px; color: var(--c-ink); padding-left: 16px;
  position: relative; line-height: 1.35;
}
.ak-card-highlights li::before { content: '✓'; position: absolute; left: 0; color: var(--c-accent); font-weight: 700; }

/* Add to cart button — overrides WooCommerce default */
.ak-card-add,
.ak-card .button.add_to_cart_button,
.ak-card .single_add_to_cart_button {
  margin-top: auto;
  padding: 14px !important;
  background: var(--c-ink) !important;
  color: #fff !important;
  border: 2px solid var(--c-line) !important;
  border-radius: 999px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: background-color .2s, color .2s;
  text-align: center;
  display: block;
  text-decoration: none;
  font-family: var(--f-sans) !important;
  box-shadow: none !important;
}
.ak-card-add:hover,
.ak-card .button.add_to_cart_button:hover,
.ak-card .single_add_to_cart_button:hover {
  background: var(--c-accent) !important;
  color: #fff !important;
}

/* WooCommerce price overrides inside card */
.ak-card .woocommerce-Price-amount { font-family: var(--f-display); }
.ak-card ins { text-decoration: none; }
.ak-card del { color: var(--c-ink-2); font-size: 0.8em; }

/* ============ Feature strip / category cards ============ */
.ak-feature-strip { padding: 20px 0 80px; }
.ak-feature-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ak-feature-card {
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: 28px;
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 220px;
  box-shadow: var(--shadow-2);
  transition: transform .15s;
  text-decoration: none;
  color: inherit;
}
.ak-feature-card:hover { transform: translate(-2px,-3px); color: inherit; }
.ak-feature-card--yellow { background: var(--c-primary); }
.ak-feature-card--red    { background: var(--c-accent-deep); color: #fff; }
.ak-feature-card--green  { background: var(--c-green); color: var(--c-ink); }
.ak-feature-card--blue   { background: var(--c-blue); color: var(--c-ink); }
.ak-feature-card--teal   { background: var(--c-teal); color: var(--c-ink); }
.ak-feature-card--pink   { background: var(--c-pink); color: var(--c-ink); }
.ak-feature-title { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; }
.ak-feature-desc  { margin-top: 14px; font-size: 15px; line-height: 1.5; opacity: 0.9; flex: 1; }
.ak-feature-arrow { margin-top: 16px; font-size: 24px; font-weight: 700; text-align: right; }

/* ============ Gift banner ============ */
.ak-gift {
  background: var(--c-ink);
  color: #fff;
  padding: 80px 0;
  border-top: 2px solid var(--c-line);
  border-bottom: 2px solid var(--c-line);
}
.ak-gift-inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: center; }
.ak-gift-copy h2 { font-size: var(--fs-h2); color: #fff; margin: 18px 0 16px; }
.ak-gift-copy p { font-size: 18px; line-height: 1.6; color: #D9D9D9; max-width: 440px; margin: 0 0 28px; }
.ak-gift-visual {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;
  height: 280px;
}
.ak-gift-box {
  border-radius: var(--r-md);
  border: 2px solid rgba(255,255,255,.2);
  display: grid; place-items: center;
  font-family: var(--f-display); font-size: 64px; font-weight: 700;
}
.ak-gift-box--1 { background: var(--c-primary); color: var(--c-ink); }
.ak-gift-box--2 { background: var(--c-accent); color: #fff; }
.ak-gift-box--3 { background: #fff; color: var(--c-ink); }
.ak-gift-box--4 { background: var(--c-green); color: #fff; }

/* ============ Testimonials ============ */
.ak-quotes { padding: 80px 0; }
.ak-quotes-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 30px; }
.ak-quote {
  margin: 0;
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 26px;
  box-shadow: var(--shadow-1);
}
.ak-quote blockquote {
  margin: 0 0 16px; padding: 0;
  font-family: var(--f-display);
  font-size: 19px; line-height: 1.35; font-weight: 500;
}
.ak-quote figcaption { font-family: var(--f-mono); font-size: 12px; color: var(--c-ink-2); }

/* ============ Footer (AUTOKID custom) ============ */
.ak-footer-custom {
  background: var(--c-ink);
  color: #EAEAEA;
  padding: 60px 0 24px;
  border-top: 2px solid var(--c-line);
}
.ak-footer-inner {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr;
  gap: 32px;
  padding-bottom: 48px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
/* 3rd attempt: icon shrunk 36px → 30px (footer.php) to match the text's
   actual proportions, not just its box height. A solid icon fills its box
   edge-to-edge; serif text glyphs don't fill theirs — matching box heights
   (1st/2nd attempts) still looked oversized/misaligned because the icon
   reads visually "denser" than the text next to it. height now matches the
   new 30px icon exactly. white-space:nowrap stops "AUTOKID®" wrapping. */
.ak-footer-logo {
  font-family: var(--f-display); color: var(--c-primary); font-size: 30px; font-weight: 700;
  display: inline-flex; align-items: center; height: 30px; line-height: 1;
  white-space: nowrap;
}
.ak-footer-logo sup { font-size: 13px; line-height: 1; }
.ak-footer-brand p { color: #B8B8B8; margin: 12px 0 0; font-size: 15px; line-height: 1.55; max-width: 340px; }
.ak-footer-custom h4 {
  color: #fff; font-family: var(--f-sans); font-size: 13px;
  font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  margin-bottom: 14px; margin-top: 0;
}
.ak-footer-custom a { display: block; padding: 6px 0; color: #B8B8B8 !important; font-size: 15px; text-decoration: none !important; }
.ak-footer-custom a:hover { color: var(--c-primary) !important; }
/* Specificity fix: ".ak-footer-custom a" (class+tag) beat this single-class
   selector, forcing display:block + padding:6px 0 onto the logo link and
   breaking icon/text inline alignment despite inline-flex being set here.
   Qualify with the parent class so this rule wins without !important. */
.ak-footer-brand a.ak-footer-logo-link { display: inline-flex; align-items: center; flex-wrap: nowrap; gap: 8px; text-decoration: none !important; margin-bottom: 12px; padding: 0; }
.ak-footer-phone { color: #B8B8B8; margin-top: 8px; font-family: var(--f-mono); font-size: 14px; display: flex; align-items: center; gap: 8px; }
.ak-footer-phone a { color: #B8B8B8 !important; display: inline !important; padding: 0 !important; }
.ak-footer-phone a:hover { color: var(--c-primary) !important; }
.ak-footer-icon { color: var(--c-primary); display: inline-flex; align-items: center; flex-shrink: 0; }
.ak-footer-tagline { display: block !important; font-size: 14px !important; color: #B8B8B8 !important; font-style: italic; margin: 4px 0 20px !important; line-height: 1.5 !important; }
.ak-footer-connect-head { color: #fff !important; font-family: var(--f-sans) !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .08em !important; text-transform: uppercase !important; margin: 0 0 10px !important; }
.ak-sub { display: flex; gap: 6px; margin-top: 12px; }
.ak-sub input {
  flex: 1; padding: 10px 14px; border-radius: 999px;
  border: 2px solid #333; background: #222; color: #fff;
  font-family: var(--f-sans); font-size: 15px;
}
.ak-sub input:focus-visible { border-color: var(--c-primary); }
.ak-sub button {
  background: var(--c-primary); color: var(--c-ink);
  border: 2px solid var(--c-primary); border-radius: 999px;
  padding: 0 18px; font-weight: 700; cursor: pointer;
  font-family: var(--f-sans); font-size: 15px;
}
.ak-footer-bottom {
  display: flex; justify-content: space-between;
  padding-top: 24px;
  font-family: var(--f-mono); font-size: 12px; color: #888;
  flex-wrap: wrap; gap: 8px;
}

/* ============ Special Offer page ============ */
.ak-offer-hero {
  background: var(--c-accent);
  color: #fff;
  padding: 60px 0;
  border-bottom: 2px solid var(--c-line);
  text-align: center;
}
.ak-offer-hero h1 { font-size: var(--fs-h2); color: #fff; margin: 0 0 12px; }
.ak-offer-hero p  { font-size: 18px; opacity: .88; margin: 0; }

/* ============ Return Policy page ============ */
.ak-policy { padding: 60px 0 80px; }
.ak-policy-inner { max-width: 820px; }
.ak-policy h1 { font-size: clamp(32px, 4vw, 52px); margin-bottom: 32px; }
.ak-policy h2 { font-size: 22px; margin: 40px 0 12px; padding-top: 14px; border-top: 2px dashed rgba(0,0,0,.12); }
.ak-policy p  { font-size: 16px; line-height: 1.7; color: var(--c-ink-2); margin: 0 0 16px; }
.ak-policy ul { padding-left: 0; list-style: none; }
.ak-policy ul li { padding: 8px 0 8px 20px; position: relative; font-size: 16px; line-height: 1.6; color: var(--c-ink-2); border-bottom: 1px dashed rgba(0,0,0,.1); }
.ak-policy ul li::before { content: '✓'; position: absolute; left: 0; color: var(--c-accent); font-weight: 700; }
.ak-policy .ak-policy-callout {
  background: var(--c-primary);
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 24px;
  margin: 28px 0;
  font-size: 16px;
  font-weight: 600;
}
.ak-policy .ak-policy-contact {
  background: var(--c-ink);
  color: #fff;
  border-radius: var(--r-md);
  padding: 28px;
  margin-top: 40px;
}
.ak-policy .ak-policy-contact h3 { color: var(--c-primary) !important; font-size: 18px; margin: 0 0 12px; }
.ak-policy .ak-policy-contact p  { color: #D9D9D9 !important; margin: 4px 0; }
.ak-policy .ak-policy-contact p span { color: var(--c-primary) !important; }
.ak-policy .ak-policy-contact a,
.ak-policy .ak-policy-contact a:link,
.ak-policy .ak-policy-contact a:visited,
.site .ak-policy .ak-policy-contact a { color: var(--c-primary) !important; text-decoration: underline !important; }
.ak-policy .ak-policy-contact a:hover { color: #fff !important; }

/* ============ Return Policy — additional elements ============ */
.ak-policy-hero {
  background: var(--c-accent);
  border-bottom: 2px solid var(--c-line);
  padding: 56px 0 40px;
}
.ak-policy-hero .ak-eyebrow { background: rgba(0,0,0,.2); color: #fff; margin-bottom: 16px; }
.ak-policy-hero h1 { font-size: var(--fs-h2); color: #fff !important; margin: 0 0 12px; }
.ak-policy-hero p  { font-size: 18px; color: rgba(255,255,255,.88); margin: 0 0 24px; max-width: 580px; }
.ak-policy-hero-jumps {
  display: flex; gap: 8px; flex-wrap: wrap;
}
.ak-policy-updated {
  font-family: var(--f-mono); font-size: 12px; color: var(--c-ink-2);
  margin: 0 0 32px;
}
.ak-policy ol.ak-policy-steps {
  padding-left: 0; list-style: none; counter-reset: step; margin: 16px 0;
}
.ak-policy ol.ak-policy-steps li {
  counter-increment: step;
  padding: 16px 16px 16px 54px;
  position: relative;
  border-bottom: 1px dashed rgba(0,0,0,.1);
  font-size: 16px; line-height: 1.6;
}
.ak-policy ol.ak-policy-steps li::before {
  content: counter(step);
  position: absolute; left: 0; top: 14px;
  width: 32px; height: 32px;
  background: var(--c-accent); color: #fff;
  border-radius: 50%; border: 2px solid var(--c-line);
  display: grid; place-items: center;
  font-family: var(--f-display); font-weight: 700; font-size: 14px;
}
.ak-policy ol.ak-policy-steps li strong { display: block; margin-bottom: 4px; }
.ak-policy ol.ak-policy-steps li p { margin: 0; font-size: 15px; color: var(--c-ink-2); }
.ak-policy-qa-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 40px;
}
.ak-policy-qa {
  background: #fff; border: 2px solid var(--c-line); border-radius: var(--r-md);
  padding: 20px; box-shadow: var(--shadow-1);
}
.ak-policy-qa h3 { font-size: 16px; margin: 0 0 8px; }
.ak-policy-qa p  { font-size: 14px; color: var(--c-ink-2); line-height: 1.6; margin: 0; }
@media (max-width: 600px) {
  .ak-policy-qa-grid { grid-template-columns: 1fr; }
  /* Same scroll-affordance philosophy as the product tabs (1.20.19):
     one nowrap row + thin VISIBLE scrollbar — a hidden scrollbar made
     the overflow undiscoverable (1.20.20 fix). */
  .ak-policy-hero-jumps {
    overflow-x: auto;
    flex-wrap: nowrap;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.6) transparent;
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;
  }
  .ak-policy-hero-jumps::-webkit-scrollbar { height: 4px; }
  .ak-policy-hero-jumps::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.6);
    border-radius: 999px;
  }
  .ak-faq-jump { flex-shrink: 0; }
}

/* ============ Product card — image fit fix ============ */
.ak-card-img {
  padding: 20px;       /* breathing room around photo */
  overflow: hidden;
  box-sizing: border-box;
}
.ak-card-img img,
.ak-card-img .attachment-woocommerce_thumbnail,
.ak-card-img .wp-post-image {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;  /* explicit ratio lets browser reserve space before download */
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  border-radius: 0 !important;
  max-width: 100% !important;
}

/* ============ Product card — kill Astra/WC blue link colour ============ */
.ak-card .woocommerce-loop-product__title,
.ak-card h2.woocommerce-loop-product__title,
.ak-card .ak-card-name,
.ak-card .ak-card-name a,
.ak-card .ak-card-name a:link,
.ak-card .ak-card-name a:visited,
.ak-card .ak-card-name a:hover {
  color: var(--c-ink) !important;
  text-decoration: none !important;
}

/* WooCommerce price inside card — use design tokens */
.ak-card .price,
.ak-card .woocommerce-Price-amount {
  font-family: var(--f-display) !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
}
.ak-card .price ins,
.ak-card .price ins .woocommerce-Price-amount {
  text-decoration: none !important;
  color: var(--c-ink) !important;
}
.ak-card .price del,
.ak-card .price del .woocommerce-Price-amount {
  color: var(--c-ink-2) !important;
  font-size: 0.78em;
  font-weight: 400;
  opacity: 1 !important;
}

/* ============ WooCommerce shop page grid reset ============ */
/* Override WC's old float layout so our CSS grid works cleanly */
.woocommerce ul.products.ak-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.woocommerce ul.products.ak-grid::before,
.woocommerce ul.products.ak-grid::after { display: none !important; }
.woocommerce ul.products.ak-grid li.product {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  clear: none !important;
}
/* WC injects a sale flash — hide it (we use our own badge) */
.ak-card .onsale { display: none !important; }

@media (max-width: 1024px) {
  .woocommerce ul.products.ak-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
/* Switch to 1-column at 640px — 2 columns on 375px phones = ~163px per card, too cramped */
@media (max-width: 640px) {
  .woocommerce ul.products.ak-grid { grid-template-columns: 1fr !important; }
  .ak-grid { grid-template-columns: 1fr !important; }
}

/* ============ Mobile: category strip — no sticky, horizontal scroll ============ */
@media (max-width: 960px) {
  /* Remove sticky so it never overlaps products */
  .ak-cats,
  section.ak-cats,
  div.ak-cats {
    position: relative !important;
    top: auto !important;
    z-index: 1 !important;
  }
  /* Single scrollable row — pills never wrap */
  .ak-cats-row {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    scrollbar-width: none;
  }
  .ak-cats-row::-webkit-scrollbar { display: none; }
  .ak-pill { flex-shrink: 0 !important; }
}

/* ============ WooCommerce global overrides ============ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--c-ink) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-family: var(--f-sans) !important;
  font-weight: 600 !important;
  border: 2px solid var(--c-line) !important;
  padding: 12px 22px !important;
  box-shadow: var(--shadow-1) !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: var(--c-accent) !important;
  color: #fff !important;
}
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--c-accent) !important;
}
.woocommerce-message::before { color: var(--c-accent) !important; }
.woocommerce .woocommerce-breadcrumb { display: none; }

/* ============ Single product page ============ */
.ak-single-wrap { padding-top: 40px; padding-bottom: 80px; }

/* Two-column grid: image left, summary right */
.single-product div.product,
.single-product .woocommerce div.product {
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: clamp(24px, 3vw, 48px);
  align-items: start;
  max-width: 1180px;
  margin: 0 auto;
}
/* Kill WooCommerce float layout */
.single-product .woocommerce-product-gallery,
.single-product div.product .summary.entry-summary {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  clear: none !important;
  margin: 0 !important;
}
.single-product .woocommerce-product-gallery {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: 15px !important;
}
.single-product .woocommerce-product-gallery .flex-viewport {
  margin: 0 0 16px !important;
  border: 2px solid rgba(20,20,20,.08);
  border-radius: var(--r-md);
  background: #fff;
  padding: 10px;
}
.single-product .woocommerce-product-gallery__image {
  border-radius: calc(var(--r-md) - 2px);
  overflow: hidden;
}
.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image img {
  border-radius: calc(var(--r-md) - 4px);
}
.single-product div.product .summary.entry-summary {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: 15px !important;
  margin-top: 0 !important;
}
.single-product div.product .summary.entry-summary > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
/* Tabs + related span both columns */
.single-product .woocommerce-tabs,
.single-product .related.products,
.single-product .up-sells.products {
  grid-column: 1 / -1;
  clear: both;
  margin-top: 40px;
}
/* Product title */
.single-product .product_title {
  font-family: var(--f-display) !important;
  font-size: clamp(24px, 2.2vw, 36px) !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
  line-height: 1.18 !important;
  margin: 0 0 22px !important;
}
/* Price */
.single-product p.price,
.single-product span.price {
  font-family: var(--f-display) !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin: 0 0 22px !important;
}
.single-product p.price del,
.single-product span.price del { font-size: 18px !important; color: var(--c-ink-2) !important; font-weight: 400 !important; }
.single-product p.price ins,
.single-product span.price ins { text-decoration: none !important; }
/* Short description */
.single-product .woocommerce-product-details__short-description {
  font-size: 15px !important;
  color: var(--c-ink-2) !important;
  line-height: 1.65 !important;
  margin: 0 0 24px !important;
  border-top: 2px dashed rgba(0,0,0,.12);
  padding-top: 14px;
  max-width: 62ch;
}
.single-product div.product .summary.entry-summary > *:last-child {
  margin-bottom: 0 !important;
}

/* Variable product controls */
.single-product form.cart .variations {
  margin: 0 0 16px !important;
  border: 0 !important;
}
.single-product form.cart .variations tr,
.single-product form.cart .variations td,
.single-product form.cart .variations th {
  border: 0 !important;
  background: transparent !important;
}
.single-product form.cart .variations td,
.single-product form.cart .variations th {
  padding: 0 0 10px !important;
}
.single-product form.cart .variations label {
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--c-ink-2);
}
.single-product form.cart .variations select {
  width: 100% !important;
  border: 2px solid var(--c-line) !important;
  border-radius: var(--r-sm) !important;
  background: var(--c-bg) !important;
  min-height: 46px;
  padding: 10px 12px !important;
  font-family: var(--f-sans) !important;
  color: var(--c-ink) !important;
}
.single-product form.cart .reset_variations {
  display: inline-block;
  font-family: var(--f-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--c-ink-2) !important;
  margin-top: -2px;
}
/* Qty + add to cart row */
.single-product form.cart {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.single-product .quantity input {
  border: 2px solid var(--c-line) !important;
  border-radius: var(--r-sm) !important;
  padding: 12px 14px !important;
  font-size: 16px !important;
  font-family: var(--f-sans) !important;
  width: 80px !important;
  background: var(--c-bg) !important;
}
.single-product .single_add_to_cart_button,
.single-product .ast-on-card-button {
  background: var(--c-ink) !important;
  color: #fff !important;
  border: 2px solid var(--c-line) !important;
  border-radius: 999px !important;
  padding: 14px 32px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  font-family: var(--f-sans) !important;
  box-shadow: 2px 2px 0 #141414 !important;
  cursor: pointer !important;
  transition: transform .12s, box-shadow .12s, background-color .2s !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}
.single-product .single_add_to_cart_button:hover,
.single-product .ast-on-card-button:hover {
  background: var(--c-accent) !important;
  color: #fff !important;
  transform: translate(-1px,-2px) !important;
  box-shadow: 4px 4px 0 #141414 !important;
}
.single-product .single_add_to_cart_button:active,
.single-product .ast-on-card-button:active {
  transform: translate(0,0) !important;
  box-shadow: none !important;
}
/* Product meta (category tag) */
.single-product .product_meta {
  font-size: 13px;
  color: var(--c-ink-2);
  font-family: var(--f-mono);
  padding-top: 16px;
  border-top: 2px dashed rgba(0,0,0,.12);
}
.single-product .product_meta a { color: var(--c-ink-2); }
.single-product .product_meta .sku_wrapper,
.single-product .product_meta .posted_in {
  display: none !important;
}
.single-product .single-product-category,
.single-product .product-category,
.single-product .product_meta .single-product-category {
  display: none !important;
}
/* Hide meta container when no visible meta items remain */
.single-product .product_meta:empty {
  display: none !important;
}

/* Gallery polish */
.single-product .woocommerce-product-gallery__wrapper {
  border-radius: var(--r-md);
  overflow: hidden;
}
.single-product .woocommerce-product-gallery__wrapper img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.single-product .flex-control-thumbs {
  margin-top: 14px !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.single-product .flex-control-thumbs li {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  border: 2px solid var(--c-line);
  border-radius: var(--r-sm);
  overflow: hidden;
  background: #fff;
  padding: 4px;
}
.single-product .flex-control-thumbs img {
  width: 100% !important;
  height: 76px !important;
  object-fit: contain;
  border-radius: 8px;
  opacity: .65;
  background: #fff;
}
.single-product .flex-control-thumbs img.flex-active,
.single-product .flex-control-thumbs li:hover img {
  opacity: 1;
}
/* Sale badge — matches ak-card-badge--red exactly */
.single-product span.onsale,
.single-product .ast-onsale-card {
  background: var(--c-accent) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-family: var(--f-mono) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  padding: 4px 10px !important;
  border: 2px solid var(--c-line) !important;
  top: 14px !important;
  left: 14px !important;
  min-height: unset !important;
  line-height: 1.4 !important;
  display: inline-block !important;
}
/* ============ Tabs — pill-filter style (matches .ak-pill) ============ */
.woocommerce div.product .woocommerce-tabs {
  margin-top: 36px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  /* 2px top padding + overflow:visible — the hover translateY(-1px)
     was clipped at desktop by an inherited overflow on the tab list
     (Astra/WC-side); give the lift room and never clip it (1.20.20). */
  padding: 2px 2px 0;
  margin: 0 0 16px !important;
  border: none;
  background: transparent;
  list-style: none;
  overflow: visible !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  flex: 0 0 auto;
  border: 2px solid var(--c-line) !important;
  border-radius: 999px !important;
  background: var(--c-bg);
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  transition: background 0.15s, color 0.15s;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
  display: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li:hover:not(.active) {
  transform: translateY(-1px);
}
/* Active tab — inverts to ink fill, same language as .ak-pill--on */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: var(--c-ink);
  border-color: var(--c-line) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  box-sizing: border-box;
  padding: 11px 22px !important;
  font-family: var(--f-mono) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--c-ink) !important;
  text-decoration: none;
  white-space: nowrap;
  position: relative;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: #fff !important;
}
/* Panel — flat card, hard offset shadow, no blur */
.woocommerce div.product .woocommerce-tabs .panel {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: 36px;
  margin-top: 0 !important;
  box-shadow: var(--shadow-1);
  position: relative;
}
/* Generic tables inside description panel (e.g. spec tables) */
.woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-sans);
  font-size: 14px;
  margin: 0 0 20px;
  border: 2px solid var(--c-line);
  border-radius: var(--r-sm);
  overflow: hidden;
}
.woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) th {
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  background: var(--c-ink);
  color: #fff;
  padding: 11px 16px;
  text-align: left;
  border-right: 1px solid rgba(255,255,255,0.2);
}
.woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) th:last-child {
  border-right: none;
}
.woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) td {
  padding: 11px 16px;
  color: var(--c-ink-2);
  border-bottom: 1px solid rgba(20,20,20,0.12);
  border-right: 1px solid rgba(20,20,20,0.12);
}
.woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) td:last-child {
  border-right: none;
}
.woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) tr:last-child td {
  border-bottom: none;
}
.woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) tr:nth-child(even) td {
  background: rgba(20,20,20,0.025);
}
/* Description panel typography */
.woocommerce div.product .woocommerce-tabs .panel h2 {
  font-family: var(--f-display);
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 700;
  color: var(--c-ink);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 3px solid var(--c-primary);
}
.woocommerce div.product .woocommerce-tabs .panel p {
  font-family: var(--f-sans);
  font-size: 15px;
  line-height: 1.75;
  color: var(--c-ink-2);
  margin: 0 0 14px;
  max-width: 72ch; /* comfortable reading measure on wide panels */
}
.woocommerce div.product .woocommerce-tabs .panel ul {
  padding-left: 0;
  list-style: none;
  margin: 0 0 18px;
}
.woocommerce div.product .woocommerce-tabs .panel ul li {
  position: relative;
  padding-left: 22px;
  font-size: 15px;
  line-height: 1.7;
  color: var(--c-ink-2);
  margin-bottom: 8px;
  max-width: 72ch;
}
.woocommerce div.product .woocommerce-tabs .panel ul li::before {
  content: '→';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--c-accent);
  font-weight: 700;
}
/* Additional information table */
.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-sans);
  font-size: 14px;
}
.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes tr {
  border-bottom: 1px solid var(--c-line);
}
.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes th {
  font-family: var(--f-mono);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--c-ink);
  background: var(--c-bg);
  padding: 12px 16px;
  width: 36%;
  text-align: left;
  border-right: 2px solid var(--c-line);
}
.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes td {
  padding: 12px 16px;
  color: var(--c-ink-2);
}
/* Reviews — basic tidy */
.woocommerce div.product .woocommerce-tabs #reviews #comments ol.commentlist li {
  padding: 0;
  background: none;
  border: 2px solid var(--c-line);
  border-radius: var(--r-sm);
  margin-bottom: 16px;
  padding: 20px;
}
.woocommerce div.product .woocommerce-tabs #reviews #comments ol.commentlist li img.avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid var(--c-line);
  position: relative;
  top: 0;
  left: 0;
  float: none;
  margin: 0 12px 0 0;
}
/* Star rating — brand yellow instead of WC's default orange */
.woocommerce .star-rating,
.woocommerce .comment-form-rating .stars a {
  color: var(--c-primary);
}
.woocommerce .star-rating::before {
  color: var(--c-line);
  opacity: .25;
}
.woocommerce .star-rating span::before {
  color: var(--c-primary);
}
/* Average-rating summary near the price / in archive cards */
.woocommerce-product-rating {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
}
.woocommerce-product-rating .woocommerce-review-link {
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .03em;
  color: var(--c-ink-2);
  text-decoration: none;
}
/* Review form — same input language as the contact form */
#review_form #commentform p.comment-form-author input,
#review_form #commentform p.comment-form-email input,
#review_form #commentform p.comment-form-comment textarea {
  border: 2px solid var(--c-line) !important;
  border-radius: var(--r-sm) !important;
  padding: 12px 14px !important;
  font-family: var(--f-sans) !important;
  background: var(--c-bg) !important;
  box-shadow: none !important;
}
#review_form #commentform .comment-form-rating label {
  font-family: var(--f-mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--c-ink-2);
}
#review_form #commentform #submit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 2px solid var(--c-line);
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 999px;
  cursor: pointer;
  background: var(--c-ink);
  color: #fff;
  box-shadow: 2px 2px 0 #141414;
  transition: transform .12s, box-shadow .12s;
  font-family: var(--f-sans);
}
#review_form #commentform #submit:hover {
  transform: translate(-1px,-2px);
  box-shadow: 4px 4px 0 #141414;
}
#review_form #commentform #submit:active {
  transform: translate(0,0);
  box-shadow: none;
}
/* Mobile tabs — pill style */
@media (max-width: 600px) {
  /* One scrollable row — base rule wraps, which stacked tabs to two
     lines on narrow screens instead of scrolling (1.20.19 fix). Thin
     visible scrollbar = the "more tabs exist" cue; hiding it made
     overflow silent. */
  .woocommerce div.product .woocommerce-tabs ul.tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(20,20,20,.35) transparent;
    -webkit-overflow-scrolling: touch;
    gap: 4px;
    padding: 12px 12px 6px;
    border-radius: var(--r-md) var(--r-md) 0 0;
  }
  .woocommerce div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar { height: 4px; }
  .woocommerce div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar-thumb {
    background: rgba(20,20,20,.35);
    border-radius: 999px;
  }
  .woocommerce div.product .woocommerce-tabs ul.tabs li a {
    padding: 11px 18px !important;
    font-size: 10.5px !important;
  }
  .woocommerce div.product .woocommerce-tabs .panel {
    padding: 22px;
    border-radius: 0 var(--r-md) var(--r-md) var(--r-md);
  }
  /* Wide spec tables scroll horizontally on mobile */
  .woocommerce div.product .woocommerce-tabs .panel table:not(.shop_attributes) {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes {
    display: block;
    overflow-x: auto;
  }
}
/* Mobile: stack image above summary */
@media (max-width: 768px) {
  .single-product div.product,
  .single-product .woocommerce div.product {
    grid-template-columns: 1fr !important;
    gap: 24px;
  }
  .single-product .woocommerce-product-gallery,
  .single-product div.product .summary.entry-summary {
    padding: 16px;
  }
  .single-product .flex-control-thumbs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  .single-product .flex-control-thumbs img {
    height: 72px !important;
  }
  .single-product .single_add_to_cart_button {
    width: 100%;
    justify-content: center;
  }
}

/* (1.20.15) .ak-delivery-eta removed — green shipping banner consolidated
   into the trust row below. */

/* PDP trust row — sits directly under price, before short description.
   THE single on-page trust summary since 1.20.15. */
.ak-pdp-trust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 20px;
}
.ak-pdp-trust-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--c-bg);
  border: 2px solid var(--c-line);
  border-radius: 999px;
  padding: 7px 14px;
  font-family: var(--f-sans);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--c-ink);
  line-height: 1.2;
}
.ak-pdp-trust-item svg { flex-shrink: 0; color: var(--c-teal); }
/* Returns pill — the owner's #1 trust message; yellow fill + sticker
   shadow makes it read first without shouting. */
.ak-pdp-trust-item--hero {
  background: var(--c-primary);
  font-weight: 700;
  box-shadow: 2px 2px 0 #141414;
}
.ak-pdp-trust-item--hero svg { color: var(--c-ink); }
.ak-pdp-trust-link {
  flex-basis: 100%;
  font-size: 13px;
  font-weight: 700;
  color: var(--c-ink) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}
.ak-pdp-trust-link:hover { color: var(--c-accent) !important; }

/* ============ Page: About Us ============ */
.ak-about { padding: 60px 0 80px; }
.ak-about-hero {
  background: var(--c-primary);
  border-bottom: 2px solid var(--c-line);
  padding: 60px 0;
}
.ak-about-hero h1 { font-size: var(--fs-h2); margin: 0 0 12px; }
.ak-about-hero p  { font-size: 18px; color: var(--c-ink-2); max-width: 580px; margin: 0; }
.ak-about-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: start; padding: 60px 0; }
.ak-about-grid h2 { font-size: var(--fs-h2); margin-bottom: 20px; }
.ak-about-grid p  { font-size: 16px; line-height: 1.7; color: var(--c-ink-2); margin-bottom: 16px; }
.ak-values-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 0 0 60px; }
.ak-value-card {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 24px;
  box-shadow: var(--shadow-1);
}
.ak-value-icon { font-size: 32px; margin-bottom: 10px; }
.ak-value-card h3 { font-size: 18px; margin: 0 0 8px; }
.ak-value-card p  { font-size: 14px; color: var(--c-ink-2); line-height: 1.6; margin: 0; }

/* ============ About Us — category list ============ */
.ak-about-cats { display: flex; flex-direction: column; gap: 24px; }
.ak-about-cat {
  display: flex;
  gap: 20px;
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 28px;
  box-shadow: var(--shadow-1);
  align-items: flex-start;
}
.ak-about-cat-icon { font-size: 36px; flex-shrink: 0; line-height: 1; margin-top: 2px; }
.ak-about-cat h3   { font-size: 20px; margin: 0 0 8px; }
.ak-about-cat p    { font-size: 15px; color: var(--c-ink-2); line-height: 1.65; margin: 0; }

/* ============ Contact Us page ============ */
.ak-contact { padding: 60px 0 80px; }
.ak-contact-hero {
  background: var(--c-teal);
  border-bottom: 2px solid var(--c-line);
  padding: 60px 0;
}
.ak-contact-hero h1 { font-size: var(--fs-h2); margin: 0 0 12px; color: #fff; }
.ak-contact-hero p  { font-size: 18px; color: rgba(255,255,255,.85); margin: 0; }
.ak-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding: 60px 0; }
.ak-contact-card {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: 32px;
  box-shadow: var(--shadow-2);
}
.ak-contact-card h3 { font-size: 22px; margin: 0 0 20px; }
.ak-contact-detail { display: flex; gap: 14px; margin-bottom: 16px; align-items: flex-start; }
.ak-contact-icon { font-size: 22px; flex-shrink: 0; margin-top: 2px; }
.ak-contact-detail strong { display: block; font-size: 13px; font-family: var(--f-mono); text-transform: uppercase; letter-spacing: .06em; color: var(--c-ink-2); margin-bottom: 2px; }
.ak-contact-detail span   { font-size: 16px; font-weight: 600; }
.ak-contact-form label    { display: block; font-size: 13px; font-weight: 600; font-family: var(--f-mono); text-transform: uppercase; letter-spacing: .06em; color: var(--c-ink-2); margin-bottom: 6px; }
.ak-contact-form input,
.ak-contact-form textarea,
.ak-contact-form select   {
  width: 100%; padding: 12px 16px; border: 2px solid var(--c-line);
  border-radius: var(--r-sm); font-family: var(--f-sans);
  font-size: 15px; margin-bottom: 16px; background: var(--c-bg);
  color: var(--c-ink);
}
.ak-contact-form input:focus-visible,
.ak-contact-form textarea:focus-visible { border-color: var(--c-accent); }
.ak-contact-form textarea { resize: vertical; min-height: 120px; }

/* ============ FAQ page — hero ============ */
.ak-faq { padding: 60px 0 80px; }
.ak-faq-hero {
  background: var(--c-primary);
  border-bottom: 2px solid var(--c-line);
  padding: 56px 0 40px;
}
.ak-faq-hero .ak-eyebrow { margin-bottom: 16px; }
.ak-faq-hero h1 {
  font-size: var(--fs-h2);
  margin: 0 0 12px;
  color: var(--c-ink) !important;
}
.ak-faq-hero p {
  margin: 0 0 24px;
  font-size: 18px;
  color: var(--c-ink-2);
  max-width: 580px;
}
.ak-faq-hero-jumps {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.ak-faq-jump {
  display: inline-flex;
  padding: 8px 16px;
  background: rgba(0,0,0,.08);
  border: 2px solid rgba(0,0,0,.15);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-ink);
  text-decoration: none;
  font-family: var(--f-mono);
  letter-spacing: .04em;
  transition: background .15s;
}
.ak-faq-jump:hover { background: rgba(0,0,0,.15); color: var(--c-ink); }

/* ============ FAQ page — body layout ============ */
.ak-faq-body { padding: 60px 0 80px; }
.ak-faq-layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 40px;
  align-items: start;
}

/* Sidebar */
.ak-faq-sidebar-inner {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 22px;
  box-shadow: var(--shadow-1);
  position: sticky;
  top: 90px;
}
.ak-faq-sidebar-label {
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-ink-2);
  margin: 0 0 10px;
}
.ak-faq-sidenav-link {
  display: block;
  padding: 9px 10px;
  border-radius: var(--r-sm);
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink-2);
  text-decoration: none;
  transition: background .12s, color .12s;
  margin-bottom: 2px;
}
.ak-faq-sidenav-link:hover { background: var(--c-bg); color: var(--c-ink); }
.ak-faq-sidebar-cta {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 2px dashed rgba(0,0,0,.12);
}
.ak-faq-sidebar-cta p {
  font-size: 13px;
  color: var(--c-ink-2);
  margin: 0 0 10px;
  font-family: var(--f-mono);
}

/* FAQ group sections */
.ak-faq-group { margin-bottom: 36px; }
.ak-faq-group:last-of-type { margin-bottom: 0; }
.ak-faq-group-title {
  font-size: 20px;
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--c-line);
}

/* Accordion */
.ak-accordion-item {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  margin-bottom: 10px;
  overflow: hidden;
  box-shadow: var(--shadow-1);
}
.ak-accordion-q {
  width: 100%;
  background: transparent;
  border: 0;
  padding: 18px 20px;
  text-align: left;
  font-family: var(--f-display);
  font-size: 18px;
  font-weight: 600;
  color: var(--c-ink);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  line-height: 1.3;
  transition: background .12s;
}
.ak-accordion-q:hover { background: var(--c-bg); }
.ak-accordion-q[aria-expanded="true"] { background: var(--c-primary); color: var(--c-ink) !important; }

/* +/− icon */
.ak-accordion-icon {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--c-bg);
  border: 2px solid var(--c-line);
  flex-shrink: 0;
  position: relative;
  transition: background .12s;
}
.ak-accordion-icon::before,
.ak-accordion-icon::after {
  content: '';
  position: absolute;
  background: var(--c-ink);
  border-radius: 2px;
}
.ak-accordion-icon::before {
  width: 10px; height: 2px;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}
.ak-accordion-icon::after {
  width: 2px; height: 10px;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  transition: transform .2s;
}
.ak-accordion-q[aria-expanded="true"] .ak-accordion-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}
.ak-accordion-q[aria-expanded="true"] .ak-accordion-icon {
  background: rgba(0,0,0,.1);
}

.ak-accordion-a {
  padding: 0 20px 20px;
  border-top: 2px dashed rgba(0,0,0,.1);
}
.ak-accordion-a p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--c-ink-2);
  margin: 14px 0 0;
}
.ak-accordion-a p + p { margin-top: 10px; }
.ak-accordion-a a { color: var(--c-accent); font-weight: 600; text-decoration: none; }
.ak-accordion-a a:hover { text-decoration: underline; }

.ak-faq-list {
  padding: 0 0 0 20px;
  margin: 10px 0 0;
}
.ak-faq-list li {
  font-size: 15px;
  line-height: 1.65;
  color: var(--c-ink-2);
  margin-bottom: 6px;
}

.ak-faq-bn {
  background: #FCF7E8;
  border: 1px dashed rgba(20,20,20,.2);
  border-radius: var(--r-sm);
  padding: 10px 14px !important;
  font-size: 14px !important;
  color: var(--c-ink) !important;
  margin-top: 12px !important;
}

/* FAQ bottom CTA */
.ak-faq-bottom-cta {
  background: var(--c-ink);
  color: #fff;
  border-radius: var(--r-lg);
  padding: 40px;
  margin-top: 40px;
  border: 2px solid var(--c-line);
  box-shadow: var(--shadow-2);
}
.ak-faq-bottom-cta .ak-eyebrow {
  background: rgba(255,255,255,.1);
  color: var(--c-primary);
  display: inline-flex;
  margin-bottom: 16px;
}
.ak-faq-bottom-cta h2 { color: #fff !important; font-size: 32px; margin: 0 0 8px; }
.ak-faq-bottom-cta p  { color: rgba(255,255,255,.7); font-size: 15px; margin: 0; }
.ak-faq-bottom-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
/* Ghost / outline buttons inside dark CTA must stay white */
.ak-faq-bottom-cta .ak-btn--ghost,
.ak-faq-bottom-cta .ak-btn--ghost:link,
.ak-faq-bottom-cta .ak-btn--ghost:visited,
.ak-faq-bottom-cta .ak-btn--ghost:hover { color: #fff !important; border-color: rgba(255,255,255,.35) !important; }
.ak-faq-bottom-cta .ak-btn--ghost:hover { background: rgba(255,255,255,.1) !important; }

/* Mobile FAQ */
@media (max-width: 860px) {
  .ak-faq-layout { grid-template-columns: 1fr; }
  .ak-faq-sidebar { display: none; }
  /* Visible thin scrollbar = scroll affordance (same as policy jumps) */
  .ak-faq-hero-jumps {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 6px;
    scrollbar-width: thin;
    scrollbar-color: rgba(20,20,20,.35) transparent;
  }
  .ak-faq-hero-jumps::-webkit-scrollbar { height: 4px; }
  .ak-faq-hero-jumps::-webkit-scrollbar-thumb { background: rgba(20,20,20,.35); border-radius: 999px; }
  .ak-faq-jump { flex-shrink: 0; }
}
@media (max-width: 600px) {
  .ak-accordion-q { font-size: 16px; padding: 14px 16px; }
  .ak-accordion-a { padding: 0 16px 16px; }
  .ak-faq-bottom-cta { padding: 28px 20px; }
  .ak-faq-body { padding: 40px 0 60px; }
}

/* ============ MC4WP (Mailchimp for WP) form — match theme ============ */
.mc4wp-form input[type="email"],
.mc4wp-form input[type="text"] {
  width: 100% !important;
  padding: 10px 14px !important;
  border-radius: 999px !important;
  border: 2px solid #333 !important;
  background: #222 !important;
  color: #fff !important;
  font-family: var(--f-sans) !important;
  font-size: 15px !important;
  margin-bottom: 8px !important;
  box-sizing: border-box !important;
}
.mc4wp-form input[type="email"]:focus-visible,
.mc4wp-form input[type="text"]:focus-visible {
  border-color: var(--c-primary) !important;
}
.mc4wp-form input[type="submit"],
.mc4wp-form button[type="submit"] {
  background: var(--c-primary) !important;
  color: var(--c-ink) !important;
  border: 2px solid var(--c-primary) !important;
  border-radius: 999px !important;
  padding: 10px 22px !important;
  font-weight: 700 !important;
  font-family: var(--f-sans) !important;
  font-size: 15px !important;
  cursor: pointer !important;
  width: 100% !important;
  margin-top: 4px !important;
}
.mc4wp-form input[type="submit"]:hover,
.mc4wp-form button[type="submit"]:hover {
  background: var(--c-ink) !important;
  color: var(--c-primary) !important;
  border-color: var(--c-primary) !important;
}
/* MC4WP labels + footer headings always visible on dark background */
footer.ak-footer-custom h4,
.ak-footer-custom h4 { color: #ffffff !important; }
.ak-footer-custom .mc4wp-form label,
footer .mc4wp-form label,
.mc4wp-form label {
  display: block !important;
  color: #B8B8B8 !important;
  font-size: 13px !important;
  font-family: var(--f-mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  margin-bottom: 6px !important;
  font-weight: 600 !important;
}
.mc4wp-form-fields { display: flex; flex-direction: column; gap: 0; }
.mc4wp-alert { font-size: 13px; margin-top: 8px; color: var(--c-primary); font-family: var(--f-mono); }

/* ============ Responsive ============ */
@media (max-width: 1024px) {
  .ak-grid          { grid-template-columns: repeat(2, 1fr); }
  .ak-feature-row   { grid-template-columns: repeat(2, 1fr); }
  .ak-footer-inner  { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .ak-hero-inner    { grid-template-columns: 1fr; }
  .ak-hero-visual   { display: none; }
  .ak-gift-inner    { grid-template-columns: 1fr; }
  .ak-gift-visual   { display: none; }
  .ak-quotes-row    { grid-template-columns: 1fr; }
  .ak-about-grid    { grid-template-columns: 1fr; }
  .ak-contact-grid  { grid-template-columns: 1fr; }
  .ak-values-row    { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .ak-wrap          { padding: 0 16px; }
  .ak-grid          { grid-template-columns: 1fr; }
  .ak-feature-row   { grid-template-columns: 1fr; }
  .ak-footer-inner  { grid-template-columns: 1fr; }
  .ak-hero          { padding: 40px 0 52px; }
  .ak-hero-stats    { gap: 20px; min-height: 86px; }
  /* Special offer hero */
  .ak-offer-hero    { padding: 40px 0; }
  .ak-offer-hero h1 { font-size: clamp(26px, 7vw, 38px); }
  .ak-offer-hero p  { font-size: 15px; }
}
@media (max-width: 400px) {
  .ak-wrap { padding: 0 12px; }
}

/* ============ Mobile: product card — stack name + price vertically ============ */
@media (max-width: 480px) {
  .ak-card-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .ak-card-price,
  .ak-card .price {
    font-size: 18px !important;
    white-space: normal !important;
  }
  .ak-card-name { font-size: 16px; }
  .ak-card-body { padding: 14px; }
}

/* ============ Shop catalog — section padding responsive ============ */
@media (max-width: 860px) {
  .ak-catalog        { padding: 48px 0; }
  .ak-feature-strip  { padding: 8px 0 48px; }
  .ak-quotes         { padding: 48px 0; }
  .ak-gift           { padding: 48px 0; }
  .ak-section-head   { margin-bottom: 28px; }
}
@media (max-width: 600px) {
  .ak-catalog        { padding: 28px 0; }
  .ak-section-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 20px;
  }
  .ak-section-head h2 { font-size: clamp(24px, 7vw, 34px); }
  .ak-grid           { gap: 16px; }
  .woocommerce ul.products.ak-grid { gap: 16px !important; }
  .ak-card-img       { padding: 14px; }
  .ak-catalog > .ak-wrap > .ak-section-head > a.ak-btn { width: 100%; justify-content: center; }
}

/* ============ WooCommerce shop page — tablet (601px – 1024px) ============ */
@media (max-width: 1024px) and (min-width: 601px) {
  .ak-single-wrap    { padding-top: 28px; padding-bottom: 56px; }
  .single-product div.product,
  .single-product .woocommerce div.product { gap: 20px; }
  .single-product div.product .summary.entry-summary { padding: 20px !important; }
}

/* ============ Single product page — mobile ============ */
@media (max-width: 768px) {
  /* Override ak-wrap's 32px side padding — start at 16px from 768px down */
  .ak-single-wrap {
    padding: 12px 16px 48px !important;
  }
  /* Prevent right-side overflow on mobile single-product */
  .single-product .site-main,
  .single-product .ak-single-wrap,
  .single-product div.product,
  .single-product .woocommerce div.product {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: clip;
  }
  .single-product .ak-single-wrap *,
  .single-product div.product * {
    box-sizing: border-box;
  }
  /* Stack single column, tighter gap */
  .single-product div.product,
  .single-product .woocommerce div.product {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    max-width: 100% !important;
  }
  /* Gallery card */
  .single-product .woocommerce-product-gallery {
    padding: 10px !important;
    border-radius: var(--r-md) !important;
    margin: 0 !important;
  }
  .single-product .woocommerce-product-gallery .flex-viewport {
    margin: 0 0 10px !important;
    padding: 8px !important;
  }
  /* Summary card */
  .single-product div.product .summary.entry-summary {
    padding: 18px !important;
    border-radius: var(--r-md) !important;
    margin: 0 !important;
  }
  /* Title + price */
  .single-product .product_title {
    font-size: clamp(18px, 5vw, 26px) !important;
    margin: 0 0 12px !important;
    line-height: 1.25 !important;
  }
  .single-product p.price,
  .single-product span.price { font-size: 22px !important; margin: 0 0 16px !important; }
  /* Cart form — full width */
  .single-product form.cart     { flex-direction: column; gap: 10px; margin-bottom: 16px !important; }
  .single-product .quantity input { width: 100% !important; box-sizing: border-box !important; }
  .single-product .single_add_to_cart_button { width: 100% !important; justify-content: center !important; }
  /* Tabs + related — remove side overflow */
  .single-product .woocommerce-tabs,
  .single-product .related.products,
  .single-product .up-sells.products {
    margin-top: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden;
  }
  .single-product .woocommerce-tabs .panel,
  .single-product form.cart .variations,
  .single-product form.cart .variations tbody,
  .single-product form.cart .variations tr,
  .single-product form.cart .variations td,
  .single-product form.cart .variations th {
    width: 100% !important;
    max-width: 100% !important;
  }
  /* Thumbnail strip */
  .single-product .flex-control-thumbs {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin-top: 8px !important;
  }
  .single-product .flex-control-thumbs img { height: 60px !important; }
  /* Delivery estimate */
}
@media (max-width: 400px) {
  .ak-single-wrap { padding: 8px 12px 40px !important; }
  .single-product div.product .summary.entry-summary { padding: 14px !important; }
  .single-product .flex-control-thumbs { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* ============ WooCommerce category archive description ============ */
/* Astra forces text-align:center on archive headers — override with high specificity */
body.tax-product_cat .woocommerce-taxonomy-archive-description,
body.tax-product_cat .term-description,
.woocommerce-products-header .woocommerce-taxonomy-archive-description,
.woocommerce-taxonomy-archive-description,
.term-description {
  text-align: left !important;
  max-width: 820px;
  margin: 0 auto 40px;
  padding: 0 24px;
  font-size: 15px;
  line-height: 1.75;
}
body.tax-product_cat .woocommerce-taxonomy-archive-description *,
body.tax-product_cat .term-description *,
.woocommerce-taxonomy-archive-description *,
.term-description * {
  text-align: left !important;
}
.woocommerce-taxonomy-archive-description h2,
.term-description h2 {
  font-size: clamp(20px, 3vw, 26px);
  font-weight: 700;
  margin: 0 0 12px;
}
.woocommerce-taxonomy-archive-description h3,
.term-description h3 {
  font-size: clamp(16px, 2.5vw, 19px);
  font-weight: 700;
  margin: 24px 0 8px;
}
.woocommerce-taxonomy-archive-description ul,
.term-description ul {
  list-style: disc !important;
  padding-left: 22px !important;
  margin: 8px 0 16px;
}
.woocommerce-taxonomy-archive-description li,
.term-description li {
  margin-bottom: 6px;
  list-style: disc !important;
}
.woocommerce-taxonomy-archive-description p,
.term-description p {
  margin: 0 0 14px;
}
.woocommerce-taxonomy-archive-description strong,
.term-description strong {
  font-weight: 700;
}

/* ============ Return policy / FAQ hero jump links — emoji alignment ============ */
.ak-faq-jump          { align-items: center; gap: 5px; }
.ak-faq-jump-icon     { line-height: 1; font-style: normal; display: inline-block; }

/* ============ Dark-background CTA blocks — force heading/text white ============ */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4 { color: #fff !important; }
[data-theme="dark"] p  { color: #B8B8B8 !important; }

/* ============ Scroll Reveal — Intersection Observer ============ */
/* Only opacity + transform are animated — both compositor-only, no layout/paint cost.
   will-change applied only while animating (not on the base state) to avoid pre-allocating
   GPU layers for every card on the page before they are near the viewport. */
.ak-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition:
    opacity   0.72s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.72s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--ak-rev-delay, 0ms);
  contain: layout style; /* isolates layout recalcs — changes inside don't reflow siblings */
}
.ak-reveal[data-rev-dir="left"]  { transform: translateX(-38px) translateY(0); }
.ak-reveal[data-rev-dir="right"] { transform: translateX(38px)  translateY(0); }
.ak-reveal.ak-revealed {
  opacity: 1;
  transform: none !important;
  will-change: auto; /* release GPU layer once animation completes */
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  .ak-reveal {
    transition: opacity 0.3s ease !important;
    transform: none !important;
  }
}

/* ============ Smooth scroll + global micro-interactions ============ */
html { scroll-behavior: smooth; }

.ak-pill {
  transition: transform 0.22s ease, background 0.22s ease;
}

/* ============ Cart & Checkout pages ============ */
.woocommerce-cart #primary,
.woocommerce-checkout #primary {
  padding: 40px 32px 80px !important;
  max-width: 1340px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

/* Cart table */
.woocommerce-cart table.shop_table.cart {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-sans);
}
.woocommerce-cart table.shop_table.cart th {
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--c-ink-2);
  padding: 0 12px 16px;
  border-bottom: 2px solid var(--c-line);
  white-space: nowrap;
}
.woocommerce-cart table.shop_table.cart td {
  padding: 20px 12px;
  border-bottom: 1px solid var(--c-line);
  vertical-align: middle;
}

/* Product thumbnail in cart */
.woocommerce-cart table.cart td.product-thumbnail {
  width: 96px;
  padding-right: 0;
}
.woocommerce-cart table.cart td.product-thumbnail img {
  width: 80px !important;
  height: 80px !important;
  object-fit: contain;
  border-radius: var(--r-sm);
  border: 2px solid var(--c-line);
  background: #fff;
  display: block;
}

/* Product name link */
.woocommerce-cart table.cart td.product-name a {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 16px;
  color: var(--c-ink) !important;
  text-decoration: none;
}
.woocommerce-cart table.cart td.product-name a:hover {
  color: var(--c-accent) !important;
}

/* Remove button */
.woocommerce-cart a.remove {
  color: var(--c-ink-2) !important;
  font-size: 20px;
  line-height: 1;
}
.woocommerce-cart a.remove:hover {
  color: var(--c-accent) !important;
  background: transparent !important;
}

/* Quantity input */
.woocommerce-cart table.cart td.product-quantity .qty {
  width: 72px !important;
  padding: 8px 10px !important;
  border: 2px solid var(--c-line) !important;
  border-radius: var(--r-sm) !important;
  font-family: var(--f-mono) !important;
  font-size: 14px !important;
  text-align: center;
}

/* Price cells */
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.product-subtotal {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 16px;
}
/* Sale price display — match product card del/ins style */
.woocommerce-cart table.cart td.product-price .price,
.woocommerce-cart table.cart td.product-subtotal .price {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
}
.woocommerce-cart table.cart td.product-price del,
.woocommerce-cart table.cart td.product-subtotal del {
  text-decoration: line-through;
  opacity: 0.6;
}
.woocommerce-cart table.cart td.product-price del .woocommerce-Price-amount,
.woocommerce-cart table.cart td.product-subtotal del .woocommerce-Price-amount {
  font-size: 11px !important;
  font-weight: 400 !important;
  color: var(--c-ink-2) !important;
}
.woocommerce-cart table.cart td.product-price ins,
.woocommerce-cart table.cart td.product-subtotal ins {
  text-decoration: none;
}
.woocommerce-cart table.cart td.product-price ins .woocommerce-Price-amount,
.woocommerce-cart table.cart td.product-subtotal ins .woocommerce-Price-amount {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
}
/* Discount badge next to product name in cart */
.ak-cart-badge {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  margin-left: 8px;
  font-size: 10px !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
}

/* Actions row (coupon + update cart) */
.woocommerce-cart table.cart td.actions {
  padding-top: 20px;
  border-bottom: none;
}
.woocommerce-cart table.cart td.actions .coupon {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.woocommerce-cart table.cart td.actions .coupon input#coupon_code {
  padding: 10px 14px !important;
  border: 2px solid var(--c-line) !important;
  border-radius: var(--r-sm) !important;
  font-family: var(--f-sans) !important;
  font-size: 14px !important;
  min-width: 180px;
}

/* Cart totals */
.woocommerce-cart .cart-collaterals {
  margin-top: 32px;
}
.woocommerce-cart .cart_totals {
  max-width: 420px;
  margin-left: auto;
  background: var(--c-bg-2);
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: 28px;
}
.woocommerce-cart .cart_totals h2 {
  font-family: var(--f-display) !important;
  font-size: 20px !important;
  margin: 0 0 20px !important;
}
.woocommerce-cart .cart_totals table {
  width: 100%;
  border-collapse: collapse;
}
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
  padding: 10px 0;
  border-bottom: 1px solid var(--c-line);
  font-size: 15px;
  vertical-align: middle;
}
.woocommerce-cart .cart_totals table .order-total th,
.woocommerce-cart .cart_totals table .order-total td {
  font-weight: 700;
  font-family: var(--f-display);
  font-size: 18px !important;
  border-bottom: none;
  padding-top: 16px;
}

/* Checkout button */
.woocommerce-cart .wc-proceed-to-checkout {
  padding: 0;
  margin-top: 20px;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  font-size: 16px !important;
  padding: 16px 24px !important;
  background: var(--c-ink) !important;
  color: #fff !important; /* was unset — text color fell back to inheritance/Astra
    defaults, which apparently flip to something invisible on hover. Pinning both
    states explicitly removes the ambiguity. Same fix pattern as the hero button bug. */
  border-radius: 999px !important;
  box-sizing: border-box !important;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
  background: var(--c-accent) !important;
  color: #fff !important;
}

/* ---- Mobile cart (≤ 640px) ---- */
@media (max-width: 640px) {
  .woocommerce-cart #primary,
  .woocommerce-checkout #primary {
    padding: 24px 16px 60px !important;
  }

  /* Hide table header row on mobile */
  .woocommerce-cart table.shop_table.cart thead {
    display: none !important;
  }

  /* Each cart row becomes a flex card */
  .woocommerce-cart table.shop_table.cart,
  .woocommerce-cart table.shop_table.cart tbody,
  .woocommerce-cart table.shop_table.cart tr,
  .woocommerce-cart table.shop_table.cart td {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .woocommerce-cart table.shop_table.cart tr.cart_item {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 16px 0 !important;
    border-bottom: 1px solid var(--c-line) !important;
  }
  .woocommerce-cart table.shop_table.cart td {
    padding: 0 !important;
    border: none !important;
    width: auto !important;
  }

  /* Thumbnail */
  .woocommerce-cart table.cart td.product-thumbnail {
    width: 72px !important;
    flex-shrink: 0 !important;
  }
  .woocommerce-cart table.cart td.product-thumbnail img {
    width: 72px !important;
    height: 72px !important;
  }

  /* Name takes remaining width */
  .woocommerce-cart table.cart td.product-name {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
  .woocommerce-cart table.cart td.product-name a {
    font-size: 14px;
  }

  /* Remove button — top-right */
  .woocommerce-cart table.cart td.product-remove {
    order: -1 !important;
    width: 28px !important;
    flex-shrink: 0 !important;
  }

  /* Price / qty / subtotal — full width row below */
  .woocommerce-cart table.cart td.product-price,
  .woocommerce-cart table.cart td.product-quantity,
  .woocommerce-cart table.cart td.product-subtotal {
    width: 100% !important;
    padding-left: 84px !important; /* align with name column */
    font-size: 14px;
  }

  /* Actions row */
  .woocommerce-cart table.cart td.actions {
    width: 100% !important;
    padding: 16px 0 0 !important;
  }
  .woocommerce-cart table.cart td.actions .coupon {
    flex-direction: column !important;
  }
  .woocommerce-cart table.cart td.actions .coupon input#coupon_code {
    width: 100% !important;
    min-width: unset !important;
  }

  /* Cart totals full width on mobile */
  .woocommerce-cart .cart_totals {
    max-width: 100% !important;
    margin-left: 0 !important;
  }
}
.ak-pill:hover { transform: translateY(-2px); }

/* ============ Category archive hero ============ */
.ak-cat-hero {
  background: var(--c-primary);
  border-bottom: 2px solid var(--c-line);
  padding: 48px 0;
  text-align: center;
}
.ak-cat-hero__title {
  margin: 0;
  font-size: var(--fs-h2);
}

/* Per-category hero background colours */
.ak-cat-hero--cars,
.ak-cat-hero--car {
  background: var(--c-yellow);
}
.ak-cat-hero--motorcycles,
.ak-cat-hero--motorcycle,
.ak-cat-hero--baby-motorcycle {
  background: var(--c-red);
  color: #fff;
}
.ak-cat-hero--electric-tools,
.ak-cat-hero--electric-tool,
.ak-cat-hero--electrictools {
  background: var(--c-teal);
  color: #fff;
}
.ak-cat-hero--learning,
.ak-cat-hero--learning-creativity,
.ak-cat-hero--learning-and-creativity {
  background: var(--c-green);
  color: #fff;
}
.ak-cat-hero--gadgets,
.ak-cat-hero--gadget {
  background: var(--c-blue);
  color: #fff;
}

/* ============ Category archive — header description card ============ */
.ak-archive-cat-desc {
  margin: 24px auto 0;
  max-width: 740px;
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 26px 32px;
  font-family: var(--f-sans);
  font-size: 15px;
  line-height: 1.75;
  color: var(--c-ink-2);
  text-align: left;
  box-shadow: var(--shadow-2);
}
.ak-archive-cat-desc p { margin: 0 0 10px; }
.ak-archive-cat-desc p:last-child { margin-bottom: 0; }

/* ============ Category SEO Content (below products grid) ============ */
.ak-cat-seo {
  background: var(--c-bg);
  padding: 56px 0 64px;
  border-top: 3px solid var(--c-line);
  margin-top: 40px;
}
.ak-cat-seo__inner {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 24px;
  font-family: var(--f-sans);
  font-size: 15px;
  line-height: 1.8;
  color: var(--c-ink-2);
}
.ak-cat-seo__inner h2 {
  font-family: var(--f-display) !important;
  font-size: clamp(1.45rem, 3vw, 1.95rem) !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
  margin: 0 0 24px !important;
  padding-bottom: 14px !important;
  border-bottom: 3px solid var(--c-primary) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
}
.ak-cat-seo__inner h3 {
  font-family: var(--f-mono) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  margin: 36px 0 12px !important;
  padding: 5px 12px !important;
  background: var(--c-primary) !important;
  display: inline-block !important;
  border-radius: 4px !important;
  line-height: 1.6 !important;
}
.ak-cat-seo__inner p {
  font-family: var(--f-sans) !important;
  margin: 0 0 14px !important;
  color: var(--c-ink-2) !important;
}
.ak-cat-seo__inner ul {
  margin: 0 0 20px 0 !important;
  padding-left: 0 !important;
  list-style: none !important;
}
.ak-cat-seo__inner li {
  position: relative !important;
  padding-left: 22px !important;
  margin-bottom: 9px !important;
  color: var(--c-ink-2) !important;
  list-style: none !important;
  font-family: var(--f-sans) !important;
}
.ak-cat-seo__inner li::before {
  content: '→';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--c-accent);
  font-weight: 700;
}
.ak-cat-seo__inner strong {
  color: var(--c-ink) !important;
  font-weight: 700 !important;
}
@media (max-width: 640px) {
  .ak-cat-seo { padding: 40px 0 48px; }
  .ak-cat-seo__inner { padding: 0 16px; font-size: 14px; }
  .ak-cat-seo__inner h2 { font-size: 1.3rem !important; }
  .ak-cat-seo__inner h3 { font-size: 0.68rem !important; }
  .ak-cat-hero { padding: 36px 0; }
  .ak-archive-cat-desc {
    padding: 20px;
    font-size: 14px;
    border-radius: var(--r-sm);
    margin: 16px auto 0;
  }
}

/* ============================================================
   HOMEPAGE — "Why Autokid?" trust section
   ============================================================ */
.ak-why { padding: 56px 0 16px; }
.ak-why-heading {
  font-family: var(--f-display);
  font-size: clamp(26px, 3.5vw, 40px);
  font-weight: 700;
  text-align: center;
  margin: 0 0 32px;
}
.ak-why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ak-why-card {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-2);
  padding: 30px;
  transition: transform .15s, box-shadow .15s;
}
.ak-why-card:hover { transform: translate(-2px,-3px); box-shadow: var(--shadow-3); }
.ak-why-card--yellow .ak-why-icon { color: var(--c-accent-deep); }
.ak-why-card--blue   .ak-why-icon { color: var(--c-blue); }
.ak-why-card--green  .ak-why-icon { color: var(--c-green); }
.ak-why-icon { display: block; margin-bottom: 16px; }
.ak-why-title { font-family: var(--f-display); font-size: 22px; font-weight: 700; margin: 0 0 10px; line-height: 1.15; }
.ak-why-desc { font-family: var(--f-sans); font-size: 15px; line-height: 1.6; color: var(--c-ink-2); margin: 0; }
.ak-why-desc a { color: var(--c-blue); font-weight: 600; }

@media (max-width: 860px) {
  .ak-why-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .ak-why { padding: 40px 0 8px; }
  .ak-why-grid { grid-template-columns: 1fr; gap: 16px; }
  .ak-why-card { padding: 24px; }
}

/* ============================================================
   PRODUCT PAGE — Key Specs card
   ============================================================ */
.ak-specs-card {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-1);
  padding: 30px;
  margin-bottom: 24px;
}
.ak-specs-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--f-display);
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 20px;
}
.ak-specs-heading svg { color: var(--c-accent-deep); flex-shrink: 0; }
/* Striped two-column spec table (1.20.18) — designed replacement for the
   plain WC attribute table. Mono label / sans value, alternating
   cream+white rows, boxed by a 2px ink border inside the card. Scales
   cleanly to 9+ rows. */
.ak-specs-table {
  margin: 0;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  overflow: hidden;
}
.ak-specs-tr {
  display: grid;
  grid-template-columns: 40% 1fr;
  align-items: baseline;
  gap: 12px;
  padding: 11px 16px;
}
.ak-specs-tr:nth-child(odd)  { background: var(--c-bg); }
.ak-specs-tr:nth-child(even) { background: #fff; }
/* Same table rendered as the Specifications tab's content (§20b) */
.ak-specs-table--tab { max-width: 640px; margin: 4px 0 8px; }
.ak-specs-tr + .ak-specs-tr { border-top: 1px solid rgba(20,20,20,.1); }
.ak-specs-label {
  font-family: var(--f-mono);
  font-size: 11.5px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--c-ink-2);
  margin: 0;
}
.ak-specs-value {
  font-family: var(--f-sans);
  font-size: 15px;
  font-weight: 700;
  color: var(--c-ink);
  margin: 0;
}
.ak-specs-price {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 2px solid var(--c-line);
}
.ak-specs-price-val { font-family: var(--f-display); font-size: 20px; font-weight: 700; color: var(--c-ink); }
.ak-specs-price-val .woocommerce-Price-amount { font-family: var(--f-display); }
.ak-specs-trust {
  list-style: none;
  margin: 20px 0 0;
  padding: 16px 0 0;
  border-top: 2px solid var(--c-line);
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-family: var(--f-sans);
  font-size: 13.5px;
  font-weight: 600;
}
.ak-specs-trust li { display: flex; align-items: center; gap: 8px; }
.ak-specs-trust svg { color: var(--c-teal); flex-shrink: 0; }

@media (max-width: 600px) {
  .ak-specs-card { padding: 20px; }
  .ak-specs-tr { grid-template-columns: 42% 1fr; gap: 10px; padding: 10px 14px; }
}

/* ============================================================
   HOMEPAGE — FAQ accordion ("Parents Ask")
   Pure-CSS <details> accordion — grid-template-rows trick animates
   open/close without JS.
   ============================================================ */
.ak-faq-home { background: var(--c-bg); padding: 56px 0; }
.ak-faq-home-heading {
  font-family: var(--f-display);
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  text-align: center;
  margin: 0 0 28px;
}
.ak-faq-home-list { display: flex; flex-direction: column; gap: 12px; max-width: 760px; margin: 0 auto; }
.ak-faq-item {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-sm);
  overflow: hidden;
}
.ak-faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 20px;
  font-family: var(--f-sans);
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
  transition: background .3s;
}
.ak-faq-q::-webkit-details-marker { display: none; }
.ak-faq-item[open] > .ak-faq-q { background: var(--c-bg); }
.ak-faq-chevron { flex-shrink: 0; transition: transform .3s; }
.ak-faq-item[open] .ak-faq-chevron { transform: rotate(180deg); }
.ak-faq-a {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .3s ease;
}
.ak-faq-item[open] .ak-faq-a { grid-template-rows: 1fr; }
.ak-faq-a > p {
  overflow: hidden;
  min-height: 0;
  margin: 0;
  padding: 0 20px 20px;
  font-family: var(--f-sans);
  font-size: 15px;
  line-height: 1.6;
  color: var(--c-ink-2);
}
.ak-faq-home-more { text-align: center; margin: 24px 0 0; font-weight: 600; }

@media (max-width: 600px) {
  .ak-faq-home { padding: 40px 0; }
  .ak-faq-q { padding: 16px; font-size: 15px; }
}

/* (1.20.15) Warranty badge + return-policy banner CSS removed with their
   template parts — PDP trust messaging consolidated into .ak-pdp-trust. */

/* ============================================================
   CHECKOUT — Thank You / Order Received (woocommerce/checkout/thankyou.php)
   ============================================================ */
.ak-thankyou { max-width: 760px; margin: 0 auto; padding: 24px 0 48px; }
.ak-ty-title { font-family: var(--f-display); font-size: var(--fs-h2); margin: 12px 0 8px; }
.ak-ty-sub { font-size: 17px; color: var(--c-ink-2); margin: 0 0 24px; background: none; border: 0; padding: 0; }
.ak-ty-overview {
  display: flex; flex-wrap: wrap; gap: 0;
  list-style: none; margin: 0 0 32px; padding: 18px 20px;
  background: #fff; border: 2px solid var(--c-line); border-radius: var(--r-md);
}
.ak-ty-overview li {
  flex: 1 1 auto; padding: 4px 20px 4px 0; margin: 0 20px 0 0;
  border-right: 1px dashed rgba(0,0,0,.15); font-size: 14px;
}
.ak-ty-overview li:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.ak-ty-ov-label { display: block; font-family: var(--f-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--c-ink-2); margin-bottom: 2px; }
.ak-ty-next { background: var(--c-primary); border: 2px solid var(--c-line); border-radius: var(--r-lg); padding: 28px; margin-bottom: 24px; }
.ak-ty-next-heading { font-size: 20px; margin: 0 0 8px; }
.ak-ty-steps { list-style: none; counter-reset: tystep; margin: 0 0 20px; padding: 0; }
.ak-ty-steps li {
  counter-increment: tystep;
  position: relative; padding: 12px 0 12px 46px;
  border-bottom: 1px dashed rgba(0,0,0,.18);
}
.ak-ty-steps li:last-child { border-bottom: 0; }
.ak-ty-steps li::before {
  content: counter(tystep);
  position: absolute; left: 0; top: 12px;
  width: 30px; height: 30px;
  background: var(--c-ink); color: #fff;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-mono); font-size: 13px; font-weight: 700;
}
.ak-ty-steps li strong { display: block; margin-bottom: 2px; }
.ak-ty-steps li p { margin: 0; font-size: 14px; color: var(--c-ink-2); }
.ak-ty-wa-btn { gap: 8px; }
.ak-ty-wa-num { margin: 10px 0 0; font-family: var(--f-mono); font-size: 12px; }
.ak-ty-trust { border: 1px dashed var(--c-line); border-radius: var(--r-md); padding: 18px 20px; margin-bottom: 32px; }
.ak-ty-trust p { margin: 0 0 10px; font-size: 14px; line-height: 1.6; }
.ak-ty-trust p:last-child { margin-bottom: 0; }
.ak-ty-failed { padding: 24px 0; }
.ak-ty-failed-actions { display: flex; gap: 12px; flex-wrap: wrap; background: none; border: 0; padding: 0; }
@media (max-width: 600px) {
  .ak-ty-overview { flex-direction: column; }
  .ak-ty-overview li { border-right: 0; border-bottom: 1px dashed rgba(0,0,0,.15); padding: 8px 0; margin: 0; }
  .ak-ty-overview li:last-child { border-bottom: 0; }
  .ak-ty-next { padding: 20px; }
}

/* Checkout — WhatsApp payment-help note */
.ak-checkout-help {
  display: flex; gap: 10px; align-items: flex-start;
  background: var(--c-bg); border: 1px dashed var(--c-line); border-radius: var(--r-sm);
  padding: 14px 16px; margin: 0 0 20px;
  font-size: 14px; line-height: 1.5;
}
.ak-checkout-help a { font-weight: 700; }

/* ============================================================
   HEADER — Account button (white ghost twin of the ink cart pill)
   ============================================================ */
.ak-account-btn {
  background: #fff;
  color: var(--c-ink) !important;
}
.ak-account-btn:hover { color: var(--c-ink) !important; }
@media (max-width: 480px) {
  .ak-account-btn span { display: none; }
  .ak-account-btn { padding: 9px 12px; }
}

/* ============================================================
   HOMEPAGE — Mobile quick-category nav (mobile-first: visible by
   default, hidden ≥768px where the pill strip + feature cards
   already carry category navigation)
   ============================================================ */
.ak-quick-nav { padding: 16px 0 4px; }
.ak-quick-nav-row {
  display: grid;
  /* auto-fit: tile count follows however many mapped categories exist
     (3 since the cars/motorcycles → kids-vehicles merge) */
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  gap: 10px;
}
.ak-quick-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 6px 10px;
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  box-shadow: 0 2px 0 0 #141414;
  text-decoration: none !important;
  color: var(--c-ink) !important;
}
.ak-quick-nav-item:active { box-shadow: none; transform: translateY(2px); }
.ak-quick-nav-icon {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  background: var(--c-primary);
  border: 2px solid var(--c-line);
  border-radius: 999px;
  color: var(--c-ink);
}
.ak-quick-nav-label {
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .ak-quick-nav { display: none; }
}
/* Below 768px the quick-nav tiles carry category navigation — the pill
   strip duplicated the same job in the same viewport (same dedupe rule
   as the FAQ jump-nav). Desktop/tablet keep the pill strip untouched;
   the quick-nav is mobile-only, so exactly one category nav per width. */
@media (max-width: 767px) {
  .ak-cats { display: none; }
}

/* ============================================================
   MY ACCOUNT — full styling pass (no overrides existed; pages
   rendered raw WC/Astra, incl. the black unreadable address boxes).
   Mobile-first: single column base, two-column ≥900px.
   ============================================================ */

/* Layout — mobile: stacked full-width; ≥768px: fixed 240px nav column
   beside flexible content. Uses floats (WooCommerce's own layout
   mechanism, guaranteed to bind to these exact elements) instead of
   grid on the wrapper — the 1.20.14 grid targeted `main .woocommerce`,
   which isn't a reliable direct parent across Astra wrappers, and
   desktop rendered nav full-width with the content squeezed. */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
  float: none !important;
  width: 100% !important;
  box-sizing: border-box;
}
.woocommerce-account main .woocommerce,
.woocommerce-account .entry-content > .woocommerce {
  max-width: 1080px;
  margin: 0 auto;
  padding: 24px 16px 56px;
}
.woocommerce-account main .woocommerce::after,
.woocommerce-account .entry-content > .woocommerce::after {
  content: '';
  display: table;
  clear: both;
}
.woocommerce-account .woocommerce-MyAccount-navigation { margin-bottom: 20px; }
@media (min-width: 768px) {
  .woocommerce-account.logged-in .woocommerce-MyAccount-navigation {
    float: left !important;
    width: 240px !important;
    margin-bottom: 0;
  }
  .woocommerce-account.logged-in .woocommerce-MyAccount-content {
    float: right !important;
    width: calc(100% - 264px) !important;
  }
}

/* Nav — pill list; horizontal scroll on mobile, stacked ≥900px */
.ak-acct-nav ul {
  list-style: none;
  margin: 0;
  padding: 0 0 4px;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.ak-acct-nav li { margin: 0; flex: none; }
.ak-acct-nav a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: var(--c-bg);
  border: 2px solid var(--c-line);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink) !important;
  text-decoration: none !important;
  white-space: nowrap;
}
.ak-acct-nav li.is-active a {
  background: var(--c-ink);
  color: #fff !important;
}
@media (min-width: 768px) {
  .ak-acct-nav ul { flex-direction: column; overflow: visible; }
  .ak-acct-nav a { display: flex; }
}

/* Content card */
.woocommerce-account .woocommerce-MyAccount-content {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  box-shadow: 0 2px 0 0 #141414;
  padding: 20px 16px;
  overflow-x: auto;
}
@media (min-width: 900px) {
  .woocommerce-account .woocommerce-MyAccount-content { padding: 32px; }
  .woocommerce-account main .woocommerce,
  .woocommerce-account .entry-content > .woocommerce { padding: 40px 24px 72px; }
}

/* Dashboard */
.ak-acct-hello h2 { margin: 10px 0 8px; font-size: 26px; }
.ak-acct-hello p { color: var(--c-ink-2); margin: 0 0 24px; }
.ak-acct-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 640px) {
  .ak-acct-cards { grid-template-columns: repeat(2, 1fr); }
}
.ak-acct-card {
  display: block;
  padding: 18px;
  background: var(--c-bg);
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  box-shadow: 0 2px 0 0 #141414;
  color: var(--c-ink) !important;
  text-decoration: none !important;
  transition: transform .1s, box-shadow .1s;
}
.ak-acct-card:hover { transform: translate(-1px, -2px); box-shadow: 2px 4px 0 0 #141414; }
.ak-acct-card strong { display: block; margin: 10px 0 2px; font-size: 16px; }
.ak-acct-card p { margin: 0; font-size: 13px; color: var(--c-ink-2); }
.ak-acct-card-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px;
  background: var(--c-primary);
  border: 2px solid var(--c-line);
  border-radius: 999px;
}
.ak-acct-card--wa .ak-acct-card-icon { background: #4CAF50; color: #fff; }

/* ── Address boxes — THE black-box contrast bug fix. Force light
   cards with ink text regardless of what Astra/WC inject. ── */
.woocommerce-account .woocommerce-Addresses .woocommerce-Address,
.woocommerce-account .woocommerce-Address,
.woocommerce-account .woocommerce-column--address {
  background: #fff !important;
  color: var(--c-ink) !important;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 18px;
  margin-bottom: 16px;
}
.woocommerce-account .woocommerce-Address address,
.woocommerce-account .woocommerce-Address p,
.woocommerce-account .woocommerce-column--address address {
  color: var(--c-ink) !important;
  background: transparent !important;
  border: 0;
  font-style: normal;
  line-height: 1.7;
}
.woocommerce-account .woocommerce-Address-title,
.woocommerce-account .woocommerce-Address header {
  background: transparent !important;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3 {
  color: var(--c-ink) !important;
  font-size: 19px;
  margin: 0;
}
.woocommerce-account .woocommerce-Address-title .edit {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-accent) !important;
  text-decoration: underline !important;
  white-space: nowrap;
}
@media (min-width: 640px) {
  .woocommerce-account .woocommerce-Addresses {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .woocommerce-account .woocommerce-Addresses .woocommerce-Address { margin-bottom: 0; width: auto !important; }
}

/* Forms (login, register, edit-address, edit-account) */
.woocommerce-account .woocommerce form .form-row input.input-text,
.woocommerce-account .woocommerce form .form-row textarea,
.woocommerce-account .woocommerce form .form-row select {
  background: #fff !important;
  color: var(--c-ink) !important;
  border: 2px solid var(--c-line) !important;
  border-radius: var(--r-sm);
  padding: 11px 14px;
  font-size: 15px;
}
.woocommerce-account .woocommerce form .form-row input.input-text:focus,
.woocommerce-account .woocommerce form .form-row textarea:focus,
.woocommerce-account .woocommerce form .form-row select:focus {
  outline: 2px solid var(--c-accent);
  outline-offset: 1px;
}
.woocommerce-account .woocommerce form .form-row label {
  font-weight: 600;
  font-size: 14px;
  color: var(--c-ink);
  margin-bottom: 4px;
}

/* Buttons — same pill + sticker-press language as the rest of the site */
.woocommerce-account .woocommerce button.button,
.woocommerce-account .woocommerce a.button {
  background: var(--c-ink) !important;
  color: #fff !important;
  border: 2px solid var(--c-line) !important;
  border-radius: 999px !important;
  padding: 12px 24px !important;
  font-weight: 700 !important;
  box-shadow: 2px 2px 0 #141414;
  transition: transform .1s, box-shadow .1s;
}
.woocommerce-account .woocommerce button.button:hover,
.woocommerce-account .woocommerce a.button:hover {
  transform: translate(-1px, -2px);
  box-shadow: 4px 4px 0 #141414;
}
.woocommerce-account .woocommerce button.button:active,
.woocommerce-account .woocommerce a.button:active {
  transform: translate(0, 0);
  box-shadow: none;
}

/* Login / register — centered card(s) */
.woocommerce-account:not(.logged-in) .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
  background: #fff;
  border: 2px solid var(--c-line);
  border-radius: var(--r-lg);
  box-shadow: 0 2px 0 0 #141414;
  padding: 24px 18px;
  max-width: 460px;
}
.woocommerce-account:not(.logged-in) main .woocommerce { display: block; }
.woocommerce-account:not(.logged-in) .u-columns.col2-set {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  width: 100%;
}
.woocommerce-account:not(.logged-in) .u-columns.col2-set .u-column1,
.woocommerce-account:not(.logged-in) .u-columns.col2-set .u-column2 {
  float: none !important;
  width: 100% !important;
  max-width: 460px;
  margin: 0 auto;
}
@media (min-width: 860px) {
  .woocommerce-account:not(.logged-in) .u-columns.col2-set { grid-template-columns: 1fr 1fr; max-width: 960px; margin: 0 auto; }
}

/* Orders table */
.woocommerce-account table.woocommerce-orders-table {
  border: 2px solid var(--c-line);
  border-radius: var(--r-sm);
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}
.woocommerce-account table.woocommerce-orders-table th {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: var(--c-bg);
  border-bottom: 2px solid var(--c-line);
  padding: 10px 12px;
}
.woocommerce-account table.woocommerce-orders-table td {
  padding: 12px;
  border-bottom: 1px dashed rgba(0,0,0,.12);
  font-size: 14px;
}
.woocommerce-account table.woocommerce-orders-table tr:last-child td { border-bottom: 0; }

/* ── Account subpages (1.20.20) — Orders / Addresses / Account details
   get the dashboard's design language, not default WC. Mobile-first. ── */

/* Orders table → stacked cards on small screens (WC puts the column
   name in data-title; surface it as a mono label) */
@media (max-width: 640px) {
  .woocommerce-account table.woocommerce-orders-table thead { display: none; }
  .woocommerce-account table.woocommerce-orders-table,
  .woocommerce-account table.woocommerce-orders-table tbody,
  .woocommerce-account table.woocommerce-orders-table tr,
  .woocommerce-account table.woocommerce-orders-table td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .woocommerce-account table.woocommerce-orders-table { border: 0; }
  .woocommerce-account table.woocommerce-orders-table tr {
    background: var(--c-bg);
    border: 2px solid var(--c-line);
    border-radius: var(--r-md);
    padding: 8px 14px;
    margin-bottom: 12px;
  }
  .woocommerce-account table.woocommerce-orders-table td {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px dashed rgba(0,0,0,.12);
    text-align: right;
  }
  .woocommerce-account table.woocommerce-orders-table td:last-child { border-bottom: 0; }
  .woocommerce-account table.woocommerce-orders-table td::before {
    content: attr(data-title);
    font-family: var(--f-mono);
    font-size: 10.5px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--c-ink-2);
    text-align: left;
    flex-shrink: 0;
  }
  .woocommerce-account table.woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions::before { content: ''; }
}
/* Order totals in Fraunces (Price-Is-A-Headline rule) */
.woocommerce-account table.woocommerce-orders-table td.woocommerce-orders-table__cell-order-total .woocommerce-Price-amount {
  font-family: var(--f-display);
  font-weight: 700;
}
/* View/Pay/Cancel buttons in orders rows — small pill variant */
.woocommerce-account table.woocommerce-orders-table .woocommerce-button {
  padding: 8px 16px !important;
  font-size: 13px !important;
  margin: 2px 4px 2px 0;
}

/* Section headings inside account content (Orders, addresses, forms) */
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  font-family: var(--f-display);
  font-weight: 700;
  color: var(--c-ink);
}

/* Edit-account password fieldset — card it, don't leave a bare ruled box */
.woocommerce-account .woocommerce-MyAccount-content fieldset {
  border: 2px dashed var(--c-line);
  border-radius: var(--r-md);
  padding: 16px;
  margin: 20px 0;
}
.woocommerce-account .woocommerce-MyAccount-content fieldset legend {
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 0 8px;
}

/* WC's floated form-row halves (first/last name, edit-address) — keep the
   two-up layout but kill float weirdness; stack on small screens */
.woocommerce-account .woocommerce form .form-row-first,
.woocommerce-account .woocommerce form .form-row-last {
  float: none !important;
  width: 100% !important;
}
@media (min-width: 640px) {
  .woocommerce-account .woocommerce form .form-row-wide { width: 100%; }
  .woocommerce-account .woocommerce form .form-row-first,
  .woocommerce-account .woocommerce form .form-row-last {
    width: calc(50% - 8px) !important;
    display: inline-block;
    vertical-align: top;
  }
  .woocommerce-account .woocommerce form .form-row-first { margin-right: 12px !important; }
}

/* Empty states (no orders yet, etc.) — dashed card, not a bare notice */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info {
  background: var(--c-bg) !important;
  border: 2px dashed var(--c-line) !important;
  border-radius: var(--r-md);
  color: var(--c-ink) !important;
  padding: 16px 18px !important;
}

/* ============================================================
   TOUCH FIX — first tap must act (mobile two-tap add-to-cart bug).
   On touch devices, sticky :hover states that transform/recolor a
   button can consume the first tap as "enter hover" on some
   browsers. Neutralize hover motion where there is no real hover,
   and opt every buy-path control out of double-tap-zoom delay.
   ============================================================ */
.single_add_to_cart_button,
.add_to_cart_button,
.ast-on-card-button,
.checkout-button,
.ak-btn,
.ak-cart-btn,
.ak-account-btn,
.ak-accordion-q,
.ak-hs-carousel-arrow,
.ak-hs-carousel-dot {
  touch-action: manipulation;
}
@media (hover: none) {
  .single-product .single_add_to_cart_button:hover,
  .single-product .ast-on-card-button:hover {
    background: var(--c-ink) !important;
    transform: none !important;
    box-shadow: 2px 2px 0 #141414 !important;
  }
  .ak-card .button.add_to_cart_button:hover,
  .ak-card .single_add_to_cart_button:hover {
    transform: none !important;
  }
  .woocommerce div.product .woocommerce-tabs ul.tabs li:hover:not(.active) {
    transform: none;
  }
}

/* ============================================================
   PRODUCT PAGE — Reviews tab redesign (native WC reviews; a Google-
   reviews feed, if a plugin is added later, should render into this
   same card language so both sources read as one system)
   ============================================================ */
.woocommerce div.product .woocommerce-tabs #reviews #comments ol.commentlist {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
}
.woocommerce div.product .woocommerce-tabs #reviews #comments ol.commentlist li {
  margin: 0 0 12px;
}
.woocommerce div.product .woocommerce-tabs #reviews .comment_container {
  background: var(--c-bg);
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 16px;
  display: flex;
  gap: 12px;
}
.woocommerce div.product .woocommerce-tabs #reviews #comments ol.commentlist li img.avatar {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 2px solid var(--c-line);
  background: #fff;
  position: static;
  padding: 0;
  flex-shrink: 0;
}
.woocommerce div.product .woocommerce-tabs #reviews .comment-text {
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
  flex: 1;
}
.woocommerce div.product .woocommerce-tabs #reviews .comment-text .meta {
  margin: 4px 0 8px;
  font-size: 13px;
  color: var(--c-ink-2);
}
.woocommerce div.product .woocommerce-tabs #reviews .comment-text .meta strong {
  font-family: var(--f-display);
  font-size: 15px;
  color: var(--c-ink);
}
/* Verified Owner — distinct yellow sticker badge (reviews stay open to
   all; this badge is the at-a-glance trust signal instead of gating) */
.woocommerce div.product .woocommerce-tabs #reviews .woocommerce-review__verified {
  display: inline-block;
  background: var(--c-primary);
  border: 1px solid var(--c-line);
  border-radius: 999px;
  padding: 2px 9px;
  font-family: var(--f-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  font-style: normal;
  color: var(--c-ink);
  margin-left: 6px;
}
.woocommerce div.product .woocommerce-tabs #reviews .star-rating,
.woocommerce div.product .woocommerce-tabs #reviews p.stars a {
  color: var(--c-primary-dk, #F2A900);
}
/* Review form */
.woocommerce div.product .woocommerce-tabs #review_form .comment-reply-title {
  font-family: var(--f-display);
  font-size: 20px;
  font-weight: 700;
  display: block;
  margin-bottom: 12px;
}
.woocommerce div.product .woocommerce-tabs #review_form input[type="text"],
.woocommerce div.product .woocommerce-tabs #review_form input[type="email"],
.woocommerce div.product .woocommerce-tabs #review_form textarea {
  background: #fff !important;
  color: var(--c-ink) !important;
  border: 2px solid var(--c-line) !important;
  border-radius: var(--r-sm);
  padding: 11px 14px;
  width: 100%;
  box-sizing: border-box;
  font-family: var(--f-sans);
  font-size: 15px;
}
.woocommerce div.product .woocommerce-tabs #review_form input[type="text"]:focus,
.woocommerce div.product .woocommerce-tabs #review_form input[type="email"]:focus,
.woocommerce div.product .woocommerce-tabs #review_form textarea:focus {
  outline: 2px solid var(--c-accent);
  outline-offset: 1px;
}
.woocommerce div.product .woocommerce-tabs #review_form .form-submit input.submit {
  background: var(--c-ink) !important;
  color: #fff !important;
  border: 2px solid var(--c-line) !important;
  border-radius: 999px !important;
  padding: 12px 28px !important;
  font-weight: 700 !important;
  box-shadow: 2px 2px 0 #141414;
  cursor: pointer;
  touch-action: manipulation;
}
.woocommerce div.product .woocommerce-tabs #reviews .woocommerce-noreviews {
  background: var(--c-bg);
  border: 2px dashed var(--c-line);
  border-radius: var(--r-md);
  padding: 18px;
  font-size: 14px;
}

/* ============================================================
   FAQ PAGE — deduplicate navigation: the hero jump pills serve
   viewports ≤860px (where the sidebar is hidden); from 861px up
   the sticky "Jump to section" sidebar takes over and the pills
   hide. Exactly one section-nav visible at every width.
   ============================================================ */
@media (min-width: 861px) {
  .ak-faq-hero-jumps { display: none; }
}
