/* =========================================================
   ALIBARBAR VAPES AUSTRALIA GLOBAL BRAND FOUNDATION
   Phase 1A Obsidian Gold Design System
   IMPORTANT: This file contains brand tokens and reusable 
   components. It intentionally does not redesign Astra 
   Header, Footer, Homepage or WooCommerce templates 
   during Phase 1A.
   ========================================================= */

/* =========================================================
   01 — BRAND TOKENS
   ========================================================= */
:root {
  /* -------------------------------------------------------
     Core brand backgrounds
     ------------------------------------------------------- */
  --ab-obsidian: #0B0B0A;
  --ab-black: #10100F;
  --ab-charcoal: #151513;
  --ab-graphite: #1C1B18;
  --ab-surface: #22201C;

  /* -------------------------------------------------------
     Champagne Gold system
     ------------------------------------------------------- */
  --ab-gold: #C9A45C;
  --ab-gold-light: #E3CA92;
  --ab-gold-soft: #D8B976;
  --ab-gold-dark: #92713A;
  --ab-gold-rgb: 201, 164, 92;

  /* -------------------------------------------------------
     Warm neutral text system
     ------------------------------------------------------- */
  --ab-ivory: #F5F1E8;
  --ab-cream: #EBE5D8;
  --ab-stone: #CBC4B7;
  --ab-muted: #999287;
  --ab-dim: #716C64;

  /* -------------------------------------------------------
     Functional colours
     These are not primary brand colours.
     ------------------------------------------------------- */
  --ab-success: #7E9B73;
  --ab-warning: #C89B53;
  --ab-danger: #B96F64;

  /* -------------------------------------------------------
     Borders
     ------------------------------------------------------- */
  --ab-line:     rgba(255, 255, 255, 0.09);
  --ab-line-soft:     rgba(255, 255, 255, 0.055);
  --ab-line-gold:     rgba(var(--ab-gold-rgb), 0.24);
  --ab-line-gold-strong:     rgba(var(--ab-gold-rgb), 0.42);

  /* -------------------------------------------------------
     Typography
     No external font dependency in Phase 1A.
     ------------------------------------------------------- */
  --ab-font-sans:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Helvetica,
    Arial,
    sans-serif;
  --ab-font-display:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Helvetica,
    Arial,
    sans-serif;

  /* -------------------------------------------------------
     Type scale
     ------------------------------------------------------- */
  --ab-text-xs: 0.75rem;
  --ab-text-sm: 0.875rem;
  --ab-text-md: 1rem;
  --ab-text-lg: 1.125rem;
  --ab-text-xl: 1.375rem;
  --ab-heading-sm:     clamp(1.65rem, 3vw, 2.15rem);
  --ab-heading-md:     clamp(2rem, 4vw, 3.25rem);
  --ab-heading-lg:     clamp(2.6rem, 6vw, 5rem);
  --ab-heading-hero:     clamp(3rem, 7vw, 6.4rem);

  /* -------------------------------------------------------
     Line heights
     ------------------------------------------------------- */
  --ab-leading-tight: 1.02;
  --ab-leading-heading: 1.10;
  --ab-leading-body: 1.65;

  /* -------------------------------------------------------
     Letter spacing
     ------------------------------------------------------- */
  --ab-tracking-tight: -0.04em;
  --ab-tracking-heading: -0.025em;
  --ab-tracking-label: 0.12em;

  --ab-radius-xs: 6px;
  --ab-radius-sm: 9px;
  --ab-radius-md: 14px;
  --ab-radius-lg: 20px;
  --ab-radius-xl: 28px;
  --ab-radius-pill: 999px;

  --ab-space-1: 4px;
  --ab-space-2: 8px;
  --ab-space-3: 12px;
  --ab-space-4: 16px;
  --ab-space-5: 20px;
  --ab-space-6: 24px;
  --ab-space-7: 32px;
  --ab-space-8: 40px;
  --ab-space-9: 48px;
  --ab-space-10: 64px;
  --ab-space-11: 80px;
  --ab-space-12: 104px;

  --ab-container:     1240px;
  --ab-container-wide:     1380px;
  --ab-gutter-desktop:     32px;
  --ab-gutter-tablet:     24px;
  --ab-gutter-mobile:     18px;

  --ab-shadow-sm:     0 10px 30px rgba(0, 0, 0, 0.18);
  --ab-shadow-md:     0 20px 60px rgba(0, 0, 0, 0.28);
  --ab-shadow-gold:     0 16px 46px rgba(var(--ab-gold-rgb), 0.09);

  --ab-transition-fast:     160ms ease;
  --ab-transition:     220ms ease;
}

/* =========================================================
   02 — SCOPED BRAND FOUNDATION
   IMPORTANT: Do not globally override body/Astra/WooCommerce yet.
   Future ALIBARBAR custom structures will use:
   .ab-brand
   ========================================================= */
.ab-brand, .ab-brand * {   box-sizing: border-box; }

.ab-brand {
  font-family:     var(--ab-font-sans);
  color:     var(--ab-ivory);
  background:     var(--ab-obsidian);
}

/* =========================================================
   03 — CONTAINERS
   ========================================================= */
.ab-container {
  width:     min(
    var(--ab-container),
    calc(100% - (var(--ab-gutter-desktop) * 2))
  );
  margin-inline:     auto;
  min-width:     0;
}

.ab-container-wide {
  width:     min(
    var(--ab-container-wide),
    calc(100% - (var(--ab-gutter-desktop) * 2))
  );
  margin-inline:     auto;
  min-width:     0;
}

/* =========================================================
   04 — TYPOGRAPHY UTILITIES
   ========================================================= */
.ab-eyebrow {
  display:     inline-flex;
  align-items:     center;
  gap:     10px;
  margin:     0 0 16px;
  color:     var(--ab-gold-light);
  font-size:     0.72rem;
  font-weight:     750;
  letter-spacing:     var(--ab-tracking-label);
  line-height:     1.2;
  text-transform:     uppercase;
}

.ab-eyebrow::before {
  content:     "";
  width:     28px;
  height:     1px;
  flex:     0 0 auto;
  background:     var(--ab-gold);
}

.ab-heading-hero {
  margin:     0;
  color:     var(--ab-ivory);
  font-family:     var(--ab-font-display);
  font-size:     var(--ab-heading-hero);
  font-weight:     760;
  line-height:     var(--ab-leading-tight);
  letter-spacing: -0.055em;
}

.ab-heading-lg {
  margin:     0;
  color:     var(--ab-ivory);
  font-family:     var(--ab-font-display);
  font-size:     var(--ab-heading-lg);
  font-weight:     740;
  line-height:     var(--ab-leading-tight);
  letter-spacing:     var(--ab-tracking-tight);
}

.ab-heading-md {
  margin:     0;
  color:     var(--ab-ivory);
  font-family:     var(--ab-font-display);
  font-size:     var(--ab-heading-md);
  font-weight:     730;
  line-height:     var(--ab-leading-heading);
  letter-spacing:     var(--ab-tracking-heading);
}

.ab-gold-text {
  color:     var(--ab-gold-light);
}

.ab-body {
  margin:     0;
  color:     var(--ab-stone);
  font-size:     var(--ab-text-md);
  line-height:     var(--ab-leading-body);
}

.ab-body-lg {
  margin:     0;
  color:     var(--ab-stone);
  font-size:     var(--ab-text-lg);
  line-height:     var(--ab-leading-body);
}

/* =========================================================
   05 — BUTTON SYSTEM
   ========================================================= */
.ab-button {
  min-height:     50px;
  padding:     13px 20px;
  display:     inline-flex;
  align-items:     center;
  justify-content:     center;
  gap:     9px;
  border:     1px solid transparent;
  border-radius:     var(--ab-radius-sm);
  font-family:     var(--ab-font-sans);
  font-size:     0.875rem;
  font-weight:     760;
  line-height:     1;
  text-decoration:     none;
  cursor:     pointer;
  transition:     background var(--ab-transition-fast),
    border-color var(--ab-transition-fast),
    color var(--ab-transition-fast),
    transform var(--ab-transition-fast);
}

.ab-button:hover {
  transform:     translateY(-1px);
}

.ab-button--gold {
  border-color:     var(--ab-gold);
  background:     var(--ab-gold);
  color:     var(--ab-obsidian);
}

.ab-button--gold:hover {
  border-color:     var(--ab-gold-light);
  background:     var(--ab-gold-light);
  color:     var(--ab-obsidian);
}

.ab-button--outline {
  border-color:     var(--ab-line-gold);
  background:     transparent;
  color:     var(--ab-ivory);
}

.ab-button--outline:hover {
  border-color:     var(--ab-line-gold-strong);
  color:     var(--ab-gold-light);
}

.ab-button--ghost {
  border-color:     var(--ab-line);
  background:     rgba(255, 255, 255, 0.025);
  color:     var(--ab-ivory);
}

.ab-button--ghost:hover {
  border-color:     var(--ab-line-gold);
  color:     var(--ab-gold-light);
}

/* =========================================================
   06 — CARD SYSTEM
   ========================================================= */
.ab-card {
  border:     1px solid var(--ab-line);
  border-radius:     var(--ab-radius-md);
  background:     linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.045),
    rgba(255, 255, 255, 0.018)
  );
}

.ab-card--gold {
  border-color:     var(--ab-line-gold);
  background:     linear-gradient(
    145deg,
    rgba(var(--ab-gold-rgb), 0.075),
    rgba(255, 255, 255, 0.015)
  );
  box-shadow:     var(--ab-shadow-gold);
}

/* =========================================================
   07 — SURFACE SYSTEM
   ========================================================= */
.ab-surface-black {   background: var(--ab-obsidian); }
.ab-surface-charcoal {   background: var(--ab-charcoal); }
.ab-surface-graphite {   background: var(--ab-graphite); }
.ab-surface-ivory {   background: var(--ab-ivory);   color: var(--ab-obsidian); }

/* =========================================================
   08 — GOLD DIVIDER
   ========================================================= */
.ab-gold-rule {
  width:     56px;
  height:     1px;
  border:     0;
  margin:     0;
  background:     linear-gradient(
    90deg,
    var(--ab-gold),
    rgba(var(--ab-gold-rgb), 0.08)
  );
}

/* =========================================================
   09 — PRODUCT HALO
   For future gold INGOT product photography.
   ========================================================= */
.ab-product-halo {
  position:     relative;
  isolation:     isolate;
}

.ab-product-halo::before {
  content:     "";
  position:     absolute;
  z-index: -1;
  inset:     14%;
  border-radius:     50%;
  background:     radial-gradient(
    circle,
    rgba(var(--ab-gold-rgb), 0.16) 0%,
    rgba(var(--ab-gold-rgb), 0.055) 42%,
    transparent 70%
  );
  filter:     blur(10px);
  pointer-events:     none;
}

/* =========================================================
   10 — ACCESSIBILITY / FOCUS
   ========================================================= */
.ab-brand a:focus-visible, .ab-brand button:focus-visible {
  outline:     2px solid var(--ab-gold-light);
  outline-offset:     3px;
}

/* =========================================================
   11 — MOBILE / TABLET
   ========================================================= */
@media (max-width: 1024px) {
  .ab-container,
  .ab-container-wide {
    width:       calc(100% - (var(--ab-gutter-tablet) * 2));
  }
}

@media (max-width: 768px) {
  .ab-container,
  .ab-container-wide {
    width:       calc(100% - (var(--ab-gutter-mobile) * 2));
  }

  .ab-heading-hero {
    font-size:       clamp(2.6rem, 11vw, 4.5rem);
  }

  .ab-heading-lg {
    font-size:       clamp(2.25rem, 9vw, 3.6rem);
  }

  .ab-body-lg {
    font-size:       1rem;
  }

  .ab-button {
    min-height:       48px;
  }
}

@media (max-width: 430px) {
  :root {
    --ab-gutter-mobile:       16px;
  }
}

@media (max-width: 390px) {
  .ab-heading-hero {
    font-size:       clamp(2.45rem, 11vw, 3.7rem);
  }
}

@media (max-width: 375px) {
  :root {
    --ab-gutter-mobile:       14px;
  }
}

@media (max-width: 360px) {
  .ab-button {
    padding-inline:       16px;
  }
}

/* =========================================================
   12 — REDUCED MOTION
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
  .ab-button {
    transition:       none;
  }

  .ab-button:hover {
    transform:       none;
  }
}

/* =========================================================
   END — ALIBARBAR BRAND FOUNDATION
   ========================================================= */

/* =========================================================
   PHASE 1B — GLOBAL ALIBARBAR HEADER
   ========================================================= */
.ab-header {
  position:     sticky;
  top:     0;
  z-index:     9999;
  width:     100%;
  border-bottom:     1px solid var(--ab-line);
  background:     rgba(11, 11, 10, 0.94);
  backdrop-filter:     blur(18px);
  -webkit-backdrop-filter:     blur(18px);
}

.ab-header__shell {
  min-height:     76px;
  display:     grid;
  grid-template-columns:     auto 1fr auto;
  align-items:     center;
  gap:     34px;
}

/* BRAND */
.ab-header__brand {
  display:     inline-flex;
  align-items:     center;
  gap:     12px;
  min-width:     0;
  color:     var(--ab-ivory);
  text-decoration:     none;
}

.ab-header__monogram {
  width:     38px;
  height:     38px;
  display:     grid;
  place-items:     center;
  flex:     0 0 auto;
  border:     1px solid var(--ab-line-gold);
  border-radius:     50%;
  color:     var(--ab-gold-light);
  background:     linear-gradient(145deg, rgba(var(--ab-gold-rgb), 0.10), rgba(255, 255, 255, 0.015));
  font-size:     1rem;
  font-weight:     800;
  letter-spacing: -0.04em;
}

.ab-header__brand-copy {
  display:     flex;
  flex-direction:     column;
  min-width:     0;
  line-height:     1;
}

.ab-header__brand-main {
  color:     var(--ab-ivory);
  font-size:     1rem;
  font-weight:     800;
  letter-spacing:     0.035em;
}

.ab-header__brand-sub {
  margin-top:     5px;
  color:     var(--ab-muted);
  font-size:     0.56rem;
  font-weight:     700;
  letter-spacing:     0.18em;
}

/* DESKTOP NAV */
.ab-header__nav {
  display:     flex;
  align-items:     center;
  justify-content:     center;
  gap:     4px;
}

.ab-header__nav-item {
  position:     relative;
}

.ab-header__nav-link {
  min-height:     44px;
  padding:     12px 11px;
  display:     inline-flex;
  align-items:     center;
  gap:     6px;
  color:     var(--ab-stone);
  font-size:     0.74rem;
  font-weight:     760;
  letter-spacing:     0.07em;
  text-decoration:     none;
  transition:     color var(--ab-transition-fast);
}

.ab-header__nav-link:hover {
  color:     var(--ab-gold-light);
}

.ab-header__chevron {
  color:     var(--ab-gold);
  font-size:     0.66rem;
}

/* DROPDOWN */
.ab-header__dropdown {
  position:     absolute;
  top:     calc(100% + 8px);
  left:     0;
  width:     230px;
  padding:     10px;
  border:     1px solid var(--ab-line-gold);
  border-radius:     var(--ab-radius-md);
  background:     rgba(21, 21, 19, 0.98);
  box-shadow:     var(--ab-shadow-md);
  opacity:     0;
  visibility:     hidden;
  pointer-events:     none;
  transform:     translateY(8px);
  transition:     opacity var(--ab-transition-fast), visibility var(--ab-transition-fast), transform var(--ab-transition-fast);
}

.ab-header__nav-item--dropdown:hover .ab-header__dropdown,
.ab-header__nav-item--dropdown:focus-within .ab-header__dropdown {
  opacity:     1;
  visibility:     visible;
  pointer-events:     auto;
  transform:     translateY(0);
}

.ab-header__dropdown-label {
  padding:     7px 10px 8px;
  color:     var(--ab-dim);
  font-size:     0.62rem;
  font-weight:     800;
  letter-spacing:     0.13em;
}

.ab-header__dropdown a {
  min-height:     42px;
  padding:     10px;
  display:     flex;
  align-items:     center;
  justify-content:     space-between;
  border-radius:     var(--ab-radius-sm);
  color:     var(--ab-stone);
  font-size:     0.76rem;
  font-weight:     700;
  text-decoration:     none;
}

.ab-header__dropdown a:hover {
  background:     rgba(var(--ab-gold-rgb), 0.08);
  color:     var(--ab-gold-light);
}

/* DESKTOP ACTIONS */
.ab-header__actions {
  display:     flex;
  align-items:     center;
  gap:     8px;
}

.ab-header__icon-link {
  position:     relative;
  width:     42px;
  height:     42px;
  display:     grid;
  place-items:     center;
  border:     1px solid var(--ab-line);
  border-radius:     var(--ab-radius-sm);
  color:     var(--ab-ivory);
  background:     rgba(255, 255, 255, 0.02);
}

.ab-header__icon-link:hover {
  border-color:     var(--ab-line-gold);
  color:     var(--ab-gold-light);
}

.ab-header__icon-link svg,
.ab-header__mobile-cart svg {
  width:     18px;
  height:     18px;
  fill:     none;
  stroke:     currentColor;
  stroke-width:     1.7;
  stroke-linecap:     round;
  stroke-linejoin:     round;
}

.ab-header__cart-count {
  position:     absolute;
  top: -5px;
  right: -5px;
  min-width:     18px;
  height:     18px;
  padding:     0 4px;
  display:     grid;
  place-items:     center;
  border:     2px solid var(--ab-obsidian);
  border-radius:     var(--ab-radius-pill);
  background:     var(--ab-gold);
  color:     var(--ab-obsidian);
  font-size:     0.58rem;
  font-weight:     900;
}

.ab-header__shop {
  min-height:     42px;
  padding-inline:     16px;
  margin-left:     2px;
  font-size:     0.72rem;
  letter-spacing:     0.06em;
}

/* MOBILE ACTIONS */
.ab-header__mobile-actions {
  display:     none;
  align-items:     center;
  gap:     6px;
}

.ab-header__mobile-cart,
.ab-header__menu-button {
  width:     44px;
  height:     44px;
  display:     grid;
  place-items:     center;
  border:     1px solid var(--ab-line);
  border-radius:     var(--ab-radius-sm);
  background:     transparent;
  color:     var(--ab-ivory);
}

.ab-header__menu-button {
  padding:     0;
  cursor:     pointer;
}

.ab-header__menu-button span {
  width:     18px;
  height:     1px;
  display:     block;
  margin:     2.5px auto;
  background:     currentColor;
  transition:     transform var(--ab-transition-fast), opacity var(--ab-transition-fast);
}

.ab-header__menu-button[aria-expanded="true"] span:nth-child(1) {
  transform:     translateY(6px) rotate(45deg);
}

.ab-header__menu-button[aria-expanded="true"] span:nth-child(2) {
  opacity:     0;
}

.ab-header__menu-button[aria-expanded="true"] span:nth-child(3) {
  transform:     translateY(-6px) rotate(-45deg);
}

/* MOBILE MENU */
.ab-mobile-menu {
  display:     none;
  border-top:     1px solid var(--ab-line);
  background:     rgba(11, 11, 10, 0.985);
}

.ab-mobile-menu.is-open {
  display:     block;
}

.ab-mobile-menu__inner {
  width:     calc(100% - 32px);
  margin:     0 auto;
  padding:     10px 0 20px;
}

.ab-mobile-menu__inner > a:not(.ab-mobile-menu__shop) {
  min-height:     52px;
  padding:     14px 4px;
  display:     flex;
  align-items:     center;
  justify-content:     space-between;
  border-bottom:     1px solid var(--ab-line-soft);
  color:     var(--ab-ivory);
  font-size:     0.82rem;
  font-weight:     760;
  letter-spacing:     0.06em;
  text-decoration:     none;
}

.ab-mobile-menu__inner > a span:last-child {
  color:     var(--ab-gold);
}

.ab-mobile-menu__packs {
  display:     grid;
  grid-template-columns:     repeat(2, minmax(0, 1fr));
  gap:     8px;
  padding:     12px 0;
}

.ab-mobile-menu__packs a {
  min-height:     44px;
  display:     flex;
  align-items:     center;
  justify-content:     center;
  border:     1px solid var(--ab-line);
  border-radius:     var(--ab-radius-sm);
  background:     rgba(255, 255, 255, 0.02);
  color:     var(--ab-stone);
  font-size:     0.72rem;
  font-weight:     760;
  letter-spacing:     0.07em;
  text-decoration:     none;
}

.ab-mobile-menu__shop {
  min-height:     50px;
  margin-top:     14px;
  display:     flex;
  align-items:     center;
  justify-content:     center;
  border-radius:     var(--ab-radius-sm);
  background:     var(--ab-gold);
  color:     var(--ab-obsidian);
  font-size:     0.78rem;
  font-weight:     820;
  letter-spacing:     0.06em;
  text-decoration:     none;
}

/* RESPONSIVE */
@media (max-width: 1100px) {
  .ab-header__shell {
    gap:       20px;
  }

  .ab-header__nav-link {
    padding-inline:       8px;
  }
}

@media (max-width: 960px) {
  .ab-header__nav,
  .ab-header__actions {
    display:       none;
  }

  .ab-header__mobile-actions {
    display:       flex;
  }

  .ab-header__shell {
    min-height:       68px;
    grid-template-columns:       1fr auto;
  }
}

@media (max-width: 430px) {
  .ab-header__shell {
    min-height:       64px;
  }

  .ab-header__monogram {
    width:       34px;
    height:       34px;
  }

  .ab-header__brand-main {
    font-size:       0.9rem;
  }

  .ab-header__brand-sub {
    font-size:       0.5rem;
  }

  .ab-mobile-menu__inner {
    width:       calc(100% - 28px);
  }
}

@media (max-width: 375px) {
  .ab-header__brand {
    gap:       9px;
  }

  .ab-header__monogram {
    width:       32px;
    height:       32px;
  }

  .ab-header__mobile-cart,
  .ab-header__menu-button {
    width:       42px;
    height:       42px;
  }
}

@media (max-width: 360px) {
  .ab-header__brand-sub {
    display:       none;
  }
}

/* =========================================================
   END PHASE 1B HEADER
   ========================================================= */

/* =========================================================
   PHASE 1C — GLOBAL ALIBARBAR FOOTER
   ========================================================= */
.ab-footer {
  width:     100%;
  padding:     72px 0 24px;
  border-top:     1px solid var(--ab-line-gold);
  background:     linear-gradient(180deg, var(--ab-charcoal) 0%, var(--ab-obsidian) 100%);
  color:     var(--ab-stone);
}

/* =========================================================
   TOP GRID
   ========================================================= */
.ab-footer__top {
  display:     grid;
  grid-template-columns:     minmax(260px, 1.55fr) repeat(4, minmax(120px, .7fr));
  gap:     42px;
  align-items:     start;
}

/* =========================================================
   BRAND BLOCK
   ========================================================= */
.ab-footer__brand-block {
  max-width:     330px;
}

.ab-footer__brand {
  display:     inline-flex;
  align-items:     center;
  gap:     12px;
  color:     var(--ab-ivory);
  text-decoration:     none;
}

.ab-footer__monogram {
  width:     42px;
  height:     42px;
  display:     grid;
  place-items:     center;
  flex:     0 0 auto;
  border:     1px solid var(--ab-line-gold);
  border-radius:     50%;
  background:     linear-gradient(145deg, rgba(var(--ab-gold-rgb), 0.10), rgba(255,255,255,.015));
  color:     var(--ab-gold-light);
  font-size:     1rem;
  font-weight:     850;
}

.ab-footer__brand-copy {
  display:     flex;
  flex-direction:     column;
  line-height:     1;
}

.ab-footer__brand-main {
  color:     var(--ab-ivory);
  font-size:     1rem;
  font-weight:     820;
  letter-spacing:     .04em;
}

.ab-footer__brand-sub {
  margin-top:     5px;
  color:     var(--ab-muted);
  font-size:     .56rem;
  font-weight:     700;
  letter-spacing:     .18em;
}

.ab-footer__description {
  max-width:     320px;
  margin:     22px 0 0;
  color:     var(--ab-muted);
  font-size:     .88rem;
  line-height:     1.68;
}

.ab-footer__cta {
  margin-top:     22px;
  min-height:     46px;
  padding-inline:     18px;
  font-size:     .73rem;
  letter-spacing:     .07em;
}

/* =========================================================
   LINK COLUMNS
   ========================================================= */
.ab-footer__column {
  min-width:     0;
}

.ab-footer__heading {
  margin:     0 0 18px;
  color:     var(--ab-gold-light);
  font-size:     .67rem;
  font-weight:     820;
  line-height:     1.2;
  letter-spacing:     .13em;
}

.ab-footer__column a {
  min-height:     34px;
  display:     flex;
  align-items:     center;
  color:     var(--ab-muted);
  font-size:     .82rem;
  line-height:     1.45;
  text-decoration:     none;
  transition:     color var(--ab-transition-fast);
}

.ab-footer__column a:hover {
  color:     var(--ab-ivory);
}

/* =========================================================
   DIVIDER
   ========================================================= */
.ab-footer__divider {
  width:     100%;
  height:     1px;
  margin:     52px 0 22px;
  background:     linear-gradient(90deg, rgba(var(--ab-gold-rgb), .34), rgba(var(--ab-gold-rgb), .07) 45%, rgba(255,255,255,.035));
}

/* =========================================================
   BOTTOM
   ========================================================= */
.ab-footer__bottom {
  display:     flex;
  align-items:     center;
  justify-content:     space-between;
  gap:     20px;
}

.ab-footer__copyright {
  color:     var(--ab-dim);
  font-size:     .72rem;
  line-height:     1.5;
}

.ab-footer__meta {
  display:     flex;
  align-items:     center;
  gap:     10px;
  color:     var(--ab-dim);
  font-size:     .7rem;
  line-height:     1.5;
}

.ab-footer__dot {
  color:     var(--ab-gold-dark);
}

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width: 1024px) {
  .ab-footer__top {
    grid-template-columns:       minmax(260px, 1.3fr) repeat(2, minmax(140px, 1fr));
    gap:       36px 28px;
  }

  .ab-footer__brand-block {
    grid-row:       span 2;
  }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 768px) {
  .ab-footer {
    padding:       52px 0 22px;
  }

  .ab-footer__top {
    display:       grid;
    grid-template-columns:       repeat(2, minmax(0, 1fr));
    gap:       34px 20px;
  }

  .ab-footer__brand-block {
    grid-column:       1 / -1;
    grid-row:       auto;
    max-width:       none;
  }

  .ab-footer__description {
    max-width:       520px;
  }

  .ab-footer__cta {
    width:       100%;
    max-width:       320px;
  }

  .ab-footer__column a {
    min-height:       44px;
  }

  .ab-footer__divider {
    margin:       38px 0 20px;
  }

  .ab-footer__bottom {
    flex-direction:       column;
    align-items:       flex-start;
    gap:       8px;
  }
}

/* =========================================================
   430
   ========================================================= */
@media (max-width: 430px) {
  .ab-footer {
    padding-top:       44px;
  }

  .ab-footer__top {
    grid-template-columns:       1fr;
    gap:       30px;
  }

  .ab-footer__brand-block {
    grid-column:       auto;
  }

  .ab-footer__cta {
    max-width:       none;
  }

  .ab-footer__heading {
    margin-bottom:       10px;
  }

  .ab-footer__column {
    padding-bottom:       10px;
    border-bottom:       1px solid var(--ab-line-soft);
  }

  .ab-footer__column a {
    min-height:       44px;
  }

  .ab-footer__meta {
    flex-wrap:       wrap;
  }
}

@media (max-width: 375px) {
  .ab-footer__brand-main {
    font-size:       .92rem;
  }

  .ab-footer__description {
    font-size:       .84rem;
  }
}

@media (max-width: 360px) {
  .ab-footer__monogram {
    width:       38px;
    height:       38px;
  }

  .ab-footer__brand-sub {
    font-size:       .5rem;
  }
}

/* =========================================================
   END PHASE 1C FOOTER
   ========================================================= */
/* =========================================================
   PHASE 2A — HOMEPAGE GOLD HERO + TRUST STRIP
   ========================================================= */

/* =========================================================
   HERO SECTION
   ========================================================= */
.ab-home-hero {
  position:      relative;
  overflow:      hidden;
  padding:      100px 0 80px;
  background:     linear-gradient(165deg, var(--ab-obsidian) 0%, #0f0f0e 100%);
  color:       var(--ab-ivory);
}

/* Background subtle texture */
.ab-home-hero__bg {
  position:      absolute;
  inset:      0;
  background:     radial-gradient(ellipse at 70% 40%, rgba(var(--ab-gold-rgb), .06) 0%, transparent 70%);
  pointer-events: none;
}

.ab-home-hero__inner {
  position:      relative;
  display:     grid;
  grid-template-columns:     1fr 1fr;
  gap:       60px;
  align-items:     center;
  z-index:      1;
}

/* =========================================================
   HERO CONTENT (LEFT)
   ========================================================= */
.ab-home-hero__content {
  max-width:     580px;
}

.ab-eyebrow {
  margin-bottom:     14px;
  color:       var(--ab-gold-light);
  font-size:      .7rem;
  font-weight:     800;
  letter-spacing:     .18em;
  text-transform:     uppercase;
}

.ab-home-hero__title {
  margin:       0 0 22px;
  color:       var(--ab-ivory);
  font-size:      2.8rem;
  font-weight:     820;
  line-height:     1.12;
  letter-spacing:     -.01em;
}

.ab-home-hero__title em {
  font-style:      normal;
  color:       var(--ab-gold);
}

.ab-home-hero__copy {
  max-width:     460px;
  margin:       0 0 32px;
  color:       var(--ab-stone);
  font-size:     1.05rem;
  line-height:     1.7;
}

/* =========================================================
   HERO CTA
   ========================================================= */
.ab-home-hero__actions {
  display:     flex;
  flex-wrap:     wrap;
  gap:       16px;
  margin-bottom:     36px;
}

.ab-home-hero__actions .ab-button {
  min-height:     50px;
  padding:       0 26px;
  font-size:     .78rem;
  letter-spacing:     .06em;
}

/* =========================================================
   HERO FACTS (Desktop trust)
   ========================================================= */
.ab-home-hero__facts {
  display:     flex;
  gap:       28px;
  flex-wrap:     wrap;
}

.ab-home-hero__fact {
  display:     flex;
  align-items:     center;
  gap:       10px;
}

.ab-home-hero__fact-num {
  color:       var(--ab-gold);
  font-size:     1.5rem;
  font-weight:     850;
  line-height:     1;
}

.ab-home-hero__fact-badge {
  display:     inline-flex;
  align-items:     center;
  justify-content:     center;
  width:       36px;
  height:      36px;
  border:       1px solid var(--ab-gold);
  border-radius:     50%;
  color:       var(--ab-gold);
  font-size:     .72rem;
  font-weight:     800;
  letter-spacing:     .04em;
}

.ab-home-hero__fact-label {
  color:       var(--ab-muted);
  font-size:     .78rem;
  line-height:     1.4;
}

/* =========================================================
   HERO VISUAL (RIGHT)
   ========================================================= */
.ab-home-hero__visual {
  position:      relative;
  display:     flex;
  align-items:     center;
  justify-content:     center;
}

.ab-product-halo {
  /* Subtle gold glow behind products */
}

.ab-home-hero__visual-label {
  position:      absolute;
  top:       20px;
  right:       20px;
  display:     flex;
  flex-direction:     column;
  align-items:     flex-end;
  line-height:     1;
  z-index:      2;
}

.ab-home-hero__visual-label span:first-child {
  color:       var(--ab-gold-dark);
  font-size:     .56rem;
  font-weight:     700;
  letter-spacing:     .2em;
}

.ab-home-hero__visual-label span:last-child {
  color:       var(--ab-gold-light);
  font-size:     .88rem;
  font-weight:     820;
  letter-spacing:     .06em;
}

.ab-home-hero__products {
  display:     grid;
  grid-template-columns:     repeat(2, 1fr);
  gap:       20px;
  max-width:     520px;
}

.ab-home-hero__product img {
  width:       100%;
  height:      auto;
  object-fit:     contain;
  filter:       drop-shadow(0 20px 40px rgba(0,0,0,.35));
  transition:     transform .4s ease;
}

.ab-home-hero__product img:hover {
  transform:      scale(1.03);
}

/* =========================================================
   TRUST STRIP
   ========================================================= */
.ab-home-trust {
  padding:      28px 0;
  border-top:     1px solid var(--ab-line-soft);
  border-bottom:     1px solid var(--ab-line-soft);
  background:     var(--ab-charcoal);
}

.ab-home-trust__strip {
  display:     flex;
  align-items:     center;
  justify-content:     center;
  gap:       0;
  overflow-x:     auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width:     none;
}

.ab-home-trust__strip::-webkit-scrollbar {
  display: none;
}

.ab-home-trust__item {
  display:     flex;
  align-items:     center;
  gap:       10px;
  flex-shrink:     0;
  padding:       0 20px;
}

.ab-home-trust__num {
  color:       var(--ab-gold);
  font-size:     1.4rem;
  font-weight:     850;
  line-height:     1;
}

.ab-home-trust__badge {
  display:     inline-flex;
  align-items:     center;
  justify-content:     center;
  width:       32px;
  height:      32px;
  border:       1px solid var(--ab-gold);
  border-radius:     50%;
  color:       var(--ab-gold);
  font-size:     .68rem;
  font-weight:     800;
  letter-spacing:     .04em;
}

.ab-home-trust__text {
  color:       var(--ab-muted);
  font-size:     .76rem;
  line-height:     1.3;
  white-space:     nowrap;
}

.ab-home-trust__sep {
  width:       1px;
  height:      28px;
  flex-shrink:     0;
  background:     var(--ab-line-soft);
}

/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */
@media (max-width: 1024px) {

  .ab-home-hero {
    padding:     80px 0 60px;
  }

  .ab-home-hero__inner {
    grid-template-columns:     1fr;
    gap:       40px;
  }

  .ab-home-hero__content {
    max-width:     none;
    order:       -1;
  }

  .ab-home-hero__visual {
    max-width:     500px;
    margin:       0 auto;
  }

  .ab-home-hero__products {
    max-width:     420px;
  }

}

/* =========================================================
   RESPONSIVE — MOBILE (rearranged, not just stacked)
   ========================================================= */
@media (max-width: 768px) {

  .ab-home-hero {
    padding:     60px 0 40px;
  }

  .ab-home-hero__inner {
    display:       flex;
    flex-direction:       column;
    gap:       32px;
  }

  /* Mobile order: eyebrow → H1 → copy → CTAs → visual → facts */
  .ab-home-hero__content {
    display:       flex;
    flex-direction:       column;
    order:       1;
  }

  .ab-eyebrow {
    order:       1;
    margin-bottom:       10px;
  }

  .ab-home-hero__title {
    order:       2;
    margin-bottom:       16px;
    font-size:       2rem;
  }

  .ab-home-hero__copy {
    order:       3;
    margin-bottom:       24px;
    font-size:       0.96rem;
  }

  .ab-home-hero__actions {
    order:       4;
    flex-direction:       column;
    margin-bottom:       0;
  }

  .ab-home-hero__actions .ab-button {
    width:       100%;
    justify-content:       center;
  }

  .ab-home-hero__visual {
    order:       5;
    max-width:       400px;
    margin:       0 auto;
  }

  .ab-home-hero__facts {
    order:       6;
    justify-content:       center;
    gap:       20px;
  }

  /* Trust strip horizontal scroll on mobile */
  .ab-home-trust__strip {
    justify-content:       flex-start;
    padding:       0 16px;
  }

}

/* =========================================================
   430
   ========================================================= */
@media (max-width: 430px) {

  .ab-home-hero {
    padding-top:       48px;
    padding-bottom:       32px;
  }

  .ab-home-hero__title {
    font-size:       1.7rem;
  }

  .ab-home-hero__copy {
    font-size:       0.9rem;
  }

  .ab-home-hero__products {
    grid-template-columns:       1fr;
    max-width:       240px;
  }

  .ab-home-trust__item {
    padding:       0 14px;
  }

  .ab-home-trust__text {
    font-size:       0.7rem;
  }

}

@media (max-width: 375px) {

  .ab-home-hero__title {
    font-size:       1.5rem;
  }

  .ab-home-trust__num {
    font-size:       1.2rem;
  }

}

@media (max-width: 360px) {

  .ab-home-hero__title {
    font-size:       1.35rem;
  }

  .ab-eyebrow {
    font-size:       .62rem;
  }

}

/* =========================================================
   END PHASE 2A HOMEPAGE
   ========================================================= */
/* =========================================================
   PHASE 2B — SECTION 03: INGOT 9000 PRODUCT STORY
   ========================================================= */

/* =========================================================
   SECTION 03 — INGOT 9000 PRODUCT STORY
   ========================================================= */
.ab-home-ingot {
  position:      relative;
  padding:      120px 0;
  background:     var(--ab-charcoal);
  color:       var(--ab-ivory);
  border-top:     1px solid var(--ab-line-soft);
}

.ab-home-ingot__inner {
  position:      relative;
  display:     grid;
  grid-template-columns:     48% 52%;
  gap:       80px;
  align-items:     center;
}

/* =========================================================
   PRODUCT VISUAL (LEFT)
   ========================================================= */
.ab-home-ingot__visual {
  position:      relative;
  display:     flex;
  align-items:     center;
  justify-content:     center;
}

.ab-home-ingot__image-shell {
  position:      relative;
  width:       100%;
  max-width:     520px;
  padding:      40px;
  background:     radial-gradient(ellipse at 50% 60%, rgba(var(--ab-gold-rgb), .05) 0%, transparent 70%);
  border-radius:     24px;
  border:       1px solid rgba(var(--ab-gold-rgb), .08);
}

.ab-home-ingot__image-shell img {
  width:       100%;
  height:      auto;
  object-fit:     contain;
  filter:       drop-shadow(0 30px 60px rgba(0,0,0,.4));
  transition:     transform .5s ease;
}

.ab-home-ingot__image-shell img:hover {
  transform:      scale(1.04);
}

.ab-home-ingot__visual-mark {
  position:      absolute;
  top:       24px;
  left:       24px;
  display:     flex;
  flex-direction:     column;
  line-height:     1;
  z-index:      2;
}

.ab-home-ingot__visual-mark span:first-child {
  color:       var(--ab-gold-dark);
  font-size:     .56rem;
  font-weight:     700;
  letter-spacing:     .2em;
}

.ab-home-ingot__visual-mark span:last-child {
  color:       var(--ab-gold-light);
  font-size:     .88rem;
  font-weight:     820;
  letter-spacing:     .06em;
}

/* =========================================================
   CONTENT (RIGHT)
   ========================================================= */
.ab-home-ingot__content {
  max-width:     560px;
}

.ab-home-ingot__content .ab-eyebrow {
  margin-bottom:     16px;
  color:       var(--ab-gold-light);
}

.ab-home-ingot__title {
  margin:       0 0 24px;
  color:       var(--ab-ivory);
  font-size:      2.2rem;
  font-weight:     820;
  line-height:     1.15;
  letter-spacing:     -.01em;
}

.ab-home-ingot__copy {
  margin:       0 0 16px;
  color:       var(--ab-stone);
  font-size:     1rem;
  line-height:     1.7;
}

.ab-home-ingot__copy:last-of-type {
  margin-bottom:     32px;
}

/* =========================================================
   DATA ROW
   ========================================================= */
.ab-home-ingot__data {
  display:     flex;
  gap:       32px;
  flex-wrap:     wrap;
  margin-bottom:     36px;
  padding-bottom:     32px;
  border-bottom:     1px solid var(--ab-line-soft);
}

.ab-home-ingot__datum {
  display:     flex;
  align-items:     center;
  gap:       12px;
}

.ab-home-ingot__datum-num {
  color:       var(--ab-gold);
  font-size:     1.6rem;
  font-weight:     850;
  line-height:     1;
}

.ab-home-ingot__datum-badge {
  display:     inline-flex;
  align-items:     center;
  justify-content:     center;
  width:       36px;
  height:      36px;
  border:       1px solid var(--ab-gold);
  border-radius:     50%;
  color:       var(--ab-gold);
  font-size:     .72rem;
  font-weight:     800;
  letter-spacing:     .04em;
}

.ab-home-ingot__datum-label {
  color:       var(--ab-muted);
  font-size:     .8rem;
  line-height:     1.4;
}

/* =========================================================
   CTA
   ========================================================= */
.ab-home-ingot__actions {
  display:     flex;
  flex-wrap:     wrap;
  gap:       16px;
}

.ab-home-ingot__actions .ab-button {
  min-height:     50px;
  padding:       0 26px;
  font-size:     .78rem;
  letter-spacing:     .06em;
}

/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */
@media (max-width: 1024px) {

  .ab-home-ingot {
    padding:     90px 0;
  }

  .ab-home-ingot__inner {
    grid-template-columns:     1fr;
    gap:       48px;
  }

  .ab-home-ingot__visual {
    max-width:     480px;
    margin:       0 auto;
    order:       -1;
  }

  .ab-home-ingot__content {
    max-width:     none;
  }

  .ab-home-ingot__image-shell {
    padding:      32px;
  }

}

/* =========================================================
   RESPONSIVE — MOBILE (rearranged, not just stacked)
   ========================================================= */
@media (max-width: 768px) {

  .ab-home-ingot {
    padding:     64px 0;
  }

  .ab-home-ingot__inner {
    display:       flex;
    flex-direction:       column;
    gap:       36px;
  }

  /* Mobile order: eyebrow → H2 → copy → visual → data → CTAs */
  .ab-home-ingot__content {
    display:       flex;
    flex-direction:       column;
    order:       1;
  }

  .ab-eyebrow {
    order:       1;
    margin-bottom:       12px;
  }

  .ab-home-ingot__title {
    order:       2;
    margin-bottom:       18px;
    font-size:       1.7rem;
  }

  .ab-home-ingot__copy:first-of-type {
    order:       3;
    margin-bottom:       14px;
  }

  .ab-home-ingot__copy:last-of-type {
    order:       4;
    margin-bottom:       0;
  }

  .ab-home-ingot__visual {
    order:       5;
    max-width:       360px;
    margin:       0 auto;
  }

  .ab-home-ingot__data {
    order:       6;
    justify-content:       center;
    gap:       20px;
    margin-bottom:       28px;
    padding-bottom:       24px;
  }

  .ab-home-ingot__actions {
    order:       7;
    flex-direction:       column;
  }

  .ab-home-ingot__actions .ab-button {
    width:       100%;
    justify-content:       center;
  }

}

/* =========================================================
   430
   ========================================================= */
@media (max-width: 430px) {

  .ab-home-ingot {
    padding-top:       48px;
    padding-bottom:       48px;
  }

  .ab-home-ingot__title {
    font-size:       1.45rem;
  }

  .ab-home-ingot__copy {
    font-size:       0.92rem;
  }

  .ab-home-ingot__image-shell {
    padding:       24px;
  }

  .ab-home-ingot__datum-num {
    font-size:       1.35rem;
  }

}

@media (max-width: 375px) {

  .ab-home-ingot__title {
    font-size:       1.3rem;
  }

  .ab-home-ingot__datum {
    gap:       8px;
  }

}

@media (max-width: 360px) {

  .ab-home-ingot__title {
    font-size:       1.2rem;
  }

  .ab-eyebrow {
    font-size:       .62rem;
  }

}

/* =========================================================
   END PHASE 2B SECTION 03
   ========================================================= */

/* =========================================================
   PHASE 2C-B SECTION 04 — 29 FLAVOURS DISCOVERY
   Warm Obsidian Gallery
   ========================================================= */

/* --- Section container --- */
.ab-home-flavours {
  background: linear-gradient(180deg, #11110F 0%, var(--ab-charcoal) 100%);
  padding: 80px 0 96px;
  border-top: 1px solid var(--ab-line);
  border-bottom: 1px solid var(--ab-line);
}

.ab-home-flavours__head {
  text-align: center;
  margin-bottom: 56px;
}

.ab-home-flavours__title {
  font-family: var(--ab-font-display);
  font-size: 2rem;
  font-weight: 700;
  color: var(--ab-ivory);
  margin: 12px 0 16px;
  line-height: 1.2;
}

.ab-home-flavours__title em {
  font-style: italic;
  color: var(--ab-gold);
}

.ab-home-flavours__intro {
  max-width: 640px;
  margin: 0 auto;
  color: var(--ab-stone);
}

/* --- Horizontal scroll track --- */
.ab-home-flavours__track {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 48px;
}

/* --- Flavour card --- */
.ab-home-flavour-card {
  background: var(--ab-graphite);
  border: 1px solid var(--ab-line-gold);
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  aspect-ratio: 4 / 5;
  display: flex;
  flex-direction: column;
}

.ab-home-flavour-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.ab-home-flavour-card__media {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: var(--ab-charcoal);
}

.ab-home-flavour-card__media img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

.ab-home-flavour-card__body {
  padding: 16px;
  border-top: 1px solid var(--ab-line-gold);
}

.ab-home-flavour-card__tag {
  display: inline-block;
  font-size: var(--ab-text-xs);
  color: var(--ab-gold-soft);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.ab-home-flavour-card__name {
  font-family: var(--ab-font-display);
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--ab-ivory);
  margin: 0 0 8px;
  line-height: 1.3;
}

.ab-home-flavour-card__note {
  font-size: var(--ab-text-sm);
  color: var(--ab-muted);
  margin: 0;
  line-height: 1.5;
}

/* --- CTA --- */
.ab-home-flavours__actions {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* --- Responsive: Tablet 1024 --- */
@media (max-width: 1024px) {
  .ab-home-flavours__track {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}

/* --- Responsive: Tablet 768 --- */
@media (max-width: 768px) {
  .ab-home-flavours {
    padding: 64px 0 80px;
  }

  .ab-home-flavours__track {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .ab-home-flavours__title {
    font-size: 1.7rem;
  }
}

/* --- Responsive: Mobile 430 --- */
@media (max-width: 430px) {
  .ab-home-flavours__track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding: 0 20px 16px;
    margin: 0 -20px 48px;
    scrollbar-width: none;
  }

  .ab-home-flavours__track::-webkit-scrollbar {
    display: none;
  }

  .ab-home-flavour-card {
    flex: 0 0 80vw;
    scroll-snap-align: start;
  }

  .ab-home-flavours__title {
    font-size: 1.5rem;
  }

  .ab-home-flavours__actions {
    flex-direction: column;
    align-items: center;
  }

  .ab-home-flavours__actions .ab-button {
    width: 100%;
    max-width: 280px;
  }
}

/* --- Responsive: Mobile 390 --- */
@media (max-width: 390px) {
  .ab-home-flavour-card {
    flex: 0 0 82vw;
  }
}

/* --- Responsive: Mobile 375 --- */
@media (max-width: 375px) {
  .ab-home-flavour-card {
    flex: 0 0 80vw;
  }

  .ab-home-flavours__head {
    margin-bottom: 40px;
  }
}

/* --- Responsive: Mobile 360 --- */
@media (max-width: 360px) {
  .ab-home-flavour-card {
    flex: 0 0 78vw;
  }
}
/ =========================================================
   PHASE 2E — BRAND CONFIDENCE
   ========================================================= /

.ab-home-confidence {
    position:     relative;
    padding:     104px 0;
    overflow:     hidden;
    border-bottom:     1px solid var(--ab-line);
    background:     linear-gradient(
        135deg,
        #0D0D0C 0%,
        #15130F 100%
    );
}

.ab-home-confidence::before {
    content:     "";
    position:     absolute;
    top:      -180px;
    left:      -180px;
    width:     420px;
    height:     420px;
    border-radius:     50%;
    background:     radial-gradient(
        circle,
        rgba(var(--ab-gold-rgb), .075),
        transparent 70%
    );
    pointer-events:     none;
}

.ab-home-confidence__inner {
    position:     relative;
    z-index:     2;
    display:     grid;
    grid-template-columns:     minmax(0, .88fr)     minmax(0, 1.12fr);
    gap:     82px;
    align-items:     start;
}

/ =========================================================
   INTRO
   ========================================================= /

.ab-home-confidence__intro {
    max-width:     570px;
}

.ab-home-confidence__lead {
    margin-top:     24px;
}

.ab-home-confidence__copy {
    margin-top:     16px;
}

.ab-home-confidence__cta {
    margin-top:     28px;
}

/ =========================================================
   ROWS
   ========================================================= /

.ab-home-confidence__rows {
    border-top:     1px solid var(--ab-line-gold);
}

.ab-home-confidence__row {
    display:     grid;
    grid-template-columns:     64px minmax(0, 1fr);
    gap:     24px;
    padding:     30px 0;
    border-bottom:     1px solid var(--ab-line);
}

.ab-home-confidence__number {
    color:     var(--ab-gold);
    font-size:     .72rem;
    font-weight:     820;
    line-height:     1.4;
    letter-spacing:     .12em;
}

.ab-home-confidence__row-content h3 {
    margin:     0;
    color:     var(--ab-ivory);
    font-size:     1.25rem;
    font-weight:     760;
    line-height:     1.2;
}

.ab-home-confidence__row-content p {
    max-width:     620px;
    margin:     10px 0 0;
    color:     var(--ab-muted);
    font-size:     .88rem;
    line-height:     1.65;
}

/ =========================================================
   TABLET
   ========================================================= /

@media (max-width: 1024px) {

    .ab-home-confidence {
        padding:       84px 0;
    }

    .ab-home-confidence__inner {
        gap:       48px;
    }

}

/ =========================================================
   MOBILE
   ========================================================= /

@media (max-width: 768px) {

    .ab-home-confidence {
        padding:       58px 0;
    }

    .ab-home-confidence__inner {
        display:       block;
    }

    .ab-home-confidence__intro {
        max-width:       none;
    }

    .ab-home-confidence__lead {
        margin-top:       18px;
        font-size:       1rem;
        line-height:       1.6;
    }

    .ab-home-confidence__cta {
        width:       100%;
        margin-top:       22px;
    }

    .ab-home-confidence__rows {
        margin-top:       38px;
    }

    .ab-home-confidence__row {
        grid-template-columns:       48px minmax(0, 1fr);
        gap:       16px;
        padding:       24px 0;
    }

    .ab-home-confidence__row-content h3 {
        font-size:       1.12rem;
    }

    .ab-home-confidence__row-content p {
        font-size:       .84rem;
    }

}

/ =========================================================
   430
   ========================================================= /

@media (max-width: 430px) {

    .ab-home-confidence {
        padding:       50px 0;
    }

    .ab-home-confidence__rows {
        margin-top:       32px;
    }

}

/ =========================================================
   375
   ========================================================= /

@media (max-width: 375px) {

    .ab-home-confidence__row {
        grid-template-columns:       40px minmax(0, 1fr);
        gap:       12px;
    }

    .ab-home-confidence__number {
        font-size:       .66rem;
    }

}

/ =========================================================
   END PHASE 2E
   ========================================================= /
/ =========================================================
   PHASE 2F — HOMEPAGE FAQ
   ========================================================= /

.ab-home-faq {
    position:     relative;
    padding:     108px 0 120px;
    overflow:     hidden;
    background:     #0B0B0A;
    border-top:     1px solid var(--ab-line);
}

.ab-home-faq__inner {
    max-width:     1240px;
    margin:     0 auto;
}

.ab-home-faq__header {
    max-width:     720px;
    margin-bottom:     56px;
}

.ab-home-faq__intro {
    margin-top:     18px;
    color:     var(--ab-muted);
    font-size:     1.05rem;
    line-height:     1.7;
}

.ab-home-faq__list {
    display:     flex;
    flex-direction:     column;
    gap:     0;
}

.ab-home-faq__item {
    border-bottom:     1px solid rgba(201, 164, 92, .18);
    padding:     0;
}

.ab-home-faq__item:first-child {
    border-top:     1px solid rgba(201, 164, 92, .18);
}

.ab-home-faq__question {
    display:     flex;
    align-items:     center;
    justify-content:     space-between;
    width:     100%;
    padding:     22px 0;
    cursor:     pointer;
    user-select:     none;
    list-style:     none;
    color:     var(--ab-ivory);
    font-size:     1.08rem;
    font-weight:     700;
    line-height:     1.4;
    letter-spacing:     .01em;
    transition:     color .2s ease;
}

.ab-home-faq__question::-webkit-details-marker {
    display:     none;
}

.ab-home-faq__question::after {
    content:     "+";
    flex-shrink:     0;
    margin-left:     24px;
    color:     var(--ab-gold);
    font-size:     1.4rem;
    font-weight:     400;
    line-height:     1;
    transition:     transform .25s ease;
}

.ab-home-faq__item[open] .ab-home-faq__question::after {
    transform:     rotate(45deg);
}

.ab-home-faq__question:hover {
    color:     var(--ab-gold);
}

.ab-home-faq__question:focus-visible {
    outline:     2px solid var(--ab-gold);
    outline-offset:     6px;
    border-radius:     2px;
}

.ab-home-faq__answer {
    padding:     0 0 24px;
    color:     var(--ab-muted);
    font-size:     .94rem;
    line-height:     1.75;
}

.ab-home-faq__answer p {
    margin:     0;
}

/ =========================================================
   TABLET
   ========================================================= /

@media (max-width: 1024px) {

    .ab-home-faq {
        padding:     88px 0 96px;
    }

    .ab-home-faq__header {
        margin-bottom:     44px;
    }

}

/ =========================================================
   MOBILE
   ========================================================= /

@media (max-width: 768px) {

    .ab-home-faq {
        padding:     68px 0 72px;
    }

    .ab-home-faq__inner {
        padding:     0 18px;
    }

    .ab-home-faq__header {
        margin-bottom:     32px;
    }

    .ab-home-faq__intro {
        font-size:     .96rem;
    }

    .ab-home-faq__question {
        padding:     18px 0;
        font-size:     .96rem;
        min-height:     56px;
    }

    .ab-home-faq__question::after {
        margin-left:     16px;
        font-size:     1.2rem;
    }

    .ab-home-faq__answer {
        padding:     0 0 20px;
        font-size:     .88rem;
        line-height:     1.7;
    }

}

/ =========================================================
   430
   ========================================================= /

@media (max-width: 430px) {

    .ab-home-faq {
        padding:     60px 0 64px;
    }

    .ab-home-faq__inner {
        padding:     0 16px;
    }

    .ab-home-faq__title {
        font-size:     1.65rem;
    }

    .ab-home-faq__question {
        font-size:     .92rem;
    }

}

/ =========================================================
   390
   ========================================================= /

@media (max-width: 390px) {

    .ab-home-faq__question {
        font-size:     .88rem;
    }

    .ab-home-faq__answer {
        font-size:     .84rem;
    }

}

/ =========================================================
   375
   ========================================================= /

@media (max-width: 375px) {

    .ab-home-faq__inner {
        padding:     0 14px;
    }

    .ab-home-faq__question {
        font-size:     .86rem;
    }

}

/ =========================================================
   END PHASE 2F
   ========================================================= /
/* ============================================================
   GLOBAL LAYOUT FIX — FORCE FULL-WIDTH ON HOMEPAGE
   Added: 2026-08-30 03:50
   Purpose: Override Astra #primary{width:70%} and .ast-container{max-width:1240px}
   ============================================================ */

/* Force #primary to 100% width — override Astra inline CSS */
.home #primary,
body.blog #primary {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Hide any empty sidebar area */
.home #secondary,
body.blog #secondary {
    display: none !important;
    width: 0 !important;
}

/* Override .site-content .ast-container to be full width */
.home .site-content .ast-container,
body.blog .site-content .ast-container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Ensure .ab-container sections are properly centered */
.home .ab-container {
    width: min(var(--ab-container, 1240px), calc(100% - (var(--ab-gutter-desktop, 32px) * 2))) !important;
    max-width: var(--ab-container, 1240px) !important;
    margin-inline: auto !important;
    padding-inline: var(--ab-gutter-desktop, 32px) !important;
    box-sizing: border-box !important;
}

.home .ab-container-wide {
    width: min(var(--ab-container-wide, 1380px), calc(100% - (var(--ab-gutter-desktop, 32px) * 2))) !important;
    max-width: var(--ab-container-wide, 1380px) !important;
    margin-inline: auto !important;
    padding-inline: var(--ab-gutter-desktop, 32px) !important;
    box-sizing: border-box !important;
}

/* ——— STEP 5 FIX: Confidence section h3 contrast ——— */
/* Ensure h3 inside .ab-home-confidence uses ivory on dark bg */
.ab-home-confidence h3,
.ab-home-confidence__row-content h3 {
    color: #F5F1E8 !important;
}

/* ============================================
   FAQ VISUAL HIERARCHY IMPROVEMENTS
   ============================================ */

/* Homepage FAQ */
.ab-home-faq__header h2 {
    color: #F5F1E8;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 16px 0;
}

.ab-home-faq__intro {
    color: rgba(245, 241, 232, 0.72) !important;
}

.ab-home-faq__question {
    position: relative;
    padding-right: 32px;
    cursor: pointer;
}

.ab-home-faq__question::after {
    content: '+';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    color: #C9A45C;
    font-size: 24px;
    font-weight: 300;
    transition: transform 0.3s ease;
}

.ab-home-faq__question[open]::after {
    content: '−';
}

/* Pack Page FAQ */

/* === FINAL OVERRIDE: Force full-width on ast-right-sidebar === */
body.ast-right-sidebar.ab-full-width .ast-container,
body.ast-right-sidebar.ast-plain-container .ast-container {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
body.ast-right-sidebar.ab-full-width #primary,
body.ast-right-sidebar.ast-plain-container #primary,
body.ast-right-sidebar.ab-full-width .content-area,
body.ast-right-sidebar.ast-plain-container .content-area {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
    padding-right: 0 !important;
}
body.ast-right-sidebar.ab-full-width #secondary,
body.ast-right-sidebar.ast-plain-container #secondary {
    display: none !important;
}
