/*
 Theme Name:   ExpertHive Child - AZ Ed Vendors
 Theme URI:    https://azedvendors.com
 Description:  Child theme for ExpertHive — AZ Educational Vendors Directory
 Author:       Alex Bencomo
 Author URI:   https://azedvendors.com
 Template:     experthive
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  experthive-child
*/

/* ==========================================================================
   AZ Ed Vendors — Brand System
   ========================================================================== */

:root {
  /* French Clay palette */
  --terracotta: #C96A4A;
  --terracotta-hover: #B55D40;
  --warm-sand: #E7D3A8;
  --warm-sand-light: #F0E2C4;
  --desert-sage: #7F9C8C;
  --desert-sage-hover: #6B8A79;
  --charcoal: #333333;
  --porcelain: #F5E2D0;
  --terra: #C9B089;
  --sienna: #B66037;
  --rust: #933818;
  --umber: #611407;
  /* Functional */
  --bg-warm: #FAF6F1;
  --bg-white: #FFFFFF;
  --text-secondary: #6B6560;
  --text-light: #9A9389;
  --divider: #E8DFD4;
  --divider-light: #F0EAE2;
  /* Header nav — match approved mockup */
  --nav-link-inactive: #707070;
  --nav-link-active: #7F9C8C;
  /* Typography */
  --font-heading: 'Merriweather', Georgia, serif;
  --font-body: 'Inter', -apple-system, sans-serif;
  --font-nav: 'PT Sans', -apple-system, sans-serif;
  /* Sticky-header height in scrolled (compact) state — used as the
     offset for sticky sidebars so they tuck below the nav bar. */
  --azedv-header-offset: 88px;
}

/* ==========================================================================
   Global Typography Overrides
   ========================================================================== */

body {
  font-family: var(--font-body);
  color: var(--charcoal);
  background: var(--bg-warm);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--charcoal);
}

/* Navigation — ExpertHive/HivePress nav classes (inner page bars) */
.hp-page__header .hp-menu a,
.hp-page__header a,
.hp-page__header nav a {
  font-family: var(--font-nav);
}

/* ==========================================================================
   Site header — main bar (ExpertHive: .site-header / .header-navbar)
   Overrides Customizer primary teal + warm header background.
   ========================================================================== */

/* Parent theme wraps everything in .site-container with `overflow: hidden`,
   which creates a scroll container and breaks `position: sticky` on descendants.
   Switch to `overflow: clip` — same visual clipping, but does NOT establish
   a scroll container, so sticky works. */
.site-container {
  overflow: clip !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}

.site-header {
  background-color: #ffffff !important;
  border-top: none !important;
  border-bottom: none !important;
  /* No shadow at rest — the 1px edge read as a separate line above the hero */
  box-shadow: none !important;
  /* Sticky: follows the user down the page */
  position: sticky !important;
  top: 0;
  z-index: 100;
  /* Smooth morph into the compact/glass state on scroll */
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* When the WP admin bar is present (all logged-in users), offset the sticky
   header so it sits below the 32px admin bar instead of sliding behind it. */
body.admin-bar .site-header {
  top: 32px !important;
}

body.admin-bar {
  --azedv-header-offset: 120px;
}

@media screen and (max-width: 782px) {
  body.admin-bar .site-header {
    top: 46px !important;
  }
  body.admin-bar {
    --azedv-header-offset: 134px;
  }
}

/* ---- Scrolled state ----------------------------------------------------
   Triggered by JS (functions.php → azedv_sticky_header_scroll_class) once
   scrollY > 40. PAINT-ONLY: warm cream glass + soft shadow. This state must
   NEVER change geometry (height/min-height/padding/margins). The header is
   position:sticky, so any height delta between rest and scrolled shifts the
   document under the viewport; browser scroll anchoring then compensates
   scrollY back across the 40px threshold, the class flips again, and the
   page shakes/freezes in an infinite loop (client video 2026-06-18 — an 8px
   min-height delta oscillated scrollY 38↔46 every frame on every page).
   Navbar/logo geometry lives ONLY in the "Restructure header" block below
   and applies identically to both states — do not fork it per state. */
.site-header.site-header--scrolled {
  /* Warm porcelain — solid enough to read over content, no blur cost */
  background-color: rgba(255, 251, 245, 0.96) !important;
  box-shadow: 0 4px 16px rgba(97, 20, 7, 0.03) !important;
}

/* Respect reduced-motion: no morph animation, state switches instantly */
@media (prefers-reduced-motion: reduce) {
  .site-header,
  .site-header .custom-logo,
  .site-header .header-logo img,
  .site-header .header-navbar {
    transition: none !important;
  }
}

/* Deliverable 08 — residual hover flicker at the sticky-header / card collision
   point. Removing the old colliding nav bar fixed the major scroll lockup; what
   remained was a faint flutter: on a slow scroll the cursor sits exactly on the
   sticky header's bottom edge while a card's heart sweeps underneath, so the
   heart toggles :hover on alternating frames. Suspending pointer events on the
   listing cards *only while a scroll gesture is in flight* (the `azedv-scrolling`
   class is added on scroll and cleared 140ms after the last tick by
   azedv_sticky_header_scroll_class) removes the toggle at its root. Mouse-only:
   touch devices have no hover, and pointer-events must never gate touch-scroll. */
@media (hover: hover) {
  html.azedv-scrolling .azedv-card-v2,
  html.azedv-scrolling .azedv-card-v2 * {
    pointer-events: none !important;
  }
}

/* Remove grey strip between header and first section on all pages.
   Parent ExpertHive sets padding-top: 64px on .site-content; the body
   background shows through as a visible blank strip beneath the nav.
   Every page in this theme starts with either a full-bleed hero or its
   own top spacing, so we clear the parent's padding site-wide. */
.site-content {
  padding-top: 0 !important;
}

.site-header .header-navbar {
  border-bottom: none !important;
  /* Kill parent theme's dots.svg pattern — it sat subtly behind the logo */
  background-image: none !important;
  /* No geometry here: min-height/padding/align are owned by the
     "Restructure header" block below, state-independent by design —
     see the scrolled-state comment above. */
}

/* Logo: compact height like mockup (overrides Additional CSS max-width: 341px) */
.site-header .header-logo .custom-logo-link {
  display: inline-block;
  line-height: 0;
}

.site-header .custom-logo,
.site-header .header-logo img {
  height: auto !important;
  width: auto !important;
  max-height: 110px !important;
  max-width: 172px !important;
  margin-top: -25px !important;
  margin-bottom: -45px !important;
}

/* Primary nav text — inactive gray */
.site-header .header-navbar__menu > ul.menu > li > a,
.site-header .header-navbar__burger > ul.menu > li > a {
  font-family: var(--font-nav) !important;
  font-size: 0.9375rem !important;
  font-weight: 400 !important;
  color: var(--nav-link-inactive) !important;
  letter-spacing: 0.01em;
  text-decoration: none !important;
  padding: 0.35rem 0 !important;
  border-bottom: none !important;
  background: transparent !important;
  position: relative;
  transition: color 0.2s ease;
}

/* Nudge main nav links (Directory, Vendor Request, About, Sponsors) down 6px.
   Scoped to page-type menu items so Sign in / Get Started / user account stay put. */
.site-header .header-navbar__menu > ul.menu > li.menu-item-type-post_type > a,
.site-header .header-navbar__burger > ul.menu > li.menu-item-type-post_type > a {
  top: 6px;
}

/* Animated underline: slides in from center on hover */
.site-header .header-navbar__menu > ul.menu > li > a::after,
.site-header .header-navbar__burger > ul.menu > li > a::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0;
  height: 2px;
  background: var(--terracotta);
  transform: translateX(-50%);
  transition: width 0.28s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.site-header .header-navbar__menu > ul.menu > li > a:hover::after,
.site-header .header-navbar__menu > ul.menu > li > a:focus::after,
.site-header .header-navbar__burger > ul.menu > li > a:hover::after,
.site-header .header-navbar__burger > ul.menu > li > a:focus::after {
  width: 100%;
}

/* Current page: full-width underline locked in */
.site-header .header-navbar__menu > ul > li.current-menu-item > a::after,
.site-header .header-navbar__menu > ul > li.active > a::after,
.site-header .header-navbar__burger > ul > li.current-menu-item > a::after,
.site-header .header-navbar__burger > ul > li.active > a::after {
  width: 100%;
  background: var(--desert-sage);
}

.site-header .header-navbar__menu > ul.menu > li > a:hover,
.site-header .header-navbar__menu > ul.menu > li > a:focus,
.site-header .header-navbar__burger > ul.menu > li > a:hover,
.site-header .header-navbar__burger > ul.menu > li > a:focus {
  color: var(--nav-link-active) !important;
}

/* Current page: terracotta + underline (ExpertHive uses ::before accent — retint) */
.site-header .header-navbar__menu > ul > li.current-menu-item > a,
.site-header .header-navbar__menu > ul > li.active > a,
.site-header .header-navbar__burger > ul > li.current-menu-item > a,
.site-header .header-navbar__burger > ul > li.active > a {
  color: var(--nav-link-active) !important;
}

.site-header .header-navbar__menu > ul > li.current-menu-item::before,
.site-header .header-navbar__menu > ul > li.active::before,
.site-header .header-navbar__burger > ul > li.current-menu-item::before,
.site-header .header-navbar__burger > ul > li.active::before {
  background-color: var(--nav-link-active) !important;
}

/* Sign-in / HivePress items: keep readable, no teal hover */
.site-header .header-navbar__menu a.hp-menu__item,
.site-header .header-navbar__burger a.hp-menu__item {
  color: var(--nav-link-inactive) !important;
}

.site-header .header-navbar__menu a.hp-menu__item:hover,
.site-header .header-navbar__burger a.hp-menu__item:hover {
  color: var(--nav-link-active) !important;
}

.site-header .header-navbar__menu a.hp-menu__item i,
.site-header .header-navbar__burger a.hp-menu__item i {
  color: inherit !important;
}

/* Header CTAs — text-style to match clean bar (was solid “secondary” green) */
.site-header .header-navbar__actions .hp-menu.hp-menu--site-header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 1.5rem;
}

.site-header .header-navbar__actions .hp-menu__item--listing-submit.button,
.site-header .header-navbar__actions .hp-menu__item--request-submit {
  appearance: none !important;
  cursor: pointer !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--nav-link-inactive) !important;
  font-family: var(--font-nav) !important;
  font-size: 0.9375rem !important;
  font-weight: 400 !important;
  padding: 0.35rem 0 !important;
  margin: 0 !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
}

.site-header .header-navbar__actions .hp-menu__item--listing-submit.button:hover,
.site-header .header-navbar__actions .hp-menu__item--request-submit:hover {
  color: var(--nav-link-active) !important;
  background: transparent !important;
}

.site-header .header-navbar__actions .hp-menu__item i {
  color: inherit !important;
}

/* Burger icon — neutral */
.site-header .header-navbar__burger > a {
  color: var(--nav-link-inactive) !important;
}

.site-header .header-navbar__burger > a:hover {
  color: var(--nav-link-active) !important;
}

/* Primary button overrides — HivePress uses hp-button */
.hp-button,
.hp-button--primary,
button[type="submit"].hp-button {
  background: var(--terracotta) !important;
  border-color: var(--terracotta) !important;
  font-family: var(--font-nav) !important;
  color: #fff !important;
}

.hp-button:hover,
.hp-button--primary:hover {
  background: var(--terracotta-hover) !important;
  border-color: var(--terracotta-hover) !important;
}

/* Link colors */
a {
  color: var(--terracotta);
}
a:hover {
  color: var(--terracotta-hover);
}

/* ==========================================================================
   Header logo — non–site-header contexts (Customizer fallback)
   ========================================================================== */

.hp-page__header .custom-logo,
.site-logo img {
  max-width: 341px !important;
  height: auto !important;
  max-height: 160px;
}

/* ==========================================================================
   HOMEPAGE HERO
   ========================================================================== */

.hero-section {
  /* Warm Arizona homeschool learning scene. Overlay dropped ~20% so the photo
     reads through clearly, but kept strong enough that the charcoal (#333) copy
     in the center still meets WCAG AA contrast over typical image luminance. */
  background-color: var(--porcelain);
  background-image:
    linear-gradient(
      180deg,
      rgba(245, 226, 208, 0.78) 0%,
      rgba(245, 226, 208, 0.70) 100%
    ),
    url('/wp-content/uploads/2026/04/hero-az-learning.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  /* Fill the viewport minus the site header — hero is the full first screen */
  min-height: calc(100vh - 144px);
  padding: 2rem 2rem 2rem;
  text-align: center;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Organic blob — top-right abstract sand dune shape */
.hero-section::before {
  display: none;
}

/* Bottom divider hairline */
.hero-section::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--divider);
  z-index: 1;
}

/* Hero content: keep positioned so child stacking/positioning still works.
   No explicit z-index — the decorative ::before blob is display:none, and
   forcing a stacking context here traps the search form's dropdown menu
   below the home-feature-strip (z:10). */
.hero-section > .wp-block-group__inner-container,
.hero-section > * {
  position: relative;
}

/* Eyebrow uses Rust (#933818) for ~8:1 contrast on the cream overlay — AAA for normal text. */
.hero-eyebrow {
  font-family: var(--font-nav);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rust);
  margin-bottom: 0.4rem;
}

.hero-heading,
.hero-section h1 {
  font-family: var(--font-heading);
  font-size: 2.5rem;
  font-weight: 900;
  line-height: 1.15;
  color: var(--charcoal);
  margin-bottom: 0.4rem;
  /* No text-shadow: the cream overlay is strong enough to carry contrast on its own. */
}

.hero-heading em,
.hero-section h1 em {
  font-style: italic;
  color: var(--sienna); /* #B66037 — 4.3:1 on cream overlay, AA Large for the 2.5rem heading */
}

.hero-heading-accent,
.hero-section h1 .hero-heading-accent {
  font-style: italic;
  color: var(--sienna); /* #B66037 */
}

/* Sub-copy: compact single-line under heading */
.hero-sub {
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--charcoal);
  max-width: 620px;
  margin: 0 auto 0.6rem;
  font-weight: 400;
}

/* HivePress search form styling within hero */
.hero-section .hp-form--listing-search,
.hero-section .hp-form {
  max-width: 680px;
  margin: 0 auto 0.5rem;
  position: relative;
  z-index: 20;
}

.hero-section .hp-form--listing-search .hp-form__fields,
.hero-section .hp-form .hp-form__fields {
  display: flex;
  align-items: center;
  background: #ffffff;
  border: 2px solid var(--divider);
  height: 35px;
  overflow: visible;
  transition: border-color 0.2s;
}

.hero-section .hp-form--listing-search:focus-within .hp-form__fields,
.hero-section .hp-form:focus-within .hp-form__fields {
  border-color: var(--desert-sage);
}

.hero-section .hp-form input[type="text"],
.hero-section .hp-form input[type="search"] {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0 1rem 0 1.25rem;
  height: 100%;
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--charcoal);
  outline: none;
  box-shadow: none;
}

.hero-section .hp-form input::placeholder {
  color: var(--text-secondary);
  font-weight: 400;
  opacity: 1; /* Override Firefox default that dims placeholders */
}

.hero-section .hp-form button[type="submit"],
.hero-section .hp-form .hp-button {
  background: var(--desert-sage) !important;
  color: white !important;
  border: none !important;
  padding: 0 1.75rem;
  height: 100%;
  min-width: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-family: var(--font-nav) !important;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s;
  white-space: nowrap;
  border-radius: 0 !important;
  box-shadow: none !important;
  flex-shrink: 0;
}

.hero-section .hp-form button[type="submit"]::before,
.hero-section .hp-form button[type="submit"]::after,
.hero-section .hp-form button[type="submit"] span::before,
.hero-section .hp-form button[type="submit"] span::after,
.hero-section .hp-form .hp-button::before,
.hero-section .hp-form .hp-button::after,
.hero-section .hp-form .hp-button span::before,
.hero-section .hp-form .hp-button span::after,
.hero-section .hp-form button[type="submit"] i,
.hero-section .hp-form .hp-button i {
  display: none !important;
  content: none !important;
}

.hero-section .hp-form button[type="submit"]:hover,
.hero-section .hp-form .hp-button:hover {
  background: var(--desert-sage-hover) !important;
}

/* Stat line: charcoal at weight 500 for AA contrast (was text-light #9A9389, ~2.5:1 — failed AA). */
.hero-stat {
  font-size: 0.85rem;
  color: var(--charcoal);
  font-weight: 500;
  margin-bottom: 0.25rem;
}

.hero-stat strong {
  color: var(--rust);
  font-weight: 700;
}

/* ==========================================================================
   BROWSE BY CATEGORY SECTION (legacy — hidden, kept for parent theme compat)
   ========================================================================== */

.categories {
  padding: 4rem 2rem 3rem;
  max-width: 1200px;
  margin: 0 auto;
}

.section-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.section-header h2 {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--charcoal);
}

.section-header a {
  font-family: var(--font-nav);
  font-size: 0.85rem;
  color: var(--terracotta);
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s;
}

.section-header a:hover {
  border-bottom-color: var(--terracotta);
}

/* ==========================================================================
   FIND PROVIDERS BY CATEGORY — card grid (replaces legacy category section)
   ========================================================================== */

#azedv-find-providers {
  max-width: 900px;
  margin: 1.5rem auto 0;
  padding: 0;
}

.find-providers {
  padding: 1.5rem 1.75rem 1.25rem;
  background: rgba(255, 255, 255, 0.35);
  border-radius: 14px;
  border: 1px solid rgba(201, 176, 137, 0.2);
}

.find-providers__heading {
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--charcoal);
  text-align: center;
  margin-bottom: 1rem;
}

.find-providers__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.65rem;
}

.find-providers__card {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.75rem 0.75rem;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(201, 176, 137, 0.18);
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03);
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}

.find-providers__card:hover {
  border-color: var(--terra);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.05);
  transform: translateY(-1px);
}

.find-providers__icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cat-color, var(--charcoal));
  opacity: 0.95;
  margin-top: 0.1rem;
}

/* Per-category icon colors — 6 distinct hue families (blue / orange / pink /
   gold / plum / teal) so each category reads as its own thing at a glance.
   Same slugs are reused on the browse-page category pills so the eye carries
   section identity across homepage → directory navigation. */
.find-providers__card[data-slug="school"],
.browse-cats__item[data-slug="school"]       { --cat-color: #4A6485; } /* indigo dusk */
.find-providers__card[data-slug="tutor"],
.browse-cats__item[data-slug="tutor"]        { --cat-color: var(--terracotta, #C96A4A); }
.find-providers__card[data-slug="therapy"],
.browse-cats__item[data-slug="therapy"]      { --cat-color: #C97A8C; } /* desert bloom pink */
.find-providers__card[data-slug="assessment"],
.browse-cats__item[data-slug="assessment"]   { --cat-color: #A77B1F; } /* mustard gold */
.find-providers__card[data-slug="enrichment"],
.browse-cats__item[data-slug="enrichment"]   { --cat-color: #8B4A6B; } /* dusty plum */
.find-providers__card[data-slug="camps"],
.browse-cats__item[data-slug="camps"]        { --cat-color: #2D6E6E; } /* pacific teal */

.find-providers__icon svg {
  width: 24px;
  height: 24px;
}

.find-providers__text {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.find-providers__name {
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--charcoal);
  line-height: 1.3;
}

.find-providers__count {
  font-weight: 400;
  color: var(--cat-color, var(--text-secondary));
}

.find-providers__desc {
  font-family: var(--font-body);
  font-size: 0.72rem;
  color: var(--text-light);
  line-height: 1.4;
}

.find-providers__tagline {
  text-align: center;
  margin-top: 0.75rem;
  margin-bottom: 0;
  font-family: var(--font-body);
  font-size: 0.78rem;
  color: var(--text-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
}

/* ==========================================================================
   VENDOR CTA SECTION
   ========================================================================== */

.vendor-cta {
  background: var(--umber);
  padding: 4.5rem 2rem;
  text-align: center;
}

.vendor-cta-inner {
  max-width: 600px;
  margin: 0 auto;
}

.vendor-cta h2 {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--warm-sand);
  margin-bottom: 0.75rem;
}

.vendor-cta p {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--terra);
  margin-bottom: 2rem;
  font-weight: 300;
}

.vendor-cta-btn {
  display: inline-block;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--umber);
  background: var(--warm-sand);
  border: none;
  padding: 1rem 2.5rem;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s;
}

.vendor-cta-btn:hover {
  background: var(--porcelain);
  color: var(--umber);
}

/* ==========================================================================
   WHY FAMILIES TRUST THIS DIRECTORY — three-column trust bar under the hero
   ========================================================================== */

#azedv-family-trust {
  /* Full-bleed escape — breaks out of any parent max-width so the section runs edge to edge */
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  /* Warm-porcelain fade so it reads as a continuation of the hero, not a new module */
  background:
    linear-gradient(180deg, var(--porcelain) 0%, var(--bg-warm) 100%);
  border-bottom: 1px solid var(--divider);
}

.family-trust {
  max-width: 1100px;
  margin: 0 auto;
  padding: 3rem 2rem 3.25rem;
}

/* Heading with flanking hairlines — editorial, not pill-shaped */
.family-trust__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  margin: 0 auto 2.25rem;
  max-width: 780px;
}

.family-trust__heading::before,
.family-trust__heading::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--divider);
}

.family-trust__heading-text {
  font-family: var(--font-heading);
  font-size: 1.4rem;
  font-weight: 700;
  font-style: normal;
  color: var(--charcoal);
  letter-spacing: 0.01em;
  white-space: nowrap;
  /* Pill card around the heading — matches the reference's framed title */
  padding: 0.7rem 1.75rem;
  border: 1px solid var(--terra);
  border-radius: 999px;
  background: #FAF6F1;
  box-shadow: 0 1px 3px rgba(97, 20, 7, 0.05);
}

.family-trust__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

.family-trust__item {
  text-align: center;
  padding: 0.5rem 1.75rem;
  border-right: 1px solid var(--divider);
}

.family-trust__item:last-child {
  border-right: none;
}

.family-trust__icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 1.2rem;
  background: #FAF6F1;
  color: var(--terracotta);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Warm-toned lift — umber-tinted so the shadow stays within the Southwest palette */
  box-shadow:
    0 6px 14px rgba(97, 20, 7, 0.08),
    0 2px 4px rgba(97, 20, 7, 0.06);
}

.family-trust__icon svg,
.family-trust__icon img {
  display: block;
  width: 52px;
  height: 52px;
  object-fit: contain;
}

.family-trust__title {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 0.4rem;
  line-height: 1.3;
}

.family-trust__desc {
  font-family: var(--font-body);
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--text-secondary);
  font-weight: 400;
  margin: 0;
  max-width: 240px;
  margin-left: auto;
  margin-right: auto;
}

/* ==========================================================================
   SPONSORS & PARTNERS SECTION
   ========================================================================== */

.sponsors {
  max-width: 1200px;
  margin: 0 auto;
  padding: 5rem 2rem;
}

.sponsors-heading {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--charcoal);
  margin-bottom: 2rem;
}

.sponsors-category-label {
  font-family: var(--font-heading);
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: normal;
  text-transform: none;
  color: var(--desert-sage);
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--divider);
  margin-bottom: 1.5rem;
}

.sponsors-section {
  background: #fff;
  padding: 2rem 2.5rem;
  border-radius: 8px;
  margin-bottom: 2rem;
}

/* Linked tier card — the whole homepage tier is one click target for
   /learning-tools/ via the .sponsors-section__cardlink overlay (z-index 1).
   Placeholder "Become a..." tiles must NOT be raised above that overlay — they
   have no link of their own, so raising them swallows the click and goes
   nowhere (dead zone). REAL vendor tiles (.azedv-slot-listing) sit above the
   overlay with their own stretched link, which ALSO points to /learning-tools/
   — vendor detail pages are retired, so no tile links to a listing permalink. */
.sponsors-section--linked {
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.sponsors-section--linked:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(147, 56, 24, 0.10);
}
.sponsors-section--linked:hover .sponsors-category-label {
  color: var(--terracotta);
}
.sponsors-section__cardlink {
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  text-decoration: none;
}
.sponsors-section__cardlink:focus-visible {
  outline: 2px solid var(--terracotta);
  outline-offset: 2px;
}
.sponsors-section--linked .azedv-slot-listing {
  position: relative;
  z-index: 2;
}
.sponsors-section--linked .azedv-slot-listing .sponsor-name a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.sponsors-section-desc {
  font-size: 0.88rem;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-bottom: 1.5rem;
  font-weight: 300;
}

.sponsor-logo-placeholder {
  width: 48px;
  height: 48px;
  border-radius: 4px;
  border: 2px dashed var(--divider);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--terra);
}

.sponsor-item--placeholder .sponsor-name {
  color: var(--sienna);
}

.sponsor-item--placeholder .sponsor-desc {
  font-style: italic;
}

.sponsors-section:last-child {
  margin-bottom: 0;
}

.sponsors-divider {
  border: none;
  border-top: 1px solid var(--divider);
  margin: 2rem 0;
}

.sponsors-row {
  display: grid;
  gap: 2rem 1.5rem;
}

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

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

.sponsor-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: var(--bg-warm);
  border: 1px solid var(--divider);
  padding: 1rem 1.25rem;
}

.sponsor-logo {
  width: 48px;
  height: 48px;
  border-radius: 4px;
  object-fit: cover;
  flex-shrink: 0;
  display: block;
}

.sponsor-info {
  min-width: 0;
}

.sponsor-name {
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--charcoal);
  line-height: 1.3;
}

.sponsor-desc {
  font-size: 0.75rem;
  color: var(--text-secondary);
  line-height: 1.4;
  font-weight: 300;
  margin-top: 0.15rem;
}

/* Align Featured section copy with logo placeholder top */
.sponsors-section:first-of-type .sponsor-info {
  transform: translateY(6px);
}


/* ==========================================================================
   BROWSE VENDORS — Paid directory slot listings inside the 3-tier sponsor
   layout. Slot listings are server-filtered by category; placeholder cards
   always remain visible so the tier structure stays intact.
   ========================================================================== */

.azedv-lt-empty {
  font-size: 0.92rem;
  color: var(--text-secondary);
  text-align: center;
  padding: 1.5rem 1rem 0;
  margin: 0;
  font-style: italic;
}

.azedv-lt-empty a {
  color: var(--terracotta);
  font-weight: 600;
  text-decoration: underline;
  font-style: normal;
}


/* ==========================================================================
   LEARNING TOOLS PAGE — 3-tier curated vendor showcase
   ========================================================================== */

.learning-tools-page {
  max-width: 1400px;
  margin: 0 auto;
  padding: 2rem 2rem 6rem;
}

.learning-tools-page__apply {
  background: var(--porcelain, #F5E2D0);
  text-align: center;
  padding: 3rem 1.5rem;
  margin: 0 0 4rem;
}

.learning-tools-page__apply-title {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--charcoal);
  margin: 0 0 0.75rem;
}

.learning-tools-page__apply-sub {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--text-secondary);
  font-weight: 300;
  margin: 0 0 1.75rem;
}

.learning-tools-page__apply-btn {
  display: inline-block;
  background: var(--terracotta, #C96A4A);
  color: #fff;
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1;
  padding: 1rem 2rem;
  border-radius: 6px;
  text-decoration: none;
  transition: background 0.2s ease;
}

.learning-tools-page__apply-btn:hover,
.learning-tools-page__apply-btn:focus {
  background: var(--sienna, #B66037);
  color: #fff;
  text-decoration: none;
}

/* Intro header between apply block and grid */
.learning-tools-page__intro {
  text-align: center;
  max-width: 820px;
  margin: 0 auto 3rem;
  padding: 0 1rem;
}

.learning-tools-page__intro-title {
  font-family: var(--font-heading);
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--charcoal);
  margin: 0 0 1rem;
}

.learning-tools-page__intro-sub {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--text-secondary);
  font-weight: 300;
  margin: 0;
}

/* Flat alphabetical grid — 3 cards across, no sections, unlimited scroll */
.learning-tools-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem 2rem;
}

/* Bigger editorial cards: logo + name header row, description, Learn More CTA.
   No drop shadows or rounded pills — warm sand bg, thin border, textual CTA. */
.learning-tools-grid .sponsor-item.learning-tool-card {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1.15rem;
  background: var(--bg-warm, #F9F3E7);
  border: 1px solid var(--divider);
  padding: 1.75rem 1.75rem 1.5rem;
  min-height: 280px;
}

.learning-tools-grid .learning-tool-card__header {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  width: 100%;
  min-width: 0;
}

.learning-tools-grid .learning-tool-card .sponsor-logo-placeholder {
  width: 72px;
  height: 72px;
  flex: 0 0 72px;
  border-radius: 6px;
  border: 2px dashed var(--divider);
  background: #fff;
  padding: 8px;
}

.learning-tools-grid .learning-tool-card .sponsor-logo-placeholder img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.learning-tools-grid .learning-tool-card__heading {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.learning-tools-grid .learning-tool-card__label {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--sage, #7F9C8C);
  margin: 0;
  line-height: 1.3;
}

/* Real-listing cards: tier label shrinks to an eyebrow above the tool name. */
.learning-tools-grid .learning-tool-card__heading .learning-tool-card__label {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
}

.learning-tools-grid .learning-tool-card__title {
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text-primary, #333333);
  margin: 0;
  line-height: 1.3;
}

.learning-tools-grid .learning-tool-card .sponsor-desc {
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-style: normal;
  color: var(--text-secondary);
  line-height: 1.55;
  font-weight: 400;
  margin: 0;
}

.learning-tools-grid .learning-tool-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: auto;
  align-self: flex-start;
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--terracotta, #C96A4A);
  text-decoration: none;
  padding: 0.55rem 1rem;
  border: 1px solid var(--terracotta, #C96A4A);
  border-radius: 4px;
  background: transparent;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.learning-tools-grid .learning-tool-card__cta:hover,
.learning-tools-grid .learning-tool-card__cta:focus {
  background: var(--terracotta, #C96A4A);
  color: #fff;
  border-color: var(--terracotta, #C96A4A);
  text-decoration: none;
}

.learning-tools-grid .learning-tool-card__cta--placeholder {
  color: var(--sienna, #B66037);
  border-color: rgba(182, 96, 55, 0.35);
  border-style: dashed;
  background: rgba(245, 226, 208, 0.45);
  cursor: default;
  font-style: italic;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.learning-tools-grid .learning-tool-card__cta--placeholder:hover,
.learning-tools-grid .learning-tool-card__cta--placeholder:focus {
  background: rgba(245, 226, 208, 0.45);
  color: var(--sienna, #B66037);
  border-color: rgba(182, 96, 55, 0.35);
}


/* Tablet */
@media (max-width: 900px) {
  .learning-tools-page {
    padding: 1.5rem 1.5rem 4rem;
  }
  .learning-tools-page__apply {
    padding: 2.5rem 1.25rem;
    margin-bottom: 3rem;
  }
  .learning-tools-page__apply-title {
    font-size: 1.5rem;
  }
  .learning-tools-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .learning-tools-page {
    padding: 2rem 1rem 3rem;
  }
  .learning-tools-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }
}

/* ==========================================================================
   HOW IT WORKS SECTION
   ========================================================================== */

.how-it-works {
  padding: 5rem 2rem;
  max-width: 1200px;
  margin: 0 auto;
}

.how-it-works h2 {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--charcoal);
  margin-bottom: 3rem;
}

.steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid var(--divider);
  background: var(--bg-white);
}

.step {
  padding: 2.5rem 2rem;
  border-right: 1px solid var(--divider);
  position: relative;
}

.step:last-child {
  border-right: none;
}

.step-number {
  font-family: var(--font-heading);
  font-size: 2.5rem;
  font-weight: 900;
  color: var(--porcelain);
  line-height: 1;
  margin-bottom: 1rem;
}

.step h3 {
  font-family: var(--font-nav);
  font-size: 1rem;
  font-weight: 700;
  color: var(--charcoal);
  margin-bottom: 0.5rem;
}

.step p {
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--text-secondary);
  font-weight: 300;
}

/* ==========================================================================
   TRUST BAR SECTION
   ========================================================================== */

section.trust-bar {
  display: none !important;
}

section.trust-bar .trust-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 0;
}

section.trust-bar .trust-item {
  text-align: center !important;
  padding: 0 2rem;
  border-right: 1px solid var(--divider);
}

section.trust-bar .trust-item:last-child {
  border-right: none;
}

section.trust-bar .trust-icon {
  margin-bottom: 0.75rem;
  color: var(--desert-sage);
  display: flex !important;
  justify-content: center;
  align-items: center;
}

section.trust-bar .trust-icon svg {
  width: 28px;
  height: 28px;
}

section.trust-bar .trust-item h3 {
  font-family: var(--font-nav) !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--charcoal) !important;
  margin-bottom: 0.35rem;
}

section.trust-bar .trust-item p {
  font-size: 0.85rem !important;
  line-height: 1.5;
  color: var(--text-light) !important;
  font-weight: 300;
}

/* ==========================================================================
   DIRECTORY RESULTS — LIST VIEW (SRCH-07)
   ========================================================================== */

/* Force single-column layout — override HivePress grid */
.hp-listings .hp-row,
.hp-listings .hp-grid {
  display: block;
}

.hp-listings .hp-grid__item {
  width: 100% !important;
  padding: 0;
  max-width: 100%;
}

/* Directory scroll — "Fixed Long Scrolling" pattern (UXPin):
   filter sidebar sticks below the header, listings flow naturally with
   the page. Single page-level scroll context — no captive panels, no
   cursor-context jumping between left/right. Mobile (<769px) keeps the
   linear stack. */
@media (min-width: 769px) {
  /* Tighten vertical rhythm above the panel so 4 cards fit above the fold */
  .hp-page__header { margin-bottom: 0.75rem !important; }
  .hp-page__topbar { padding: 0.35rem 0 0.75rem !important; margin-bottom: 0 !important; }

  /* Sticky filter sidebar. align-self: start prevents the flex/grid row
     from stretching the column to the listings' full height (which
     would defeat position: sticky). overscroll-behavior: auto lets the
     wheel chain to the page once the sidebar reaches its scroll edge —
     no more "trapped" cursor on the filters. */
  .hp-page__sidebar {
    position: sticky;
    top: calc(var(--azedv-header-offset) + 16px);
    max-height: calc(100vh - var(--azedv-header-offset) - 32px);
    overflow-y: auto;
    overscroll-behavior: auto;
    align-self: start;
  }

  .hp-page__sidebar::-webkit-scrollbar { width: 6px; }
  .hp-page__sidebar::-webkit-scrollbar-track { background: transparent; }
  .hp-page__sidebar::-webkit-scrollbar-thumb { background: var(--divider-light); border-radius: 4px; }
  .hp-page__sidebar::-webkit-scrollbar-thumb:hover { background: var(--terracotta); }
}

/* Vendor card: 2-col grid  [logo | title]
                            [logo | meta ]
                            [   footer   ] */
.hp-listing--view-block {
  display: grid !important;
  grid-template-columns: 40px 1fr;
  grid-template-rows: auto auto auto;
  gap: 0.05rem 0.85rem;
  padding: 0.35rem 1rem !important;
  border-bottom: 1px solid var(--divider-light) !important;
  border-left: none !important;
  border-top: none !important;
  border-right: none !important;
  background: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
  align-items: start;
  transition: background 0.15s;
}

.hp-listing--view-block:hover {
  background: rgba(245, 237, 224, 0.55) !important;
}

/* Logo: top-left, 64x64 rounded square */
.hp-listing--view-block .hp-listing__header,
.hp-listing--view-block .hp-listing__image {
  display: block !important;
  grid-column: 1;
  grid-row: 1 / span 2;
  margin: 0;
  padding: 0;
}

.hp-listing--view-block .hp-listing__image a {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--porcelain);
  border: 1px solid var(--divider-light);
}

.hp-listing--view-block .hp-listing__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Flatten .hp-listing__content so its children become direct grid children */
.hp-listing--view-block .hp-listing__content {
  display: contents;
}

/* Title: row 1, col 2  (heading font) */
.hp-listing--view-block .hp-listing__title {
  grid-column: 2;
  grid-row: 1;
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.hp-listing--view-block .hp-listing__title a {
  text-decoration: none;
  color: inherit;
}

.hp-listing--view-block:hover .hp-listing__title a {
  color: var(--terracotta);
}

.hp-listing--view-block .hp-listing__featured-badge,
.hp-listing--view-block .hp-listing__featured-badge i {
  font-size: 0.8rem;
  color: var(--terracotta);
}

/* Descriptor: row 2, col 2 (small category line) */
.hp-listing--view-block .hp-listing__details--primary {
  grid-column: 2;
  grid-row: 2;
  font-size: 0.78rem;
  color: var(--text-light);
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.6rem;
  align-items: center;
  line-height: 1.25;
}

.hp-listing--view-block .hp-listing__details--primary > div {
  display: inline-flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}

/* Email moves to the action bar; hide it from the descriptor line */
.hp-listing--view-block .hp-listing__vendor {
  display: none !important;
}

.hp-listing--view-block .hp-listing__categories a,
.hp-listing--view-block .hp-listing__category a {
  font-family: var(--font-nav);
  font-size: 0.8rem;
  color: var(--desert-sage);
  font-weight: 600;
  text-decoration: none;
}

.hp-listing--view-block .hp-listing__categories a:hover {
  color: var(--desert-sage-hover);
}

.hp-listing--view-block .hp-listing__attributes--secondary {
  display: none !important;
}

/* Footer: full-width action bar, indented under the content column */
.hp-listing--view-block .hp-listing__footer {
  grid-column: 1 / -1;
  margin-top: 0.1rem;
  padding-top: 0.2rem;
  padding-left: calc(40px + 0.85rem);
  border-top: 1px dashed var(--divider-light);
}

.hp-listing--view-block .hp-listing__attributes--primary {
  display: none !important;
}

.hp-listing--view-block .hp-listing__actions {
  font-family: var(--font-nav);
  font-size: 0.85rem;
  display: flex;
  gap: 0.7rem;
  align-items: center;
}

/* Action icon buttons: website, email, phone, heart (+50% from the 26px baseline) */
.hp-listing--view-block .hp-listing__action {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 39px;
  height: 39px;
  border: 1px solid var(--divider-light);
  border-radius: 5px;
  background: transparent;
  color: var(--text-light);
  text-decoration: none;
  transition: all 0.15s;
}

.hp-listing--view-block .hp-listing__action i {
  font-size: 1.17rem;
  color: inherit !important;
  transition: color 0.15s;
}

.hp-listing--view-block .hp-listing__action:hover {
  border-color: var(--terracotta);
  color: var(--terracotta);
  background: rgba(201, 106, 74, 0.05);
}

.hp-listing--view-block .hp-listing__action:hover i {
  color: var(--terracotta);
}

/* Hide HivePress message modal/trigger (placed AFTER the general rule so it
   wins on source order — both selectors have the same specificity). */
.hp-listing--view-block .hp-listing__action.hp-listing__action--message,
.hp-listing--view-block .hp-modal {
  display: none !important;
}

/* Favorite: terracotta when active */
.hp-listing--view-block .hp-listing__action--favorite.hp-active,
.hp-listing--view-block .hp-listing__action--favorite.hp-active i {
  color: var(--terracotta);
  border-color: var(--terracotta);
}

/* Placeholder icons (website/phone when no data wired up yet) */
.hp-listing--view-block .hp-listing__action.azedv-action-placeholder {
  opacity: 0.4;
  cursor: default;
}

.hp-listing--view-block .hp-listing__action.azedv-action-placeholder:hover {
  border-color: var(--divider-light);
  color: var(--text-light);
  background: transparent;
}

.hp-listing--view-block .hp-listing__action.azedv-action-placeholder:hover i {
  color: var(--text-light);
}

/* Mobile: natural page scroll, tighter card */
@media (max-width: 768px) {
  .hp-listings {
    max-height: none;
    min-height: 0;
    overflow: visible;
  }

  .hp-listing--view-block {
    grid-template-columns: 48px 1fr;
    padding: 1rem 0.75rem !important;
  }

  .hp-listing--view-block .hp-listing__image a {
    width: 48px;
    height: 48px;
  }

  .hp-listing--view-block .hp-listing__title {
    font-size: 1.05rem;
  }

  .hp-listing--view-block .hp-listing__footer {
    padding-left: calc(48px + 1rem);
  }
}

/* ==========================================================================
   DIRECTORY RESULTS — CARD V2 (client-approved mockup, 2026-04-21)
   Overrides the list-view styles above with rounded warm-sand cards.
   Layout per card:  [logo]  [content]  [actions+signup]
                     [            claim / contact                  ]
   ========================================================================== */

/* Let the real listings flow — no internal scroller, no hidden overflow. */
@media (min-width: 769px) {
  .hp-listings {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding-right: 0 !important;
    background: transparent;
  }
}

/* Result count + sort bar (HivePress native) — reformatted to match mockup */
.hp-page__topbar {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  padding: 0 0 1.25rem !important;
  margin-bottom: 0.5rem !important;
  border-bottom: none !important;
}

.hp-page__topbar .hp-result-count {
  font-family: var(--font-heading) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.hp-page__topbar .hp-form--listing-sort .hp-field__label,
.hp-page__topbar .hp-form--listing-sort .hp-field__label span {
  font-family: var(--font-heading) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--charcoal) !important;
  margin-right: 0.35rem !important;
  margin-bottom: 0 !important;
}

.hp-page__topbar .hp-form--listing-sort .select2-selection {
  background: transparent;
  border: none;
  padding: 0;
}

.hp-page__topbar .hp-form--listing-sort .select2-selection__rendered {
  color: var(--charcoal);
  font-family: var(--font-body);
  font-size: 0.95rem;
}

/* Card container */
.azedv-card-v2.hp-listing--view-block {
  display: grid !important;
  grid-template-columns: 88px 1fr auto !important;
  grid-template-rows: auto auto !important;
  grid-template-areas:
    "logo content right"
    "bottom bottom bottom" !important;
  gap: 0 22px !important;
  background: #FFFFFF !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 22px 24px !important;
  margin: 0 0 18px 0 !important;
  box-shadow: 0 1px 1px rgba(97, 20, 7, 0.04) !important;
  transition: box-shadow 0.15s, transform 0.15s;
}

.azedv-card-v2.hp-listing--view-block:hover {
  background: #FFFFFF !important;
  box-shadow: 0 3px 10px rgba(97, 20, 7, 0.08) !important;
}

/* Reset the featured-listing left-accent treatment inside v2 cards */
.azedv-card-v2.hp-listing--view-block,
.azedv-card-v2.hp-listing--view-block:hover,
.azedv-card-v2.hp-listing--view-block:has(.hp-listing__featured-badge) {
  border-left: none !important;
  padding-left: 24px !important;
}

/* Logo */
.azedv-card-v2 .hp-listing__header,
.azedv-card-v2 .hp-listing__image {
  grid-area: logo !important;
  grid-column: unset !important;
  grid-row: unset !important;
  width: 88px !important;
  height: 88px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.azedv-card-v2 .hp-listing__image a {
  width: 88px !important;
  height: 88px !important;
  border-radius: 10px !important;
  border: none !important;
  background: #EFD9B6;
  overflow: hidden;
  display: block;
  position: relative;
}

.azedv-card-v2 .hp-listing__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

.azedv-card-v2 .azedv-v2-logo-svg {
  position: absolute;
  inset: 0;
  display: block;
}

.azedv-card-v2 .azedv-v2-logo-svg svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* Basic-tier cards: no uploaded logo; show first-initial monogram on a
   warm-sand tile so the row still feels balanced next to premium cards. */
.azedv-card-v2--basic .hp-listing__image a {
  background: #F1E4CC !important;
  border: 1px solid rgba(97, 20, 7, 0.10) !important;
}

.azedv-card-v2 .azedv-v2-monogram {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 2.25rem;
  color: var(--charcoal);
  letter-spacing: 0;
  line-height: 1;
  user-select: none;
}

/* Content column */
.azedv-card-v2 .hp-listing__content {
  grid-area: content !important;
  display: block !important;
  min-width: 0;
}

.azedv-card-v2 .hp-listing__title {
  grid-column: unset !important;
  grid-row: unset !important;
  font-family: var(--font-heading) !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  margin: 0 0 3px 0 !important;
  line-height: 1.2;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.azedv-card-v2 .hp-listing__title a {
  color: var(--charcoal) !important;
  text-decoration: none;
}

.azedv-card-v2:hover .hp-listing__title a {
  color: var(--charcoal) !important;
}

/* Category line: "Tutoring · Reading Support" — identity block + bullets
   sit side-by-side via flex; cats and location stack tightly on the left. */
.azedv-card-v2 .hp-listing__details--primary {
  grid-column: unset !important;
  grid-row: unset !important;
  display: block !important;
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--charcoal);
  line-height: 1.45;
  padding: 0;
  margin: 0;
}

/* Force block-level on our custom children — parent theme's inline-flex
   would otherwise collapse them all onto a single inline row. */
.azedv-card-v2 .azedv-v2-identity-row,
.azedv-card-v2 .azedv-v2-identity,
.azedv-card-v2 .azedv-v2-location,
.azedv-card-v2 .azedv-v2-tags,
.azedv-card-v2 .azedv-v2-desc {
  display: block !important;
}

.azedv-card-v2 .azedv-v2-identity-row {
  display: flex !important;
  align-items: flex-start;
  gap: 0 !important;
  margin: 0 0 10px 0;
  flex-wrap: wrap;
}

/* Suppress a stray decorative dot the hivetheme PARENT theme leaks onto this
   flex row via `::after` (a 4px circle, border-radius:50%, the theme's navy
   rgba(7,36,86,.25) — not a brand color). It dangles at the end of the
   specialty line ("Enrichment · Martial Arts ·") because the element it would
   precede, .azedv-v2-bullets, is display:none on basic cards (see below). Our
   real tag separator is the "·" keyed on > *:not(:first-child)::before; this
   only kills the orphaned parent-theme pseudo. */
.azedv-card-v2 .azedv-v2-identity-row::after {
  content: none !important;
}

/* Identity (category + location) takes only its content width so the
   bullets list sits flush beside it instead of being pushed to the far
   right of the content column. */
.azedv-card-v2 .azedv-v2-identity {
  flex: 0 1 auto;
  min-width: 0;
}

/* Strip any trailing separator the parent theme may add after categories. */
.azedv-card-v2 .hp-listing__categories::after,
.azedv-card-v2 .hp-listing__category::after {
  content: none !important;
  display: none !important;
}
.azedv-card-v2 .hp-listing__categories a:last-child::after,
.azedv-card-v2 .hp-listing__category a:last-child::after {
  content: none !important;
  display: none !important;
}

/* Parent theme uppercases listing meta; force normal case in v2 cards. */
.azedv-card-v2 .hp-listing__details--primary,
.azedv-card-v2 .hp-listing__details--primary > div,
.azedv-card-v2 .hp-listing__details--primary > ul,
.azedv-card-v2 .hp-listing__details--primary > ul > li,
.azedv-card-v2 .hp-listing__categories,
.azedv-card-v2 .hp-listing__category,
.azedv-card-v2 .hp-listing__categories a,
.azedv-card-v2 .hp-listing__category a,
.azedv-card-v2 .azedv-v2-location,
.azedv-card-v2 .azedv-v2-bullets,
.azedv-card-v2 .azedv-v2-bullets li,
.azedv-card-v2 .azedv-v2-tags,
.azedv-card-v2 .azedv-v2-pay,
.azedv-card-v2 .azedv-v2-desc,
.azedv-card-v2 .azedv-v2-bottom,
.azedv-card-v2 .azedv-v2-verified,
.azedv-card-v2 .azedv-v2-claim,
.azedv-card-v2 .azedv-v2-upgrade,
.azedv-card-v2 .azedv-v2-contact {
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* Bullets column — sits in identity row beside cats+loc.
   Uses margin-left (not flex gap) because the parent HivePress theme sets
   a small `gap` on `.hp-listing__details--primary` children that overrides
   our gap declaration. margin-left on the bullets itself is reliable. */
.azedv-card-v2 .azedv-v2-bullets {
  display: block !important;
  flex: 0 0 auto;
  margin: 0 0 0 50px !important;
  white-space: nowrap;
}
.azedv-card-v2 .azedv-v2-bullets li {
  display: list-item !important;
  width: auto !important;
}

.azedv-card-v2 .hp-listing__categories {
  display: inline-flex !important;
  flex-wrap: wrap;
  gap: 0 !important;
  font-size: 0.95rem;
  color: #6B6560;
  margin: 0 0 1px 0;
}

.azedv-card-v2 .hp-listing__categories a,
.azedv-card-v2 .hp-listing__category a {
  font-family: var(--font-body) !important;
  font-size: 0.95rem !important;
  color: #6B6560 !important;
  font-weight: 400 !important;
  text-decoration: none !important;
}

/* Separator between category tags. Keyed on child position rather than element
   type so it survives the static-span conversion in
   azedv_display_only_listing_category_tags(): after de-linking, the tags render
   as <span class="azedv-category-tag"> and the old `a + a` selector no longer
   matched — collapsing the labels into one run-on string (e.g.
   "Co-opEnrichmentEnrichment Program..."). */
.azedv-card-v2 .hp-listing__categories > *:not(:first-child)::before,
.azedv-card-v2 .hp-listing__category > *:not(:first-child)::before {
  content: "·";
  padding: 0 6px;
  color: #6B6560;
}

.azedv-card-v2 .hp-listing__categories a:hover {
  color: var(--terracotta) !important;
}

.azedv-card-v2 .azedv-v2-location {
  font-family: var(--font-body);
  font-size: 0.92rem;
  color: #6B6560;
  margin: 0 0 10px 0;
}

/* "+N more" city-list toggle on multi-city cards (Melissa 7-07): a real
   button — not a hover tooltip — so it works on touch. Styled after the
   .azedv-v2-see-more idiom; !important guards beat the parent theme's
   button/uppercase rules. */
.azedv-card-v2 .azedv-v2-loc-more {
  display: inline-block;
  margin: 0;
  padding: 0 2px !important;
  border: none !important;
  background: none !important;
  font-family: var(--font-body) !important;
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  color: var(--terracotta, #C06E52) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  line-height: inherit;
}
.azedv-card-v2 .azedv-v2-loc-more:hover,
.azedv-card-v2 .azedv-v2-loc-more:focus {
  color: var(--charcoal, #3E3A36) !important;
}

.azedv-card-v2 .azedv-v2-tags {
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--charcoal);
  font-weight: 500;
  margin: 0 0 9px 0;
  display: flex !important;
  white-space: nowrap;
  overflow: hidden;
}

.azedv-card-v2 .azedv-v2-tag-dot {
  padding: 0 7px;
  color: var(--desert-sage);
  font-weight: 700;
}

.azedv-card-v2 .azedv-v2-desc {
  font-family: var(--font-body);
  font-size: 0.92rem;
  color: var(--charcoal);
  line-height: 1.45;
  max-width: 46ch;
}

/* Right column: full contact-icon bar (FB, IG, email, phone, globe, heart, flag) */
.azedv-card-v2 .azedv-v2-right {
  grid-area: right !important;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.azedv-card-v2 .azedv-v2-actions {
  display: flex;
  gap: 2px;
  align-items: center;
}

.azedv-card-v2 .azedv-v2-actions .azedv-ci.is-active {
  color: var(--terracotta);
  background: rgba(201, 106, 74, 0.10);
}

/* Bullets list ("Dyslexia specialist", "Grades 2-6") */
.azedv-card-v2 .azedv-v2-bullets {
  list-style: disc;
  padding-left: 1.2rem;
  margin: 6px 0 10px;
  font-family: var(--font-body);
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--charcoal);
}
.azedv-card-v2 .azedv-v2-bullets li { margin: 0; }

/* Payment badges inline in the tags row */
.azedv-card-v2 .azedv-v2-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
}
.azedv-card-v2 .azedv-v2-pay {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-weight: 500;
  color: var(--charcoal);
}
.azedv-card-v2 .azedv-v2-pay svg { flex-shrink: 0; }
.azedv-card-v2 .azedv-v2-pay--cw svg { color: #1877F2; }
.azedv-card-v2 .azedv-v2-pay--cw svg path { fill: #1877F2; }
.azedv-card-v2 .azedv-v2-pay--dc svg { color: #5A8D75; }

/* Bottom row: Claim Listing / Contact Provider. (.azedv-v2-verified rules
   below stay — the vendor dashboard cards reuse them.) */
.azedv-card-v2 .azedv-v2-bottom {
  grid-area: bottom !important;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(51, 51, 51, 0.10);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  font-family: var(--font-body);
  font-size: 0.9rem;
}

.azedv-card-v2 .azedv-v2-bottom__left {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  justify-self: start;
}

/* Contact Provider pill — deep forest green, centered in bottom row */
.azedv-card-v2 .azedv-v2-contact {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 26px;
  background: #1F3A1F;
  color: #FFFFFF !important;
  border-radius: 999px;
  text-decoration: none !important;
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  white-space: nowrap;
  transition: background 0.15s ease, transform 0.15s ease;
}
.azedv-card-v2 .azedv-v2-contact svg { color: #E8B93B; }
.azedv-card-v2 .azedv-v2-contact:hover {
  background: #16301B;
  color: #FFFFFF !important;
  transform: translateY(-1px);
}

.azedv-card-v2 .azedv-v2-verified {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--charcoal);
  font-weight: 500;
}

.azedv-card-v2 .azedv-v2-check {
  color: var(--desert-sage);
  display: inline-flex;
  align-items: center;
}

/* Unclaimed state on the PUBLIC card (ISS-2) — the unscoped mirror of the
   dashboard's muted badge at `body.azedv-account-wide .azedv-v2-verified--no`,
   so browse-vendors and the parent portal get it too. Same class, different
   word: public surfaces label this state "Claim Listing", the dashboard labels
   it "Unverified" (see injectBottomRow in functions.php).

   Alex, 25 Jul: the public "Claim Listing" state goes BACK to an outlined
   rectangle around the copy, and the hollow-circle glyph goes away. That
   reverses the note that used to live here (Verified and Claim Listing are two
   states of ONE badge, so don't let a border make the unverified half the
   loudest thing in a row parents read). He has seen both and prefers the box —
   it's the same treatment the dashboard's Edit Listing link still wears
   (.azedv-v2-claim), so the two read as one family. Still an outline, not a
   filled pill: charcoal border, colour held back until hover.

   ONLY the public <a> is boxed. The dashboard's "Unverified" renders as a
   passive <span> with no .azedv-v2-verified--link, so it keeps the muted
   icon-and-text treatment untouched — Alex asked for it to stay as-is. */
.azedv-card-v2 .azedv-v2-verified--no {
  color: #8a8a8a !important;
  text-decoration: none !important;
  font-weight: 500;
}
.azedv-card-v2 .azedv-v2-verified--no .azedv-v2-check--muted {
  color: #b5b5b5;
}
.azedv-card-v2 .azedv-v2-verified--no .azedv-v2-check--muted svg {
  width: 14px;
  height: 14px;
}

/* Only the <a> form is interactive — the dashboard renders the same badge as a
   passive <span>, so every rule below is keyed on .azedv-v2-verified--link and
   the passive one can never match. */
.azedv-card-v2 a.azedv-v2-verified--link {
  padding: 4px 10px !important;
  border: 1.5px solid var(--charcoal) !important;
  border-radius: 2px !important;
  line-height: 1.2 !important;
  color: var(--charcoal) !important;
  transition: color 0.15s ease, border-color 0.15s ease;
}
/* The box IS the affordance now — the glyph would just crowd it. */
.azedv-card-v2 a.azedv-v2-verified--link .azedv-v2-check--muted {
  display: none !important;
}
.azedv-card-v2 a.azedv-v2-verified--link:hover,
.azedv-card-v2 a.azedv-v2-verified--link:focus-visible {
  color: var(--terracotta) !important;
  border-color: var(--terracotta) !important;
  text-decoration: none !important;
}
.azedv-card-v2 a.azedv-v2-verified--link:focus-visible {
  outline: 2px solid var(--terracotta);
  outline-offset: 3px;
}

.azedv-card-v2 .azedv-v2-claim,
.azedv-card-v2 .azedv-v2-upgrade {
  color: var(--charcoal) !important;
  text-decoration: none !important;
  font-weight: 500;
}

/* Claim Listing gets a thin outlined box (matches mockup) */
.azedv-card-v2 .azedv-v2-claim {
  padding: 4px 10px;
  border: 1.5px solid var(--charcoal);
  border-radius: 2px;
  line-height: 1.2;
}

.azedv-card-v2 .azedv-v2-claim:hover {
  color: var(--terracotta) !important;
  border-color: var(--terracotta);
}

.azedv-card-v2 .azedv-v2-upgrade:hover {
  color: var(--terracotta) !important;
}

/* Hide the original HivePress footer (message modal + legacy action bar) */
.azedv-card-v2 .hp-listing__footer {
  display: none !important;
}

.azedv-card-v2 .hp-listing__vendor,
.azedv-card-v2 .hp-listing__featured-badge {
  display: none !important;
}

/* ==========================================================================
   BASIC TIER: stripped-down card — no logo, no bullets, no social/contact
   icons, no Contact Provider pill, text-only payment badges. Only website,
   heart, and flag in the right column; only Claim Listing below.
   ========================================================================== */

/* Collapse the logo column — basic tier shows no image or monogram at all */
.azedv-card-v2--basic.hp-listing--view-block {
  grid-template-columns: 1fr auto !important;
  grid-template-areas:
    "content right"
    "bottom bottom" !important;
}

.azedv-card-v2--basic .hp-listing__header,
.azedv-card-v2--basic .hp-listing__image {
  display: none !important;
}

/* Hide the "Dyslexia specialist / Grades 2-6" bullets */
.azedv-card-v2--basic .azedv-v2-bullets {
  display: none !important;
}

/* Payment badges: text-only with neutral dots, no icons */
.azedv-card-v2--basic .azedv-v2-pay svg {
  display: none !important;
}

.azedv-card-v2--basic .azedv-v2-pay {
  gap: 0;
}

.azedv-card-v2--basic .azedv-v2-tag-dot {
  color: #6B6560;
  font-weight: 400;
}

/* Right column: hide social (FB/IG) entirely; keep email/phone/web visible
   but greyed out as inactive placeholders. Heart + flag remain interactive
   so parents can still save and report listings. The contact icons activate
   once a vendor pays and claims their listing. */
.azedv-card-v2--basic .azedv-ci--fb,
.azedv-card-v2--basic .azedv-ci--ig {
  display: none !important;
}

.azedv-card-v2--basic .azedv-ci--email,
.azedv-card-v2--basic .azedv-ci--phone,
.azedv-card-v2--basic .azedv-ci--web {
  color: #B5AFA8 !important;
  opacity: 0.55;
  cursor: default !important;
  pointer-events: none;
}

.azedv-card-v2--basic .azedv-ci--email:hover,
.azedv-card-v2--basic .azedv-ci--phone:hover,
.azedv-card-v2--basic .azedv-ci--web:hover {
  background: transparent !important;
  color: #B5AFA8 !important;
}

/* Bottom row: drop the center Contact Provider pill, leave 2 columns */
.azedv-card-v2--basic .azedv-v2-bottom {
  grid-template-columns: 1fr auto !important;
}

.azedv-card-v2--basic .azedv-v2-contact {
  display: none !important;
}

/* Premium vendors with an approved contact (2026-07-08): the card keeps the
   basic layout (no logo column change) but the green Contact Provider pill
   comes back, wired by injectBottomRow() to the vendor's preferred contact.
   (Since ISS-2 the bottom-LEFT slot no longer keys off this — it reads the real
   _azedv_listing_verified flag. `prem` only drives the pill now.) */
.azedv-card-v2--basic.azedv-card-v2--contactable .azedv-v2-contact {
  display: inline-flex !important;
}

/* Mobile: basic tier already has no logo, so stack content + right cleanly */
@media (max-width: 768px) {
  .azedv-card-v2--basic.hp-listing--view-block {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "content"
      "right"
      "bottom" !important;
  }
}

/* Listings wrapper: subtle porcelain background behind the card stack */
.hp-page__content .hp-listings {
  background: transparent;
}

/* Mobile: collapse the right column under the content */
@media (max-width: 768px) {
  .azedv-card-v2.hp-listing--view-block {
    grid-template-columns: 72px 1fr !important;
    /* Deliverable 02 (Melissa 2026-06-17): the contact-icon bar moves to the
       TOP of the card on mobile — a full-width row above the logo/title — so
       the icons no longer overlap the content and the heart sits clean at the
       top-right. (Dash cards have their own parallel mobile reflow — search
       "Vendor dashboard cards on mobile" — so this block only affects the
       more-specific body.azedv-account-wide rule for directory + portal.) */
    grid-template-areas:
      "right right"
      "logo content"
      "bottom bottom" !important;
    padding: 18px !important;
  }

  .azedv-card-v2 .hp-listing__header,
  .azedv-card-v2 .hp-listing__image,
  .azedv-card-v2 .hp-listing__image a {
    width: 72px !important;
    height: 72px !important;
  }

  .azedv-card-v2 .azedv-v2-right {
    align-items: flex-start;
    min-width: 0;
    margin-top: 14px;
  }

  .azedv-card-v2 .azedv-v2-actions {
    flex-wrap: wrap;
  }

  /* Stack identity + bullets vertically on narrow screens */
  .azedv-card-v2 .azedv-v2-identity-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .azedv-card-v2 .azedv-v2-bullets {
    white-space: normal;
  }
  .azedv-card-v2 .azedv-v2-tags {
    flex-wrap: wrap;
    white-space: normal;
  }

  .azedv-card-v2 .azedv-v2-bottom {
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 10px;
  }

  .azedv-card-v2 .azedv-v2-contact {
    align-self: stretch;
    justify-content: center;
  }

  /* Compact browse cards: show title + category/location + short desc, plus
     the contact-icon bar pinned to the top of the card. Only bullets + tags
     move into the See-more sheet now — the icons stay on the card. */
  .azedv-card-v2--compact .azedv-v2-bullets,
  .azedv-card-v2--compact .azedv-v2-tags {
    display: none !important;
  }

  /* Icon bar at the card's top edge: full-width top grid row, cluster pushed
     to the right, with breathing room before the logo/title beneath it. */
  .azedv-card-v2--compact .azedv-v2-right {
    align-items: flex-end;
    margin: 0 0 12px;
  }

  /* display must be !important to beat `.azedv-card-v2 .azedv-v2-desc {
     display:block !important }` (style.css ~1969); line-clamp only works on a
     -webkit-box. Without this the desc never clamps, so the See-more overflow
     gate (cardHasExpandableContent) always measures 0 and no card expands. */
  .azedv-card-v2--compact .azedv-v2-desc {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 100%;
  }

  .azedv-card-v2--compact .hp-listing__title,
  .azedv-card-v2--compact .hp-listing__categories,
  .azedv-card-v2--compact .azedv-v2-location {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .azedv-v2-see-more {
    display: inline-block;
    margin: 0.35rem 0 0;
    padding: 0;
    border: none;
    background: none;
    font-family: var(--font-nav, 'PT Sans', sans-serif);
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--desert-sage, #7F9C8C);
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
  }
  .azedv-v2-see-more:hover,
  .azedv-v2-see-more:focus {
    color: var(--sienna, #B66037);
    outline: none;
  }
}

/* Browse listing "See more" lightbox — centered description expansion (deliverable 03).
   Centered (not a bottom sheet) so it never collides with the card's heart
   save-to-list dropdown, and shows the description text only. */
.azedv-browse-sheet.azedv-modal-overlay {
  align-items: center;
  padding: 1.25rem;
}
.azedv-browse-sheet .azedv-modal {
  max-width: 440px;
  width: 100%;
  border-radius: 16px;
  max-height: min(80vh, 560px);
  padding: 0;
}
.azedv-browse-sheet__body {
  padding: 2.25rem 1.5rem 1.75rem;
}
.azedv-browse-sheet__title {
  font-family: var(--font-heading, Merriweather, serif);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--charcoal, #333);
  margin: 0 0 0.5rem;
  padding-right: 2rem;
}
.azedv-browse-sheet__desc {
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--charcoal, #333);
  margin: 0 0 1rem;
}
@media (min-width: 769px) {
  .azedv-v2-see-more { display: none !important; }
  .azedv-browse-sheet { display: none !important; }
}

/* ==========================================================================
   FILTER PILL UI
   ========================================================================== */

/* HivePress wraps input INSIDE label: <label><input><span></label> */
/* Style the label as the pill container — !important to override parent */
.hp-field--checkboxes .hp-field--checkbox {
  display: inline-block !important;
  padding: 0.35rem 0.85rem !important;
  border: 1.5px solid var(--desert-sage) !important;
  background: transparent !important;
  color: var(--charcoal) !important;
  font-family: var(--font-nav) !important;
  font-size: 0.82rem !important;
  cursor: pointer;
  transition: all 0.15s;
  border-radius: 3px !important;
  margin: 0.2rem 0.25rem 0.2rem 0 !important;
  line-height: 1.4;
  user-select: none;
}

/* Hide native checkbox visually */
.hp-field--checkboxes .hp-field--checkbox input[type="checkbox"] {
  opacity: 0;
  position: absolute;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

/* Selected state — terracotta fill, white text */
.hp-field--checkbox:has(input:checked) {
  background: var(--terracotta) !important;
  border-color: var(--terracotta) !important;
  color: white !important;
  font-weight: 600;
}

.hp-field--checkbox:has(input:checked) span {
  color: white !important;
}

/* Hover (unselected only) */
.hp-field--checkboxes .hp-field--checkbox:hover {
  border-color: var(--terracotta);
  color: var(--terracotta);
}

/* Focus state for keyboard accessibility */
.hp-field--checkbox:has(input:focus-visible) {
  outline: 2px solid var(--desert-sage);
  outline-offset: 2px;
}

/* Filter checkboxes container — flex wrap */
.hp-field--checkboxes ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 0;
}

.hp-field--checkboxes ul li {
  display: inline-block;
}

/* Filter group headers */
.hp-form__label,
.hp-field__label {
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-light);
  margin-bottom: 0.75rem;
}

/* Sidebar container */
.hp-page__sidebar {
  border-right: 1px solid var(--divider);
  padding-right: 2rem;
}

/* ==========================================================================
   VERIFIED LISTING TREATMENT (SRCH-09)
   ========================================================================== */

/* Verified listing row — left accent bar + warm tint */
.hp-listing--view-block.hp-listing--featured,
.hp-listing--featured .hp-listing--view-block {
  border-left: 4px solid var(--desert-sage) !important;
  padding-left: calc(0.75rem + 8px) !important;
  background: rgba(127, 156, 140, 0.05) !important;
}

/* Fallback using :has() for badge-based detection */
.hp-listing--view-block:has(.hp-listing__featured-badge) {
  border-left: 4px solid var(--desert-sage) !important;
  padding-left: calc(0.75rem + 8px) !important;
  background: rgba(127, 156, 140, 0.05) !important;
}

/* Verified badge text styling */
.hp-listing__featured-badge,
.hp-listing__verified-badge {
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--desert-sage);
  background: rgba(127, 156, 140, 0.10);
  padding: 0.2rem 0.6rem;
  border-radius: 2px;
}

/* Featured row hover — slightly warmer */
.hp-listing--view-block.hp-listing--featured:hover,
.hp-listing--featured .hp-listing--view-block:hover,
.hp-listing--view-block:has(.hp-listing__featured-badge):hover {
  background: rgba(127, 156, 140, 0.08);
}

/* "Featured" chip in the listing title row — directory cards (inserted by
   azedv_featured_listings_data), vendor dashboard cards (rendered from the
   dashboard payload), and the admin-only single listing page. Terracotta
   matching the Featured Placement mock badge on Vendor Resources, so
   vendors recognize the placement they signed up for and parents read the
   pinned top cards as promoted. Inline in the title so it wraps as a unit
   on narrow screens without touching the card grid. */
.azedv-featured-badge {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  background: var(--terracotta);
  color: #ffffff;
  font-family: var(--font-nav);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1;
  padding: 0.3rem 0.55rem;
  border-radius: 3px;
  margin-left: 0.6rem;
  white-space: nowrap;
}

.azedv-featured-badge .hp-icon {
  font-size: 0.75em;
  margin-right: 0.4em;
  color: inherit;
}

/* Slightly larger against the single page's h1 */
.hp-listing--view-page .azedv-featured-badge {
  font-size: 0.8rem;
  padding: 0.35rem 0.65rem;
  margin-left: 0.75rem;
}

/* Hide "Report Listing" on single listing pages */
.hp-listing__action--report,
.hp-form--listing-report {
  display: none !important;
}

/* ==========================================================================
   Responsive adjustments
   ========================================================================== */

@media (max-width: 1024px) {
  .find-providers__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .site-header .custom-logo,
  .site-header .header-logo img {
    max-height: 100px !important;
    max-width: 160px !important;
  }

  .hero-section {
    padding: 2rem 1.25rem 1.5rem;
  }

  .hero-heading,
  .hero-section h1 {
    font-size: 1.875rem;
    margin-bottom: 0.5rem;
  }

  .hero-sub {
    font-size: 1rem;
    line-height: 1.55;
    margin-bottom: 1rem;
  }

  .hero-eyebrow {
    font-size: 0.8rem;
    margin-bottom: 0.5rem;
  }

  .hero-section .hp-form--listing-search,
  .hero-section .hp-form {
    margin-bottom: 0.25rem;
  }

  .hero-section .hp-form input[type="text"],
  .hero-section .hp-form input[type="search"] {
    text-align: center;
    width: 100%;
    height: 100%;
    font-size: 1rem;
  }

  /* HivePress wraps the input in a 48px-tall block div (.hp-form__field--search),
     so the ~20px input rides the top and "Search Keywords" sits high in the
     card. The input's height:100% can't fix it (parent theme wins on the input
     height), so center via the wrapper instead. */
  .hero-section .hp-form .hp-form__field--search {
    display: flex;
    align-items: center;
  }

  /* Match the input's white card to the Search button below it (~52px tall)
     so they read as a single stacked control on mobile. Why min-height,
     not height: this element has `flex: 1 1 0%` from HivePress's wide-form
     rule, so the flex algorithm ignores explicit `height`. `min-height`
     is a hard floor that the flex layout respects. */
  .hero-section .hp-form--listing-search .hp-form__fields,
  .hero-section .hp-form .hp-form__fields {
    min-height: 52px;
  }

  .hero-section .hp-form button[type="submit"],
  .hero-section .hp-form .hp-button {
    padding: 1rem 1.25rem;
  }

  .hero-stat {
    font-size: 0.875rem;
  }

  .find-providers {
    padding: 2.5rem 1.25rem 2rem;
  }

  .find-providers__heading {
    font-size: 1.4rem;
    margin-bottom: 1.5rem;
  }

  .find-providers__grid {
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
  }

  .sponsors {
    padding: 3rem 1.25rem;
  }

  .sponsors-section {
    padding: 1.5rem 1.25rem;
  }

  .sponsors-row--3,
  .sponsors-row--4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .sponsor-item {
    padding: 0.875rem 1rem;
    gap: 0.625rem;
  }

  .steps {
    grid-template-columns: 1fr;
  }

  .step {
    border-right: none;
    border-bottom: 1px solid var(--divider);
  }

  .step:last-child {
    border-bottom: none;
  }

  .how-it-works {
    padding: 3rem 1.25rem;
  }

  .how-it-works h2 {
    margin-bottom: 2rem;
  }

  .trust-inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .trust-item {
    border-right: none;
    padding: 0;
  }

  .vendor-cta {
    padding: 3rem 1.25rem;
  }

}

@media (max-width: 480px) {
  .hero-heading,
  .hero-section h1 {
    font-size: 1.625rem;
  }

  .hero-section {
    padding: 1.5rem 1rem 1.25rem;
  }

  .hero-sub {
    font-size: 0.9375rem;
    line-height: 1.55;
    margin-bottom: 0.75rem;
  }

  .find-providers {
    padding: 2rem 1rem 1.5rem;
  }

  .find-providers__grid {
    grid-template-columns: 1fr;
    gap: 0.625rem;
  }

  .find-providers__card {
    padding: 1rem;
  }

  .find-providers__tagline {
    font-size: 0.8rem;
    margin-top: 1.5rem;
  }

  .sponsors {
    padding: 2rem 1rem;
  }

  .sponsors-section {
    padding: 1.25rem 1rem;
  }

  .sponsors-row--3,
  .sponsors-row--4 {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .how-it-works {
    padding: 2rem 1rem;
  }

  .step {
    padding: 1.5rem 1.25rem;
  }

  .trust-bar {
    padding: 2rem 1rem;
  }

  .family-trust {
    padding: 2.25rem 1.25rem 2.5rem;
  }

  .family-trust__heading {
    gap: 0.75rem;
    margin-bottom: 1.75rem;
  }

  .family-trust__heading-text {
    font-size: 1.25rem;
    white-space: normal;
    text-align: center;
  }

  .family-trust__grid {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }

  .family-trust__item {
    border-right: none;
    border-bottom: 1px solid var(--divider);
    padding: 0 0 1.75rem;
  }

  .family-trust__item:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }

  .vendor-cta {
    padding: 2rem 1rem;
  }

}


/* ==========================================================================
   NAVIGATION REDESIGN - Match mockup (logo left, links right)
   ========================================================================== */

/* Force desktop nav visible — ExpertHive hides it at certain breakpoints */
.site-header .header-navbar__menu,
.site-header nav.header-navbar__menu,
nav.header-navbar__menu {
  display: block !important;
}

/* Hide ALL HivePress injected nav items (sign-in, user account — logged in or out) */
.site-header .header-navbar__menu .menu-item--user-account,
.site-header .header-navbar__menu .menu-item--user-login,
.header-navbar__menu .menu-item--user-account,
.header-navbar__menu .menu-item--user-login,
#menu-main-menu-2 > .menu-item--user-account,
#menu-main-menu-2 > .menu-item--user-login,
ul.menu > li.menu-item--user-account,
ul.menu > li.menu-item--user-login,
.site-header .header-navbar__menu > ul.menu > li:has(.hp-menu__item),
.header-navbar__menu > ul.menu > li:has(.hp-menu__item) {
  display: none !important;
}

/* Hide HivePress action buttons (List a Service, Post a Request) */
.site-header .header-navbar__actions,
.header-navbar__actions {
  display: none !important;
}

/* Hide burger/end section on desktop */
.site-header .header-navbar__end,
.header-navbar__end {
  display: none !important;
}

/* Restructure header: logo left, nav centered to full header, Sign in pinned right.
   Uses CSS grid overlap so logo and nav occupy the same grid cell — logo pinned
   to justify-self: start, menu to justify-self: center — giving true viewport
   centering for the nav regardless of logo width.
   ⚠ SINGLE SOURCE OF TRUTH for navbar geometry, both rest and scrolled states,
   all breakpoints. A state-dependent min-height/padding fork here re-creates
   the sticky-header shake loop — see the scrolled-state comment near the top. */
.site-header .header-navbar {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto !important;
  align-items: center !important;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0.5rem 2rem !important;
  min-height: 70px;
}

.site-header .header-navbar__start {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  align-self: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  z-index: 2;
}

.site-header .header-navbar__middle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: center !important;
  align-self: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  height: auto !important;
  z-index: 1;
}

/* Menu list — horizontal, centered */
.site-header .header-navbar__menu > ul.menu,
.header-navbar__menu > ul.menu,
#menu-main-menu-2 {
  display: flex !important;
  align-items: center !important;
  gap: clamp(0.75rem, 1.5vw, 2.25rem) !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-wrap: nowrap;
  justify-content: center !important;
}

/* Individual menu items — inline */
.site-header .header-navbar__menu > ul.menu > li.menu-item:not(.menu-item--user-account):not(.menu-item--user-login):not(:has(.hp-menu__item)),
#menu-main-menu-2 > li.menu-item:not(.menu-item--user-account):not(.menu-item--user-login):not(:has(.hp-menu__item)) {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  width: auto !important;
  position: relative;
  white-space: nowrap;
}

/* Sign in — pinned right, shifted left to make room for the Get Started button.
   11rem offset ≈ Get Started button intrinsic width (~9rem) + gap (~2rem). */
.site-header .header-navbar__menu > ul.menu > li.menu-item--signin,
#menu-main-menu-2 > li.menu-item--signin {
  position: absolute !important;
  right: calc(2rem + 11rem) !important;
  top: 50% !important;
  transform: translateY(calc(-50% + 3px)) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Sign in — plain text link, no padding, no background (matches original HivePress style) */
.site-header .header-navbar__menu > ul.menu > li.menu-item--signin > a,
#menu-main-menu-2 > li.menu-item--signin > a {
  background: transparent !important;
  color: var(--nav-link-inactive) !important;
  padding: 0 !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--font-nav) !important;
  font-size: 0.9375rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  text-decoration: none !important;
  transition: color 0.2s ease, border-color 0.2s ease !important;
}

.site-header .header-navbar__menu > ul.menu > li.menu-item--signin > a:hover,
.site-header .header-navbar__menu > ul.menu > li.menu-item--signin > a:focus,
#menu-main-menu-2 > li.menu-item--signin > a:hover,
#menu-main-menu-2 > li.menu-item--signin > a:focus {
  background: transparent !important;
  color: var(--nav-link-active) !important;
}

/* Get Started — Desert Sage CTA button pinned to the far right.
   The 18.66px bold uppercase text qualifies as "large text" under WCAG AA (≥18px bold),
   so white on Desert Sage #7F9C8C at ~3.4:1 meets the 3:1 large-text minimum. */
.site-header .header-navbar__menu > ul.menu > li.menu-item--get-started,
#menu-main-menu-2 > li.menu-item--get-started {
  position: absolute !important;
  right: 2rem !important;
  top: 50% !important;
  transform: translateY(calc(-50% - 3px)) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.site-header .header-navbar__menu > ul.menu > li.menu-item--get-started > a,
#menu-main-menu-2 > li.menu-item--get-started > a {
  background: var(--desert-sage) !important;
  color: #ffffff !important;
  padding: 0.625rem 1.25rem !important;
  border: 2px solid var(--desert-sage) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--font-nav) !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  line-height: 1 !important;
  display: inline-block !important;
  white-space: nowrap !important;
  transition: background-color 0.2s ease, border-color 0.2s ease !important;
}

.site-header .header-navbar__menu > ul.menu > li.menu-item--get-started > a:hover,
.site-header .header-navbar__menu > ul.menu > li.menu-item--get-started > a:focus,
#menu-main-menu-2 > li.menu-item--get-started > a:hover,
#menu-main-menu-2 > li.menu-item--get-started > a:focus {
  background: var(--desert-sage-hover) !important;
  border-color: var(--desert-sage-hover) !important;
  color: #ffffff !important;
}

/* Keyboard-visible focus ring (WCAG 2.4.7) */
.site-header .header-navbar__menu > ul.menu > li.menu-item--get-started > a:focus-visible,
#menu-main-menu-2 > li.menu-item--get-started > a:focus-visible {
  outline: 3px solid var(--rust) !important;
  outline-offset: 2px !important;
}

/* Kill ExpertHive underline/::after accents from the Get Started button */
.site-header .header-navbar__menu > ul.menu > li.menu-item--get-started > a::before,
.site-header .header-navbar__menu > ul.menu > li.menu-item--get-started > a::after,
#menu-main-menu-2 > li.menu-item--get-started > a::before,
#menu-main-menu-2 > li.menu-item--get-started > a::after {
  display: none !important;
  content: none !important;
}

/* Remove ExpertHive ::before accent on menu items */
.site-header .header-navbar__menu > ul.menu > li::before,
.site-header .header-navbar__menu > ul.menu > li::after,
#menu-main-menu-2 > li::before,
#menu-main-menu-2 > li::after {
  display: none !important;
  content: none !important;
}

/* Mobile: restore burger, hide inline nav */
@media (max-width: 768px) {
  .site-header .header-navbar__middle,
  .site-header nav.header-navbar__menu {
    display: none !important;
  }

  .site-header .header-navbar__end,
  .header-navbar__end {
    display: flex !important;
    align-items: center;
  }

  .site-header .header-navbar__end .header-navbar__actions,
  .header-navbar__end .header-navbar__actions {
    display: none !important;
  }

  /* Logo sits too high in the mobile header; nudge it down so it visually
     centers next to the burger icon. */
  .site-header .header-navbar__start {
    margin-top: 15px !important;
  }

  /* Lift the burger icon 28px without changing the navbar height.
     Apply transform to the icon link itself (not __end) so the dropdown
     menu below stays anchored to the navbar — moving __end would carry
     the dropdown up with it, overlapping the icon. */
  .site-header .header-navbar__burger > a {
    transform: translateY(-28px);
  }

  /* Burger dropdown: parent theme's `bottom: 0` collapses the panel to its
     padding-only height (~50px) once HivePress JS sets `top: 46px` inline,
     hiding every link except the first. Release `bottom`, let height grow
     to content, and cap with a scrollable max-height. */
  .site-header .header-navbar__burger > ul.menu {
    background: var(--bg-white);
    border: 1px solid var(--divider);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    bottom: auto !important;
    height: auto !important;
    max-height: calc(100vh - 60px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .site-header .header-navbar__burger > ul.menu > .menu-item--user-account,
  .site-header .header-navbar__burger > ul.menu > .menu-item--user-login,
  .site-header .header-navbar__burger > ul.menu > li:has(.hp-menu__item) {
    display: none !important;
  }

  /* Browse Vendors: the sticky nav ends flush with .hp-page__header (y=137),
     so the mobile Filter button sat right against the nav. Add breathing
     room at the top of the page header on mobile only. */
  .hp-page__header {
    padding-top: 1rem;
  }
}

/* ==========================================================================
   Parent Portal — Privacy Notice (top of /parent-portal/)
   Heavy, attention-grabbing treatment so families can't miss the rule.
   ========================================================================== */

.azedv-pp-privacy-notice {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin: 0 0 28px;
  padding: 20px 24px;
  background: #FFFFFF;
  color: #333333;
  border: 1px solid var(--warm-sand, #E7D3A8);
  border-top: 3px solid var(--terracotta, #C96A4A);
  border-radius: 2px;
  font-family: var(--font-body, Inter, sans-serif);
}

.azedv-pp-privacy-notice__icon {
  flex: 0 0 auto;
  color: var(--terracotta, #C96A4A);
  margin-top: 2px;
}

.azedv-pp-privacy-notice__body {
  flex: 1 1 auto;
  min-width: 0;
}

.azedv-pp-privacy-notice__label {
  display: inline-block;
  margin-bottom: 6px;
  font-family: var(--font-heading, Merriweather, Georgia, serif);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--terracotta, #C96A4A);
}

.azedv-pp-privacy-notice__text {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.55;
  color: #333333;
}

.azedv-pp-privacy-notice__text strong {
  color: #333333;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: rgba(201, 106, 74, 0.6);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

@media (max-width: 600px) {
  .azedv-pp-privacy-notice {
    padding: 16px 18px;
    gap: 12px;
  }
  .azedv-pp-privacy-notice__text { font-size: 0.92rem; }
}

/* ==========================================================================
   Vendor Dashboard — Listings: Card Grid + Expanded Modal
   ========================================================================== */

/* JS hides the default HivePress table; keep the fallback hidden too. */
.hp-page__content table.hp-listings { display: none !important; }

/* Grid of simple cards */
.azedv-ccard-grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 1.25rem 0 1.5rem;
}

/* ---- Simple card (compact) ---- */
.azedv-ccard {
  position: relative;
  display: grid;
  grid-template-columns: 72px 1fr auto;
  gap: 1rem;
  align-items: start;
  padding: 1.25rem 1.5rem;
  background: #FBEFE2; /* tint of Porcelain */
  border-radius: 14px;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.15s ease;
  font-family: var(--font-body, Inter, sans-serif);
  color: var(--charcoal, #333);
  overflow: visible;
}
.azedv-ccard:hover { background: #F5E2D0; transform: translateY(-1px); }
.azedv-ccard:focus { outline: 2px solid var(--terracotta, #C96A4A); outline-offset: 2px; }

/* Logo / avatar */
.azedv-ccard__initials {
  font-family: var(--font-heading, Merriweather, serif);
  font-weight: 700;
  color: var(--terracotta, #C96A4A);
  font-size: 1.75rem;
}

/* Individual contact icon button */
.azedv-ci {
  position: relative;
  width: 40px; height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--charcoal, #333);
  text-decoration: none !important;
  border-radius: 50%;
  transition: background 0.15s ease, color 0.15s ease;
  padding: 0;
}
.azedv-ci svg { display: block; width: 22px; height: 22px; }
.azedv-ci:hover { background: rgba(201, 106, 74, 0.1); color: var(--terracotta, #C96A4A); }
.azedv-ci--heart:hover { background: rgba(201, 48, 44, 0.12); }
.azedv-ci--heart:hover svg { color: #933818; }
/* Saved state: only logged-in users with vendor saved show a filled heart.
   Visitors (no .azedv-ci--heart-lists class) see the outline heart and the
   sign-up popover on hover. */
.azedv-ci--heart-lists svg { color: #C9302C; }
.azedv-ci--heart-lists svg path { fill: #C9302C; stroke: none; }
.azedv-ci--heart-lists:hover svg path { fill: #933818; stroke: none; }
.azedv-ci--flag { color: var(--charcoal-muted, #888); }
.azedv-ci--flag:hover { color: var(--terracotta, #C96A4A); background: rgba(201, 106, 74, 0.1); }

/* Confirmation tip shown over the flag when a listing is flagged. Pure CSS:
   the click handler toggles .is-active, the animation fades the tip in and
   back out. Right-anchored so it never spills past the card's right edge. */
.azedv-ci--flag::after {
  content: 'Listing flagged for review';
  position: absolute;
  bottom: calc(100% + 9px);
  right: -4px;
  padding: 8px 12px;
  background: #FFFFFF;
  color: var(--charcoal, #333);
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.78rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(97, 20, 7, 0.12), 0 2px 4px rgba(97, 20, 7, 0.06);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 60;
}
.azedv-ci--flag::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 5px);
  right: 15px;
  width: 10px; height: 10px;
  background: #FFFFFF;
  transform: rotate(45deg);
  box-shadow: 2px 2px 4px rgba(97, 20, 7, 0.06);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 61;
}
.azedv-ci--flag.is-active::after,
.azedv-ci--flag.is-active::before {
  animation: azedv-flag-tip 2.4s ease forwards;
}
@keyframes azedv-flag-tip {
  0%   { opacity: 0; visibility: visible; }
  12%  { opacity: 1; }
  78%  { opacity: 1; }
  100% { opacity: 0; visibility: hidden; }
}

/* On mobile the compact card moves the icon bar to the card's top edge, so the
   button-anchored tip renders above the card — straight into the sticky results
   header (directory) or a scroll-clipped panel (portal), which paint over it
   and cut it off. Same failure class as the heart dropdown (deliverable 03):
   re-present it at the viewport level as a bottom-center toast. position:fixed
   escapes every overflow/sticky collision (no transformed ancestors on card v2
   or the sheet panel), and z-index clears the modal overlay (10000). The
   speech-bubble arrow makes no sense detached from the button, so it's dropped. */
@media (max-width: 768px) {
  .azedv-ci--flag::after {
    position: fixed;
    top: auto;
    right: auto;
    left: 50%;
    bottom: calc(24px + env(safe-area-inset-bottom, 0px));
    transform: translateX(-50%);
    width: max-content;
    max-width: calc(100vw - 40px);
    white-space: normal;
    text-align: center;
    line-height: 1.35;
    box-shadow: 0 8px 32px rgba(97, 20, 7, 0.28), 0 2px 4px rgba(97, 20, 7, 0.10);
    z-index: 10010;
  }
  .azedv-ci--flag::before {
    display: none;
  }
}
.azedv-ci--fb:hover, .azedv-ci--ig:hover { background: rgba(0, 0, 0, 0.04); }
/* Modal close button X */
.azedv-modal__close svg { display: block; margin: auto; }

/* Save-to-favorites popover (shown on hover/focus of heart icon) */
.azedv-popover {
  position: absolute;
  top: calc(100% + 10px);
  right: -8px;
  width: 240px;
  padding: 1rem 1.125rem 1.125rem;
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(97, 20, 7, 0.12), 0 2px 4px rgba(97, 20, 7, 0.06);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
  z-index: 50;
  text-align: center;
  pointer-events: none;
}
.azedv-popover::before {
  content: '';
  position: absolute;
  top: -6px; right: 16px;
  width: 12px; height: 12px;
  background: #fff;
  transform: rotate(45deg);
  box-shadow: -2px -2px 4px rgba(97, 20, 7, 0.04);
}
/* Invisible hover bridge over the 10px gap between heart and popover so the
   cursor can travel into the picker without the popover fading out. */
.azedv-popover::after {
  content: '';
  position: absolute;
  top: -12px; left: 0; right: 0;
  height: 12px;
}
.azedv-ci--heart:hover .azedv-popover,
.azedv-ci--heart:focus .azedv-popover,
.azedv-ci--heart:focus-within .azedv-popover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.azedv-popover__text {
  display: block;
  font-size: 0.875rem;
  line-height: 1.4;
  color: var(--charcoal, #333);
  margin-bottom: 0.75rem;
}
.azedv-popover__btn {
  display: inline-block;
  padding: 0.5rem 1.75rem;
  background: #7F9C8C;
  color: #fff !important;
  font-size: 0.9375rem;
  font-weight: 500;
  border-radius: 6px;
  text-decoration: none !important;
  transition: background 0.15s ease;
}
.azedv-popover__btn:hover { background: #5A8D75; }

/* Logged-in variant: "Save to list" picker — list checkboxes + inline
   create-new form, backed by the azedv/v1/lists REST API. */
.azedv-popover--lists {
  width: 240px;
  padding: 0.875rem 1rem;
  text-align: left;
}
.azedv-popover__heading {
  display: block;
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--charcoal, #333);
  margin-bottom: 0.625rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(51, 51, 51, 0.1);
}
.azedv-popover__lists {
  list-style: none;
  margin: 0 0 0.5rem 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.azedv-popover__list-item label {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.35rem 0.25rem;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.9rem;
  color: var(--charcoal, #333);
  transition: background 0.12s ease;
}
.azedv-popover__list-item label:hover {
  background: rgba(127, 156, 140, 0.08);
}
.azedv-popover__list-item input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  border: 1.5px solid #A89E93;
  border-radius: 3px;
  background: #fff;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.azedv-popover__list-item input[type="checkbox"]:checked {
  background: #7F9C8C;
  border-color: #7F9C8C;
}
.azedv-popover__list-item input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 4px;
  top: 0px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.azedv-popover__list-name {
  line-height: 1.25;
}
/* "Create new list" — a polished menu row: tinted plus badge, label, caret. */
.azedv-popover__new {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  margin-top: 0.4rem;
  padding: 0.5rem 0.45rem;
  border: 0;
  border-top: 1px solid rgba(51, 51, 51, 0.1);
  border-radius: 0 0 8px 8px;
  background: none;
  box-shadow: none;
  text-align: left;
  font-family: var(--font-body);
  cursor: pointer;
  transition: background 0.12s ease;
}
.azedv-popover__new:hover {
  background: rgba(127, 156, 140, 0.10);
}
.azedv-popover__new-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  border-radius: 6px;
  background: var(--terracotta, #C96A4A);
  color: #fff;
}
.azedv-popover__new-icon svg { display: block; width: 14px; height: 14px; }
/* The parent theme forces `path { fill: currentColor; stroke: none }` on inline
   SVGs, which erases stroke-drawn icons and tints them with the active heart's
   red. Pin our plus/caret strokes explicitly so they render regardless. */
.azedv-popover .azedv-popover__new-icon svg,
.azedv-popover .azedv-popover__new-icon svg path {
  fill: none !important;
  stroke: #fff !important;
}
.azedv-popover__new-label {
  flex: 1 1 auto;
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--charcoal, #333);
}
.azedv-popover__new-caret {
  display: inline-flex;
  flex-shrink: 0;
  color: #A89E93;
}
.azedv-popover__new-caret svg { display: block; width: 14px; height: 14px; }
.azedv-popover .azedv-popover__new-caret svg,
.azedv-popover .azedv-popover__new-caret svg path {
  fill: none !important;
  stroke: #A89E93 !important;
}
.azedv-popover__hint {
  display: block;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--text-light, #8a7a6a);
  margin-bottom: 0.25rem;
}
/* Inline create-new-list form (revealed by the "+ Create new list" button).
   Author display rules beat the UA [hidden] default, so guard explicitly. */
.azedv-popover__new[hidden],
.azedv-popover__new-form[hidden] { display: none !important; }
.azedv-popover__new-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding-top: 0.55rem;
  margin-top: 0.35rem;
  border-top: 1px solid rgba(51, 51, 51, 0.1);
}
.azedv-popover__new-input {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.4rem 0.5rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--charcoal, #333);
  background: #fff;
  border: 1px solid #D8CCBC;
  border-radius: 4px;
}
.azedv-popover__new-input:focus {
  outline: none;
  border-color: var(--desert-sage, #7F9C8C);
}
.azedv-popover__new-add {
  flex: 0 0 auto;
  padding: 0.4rem 0.8rem;
  background: #7F9C8C;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-family: var(--font-body);
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}
.azedv-popover__new-add:hover { background: #5A8D75; }
.azedv-popover__new-error {
  flex: 1 1 100%;
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--rust, #933818);
}
.azedv-popover__view {
  display: block;
  margin-top: 0.6rem;
  font-size: 0.8125rem;
  color: var(--desert-sage-hover, #5A8D75) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}
.azedv-popover__view:hover { color: var(--sienna, #B66037) !important; }

/* Deliverable 03 — on mobile the absolutely-positioned heart dropdown gets
   clipped at the card/viewport edge ("you can't get to it on the directory
   page"). Present it as a centered lightbox with a full-viewport scrim (the
   100vmax box-shadow). It stays open via :focus-within while the parent picks a
   list; the scrim is paint-only (box-shadow takes no pointer events), so a tap
   outside the panel lands on the page, blurs the heart, and closes the picker. */
@media (max-width: 768px) {
  .azedv-card-v2 .azedv-ci--heart .azedv-popover {
    position: fixed;
    top: 50%;
    left: 50%;
    right: auto;
    width: min(330px, 90vw);
    max-height: 78vh;
    overflow-y: auto;
    transform: translate(-50%, -46%);
    box-shadow: 0 16px 48px rgba(97, 20, 7, 0.30), 0 0 0 100vmax rgba(97, 20, 7, 0.50);
    z-index: 10002;
  }
  /* Drop the speech-bubble arrow + hover bridge in centered mode. */
  .azedv-card-v2 .azedv-ci--heart .azedv-popover::before,
  .azedv-card-v2 .azedv-ci--heart .azedv-popover::after {
    display: none;
  }
  .azedv-card-v2 .azedv-ci--heart:hover .azedv-popover,
  .azedv-card-v2 .azedv-ci--heart:focus .azedv-popover,
  .azedv-card-v2 .azedv-ci--heart:focus-within .azedv-popover {
    transform: translate(-50%, -50%);
  }
}

/* ---- Modal overlay ---- */
.azedv-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(97, 20, 7, 0.55);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  z-index: 10000;
}
.azedv-modal-overlay.is-open { display: flex; }
.azedv-modal {
  position: relative;
  background: #FBEFE2;
  border-radius: 18px;
  max-width: 860px;
  width: 100%;
  max-height: calc(100vh - 3rem);
  overflow-y: auto;
  box-shadow: 0 24px 60px rgba(97, 20, 7, 0.30);
  font-family: var(--font-body, Inter, sans-serif);
  color: var(--charcoal, #333);
}
.azedv-modal__close {
  position: absolute;
  top: 0.875rem; right: 0.875rem;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.7);
  border: none;
  cursor: pointer;
  font-size: 1rem;
  color: var(--charcoal, #333);
  z-index: 2;
  transition: background 0.15s ease;
}
.azedv-modal__close:hover { background: #fff; color: var(--terracotta, #C96A4A); }

/* Restyled Import/Export buttons (still below the hidden table) */
.hp-page__content .hp-listing__action--import,
.hp-page__content .hp-listing__action--export {
  margin-top: 1.5rem !important;
  font-family: var(--font-body, Inter, sans-serif) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  padding: 0.625rem 1.25rem !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}
.hp-page__content .hp-listing__action--import {
  background: #5A8D75 !important;
  color: #fff !important;
  border: 1px solid #5A8D75 !important;
}
.hp-page__content .hp-listing__action--import:hover {
  background: #4A7B64 !important;
  border-color: #4A7B64 !important;
}
.hp-page__content .hp-listing__action--export {
  background: transparent !important;
  color: var(--charcoal, #333) !important;
  border: 1px solid #D6CCB8 !important;
}
.hp-page__content .hp-listing__action--export:hover {
  background: var(--warm-sand-light, #F0E2C4) !important;
  border-color: #C5B89F !important;
}

/* Responsive — stack the simple card */
@media (max-width: 640px) {
  .azedv-ccard { grid-template-columns: 56px 1fr; padding: 1rem 1.125rem; }
}

/* ==========================================================================
   Account Pages — Wide Layout + Dashboard V2 Cards
   ========================================================================== */

/* Account pages share the standard 1204px container width with the rest
   of the site (Vendor Request, About, etc.) so the listings stack cleanly
   in the center with comfortable side margins. */
body.azedv-account-wide .container {
  width: 1204px !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.azedv-account-wide .hp-page.site-main {
  max-width: none;
  padding-top: 2.5rem;
}

/* Parent theme decorates every .hp-page__title with a 2x4 dot grid via
   ::before box-shadows. On the account dashboard the title sits directly
   under the nav, so the dots read as noise between the nav and heading. */
body.azedv-account-wide .hp-page__title::before,
body.azedv-account-wide .hp-section__title::before {
  display: none !important;
}

body.azedv-account-wide .hp-page__title {
  padding-top: 0 !important;
}

body.azedv-account-wide .hp-page__sidebar.hp-col-sm-4 {
  flex: 0 0 240px !important;
  max-width: 240px !important;
  width: 240px !important;
  padding-right: 2rem;
  /* Align the sidebar's top with the first listing card, not the page
     title. Offset matches the title block height (H1 + its bottom margin). */
  margin-top: 4.5rem;
  border-right: 1px solid var(--divider, rgba(51, 51, 51, 0.12));
}

body.azedv-account-wide .hp-page__content.hp-col-sm-8 {
  flex: 1 1 auto !important;
  max-width: calc(100% - 240px) !important;
  width: auto !important;
  padding-left: 2.25rem;
}

/* The /account/ sidebar is the HivePress account menu (Dashboard, Listings,
   Favorites, Calendar, Settings, Sign Out) — not a filter form. Strip the
   filter-specific padding/scroll treatment that applies to every sidebar. */
body.azedv-account-wide .hp-page__sidebar {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  border-right: 1px solid var(--divider, rgba(51, 51, 51, 0.12));
}

body.azedv-account-wide .hp-page__sidebar .hp-menu {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding-top: 0.5rem;
}

body.azedv-account-wide .hp-page__sidebar .hp-menu a {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.6rem 0.85rem;
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.95rem;
  color: var(--charcoal, #333);
  text-decoration: none;
  border-radius: 6px;
  transition: background 0.15s ease, color 0.15s ease;
}

body.azedv-account-wide .hp-page__sidebar .hp-menu a:hover {
  background: rgba(201, 106, 74, 0.08);
  color: var(--terracotta, #C96A4A);
}

body.azedv-account-wide .hp-page__sidebar .hp-menu li.hp-menu__item--current > a,
body.azedv-account-wide .hp-page__sidebar .hp-menu li.current-menu-item > a,
body.azedv-account-wide .hp-page__sidebar .hp-menu a.is-active {
  background: rgba(201, 106, 74, 0.10);
  color: var(--terracotta, #C96A4A);
  font-weight: 600;
}

/* Simplified /account/ shell — hides the 2-item sidebar (Listings + Sign
   Out) and lifts Sign Out into the title header as a transparent button.
   Overrides the .azedv-account-wide sidebar rules above via !important. */
body.azedv-account-simple .hp-page__sidebar { display: none !important; }
body.azedv-account-simple .hp-page__content.hp-col-sm-8 {
  flex: 1 1 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 2rem !important;
  padding-right: 2rem !important;
}

.azedv-account-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.azedv-account-header .hp-page__title {
  margin: 0 !important;
  padding: 0 !important;
}
.azedv-account-header__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}
.azedv-account-verify-all {
  display: inline-block;
  padding: 0.5rem 1.1rem;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.875rem;
  font-weight: 600;
  color: #fff;
  background: var(--sage, #7F9C8C);
  border: 1px solid var(--sage, #7F9C8C);
  border-radius: 4px;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.azedv-account-verify-all:hover,
.azedv-account-verify-all:focus {
  background: #6d8779;
  border-color: #6d8779;
  color: #fff;
  text-decoration: none;
}
.azedv-account-signout {
  display: inline-block;
  padding: 0.5rem 1.1rem;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--charcoal, #333);
  background: transparent;
  border: 1px solid rgba(51, 51, 51, 0.25);
  border-radius: 4px;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.azedv-account-signout:hover,
.azedv-account-signout:focus {
  border-color: var(--terracotta, #C96A4A);
  color: var(--terracotta, #C96A4A);
  background: rgba(201, 106, 74, 0.04);
  text-decoration: none;
}

/* Dashboard listings grid — comfortable vertical rhythm, full width of
   the wide content column. */
body.azedv-account-wide .azedv-ccard-grid {
  gap: 14px;
  margin: 1rem 0 2rem;
}

/* Dashboard v2 card reuses .azedv-card-v2 styles from the directory card.
   Tweaks below are dashboard-only: size the right column without the signup
   popover, add a status pill beneath the action icons, and tint the card by
   moderation status. The whole card is rendered inline — no modal trigger. */

/* Logo column visible on dashboard cards too — vendors see their listing
   exactly as parents do, including the placeholder square that prompts
   them to upload a logo. */
body.azedv-account-wide .azedv-dash-card.hp-listing--view-block {
  grid-template-columns: 88px 1fr auto !important;
  grid-template-areas:
    "logo content right"
    "bottom bottom bottom" !important;
}

/* Vendor dashboard cards on mobile (≤768px). The desktop 3-column grid above
   pins `88px 1fr auto`, which at phone widths squeezes the `1fr` content column
   to 0 — hiding the listing title AND the description copy, so cards came up
   blank below the logo/icons (only the logo, contact icons, status pill, and
   footer stayed visible). Mirror the directory cards' approved mobile reflow
   (deliverable 02): lift the contact-icon/status column into a full-width row on
   top, drop to a 2-column logo+content grid so the copy gets real width, and
   clamp the description to a few lines with an inline "See more" (added by the
   dashboard JS) so long copy is readable without dominating the card. */
@media (max-width: 768px) {
  body.azedv-account-wide .azedv-dash-card.hp-listing--view-block {
    grid-template-columns: 72px 1fr !important;
    grid-template-areas:
      "right right"
      "logo content"
      "bottom bottom" !important;
    column-gap: 20px !important;
    row-gap: 4px !important;
  }

  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .hp-listing__image,
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .hp-listing__image a {
    width: 72px !important;
    height: 72px !important;
  }

  /* Contact icons get their OWN full-width row across the top of the card,
     evenly distributed edge-to-edge; the status pill drops to its own line
     beneath, right-aligned. (Client target, mobile redesign 2026-06-23 — was a
     single row with icons clustered left + the pill floated right, which wrapped
     the icons onto two ragged rows.) */
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-right {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    width: 100%;
    margin: 0 0 16px;
    gap: 10px;
  }
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-actions {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    gap: 4px;
  }
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-status {
    align-self: flex-end;
    margin: 0;
  }

  /* Category/location + bullets stack and left-align so the bullets read down
     the left edge instead of being shoved right by the desktop 50px margin. */
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-identity-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-bullets {
    margin-left: 0 !important;
    white-space: normal;
  }

  /* The account-simple 2rem side padding (tuned for desktop) squeezes the
     cards on phones; trim it so the cards use the available screen width. */
  body.azedv-account-simple .hp-page__content.hp-col-sm-8 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  /* Show the description, clamped to 3 lines; .is-expanded (See more) unclamps.
     display:-webkit-box must be !important to beat the `display:block !important`
     that forces the custom card children block-level (search "Force block-level
     on our custom children") — line-clamp only works on a -webkit-box. */
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-desc {
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 100%;
  }
  body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-desc.is-expanded {
    display: block !important;
    -webkit-line-clamp: unset;
    overflow: visible;
  }
}

/* Logo placeholder — warm-sand tile with an italic first-letter monogram
   (rendered by simpleCard as <span class="azedv-ccard__initials">X</span>
   when the listing has no uploaded image). */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .hp-listing__image a {
  background: #E7D3A8 !important;
  border: 1px solid rgba(97, 20, 7, 0.10) !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ccard__initials {
  font-family: var(--font-heading, Merriweather, serif);
  font-style: italic;
  font-weight: 400;
  color: var(--rust, #933818);
  font-size: 2.75rem;
  line-height: 1;
  user-select: none;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-right {
  min-width: 0;
  gap: 12px;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-action--edit:hover {
  border-color: var(--terracotta);
  color: var(--terracotta);
  background: rgba(201, 106, 74, 0.06);
}

/* Status pill under the action icons — color-coded like the old ccard dot */
body.azedv-account-wide .azedv-v2-status {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  white-space: nowrap;
  align-self: flex-end;
}

body.azedv-account-wide .azedv-v2-status--approved { background: rgba(90, 141, 117, 0.15); color: #2F5F48; }
body.azedv-account-wide .azedv-v2-status--pending  { background: rgba(232, 185, 59, 0.18); color: #8A6915; }
body.azedv-account-wide .azedv-v2-status--review   { background: rgba(217, 122, 46, 0.18); color: #8A4514; }
body.azedv-account-wide .azedv-v2-status--declined { background: rgba(147, 56, 24, 0.12); color: #7A2A10; }

/* Unverified badge — muted grey version of the verified row */
body.azedv-account-wide .azedv-v2-verified--no {
  color: #8a8a8a !important;
}
body.azedv-account-wide .azedv-v2-verified--no .azedv-v2-check--muted {
  color: #b5b5b5;
}
body.azedv-account-wide .azedv-v2-verified--no .azedv-v2-check--muted svg {
  width: 14px;
  height: 14px;
}

/* The dashboard card's Edit Listing link mirrors the directory card's
   Claim Listing — same typography, same hover color. No override needed
   (.azedv-v2-claim styles already apply). */

/* ---- Dashboard basic preview placeholders ----
   Basic listings still show premium-only surfaces so vendors can see the
   package they unlock. Keep the treatment quiet: muted glyphs, compact
   popovers, and one package CTA instead of a-la-carte prompts. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--placeholder {
  color: #C4BFB8 !important;
  cursor: default !important;
  pointer-events: none;
  opacity: 0.55;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--placeholder svg {
  filter: grayscale(100%);
  opacity: 0.85;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--placeholder:hover {
  background: transparent !important;
  color: #C4BFB8 !important;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .hp-listing__image {
  display: block !important;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-dash-logo-preview {
  width: 88px !important;
  height: 88px !important;
  border-radius: 10px !important;
  border: 1px dashed rgba(97, 20, 7, 0.22) !important;
  background: #F1E4CC !important;
  overflow: hidden;
  display: block;
  position: relative;
  opacity: 0.58;
  filter: grayscale(55%);
}

/* Logoless placeholder tile — category icon above a "Your logo here" caption
   (markup built by simpleCard; icon set matches the homepage category grid
   and the Browse Vendors strip). The --ph modifier carries the tile geometry
   itself so premium cards without a logo get the same treatment as basic,
   minus the --basic dimming and minus the upgrade pitch in the caption. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-dash-logo-preview--ph {
  width: 88px !important;
  height: 88px !important;
  border-radius: 10px !important;
  border: 1px dashed rgba(97, 20, 7, 0.22) !important;
  background: #F1E4CC !important;
  overflow: hidden;
  display: block;
  position: relative;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-dash-logo-ph {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
  height: 100%;
  padding: 8px 6px 6px;
  box-sizing: border-box;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-dash-logo-ph > svg {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  color: var(--rust, #933818);
}

/* Monogram fallback (unmapped category) shares the tile with the caption */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-dash-logo-ph .azedv-ccard__initials {
  font-size: 1.9rem;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-dash-logo-ph__text {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.3;
  color: rgba(97, 20, 7, 0.62);
  text-align: center;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-dash-logo-preview img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-v2-tags {
  overflow: visible;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-v2-pay {
  gap: 5px;
}

/* Dim the "upgrade me" icon while keeping its tooltip crisp. Opacity/filter on the
   wrapper would force the popup (a child) into the same compositing layer at 58%
   opacity — there's no way for a child to opt out of parent opacity. Targeting
   > *:not(.azedv-premium-pop) dims only the icon content. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-premium-feature--pay-icon {
  color: #B5AFA8 !important;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-premium-feature--pay-icon > *:not(.azedv-premium-pop) {
  opacity: 0.58;
  filter: grayscale(100%);
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-ci--premium-disabled {
  color: #B5AFA8 !important;
  cursor: help !important;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-ci--premium-disabled > *:not(.azedv-premium-pop) {
  opacity: 0.58;
  filter: grayscale(100%);
}

/* Brand glyphs (IG gradient, FB blue) keep their colors even when premium-locked —
   the lock affordance stays via cursor/popover; only line-art icons get dimmed. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-ci--ig.azedv-ci--premium-disabled > *:not(.azedv-premium-pop),
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-ci--fb.azedv-ci--premium-disabled > *:not(.azedv-premium-pop) {
  opacity: 1;
  filter: none;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-ci--premium-disabled:hover,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-ci--premium-disabled:focus-visible {
  background: rgba(97, 20, 7, 0.04) !important;
  color: #8E857B !important;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-desc-limit {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  padding: 2px 6px;
  border: 1px solid rgba(97, 20, 7, 0.14);
  border-radius: 3px;
  color: #8E857B;
  background: rgba(245, 226, 208, 0.55);
  font-size: 0.78rem;
  white-space: nowrap;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-v2-upgrade-wrap {
  justify-self: end;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  text-align: right;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-v2-upgrade-note {
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.78rem;
  line-height: 1.25;
  color: #8E857B;
}

/* "+" premium preview button — dashed-circle affordance that summarizes the
   entire upgrade package on hover. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--add {
  position: relative;
  color: var(--text-secondary, #6B6560);
  border-radius: 999px;
  transition: color 0.12s ease, background 0.12s ease;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--add:hover {
  color: var(--terracotta, #C96A4A);
  background: rgba(201, 106, 74, 0.08);
}

/* Popover — peach/porcelain card that appears below the "+" icon on hover.
   Bold heading + lighter parenthetical subtitle, no separate CTA (the icon
   itself is the link to the edit form). */
.azedv-ci-pop {
  position: absolute;
  top: calc(100% + 10px);
  left: -8px;
  z-index: 50;
  min-width: 200px;
  max-width: 240px;
  padding: 10px 14px 11px;
  background: var(--porcelain, #F5E2D0);
  border: 1.5px solid rgba(97, 20, 7, 0.22);
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(97, 20, 7, 0.14);
  font-family: var(--font-body, Inter, sans-serif);
  text-align: left;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-2px);
  transition: opacity 0.12s ease, transform 0.12s ease, visibility 0.12s;
  pointer-events: none;
  white-space: normal;
}

.azedv-ci--add:hover .azedv-ci-pop,
.azedv-ci--add:focus-visible .azedv-ci-pop {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.azedv-ci-pop__label {
  display: block;
  font-size: 0.9rem;
  line-height: 1.25;
  color: var(--charcoal, #333333);
  font-weight: 600;
  margin-bottom: 5px;
}

.azedv-ci-pop__text {
  display: block;
  font-size: 0.82rem;
  line-height: 1.35;
  color: #6B6560;
}

/* Lift the hovered card above siblings so popups paint above the next listing's text.
   The dashboard card is .hp-listing--view-block (display: grid) with no `position`, so
   `z-index` only takes effect once we make it positioned. Without this, popups escaping
   the card boundary land behind the next sibling card's content. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card {
  position: relative;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card:hover,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card:focus-within {
  z-index: 50;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--add:hover {
  z-index: 60;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--premium-disabled {
  position: relative;
}

/* The premium-feature wrappers have opacity < 1 and/or filter (the dimmed "upgrade me"
   look). Both create a stacking context that traps the popup's z-index inside, so
   sibling DOM (description, tags) paints above the popup. Lifting the wrapper itself
   when its popup is shown moves the whole context above siblings. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature:hover,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature:focus-within,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--premium-disabled:hover,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--premium-disabled:focus-within {
  z-index: 80;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  cursor: help;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature--logo {
  display: block;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature--bullets {
  display: block;
  flex: 0 0 auto;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-premium-feature--bullets .azedv-v2-bullets {
  color: #A89F94 !important;
  opacity: 0.85;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-premium-feature--bullets .azedv-v2-bullets li::marker {
  color: #A89F94;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature--contact {
  justify-self: center;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-pop {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  z-index: 70;
  width: 220px;
  padding: 9px 11px 10px;
  background: #FFFFFF;
  border: 1px solid rgba(97, 20, 7, 0.16);
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(97, 20, 7, 0.10);
  font-family: var(--font-body, Inter, sans-serif);
  text-align: left;
  white-space: normal;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -2px);
  transition: opacity 0.12s ease, transform 0.12s ease, visibility 0.12s;
  pointer-events: none;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-pop__heading {
  display: block;
  margin-bottom: 3px;
  color: var(--charcoal, #333333);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-pop__text {
  display: block;
  color: #6B6560;
  font-size: 0.78rem;
  line-height: 1.35;
}

body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature:hover > .azedv-premium-pop,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-premium-feature:focus-visible > .azedv-premium-pop,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--premium-disabled:hover > .azedv-premium-pop,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-ci--premium-disabled:focus-visible > .azedv-premium-pop {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

/* Disabled Contact Provider preview — same green pill as the parent view,
   but visibly inactive. The dashboard mirrors the parent-facing card so
   the vendor sees their listing exactly as parents see it; the button
   itself can't fire (vendors don't contact themselves). */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-contact--placeholder {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 26px;
  background: #1F3A1F;
  color: #FFFFFF !important;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  white-space: nowrap;
  opacity: 0.45;
  cursor: default;
  filter: grayscale(40%);
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-contact--placeholder svg {
  color: #E8B93B;
}

/* Placeholder bullets / payment tags / description — render the full layout
   even when the vendor hasn't filled these in, greyed so they read as
   prompts to add content. Matches the contact-icon placeholder pattern. */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-bullets--placeholder,
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-desc--placeholder {
  color: #A89F94 !important;
  opacity: 0.85;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-tags--placeholder {
  opacity: 1;
  filter: none;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card .azedv-v2-tags--placeholder .azedv-v2-pay {
  color: var(--charcoal, #333333);
}

/* Mobile: stack sidebar above content, drop custom widths. */
@media (max-width: 900px) {
  body.azedv-account-wide .hp-page__sidebar.hp-col-sm-4,
  body.azedv-account-wide .hp-page__content.hp-col-sm-8 {
    flex: 1 1 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0;
    padding-right: 0;
    border-right: none;
  }
  body.azedv-account-wide .hp-page__sidebar.hp-col-sm-4 {
    margin-top: 0;
  }
  body.azedv-account-wide .hp-page__sidebar {
    border-bottom: 1px solid var(--divider, rgba(51, 51, 51, 0.12));
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
  }
}

/* ==========================================================================
   Footer
   ========================================================================== */

/* Hide parent theme footer */
.footer-section,
footer.site-footer,
.site-footer {
  display: none !important;
}

.azedv-footer {
  background: var(--charcoal, #333333);
  padding: 4rem 2rem 2.5rem;
  font-family: var(--font-body, Inter, sans-serif);
}

.azedv-footer__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.azedv-footer__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
  align-items: start;
  padding-left: 100px;
}

.azedv-footer__logo-link {
  display: inline-block;
  line-height: 0;
}

.azedv-footer__logo {
  display: block;
  max-width: 200px;
  width: 100%;
  height: auto;
  /* The source PNG has ~24% transparent padding top and ~22% bottom;
     pull the visible logo up so its top aligns with sibling column headers. */
  margin-top: -3rem;   /* -48px at default root font size */
  margin-bottom: -2.75rem; /* -44px — trims trailing transparent padding */
}

.azedv-footer__col--brand a.azedv-footer__logo-link {
  padding: 0;
}

.azedv-footer__col h4 {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--terra, #C9B089);
  margin-bottom: 1rem;
}

.azedv-footer__col a {
  display: block;
  font-size: 0.85rem;
  color: var(--text-light, #9A9389);
  text-decoration: none;
  padding: 0.3rem 0;
  transition: color 0.2s;
  font-weight: 300;
}

.azedv-footer__col a:hover {
  color: var(--warm-sand, #E7D3A8);
}

.azedv-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.azedv-footer__bottom p {
  font-size: 0.8rem;
  color: var(--text-light, #9A9389);
  font-weight: 300;
  margin: 0;
}

.azedv-footer__copyright {
  display: flex;
  flex-direction: column;
}

.azedv-footer__tagline {
  font-size: 0.9rem;
  color: var(--warm-sand, #E7D3A8);
  margin: 0.35rem 0 0;
  letter-spacing: 0.02em;
}

.azedv-footer__disclaimer {
  flex: 0 1 30rem;
  max-width: 30rem;
  text-align: center;
  padding: 0 1.5rem;
}

.azedv-footer__disclaimer p {
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--text-light, #9A9389);
  font-weight: 300;
  margin: 0;
  font-style: italic;
}

.azedv-footer__legal {
  display: flex;
  gap: 1.5rem;
}

.azedv-footer__legal a {
  font-size: 0.8rem;
  color: var(--text-light, #9A9389);
  text-decoration: none;
  font-weight: 300;
  transition: color 0.2s;
}

.azedv-footer__legal a:hover {
  color: var(--warm-sand, #E7D3A8);
}

/* "Stay updated" newsletter signup (Substack) — sits in the Contact column.
   Markup uses these classes but the styling was never added to style.css, so the
   button fell back to the plain .azedv-footer__col a link and the description text
   inherited dark charcoal on the dark footer (invisible). These rules restore the
   visible description + the sage Subscribe button. */
.azedv-footer__newsletter {
  margin-top: 1.75rem;
}

.azedv-footer__newsletter-text {
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--text-light, #9A9389);
  font-weight: 300;
  margin: 0 0 1.15rem;
  max-width: 22rem;
}

/* Scoped to beat the generic ".azedv-footer__col a" (0,1,1) which is otherwise
   more specific than a bare ".azedv-footer__newsletter-btn" (0,1,0). */
.azedv-footer__col a.azedv-footer__newsletter-btn {
  display: inline-block;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #fff;
  background: var(--desert-sage, #7F9C8C);
  padding: 0.7rem 1.5rem;
  text-decoration: none;
  transition: background 0.2s;
}

.azedv-footer__col a.azedv-footer__newsletter-btn:hover {
  background: var(--desert-sage-hover, #6B8A79);
  color: #fff;
}

.azedv-footer__col a.azedv-footer__facebook {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.5rem;
  padding: 0;
  color: var(--text-light, #9A9389);
}

.azedv-footer__col a.azedv-footer__facebook:hover {
  color: var(--warm-sand, #E7D3A8);
}


@media (max-width: 768px) {
  .azedv-footer {
    padding: 3rem 1.25rem 2rem;
  }

  .azedv-footer__grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding-left: 0;
    text-align: center;
    justify-items: center;
  }

  .azedv-footer__col {
    width: 100%;
  }

  .azedv-footer__col--brand {
    order: -1;
  }

  .azedv-footer__logo-link {
    display: inline-block;
  }

  .azedv-footer__logo {
    margin-left: auto;
    margin-right: auto;
  }

  .azedv-footer__col a {
    text-align: center;
  }

  .azedv-footer__bottom {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }

  .azedv-footer__disclaimer {
    padding: 0;
    /* Desktop's flex: 0 1 30rem becomes a VERTICAL basis once __bottom goes
       flex-direction: column, inflating the disclaimer to ~30rem tall. */
    flex-basis: auto;
    margin-bottom: 1rem; /* + the column's 1rem gap ≈ two blank lines before the legal links */
  }

  .azedv-footer__legal {
    justify-content: center;
  }
}

/* ==========================================================================
   EXPAND YOUR BUSINESS — Vendor CTA section (replaces trust-bar)
   ========================================================================== */

/* ==========================================================================
   HOME FEATURE STRIP — pill divider between hero + categories.
   A rounded pill container holds 4 cards and visually bridges the two sections.
   Reuses .expand-business__cards + .expand-card styles from below.
   ========================================================================== */

.home-feature-strip {
  display: none !important;
  position: relative;
  z-index: 10;
  max-width: 960px;
  /* Straddle the hero bottom edge — half the 101px-tall pill sits inside
     the hero, the other half extends into the section below. Viewport-
     independent: overlap is a function of pill height, not vh. */
  margin: -50px auto 35px;
  padding: 0 2rem;
}

/* Pill container — compact, icon + title only */
.home-feature-strip .expand-business__cards {
  background: #FFFFFF;
  border: 1px solid var(--warm-sand);
  border-radius: 9999px;
  padding: 1rem 2.25rem;
  max-width: 860px;
  margin: 0 auto;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 8px 22px -14px rgba(97, 20, 7, 0.14);
  position: relative;
}

.home-feature-strip .expand-card {
  padding: 0.15rem 1.1rem;
  align-items: center;
  text-align: center;
}

.home-feature-strip .expand-card__imgwrap {
  width: 36px;
  height: 36px;
  margin-bottom: 0.55rem;
  border-radius: 10px;
}

.home-feature-strip .expand-card__title {
  font-size: 0.85rem !important;
  margin: 0 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.005em;
}

/* Compact pill: icon + title only, descriptions hidden */
.home-feature-strip .expand-card__desc {
  display: none;
}

@media (max-width: 1024px) {
  .hero-section {
    min-height: calc(100vh - 120px);
    padding: 2.5rem 2rem 5.5rem;
  }
  .home-feature-strip {
    margin: -100px auto -70px;
    padding: 0 1.75rem;
  }
  .home-feature-strip .expand-business__cards {
    border-radius: 9999px;
    padding: 0.9rem 1.75rem;
  }
}

@media (max-width: 820px) {
  .hero-section {
    min-height: auto;
    padding: 3rem 2rem 5rem;
  }
  .home-feature-strip {
    margin: -40px auto -15px;
    padding: 0 1.5rem;
  }
  .home-feature-strip .expand-business__cards {
    border-radius: 1.5rem;
    padding: 1.25rem 1.25rem;
  }
  .home-feature-strip .expand-card {
    padding: 0.15rem 0.6rem;
  }
}

@media (max-width: 600px) {
  .home-feature-strip {
    position: static;
    margin: 1rem auto;
    padding: 0 1rem;
  }
  .home-feature-strip .expand-business__cards {
    border-radius: 1.25rem;
    padding: 1.5rem 1rem;
  }
}

section.expand-business {
  /* Legacy — section removed from homepage, rules retained for card reuse */
  display: none !important;
}

.expand-business__inner {
  max-width: none;
  margin: 0;
  padding: 0 3.5rem;
  display: block;
  position: relative;
  z-index: 1;
}

/* --- Centered header --- */
.expand-business__header {
  text-align: center;
  max-width: 44rem;
  margin: 0 auto 3.75rem;
}

.expand-business__eyebrow {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--terracotta);
  margin: 0 0 1.25rem;
}

.expand-business__heading {
  font-family: var(--font-heading) !important;
  font-size: 2.75rem !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  color: var(--charcoal) !important;
  margin: 0 0 1.25rem !important;
  letter-spacing: -0.015em;
}

.expand-business__sub {
  font-family: var(--font-body);
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--text-secondary);
  font-weight: 400;
  margin: 0 auto;
  max-width: 38rem;
}

/* --- 4-column card row — borderless, separated by half-height vertical dividers --- */
.expand-business__cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  max-width: 1200px;
  margin: 0 auto;
}

/* Borderless cards — half-height vertical divider between each */
.expand-card {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0.5rem 2.25rem;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: transform 0.25s ease;
}

/* Half-height vertical divider between cards (not before the first) */
.expand-card + .expand-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 25%;
  bottom: 25%;
  width: 1px;
  background: rgba(51, 45, 35, 0.18);
}

.expand-card:hover {
  transform: translateY(-2px);
}

.expand-card__imgwrap {
  width: 64px;
  height: 64px;
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--porcelain);
  border: 1px solid var(--divider-light);
  border-radius: 14px;
  overflow: hidden;
}

.expand-card__imgwrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.expand-card__title {
  font-family: var(--font-heading) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  line-height: 1.3 !important;
  margin: 0 0 0.6rem !important;
  letter-spacing: -0.005em;
}

.expand-card__desc {
  font-family: var(--font-body);
  font-size: 0.88rem;
  line-height: 1.55;
  color: #4A453F;
  font-weight: 400;
  margin: 0;
}

/* --- Footer CTA (centered below cards) --- */
.expand-business__footer {
  text-align: center;
  margin-top: 3.5rem;
}

.expand-business__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #fff;
  background: var(--terracotta);
  border: 1px solid var(--terracotta);
  border-radius: 999px;
  padding: 1.05rem 2.25rem;
  text-decoration: none;
  transition: background 0.2s ease, border-color 0.2s ease, gap 0.2s ease, transform 0.2s ease;
  box-shadow: 0 1px 0 rgba(97, 20, 7, 0.08);
}

.expand-business__cta svg {
  transition: transform 0.2s ease;
}

.expand-business__cta:hover {
  background: var(--terracotta-hover);
  border-color: var(--terracotta-hover);
  color: #fff;
  gap: 0.9rem;
  transform: translateY(-1px);
}

.expand-business__cta:hover svg {
  transform: translateX(2px);
}

/* --- Responsive --- */
@media (max-width: 1024px) {
  .expand-business__inner {
    padding: 0 2rem;
  }

  .expand-business__heading {
    font-size: 2.4rem !important;
  }

  .expand-card {
    padding: 0.5rem 1.5rem;
  }
}

@media (max-width: 820px) {
  .expand-business__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2.25rem 0;
    max-width: 640px;
  }

  .expand-card {
    padding: 0.5rem 1.5rem;
  }

  /* Reset desktop divider for tablet; only show divider between columns (even-position cards) */
  .expand-card + .expand-card::before {
    display: none;
  }

  .expand-card:nth-child(even)::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 25%;
    bottom: 25%;
    width: 1px;
    background: rgba(51, 45, 35, 0.18);
  }
}

@media (max-width: 600px) {
  section.expand-business {
    padding: 4rem 0 !important;
  }

  .expand-business__inner {
    padding: 0 1.25rem;
  }

  .expand-business__header {
    margin-bottom: 2.5rem;
  }

  .expand-business__heading {
    font-size: 1.9rem !important;
  }

  .expand-business__cards {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .expand-card {
    padding: 0 0.5rem;
  }

  /* Remove all vertical dividers on mobile */
  .expand-card::before,
  .expand-card + .expand-card::before,
  .expand-card:nth-child(even)::before {
    display: none !important;
  }

  .expand-business__footer {
    margin-top: 2.5rem;
  }

  .expand-business__cta {
    width: 100%;
    justify-content: center;
  }
}

/* ==========================================================================
   HERO SEARCH — magnifying glass submit icon
   ========================================================================== */

/* Screen-reader-only (for icon button accessible label) */
.hero-section .hp-form .screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

/* Submit button — now icon-only: tighten padding */
.hero-section .hp-form button[type="submit"] {
  padding: 1.1rem 1.65rem !important;
  min-width: 0 !important;
}

.hero-section .hp-form .azedv-search-icon {
  display: block;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px;
  flex-shrink: 0;
  color: #ffffff;
  stroke: currentColor;
  fill: none;
}

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
  .hero-section .hp-form button[type="submit"] {
    padding: 0.95rem 1.15rem !important;
  }
}

/* Filters heading — sits flush above the filter list (no card seam) so the
   left column's first filter row aligns with the right column's topbar. */
.azedv-sidebar-v2 .azedv-filters-heading {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 1rem;
  padding: 0;
  border: none;
  letter-spacing: -0.01em;
  text-align: left;
  line-height: 1.2;
}

@media (max-width: 768px) {
  .azedv-sidebar-v2 .azedv-filters-heading {
    font-size: 1.4rem;
    margin-bottom: 0.75rem;
  }

  .azedv-sidebar-v2 > .azedv-mobile-filter-trigger.hp-button--listing-filter {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    width: 100%;
    margin: 0 0 0.75rem !important;
  }
}

/* ==========================================================================
   BROWSE VENDORS — SIDEBAR REDESIGN (v2)
   Vertical checklist layout w/ CATEGORIES / LOCATION / SERVICE TYPE sections
   ========================================================================== */

/* Drop the old right-divider; use a quiet card instead */
.azedv-sidebar-v2.hp-page__sidebar {
  border-right: none;
  padding-right: 0;
}

.azedv-sidebar-v2 .hp-widget--listing-filter {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

/* Section headers — uppercase, letter-spaced (matches reference) */
.azedv-sidebar-v2 .hp-form__field > .hp-form__label,
.azedv-sidebar-v2 .hp-form__field > .hp-field__label {
  display: block;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0 0 0.95rem;
  padding: 0;
}

/* Dividers between filter groups */
.azedv-sidebar-v2 .hp-form__field {
  margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--divider-light);
}

.azedv-sidebar-v2 .hp-form__field:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

/* --- CHECKBOX LISTS (Type / City) — override the homepage pill styling --- */

.azedv-sidebar-v2 .hp-field--checkboxes ul {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.6rem !important;
  list-style: none;
  padding: 0;
  margin: 0;
}

.azedv-sidebar-v2 .hp-field--checkboxes ul li {
  display: block !important;
  width: 100%;
}

.azedv-sidebar-v2 .hp-field--checkboxes .hp-field--checkbox,
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field__label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.65rem !important;
  width: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
  color: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 0.925rem !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  line-height: 1.4 !important;
  text-transform: none !important;
  border-radius: 0 !important;
  cursor: pointer;
  transition: color 0.15s ease;
}

.azedv-sidebar-v2 .hp-field--checkboxes .hp-field--checkbox:hover,
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field__label:hover {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--terracotta) !important;
}

/* Show the native checkbox (currently hidden via opacity:0) */
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field--checkbox input[type="checkbox"],
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field__label input[type="checkbox"] {
  opacity: 1 !important;
  position: static !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  pointer-events: auto !important;
  flex-shrink: 0;
  accent-color: var(--terracotta);
  cursor: pointer;
  appearance: auto;
  -webkit-appearance: auto;
}

/* Suppress the parent theme's custom checkbox pseudo-element — we use the native input here */
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field--checkbox span::before,
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field--checkbox span::after,
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field__label span::before,
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field__label span::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: none !important;
  width: 0 !important;
  height: 0 !important;
}

.azedv-sidebar-v2 .hp-field--checkboxes .hp-field--checkbox span,
.azedv-sidebar-v2 .hp-field--checkboxes .hp-field__label span {
  padding-left: 0 !important;
}

/* Checked state — no pill fill, terracotta text */
.azedv-sidebar-v2 .hp-field--checkbox:has(input:checked),
.azedv-sidebar-v2 .hp-field__label:has(input:checked) {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--terracotta) !important;
  font-weight: 600 !important;
}

.azedv-sidebar-v2 .hp-field--checkbox:has(input:checked) span,
.azedv-sidebar-v2 .hp-field__label:has(input:checked) span {
  color: var(--terracotta) !important;
}

/* --- CATEGORY RADIO LIST — styled to match the checkbox list --- */

.azedv-sidebar-v2 .hp-field--radio > ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Hide "All Categories" outer label — selecting none == all by default.
   The JS adds .azedv-hide to the wrapper if we keep only the nested list. */
.azedv-sidebar-v2 .hp-field--radio > ul > li > label {
  display: none;
}

.azedv-sidebar-v2 .hp-field--radio > ul > li > ul {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.azedv-sidebar-v2 .hp-field--radio > ul > li > ul > li > label {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  font-family: var(--font-body);
  font-size: 0.925rem;
  font-weight: 400;
  color: var(--charcoal);
  line-height: 1.4;
  cursor: pointer;
  transition: color 0.15s ease;
}

.azedv-sidebar-v2 .hp-field--radio > ul > li > ul > li > label:hover {
  color: var(--terracotta);
}

.azedv-sidebar-v2 .hp-field--radio > ul > li > ul > li > label:has(input:checked) {
  color: var(--terracotta);
  font-weight: 600;
}

.azedv-sidebar-v2 .hp-field--radio input[type="radio"] {
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--terracotta);
  cursor: pointer;
}

/* --- Filter form submit row --- */
.azedv-sidebar-v2 .hp-form__footer,
.azedv-sidebar-v2 .hp-form__actions {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
}

/* --- Responsive: mobile modal still needs some inner padding --- */
@media (max-width: 768px) {
  #listing_filter_modal.hp-modal--mobile .hp-form--listing-filter {
    padding: 1.25rem 1rem;
  }
}

/* ==========================================================================
   WARM EMPTY-STATE / 404 HELP BOX (2026-07-07 — replaces the bare "Nothing
   found" dead-end Nicole flagged in beta). Server-rendered by the child
   index.php else-branch and 404.php; embeds the sidebar's green mailto CTA.
   ========================================================================== */

.azedv-help-box {
  max-width: 560px;
  margin: 2.5rem auto 3rem;
  padding: 2.25rem 2rem;
  background: #FDF9F3;
  border: 1px solid rgba(122, 139, 124, 0.28);
  border-radius: 16px;
  text-align: center;
}
.azedv-help-box__heading {
  margin: 0 0 0.75rem;
  font-family: var(--font-display, 'Merriweather', serif);
  font-size: 1.5rem;
  color: var(--charcoal, #3E3A36);
}
.azedv-help-box__body {
  margin: 0 0 1.5rem;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--charcoal, #3E3A36);
}
.azedv-help-box__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}
.azedv-help-box__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  background: var(--desert-sage) !important;
  border: 2px solid var(--desert-sage) !important;
  border-radius: 8px;
  color: #ffffff !important;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-weight: 700;
  text-decoration: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.azedv-help-box__cta:hover,
.azedv-help-box__cta:focus {
  background: var(--charcoal, #3E3A36) !important;
  border-color: var(--charcoal, #3E3A36) !important;
  color: #ffffff !important;
}
.azedv-help-box__cta i { color: #ffffff !important; font-size: 14px; }
.azedv-help-box__secondary {
  color: var(--terracotta, #C06E52);
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.azedv-help-box__help {
  margin: 1rem 0 0;
  font-size: 0.88rem;
  font-style: italic;
  color: rgba(62, 58, 54, 0.65);
}
/* Desktop-only pointer toward the green CTA at the bottom of the left filter
   panel — on mobile that panel is collapsed behind the Filter button, so the
   hint would point at nothing (the embedded CTA above covers mobile). */
.azedv-help-box__hint {
  margin: 1.25rem 0 0;
  font-size: 0.92rem;
  color: rgba(62, 58, 54, 0.75);
}
.azedv-help-box__hint-arrow {
  display: inline-block;
  margin-right: 4px;
  font-size: 1.1rem;
  color: var(--desert-sage, #7A8B7C);
}
@media (max-width: 768px) {
  .azedv-help-box__hint { display: none; }
  .azedv-help-box { margin: 1.5rem auto 2rem; padding: 1.75rem 1.25rem; }
}
.azedv-404-main { padding: 3rem 1rem 4rem; }

/* ==========================================================================
   VENDOR REQUEST PAGE — editorial southwest layout
   Scoped to .vr-page to avoid collisions with ExpertHive/HivePress styles.
   ========================================================================== */

/* Hide the default ExpertHive page title header on this custom layout */
.page-id-90 .header-hero--title,
.page-id-90 .header-hero {
  display: none !important;
}

/* Let the vr-page break out of any parent padding/max-width constraints */
.page-id-90 .hp-page__content,
.page-id-90 .entry-content,
.page-id-90 .site-content,
.page-id-90 .page__content,
.page-id-90 main {
  padding: 0 !important;
  max-width: none !important;
}

/* Hide the default WP page title on the Vendor Request page — the .vr-hero
   carries the page title itself. */
body.page-id-90 .page__title.entry-title,
body.page-id-90 .hp-page__title {
  display: none !important;
}

/* Full-bleed escape from the parent theme's constrained container so the
   hero and every section band (vr-why, vr-visibility, vr-featured,
   vr-bottom-cta) can reach the viewport edges. */
.vr-page {
  background: var(--porcelain);
  color: var(--charcoal);
  font-family: var(--font-body);
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  position: relative;
}

.vr-page * { box-sizing: border-box; }

.vr-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 2rem;
}

/* ---------- Shared typography ---------- */

.vr-eyebrow,
.vr-featured-kicker,
.vr-tier-kicker {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rust);
  margin: 0 0 0.75rem;
}

.vr-section-title {
  font-family: var(--font-heading);
  font-size: 2.25rem;
  font-weight: 800;
  line-height: 1.2;
  color: var(--charcoal);
  margin: 0 0 0.9rem;
}

/* ---------- Buttons ---------- */

.vr-btn {
  display: inline-block;
  font-family: var(--font-nav);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 1rem 2.25rem;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.vr-btn-primary {
  background: var(--terracotta);
  color: #fff;
}

.vr-btn-primary:hover {
  background: var(--sienna);
  color: #fff;
  transform: translateY(-1px);
}

.vr-btn-cta {
  background: var(--warm-sand);
  color: var(--umber);
}

.vr-btn-cta:hover {
  background: var(--porcelain);
  color: var(--umber);
}

/* ==========================================================================
   HERO
   ========================================================================== */

.vr-hero {
  padding: 5rem 0 5.5rem;
  position: relative;
  background:
    radial-gradient(ellipse at 85% 15%, rgba(201, 106, 74, 0.08) 0%, transparent 55%),
    var(--porcelain);
}

.vr-hero-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 2rem;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 4rem;
  align-items: center;
}

.vr-hero-content {
  max-width: 520px;
}

.vr-hero-heading {
  font-family: var(--font-heading);
  font-size: 3.25rem;
  font-weight: 900;
  line-height: 1.1;
  color: var(--charcoal);
  margin: 0 0 1.1rem;
}

.vr-hero-heading em {
  font-style: italic;
  color: var(--sienna);
  font-weight: 800;
}

.vr-hero-sub {
  font-size: 1.125rem;
  line-height: 1.65;
  color: var(--charcoal);
  margin: 0 0 2rem;
  font-weight: 400;
}

.vr-hero-note {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 1.25rem 0 0;
}

.vr-hero-image {
  position: relative;
}

.vr-hero-image img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 2px;
  box-shadow:
    0 1px 0 rgba(97, 20, 7, 0.04),
    0 30px 60px -20px rgba(97, 20, 7, 0.18);
}

/* Decorative curator badge floating over the photo */
.vr-hero-badge {
  position: absolute;
  top: -18px;
  right: -18px;
  background: var(--warm-sand);
  color: var(--umber);
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 0.95rem;
  line-height: 1.3;
  padding: 1rem 1.25rem;
  max-width: 200px;
  text-align: center;
  transform: rotate(3deg);
  box-shadow: 0 10px 30px -10px rgba(97, 20, 7, 0.25);
}

.vr-hero-badge::before {
  content: '';
  display: block;
  width: 32px;
  height: 2px;
  background: var(--terracotta);
  margin: 0 auto 0.5rem;
}

/* ==========================================================================
   WHY PROVIDERS LIST HERE
   Editorial 3-column — no card containers, subtle vertical dividers only.
   ========================================================================== */

.vr-why {
  padding: 5.5rem 0 5rem;
  background: var(--bg-warm);
  border-top: 1px solid var(--divider);
  border-bottom: 1px solid var(--divider);
}

.vr-why-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 3.5rem;
}

.vr-why-header .vr-section-title {
  font-size: 2rem;
}

.vr-why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  position: relative;
}

.vr-why-item {
  padding: 0 2rem;
  text-align: center;
  position: relative;
}

.vr-why-item + .vr-why-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 12%;
  bottom: 12%;
  width: 1px;
  background: var(--divider);
}

.vr-why-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: var(--terracotta);
  margin-bottom: 1.1rem;
}

.vr-why-icon svg {
  width: 100%;
  height: 100%;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-why-title {
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 0.6rem;
  line-height: 1.35;
}

.vr-why-desc {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0;
}

.vr-why-note {
  text-align: center;
  max-width: 620px;
  margin: 3rem auto 0;
  font-size: 0.9rem;
  font-style: italic;
  color: var(--text-secondary);
  padding-top: 2rem;
  border-top: 1px solid var(--divider);
}

/* ==========================================================================
   VISIBILITY OPTIONS / LISTING OPTIONS
   ========================================================================== */

.vr-visibility {
  padding: 6rem 0;
  background: var(--porcelain);
}

/* Listing Options cards (replaces static image) */
.vr-lo-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 3rem;
}

.vr-lo-sub {
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0.75rem 0 0;
}

.vr-lo-grid {
  display: grid;
  grid-template-columns: minmax(320px, 420px) minmax(480px, 680px);
  gap: 2rem;
  max-width: 1120px;
  margin: 0 auto;
  align-items: stretch;
}

.vr-lo-card {
  position: relative;
  background: #ffffff;
  border-radius: 10px;
  padding: 2.25rem 2rem 2rem;
  border: 2px solid transparent !important;
  box-shadow: 0 1px 2px rgba(51, 51, 51, 0.04);
  transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.vr-lo-card:hover,
.vr-lo-card:focus-within {
  border-color: var(--terracotta) !important;
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(201, 106, 74, 0.14);
}

.vr-lo-card--premium {
  padding-top: 2.75rem;
}

.vr-lo-badge {
  position: absolute;
  top: -0.75rem;
  left: 1.75rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: var(--terracotta);
  color: #ffffff;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  text-transform: uppercase;
}

.vr-lo-badge svg {
  width: 12px;
  height: 12px;
  fill: #ffffff;
}

.vr-lo-card-head {
  text-align: left;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--divider-light);
}

.vr-lo-title {
  font-family: var(--font-heading);
  font-size: 1.9rem;
  font-weight: 700;
  margin: 0 0 0.45rem;
  line-height: 1.15;
  color: #2E4E26;
}

.vr-lo-card--premium .vr-lo-title {
  color: var(--charcoal);
}

.vr-lo-sub-text {
  color: var(--text-secondary);
  font-size: 0.98rem;
  margin: 0;
  line-height: 1.5;
}

.vr-lo-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.vr-lo-features li {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  font-size: 0.98rem;
  line-height: 1.45;
  color: var(--charcoal);
}

.vr-lo-features li em {
  font-style: normal;
  color: var(--text-secondary);
}

.vr-lo-check {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  display: inline-flex;
  margin-top: 2px;
}

.vr-lo-check svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: var(--desert-sage);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-lo-card--premium .vr-lo-features .vr-lo-check svg {
  stroke: var(--terracotta);
}

.vr-lo-feat-icon {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  display: inline-flex;
  margin-top: 0;
}

.vr-lo-feat-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: var(--charcoal);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-lo-feat-icon--star svg {
  fill: var(--terracotta);
  stroke: var(--terracotta);
}

.vr-lo-feature--highlight {
  background: #E4EEE4;
  border-radius: 6px;
  padding: 0.85rem 0.95rem;
}

.vr-lo-feature--highlight strong {
  color: var(--desert-sage);
  font-weight: 700;
}

/* BASIC middle callout */
.vr-lo-middle {
  background: #E4EEE4;
  border-radius: 8px;
  padding: 1.25rem 1.1rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  color: #2E4E26;
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.3;
}

.vr-lo-middle-circle {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #D1E0D1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.vr-lo-middle-circle svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: #2E4E26;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-lo-middle p {
  margin: 0;
}

/* PREMIUM pricing block — one unified sand container */
.vr-lo-price-block {
  background: #F3DDB8;
  border-radius: 8px;
  padding: 1rem 1.1rem;
}

.vr-lo-price-row {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 1rem;
  align-items: stretch;
}

.vr-lo-price-row > div + div {
  border-left: 1px solid rgba(146, 100, 60, 0.3);
  padding-left: 1rem;
}

.vr-lo-price-founder,
.vr-lo-price-regular {
  text-align: left;
}

.vr-lo-price-label {
  font-size: 0.85rem;
  color: var(--charcoal);
  line-height: 1.3;
  margin: 0 0 0.35rem;
}

.vr-lo-price-label strong {
  font-weight: 700;
}

.vr-lo-price-label span {
  color: var(--text-secondary);
}

.vr-lo-price-big {
  font-family: var(--font-heading);
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--terracotta);
  margin: 0;
  line-height: 1.2;
}

.vr-lo-price-or {
  font-weight: 400;
}

.vr-lo-price-med {
  font-weight: 700;
  font-size: 1rem;
  color: var(--charcoal);
  margin: 0;
  line-height: 1.25;
}

.vr-lo-price-note {
  font-size: 0.85rem;
  font-style: italic;
  color: var(--sienna);
  text-align: center;
  margin: 0.75rem 0 0;
}

/* PREMIUM split: features left, highlights stacked right */
.vr-lo-split {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 1rem;
  align-items: start;
}

.vr-lo-highlights {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.vr-lo-highlight {
  background: #F5E4CF;
  border-radius: 8px;
  padding: 0.9rem 1rem;
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
}

.vr-lo-highlight-icon {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}

.vr-lo-highlight-icon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: var(--desert-sage);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-lo-highlight-body {
  flex: 1;
  min-width: 0;
}

.vr-lo-highlight h4 {
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--rust);
  margin: 0 0 0.2rem;
  line-height: 1.25;
}

.vr-lo-highlight p {
  font-size: 0.82rem;
  color: var(--charcoal);
  line-height: 1.4;
  margin: 0 0 0.55rem;
}

.vr-lo-esa-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: #DFEBDE;
  color: #2E4E26;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
}

.vr-lo-esa-badge svg {
  width: 12px;
  height: 12px;
  fill: none;
  stroke: var(--desert-sage);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-lo-pay-badges {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.vr-lo-pay-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
}

.vr-lo-pay-badge svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-lo-pay-badge--cw {
  background: #D6E3D4;
  color: #2E4E26;
}

.vr-lo-pay-badge--cw svg {
  stroke: #2E4E26;
}

.vr-lo-pay-badge--debit {
  background: #D9DCF0;
  color: #3B3F7A;
}

.vr-lo-pay-badge--debit svg {
  stroke: #3B3F7A;
}

/* CTAs */
.vr-lo-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1rem 1.5rem;
  border-radius: 8px;
  font-family: var(--font-nav);
  font-weight: 700;
  font-size: 1.05rem;
  text-decoration: none !important;
  transition: background 0.2s ease, transform 0.2s ease;
  border: none;
  width: 100%;
  box-sizing: border-box;
  margin-top: auto;
}

.vr-lo-arrow {
  font-size: 1.15em;
  line-height: 1;
}

.vr-lo-cta--basic {
  background: #2E4E26 !important;
  color: #ffffff !important;
}

.vr-lo-cta--basic:hover {
  background: #24401E !important;
  transform: translateY(-1px);
}

.vr-lo-cta--premium {
  background: var(--terracotta) !important;
  color: #ffffff !important;
}

.vr-lo-cta--premium:hover {
  background: var(--terracotta-hover) !important;
  transform: translateY(-1px);
}

.vr-lo-terms {
  text-align: center;
  font-size: 0.9rem;
  color: #3B3F7A !important;
  text-decoration: underline !important;
  margin: 0 auto;
}

.vr-lo-terms:hover {
  color: var(--terracotta) !important;
}

@media (max-width: 900px) {
  .vr-lo-grid {
    grid-template-columns: 1fr;
    max-width: 560px;
  }
  .vr-lo-split { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .vr-lo-price-row { grid-template-columns: 1fr; }
  .vr-lo-price-row > div + div {
    border-left: none;
    border-top: 1px solid rgba(146, 100, 60, 0.3);
    padding-left: 0;
    padding-top: 0.75rem;
  }
  .vr-lo-card { padding: 2rem 1.5rem; }
  .vr-lo-card--premium { padding-top: 2.5rem; }
}

/* Legacy classes kept for backwards compatibility */
.vr-visibility-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 3.5rem;
}

.vr-visibility-sub {
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0;
}

.vr-tiers {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}

.vr-tier {
  padding: 2.75rem 2.5rem;
  position: relative;
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 4px;
}

.vr-tier + .vr-tier::before {
  content: none;
}

.vr-tier-title {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--charcoal);
  margin: 0 0 0.65rem;
  line-height: 1.2;
}

.vr-tier-desc {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0 0 1.75rem;
}

.vr-feature-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
}

.vr-feature-list li {
  position: relative;
  padding: 0.55rem 0 0.55rem 1.9rem;
  font-size: 0.98rem;
  line-height: 1.5;
  color: var(--charcoal);
  border-bottom: 1px solid var(--divider-light);
}

.vr-feature-list li:last-child {
  border-bottom: none;
}

.vr-feature-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237F9C8C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
  background-repeat: no-repeat;
  background-size: 16px;
}

.vr-tier-footnote {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-light);
  margin: 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--divider);
}

.vr-tier-upgraded .vr-tier-kicker {
  color: var(--desert-sage);
}

/* ==========================================================================
   FEATURED PLACEMENT ADD-ON
   ========================================================================== */

.vr-featured {
  padding: 4rem 0;
  background: var(--bg-warm);
  border-top: 1px solid var(--divider);
  border-bottom: 1px solid var(--divider);
}

/* Functional featured-placement card (replaces static image, ~25% smaller) */
.vr-fp-card {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 2.5rem;
  align-items: center;
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem 2.25rem;
  background: var(--porcelain);
  border: 2px solid transparent !important;
  border-radius: 10px;
  transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.vr-fp-card:hover,
.vr-fp-card:focus-within {
  border-color: var(--terracotta) !important;
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(201, 106, 74, 0.18);
}

.vr-fp-eyebrow {
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--terracotta);
  margin: 0 0 0.6rem;
}

.vr-fp-title {
  font-family: var(--font-heading);
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 0.6rem;
  line-height: 1.2;
}

.vr-fp-desc {
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--charcoal);
  margin: 0 0 1rem;
}

.vr-fp-features {
  list-style: none;
  padding: 0;
  margin: 0 0 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.vr-fp-features li {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--charcoal);
}

.vr-fp-check {
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  display: inline-flex;
  margin-top: 2px;
}

.vr-fp-check svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: var(--desert-sage);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vr-fp-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  border-radius: 8px;
  font-family: var(--font-nav);
  font-weight: 700;
  font-size: 0.92rem;
  background: var(--terracotta) !important;
  color: #ffffff !important;
  text-decoration: none !important;
  border: none;
  transition: background 0.2s ease, transform 0.2s ease;
  align-self: flex-start;
}

.vr-fp-cta:hover {
  background: var(--terracotta-hover) !important;
  transform: translateY(-1px);
}

.vr-fp-arrow {
  font-size: 1.1em;
  line-height: 1;
}

.vr-fp-preview {
  display: flex;
  justify-content: center;
}

.vr-fp-mock {
  background: #ffffff;
  border: 2px solid var(--terracotta);
  border-radius: 8px;
  padding: 1rem 1.1rem;
  width: 100%;
  max-width: 260px;
  box-shadow: 0 4px 12px rgba(201, 106, 74, 0.12);
}

.vr-fp-mock-badge {
  display: inline-block;
  background: var(--terracotta);
  color: #ffffff;
  font-family: var(--font-nav);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 0.25rem 0.55rem;
  border-radius: 4px;
  margin-bottom: 0.6rem;
}

.vr-fp-mock-name {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 0.3rem;
  line-height: 1.2;
}

.vr-fp-mock-meta {
  font-size: 0.78rem;
  color: var(--text-secondary);
  margin: 0 0 0.65rem;
  line-height: 1.4;
}

.vr-fp-mock-esa {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  background: #DFEBDE;
  color: #2E4E26;
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.3rem 0.6rem;
  border-radius: 999px;
}

.vr-fp-mock-esa svg {
  width: 11px;
  height: 11px;
  fill: none;
  stroke: var(--desert-sage);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 640px) {
  .vr-fp-card {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    padding: 1.75rem 1.5rem;
  }
  .vr-fp-preview { order: -1; }
}

.vr-featured-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 4rem;
  align-items: center;
  max-width: 1000px;
  margin: 0 auto;
}

.vr-featured-content .vr-section-title {
  font-size: 1.85rem;
}

.vr-featured-desc {
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--charcoal);
  margin: 0 0 1.25rem;
}

.vr-featured-availability {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-light);
  margin: 0;
}

/* Mini sample listing — represents what a Featured listing looks like */
.vr-listing-sample {
  background: #fff;
  border: 1px solid var(--divider);
  border-left: 4px solid var(--terracotta);
  padding: 1.5rem 1.75rem;
  position: relative;
  font-family: var(--font-body);
}

.vr-sample-badge {
  display: inline-block;
  background: var(--terracotta);
  color: #fff;
  font-family: var(--font-nav);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.3rem 0.6rem;
  margin-bottom: 0.75rem;
}

.vr-sample-title {
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 0.35rem;
  line-height: 1.3;
}

.vr-sample-meta {
  font-size: 0.82rem;
  color: var(--text-secondary);
  margin: 0;
  font-family: var(--font-nav);
}

.vr-sample-meta span {
  color: var(--divider);
  margin: 0 0.35rem;
}

/* ==========================================================================
   BOTTOM CTA
   ========================================================================== */

.vr-bottom-cta {
  padding: 2.75rem 2rem 4.25rem;
  background: var(--desert-sage-hover);
  text-align: center;
}

.vr-bottom-cta h2 {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--porcelain);
  margin: 0 0 0.5rem;
}

.vr-bottom-cta p {
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--warm-sand);
  max-width: 520px;
  margin: 0 auto 1.25rem;
  font-weight: 300;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 900px) {
  .vr-hero { padding: 3.5rem 0 4rem; }
  .vr-hero-inner {
    grid-template-columns: 1fr;
    gap: 2.75rem;
  }
  .vr-hero-content { max-width: none; text-align: center; margin: 0 auto; }
  .vr-hero-heading { font-size: 2.5rem; }
  .vr-hero-badge { right: 12px; top: -14px; font-size: 0.85rem; }

  .vr-why { padding: 4rem 0; }
  .vr-why-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .vr-why-item { padding: 0; }
  .vr-why-item + .vr-why-item::before {
    left: 10%; right: 10%; top: -1.25rem; bottom: auto;
    width: auto; height: 1px;
  }

  .vr-visibility { padding: 4rem 0; }
  .vr-tiers {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .vr-tier { padding: 2.25rem 1.75rem; }

  .vr-featured { padding: 4rem 0; }
  .vr-featured-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    text-align: center;
  }
  .vr-listing-sample { max-width: 380px; margin: 0 auto; text-align: left; }

  .vr-bottom-cta { padding: 2rem 2rem 3.5rem; }
  .vr-section-title { font-size: 1.85rem; }
}

@media (max-width: 560px) {
  .vr-container { padding: 0 1.25rem; }
  .vr-hero-inner { padding: 0 1.25rem; }
  .vr-hero-heading { font-size: 2.1rem; }
  .vr-hero-sub { font-size: 1rem; }
  .vr-btn { padding: 0.85rem 1.75rem; font-size: 0.8rem; }
  .vr-tier-title { font-size: 1.4rem; }
}

/* ==========================================================================
   ABOUT PAGE — Editorial Southwest layout
   Kinfolk magazine meets warm Arizona resource.
   No rounded shadow cards, no icon-grid-of-4, no glassmorphism.
   Asymmetric columns, generous whitespace, editorial type.
   ========================================================================== */

/* Hide the default WP page title on the About page — the editorial hero
   carries the page title itself. Hide the parent theme's whole header-hero
   section too (same as page-id-90 and the terms pages): with only the h1
   hidden, the section survives as an empty strip whose dots.svg background
   shows between the header and the hero on mobile. */
body.page-id-91 .header-hero--title,
body.page-id-91 .header-hero,
body.page-id-91 .page__title.entry-title,
body.page-id-91 .hp-page__title {
  display: none !important;
}

/* Full-bleed escape from the parent theme's constrained container so the
   hero, pullquote, and closing bands can reach the viewport edges. */
.about-page {
  background: var(--bg-warm);
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  position: relative;
}

/* --- Hero ------------------------------------------------------------ */
.about-hero {
  position: relative;
  min-height: calc(60vh - 144px);
  padding: 6rem 2rem 7rem;
  background: radial-gradient(
    ellipse at center,
    var(--warm-sand-light) 0%,
    var(--porcelain) 55%,
    var(--warm-sand) 100%
  );
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
}

.about-hero::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 1px;
  background: var(--divider);
}

.about-hero-inner {
  max-width: 760px;
  position: relative;
  z-index: 2;
}

.about-eyebrow {
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rust);
  margin: 0 0 1.25rem;
}

.about-hero-heading {
  font-family: var(--font-heading) !important;
  font-size: 3.25rem !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  color: var(--charcoal) !important;
  margin: 0 0 1.5rem !important;
  letter-spacing: -0.015em;
}

.about-hero-heading em {
  font-style: italic;
  color: var(--sienna);
}

.about-hero-sub {
  font-family: var(--font-body);
  font-size: 1.15rem;
  line-height: 1.7;
  color: var(--charcoal);
  max-width: 620px;
  margin: 0 auto;
  font-weight: 400;
}

/* --- Shared section shell ------------------------------------------- */
.about-section {
  max-width: 1160px;
  margin: 0 auto;
  padding: 6rem 2rem;
}

/* --- Editorial prose block (text-only) ----------------------------- */
.about-split {
  max-width: 720px;
  margin: 0 auto;
}

.about-split__eyebrow {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--terracotta);
  margin: 0 0 1.25rem;
  display: block;
}

.about-split__heading {
  font-family: var(--font-heading) !important;
  font-size: 2.35rem !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  color: var(--charcoal) !important;
  margin: 0 0 1.5rem !important;
  letter-spacing: -0.01em;
}

.about-split__heading em {
  font-style: italic;
  color: var(--sienna);
}

.about-split__body p {
  font-family: var(--font-body);
  font-size: 1.075rem;
  line-height: 1.8;
  color: var(--charcoal);
  margin: 0 0 1.25rem;
}

.about-split__body p:last-child { margin-bottom: 0; }

/* --- Pull-quote band ------------------------------------------------ */
.about-pullquote {
  background: var(--porcelain);
  border-top: 1px solid var(--divider);
  border-bottom: 1px solid var(--divider);
  padding: 6rem 2rem;
  text-align: center;
}

.about-pullquote-inner {
  max-width: 820px;
  margin: 0 auto;
}

.about-pullquote__mark {
  font-family: var(--font-heading);
  font-size: 5rem;
  line-height: 0.5;
  color: var(--terracotta);
  display: block;
  margin: 0 0 1rem;
}

.about-pullquote__text {
  font-family: var(--font-heading) !important;
  font-size: 2rem !important;
  font-weight: 400 !important;
  font-style: italic;
  line-height: 1.4 !important;
  color: var(--charcoal) !important;
  margin: 0 0 1.5rem !important;
  letter-spacing: -0.005em;
}

.about-pullquote__rule {
  width: 64px;
  height: 2px;
  background: var(--terracotta);
  margin: 0 auto 1.5rem;
  border: 0;
}

.about-pullquote__sub {
  font-family: var(--font-body);
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--text-secondary);
  margin: 0 auto;
  max-width: 600px;
}

/* --- "Featured in" editorial marks --------------------------------- */
.about-featured {
  display: flex;
  align-items: baseline;
  gap: 1.5rem;
  margin: 2rem 0 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--divider);
  flex-wrap: wrap;
}

.about-featured__label {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0;
}

.about-featured__marks {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}

.about-featured__mark {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--charcoal);
  font-style: italic;
  letter-spacing: -0.005em;
}

.about-featured__mark em {
  color: var(--sienna);
  font-style: normal;
  font-weight: 400;
  font-size: 0.9rem;
  display: block;
  margin-top: 0.15rem;
  letter-spacing: 0;
  font-family: var(--font-body);
}

/* --- Closing / CTA band -------------------------------------------- */
.about-closing {
  background: var(--bg-warm);
  padding: 6rem 2rem;
  text-align: center;
  border-top: 1px solid var(--divider);
}

.about-closing-inner { max-width: 720px; margin: 0 auto; }

.about-closing__heading {
  font-family: var(--font-heading) !important;
  font-size: 2.5rem !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  color: var(--charcoal) !important;
  margin: 0 0 1.25rem !important;
  letter-spacing: -0.01em;
}

.about-closing__heading em {
  font-style: italic;
  color: var(--sienna);
}

.about-closing__sub {
  font-family: var(--font-body);
  font-size: 1.1rem;
  line-height: 1.75;
  color: var(--charcoal);
  margin: 0 0 2.25rem;
}

.about-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #fff;
  background: var(--terracotta);
  border: 1px solid var(--terracotta);
  padding: 1.05rem 2.25rem;
  text-decoration: none;
  transition: background 0.2s ease, gap 0.2s ease, transform 0.2s ease;
}

.about-cta:hover {
  background: var(--terracotta-hover);
  border-color: var(--terracotta-hover);
  color: #fff;
  gap: 0.9rem;
  transform: translateY(-1px);
}

/* --- Responsive ---------------------------------------------------- */
@media (max-width: 1024px) {
  .about-hero { padding: 5rem 1.75rem 6rem; min-height: auto; }
  .about-hero-heading { font-size: 2.75rem !important; }
  .about-section { padding: 5rem 1.75rem; }
  .about-split__heading { font-size: 2rem !important; }
  .about-pullquote { padding: 5rem 1.75rem; }
  .about-pullquote__text { font-size: 1.65rem !important; }
  .about-closing { padding: 5rem 1.75rem; }
  .about-closing__heading { font-size: 2.1rem !important; }
}

@media (max-width: 820px) {
  .about-hero { padding: 4rem 1.5rem 5rem; }
  .about-hero-heading { font-size: 2.35rem !important; }
  .about-hero-sub { font-size: 1rem; }
  .about-section { padding: 4rem 1.5rem; }
  .about-split__heading { font-size: 1.85rem !important; }
  .about-split__body p { font-size: 1rem; line-height: 1.75; }
  .about-pullquote { padding: 4rem 1.5rem; }
  .about-pullquote__mark { font-size: 4rem; }
  .about-pullquote__text { font-size: 1.4rem !important; line-height: 1.45 !important; }
  .about-closing { padding: 4rem 1.5rem; }
  .about-closing__heading { font-size: 1.85rem !important; }
  .about-closing__sub { font-size: 1rem; }
  .about-featured { gap: 1rem; }
  .about-featured__marks { gap: 1.25rem; }
}

@media (max-width: 560px) {
  .about-hero { padding: 3.5rem 1.25rem 4rem; }
  .about-hero-heading { font-size: 2rem !important; }
  .about-section { padding: 3.5rem 1.25rem; }
  .about-pullquote { padding: 3.5rem 1.25rem; }
  .about-pullquote__text { font-size: 1.25rem !important; }
  .about-closing { padding: 3.5rem 1.25rem; }
  .about-cta { padding: 0.95rem 1.75rem; font-size: 0.82rem; }
}

/* ==========================================================================
   BROWSE VENDORS — HOW IT WORKS PANEL
   Replaces the vendor listings with an instructional 3-card panel so
   first-time visitors understand they should use the sidebar filters.
   ========================================================================== */

/* Tagline below search bar */
.azedv-browse-tagline {
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--text-secondary);
  margin: 0.35rem 0 0 0;
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0.01em;
}

/* Full-width page layout on the listings browse experience — both the
   curated /browse-vendors/ static page (page-id-71) AND the hp_listing
   archive that the hero search lands on (body.post-type-archive-hp_listing).
   The archive route inherits the parent theme's 1280px .hp-page max-width
   and an auto-centered .container without these overrides, giving search
   results a noticeably narrower listings/sidebar column than the direct
   /browse-vendors/ entry. Both routes share the same listing template, so
   they should share the same layout. */
body.page-id-71 .site-content > .container,
body.post-type-archive-hp_listing .site-content > .container {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 2.5rem !important;
  padding-right: 2.5rem !important;
}

body.page-id-71 .content-area,
body.page-id-71 .hp-page,
body.post-type-archive-hp_listing .content-area,
body.post-type-archive-hp_listing .hp-page {
  max-width: 100% !important;
  width: 100% !important;
}

/* Visible panel containers for sidebar + content */
.azedv-browse-panels {
  gap: 0 !important;
}

.azedv-browse-panels .hp-page__sidebar {
  background: var(--bg-white);
  border: 1px solid var(--divider-light);
  border-radius: 10px 0 0 10px;
  padding: 1.5rem 1.75rem !important;
  border-right: 1px solid var(--divider-light);
  height: auto !important;
  min-height: 0 !important;
}

.azedv-browse-panels .hp-page__content {
  background: var(--bg-white);
  border: 1px solid var(--divider-light);
  border-left: none;
  border-radius: 0 10px 10px 0;
  padding: 1.5rem 1.75rem;
  height: auto !important;
  min-height: 0 !important;
}

@media (max-width: 768px) {
  body.page-id-71 .site-content > .container,
  body.post-type-archive-hp_listing .site-content > .container {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .azedv-browse-panels .hp-page__sidebar {
    border-radius: 10px 10px 0 0;
    border-right: 1px solid var(--divider-light);
    border-bottom: none;
    padding: 1rem !important;
  }

  .azedv-browse-panels .hp-page__content {
    border-left: 1px solid var(--divider-light);
    border-radius: 0 0 10px 10px;
    padding: 1rem !important;
    overflow-x: hidden;
  }

  .hp-listings .hp-grid__item {
    min-width: 0;
    overflow: hidden;
  }

  .azedv-card-v2.hp-listing--view-block {
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
  }

  .azedv-card-v2 .hp-listing__content {
    min-width: 0;
    overflow: hidden;
  }
}

/* ==========================================================================
   BROWSE VENDORS — "HOW IT WORKS" EMPTY STATE
   Shown in the right panel when the visitor lands on /browse-vendors/ without
   any active keyword or filter. Three editorial cards walk through the search →
   save → choose flow. Replaces the listings panel until a filter activates.
   JS: azedv_browse_vendors_how_it_works.
   ========================================================================== */
.browse-hiw {
  padding: 0.25rem 0 0.5rem;
}

.browse-hiw__heading {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 1.25rem 0;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.browse-hiw__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: visible;
}

.browse-hiw__card {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 1.5rem 1.35rem;
  background: var(--bg-warm);
  border: 1px solid var(--divider-light);
  border-radius: 10px;
}

.browse-hiw__icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.1rem;
}

.browse-hiw__icon--search {
  color: var(--desert-sage);
}

.browse-hiw__icon--save {
  color: var(--sienna);
}

.browse-hiw__icon--choose {
  color: var(--desert-sage-hover);
}

.browse-hiw__text h3 {
  font-family: var(--font-nav);
  font-size: 1rem;
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 0.4rem 0;
  line-height: 1.3;
  letter-spacing: 0.005em;
}

.browse-hiw__text p {
  font-family: var(--font-body);
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--text-secondary);
  margin: 0;
}

.browse-hiw__hint {
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--text-secondary);
  font-style: italic;
  margin: 1.25rem 0 0;
  text-align: center;
}

/* When the empty state is showing, the parent theme keeps the topbar
   (results count + sort form) and the listings wrapper visible via
   `display: flex !important` / `display: block !important`, which beats
   the inline `style="display: none"` the JS sets. Force them all down at
   selector strength using the body marker that the JS toggles. */
body.azedv-browse-empty .hp-page__content > .hp-page__topbar,
body.azedv-browse-empty .hp-page__content .hp-form--sort,
body.azedv-browse-empty .hp-page__content .hp-pagination,
body.azedv-browse-empty .hp-page__content .hp-result-count,
body.azedv-browse-empty .hp-page__content .hp-results-count,
body.azedv-browse-empty .hp-page__content .hp-listings {
  display: none !important;
}

@media (max-width: 900px) {
  .browse-hiw__cards {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .browse-hiw__card {
    padding: 1.25rem 1.25rem;
  }
}

/* ==========================================================================
   BROWSE VENDORS — SEARCH BAR + SIDEBAR SUBCATEGORIES
   Keyword search bar above the content area; when a category is active via
   URL param, the left sidebar's category radio is hidden and replaced with
   that category's subcategories as a clean vertical text list. JS lives in
   functions.php (azedv_browse_vendors_category_pills).
   ========================================================================== */
/* Browse-vendors keyword search bar — sits at the top of the sidebar,
   spanning the width of the filters panel so it reads as part of that
   category/filter context. */
.azedv-browse-search {
  margin: 0 0 1.25rem 0;
  padding: 0 0 1rem;
  border-bottom: 1px solid var(--divider-light);
}

.azedv-browse-search__form {
  display: flex;
  align-items: stretch;
  max-width: 100%;
  border: 1px solid var(--divider);
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  transition: border-color 0.18s ease;
}

.azedv-browse-search__form:focus-within {
  border-color: var(--terracotta);
}

.azedv-browse-search__input {
  flex: 1;
  border: none !important;
  outline: none !important;
  padding: 0.65rem 1rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.95rem;
  color: var(--charcoal, #333);
  background: transparent;
  min-width: 0;
}

.azedv-browse-search__input::placeholder {
  color: #999;
}

.azedv-browse-search__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 0.9rem;
  background: var(--terracotta, #C96A4A);
  border: none;
  color: #fff;
  cursor: pointer;
  transition: background-color 0.18s ease;
}

.azedv-browse-search__btn:hover,
.azedv-browse-search__btn:focus {
  background: var(--sienna, #B66037);
}

/* Browse-vendors category row — single horizontal strip of 6 categories */
.browse-cats {
  margin: 0 0 1rem 0;
  position: relative;
  left: -15px;
}

.browse-cats__row {
  display: flex;
  gap: 0.5rem;
}

.browse-cats__item {
  flex: 1 1 0;
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0.65rem 0.55rem 0.75rem;
  background: #fff;
  border: 1px solid var(--divider-light, #F0EAE2);
  border-bottom: 2px solid transparent;
  border-radius: 0;
  box-shadow: none;
  text-decoration: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, transform 0.2s ease;
  min-width: 0;
}

.browse-cats__item:hover,
.browse-cats__item:focus {
  background: #fffaf5;
  border-color: rgba(201, 106, 74, 0.28);
  border-bottom-color: var(--terra);
  box-shadow: 0 6px 14px rgba(97, 20, 7, 0.06);
  transform: translateY(-1px);
}

.browse-cats__item--active {
  background: #fff;
  border-color: rgba(201, 106, 74, 0.24);
  border-bottom-color: var(--terra);
}

.browse-cats__icon {
  flex-shrink: 0;
  color: var(--cat-color, var(--terracotta, #C96A4A));
  opacity: 0.95;
  margin-top: 1px;
}

.browse-cats__text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.browse-cats__name {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--charcoal, #333);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.browse-cats__count {
  font-weight: 400;
  color: var(--cat-color, #888);
  font-size: 0.78rem;
}

.browse-cats__desc {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.7rem;
  color: #777;
  line-height: 1.35;
  margin-top: 0.15rem;
}

/* Mobile: stack categories as a 2-row × 3-col grid of name-only buttons.
   Horizontal scroll was unintuitive — parents missed categories below the
   fold. Hides subcategory descriptions and counts; adds a "Categories"
   section heading so the block reads as a deliberate navigation block. */
@media (max-width: 768px) {
  .browse-cats {
    left: 0;
    margin: 0.5rem 0 1rem;
  }

  .browse-cats::before {
    content: "Categories";
    display: block;
    font-family: var(--font-heading, 'Merriweather', serif);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--charcoal, #333);
    margin: 0 0 0.6rem;
  }

  .browse-cats__row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    overflow: visible;
    padding-bottom: 0;
  }

  .browse-cats__item {
    flex: initial;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0.6rem 0.4rem;
    gap: 0.35rem;
  }

  .browse-cats__icon {
    margin-top: 0;
  }

  .browse-cats__name {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    font-size: 0.78rem;
    line-height: 1.25;
  }

  .browse-cats__count,
  .browse-cats__desc {
    display: none;
  }
}

/* Tablet fallback: 6-up flexible row, no scroll */
@media (min-width: 769px) and (max-width: 900px) {
  .browse-cats__item {
    min-width: 0;
  }
  .browse-cats__desc {
    font-size: 0.66rem;
  }
}

/* Keyword-matched category pill — bolder than `--active` so a search that
   spans several categories visually telegraphs which buckets are relevant.
   Stacks with `--active` when the user has also clicked one of them. */
.browse-cats__item--matched {
  background: #fff;
  border-color: rgba(201, 106, 74, 0.24);
  border-bottom-color: var(--terra);
}
.browse-cats__item--matched .browse-cats__icon {
  opacity: 1;
}
.browse-cats__item--matched.browse-cats__item--active {
  background: #fff;
  border-color: rgba(201, 106, 74, 0.24);
  border-bottom-color: var(--terra);
}

/* Status line under the pill row when a keyword search is active. */
.browse-cats__match-status {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.85rem;
  color: var(--charcoal, #333);
  margin: 0.5rem 0 0;
  line-height: 1.4;
}
.browse-cats__match-status strong {
  color: var(--terracotta, #C96A4A);
  font-weight: 600;
}
/* "Start New Search" chip in the status line — button treatment so it can't
   be missed (Melissa 7-07: testers couldn't find the old gray text link). */
.browse-cats__match-status a.azedv-clear-filters-link {
  display: inline-block;
  margin-left: 0.6rem;
  padding: 4px 14px;
  border: 2px solid var(--terracotta, #C96A4A);
  border-radius: 999px;
  background: #fff;
  color: var(--terracotta, #C96A4A);
  font-weight: 600;
  text-decoration: none;
  line-height: 1.3;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.browse-cats__match-status a.azedv-clear-filters-link:hover,
.browse-cats__match-status a.azedv-clear-filters-link:focus {
  background: var(--terracotta, #C96A4A);
  color: #fff;
}
.browse-cats__match-status--empty { color: #777; }
.browse-cats__match-status--empty strong { color: #555; }

/* Hide HivePress's stock top-level category radio when pills take over.
   Leaving the DOM present preserves the checked _category value so filter
   form submissions still carry the active category through. */
.azedv-sidebar-v2 .hp-form__field--radio.azedv-cat-radio-hidden {
  display: none !important;
}

/* Injected subcategory block inside the sidebar — accordion-wrapped so the
   heading is a clickable collapse/expand toggle. Compact spacing keeps the
   expanded category list + collapsed filter labels inside the sidebar
   panel's viewport-locked height (see .hp-page__sidebar scroll rule above). */
.azedv-subcat-block {
  margin: 0 0 1rem 0;
  padding: 0 0 0.75rem 0;
  border-bottom: 1px solid var(--divider-light);
}

/* Heading reset: `.azedv-subcat-block__label` is now a <button> rather than
   an <h3>, so it needs the usual button-reset (no border, no background,
   inherit text alignment) before the accordion-toggle rules style it. */
button.azedv-subcat-block__label {
  width: 100%;
  background: none;
  border: none;
  padding: 0;
  text-align: left;
  cursor: pointer;
  color: var(--charcoal);
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 0.85rem 0;
}

/* ==========================================================================
   SIDEBAR ACCORDION
   The subcategory "Categories" block and every HivePress filter field in the
   sidebar (Specialty, Location, Grade Levels, Service Type, ESA, Price) are
   enhanced client-side with `.azedv-accordion` + `.azedv-accordion-toggle`.
   Clicking the label toggles `.azedv-accordion--collapsed` on the container;
   the rules below handle the visual collapse and the chevron rotation.
   ========================================================================== */

/* Any accordion-enhanced HivePress filter field: make the label a row with
   the text on the left and the chevron on the right. The right padding
   keeps the chevron from kissing the sidebar's right edge — and, more
   importantly, keeps it clear of the sidebar scrollbar that appears once
   a filter field is expanded. ~22px gives the arrow breathing room in
   both the collapsed and expanded (scrollbar-present) states. */
.azedv-sidebar-v2 .azedv-accordion-toggle {
  width: 100%;
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-right: 1.375rem;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  cursor: pointer;
  user-select: none;
}

/* Higher-specificity override for HivePress filter field labels. The
   parent rule `.azedv-sidebar-v2 .hp-form__field > .hp-field__label` sets
   `padding: 0` (shorthand), which wins on specificity and would otherwise
   zero out our `padding-right` — pulling the chevron flush against the
   sidebar scrollbar. Restating the padding with matching specificity
   restores the breathing room. */
.azedv-sidebar-v2 .hp-form__field > .hp-field__label.azedv-accordion-toggle,
.azedv-sidebar-v2 .hp-form__field > .hp-form__label.azedv-accordion-toggle {
  padding-right: 1.375rem;
}

.azedv-sidebar-v2 .azedv-accordion-toggle:focus-visible {
  outline: 2px solid var(--terracotta);
  outline-offset: 2px;
}

/* Chevron (CSS-only, no icon font). Rotates when collapsed. */
.azedv-accordion-icon {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.22s ease;
  margin-left: auto;
  opacity: 0.55;
  flex-shrink: 0;
  margin-top: 0;
}

.azedv-accordion--collapsed > .azedv-accordion-toggle .azedv-accordion-icon,
.azedv-accordion--collapsed .azedv-accordion-toggle .azedv-accordion-icon {
  transform: rotate(-45deg);
  margin-top: 0;
}

/* Collapsed state: hide the panel / field content. Each variant targets a
   different container (subcat block uses a custom panel, HivePress fields
   use `.hp-field--*` as their content wrapper). */
.azedv-subcat-block.azedv-accordion--collapsed .azedv-accordion-panel {
  display: none;
}

.azedv-sidebar-v2 .hp-form__field.azedv-accordion--collapsed > .hp-field {
  display: none;
}

/* Price / number-range input pair: HivePress wraps the inputs in
   `.hp-field--number-range`, which the rule above already collapses. */

/* HivePress filter field labels already sit on their own row, but when
   accordion-enhanced they need a little breathing room below so the
   collapsed border doesn't hug the label text. */
.azedv-sidebar-v2 .hp-form__field.azedv-accordion > .hp-field__label {
  margin-bottom: 0.65rem;
}

/* Collapsed filter field: tighten vertical spacing so the list of
   collapsed filter headings takes as little room as possible while the
   Categories block above stays expanded and legible. */
.azedv-sidebar-v2 .hp-form__field.azedv-accordion.azedv-accordion--collapsed {
  margin-bottom: 0.6rem;
  padding-bottom: 0.6rem;
}

.azedv-sidebar-v2 .hp-form__field.azedv-accordion.azedv-accordion--collapsed > .hp-field__label {
  margin-bottom: 0;
}

/* Remove the block-based Archives + Categories widgets that the parent
   theme drops into the listings sidebar. They duplicate functionality the
   filter form already provides and push the real filters below the fold. */
.azedv-sidebar-v2 .widget_block {
  display: none !important;
}

/* Hide the "Open now" checkbox — not relevant for an education vendor directory */
.azedv-sidebar-v2 .hp-form__field--checkbox {
  display: none !important;
}

/* Mobile: search bar goes full-width */
@media (max-width: 640px) {
  .azedv-browse-search {
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .azedv-browse-search__form {
    max-width: 100%;
  }
}

/* =========================================================================
   Get Started — Vendor Submission Form
   ========================================================================= */

/* Hide the default WP page title on the Get Started page — the .azedv-gs-hero
   carries the page title itself. Body class is page-id-169 (page ID is
   stable; slug-based classes aren't added by the parent theme). */
body.page-id-169 .page__title.entry-title,
body.page-id-169 .hp-page__title {
  display: none !important;
}

/* Full-bleed escape from the parent theme's constrained container so the
   hero and form section can reach the viewport edges. Match the Vendor
   Request page's full-bleed approach. */
body.page-id-169 .hp-page__content,
body.page-id-169 .entry-content,
body.page-id-169 .site-content,
body.page-id-169 .page__content,
body.page-id-169 .page__text,
body.page-id-169 .container,
body.page-id-169 main {
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

.azedv-gs-page {
  background: var(--porcelain, #F5E2D0);
  color: var(--charcoal, #333333);
  font-family: var(--font-body, Inter, sans-serif);
}

.azedv-gs-page * {
  box-sizing: border-box;
}

.azedv-gs-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.azedv-gs-container--narrow {
  max-width: 720px;
}

/* ---------- Hero ---------- */

.azedv-gs-hero {
  padding: 5rem 0 3.5rem;
  text-align: center;
  background: #ffffff;
  border-bottom: 1px solid rgba(102, 51, 25, 0.15);
}

.azedv-gs-eyebrow {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sienna, #B66037);
  margin: 0 0 1rem;
}

.azedv-gs-heading {
  font-family: var(--font-heading, Merriweather, serif);
  font-size: 2.75rem;
  line-height: 1.15;
  font-weight: 700;
  color: var(--umber, #611407);
  margin: 0 auto 1.25rem;
  max-width: 720px;
}

.azedv-gs-sub {
  font-size: 1.1rem;
  line-height: 1.6;
  max-width: 620px;
  margin: 0 auto;
  color: #5c4a3a;
}

/* ---------- Form section ---------- */

.azedv-gs-form-section {
  padding: 4rem 0 6rem;
}

.azedv-gs-success,
.azedv-gs-error {
  padding: 2rem 2.25rem;
  margin-bottom: 2.5rem;
  border-left: 4px solid var(--desert-sage, #7F9C8C);
  background: rgba(127, 156, 140, 0.1);
}

.azedv-gs-success h2 {
  font-family: var(--font-heading, Merriweather, serif);
  font-size: 1.5rem;
  margin: 0 0 0.5rem;
  color: var(--umber, #611407);
}

.azedv-gs-success p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.6;
}

.azedv-gs-success a {
  color: var(--terracotta, #C96A4A);
  text-decoration: underline;
}

.azedv-gs-error {
  border-left-color: var(--rust, #933818);
  background: rgba(147, 56, 24, 0.08);
  color: var(--umber, #611407);
  font-size: 0.95rem;
  line-height: 1.6;
  padding: 1.25rem 1.5rem;
}

/* Honeypot — visually hidden but still in DOM for bots */
.azedv-gs-honeypot {
  position: absolute !important;
  left: -10000px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ---------- Form layout ---------- */

.azedv-gs-form {
  display: block;
}

.azedv-gs-group {
  border: 0;
  padding: 0;
  margin: 0 0 3.5rem;
  border-top: 1px solid rgba(102, 51, 25, 0.15);
  padding-top: 2.25rem;
}

.azedv-gs-group:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.azedv-gs-group-title {
  font-family: var(--font-heading, Merriweather, serif);
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--umber, #611407);
  margin: 0 0 1.75rem;
  padding: 0;
  letter-spacing: -0.005em;
}

.azedv-gs-group--confirm {
  margin-bottom: 2.5rem;
}

/* ---------- Field ---------- */

.azedv-gs-field {
  margin-bottom: 1.75rem;
}

.azedv-gs-field:last-child {
  margin-bottom: 0;
}

.azedv-gs-field > label,
.azedv-gs-label {
  display: block;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--umber, #611407);
  margin-bottom: 0.6rem;
}

.azedv-gs-field .req {
  color: var(--desert-sage, #7F9C8C);
  font-weight: 700;
  margin-left: 0.15rem;
  letter-spacing: 0;
  text-transform: none;
}

.azedv-gs-hint {
  display: block;
  font-size: 0.85rem;
  font-weight: 400;
  color: #7a6a5a;
  letter-spacing: 0;
  text-transform: none;
  font-family: var(--font-body, Inter, sans-serif);
  margin: -0.25rem 0 0.65rem;
}

/* ---------- Inputs (editorial underline style) ---------- */

.azedv-gs-field input[type="text"],
.azedv-gs-field input[type="email"],
.azedv-gs-field input[type="tel"],
.azedv-gs-field input[type="url"],
.azedv-gs-field textarea {
  width: 100%;
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 1rem;
  line-height: 1.5;
  color: var(--charcoal, #333333);
  background: transparent;
  border: 0;
  border-bottom: 2px solid rgba(102, 51, 25, 0.25);
  border-radius: 0;
  padding: 0.65rem 0;
  transition: border-color 0.2s ease, background-color 0.2s ease;
  -webkit-appearance: none;
  appearance: none;
}

.azedv-gs-field textarea {
  resize: vertical;
  min-height: 5rem;
  padding: 0.65rem 0.75rem;
  background: rgba(255, 255, 255, 0.4);
  border: 1px solid rgba(102, 51, 25, 0.2);
}

.azedv-gs-field input[type="text"]:focus,
.azedv-gs-field input[type="email"]:focus,
.azedv-gs-field input[type="tel"]:focus,
.azedv-gs-field input[type="url"]:focus,
.azedv-gs-field textarea:focus {
  outline: none;
  border-color: var(--terracotta, #C96A4A);
  background: rgba(255, 255, 255, 0.5);
}

.azedv-gs-field input[type="text"]::placeholder,
.azedv-gs-field input[type="email"]::placeholder,
.azedv-gs-field input[type="tel"]::placeholder,
.azedv-gs-field textarea::placeholder {
  color: #a89888;
  font-style: italic;
}

/* ---------- Radios ---------- */

.azedv-gs-radios {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  margin-top: 0.25rem;
}

.azedv-gs-radio {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  cursor: pointer;
  padding: 0.4rem 0;
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.95rem;
  font-weight: 400;
  color: var(--charcoal, #333333);
  letter-spacing: 0;
  text-transform: none;
  margin-bottom: 0;
}

.azedv-gs-radio input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  width: 1.15rem;
  height: 1.15rem;
  border: 2px solid rgba(102, 51, 25, 0.35);
  border-radius: 50%;
  margin: 0;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease;
  flex-shrink: 0;
  position: relative;
  background: #fff;
}

.azedv-gs-radio input[type="radio"]:checked {
  border-color: var(--desert-sage, #7F9C8C);
}

.azedv-gs-radio input[type="radio"]:checked::after {
  content: '';
  position: absolute;
  inset: 3px;
  background: var(--desert-sage, #7F9C8C);
  border-radius: 50%;
}

.azedv-gs-radio input[type="radio"]:focus-visible {
  outline: 2px solid var(--terracotta, #C96A4A);
  outline-offset: 2px;
}

/* ---------- Checkboxes ---------- */

.azedv-gs-checks {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem 1.5rem;
  margin-top: 0.25rem;
}

.azedv-gs-checks.azedv-gs-checks--single {
  grid-template-columns: 1fr;
}

.azedv-gs-check {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  cursor: pointer;
  padding: 0.4rem 0;
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.95rem;
  font-weight: 400;
  color: var(--charcoal, #333333);
  letter-spacing: 0;
  text-transform: none;
  margin-bottom: 0;
}

.azedv-gs-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 1.15rem;
  height: 1.15rem;
  border: 2px solid rgba(102, 51, 25, 0.35);
  border-radius: 2px;
  margin: 0;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease;
  flex-shrink: 0;
  position: relative;
  background: #fff;
}

.azedv-gs-check input[type="checkbox"]:checked {
  background: var(--desert-sage, #7F9C8C);
  border-color: var(--desert-sage, #7F9C8C);
}

.azedv-gs-check input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 3px;
  top: 0px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.azedv-gs-check input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--terracotta, #C96A4A);
  outline-offset: 2px;
}

/* ---------- Confirmation checkbox (larger) ---------- */

.azedv-gs-check--confirm {
  align-items: flex-start;
  font-size: 0.95rem;
  line-height: 1.5;
  padding: 0;
  cursor: pointer;
}

.azedv-gs-check--confirm input[type="checkbox"] {
  margin-top: 0.2rem;
}

.azedv-gs-check--confirm span {
  font-weight: 400;
  color: var(--charcoal, #333333);
}

/* ---------- Submit button ---------- */

.azedv-gs-actions {
  margin-top: 2.5rem;
  display: flex;
  justify-content: flex-start;
}

.azedv-gs-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1rem 2.5rem;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #fff;
  background: var(--terracotta, #C96A4A);
  border: 0;
  border-radius: 0;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease;
}

.azedv-gs-submit:hover {
  background: var(--sienna, #B66037);
}

.azedv-gs-submit:active {
  transform: translateY(1px);
}

.azedv-gs-submit:focus-visible {
  outline: 3px solid var(--desert-sage, #7F9C8C);
  outline-offset: 3px;
}

/* ---------- Responsive ---------- */

@media (max-width: 768px) {
  .azedv-gs-hero {
    padding: 3.5rem 0 2.5rem;
  }
  .azedv-gs-heading {
    font-size: 2rem;
  }
  .azedv-gs-sub {
    font-size: 1rem;
  }
  .azedv-gs-form-section {
    padding: 2.5rem 0 4rem;
  }
  .azedv-gs-group {
    margin-bottom: 2.5rem;
    padding-top: 1.75rem;
  }
  .azedv-gs-group-title {
    font-size: 1.2rem;
  }
  .azedv-gs-checks {
    grid-template-columns: 1fr;
  }
  .azedv-gs-radios {
    flex-direction: column;
    gap: 0.25rem;
  }
  .azedv-gs-submit {
    width: 100%;
    padding: 1.05rem 1.5rem;
  }
}

/* ==========================================================================
   Unified Sign-In / Sign-Up pages (.azedv-auth)
   Radio toggle between Parent and Vendor account types, warm Southwest styling.
   ========================================================================== */

.azedv-auth {
  padding: 3rem 1.25rem 5rem;
  background: var(--bg-warm);
  display: flex;
  justify-content: center;
}

.azedv-auth__card {
  width: 100%;
  max-width: 520px;
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 4px;
  padding: 3rem 2.75rem 2.5rem;
  box-shadow: 0 2px 24px rgba(97, 20, 7, 0.04);
}

.azedv-auth__title {
  font-family: var(--font-heading);
  font-size: 2.35rem;
  line-height: 1.15;
  color: var(--charcoal);
  text-align: center;
  margin: 0 0 0.75rem;
  letter-spacing: -0.01em;
}

.azedv-auth__subtitle {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--text-secondary);
  text-align: center;
  margin: 0 0 2rem;
  line-height: 1.5;
}

/* Role radio toggle */
.azedv-auth__roles {
  border: 0;
  margin: 0 0 2rem;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 2.25rem;
  flex-wrap: wrap;
}

.azedv-auth__role {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--text-secondary);
  font-weight: 500;
  user-select: none;
  transition: color 140ms ease;
}

.azedv-auth__role input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.azedv-auth__role-dot {
  width: 20px;
  height: 20px;
  border: 2px solid var(--text-light);
  border-radius: 50%;
  display: inline-block;
  position: relative;
  background: #ffffff;
  transition: border-color 140ms ease, box-shadow 140ms ease;
  flex-shrink: 0;
}

.azedv-auth__role-dot::after {
  content: '';
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: var(--terracotta);
  transform: scale(0);
  transition: transform 160ms ease;
}

.azedv-auth__role.is-active {
  color: var(--charcoal);
}

.azedv-auth__role.is-active .azedv-auth__role-dot {
  border-color: var(--terracotta);
}

.azedv-auth__role.is-active .azedv-auth__role-dot::after {
  transform: scale(1);
}

.azedv-auth__role input[type="radio"]:focus-visible + .azedv-auth__role-dot {
  box-shadow: 0 0 0 3px rgba(201, 106, 74, 0.25);
}

.azedv-auth__role:hover:not(.is-active) .azedv-auth__role-dot {
  border-color: var(--charcoal);
}

/* Form */
.azedv-auth__form {
  display: flex;
  flex-direction: column;
  gap: 1.15rem;
}

/* Sign-up tab panes (card #02): the role toggle swaps Parent / Vendor forms
   in place. The inactive pane carries the [hidden] attribute — server-set on
   load, JS-set on click — and !important because the parent theme sets
   display on generic containers and would otherwise beat the UA sheet. */
.azedv-auth__pane[hidden] {
  display: none !important;
}

.azedv-auth__pane-intro {
  margin: 0 0 1.15rem;
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  line-height: 1.55;
  color: #5a5a5a;
}

.azedv-auth__field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.azedv-auth__label {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--charcoal);
  letter-spacing: 0.01em;
}

.azedv-auth__field input[type="text"],
.azedv-auth__field input[type="email"],
.azedv-auth__field input[type="password"] {
  width: 100%;
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--charcoal);
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 3px;
  padding: 0.85rem 1rem;
  transition: border-color 140ms ease, box-shadow 140ms ease;
  box-sizing: border-box;
}

.azedv-auth__field input:focus {
  outline: none;
  border-color: var(--terracotta);
  box-shadow: 0 0 0 3px rgba(201, 106, 74, 0.15);
}

.azedv-auth__hint {
  font-family: var(--font-body);
  font-size: 0.8rem;
  color: var(--text-light);
}

.azedv-auth__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: -0.3rem;
}

.azedv-auth__check {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--text-secondary);
  cursor: pointer;
}

.azedv-auth__check input[type="checkbox"] {
  accent-color: var(--terracotta);
  width: 15px;
  height: 15px;
  margin: 0;
}

.azedv-auth__link {
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--desert-sage-hover);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.azedv-auth__link:hover {
  color: var(--terracotta);
}

/* Button — elevate specificity so the parent theme's button styles don't win */
button.azedv-auth__btn,
a.azedv-auth__btn,
.azedv-auth .azedv-auth__btn {
  display: block;
  width: 100%;
  font-family: var(--font-nav);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #ffffff !important;
  background: var(--terracotta) !important;
  background-color: var(--terracotta) !important;
  background-image: none !important;
  border: none !important;
  border-radius: 3px !important;
  padding: 1rem 1.5rem;
  cursor: pointer;
  transition: background 140ms ease, transform 140ms ease;
  margin-top: 0.75rem;
  text-align: center;
  text-decoration: none;
  box-shadow: none !important;
}

button.azedv-auth__btn:hover,
a.azedv-auth__btn:hover,
.azedv-auth .azedv-auth__btn:hover {
  background: var(--terracotta-hover) !important;
  background-color: var(--terracotta-hover) !important;
  color: #ffffff !important;
}

button.azedv-auth__btn:active,
a.azedv-auth__btn:active,
.azedv-auth .azedv-auth__btn:active {
  transform: translateY(1px);
}

.azedv-auth__footer {
  margin: 1.75rem 0 0;
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--text-secondary);
  text-align: center;
}

.azedv-auth__footer a {
  color: var(--desert-sage-hover);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  font-weight: 600;
}

.azedv-auth__footer a:hover {
  color: var(--terracotta);
}

.azedv-auth__error {
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--rust);
  background: rgba(147, 56, 24, 0.06);
  border-left: 3px solid var(--rust);
  padding: 0.75rem 1rem;
  margin: 0 0 1.5rem;
  border-radius: 2px;
  line-height: 1.45;
}

.azedv-auth__error a {
  color: var(--rust);
  font-weight: 600;
  text-decoration: underline;
}

.azedv-auth__notice {
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--desert-sage-hover);
  background: rgba(127, 156, 140, 0.12);
  border-left: 3px solid var(--desert-sage);
  padding: 0.75rem 1rem;
  margin: 0 0 1.5rem;
  border-radius: 2px;
  line-height: 1.45;
}

/* Hide the parent theme's header hero title on auth pages — the card owns the title */
body.azedv-auth-page .header-hero,
body.azedv-auth-page .header-hero--title,
body.azedv-auth-page .header-hero__content,
body.azedv-auth-page .page__title,
body.azedv-auth-page .entry-title {
  display: none !important;
}

/* Nudge Sign In 50px closer to Register.
   Parent theme pins .menu-item--signin with position:absolute; right:13rem (208px)
   and .menu-item--get-started at right:2rem (32px). Moving Sign In 50px to the right
   = decreasing its `right` by 50px → lands ~17px from the Register button. */
.site-header .header-navbar__menu > ul.menu > li.menu-item--signin,
#menu-main-menu-2 > li.menu-item--signin {
  right: calc(13rem - 50px) !important;
}

@media (max-width: 640px) {
  .azedv-auth {
    padding: 1.5rem 0.75rem 3rem;
  }
  .azedv-auth__card {
    padding: 2.25rem 1.5rem 2rem;
  }
  .azedv-auth__title {
    font-size: 2rem;
  }
  .azedv-auth__roles {
    gap: 1.25rem;
  }
}

/* ==========================================================================
   Parent Portal (.azedv-pp)
   Three-column dashboard shell: My Lists | Saved Listings | Planner
   ========================================================================== */

/* Bust the parent theme's narrow .container / .page__text wrappers ONLY on
   the parent-portal page so the three-column shell has room to breathe. */
body:has(.azedv-pp) .container,
body:has(.azedv-pp) .page__text {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.azedv-pp {
  max-width: 1440px;
  margin: 0 auto;
  padding: 1.75rem 1.5rem 4rem;
  font-family: var(--font-body);
}

.azedv-pp__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem 1.5rem;
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 4px;
  margin-bottom: 1.5rem;
  gap: 1rem;
}

.azedv-pp__title {
  font-family: var(--font-heading);
  font-size: 1.6rem;
  color: var(--charcoal);
  margin: 0;
  letter-spacing: -0.01em;
}

.azedv-pp__welcome {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.azedv-pp__greeting {
  font-size: 0.95rem;
  color: var(--text-secondary);
  font-weight: 500;
}

.azedv-pp__icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--bg-warm);
  border: 1px solid var(--divider);
  color: var(--charcoal);
  cursor: pointer;
  transition: background 140ms ease, border-color 140ms ease;
  list-style: none;
}

.azedv-pp__icon-btn::-webkit-details-marker { display: none; }

.azedv-pp__icon-btn:hover {
  background: var(--warm-sand-light);
  border-color: var(--terracotta);
  color: var(--terracotta);
}

.azedv-pp__account {
  position: relative;
}

.azedv-pp__account[open] > summary {
  background: var(--warm-sand-light);
  border-color: var(--terracotta);
}

.azedv-pp__account-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 4px;
  box-shadow: 0 6px 24px rgba(97, 20, 7, 0.08);
  padding: 0.5rem 0;
  min-width: 220px;
  z-index: 20;
  display: flex;
  flex-direction: column;
}

.azedv-pp__account-email {
  padding: 0.5rem 1rem 0.75rem;
  font-size: 0.85rem;
  color: var(--text-light);
  border-bottom: 1px solid var(--divider-light);
  word-break: break-all;
}

.azedv-pp__account-menu a {
  padding: 0.6rem 1rem;
  font-size: 0.95rem;
  color: var(--charcoal);
  text-decoration: none;
  transition: background 120ms ease, color 120ms ease;
}

.azedv-pp__account-menu a:hover {
  background: var(--warm-sand-light);
  color: var(--terracotta);
}

/* Layout grid */
.azedv-pp__layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
}

/* Let the listings area take the full width of the main column */
.azedv-pp__main { min-width: 0; }
.azedv-pp__listings,
.azedv-pp__listings .hp-page,
.azedv-pp__listings .hp-page__content,
.azedv-pp__listings .hp-listings { width: 100%; }

.azedv-pp__sidebar,
.azedv-pp__main {
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 4px;
  padding: 1.5rem 1.25rem;
}

/* Per-card planner row: card on the left, planner aside on the right.
   align-items:stretch makes the planner match its card's height. The
   planner's natural height is intentionally compact (smaller header,
   tighter fields, single-row notes) so cards drive the row height; the
   notes textarea then absorbs leftover vertical space via flex:1. */
.azedv-pp__listings .azedv-pp__card-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 1rem;
  align-items: stretch;
  margin: 0 0 1rem;
  width: 100%;
}

/* List filtering hides rows via this class — it must outgun the
   display:grid !important above (inline display:none loses to it). */
.azedv-pp__listings .azedv-pp__card-row.azedv-pp__row-hidden {
  display: none !important;
}

.azedv-pp__card-row > .hp-listing,
.azedv-pp__card-row > article {
  min-width: 0;
  width: auto;
}

.azedv-pp__card-row .azedv-pp__planner {
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 4px;
  padding: 0.7rem 0.9rem;
  display: flex;
  flex-direction: column;
}

.azedv-pp__card-row .azedv-pp__planner-head {
  margin-bottom: 0.4rem;
}

.azedv-pp__card-row .azedv-pp__planner-head .azedv-pp__section-title {
  font-size: 0.85rem;
  margin: 0;
}

.azedv-pp__card-row .azedv-pp__planner-details {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  flex: 1 1 auto;
  min-height: 0;
}

.azedv-pp__card-row .azedv-pp__planner-field {
  gap: 0.2rem;
}

.azedv-pp__card-row .azedv-pp__planner-field label {
  font-size: 0.68rem;
}

.azedv-pp__card-row .azedv-pp__planner-field input,
.azedv-pp__card-row .azedv-pp__planner-field textarea {
  padding: 0.35rem 0.55rem;
  font-size: 0.84rem;
}

.azedv-pp__card-row .azedv-pp__planner-field:last-of-type {
  flex: 1 1 0;
  min-height: 0;
}

/* basis:0 ignores the textarea's rows="4" intrinsic size so the planner's
   natural height stays under the card's; flex-grow then expands it to fill
   the row height the card sets. */
.azedv-pp__card-row .azedv-pp__planner-field:last-of-type textarea {
  flex: 1 1 0;
  min-height: 2.2em;
  resize: none;
}

/* Force the article to stretch to the row height — without this, some
   parent-theme rules can keep .hp-listing--view-block at its natural
   height and the planner can end up taller. */
.azedv-pp__card-row > article,
.azedv-pp__card-row > .hp-listing--view-block {
  align-self: stretch;
  height: 100%;
}

.azedv-pp__card-row .azedv-pp__planner-save {
  padding: 0.45rem 0.75rem;
  font-size: 0.85rem;
}

.azedv-pp__section-title {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  color: var(--charcoal);
  margin: 0 0 1rem;
  letter-spacing: -0.005em;
}

/* Sidebar — My Lists */
.azedv-pp__lists {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

/* Each list row: name button (flex: 1) + trash-can button (icon). */
.azedv-pp__list {
  display: flex;
  align-items: stretch;
  gap: 0.25rem;
  border-radius: 3px;
  transition: background 120ms ease;
}

.azedv-pp__list-name {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
  padding: 0.7rem 0.9rem;
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--text-secondary);
  background: transparent;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.azedv-pp__list-name:hover {
  background: var(--warm-sand-light);
  color: var(--charcoal);
}

.azedv-pp__list.is-active .azedv-pp__list-name {
  background: var(--terracotta);
  color: #ffffff;
  font-weight: 600;
}

.azedv-pp__list-remove {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  border: none;
  background: transparent;
  color: var(--text-light, #8a7a6a);
  border-radius: 3px;
  cursor: pointer;
  opacity: 0;
  transition: opacity 120ms ease, background 120ms ease, color 120ms ease;
}

.azedv-pp__list-edit {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  border: none;
  background: transparent;
  color: var(--text-light, #8a7a6a);
  border-radius: 3px;
  cursor: pointer;
  opacity: 0;
  transition: opacity 120ms ease, background 120ms ease, color 120ms ease;
}

.azedv-pp__list:hover .azedv-pp__list-remove,
.azedv-pp__list-remove:focus-visible,
.azedv-pp__list:hover .azedv-pp__list-edit,
.azedv-pp__list-edit:focus-visible {
  opacity: 1;
}

.azedv-pp__list-remove:hover {
  background: rgba(147, 56, 24, 0.08);
  color: var(--rust, #933818);
}

.azedv-pp__list-edit:hover {
  background: rgba(127, 156, 140, 0.12);
  color: var(--desert-sage-hover, #5A8D75);
}

.azedv-pp__list.is-active .azedv-pp__list-remove {
  color: rgba(255, 255, 255, 0.75);
}

.azedv-pp__list.is-active .azedv-pp__list-edit {
  color: rgba(255, 255, 255, 0.75);
}

.azedv-pp__list.is-active .azedv-pp__list-remove:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
}

.azedv-pp__list.is-active .azedv-pp__list-edit:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
}

/* Inline rename row — input + Save/Cancel replace name + icon buttons. */
.azedv-pp__list.is-editing {
  flex-wrap: wrap;
  gap: 0.35rem;
}

.azedv-pp__list-edit-input {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.55rem 0.7rem;
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--charcoal);
  background: #fff;
  border: 1px solid var(--divider);
  border-radius: 3px;
}

.azedv-pp__list-edit-input:focus {
  outline: none;
  border-color: var(--desert-sage);
}

.azedv-pp__list-edit-save {
  padding: 0.45rem 0.75rem;
  background: var(--desert-sage, #7F9C8C);
  color: #fff;
  border: none;
  border-radius: 3px;
  font-family: var(--font-body);
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}

.azedv-pp__list-edit-save:hover { background: var(--desert-sage-hover, #5A8D75); }

.azedv-pp__list-edit-cancel {
  padding: 0.45rem 0.55rem;
  background: transparent;
  color: var(--text-light, #8a7a6a);
  border: none;
  font-family: var(--font-body);
  font-size: 0.8rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.azedv-pp__list-edit-cancel:hover { color: var(--charcoal); }

.azedv-pp__list-edit-error {
  flex: 1 1 100%;
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--rust, #933818);
}

.azedv-pp__list-edit-error[hidden] { display: none !important; }

.azedv-pp__new-list {
  width: 100%;
  padding: 0.7rem 0.9rem;
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--desert-sage-hover);
  background: transparent;
  border: 1px dashed var(--divider);
  border-radius: 3px;
  cursor: pointer;
  transition: background 120ms ease, border-color 120ms ease;
  margin-top: 0.75rem;
}

.azedv-pp__new-list:not(:disabled):hover {
  background: var(--bg-warm);
  border-color: var(--desert-sage);
}

.azedv-pp__new-list:disabled {
  cursor: not-allowed;
  opacity: 0.7;
}

.azedv-pp__new-list span[aria-hidden="true"] {
  font-weight: 600;
  margin-right: 0.25rem;
}

.azedv-pp__lists-empty {
  font-size: 0.9rem;
  color: var(--text-light);
  line-height: 1.5;
  margin: 0;
  padding: 0.4rem 0.9rem 0;
}

/* "All Saved Listings" pseudo-list gets a little breathing room from the
   user-created lists beneath it. */
.azedv-pp__list--all {
  margin-bottom: 0.25rem;
}

/* Compact dropdown when a parent has more than four named lists. */
.azedv-pp__list-dropdown {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.15rem;
}

.azedv-pp__list-select {
  width: 100%;
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--charcoal);
  background: var(--bg-warm);
  border: 1px solid var(--divider);
  border-radius: 3px;
  padding: 0.55rem 0.75rem;
  cursor: pointer;
}

.azedv-pp__list-select:focus {
  outline: none;
  border-color: var(--desert-sage);
}

.azedv-pp__list-dropdown-actions {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.azedv-pp__list-dropdown-actions .azedv-pp__list-edit,
.azedv-pp__list-dropdown-actions .azedv-pp__list-remove {
  opacity: 1;
  width: 36px;
  height: 32px;
}

/* Inline create-new-list form (revealed by the Create New List button).
   Author display rules beat the UA [hidden] default, so guard explicitly. */
.azedv-pp__new-list[hidden],
.azedv-pp__new-list-form[hidden],
.azedv-pp__lists-empty[hidden] { display: none !important; }

.azedv-pp__new-list-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.azedv-pp__new-list-form input {
  flex: 1 1 100%;
  min-width: 0;
  padding: 0.55rem 0.7rem;
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--charcoal);
  background: #fff;
  border: 1px solid var(--divider);
  border-radius: 3px;
}

.azedv-pp__new-list-form input:focus {
  outline: none;
  border-color: var(--desert-sage);
}

.azedv-pp__new-list-actions {
  display: flex;
  gap: 0.5rem;
  flex: 1 1 100%;
}

.azedv-pp__new-list-add {
  padding: 0.45rem 1rem;
  background: var(--desert-sage, #7F9C8C);
  color: #fff;
  border: none;
  border-radius: 3px;
  font-family: var(--font-body);
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}

.azedv-pp__new-list-add:hover { background: var(--desert-sage-hover, #5A8D75); }

.azedv-pp__new-list-cancel {
  padding: 0.45rem 0.6rem;
  background: transparent;
  color: var(--text-light, #8a7a6a);
  border: none;
  font-family: var(--font-body);
  font-size: 0.85rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.azedv-pp__new-list-cancel:hover { color: var(--charcoal); }

.azedv-pp__new-list-error {
  flex: 1 1 100%;
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--rust, #933818);
}

/* Empty state when the active list has no saved listings in it yet. */
.azedv-pp__filter-empty {
  font-size: 0.95rem;
  color: var(--text-light);
  line-height: 1.6;
  margin: 0;
  padding: 1.5rem 0;
}

/* Main — Saved Listings */
.azedv-pp__main-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
  flex-wrap: wrap;
}

.azedv-pp__main-head .azedv-pp__section-title {
  margin: 0;
}

.azedv-pp__sort select {
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--charcoal);
  background: var(--bg-warm);
  border: 1px solid var(--divider);
  border-radius: 3px;
  padding: 0.45rem 0.75rem;
  cursor: pointer;
}

.azedv-pp__sort select:disabled {
  opacity: 0.75;
  cursor: not-allowed;
}

.azedv-pp__empty {
  text-align: center;
  padding: 3.5rem 1.5rem;
  border: 1px dashed var(--divider);
  border-radius: 4px;
  background: var(--bg-warm);
}

.azedv-pp__empty h3 {
  font-family: var(--font-heading);
  font-size: 1.2rem;
  color: var(--charcoal);
  margin: 0 0 0.5rem;
}

.azedv-pp__empty p {
  font-size: 0.95rem;
  color: var(--text-secondary);
  max-width: 420px;
  margin: 0 auto 1.5rem;
  line-height: 1.5;
}

.azedv-pp__empty-cta {
  display: inline-block;
  background: var(--terracotta);
  color: var(--porcelain);
  font-family: var(--font-nav);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 12px 28px;
  text-decoration: none;
  border: 2px solid var(--terracotta);
  transition: background 0.2s ease, border-color 0.2s ease;
}

.azedv-pp__empty-cta:hover {
  background: var(--sienna, #b66037);
  border-color: var(--sienna, #b66037);
  color: var(--porcelain);
}

/* Planner */
.azedv-pp__planner-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

.azedv-pp__planner-head .azedv-pp__section-title {
  margin: 0;
}

/* Deliverable 13 — the heart's "Save to list" picker now shows on the Parent
   Portal too (it used to be suppressed here; list management was sidebar-only).
   Parents reorganize constantly ("I made it camp, now I want dance"), so they
   get the EXACT directory dropdown to move a listing between lists right from
   the card. The picker is already built into every portal heart by
   azedv_vendor_card_v2(); we simply stop hiding it. Mobile reuses the shared
   centered-lightbox treatment (the max-width:768px block above, scoped to
   .azedv-card-v2), so the dropdown is no longer cut off on phones. */

/* Selected saved-listing card — terracotta accent bar + warm fill.
   Applied only inside the parent portal so Browse Vendors is untouched. */
.azedv-pp__listings .azedv-card-v2 {
  cursor: pointer;
  position: relative;
  border-left: 3px solid transparent !important;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.azedv-pp__listings .azedv-card-v2.is-selected {
  background: var(--warm-sand-light, #F5E2D0) !important;
  border-left-color: var(--terracotta, #C96A4A) !important;
  box-shadow: 0 2px 10px rgba(201, 106, 74, 0.14) !important;
}

/* Planner: populated state */
.azedv-pp__planner-details {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.azedv-pp__planner-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.azedv-pp__planner-field label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.azedv-pp__planner-field input,
.azedv-pp__planner-field textarea {
  font-family: var(--font-body);
  font-size: 0.92rem;
  color: var(--charcoal);
  background: #ffffff;
  border: 1px solid var(--divider);
  border-radius: 3px;
  padding: 0.55rem 0.7rem;
  width: 100%;
  resize: vertical;
}

.azedv-pp__planner-field input:focus,
.azedv-pp__planner-field textarea:focus {
  outline: none;
  border-color: var(--terracotta);
  box-shadow: 0 0 0 2px rgba(201, 106, 74, 0.15);
}

.azedv-pp__planner-save {
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 600;
  color: #ffffff;
  background: var(--desert-sage, #7F9C8C);
  border: none;
  border-radius: 3px;
  padding: 0.65rem 1rem;
  cursor: pointer;
  transition: background 0.15s;
}

.azedv-pp__planner-save:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.azedv-pp__planner-save:not(:disabled):hover {
  background: var(--desert-sage-hover, #6A8778);
}

/* Brief confirmation after a successful save (reverts to default after ~1.8s) */
.azedv-pp__planner-save.is-saved {
  background: var(--rust, #933818);
}

/* Responsive: stack per-card planners below tablet, collapse sidebar below mobile */
@media (max-width: 1100px) {
  .azedv-pp__listings .azedv-pp__card-row {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0.75rem;
  }
  /* Stacked, the card no longer drives the row height, so the desktop
     height-matching hacks (notes flex-basis 0) collapse the Notes field to
     0px and the Save button overlaps it. Size everything naturally. */
  .azedv-pp__card-row > article,
  .azedv-pp__card-row > .hp-listing--view-block {
    height: auto;
  }
  .azedv-pp__card-row .azedv-pp__planner-details,
  .azedv-pp__card-row .azedv-pp__planner-field:last-of-type {
    flex: 0 0 auto;
  }
  .azedv-pp__card-row .azedv-pp__planner-field:last-of-type textarea {
    flex: 0 0 auto;
    min-height: 4.4em;
  }
}

@media (max-width: 720px) {
  .azedv-pp {
    padding: 1rem 0.75rem 3rem;
  }
  .azedv-pp__header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }
  .azedv-pp__layout {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .azedv-pp__lists {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.4rem;
  }
  .azedv-pp__list button {
    white-space: nowrap;
    padding: 0.5rem 0.9rem;
  }
}

/* ==========================================================================
   Placement Plans Page (/placement-plans/)
   ========================================================================== */

/* Hide the parent theme's "Placement Plans" page-title hero — the custom
   .pp-hero block below renders the headline. */
.page-id-218 .header-hero--title,
.page-id-218 .header-hero {
  display: none !important;
}

/* Hide the parent theme's page-title hero on terms pages — the .pt-heading
   inside .az-placement-terms renders the heading itself.
   Page IDs: 1938 = Advertising Placement Terms, 1939 = Premium Listing Terms,
   1943 = Terms of Service, 1945 = Disclaimer, 3 = Privacy Policy,
   1933 = Vendor Listing Guidelines. */
.page-id-1938 .header-hero--title,
.page-id-1938 .header-hero,
.page-id-1939 .header-hero--title,
.page-id-1939 .header-hero,
.page-id-1939 .page__title.entry-title,
.page-id-1939 .hp-page__title,
.page-id-1943 .header-hero--title,
.page-id-1943 .header-hero,
.page-id-1943 .page__title.entry-title,
.page-id-1943 .hp-page__title,
.page-id-1945 .header-hero--title,
.page-id-1945 .header-hero,
.page-id-1945 .page__title.entry-title,
.page-id-1945 .hp-page__title,
.page-id-3 .header-hero--title,
.page-id-3 .header-hero,
.page-id-3 .page__title.entry-title,
.page-id-3 .hp-page__title,
.page-id-1933 .header-hero--title,
.page-id-1933 .header-hero,
.page-id-1933 .page__title.entry-title,
.page-id-1933 .hp-page__title {
  display: none !important;
}

/* Strip parent-theme container padding/max-width on terms pages so the
   warm porcelain band reaches the viewport edge. */
.page-id-1939 .hp-page__content,
.page-id-1939 .entry-content,
.page-id-1939 .site-content,
.page-id-1939 .page__content,
.page-id-1939 main,
.page-id-1943 .hp-page__content,
.page-id-1943 .entry-content,
.page-id-1943 .site-content,
.page-id-1943 .page__content,
.page-id-1943 main,
.page-id-1945 .hp-page__content,
.page-id-1945 .entry-content,
.page-id-1945 .site-content,
.page-id-1945 .page__content,
.page-id-1945 main,
.page-id-3 .hp-page__content,
.page-id-3 .entry-content,
.page-id-3 .site-content,
.page-id-3 .page__content,
.page-id-3 main {
  padding: 0 !important;
  max-width: none !important;
}

/* ==========================================================================
   Terms pages — editorial Southwest layout (.az-placement-terms / .pt-*)
   Used by /placement-terms/, /premium-listing-terms/, etc.
   ========================================================================== */

.az-placement-terms {
  background: var(--porcelain);
  color: var(--charcoal);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.65;
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin-top: -24px;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 5rem 2rem 6rem;
}

.az-placement-terms *,
.az-placement-terms *::before,
.az-placement-terms *::after {
  box-sizing: border-box;
}

.az-placement-terms .pt-heading,
.az-placement-terms .pt-sub,
.az-placement-terms .pt-section,
.az-placement-terms .pt-footer {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}

.az-placement-terms .pt-heading {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 4.4vw, 3rem);
  font-weight: 800;
  line-height: 1.15;
  color: var(--charcoal);
  margin: 0 auto 0.5rem;
  text-align: center;
  letter-spacing: -0.01em;
}

.az-placement-terms .pt-sub {
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rust);
  margin: 0 auto 3.25rem;
  text-align: center;
}

.az-placement-terms .pt-section {
  margin: 0 auto 2.25rem;
  padding-bottom: 2.25rem;
  border-bottom: 1px solid rgba(147, 56, 24, 0.14);
}

.az-placement-terms .pt-section:last-of-type {
  border-bottom: none;
  padding-bottom: 1.5rem;
}

.az-placement-terms .pt-section h2 {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--umber);
  margin: 0 0 0.85rem;
}

.az-placement-terms .pt-section p {
  margin: 0 0 0.85rem;
  color: var(--charcoal);
}

.az-placement-terms .pt-section p:last-child {
  margin-bottom: 0;
}

.az-placement-terms .pt-section ul {
  margin: 0.5rem 0 1rem 0;
  padding-left: 1.4rem;
  list-style: disc;
}

.az-placement-terms .pt-section li {
  margin-bottom: 0.4rem;
  color: var(--charcoal);
}

.az-placement-terms .pt-section li::marker {
  color: var(--terracotta);
}

.az-placement-terms .pt-section strong {
  color: var(--umber);
  font-weight: 700;
}

.az-placement-terms .pt-section em {
  font-style: italic;
  color: var(--sienna);
}

.az-placement-terms .pt-section a {
  color: var(--terracotta);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.az-placement-terms .pt-section a:hover {
  color: var(--sienna);
}

.az-placement-terms .pt-footer {
  margin: 3.5rem auto 0;
  padding-top: 2rem;
  border-top: 1px solid rgba(147, 56, 24, 0.14);
  text-align: center;
  color: var(--text-secondary);
  font-size: 0.95rem;
}

.az-placement-terms .pt-footer p {
  margin: 0 0 0.5rem;
}

.az-placement-terms .pt-footer a {
  color: var(--rust);
  text-decoration: none;
}

.az-placement-terms .pt-footer a:hover {
  color: var(--terracotta);
  text-decoration: underline;
}

.az-placement-terms .pt-tagline {
  font-family: var(--font-heading);
  font-style: italic;
  color: var(--umber);
  margin-top: 0.25rem;
}

@media (max-width: 720px) {
  .az-placement-terms {
    padding: 3rem 1.25rem 4rem;
  }
  .az-placement-terms .pt-section {
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
  }
  .az-placement-terms .pt-section h2 {
    font-size: 1.25rem;
  }
}

/* Hide page title hero on the premium listing terms page (slug-based class
   is rendered as `.page-id-XXX` once the page is created). Generic hide via
   the wrapper is already handled above, but keep this slot for future
   page-id pinning if needed. */

.az-placement-plans {
  background: #FFFFFF;
  color: var(--charcoal);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  /* Break out of the parent theme's .container (1204px) and span the full
     viewport edge-to-edge. Inner .pp-hero/.pp-tier-section/.pp-closing
     blocks keep their 1080px cap so reading width stays comfortable. */
  position: relative;
  width: 100vw;
  margin-top: -24px;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.az-placement-plans *,
.az-placement-plans *::before,
.az-placement-plans *::after {
  box-sizing: border-box;
}

.az-placement-plans em {
  font-style: italic;
  color: var(--terracotta);
}

.az-placement-plans .pp-hero,
.az-placement-plans .pp-tier-section,
.az-placement-plans .pp-closing {
  max-width: 1320px;
  margin: 0 auto;
  padding: 72px 32px;
}

/* ---- HERO ---- */
.az-placement-plans .pp-hero {
  text-align: center;
  padding-top: 88px;
  padding-bottom: 56px;
  border-bottom: 1px solid rgba(147, 56, 24, 0.18);
}
.az-placement-plans .pp-eyebrow {
  font-family: var(--font-nav);
  font-size: 13px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--desert-sage);
  margin: 0 0 20px;
  font-weight: 700;
}
.az-placement-plans .pp-heading {
  font-family: var(--font-heading);
  font-size: clamp(36px, 5vw, 56px);
  font-weight: 400;
  line-height: 1.15;
  color: var(--charcoal);
  margin: 0 auto 24px;
  max-width: 820px;
}
.az-placement-plans .pp-sub {
  font-size: 19px;
  color: var(--umber);
  max-width: 640px;
  margin: 0 auto 36px;
  line-height: 1.55;
}
.az-placement-plans .pp-hero-note {
  margin: 20px 0 0;
  font-family: var(--font-nav);
  font-size: 14px;
  color: var(--text-secondary);
  font-style: italic;
}

/* ---- CTA ---- */
.az-placement-plans .pp-cta {
  display: inline-block;
  background: var(--terracotta);
  color: var(--porcelain);
  font-family: var(--font-nav);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 16px 36px;
  text-decoration: none;
  border: 2px solid var(--terracotta);
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.az-placement-plans .pp-cta:hover,
.az-placement-plans .pp-cta:focus {
  background: var(--sienna);
  border-color: var(--rust);
  color: var(--porcelain);
  transform: translateY(-1px);
}

/* ---- TIER SECTION ---- */
.az-placement-plans .pp-tier-section {
  padding-top: 64px;
  padding-bottom: 64px;
  border-bottom: 1px solid rgba(147, 56, 24, 0.15);
}

.az-placement-plans .pp-section-meta {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 24px;
  align-items: start;
  margin-bottom: 44px;
}
.az-placement-plans .pp-section-num {
  font-family: var(--font-heading);
  font-size: 52px;
  font-weight: 400;
  color: var(--terracotta);
  line-height: 1;
  letter-spacing: -0.02em;
}
.az-placement-plans .pp-section-title {
  font-family: var(--font-heading);
  font-size: clamp(26px, 3.2vw, 34px);
  font-weight: 400;
  color: var(--charcoal);
  margin: 0 0 10px;
  line-height: 1.2;
}
.az-placement-plans .pp-section-note {
  font-size: 17px;
  color: var(--umber);
  margin: 0;
  max-width: 640px;
  line-height: 1.55;
}

/* ---- TIER GRID ---- */
.az-placement-plans .pp-tier-grid {
  display: grid;
  gap: 28px;
}
.az-placement-plans .pp-tier-grid--2 {
  grid-template-columns: 1fr 1fr;
}

/* ---- TIER BLOCK (not a card — editorial block w/ left accent) ---- */
.az-placement-plans .pp-tier {
  padding: 32px 24px 28px;
  background: rgba(255, 255, 255, 0.45);
  border-left: 3px solid rgba(127, 156, 140, 0.55);
  position: relative;
}
.az-placement-plans .pp-tier--featured {
  background: rgba(231, 211, 168, 0.55);
  border-left: 3px solid var(--terracotta);
}
.az-placement-plans .pp-tier--featured::before {
  content: 'Featured';
  position: absolute;
  top: 20px;
  right: 24px;
  font-family: var(--font-nav);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--terracotta);
  font-weight: 700;
}

.az-placement-plans .pp-tier-head {
  margin-bottom: 20px;
}
.az-placement-plans .pp-tier-name {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 400;
  margin: 0 0 6px;
  color: var(--charcoal);
  line-height: 1.25;
}
.az-placement-plans .pp-tier-limit {
  font-family: var(--font-nav);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--desert-sage);
  margin: 0;
  font-weight: 700;
}
.az-placement-plans .pp-tier--featured .pp-tier-limit {
  color: var(--sienna);
}

.az-placement-plans .pp-tier-price {
  font-family: var(--font-heading);
  font-size: 16px;
  color: var(--umber);
  margin: 0 0 20px;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.az-placement-plans .pp-tier-price span {
  font-size: 44px;
  font-weight: 700;
  color: var(--terracotta);
  letter-spacing: -0.02em;
  line-height: 1;
}
.az-placement-plans .pp-tier-price small {
  font-size: 15px;
  color: var(--umber);
  font-weight: 400;
}
.az-placement-plans .pp-tier-price--lg span {
  font-size: 56px;
}

/* ---- LOGO PLACEHOLDER GRID ---- */
.az-placement-plans .pp-tier-logos {
  display: grid;
  gap: 8px;
  margin-top: 4px;
}
.az-placement-plans .pp-tier-logos--6 {
  grid-template-columns: repeat(3, 1fr);
}
.az-placement-plans .pp-tier-logos--8 {
  grid-template-columns: repeat(4, 1fr);
}
/* Single-column vertical stack of logo cards (used in side-by-side tiers) */
.az-placement-plans .pp-tier-logos--stack {
  grid-template-columns: 1fr;
  gap: 8px;
}

/* ---- SAMPLE CARDS: shrunken homepage sponsor-card style inside placement previews.
   Mirrors .sponsor-item look (warm bg, dashed logo placeholder, proper typography)
   at ~70% of homepage scale so the featured/supporting grids stay compact. ---- */
.az-placement-plans .pp-tier-logos .sponsor-item.pp-sample-card {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  margin: 0;
  background: var(--bg-warm, #FAF6F1);
  border: 1px solid var(--divider, #E8DFD4);
  min-width: 0;
}
.az-placement-plans .pp-tier--supporting .pp-tier-logos .sponsor-item.pp-sample-card {
  background: var(--bg-warm, #FAF6F1);
  min-height: 108px;
}
.az-placement-plans .pp-tier--featured .pp-tier-logos .sponsor-item.pp-sample-card {
  min-height: 108px;
}
.az-placement-plans .pp-tier-logos .pp-sample-card .sponsor-logo-placeholder {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 4px;
  border: 2px dashed var(--divider, #E8DFD4);
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.az-placement-plans .pp-tier-logos .pp-sample-card .sponsor-logo-placeholder img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.az-placement-plans .pp-tier-logos .pp-sample-card .sponsor-info {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
.az-placement-plans .pp-tier-logos .pp-sample-card .sponsor-name {
  font-family: var(--font-nav);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--sienna, #B66037);
  margin: 0 0 2px;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: none;
}
.az-placement-plans .pp-tier-logos .pp-sample-card .sponsor-desc {
  font-family: var(--font-body);
  font-size: 10.5px;
  font-style: italic;
  line-height: 1.35;
  color: var(--text-secondary, #6b6b6b);
  font-weight: 300;
  margin: 0;
  overflow-wrap: break-word;
}
/* Tighten supporting grid from 4 cols → 3 cols so cards have room */
.az-placement-plans .pp-tier-logos--12 {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 700px) {
  .az-placement-plans .pp-tier-logos--6,
  .az-placement-plans .pp-tier-logos--8,
  .az-placement-plans .pp-tier-logos--12 {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ---- TIER LIST (bullets inside tier) ---- */
.az-placement-plans .pp-tier-list {
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
}
.az-placement-plans .pp-tier-list li {
  padding-left: 22px;
  position: relative;
  margin-bottom: 8px;
  color: var(--charcoal);
  font-size: 15px;
  line-height: 1.5;
}
.az-placement-plans .pp-tier-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 11px;
  width: 12px;
  height: 2px;
  background: var(--desert-sage);
}
.az-placement-plans .pp-tier-list li:last-child {
  margin-bottom: 0;
}

/* ---- SECTION NOTES (below category section) ---- */
.az-placement-plans .pp-section-notes {
  list-style: none;
  padding: 28px 0 0;
  margin: 32px 0 0;
  border-top: 1px solid rgba(147, 56, 24, 0.18);
  display: flex;
  flex-wrap: wrap;
  gap: 14px 40px;
}
.az-placement-plans .pp-section-notes li {
  padding-left: 24px;
  position: relative;
  font-size: 15px;
  color: var(--umber);
  line-height: 1.5;
}
.az-placement-plans .pp-section-notes li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--desert-sage);
  font-weight: 700;
}
.az-placement-plans .pp-section-notes strong {
  color: var(--charcoal);
  font-weight: 700;
}

/* ---- LEARNING TOOLS (single tier, wider layout) ---- */
.az-placement-plans .pp-learning-tools {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 56px;
  align-items: center;
  background: rgba(231, 211, 168, 0.5);
  border-left: 3px solid var(--terracotta);
  padding: 40px 44px;
}
.az-placement-plans .pp-lt-features {
  list-style: none;
  padding: 0;
  margin: 0;
}
.az-placement-plans .pp-lt-features li {
  padding-left: 30px;
  position: relative;
  margin-bottom: 12px;
  font-size: 17px;
  line-height: 1.5;
  color: var(--charcoal);
}
.az-placement-plans .pp-lt-features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--desert-sage);
  font-weight: 700;
  font-size: 17px;
}
.az-placement-plans .pp-lt-features li:last-child {
  margin-bottom: 0;
}
.az-placement-plans .pp-lt-price .pp-tier-price {
  margin: 0;
}

/* ---- EXAMPLES BLOCK (Family Support) ---- */
.az-placement-plans .pp-examples {
  margin-top: 32px;
  padding: 28px 32px;
  background: rgba(127, 156, 140, 0.14);
  border-left: 3px solid var(--desert-sage);
}
.az-placement-plans .pp-examples h4 {
  font-family: var(--font-nav);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--desert-sage);
  margin: 0 0 14px;
  font-weight: 700;
}
.az-placement-plans .pp-examples ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 32px;
}
.az-placement-plans .pp-examples li {
  font-family: var(--font-heading);
  font-size: 16px;
  color: var(--charcoal);
  font-style: italic;
}

/* ---- CLOSING CTA ---- */
.az-placement-plans .pp-closing {
  text-align: center;
  padding-top: 80px;
  padding-bottom: 96px;
  border-bottom: none;
}
.az-placement-plans .pp-closing-title {
  font-family: var(--font-heading);
  font-size: clamp(28px, 3.5vw, 36px);
  font-weight: 400;
  margin: 0 0 12px;
  color: var(--charcoal);
  line-height: 1.2;
}
.az-placement-plans .pp-closing-sub {
  font-size: 17px;
  color: var(--umber);
  margin: 0 auto 28px;
  max-width: 520px;
  line-height: 1.55;
}
.az-placement-plans .pp-closing-note {
  margin: 32px 0 0;
  font-size: 13px;
  color: var(--text-secondary);
  font-family: var(--font-nav);
}
.az-placement-plans .pp-closing-note a {
  color: var(--sienna);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.az-placement-plans .pp-closing-note a:hover {
  color: var(--rust);
}

/* ---- RESPONSIVE ---- */
@media (max-width: 860px) {
  .az-placement-plans .pp-learning-tools {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 32px;
  }
}

@media (max-width: 720px) {
  .az-placement-plans .pp-hero,
  .az-placement-plans .pp-tier-section,
  .az-placement-plans .pp-closing {
    padding: 48px 20px;
  }
  .az-placement-plans .pp-hero {
    padding-top: 64px;
  }
  .az-placement-plans .pp-tier-grid--2 {
    grid-template-columns: 1fr;
  }
  .az-placement-plans .pp-section-meta {
    grid-template-columns: 64px 1fr;
    gap: 16px;
    margin-bottom: 32px;
  }
  .az-placement-plans .pp-section-num {
    font-size: 40px;
  }
  .az-placement-plans .pp-tier {
    padding: 24px 24px 22px;
  }
  .az-placement-plans .pp-tier--featured::before {
    top: 16px;
    right: 18px;
  }
  .az-placement-plans .pp-tier-price span {
    font-size: 38px;
  }
  .az-placement-plans .pp-tier-price--lg span {
    font-size: 46px;
  }
  .az-placement-plans .pp-examples {
    padding: 22px 24px;
  }
  .az-placement-plans .pp-examples ul {
    gap: 6px 20px;
  }
}

/* =========================================================================
   Logged-in account menu — replaces the Sign In link + Register CTA with an
   account icon whose dropdown holds portal link(s) + Sign Out (injected by
   azedv_account_menu_nav).
   ========================================================================= */

/* Logged in: retire the logged-out auth controls. The :not() chain mirrors
   the generic menu-item display rule in the NAVIGATION REDESIGN section so
   this rule outranks its `display: inline-block !important`. */
body.logged-in .site-header .header-navbar__menu > ul.menu > li.menu-item--signin:not(.menu-item--user-account):not(.menu-item--user-login):not(:has(.hp-menu__item)),
body.logged-in .site-header .header-navbar__menu > ul.menu > li.menu-item--get-started:not(.menu-item--user-account):not(.menu-item--user-login):not(:has(.hp-menu__item)),
body.logged-in #menu-main-menu-2 > li.menu-item--signin:not(.menu-item--user-account):not(.menu-item--user-login):not(:has(.hp-menu__item)),
body.logged-in #menu-main-menu-2 > li.menu-item--get-started:not(.menu-item--user-account):not(.menu-item--user-login):not(:has(.hp-menu__item)),
body.logged-in .site-header .header-navbar__burger > ul.menu > li.menu-item--signin,
body.logged-in .site-header .header-navbar__burger > ul.menu > li.menu-item--get-started {
  display: none !important;
}

/* Icon pinned to the far right — the slot the Register CTA occupies.
   The li spans the FULL navbar height (top/bottom 0) so the flyout's
   top: 100% lands exactly on the navbar's bottom border instead of
   mid-navbar; the toggle's height: 100% keeps the avatar centered. */
.site-header .header-navbar__menu > ul.menu > li.azedv-account-menu,
#menu-main-menu-2 > li.azedv-account-menu {
  position: absolute !important;
  right: 2rem !important;
  top: 0 !important;
  bottom: 0 !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.site-header .azedv-account-menu__toggle {
  display: inline-flex !important;
  align-items: center !important;
  height: 100%;
  gap: 5px;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 4px !important;
  color: var(--terracotta);
  line-height: 1;
  cursor: pointer;
}
.site-header .azedv-account-menu__toggle:hover,
.site-header .azedv-account-menu__toggle:focus {
  color: var(--sienna);
  background: none !important;
}
.site-header .azedv-account-menu__toggle:focus-visible {
  outline: 3px solid var(--rust);
  outline-offset: 2px;
}
/* Avatar circle — mirrors .azedv-pp__icon-btn on the parent dashboard so the
   logged-in identity icon reads the same in the nav and the welcome bar. */
.site-header .azedv-account-menu__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--bg-warm);
  border: 1px solid var(--divider);
  color: var(--charcoal);
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}
.site-header .azedv-account-menu__toggle:hover .azedv-account-menu__avatar,
.site-header .azedv-account-menu__toggle:focus .azedv-account-menu__avatar,
.site-header .azedv-account-menu.is-open .azedv-account-menu__avatar {
  background: var(--warm-sand-light);
  border-color: var(--terracotta);
  color: var(--terracotta);
}
/* Account owner's name next to the avatar ("Welcome, {first name}") —
   ellipsized so an unusually long name can't crowd the nav links. */
.site-header .azedv-account-menu__name {
  font-family: var(--font-nav);
  font-size: 14px;
  line-height: 1;
  color: var(--charcoal);
  white-space: nowrap;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 140ms ease;
}
.site-header .azedv-account-menu__toggle:hover .azedv-account-menu__name,
.site-header .azedv-account-menu__toggle:focus .azedv-account-menu__name,
.site-header .azedv-account-menu.is-open .azedv-account-menu__name {
  color: var(--terracotta);
}

.site-header .azedv-account-menu__caret {
  font-size: 0.7rem;
  line-height: 1;
  color: var(--charcoal);
  transition: transform 0.15s ease;
}
.site-header .azedv-account-menu.is-open .azedv-account-menu__caret {
  transform: rotate(180deg);
}

/* Flyout panel — a <div>, not a nested <ul>, so the parent theme's menu JS
   (hoverIntent + slideUp/Down bound to any li with a child ul) and its
   submenu CSS (display:none except li:hover; left-offset positioning that
   over-constrains our right: 0) never claim it. Open/closed is driven purely
   by .is-open's opacity/visibility. left: auto guards the right-alignment. */
.site-header .azedv-account-menu__menu {
  position: absolute;
  top: 100%;
  right: 0;
  left: auto;
  min-width: 200px;
  margin: 0;
  padding: 6px 0;
  background: var(--bg-white);
  border: 1px solid rgba(51, 51, 51, 0.12);
  border-top: 3px solid var(--terracotta);
  box-shadow: 0 8px 24px rgba(97, 20, 7, 0.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0s linear 0.15s;
  z-index: 100;
}
.site-header .azedv-account-menu.is-open .azedv-account-menu__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0s linear 0s;
}
.site-header .azedv-account-menu__menu a {
  display: block;
  padding: 9px 16px;
  color: var(--charcoal);
  font-family: var(--font-nav);
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
  white-space: nowrap;
}
.site-header .azedv-account-menu__menu a:hover,
.site-header .azedv-account-menu__menu a:focus {
  background: var(--porcelain);
  color: var(--rust);
}
.site-header .azedv-account-menu__menu a.azedv-account-menu__signout {
  border-top: 1px solid var(--divider);
  margin-top: 4px;
  padding-top: 11px;
  color: var(--rust);
}

/* Burger (mobile) menu: no flyout — hide the icon toggle and render the
   portal links + Sign Out as regular stacked drawer entries. (HivePress
   closes the drawer on any inner click, so a toggle could never stay open.) */
.site-header .header-navbar__burger > ul.menu > li.azedv-account-menu {
  position: static !important;
  transform: none !important;
}
.site-header .header-navbar__burger .azedv-account-menu__toggle {
  display: none !important;
}
.site-header .header-navbar__burger .azedv-account-menu__menu {
  display: block !important;
  position: static;
  opacity: 1;
  visibility: visible;
  transform: none;
  margin: 0;
  padding: 0;
  border: none;
  box-shadow: none;
}

/* ==========================================================================
   Vendor dashboard — hide Import/Export Listings buttons
   Melissa curates listings; vendors don't need bulk import/export.
   ========================================================================== */
.hp-listing__action--import,
.hp-listing__action--export {
  display: none !important;
}

/* ==========================================================================
   Progressive Filter Panel — /browse-vendors/
   Empty state, specialty pruning, Valleywide + county accordions.
   ========================================================================== */

/* Use multiple selectors to beat the parent theme's
   `.azedv-sidebar-v2 .hp-field--checkboxes ul li { display: block !important }`
   (specificity 0,3,1). Without these, pruned Specialty <li>s stay visible
   when the user expands the Specialty accordion on /browse-vendors/. */
.azedv-sidebar-v2 .hp-field--checkboxes ul li.azedv-pf-hide,
.hp-page__sidebar .hp-field--checkboxes ul li.azedv-pf-hide,
li.azedv-pf-hide,
.azedv-pf-hide { display: none !important; }

/* When no category is selected, the Specialty/Location/Service Type fields
   stay visible but greyed out via .azedv-pf-locked-cat — no modal hiding. */

/* Location panel: nested progressive disclosure
   (Valleywide + County rows) → Cities. Each county can be collapsed;
   user only sees the city list by expanding the parent county. */
.azedv-pf-loc-source { display: none !important; }
.azedv-pf-loc { margin-top: 4px; }

.azedv-pf-row { border-bottom: 1px solid #ead7b8; }
.azedv-pf-row:last-child { border-bottom: 0; }

.azedv-pf-row__head {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 8px 4px;
}
.azedv-pf-row__head--btn {
  width: 100%;
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}
.azedv-pf-row__head--btn:hover { color: #c96a4a; }

.azedv-pf-row__label {
  /* Hug the checkbox + name only. A <label for=checkbox> toggles its checkbox
     on click, so letting it grow (flex:1) made the whole empty row a toggle
     target — the "selector is on the entire thing" bug. flex:0 keeps the
     clickable label tight to its text; the trailing gap up to the chevron is
     inert head space. Matches the Specialty checkboxes (width:auto). */
  flex: 0 1 auto;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin: 0;
  max-width: calc(100% - 36px);
}
.azedv-pf-row__check {
  opacity: 1 !important;
  position: static !important;
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0;
  accent-color: #c96a4a;
  appearance: auto !important;
  -webkit-appearance: auto !important;
  flex-shrink: 0;
  cursor: pointer;
}
.azedv-pf-row__text {
  display: flex;
  flex-direction: column;
  flex: 0 1 auto;
  min-width: 0;
}
.azedv-pf-row__name {
  font-family: var(--font-body);
  font-size: 0.925rem;
  font-weight: 400;
  letter-spacing: normal;
  color: var(--charcoal);
  line-height: 1.4;
  text-transform: none;
}
.azedv-pf-row--l2 .azedv-pf-row__name { font-weight: 400; color: var(--charcoal); }
.azedv-pf-row__sub {
  display: none;
  font-size: 11px;
  color: #8a7a64;
  margin-top: 1px;
}
.azedv-pf-row__chev {
  flex-shrink: 0;
  margin-left: auto;
  width: 24px;
  height: 24px;
  background: transparent;
  border: 0;
  cursor: pointer;
  font-size: 11px;
  color: #8a7a64;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .2s ease, color .15s;
}
.azedv-pf-row__head--btn .azedv-pf-row__chev { pointer-events: none; }
.azedv-pf-row.is-open > .azedv-pf-row__head .azedv-pf-row__chev,
.azedv-pf-row.is-open > .azedv-pf-row__head--btn .azedv-pf-row__chev {
  transform: rotate(180deg);
}
.azedv-pf-row__body {
  display: none;
  padding: 0 0 6px 22px;
}
.azedv-pf-row.is-open > .azedv-pf-row__body { display: block; }

.azedv-pf-row.is-checked > .azedv-pf-row__head .azedv-pf-row__name { color: #c96a4a; }

.azedv-pf-row--l2 > .azedv-pf-row__head { padding: 4px 6px; }
.azedv-pf-row--l2:hover { background: #fffaf3; }

/* County rows: cities inside are non-interactive until the county checkbox
   is checked. Body still expands via the chevron so the user can preview
   the city list. */
.azedv-pf-row--county.azedv-pf-county-locked > .azedv-pf-row__body {
  opacity: 0.45;
  pointer-events: none;
}

/* Filter gate: dimmed/inert until a category or keyword is chosen
   (azedv-pf-locked-cat). The old second tier — specialty not chosen yet
   (azedv-pf-locked) — was removed 7-05: it froze Location/Service Type
   after picking a category. */
.hp-form__field.azedv-pf-locked-cat {
  opacity: 0.45;
  pointer-events: none;
  position: relative;
}
.hp-form__field.azedv-pf-locked-cat::after {
  content: "Pick a category or search to start";
  display: block;
  font-size: 12px;
  color: #933818;
  font-style: italic;
  margin-top: 4px;
  padding-left: 4px;
}

/* "Can't Find What You Need?" CTA replaces the dead HivePress "Filter" submit
   button in the browse-vendors sidebar (see swapFilterButton in functions.php).
   Desert Sage matches the rest of the site's primary CTA palette. */
.azedv-inquiry-cta {
  display: block;
  width: 100%;
  margin-top: 8px;
}
.azedv-submit-inquiry,
a.azedv-submit-inquiry.hp-form__button {
  background: var(--desert-sage) !important;
  border: 2px solid var(--desert-sage) !important;
  color: #ffffff !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  text-align: center;
  line-height: 1.25;
}
.azedv-submit-inquiry i,
a.azedv-submit-inquiry.hp-form__button i {
  font-size: 14px;
  color: #ffffff !important;
}
.azedv-submit-inquiry:hover,
.azedv-submit-inquiry:focus,
a.azedv-submit-inquiry.hp-form__button:hover,
a.azedv-submit-inquiry.hp-form__button:focus {
  background: var(--desert-sage-hover) !important;
  border-color: var(--desert-sage-hover) !important;
  color: #ffffff !important;
}
.azedv-inquiry-cta__help {
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: #6b6b6b;
  font-style: italic;
  text-align: center;
}

/* "Start New Search" button under the inquiry CTA — full-width outlined
   button instead of the old bare text link nobody could find. */
.azedv-inquiry-cta .azedv-clear-filters {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 10px 16px;
  border: 2px solid var(--terracotta, #C96A4A);
  border-radius: 4px;
  background: #fff;
  color: var(--terracotta, #C96A4A);
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  line-height: 1.25;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.azedv-inquiry-cta .azedv-clear-filters:hover,
.azedv-inquiry-cta .azedv-clear-filters:focus {
  background: var(--terracotta, #C96A4A);
  color: #fff;
}
/* display:block above would defeat the hidden attribute — keep it working. */
.azedv-inquiry-cta .azedv-clear-filters[hidden] {
  display: none !important;
}

/* ────────────────────────────────────────────────────────────
 * Stripe upgrade modal — opened by the vendor dashboard
 * "Upgrade to unlock all features" button. Porcelain card,
 * rust border, editorial type; matches the .azedv-ci-pop family.
 * ──────────────────────────────────────────────────────────── */
.azedv-upgrade-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(51, 51, 51, 0.45);
}
.azedv-upgrade-modal {
  position: relative;
  width: 100%;
  max-width: 430px;
  padding: 28px 30px 24px;
  background: var(--porcelain, #F5E2D0);
  border: 1.5px solid rgba(97, 20, 7, 0.25);
  border-radius: 12px;
  font-family: var(--font-body, Inter, sans-serif);
}
.azedv-upgrade-modal__close {
  position: absolute;
  top: 12px;
  right: 12px;
  padding: 6px;
  border: 0;
  background: transparent;
  color: rgba(97, 20, 7, 0.55);
  cursor: pointer;
  line-height: 0;
}
.azedv-upgrade-modal__close:hover,
.azedv-upgrade-modal__close:focus-visible {
  color: var(--umber, #611407);
}
.azedv-upgrade-modal__heading {
  margin: 0 0 6px;
  font-family: var(--font-heading, Merriweather, serif);
  font-size: 1.25rem;
  line-height: 1.3;
  color: var(--umber, #611407);
}
.azedv-upgrade-modal__sub {
  margin: 0 0 18px;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--text-secondary, #6B6560);
}
.azedv-upgrade-modal__option {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 13px 2px;
  border-top: 1px solid rgba(97, 20, 7, 0.16);
  color: var(--text, #333333);
  text-decoration: none;
}
.azedv-upgrade-modal__option:last-of-type {
  border-bottom: 1px solid rgba(97, 20, 7, 0.16);
}
.azedv-upgrade-modal__opt-label {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-weight: 700;
  letter-spacing: 0.02em;
}
.azedv-upgrade-modal__opt-price {
  color: var(--terracotta, #C96A4A);
  font-weight: 600;
}
.azedv-upgrade-modal__opt-arrow {
  margin-left: auto;
  align-self: center;
  line-height: 0;
  color: rgba(97, 20, 7, 0.4);
  transition: color 0.12s ease, transform 0.12s ease;
}
.azedv-upgrade-modal__option:hover .azedv-upgrade-modal__opt-label,
.azedv-upgrade-modal__option:focus-visible .azedv-upgrade-modal__opt-label {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.azedv-upgrade-modal__option:hover .azedv-upgrade-modal__opt-arrow,
.azedv-upgrade-modal__option:focus-visible .azedv-upgrade-modal__opt-arrow {
  color: var(--terracotta, #C96A4A);
  transform: translateX(3px);
}
.azedv-upgrade-modal__note {
  margin: 12px 0 0;
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--text-secondary, #6B6560);
  font-style: italic;
}

/* ==========================================================================
   Premium self-edit modal (deliverable 09)
   Premium vendors edit their unlocked fields here; the submission is held for
   admin re-approval. Modal shell mirrors the upgrade modal; the form fields are
   modeled on the parent-portal planner box.
   ========================================================================== */
.azedv-edit-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 32px 20px;
  overflow-y: auto;
  background: rgba(51, 51, 51, 0.45);
}
.azedv-edit-modal {
  position: relative;
  width: 100%;
  max-width: 560px;
  margin: auto;
  padding: 28px 30px 24px;
  background: var(--porcelain, #F5E2D0);
  border: 1.5px solid rgba(97, 20, 7, 0.25);
  border-radius: 12px;
  font-family: var(--font-body, Inter, sans-serif);
}
.azedv-edit-modal__close {
  position: absolute;
  top: 12px;
  right: 12px;
  padding: 6px;
  border: 0;
  background: transparent;
  color: rgba(97, 20, 7, 0.55);
  cursor: pointer;
  line-height: 0;
}
.azedv-edit-modal__close:hover,
.azedv-edit-modal__close:focus-visible {
  color: var(--umber, #611407);
}
.azedv-edit-modal__heading {
  margin: 0 0 6px;
  font-family: var(--font-heading, Merriweather, serif);
  font-size: 1.25rem;
  line-height: 1.3;
  color: var(--umber, #611407);
}
.azedv-edit-modal__intro {
  margin: 0 0 18px;
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--text-secondary, #6B6560);
}
.azedv-edit-field {
  display: block;
  margin: 0 0 14px;
}
.azedv-edit-field__label {
  display: block;
  margin-bottom: 4px;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--text, #333333);
}
.azedv-edit-field__hint {
  display: block;
  margin-bottom: 5px;
  font-size: 0.76rem;
  line-height: 1.4;
  color: var(--text-secondary, #6B6560);
}
.azedv-edit-field__input {
  width: 100%;
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.92rem;
  color: var(--charcoal, #333333);
  background: #ffffff;
  border: 1px solid rgba(97, 20, 7, 0.22);
  border-radius: 3px;
  padding: 0.55rem 0.7rem;
  box-sizing: border-box;
}
textarea.azedv-edit-field__input {
  resize: vertical;
  min-height: 84px;
}
.azedv-edit-field__input:focus {
  outline: none;
  border-color: var(--terracotta, #C96A4A);
  box-shadow: 0 0 0 2px rgba(201, 106, 74, 0.15);
}
.azedv-edit-row {
  display: flex;
  gap: 12px;
}
.azedv-edit-row .azedv-edit-field {
  flex: 1;
  margin-bottom: 6px;
}
.azedv-edit-hint-row {
  margin: 0 0 14px;
  font-size: 0.76rem;
  line-height: 1.4;
  color: var(--text-secondary, #6B6560);
}
.azedv-edit-feedback {
  margin: 4px 0 0;
  font-size: 0.85rem;
  line-height: 1.45;
}
.azedv-edit-feedback--ok {
  color: var(--desert-sage-hover, #6A8778);
  font-weight: 600;
}
.azedv-edit-feedback--err {
  color: var(--rust, #933818);
  font-weight: 600;
}
.azedv-edit-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}
.azedv-edit-cancel {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-secondary, #6B6560);
  background: transparent;
  border: 0;
  padding: 0.5rem 0.4rem;
  cursor: pointer;
}
.azedv-edit-cancel:hover { color: var(--umber, #611407); }
.azedv-edit-submit {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #ffffff;
  background: var(--desert-sage, #7F9C8C);
  border: none;
  border-radius: 3px;
  padding: 0.6rem 1.2rem;
  cursor: pointer;
  transition: background 0.15s;
}
.azedv-edit-submit:disabled { opacity: 0.65; cursor: not-allowed; }
.azedv-edit-submit:not(:disabled):hover { background: var(--desert-sage-hover, #6A8778); }

/* "Changes in review" note next to the Edit button on a card with a pending edit */
.azedv-v2-edit-pending {
  margin-left: 10px;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.76rem;
  font-style: italic;
  color: var(--sienna, #B66037);
}
@media (max-width: 560px) {
  .azedv-edit-row { flex-direction: column; gap: 0; }
}

/* ── Premium edit modal — scope-locking sections (deliverable 10) ───────────
   Each editable group is a collapsible "planner-box" section: clear warm-sand
   panel, terracotta left accent, no drop shadow (per brand anti-patterns). */
.azedv-edit-section {
  margin: 0 0 14px;
  border: 1px solid rgba(97, 20, 7, 0.16);
  border-left: 3px solid var(--terracotta, #C96A4A);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.55);
}
.azedv-edit-section__summary {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 11px 14px;
  cursor: pointer;
  list-style: none;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--umber, #611407);
}
.azedv-edit-section__summary::-webkit-details-marker { display: none; }
.azedv-edit-section__summary::after {
  content: '';
  margin-left: auto;
  width: 8px;
  height: 8px;
  border-right: 2px solid rgba(97, 20, 7, 0.5);
  border-bottom: 2px solid rgba(97, 20, 7, 0.5);
  transform: rotate(45deg);
  transition: transform 0.15s;
}
.azedv-edit-section[open] > .azedv-edit-section__summary::after { transform: rotate(-135deg); }
.azedv-edit-section__summary:focus-visible {
  outline: 2px solid var(--terracotta, #C96A4A);
  outline-offset: -2px;
}
.azedv-edit-section__summary svg { flex: 0 0 auto; }
.azedv-edit-section__hint {
  margin: 0;
  padding: 0 14px 4px;
  font-size: 0.76rem;
  line-height: 1.4;
  color: var(--text-secondary, #6B6560);
}
.azedv-edit-section__body { padding: 4px 14px 14px; }
.azedv-edit-section__body .azedv-edit-field:last-child { margin-bottom: 0; }

/* Global / per-listing contact scope toggle */
.azedv-edit-scope {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 2px 0 16px;
  padding: 10px 12px;
  background: rgba(127, 156, 140, 0.14);
  border: 1px solid rgba(127, 156, 140, 0.4);
  border-radius: 4px;
  cursor: pointer;
}
.azedv-edit-scope input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  accent-color: var(--desert-sage, #7F9C8C);
  cursor: pointer;
}
.azedv-edit-scope__text { display: block; }
.azedv-edit-scope__label {
  display: block;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text, #333333);
}
.azedv-edit-scope__text .azedv-edit-field__hint { margin: 3px 0 0; }

/* Universal image upload box */
.azedv-edit-image { margin: 4px 0 6px; }
.azedv-edit-image__thumbs {
  display: flex;
  gap: 16px;
  align-items: flex-end;
  margin: 10px 0;
  flex-wrap: wrap;
}
.azedv-edit-img {
  margin: 0;
  text-align: center;
}
.azedv-edit-img img {
  display: block;
  width: 96px;
  height: 96px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid rgba(97, 20, 7, 0.22);
  background: #fff;
}
.azedv-edit-img--new img { border: 2px solid var(--sienna, #B66037); }
.azedv-edit-img figcaption {
  margin-top: 4px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-secondary, #6B6560);
}
.azedv-edit-img--new figcaption { color: var(--sienna, #B66037); }
.azedv-edit-image__controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.azedv-edit-image__browse {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0.5rem 0.9rem;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--umber, #611407);
  background: #fff;
  border: 1.5px solid var(--terracotta, #C96A4A);
  border-radius: 3px;
  cursor: pointer;
  transition: background 0.15s;
}
.azedv-edit-image__browse:hover { background: var(--porcelain, #F5E2D0); }
.azedv-edit-image__remove {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--rust, #933818);
  background: transparent;
  border: 0;
  padding: 0.4rem 0.2rem;
  cursor: pointer;
}
.azedv-edit-image__remove:hover { text-decoration: underline; }
.azedv-edit-image__status {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-secondary, #6B6560);
}
.azedv-edit-image__status--err { color: var(--rust, #933818); }

/* Read-only "Managed by our team" locked panel */
.azedv-edit-section--locked {
  border-left-color: rgba(97, 20, 7, 0.28);
  background: rgba(51, 51, 51, 0.035);
}
.azedv-edit-section--locked .azedv-edit-section__summary { color: var(--text-secondary, #6B6560); }
.azedv-edit-section--locked .azedv-edit-section__summary svg { opacity: 0.7; }
.azedv-edit-locked__row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 7px 0;
  border-top: 1px solid rgba(51, 51, 51, 0.08);
  font-size: 0.85rem;
}
.azedv-edit-locked__row:first-of-type { border-top: 0; }
.azedv-edit-locked__label {
  flex: 0 0 auto;
  font-weight: 700;
  color: var(--text-secondary, #6B6560);
}
.azedv-edit-locked__val {
  text-align: right;
  color: var(--text, #333333);
}
.azedv-edit-locked__val em { color: #9a948e; }

/* Post-checkout confirmation banner (?upgraded=1) */
.azedv-upgrade-banner {
  margin: 0 0 18px;
  padding: 12px 16px;
  border-left: 3px solid var(--desert-sage, #7F9C8C);
  background: rgba(127, 156, 140, 0.12);
  color: var(--text, #333333);
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.92rem;
  line-height: 1.5;
}

/* "Premium active" badge — replaces the Upgrade pill on paid cards */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--premium .azedv-v2-premium-active {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--desert-sage, #7F9C8C);
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--premium .azedv-v2-premium-active .azedv-v2-check {
  line-height: 0;
}

/* Deliverable 18 (item 16) — "Premium — pending approval": a paid-but-not-yet-
   approved upgrade. Premium features stay LOCKED until Melissa approves, so the
   card is still classed --basic and the badge sits in the upgrade-wrap slot.
   Amber reads as "in review", distinct from the sage "Premium active". */
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-v2-premium-pending {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #bd5800;
  text-align: right;
}

/* ==========================================================================
   Exit-Intent Newsletter Popup
   Matches the established modal language (umber-tinted overlay, warm panel)
   with the footer newsletter button treatment for the CTA.
   ========================================================================== */

.azedv-exitpop {
  position: fixed;
  inset: 0;
  background: rgba(97, 20, 7, 0.55);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  z-index: 10000;
}

.azedv-exitpop.is-open {
  display: flex;
  animation: azedv-exitpop-fade 0.25s ease;
}

.azedv-exitpop__panel {
  position: relative;
  background: #FBEFE2;
  border-radius: 18px;
  max-width: 480px;
  width: 100%;
  max-height: calc(100vh - 3rem);
  overflow-y: auto;
  padding: 2.75rem 2.75rem 2.5rem;
  box-shadow: 0 24px 60px rgba(97, 20, 7, 0.30);
  font-family: var(--font-body, Inter, sans-serif);
  color: var(--charcoal, #333);
}

.azedv-exitpop.is-open .azedv-exitpop__panel {
  animation: azedv-exitpop-rise 0.3s ease;
}

@keyframes azedv-exitpop-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes azedv-exitpop-rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .azedv-exitpop.is-open,
  .azedv-exitpop.is-open .azedv-exitpop__panel {
    animation: none;
  }
}

.azedv-exitpop__close {
  position: absolute;
  top: 0.875rem;
  right: 0.875rem;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.7);
  border: none;
  cursor: pointer;
  color: var(--charcoal, #333);
  transition: background 0.15s ease;
}

.azedv-exitpop__close svg { display: block; margin: auto; }

.azedv-exitpop__close:hover {
  background: #fff;
  color: var(--terracotta, #C96A4A);
}

.azedv-exitpop__title {
  font-family: var(--font-heading, Merriweather, serif);
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 0.4rem;
  color: var(--charcoal, #333);
}

/* Short sage rule under the heading — editorial divider, not a border box. */
.azedv-exitpop__title::after {
  content: '';
  display: block;
  width: 44px;
  height: 3px;
  margin-top: 0.85rem;
  background: var(--desert-sage, #7F9C8C);
}

.azedv-exitpop__lead {
  font-size: 1rem;
  line-height: 1.55;
  color: var(--text-secondary, #6B6560);
  margin: 1rem 0 1.4rem;
}

.azedv-exitpop__label {
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-light, #9A9389);
  margin: 0 0 0.65rem;
}

.azedv-exitpop__list {
  list-style: none;
  margin: 0 0 1.75rem;
  padding: 0;
}

.azedv-exitpop__list li {
  position: relative;
  padding-left: 1.6rem;
  margin-bottom: 0.8rem;
  font-size: 0.95rem;
  line-height: 1.5;
}

.azedv-exitpop__list li:last-child { margin-bottom: 0; }

.azedv-exitpop__list li::before {
  content: '\2713';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--desert-sage, #7F9C8C);
  font-weight: 700;
}

.azedv-exitpop__detail {
  display: block;
  font-size: 0.83rem;
  line-height: 1.5;
  color: var(--text-secondary, #6B6560);
  margin-top: 0.15rem;
}

/* Same treatment as the footer "Subscribe for Free" button. */
a.azedv-exitpop__btn {
  display: inline-block;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #fff;
  background: var(--terracotta, #C96A4A);
  padding: 0.85rem 2rem;
  text-decoration: none;
  transition: background 0.2s;
}

a.azedv-exitpop__btn:hover {
  background: var(--terracotta-hover, #B55D40);
  color: #fff;
}

@media (max-width: 600px) {
  .azedv-exitpop { padding: 1rem; }
  .azedv-exitpop__panel { padding: 2.25rem 1.5rem 2rem; }
  .azedv-exitpop__title { font-size: 1.45rem; }
}

/* ────────────────────────────────────────────────────────────
   Vendor dashboard — no-listings empty state (/account/listings/)
   Shown when the signed-in account has zero listings: account email
   doesn't match the listing's email, or the vendor registered before
   submitting. Editorial layout — warm-sand dividers separate the two
   paths; the email CTA matches the intake form's square terracotta
   button; the submit path is an underlined text link.
   ──────────────────────────────────────────────────────────── */
.azedv-vd-empty {
  max-width: 640px;
  margin: 0.5rem 0 3rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  color: var(--text, #333333);
}

.azedv-vd-empty__heading {
  font-family: var(--font-heading, 'Merriweather', serif);
  font-size: 1.75rem;
  line-height: 1.3;
  color: var(--text, #333333);
  margin: 0 0 0.75rem;
}

.azedv-vd-empty__intro {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--text-secondary, #6B6560);
  margin: 0 0 1.5rem;
}

.azedv-vd-empty__path {
  border-top: 1px solid var(--warm-sand, #E7D3A8);
  padding: 1.5rem 0 1.85rem;
}

.azedv-vd-empty__title {
  font-family: var(--font-heading, 'Merriweather', serif);
  font-size: 1.2rem;
  line-height: 1.35;
  color: var(--text, #333333);
  margin: 0 0 0.5rem;
}

.azedv-vd-empty__text {
  font-size: 0.97rem;
  line-height: 1.65;
  color: var(--text, #333333);
  margin: 0 0 1.1rem;
}

.azedv-vd-empty__cta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin: 0;
}

/* Same treatment as the intake form's submit button. */
a.azedv-vd-empty__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1.9rem;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #fff;
  background: var(--terracotta, #C96A4A);
  border-radius: 0;
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.1s ease;
}

a.azedv-vd-empty__btn:hover {
  background: var(--sienna, #B66037);
  color: #fff;
}

a.azedv-vd-empty__btn:active {
  transform: translateY(1px);
}

a.azedv-vd-empty__btn:focus-visible {
  outline: 3px solid var(--desert-sage, #7F9C8C);
  outline-offset: 3px;
}

.azedv-vd-empty__email {
  font-size: 0.95rem;
  color: var(--rust, #933818);
  user-select: all; /* one click selects the address for copying */
}

a.azedv-vd-empty__link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.97rem;
  font-weight: 700;
  color: var(--rust, #933818) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.15s ease;
}

a.azedv-vd-empty__link:hover {
  color: var(--sienna, #B66037) !important;
}

a.azedv-vd-empty__link:focus-visible {
  outline: 3px solid var(--desert-sage, #7F9C8C);
  outline-offset: 3px;
}

a.azedv-vd-empty__link svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

@media (max-width: 600px) {
  .azedv-vd-empty__heading { font-size: 1.45rem; }
  a.azedv-vd-empty__btn { width: 100%; }
}

/* ══════════════════════════════════════════════════════════════════════
   2026-07-02 client round — "Premium Updates" button + locked basic modal
   ══════════════════════════════════════════════════════════════════════ */

/* Bottom-right stack: tier badge (or Upgrade CTA) with the Premium Updates
   button beneath it. The wrap takes over grid alignment from the badge. */
body.azedv-account-wide .azedv-card-v2 .azedv-v2-premium-wrap {
  justify-self: end;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  text-align: right;
}
body.azedv-account-wide .azedv-card-v2.azedv-dash-card--basic .azedv-v2-upgrade-wrap .azedv-v2-premium-updates {
  margin-top: 6px;
}

/* The button itself — compact terracotta pill, same visual language as the
   Contact Provider pill. */
body.azedv-account-wide .azedv-card-v2 .azedv-v2-premium-updates {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  background: var(--terracotta, #C96A4A);
  color: #FFFFFF !important;
  border-radius: 999px;
  font-family: var(--font-nav, 'PT Sans', sans-serif);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}
body.azedv-account-wide .azedv-card-v2 .azedv-v2-premium-updates:hover {
  background: var(--sienna, #B66037);
  color: #FFFFFF !important;
  transform: translateY(-1px);
}
body.azedv-account-wide .azedv-card-v2 .azedv-v2-premium-updates--locked,
body.azedv-account-wide .azedv-card-v2 .azedv-v2-premium-updates--locked:hover {
  background: var(--terracotta, #C96A4A);
  opacity: 0.55;
  cursor: default;
  transform: none;
}

/* Locked (basic-tier) edit modal — a visible preview, clearly not editable. */
.azedv-edit-overlay--basic .azedv-edit-field__input[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
  background: #F5F2EE;
}
.azedv-edit-overlay--basic .azedv-edit-image__browse,
.azedv-edit-overlay--basic .azedv-edit-image__remove {
  pointer-events: none;
  opacity: 0.5;
}
.azedv-edit-overlay--basic .azedv-edit-scope {
  opacity: 0.55;
  pointer-events: none;
}
.azedv-edit-basic-note {
  margin: 4px 0 14px;
  padding: 10px 14px;
  background: rgba(201, 106, 74, 0.08);
  border-left: 3px solid var(--terracotta, #C96A4A);
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--text, #333333);
}