/* ==========================================================================
   ACXPA Directory — app stylesheet
   Version: 0.4.0 (18 Oct 2026, Phase 3: home + supplier profile, review round 2)
   Consumes acxpa-tokens.css only: no hex, no var() fallbacks (R-A1, R-A3).
   Surfaces alternate on purpose: white, sand, harbour tint, deep harbour,
   teal footer — never teal-on-white for every block.
   ========================================================================== */

/* This app runs on a 16px root, so the token type/space scale uses factor 1. */
:root { --acxpa-ds-root-scale: 1; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body.dir {
    margin: 0;
    font-family: var(--acxpa-ds-font);
    font-size: var(--acxpa-ds-text-body);
    line-height: var(--acxpa-ds-leading-body);
    color: var(--acxpa-ds-text);
    background: var(--acxpa-ds-bg);
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--acxpa-ds-link); }
a:hover { color: var(--acxpa-ds-link-hover); }
:focus-visible { outline: 3px solid var(--acxpa-ds-focus); outline-offset: 2px; }
.dir-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dir-skip { position: absolute; left: var(--acxpa-ds-space-md); top: -100px; background: var(--acxpa-ds-white); padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-md); z-index: 10; }
.dir-skip:focus { top: var(--acxpa-ds-space-md); }

.dir-wrap { max-width: 1200px; margin: 0 auto; padding-inline: var(--acxpa-ds-space-lg); }

/* Preview strip (staging only) */
.dir-preview {
    background: var(--acxpa-ds-gold-tint);
    color: var(--acxpa-ds-ink);
    font-size: var(--acxpa-ds-text-small);
    text-align: center;
    padding: var(--acxpa-ds-space-2xs) var(--acxpa-ds-space-md);
}

/* ---- Masthead -------------------------------------------------------- */
.dir-masthead { background: var(--acxpa-ds-white); border-bottom: 1px solid var(--acxpa-ds-border); position: relative; z-index: 5; }
.dir-masthead__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-lg); min-height: 80px; }
.dir-brand { display: inline-flex; align-items: center; gap: var(--acxpa-ds-space-sm); text-decoration: none; }
.dir-brand img { width: 150px; }
.dir-brand__label {
    font-weight: 600;
    font-size: var(--acxpa-ds-text-h4);
    color: var(--acxpa-ds-teal-700);
    padding-left: var(--acxpa-ds-space-sm);
    border-left: 2px solid var(--acxpa-ds-gold);
    line-height: 1.2;
}
.dir-nav { display: flex; align-items: center; gap: var(--acxpa-ds-space-lg); }
.dir-nav a, .dir-nav__out button { white-space: nowrap; }
.dir-nav a:not(.dir-btn) { color: var(--acxpa-ds-ink); text-decoration: none; font-weight: 500; font-size: var(--acxpa-ds-text-small); }
.dir-nav a:not(.dir-btn):hover { color: var(--acxpa-ds-teal-600); text-decoration: underline; text-underline-offset: 4px; }
/* Categories mega menu (Justin, 14 Nov): every category and its specialties in one panel under the masthead. */
.dir-masthead { position: relative; }
.dir-mega__btn span { font-size: .75em; margin-left: 2px; }
.dir-mega__panel { display: none; position: absolute; left: 0; right: 0; top: 100%; z-index: 40; background: var(--acxpa-ds-white); border-top: 3px solid var(--acxpa-ds-gold); box-shadow: 0 18px 40px rgba(20, 37, 42, .16); }
.dir-mega.is-open .dir-mega__panel { display: block; }
.dir-mega.is-open .dir-mega__btn { color: var(--acxpa-ds-teal-700); }
.dir-mega__panel { padding: 0; }
.dir-mega__grid { display: grid; grid-template-columns: 330px minmax(0, 1fr); min-height: 540px; padding-inline: 0; }
/* Left: the categories on a sand rail; the one you're on is white with a gold edge. */
.dir-mega__rail { list-style: none; margin: 0; padding: var(--acxpa-ds-space-md) 0; background: var(--acxpa-ds-sand); }
.dir-nav .dir-mega a.dir-mega__item { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-sm); padding: 9px var(--acxpa-ds-space-lg); border-left: 4px solid transparent; color: var(--acxpa-ds-ink); font-weight: 500; text-decoration: none; white-space: normal; }
.dir-mega__item small { flex-shrink: 0; min-width: 28px; padding: 1px 8px; border-radius: var(--acxpa-ds-radius-pill); background: rgba(20, 37, 42, .07); color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-caption); text-align: center; }
.dir-nav .dir-mega a.dir-mega__item.is-active { background: var(--acxpa-ds-white); border-left-color: var(--acxpa-ds-gold); color: var(--acxpa-ds-teal-800); font-weight: 700; }
/* Right: one category at a time, with its picture, line and specialties. */
.dir-mega__pane { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: var(--acxpa-ds-space-xl); align-items: start; padding: var(--acxpa-ds-space-xl); }
.dir-mega__pane[hidden] { display: none; }
.dir-mega__img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--acxpa-ds-radius-lg); }
.dir-mega__title { margin: 0 0 6px; font-size: var(--acxpa-ds-text-h3); }
.dir-nav .dir-mega__title a { color: var(--acxpa-ds-teal-800); font-weight: 700; font-size: inherit; }
.dir-mega__line { margin: 0 0 var(--acxpa-ds-space-md); color: var(--acxpa-ds-slate); }
.dir-mega__label { margin: 0 0 8px; font-size: var(--acxpa-ds-text-caption); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--acxpa-ds-clay-deep); }
.dir-mega__subs { list-style: none; margin: 0 0 var(--acxpa-ds-space-lg); padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dir-nav .dir-mega__subs a { display: inline-block; padding: 7px 14px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-pill); color: var(--acxpa-ds-ink); font-weight: 500; white-space: normal; }
.dir-nav .dir-mega__subs a:hover { border-color: var(--acxpa-ds-teal-600); color: var(--acxpa-ds-teal-700); text-decoration: none; }
.dir-nav .dir-mega a.dir-mega__cta { color: var(--acxpa-ds-white); }
.dir-nav .dir-mega a.dir-mega__cta:hover { text-decoration: none; }
/* Phone menu: Categories, then each category, open in place. */
.dir-menu__panel { max-height: calc(100vh - 120px); overflow-y: auto; }
.dir-menu .dir-mmenu summary { display: block; padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-md); }
.dir-menu__panel:has(.dir-mmenu[open]) { min-width: min(340px, calc(100vw - 32px)); }
.dir-mmenu summary { list-style: none; cursor: pointer; }
.dir-mmenu summary::-webkit-details-marker { display: none; }
.dir-mmenu > summary::after, .dir-mmenu__cat > summary::after { content: ' ▾'; font-size: .8em; color: var(--acxpa-ds-slate); }
.dir-mmenu[open] > summary::after, .dir-mmenu__cat[open] > summary::after { content: ' ▴'; }
.dir-menu .dir-mmenu__cat > summary { padding-left: calc(var(--acxpa-ds-space-md) + 14px); font-weight: 600; font-size: var(--acxpa-ds-text-small); }
.dir-menu .dir-mmenu__cat a { display: block; padding: 6px var(--acxpa-ds-space-md) 6px calc(var(--acxpa-ds-space-md) + 24px); font-size: var(--acxpa-ds-text-small); }
.dir-menu__panel .dir-mmenu__all { font-weight: 600; color: var(--acxpa-ds-teal-700); }
.dir-menu { display: none; position: relative; }
.dir-brand { flex-shrink: 0; }
/* Signed in adds up to three links (and drops List your business), so the menu takes over sooner. */
@media (max-width: 1100px) { .dir-masthead--auth .dir-nav { display: none; } .dir-masthead--auth .dir-menu { display: block; } }
.dir-menu summary { list-style: none; cursor: pointer; display: grid; gap: 5px; padding: var(--acxpa-ds-space-xs); }
.dir-menu summary::-webkit-details-marker { display: none; }
.dir-menu summary span { display: block; width: 24px; height: 2px; background: var(--acxpa-ds-ink); }
.dir-menu__panel {
    position: absolute; right: 0; top: calc(100% + 8px); min-width: 220px;
    background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-border);
    border-radius: var(--acxpa-ds-radius-md); box-shadow: var(--acxpa-ds-shadow-lg);
    display: grid; padding: var(--acxpa-ds-space-xs) 0;
}
.dir-menu__panel a { padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-md); color: var(--acxpa-ds-ink); text-decoration: none; }
.dir-nav__out { margin: 0; display: contents; }
.dir-nav__out button { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; font-weight: 500; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-ink); }
.dir-nav__out button:hover { color: var(--acxpa-ds-teal-600); text-decoration: underline; text-underline-offset: 4px; }
.dir-menu__panel .dir-nav__out { display: block; }
.dir-menu__panel .dir-nav__out button { display: block; width: 100%; text-align: left; padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-md); font-size: inherit; font-weight: inherit; }

/* ---- Type helpers ---------------------------------------------------- */
.dir-eyebrow {
    font-size: var(--acxpa-ds-text-eyebrow);
    letter-spacing: var(--acxpa-ds-tracking-eyebrow);
    line-height: var(--acxpa-ds-leading-eyebrow);
    text-transform: uppercase;
    font-weight: 600;
    color: var(--acxpa-ds-teal-600);
    margin: 0 0 var(--acxpa-ds-space-sm);
}
.dir-eyebrow--gold { color: var(--acxpa-ds-gold-deep); }
.dir-cta .dir-eyebrow--gold { color: var(--acxpa-ds-gold); }
.dir-h2 {
    font-size: var(--acxpa-ds-text-h2);
    line-height: var(--acxpa-ds-leading-snug);
    color: var(--acxpa-ds-teal-800);
    margin: 0 0 var(--acxpa-ds-space-md);
}
.dir-h2--on-dark { color: var(--acxpa-ds-white); }
.dir-h4 { font-size: var(--acxpa-ds-text-body); font-weight: 600; color: var(--acxpa-ds-ink); margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-sm); }
.dir-fineprint { margin: var(--acxpa-ds-space-lg) 0 0; font-size: var(--acxpa-ds-text-small); }

/* ---- Buttons --------------------------------------------------------- */
.dir-btn {
    display: inline-block;
    font-weight: 600;
    font-size: var(--acxpa-ds-text-body);
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    border: 2px solid transparent;
    border-radius: var(--acxpa-ds-radius-md);
    padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-xl);
    cursor: pointer;
    font-family: inherit;
}
.dir-btn--sm { padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); }
.dir-btn--block { display: block; width: 100%; }
.dir-btn--gold { background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); }
.dir-btn--gold:hover { background: var(--acxpa-ds-gold-mid); color: var(--acxpa-ds-ink); }
.dir-btn--teal { background: var(--acxpa-ds-teal-600); color: var(--acxpa-ds-white); }
.dir-btn--teal:hover { background: var(--acxpa-ds-teal-700); color: var(--acxpa-ds-white); }
.dir-btn--outline { background: var(--acxpa-ds-white); color: var(--acxpa-ds-teal-700); border-color: var(--acxpa-ds-teal-600); }
.dir-btn--outline:hover { background: var(--acxpa-ds-teal-50); color: var(--acxpa-ds-teal-800); }
.dir-btn--ghost { background: transparent; color: var(--acxpa-ds-white); border-color: var(--acxpa-ds-border-on-dark); }
.dir-btn--ghost:hover { background: color-mix(in srgb, var(--acxpa-ds-white) 10%, transparent); color: var(--acxpa-ds-white); }

/* ---- Pills, chips ---------------------------------------------------- */
.dir-pill {
    display: inline-block; font-size: var(--acxpa-ds-text-caption); font-weight: 600;
    letter-spacing: 0.02em; line-height: 1.2;
    padding: var(--acxpa-ds-space-2xs) var(--acxpa-ds-space-sm); border-radius: var(--acxpa-ds-radius-pill);
}
.dir-pill--gold { background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); }
.dir-pill--teal { background: var(--acxpa-ds-teal-50); color: var(--acxpa-ds-teal-700); border: 1px solid var(--acxpa-ds-teal-200); }
.dir-pill--success { background: var(--acxpa-ds-success-tint); color: var(--acxpa-ds-success-deep); }
.dir-pill--muted { background: var(--acxpa-ds-cloud); color: var(--acxpa-ds-slate); border: 1px solid var(--acxpa-ds-stone); }

.dir-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs); }
.dir-chips span, .dir-chips a {
    display: inline-flex; align-items: center; gap: var(--acxpa-ds-space-xs);
    font-size: var(--acxpa-ds-text-small); padding: var(--acxpa-ds-space-2xs) var(--acxpa-ds-space-sm);
    border-radius: var(--acxpa-ds-radius-pill); background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep);
    text-decoration: none;
}
.dir-chips--lg a {
    font-size: var(--acxpa-ds-text-body); font-weight: 500; padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-md);
    background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); color: var(--acxpa-ds-ink);
}
.dir-chips--lg a:hover { border-color: var(--acxpa-ds-teal-600); color: var(--acxpa-ds-teal-700); }
.dir-chips--lg a span { background: var(--acxpa-ds-sand); color: var(--acxpa-ds-slate); padding: 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-caption); }

.dir-markets { display: grid; grid-template-columns: 1fr 1fr; gap: var(--acxpa-ds-space-xl); }
.dir-markets__h { font-size: var(--acxpa-ds-text-small); text-transform: uppercase; letter-spacing: .1em; color: var(--acxpa-ds-clay-deep); margin: 0 0 var(--acxpa-ds-space-sm); }
.dir-initials {
    display: grid; place-items: center; width: 72px; height: 72px; border-radius: var(--acxpa-ds-radius-lg);
    background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); font-weight: 700; font-size: var(--acxpa-ds-text-h3);
}
.dir-initials--fill { width: 100%; height: 100%; border-radius: 0; font-size: var(--acxpa-ds-text-h1); }
.dir-profile-head__logo.dir-profile-head__logo--none { padding: 0; overflow: hidden; border: 0; place-items: stretch; }

/* ---- Sections -------------------------------------------------------- */
.dir-section { padding: var(--acxpa-ds-space-3xl) 0; }
.dir-section--sand { background: var(--acxpa-ds-sand); }
.dir-section--harbour { background: var(--acxpa-ds-harbour-tint); }
.dir-section--harbour .dir-h2 { color: var(--acxpa-ds-harbour-deep); }
.dir-section__head { margin-bottom: var(--acxpa-ds-space-xl); }
.dir-section__intro { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-lead); line-height: 1.5; }

/* ---- Home: hero ------------------------------------------------------ */
.dir-hero { position: relative; overflow: hidden; background: var(--acxpa-ds-cloud); }
.dir-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%; }
.dir-hero::after {
    /* Wash behind the copy column so text stays readable on the photo. */
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(to left,
        color-mix(in srgb, var(--acxpa-ds-white) 94%, transparent) 0%,
        color-mix(in srgb, var(--acxpa-ds-white) 88%, transparent) 42%,
        color-mix(in srgb, var(--acxpa-ds-white) 0%, transparent) 72%);
}
.dir-hero--left::after {
    background: linear-gradient(to right,
        color-mix(in srgb, var(--acxpa-ds-white) 94%, transparent) 0%,
        color-mix(in srgb, var(--acxpa-ds-white) 88%, transparent) 42%,
        color-mix(in srgb, var(--acxpa-ds-white) 0%, transparent) 72%);
}
.dir-hero__inner { position: relative; z-index: 1; display: flex; justify-content: flex-end; padding-top: var(--acxpa-ds-space-4xl); padding-bottom: var(--acxpa-ds-space-4xl); }
.dir-hero--left .dir-hero__inner { justify-content: flex-start; }
.dir-hero__copy { width: min(100%, 600px); }
.dir-hero__title {
    font-size: var(--acxpa-ds-text-h1);
    line-height: var(--acxpa-ds-leading-tight);
    font-weight: 700;
    color: var(--acxpa-ds-teal-800);
    margin: 0 0 var(--acxpa-ds-space-lg);
}
.dir-hero__lead { font-size: var(--acxpa-ds-text-lead); line-height: 1.5; color: var(--acxpa-ds-ink); margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-search {
    display: grid; grid-template-columns: 1fr auto; gap: var(--acxpa-ds-space-xs);
    background: var(--acxpa-ds-white); padding: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-xl);
    border-radius: var(--acxpa-ds-radius-lg); box-shadow: var(--acxpa-ds-shadow-lg); border: 1px solid var(--acxpa-ds-teal-100);
}
.dir-search__q, .dir-search__c {
    font: inherit; font-size: var(--acxpa-ds-text-body); color: var(--acxpa-ds-ink);
    border: 1px solid var(--acxpa-ds-teal-200); border-radius: var(--acxpa-ds-radius-md);
    padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); background-color: var(--acxpa-ds-white); min-width: 0;
}
.dir-search__q { grid-column: 1 / -1; }
/* Search results page: the box sits under the heading, without the hero's shadow (13 Nov). */
.dir-cat-head__inner.dir-cat-head__inner--solo { grid-template-columns: 1fr; }
/* Search again: one full-width row under the heading (Justin, 14 Nov: it sat jammed on the left). */
.dir-search--inline { margin-top: var(--acxpa-ds-space-lg); box-shadow: none; grid-template-columns: minmax(0, 1fr) auto; }
.dir-search--inline .dir-search__q { grid-column: auto; }
@media (max-width: 820px) { .dir-search--inline { grid-template-columns: 1fr; } }
.dir-searched { margin: 0 0 var(--acxpa-ds-space-md); padding: 10px 16px; border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-harbour-tint); font-size: var(--acxpa-ds-text-small); }
.dir-search-lists { margin: 0 0 var(--acxpa-ds-space-xl); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); }
.dir-search-lists__h { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-body); }
.dir-search-lists ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs); }
.dir-search-lists a { display: inline-flex; gap: 6px; align-items: baseline; padding: 6px 14px; border-radius: var(--acxpa-ds-radius-pill); background: var(--acxpa-ds-white); color: var(--acxpa-ds-harbour-deep); font-weight: 600; text-decoration: none; font-size: var(--acxpa-ds-text-small); }
.dir-search-lists a span { font-weight: 400; color: var(--acxpa-ds-slate); }
.dir-search-lists a:hover { box-shadow: inset 0 0 0 1px var(--acxpa-ds-harbour); }

/* ---- Selects: one chevron, inset from the edge, drawn from tokens ------- */
.dir-filters select, .dir-search__c, .dir-market__switch select {
    appearance: none; -webkit-appearance: none; cursor: pointer;
    background-color: var(--acxpa-ds-white);
    background-image: linear-gradient(45deg, transparent 50%, var(--acxpa-ds-teal-700) 50%), linear-gradient(135deg, var(--acxpa-ds-teal-700) 50%, transparent 50%);
    background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%;
    background-size: 6px 6px; background-repeat: no-repeat;
    padding-right: 44px;
}
.dir-filters select:focus-visible, .dir-search__c:focus-visible, .dir-market__switch select:focus-visible { outline: 2px solid var(--acxpa-ds-teal-600); outline-offset: 1px; }
.dir-search__q::placeholder { color: var(--acxpa-ds-slate); }

/* ---- Home: stats band ------------------------------------------------ */
.dir-stats { background: var(--acxpa-ds-teal-800); color: var(--acxpa-ds-text-on-dark); }
.dir-stats__inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--acxpa-ds-space-md); padding-top: var(--acxpa-ds-space-lg); padding-bottom: var(--acxpa-ds-space-lg); }
.dir-stats p { margin: 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-text-muted-on-dark); }
.dir-stats strong { display: block; font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-gold); line-height: 1.2; }

/* ---- Home: category cards -------------------------------------------- */
.dir-cats { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-lg); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dir-cat__link {
    display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit;
    background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); overflow: hidden;
    box-shadow: var(--acxpa-ds-shadow-md); transition: transform .15s ease, box-shadow .15s ease;
}
.dir-cat__link:hover { transform: translateY(-2px); box-shadow: var(--acxpa-ds-shadow-lg); }
.dir-cat__link img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.dir-cat__body { display: flex; flex-direction: column; gap: var(--acxpa-ds-space-xs); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg) var(--acxpa-ds-space-lg); flex: 1; }
.dir-cat__name { font-weight: 700; font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-teal-800); line-height: 1.3; }
.dir-cat__tag { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); line-height: 1.5; flex: 1; }
.dir-cat--big { grid-column: span 2; }
.dir-cat--big .dir-cat__link { flex-direction: row; min-height: 100%; }
.dir-cat--big picture { flex: 0 0 55%; }
.dir-cat--big .dir-cat__link img { height: 100%; aspect-ratio: auto; }
.dir-cat--big .dir-cat__body { justify-content: center; padding: var(--acxpa-ds-space-xl); }
.dir-cat--big .dir-cat__name { font-size: var(--acxpa-ds-text-h3); }
.dir-cat--big .dir-cat__tag { flex: 0 1 auto; font-size: var(--acxpa-ds-text-body); }
.dir-cat__count { font-size: var(--acxpa-ds-text-caption); font-weight: 600; color: var(--acxpa-ds-clay-deep); text-transform: uppercase; letter-spacing: .06em; }

/* ---- Featured / similar supplier cards ------------------------------- */
.dir-feat { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-lg); grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.dir-feat--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dir-feat > li { display: flex; }
.dir-feat__card {
    position: relative; flex: 1; display: flex; flex-direction: column; gap: var(--acxpa-ds-space-sm); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone);
    border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); box-shadow: 0 2px 8px rgba(20, 37, 42, .06);
}
.dir-feat__card--featured { border-top: 4px solid var(--acxpa-ds-gold); }
.dir-feat__card .dir-pill { position: absolute; top: var(--acxpa-ds-space-md); right: var(--acxpa-ds-space-md); }
.dir-feat__top { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); padding-right: 76px; }
.dir-feat__logo { flex: none; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 12px; border: 1px solid var(--acxpa-ds-stone); background: #fff; overflow: hidden; }
.dir-feat__logo img { max-width: 56px; max-height: 56px; width: auto; height: auto; object-fit: contain; }
.dir-feat__name { font-size: var(--acxpa-ds-text-h4); margin: 0 0 2px; line-height: 1.25; }
.dir-feat__headline { margin: 0; font-weight: 600; color: var(--acxpa-ds-ink); line-height: 1.45; }
.dir-feat__hl { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-ink); }
.dir-feat__hl li { position: relative; padding-left: 22px; }
.dir-feat__hl li::before { content: "✓"; position: absolute; left: 0; color: var(--acxpa-ds-success); font-weight: 800; }
.dir-feat__meta { margin: auto 0 0; padding-top: var(--acxpa-ds-space-xs); display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; color: var(--acxpa-ds-slate); }
.dir-feat__go { margin-top: 4px; font-weight: 700; color: var(--acxpa-ds-teal-700); font-size: var(--acxpa-ds-text-small); }
.dir-feat__card:hover .dir-feat__go { text-decoration: underline; }
.dir-feat__card.is-preview { box-shadow: 0 8px 24px rgba(20, 37, 42, .12); }
.dir-feat__name a { color: var(--acxpa-ds-ink); text-decoration: none; }
.dir-feat__name a::after { content: ""; position: absolute; inset: 0; }
.dir-feat__card:hover { border-color: var(--acxpa-ds-teal-400); }
.dir-feat__cat { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }

/* ---- Home: steps ----------------------------------------------------- */
.dir-steps { list-style: none; counter-reset: step; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-lg); grid-template-columns: repeat(3, 1fr); }
.dir-steps li { counter-increment: step; background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-xl) var(--acxpa-ds-space-lg); }
.dir-steps li::before {
    content: counter(step); display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
    background: var(--acxpa-ds-harbour); color: var(--acxpa-ds-white); font-weight: 700; margin-bottom: var(--acxpa-ds-space-md);
}
.dir-steps h3 { font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-harbour-deep); margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-steps p { margin: 0 0 var(--acxpa-ds-space-xs); color: var(--acxpa-ds-ink); }

/* ---- Home: supplier call to action ------------------------------------ */
.dir-cta { background: var(--acxpa-ds-harbour-deep); color: var(--acxpa-ds-text-on-dark); padding: var(--acxpa-ds-space-3xl) 0; }
.dir-cta__inner { display: grid; grid-template-columns: 1.5fr 1fr; gap: var(--acxpa-ds-space-2xl); align-items: center; }
.dir-cta__lead { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-lead); line-height: 1.5; }
.dir-cta__box { background: color-mix(in srgb, var(--acxpa-ds-white) 8%, transparent); border: 1px solid color-mix(in srgb, var(--acxpa-ds-white) 22%, transparent); border-radius: var(--acxpa-ds-radius-xl); padding: var(--acxpa-ds-space-xl); display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-cta__price { margin: 0; font-size: var(--acxpa-ds-text-lead); }
.dir-cta__price strong { font-size: var(--acxpa-ds-text-h2); color: var(--acxpa-ds-gold); }
.dir-cta__gst { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-text-muted-on-dark); }

/* ---- Profile: breadcrumb and header ---------------------------------- */
.dir-crumbs { background: var(--acxpa-ds-cloud); border-bottom: 1px solid var(--acxpa-ds-teal-100); font-size: var(--acxpa-ds-text-small); }
.dir-crumbs ol { list-style: none; margin: 0; padding: var(--acxpa-ds-space-sm) 0; display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs); }
.dir-crumbs li + li::before { content: "›"; margin-right: var(--acxpa-ds-space-xs); color: var(--acxpa-ds-slate); }
.dir-crumbs [aria-current] { color: var(--acxpa-ds-slate); }
.dir-back { background: var(--acxpa-ds-white); }
.dir-back__link { display: inline-block; padding-top: var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-teal-600); }
.dir-back__link:hover { color: var(--acxpa-ds-teal-800); }

.dir-profile-head { background: var(--acxpa-ds-white); border-bottom: 4px solid var(--acxpa-ds-gold); }
.dir-profile-head__inner { display: grid; grid-template-columns: 160px 1fr 240px; gap: var(--acxpa-ds-space-xl); padding-top: var(--acxpa-ds-space-2xl); padding-bottom: var(--acxpa-ds-space-2xl); align-items: start; }
.dir-profile-head__logo { width: 160px; height: 160px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); display: grid; place-items: center; padding: var(--acxpa-ds-space-md); background: var(--acxpa-ds-white); }
.dir-profile-head__logo img { max-width: 100%; max-height: 100%; width: auto; object-fit: contain; }
.dir-badges { list-style: none; margin: 0 0 var(--acxpa-ds-space-sm); padding: 0; display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs); }
.dir-profile-head__name { font-size: var(--acxpa-ds-text-h1); line-height: var(--acxpa-ds-leading-tight); color: var(--acxpa-ds-teal-800); margin: 0 0 var(--acxpa-ds-space-sm); }
.dir-profile-head__summary { margin: 0 0 var(--acxpa-ds-space-lg); font-size: var(--acxpa-ds-text-lead); line-height: 1.5; color: var(--acxpa-ds-ink); }
.dir-facts { margin: 0; display: grid; gap: var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); }
.dir-facts div { display: grid; grid-template-columns: 110px 1fr; gap: var(--acxpa-ds-space-sm); }
.dir-facts dt { color: var(--acxpa-ds-slate); font-weight: 600; }
.dir-facts dd { margin: 0; }
.dir-profile-head__actions { display: grid; gap: var(--acxpa-ds-space-sm); }

/* ---- Profile: body --------------------------------------------------- */
.dir-profile-body { background: var(--acxpa-ds-cloud); padding: var(--acxpa-ds-space-2xl) 0 var(--acxpa-ds-space-3xl); }
.dir-profile-body__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--acxpa-ds-space-xl); align-items: start; }
.dir-profile-main { display: grid; gap: var(--acxpa-ds-space-lg); }

.dir-notice { background: var(--acxpa-ds-gold-tint); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); }
.dir-notice__h { font-size: var(--acxpa-ds-text-h4); margin: 0 0 var(--acxpa-ds-space-xs); color: var(--acxpa-ds-ink); }
.dir-notice p { margin: 0 0 var(--acxpa-ds-space-md); }

.dir-placement, .dir-panel { background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-xl); box-shadow: var(--acxpa-ds-shadow-sm); }
.dir-placement__head { padding-bottom: var(--acxpa-ds-space-md); border-bottom: 1px solid var(--acxpa-ds-teal-100); }
.dir-placement__kicker { margin: 0; font-size: var(--acxpa-ds-text-caption); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--acxpa-ds-slate); }
.dir-placement__title { margin: var(--acxpa-ds-space-2xs) 0 0; font-size: var(--acxpa-ds-text-h3); line-height: 1.3; }
.dir-placement__title a { color: var(--acxpa-ds-teal-800); text-decoration: none; }
.dir-placement__title a:hover { text-decoration: underline; }

.dir-focus { display: flex; height: 14px; border-radius: var(--acxpa-ds-radius-pill); overflow: hidden; gap: 3px; }
.dir-focus__seg { flex-basis: 0; }
.dir-focus__seg--0 { background: var(--acxpa-ds-teal-600); }
.dir-focus__seg--1 { background: var(--acxpa-ds-harbour); }
.dir-focus__seg--2 { background: var(--acxpa-ds-gold); }
.dir-focus__seg--3 { background: var(--acxpa-ds-clay); }
.dir-focus__seg--4 { background: var(--acxpa-ds-teal-300); }
.dir-focus__legend { list-style: none; margin: var(--acxpa-ds-space-sm) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-lg); font-size: var(--acxpa-ds-text-small); }
.dir-focus__legend li { display: inline-flex; align-items: center; gap: var(--acxpa-ds-space-xs); }
.dir-focus__legend a { color: var(--acxpa-ds-ink); }
.dir-focus__dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }

.dir-prose { color: var(--acxpa-ds-ink); }
.dir-prose p { margin: 0 0 var(--acxpa-ds-space-sm); }
.dir-prose ul, .dir-prose ol { margin: 0 0 var(--acxpa-ds-space-md); padding-left: var(--acxpa-ds-space-lg); columns: 2; column-gap: var(--acxpa-ds-space-xl); }
.dir-prose li { margin-bottom: var(--acxpa-ds-space-2xs); break-inside: avoid; }
.dir-prose em { color: var(--acxpa-ds-slate); }

.dir-more summary { cursor: pointer; font-weight: 600; color: var(--acxpa-ds-teal-600); list-style: none; margin-top: var(--acxpa-ds-space-xs); }
.dir-more summary::-webkit-details-marker { display: none; }
.dir-more summary::after { content: " ▾"; }
.dir-more[open] summary::after { content: " ▴"; }
.dir-more .dir-more__close, .dir-more[open] .dir-more__open { display: none; }
.dir-more[open] .dir-more__close { display: inline; }
.dir-more[open] summary { order: 2; }
.dir-more[open] { display: flex; flex-direction: column; }
.dir-more > .dir-prose { margin-top: var(--acxpa-ds-space-sm); }
.dir-placement { scroll-margin-top: var(--acxpa-ds-space-lg); }
/* Category tabs (multi-category profiles) */
.dir-placements { display: grid; gap: var(--acxpa-ds-space-lg); }
.dir-placements.is-tabbed { gap: 0; }
.dir-tabs-head { margin-bottom: var(--acxpa-ds-space-md); }
.dir-tabs-head__h { margin: 0 0 var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-teal-800); }
.dir-tabs-head p { margin: 0; color: var(--acxpa-ds-slate); }
.dir-placements:not(.is-tabbed) .dir-tabs-head { display: none; }
.dir-tabs__tab:focus:not(:focus-visible) { outline: none; }
.dir-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; gap: var(--acxpa-ds-space-2xs); }
.dir-tabs__tab {
    font: inherit; font-size: var(--acxpa-ds-text-small); font-weight: 600; cursor: pointer;
    padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border: 0; border-radius: var(--acxpa-ds-radius-md) var(--acxpa-ds-radius-md) 0 0;
    background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep);
}
.dir-tabs__tab:hover { background: var(--acxpa-ds-teal-100); }
.dir-tabs__tab[aria-selected="true"] { background: var(--acxpa-ds-white); color: var(--acxpa-ds-teal-800); box-shadow: inset 0 3px 0 var(--acxpa-ds-gold); }
.dir-placements.is-tabbed .dir-placement { border-top-left-radius: 0; }
.dir-placements:not(.is-tabbed) .dir-tabs { display: none; }
.dir-placements.is-tabbed .dir-placement__head { display: none; }
.dir-placements.is-tabbed .dir-placement > .dir-h4:first-of-type { margin-top: 0; }

/* Lightbox */
.dir-lightbox { width: min(96vw, 1200px); max-height: 94vh; padding: 0; border: 0; border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-ink); color: var(--acxpa-ds-white); overflow: hidden; }
.dir-lightbox::backdrop { background: color-mix(in srgb, var(--acxpa-ds-ink) 85%, transparent); }
.dir-lightbox__fig { margin: 0; padding: var(--acxpa-ds-space-xl) var(--acxpa-ds-space-3xl); display: grid; justify-items: center; gap: var(--acxpa-ds-space-sm); }
.dir-lightbox__fig img { max-height: 78vh; width: auto; max-width: 100%; object-fit: contain; border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); }
.dir-lightbox__fig figcaption { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-teal-200); }
.dir-lightbox__nav, .dir-lightbox__close {
    position: absolute; border: 0; cursor: pointer; font: inherit; line-height: 1; color: var(--acxpa-ds-white);
    background: color-mix(in srgb, var(--acxpa-ds-white) 14%, transparent); border-radius: 50%; width: 48px; height: 48px; font-size: 32px;
}
.dir-lightbox__nav:hover, .dir-lightbox__close:hover { background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); }
.dir-lightbox__nav--prev { left: var(--acxpa-ds-space-sm); top: 50%; transform: translateY(-50%); }
.dir-lightbox__nav--next { right: var(--acxpa-ds-space-sm); top: 50%; transform: translateY(-50%); }
.dir-lightbox__close { right: var(--acxpa-ds-space-sm); top: var(--acxpa-ds-space-sm); width: 40px; height: 40px; font-size: 26px; z-index: 1; }
.dir-gallery a { display: block; cursor: zoom-in; }

/* Enquiry dialog and form */
.dir-dialog { width: min(94vw, 640px); padding: 0; border: 0; border-radius: var(--acxpa-ds-radius-lg); box-shadow: var(--acxpa-ds-shadow-lg); }
.dir-dialog::backdrop { background: color-mix(in srgb, var(--acxpa-ds-ink) 60%, transparent); }
.dir-dialog__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-lg) var(--acxpa-ds-space-lg) 0; }
.dir-dialog__head h2 { margin: 0; font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-teal-800); line-height: 1.3; }
.dir-dialog__x { border: 0; background: none; font-size: 28px; line-height: 1; cursor: pointer; color: var(--acxpa-ds-slate); }
.dir-dialog__intro { margin: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-lg) 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-lg); }
.dir-form label { display: grid; gap: var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-ink); }
.dir-form input, .dir-form textarea {
    font: inherit; font-weight: 400; font-size: var(--acxpa-ds-text-body); padding: var(--acxpa-ds-space-sm);
    border: 1px solid var(--acxpa-ds-teal-200); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); width: 100%;
}
.dir-form input:focus, .dir-form textarea:focus { outline: 2px solid var(--acxpa-ds-teal-600); border-color: var(--acxpa-ds-teal-600); }
.dir-form__full { grid-column: 1 / -1; }
.dir-form__opt { font-weight: 400; color: var(--acxpa-ds-slate); }
.dir-form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.dir-form__error { margin: 0 var(--acxpa-ds-space-lg); color: var(--acxpa-ds-error); font-weight: 600; }
.dir-dialog__foot { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); background: var(--acxpa-ds-sand); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-form__small { margin: 0; font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }
.dir-side-card--gold { background: var(--acxpa-ds-gold-tint); border-top-color: var(--acxpa-ds-gold); box-shadow: none; }
.dir-sent { font-weight: 500; }
.dir-linkbtn { font: inherit; font-weight: 500; color: var(--acxpa-ds-link); background: none; border: 0; padding: 0; text-decoration: underline; cursor: pointer; text-align: left; }
.dir-profile-head__hint { margin: 0; font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }

.dir-panel__h { font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-teal-800); margin: 0 0 var(--acxpa-ds-space-md); }
.dir-gallery { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.dir-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--acxpa-ds-radius-md); border: 1px solid var(--acxpa-ds-stone); background: var(--acxpa-ds-cloud); }
.dir-docs { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-xs); }
.dir-docs a {
    display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: var(--acxpa-ds-space-sm);
    padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border: 1px solid var(--acxpa-ds-teal-100); border-radius: var(--acxpa-ds-radius-md);
    text-decoration: none; color: var(--acxpa-ds-ink);
}
.dir-docs a:hover { border-color: var(--acxpa-ds-teal-400); background: var(--acxpa-ds-teal-50); }
.dir-docs__icon { width: 24px; height: 24px; color: var(--acxpa-ds-clay); }
.dir-docs__title { font-weight: 500; }
.dir-docs__meta { font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }

.dir-profile-side { display: grid; gap: var(--acxpa-ds-space-lg); position: sticky; top: var(--acxpa-ds-space-lg); }
.dir-side-card { background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); box-shadow: var(--acxpa-ds-shadow-sm); border-top: 4px solid var(--acxpa-ds-teal-600); }
.dir-side-card--sand { background: var(--acxpa-ds-sand); border-top-color: var(--acxpa-ds-clay); box-shadow: none; }
.dir-side-card__h { font-size: var(--acxpa-ds-text-h4); margin: 0 0 var(--acxpa-ds-space-md); color: var(--acxpa-ds-ink); }
.dir-side-card p { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); }
.dir-side-card p.dir-side-card__note { color: var(--acxpa-ds-slate); margin: var(--acxpa-ds-space-md) 0 0; }
.dir-contact { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); }
.dir-contact li { display: grid; gap: 2px; }
.dir-contact span { font-size: var(--acxpa-ds-text-caption); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--acxpa-ds-slate); }
.dir-contact a { word-break: break-word; font-weight: 500; }

/* ---- Category pages -------------------------------------------------- */
.dir-cat-head { background: var(--acxpa-ds-white); }
.dir-cat-head__inner { display: grid; grid-template-columns: 1fr 520px; gap: var(--acxpa-ds-space-2xl); align-items: center; padding-top: var(--acxpa-ds-space-2xl); padding-bottom: var(--acxpa-ds-space-2xl); }
.dir-cat-head__title { font-size: var(--acxpa-ds-text-h1); line-height: var(--acxpa-ds-leading-tight); color: var(--acxpa-ds-teal-800); margin: 0 0 var(--acxpa-ds-space-md); }
.dir-cat-head__lead { font-size: var(--acxpa-ds-text-lead); line-height: 1.5; margin: 0 0 var(--acxpa-ds-space-xs); color: var(--acxpa-ds-ink); }
.dir-cat-head__media img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--acxpa-ds-radius-xl); box-shadow: var(--acxpa-ds-shadow-lg); }
.dir-subnav { background: var(--acxpa-ds-sand); border-top: 1px solid var(--acxpa-ds-stone); border-bottom: 1px solid var(--acxpa-ds-stone); padding: var(--acxpa-ds-space-lg) 0; }
.dir-subnav__h { margin: 0 0 var(--acxpa-ds-space-sm); font-weight: 600; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-clay-deep); text-transform: uppercase; letter-spacing: .08em; }
.dir-subnav__h--next { margin-top: var(--acxpa-ds-space-lg); }
.dir-chips a[aria-current] { background: var(--acxpa-ds-teal-700); border-color: var(--acxpa-ds-teal-700); color: var(--acxpa-ds-white); }
.dir-chips a[aria-current] span { background: var(--acxpa-ds-white); }
.dir-results-wrap { background: var(--acxpa-ds-cloud); padding: var(--acxpa-ds-space-2xl) 0 var(--acxpa-ds-space-3xl); }
.dir-results { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: var(--acxpa-ds-space-xl); align-items: start; }
.dir-results--solo { grid-template-columns: minmax(0, 1fr); }
.dir-filters { background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); box-shadow: var(--acxpa-ds-shadow-sm); position: sticky; top: var(--acxpa-ds-space-lg); border-top: 4px solid var(--acxpa-ds-harbour); }
.dir-filters form { display: grid; gap: var(--acxpa-ds-space-md); }
.dir-filters__h { margin: 0; font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-harbour-deep); }
.dir-filters__toggle { display: none; cursor: pointer; font-weight: 600; color: var(--acxpa-ds-harbour-deep); }
.dir-filters__field { display: grid; gap: var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-filters select { width: 100%; min-width: 0; font: inherit; font-weight: 400; padding-block: var(--acxpa-ds-space-xs); padding-left: var(--acxpa-ds-space-sm); border: 1px solid var(--acxpa-ds-teal-200); border-radius: var(--acxpa-ds-radius-md); }
.dir-filters__clear { font-size: var(--acxpa-ds-text-small); text-align: center; }
.dir-filters__note { margin: 0; font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }
.dir-list__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-lg); margin-bottom: var(--acxpa-ds-space-md); }
.dir-list__count { margin: 0; font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-teal-800); }
.dir-list__disclosure { margin: 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-card { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: var(--acxpa-ds-space-lg); align-items: center; background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); border: 1px solid var(--acxpa-ds-teal-100); position: relative; }
.dir-card:hover { border-color: var(--acxpa-ds-teal-400); box-shadow: var(--acxpa-ds-shadow-md); }
.dir-card--paid { border-left: 4px solid var(--acxpa-ds-gold); }
.dir-card__logo { width: 112px; height: 80px; display: grid; place-items: center; }
.dir-card__cat { margin: 0 0 2px; font-size: var(--acxpa-ds-text-caption); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--acxpa-ds-teal-700); }
.dir-card__logo img { max-width: 112px; max-height: 80px; width: auto; height: auto; object-fit: contain; }
.dir-card__name { margin: 0 0 var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-h4); }
.dir-card__name a { color: var(--acxpa-ds-ink); text-decoration: none; }
.dir-card__name a::after { content: ""; position: absolute; inset: 0; }
.dir-card__summary { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-ink); }
.dir-card__tags { list-style: none; margin: 0 0 var(--acxpa-ds-space-xs); padding: 0; display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-2xs); }
.dir-card__tags li { font-size: var(--acxpa-ds-text-caption); padding: 2px var(--acxpa-ds-space-xs); border-radius: var(--acxpa-ds-radius-pill); background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); }
.dir-card__offers { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-ink); }
.dir-card__offers span { font-weight: 700; color: var(--acxpa-ds-gold-deep); text-transform: uppercase; letter-spacing: .06em; margin-right: var(--acxpa-ds-space-2xs); }
.dir-card__meta { margin: 0; font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-md); }
.dir-card__cta { position: relative; z-index: 1; display: grid; justify-items: center; gap: var(--acxpa-ds-space-xs); }
.dir-card__web { font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-teal-600); }
.dir-card__web:hover { color: var(--acxpa-ds-teal-800); }
.dir-card--basic { grid-template-columns: 112px minmax(0, 1fr) auto; padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-lg); }
.dir-card--basic .dir-card__logo { height: 48px; }
.dir-card--basic .dir-initials { width: 48px; height: 48px; font-size: var(--acxpa-ds-text-body); }
.dir-card--basic .dir-card__name { font-size: var(--acxpa-ds-text-body); margin: 0; }
.dir-card--basic .dir-card__tags { margin: var(--acxpa-ds-space-2xs) 0 0; }
.dir-card--basic .dir-card__meta { display: none; }
.dir-cards__divider { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-slate); text-transform: uppercase; letter-spacing: .08em; }
.dir-cards__divider::after { content: ""; flex: 1; height: 1px; background: var(--acxpa-ds-teal-200); }
.dir-empty { background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-xl); text-align: center; }
.dir-empty h3 { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-pager { display: flex; justify-content: space-between; align-items: center; margin-top: var(--acxpa-ds-space-lg); }
.dir-pager__info { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-cta-band { background: var(--acxpa-ds-gold-tint); padding: var(--acxpa-ds-space-2xl) 0; }
.dir-cta-band__inner { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-xl); }
.dir-cta-band p { margin: 0; }
.dir-cta-band .dir-h2 { color: var(--acxpa-ds-ink); }

/* ---- Buyer's guide (category, subcategory and landing pages) --------- */
.dir-cat-head__links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--acxpa-ds-space-md); margin: var(--acxpa-ds-space-lg) 0 0; }
.dir-cat-head__guide { font-weight: 600; }
.dir-guide { background: var(--acxpa-ds-white); padding: var(--acxpa-ds-space-3xl) 0; border-top: 1px solid var(--acxpa-ds-teal-100); }
.dir-guide__grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: var(--acxpa-ds-space-2xl); align-items: start; }
.dir-guide__toc { position: sticky; top: var(--acxpa-ds-space-lg); background: var(--acxpa-ds-sand); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); }
.dir-guide__toc-h { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--acxpa-ds-clay-deep); }
.dir-guide__toc ol { margin: 0 0 var(--acxpa-ds-space-md); padding-left: var(--acxpa-ds-space-md); display: grid; gap: var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); }
.dir-guide__toc a { color: var(--acxpa-ds-ink); }
.dir-guide__toc a.dir-guide__back { font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-teal-600); }
.dir-guide__body { max-width: 800px; }
.dir-guide__head { padding-bottom: var(--acxpa-ds-space-lg); border-bottom: 2px solid var(--acxpa-ds-teal-100); }
.dir-guide__head .dir-h2 { margin: var(--acxpa-ds-space-xs) 0 0; }
.dir-gblock { padding: var(--acxpa-ds-space-2xl) 0; border-bottom: 1px solid var(--acxpa-ds-teal-100); scroll-margin-top: var(--acxpa-ds-space-lg); }
.dir-gblock:first-of-type { padding-top: var(--acxpa-ds-space-xl); }
.dir-gblock:last-child { border-bottom: 0; }
.dir-gblock__label { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-caption); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--acxpa-ds-gold-deep); }
.dir-gblock__h { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-h3); line-height: var(--acxpa-ds-leading-snug); color: var(--acxpa-ds-teal-800); }
.dir-prose--guide { font-size: var(--acxpa-ds-text-body); }
.dir-prose--guide h4 { font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-harbour-deep); margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-xs); }
.dir-prose--guide ul { columns: 1; }
.dir-prose ul.ticks { list-style: none; padding-left: 0; }
.dir-prose ul.ticks li { position: relative; padding-left: var(--acxpa-ds-space-lg); margin-bottom: var(--acxpa-ds-space-xs); }
.dir-prose ul.ticks li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--acxpa-ds-success); font-weight: 700; }
.dir-price { list-style: none; margin: var(--acxpa-ds-space-md) 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-md); grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.dir-price__card { background: var(--acxpa-ds-harbour-tint); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); display: flex; flex-direction: column; }
.dir-price__card p { margin: 0; }
.dir-price__type { font-size: var(--acxpa-ds-text-caption); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--acxpa-ds-harbour-deep); }
.dir-price__card .dir-price__fig { font-size: var(--acxpa-ds-text-h3); font-weight: 700; color: var(--acxpa-ds-ink); margin-top: var(--acxpa-ds-space-xs); }
.dir-price__card .dir-price__unit { font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); margin-bottom: var(--acxpa-ds-space-sm); }
.dir-price__text { font-size: var(--acxpa-ds-text-small); }
.dir-price__note { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }
.dir-market { display: flex; justify-content: flex-end; margin-top: var(--acxpa-ds-space-md); }
.dir-market__switch { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-ink); }
.dir-market__switch select { font: inherit; font-weight: 400; padding-top: var(--acxpa-ds-space-2xs); padding-bottom: var(--acxpa-ds-space-2xs); padding-left: var(--acxpa-ds-space-sm); border: 1px solid var(--acxpa-ds-teal-200); border-radius: var(--acxpa-ds-radius-md); }
.dir-guide__head .dir-market { justify-content: flex-start; background: var(--acxpa-ds-sand); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); }
.dir-mnote { margin-top: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); background: var(--acxpa-ds-harbour-tint); border-left: 4px solid var(--acxpa-ds-harbour); border-radius: var(--acxpa-ds-radius-md); font-size: var(--acxpa-ds-text-small); }
.dir-mnote__h { margin: 0 0 var(--acxpa-ds-space-2xs); font-weight: 700; color: var(--acxpa-ds-harbour-deep); }
.dir-mnote p:last-child, .dir-mnote ul:last-child { margin-bottom: 0; }
.dir-guide [hidden] { display: none; }
.dir-rates { margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-sm); overflow-x: auto; border-radius: var(--acxpa-ds-radius-lg); border: 1px solid var(--acxpa-ds-teal-100); }
.dir-rates__table { width: 100%; border-collapse: collapse; font-size: var(--acxpa-ds-text-small); }
.dir-rates__table th, .dir-rates__table td { padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); text-align: left; vertical-align: top; border-bottom: 1px solid var(--acxpa-ds-teal-100); }
.dir-rates__table thead th { background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); font-size: var(--acxpa-ds-text-caption); text-transform: uppercase; letter-spacing: .06em; }
.dir-rates__table tbody th { color: var(--acxpa-ds-ink); white-space: nowrap; }
.dir-rates__table tbody tr:nth-child(even) { background: var(--acxpa-ds-cloud); }
.dir-rates__table tbody tr:last-child th, .dir-rates__table tbody tr:last-child td { border-bottom: 0; }
.dir-rates__table td .dir-money { font-weight: 700; white-space: nowrap; }
.dir-gsteps { list-style: none; counter-reset: gstep; margin: var(--acxpa-ds-space-md) 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-gsteps li { counter-increment: gstep; position: relative; padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg) var(--acxpa-ds-space-md) 72px; background: var(--acxpa-ds-cloud); border-radius: var(--acxpa-ds-radius-lg); }
.dir-gsteps li::before { content: counter(gstep); position: absolute; left: var(--acxpa-ds-space-lg); top: var(--acxpa-ds-space-md); width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--acxpa-ds-teal-600); color: var(--acxpa-ds-white); font-weight: 700; font-size: var(--acxpa-ds-text-small); }
.dir-gsteps h4 { margin: 0 0 var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-body); }
.dir-gsteps p { margin: 0; font-size: var(--acxpa-ds-text-small); }
.dir-gsteps p + p { margin-top: var(--acxpa-ds-space-xs); }
.dir-gsteps__link { font-weight: 600; color: var(--acxpa-ds-teal-600); }
.dir-callout { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-lg); background: var(--acxpa-ds-gold-tint); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); }
.dir-callout h4 { margin: 0 0 var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-h4); }
.dir-callout .dir-btn { white-space: nowrap; flex-shrink: 0; }
.dir-callout p { margin: 0; font-size: var(--acxpa-ds-text-small); }
.dir-res { list-style: none; margin: var(--acxpa-ds-space-md) 0 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-md); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dir-res a { display: grid; align-content: start; gap: var(--acxpa-ds-space-2xs); height: 100%; padding: var(--acxpa-ds-space-lg); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); text-decoration: none; color: var(--acxpa-ds-ink); background: var(--acxpa-ds-white); }
.dir-res a:hover { border-color: var(--acxpa-ds-teal-400); box-shadow: var(--acxpa-ds-shadow-md); }
.dir-res__wide { grid-column: 1 / -1; }
.dir-res__label { font-size: var(--acxpa-ds-text-caption); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--acxpa-ds-clay-deep); }
.dir-res__title { font-weight: 700; color: var(--acxpa-ds-teal-800); }
.dir-res__text { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-faqs { display: grid; gap: var(--acxpa-ds-space-xs); }
.dir-faqs details { border: 1px solid var(--acxpa-ds-teal-100); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); background: var(--acxpa-ds-white); }
.dir-faqs summary { cursor: pointer; font-weight: 600; color: var(--acxpa-ds-ink); }
.dir-faqs details[open] { background: var(--acxpa-ds-cloud); }
.dir-faqs details p { margin: var(--acxpa-ds-space-sm) 0 0; }

/* ---- Footer: Teal 700, the ground the reversed lockup is drawn on ----- */
.dir-footer { background: var(--acxpa-ds-teal-700); color: var(--acxpa-ds-text-on-dark); padding: var(--acxpa-ds-space-3xl) 0 var(--acxpa-ds-space-xl); }
.dir-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--acxpa-ds-space-xl); }
.dir-footer img { width: 140px; margin-bottom: var(--acxpa-ds-space-md); }
.dir-footer__about p { margin: 0 0 var(--acxpa-ds-space-xs); color: var(--acxpa-ds-text-muted-on-dark); font-size: var(--acxpa-ds-text-small); }
.dir-footer__h { font-size: var(--acxpa-ds-text-small); text-transform: uppercase; letter-spacing: .1em; color: var(--acxpa-ds-gold); margin: 0 0 var(--acxpa-ds-space-md); }
.dir-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); }
.dir-footer a { color: var(--acxpa-ds-white); text-decoration: none; }
.dir-footer a:hover { text-decoration: underline; }
.dir-footer a:focus-visible { outline-color: var(--acxpa-ds-focus-on-dark); }
.dir-footer__small { margin: var(--acxpa-ds-space-2xl) 0 0; padding-top: var(--acxpa-ds-space-lg); border-top: 1px solid color-mix(in srgb, var(--acxpa-ds-white) 20%, transparent); font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-text-muted-on-dark); }

/* ---- Responsive ------------------------------------------------------ */
@media (max-width: 1000px) {
    .dir-cat-head__inner { grid-template-columns: 1fr; }
    .dir-cat-head__media { max-width: 560px; }
    .dir-results { grid-template-columns: 1fr; }
    .dir-guide__grid { grid-template-columns: 1fr; }
    .dir-guide__toc { position: static; }
    .dir-filters { position: static; padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); }
    .dir-filters__toggle { display: list-item; }
    .dir-filters[open] .dir-filters__toggle { margin-bottom: var(--acxpa-ds-space-md); }
    .dir-filters .dir-filters__h { display: none; }
    .dir-cta-band__inner { flex-direction: column; align-items: flex-start; }
    .dir-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dir-cat--big { grid-column: 1 / -1; }
    .dir-feat--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dir-profile-head__inner { grid-template-columns: 120px 1fr; }
    .dir-profile-head__logo { width: 120px; height: 120px; }
    .dir-profile-head__actions { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 260px)); }
    .dir-profile-body__grid { grid-template-columns: 1fr; }
    .dir-profile-side { position: static; }
    .dir-cta__inner { grid-template-columns: 1fr; }
    .dir-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 820px) {
    .dir-nav { display: none; }
    .dir-menu { display: block; }
    .dir-steps { grid-template-columns: 1fr; }
    .dir-stats__inner { grid-template-columns: repeat(2, 1fr); }
    .dir-hero::after { background: color-mix(in srgb, var(--acxpa-ds-white) 86%, transparent); }
    .dir-hero__inner { padding-top: var(--acxpa-ds-space-2xl); padding-bottom: var(--acxpa-ds-space-2xl); }
}
@media (max-width: 640px) {
    .dir-card { grid-template-columns: 64px minmax(0, 1fr); gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md); }
    .dir-card__logo { width: 64px; height: 56px; }
    .dir-card__logo img { max-width: 64px; max-height: 56px; }
    /* Phones: the whole card opens the profile, so only the website link stays, under the text. */
    .dir-card__cta { grid-column: 2; justify-items: start; }
    .dir-card__cta .dir-btn { display: none; }
    .dir-card__cta:not(:has(.dir-card__web)) { display: none; }
    .dir-card--basic { grid-template-columns: 48px minmax(0, 1fr); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); }
    .dir-card--basic .dir-card__logo { width: 48px; }
    .dir-cat-head__media { display: none; }
    .dir-res { grid-template-columns: 1fr; }
    .dir-rates { border: 0; overflow: visible; }
    .dir-rates__table thead { display: none; }
    .dir-rates__table, .dir-rates__table tbody, .dir-rates__table tr, .dir-rates__table th, .dir-rates__table td { display: block; }
    .dir-rates__table tbody tr { border: 1px solid var(--acxpa-ds-teal-100); border-radius: var(--acxpa-ds-radius-lg); margin-bottom: var(--acxpa-ds-space-sm); padding: var(--acxpa-ds-space-sm) 0; }
    .dir-rates__table th, .dir-rates__table td { border-bottom: 0; padding: var(--acxpa-ds-space-2xs) var(--acxpa-ds-space-md); }
    .dir-rates__table tbody th { font-size: var(--acxpa-ds-text-body); }
    .dir-rates__table td::before { content: attr(data-label) ": "; color: var(--acxpa-ds-slate); }
    .dir-callout { flex-direction: column; align-items: flex-start; }
    .dir-gblock__h { font-size: var(--acxpa-ds-text-h3); }
    .dir-cats, .dir-feat--3 { grid-template-columns: 1fr; gap: var(--acxpa-ds-space-sm); }
    .dir-markets { grid-template-columns: 1fr; }
    /* Phones (Justin, 13 Nov): the at-a-glance numbers and the country section sit centred. */
    .dir-stats p { text-align: center; }
    .dir-section[aria-labelledby="markets-h"] .dir-section__head, .dir-markets__h { text-align: center; }
    .dir-markets .dir-chips { justify-content: center; }
    /* Categories become a compact list on phones: thumbnail, name, line, count. */
    .dir-cat--big { grid-column: auto; }
    .dir-cat__link, .dir-cat--big .dir-cat__link { flex-direction: row; min-height: 0; }
    .dir-cat picture, .dir-cat--big picture { flex: 0 0 104px; }
    .dir-cat__link img, .dir-cat--big .dir-cat__link img { width: 104px; height: 100%; aspect-ratio: auto; object-fit: cover; }
    .dir-cat__body, .dir-cat--big .dir-cat__body { padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); gap: 2px; justify-content: center; }
    .dir-cat__name, .dir-cat--big .dir-cat__name { font-size: var(--acxpa-ds-text-body); }
    .dir-cat__tag, .dir-cat--big .dir-cat__tag { font-size: var(--acxpa-ds-text-caption); line-height: 1.4; flex: 0 1 auto; }
    .dir-gallery { grid-template-columns: repeat(2, 1fr); }
    .dir-docs a { grid-template-columns: 24px 1fr; }
    .dir-docs__meta { grid-column: 2; }
    .dir-hero__copy .dir-hero__lead, .dir-profile-head__summary { font-size: var(--acxpa-ds-text-body); }
    .dir-wrap { padding-inline: var(--acxpa-ds-space-md); }
    .dir-section { padding: var(--acxpa-ds-space-2xl) 0; }
    .dir-brand img { width: 120px; }
    .dir-brand__label { font-size: var(--acxpa-ds-text-body); }
    .dir-search { grid-template-columns: 1fr; }
    .dir-profile-head__inner { grid-template-columns: 1fr; gap: var(--acxpa-ds-space-lg); }
    .dir-profile-head__logo { width: 104px; height: 104px; }
    .dir-profile-head__actions { grid-template-columns: 1fr; }
    .dir-facts div { grid-template-columns: 1fr; gap: 0; }
    .dir-placement, .dir-panel { padding: var(--acxpa-ds-space-lg); }
    .dir-prose ul, .dir-prose ol { columns: 1; }
    .dir-form__grid { grid-template-columns: 1fr; }
    .dir-dialog__foot { flex-direction: column; align-items: stretch; }
    .dir-lightbox__fig { padding: var(--acxpa-ds-space-3xl) var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); }
    .dir-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
    .dir-tabs__tab { flex: 0 0 auto; white-space: nowrap; }
    .dir-footer__grid { grid-template-columns: 1fr; }
}

/* ---- Information pages (how suppliers are ordered), 19 Oct 2026 ---- */
.dir-info-head { background: var(--acxpa-ds-white); }
/* No max-width on the heading or intro (Justin, 12 Nov, again: they run the width of the page). */
.dir-info-head__inner { padding-top: var(--acxpa-ds-space-2xl); padding-bottom: var(--acxpa-ds-space-2xl); }
.dir-info { max-width: 880px; }
.dir-info__steps { margin-top: var(--acxpa-ds-space-lg); }
.dir-info__steps li { background: var(--acxpa-ds-white); box-shadow: var(--acxpa-ds-shadow-sm); }
.dir-info__steps h3 { margin: 0 0 var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-body); color: var(--acxpa-ds-teal-800); }
.dir-info__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-lg); }
.dir-info__card { background: var(--acxpa-ds-sand); border-top: 4px solid var(--acxpa-ds-clay); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); }
.dir-info__card h3 { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-h4); line-height: var(--acxpa-ds-leading-snug); color: var(--acxpa-ds-teal-800); }
.dir-info__card p { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); }
.dir-info__card p:last-child { margin-bottom: 0; }
.dir-info__callout-h { margin: 0 0 var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-ink); }
.dir-info .dir-callout p { margin: 0; }
@media (max-width: 720px) { .dir-info__grid { grid-template-columns: 1fr; } .dir-info .dir-callout { flex-direction: column; align-items: flex-start; } }

/* ---- Supplier accounts: sign-in, claim, list your business, account home (Phase 4) ---- */
.dir-acct { background: var(--acxpa-ds-sand); padding: var(--acxpa-ds-space-2xl) 0; }
.dir-acct__inner { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--acxpa-ds-space-xl); align-items: start; }
.dir-acct__inner--solo { grid-template-columns: minmax(0, 640px); justify-content: center; }
/* The one thing to do on a page: a soft gold ring that pulses until it's pressed (stops for reduced motion). */
.dir-btn--pulse { animation: dir-pulse 1.6s ease-out infinite; }
.dir-btn--pulse:hover, .dir-btn--pulse[disabled] { animation: none; }
@keyframes dir-pulse { 0% { box-shadow: 0 0 0 0 rgba(249, 176, 46, .75); } 70% { box-shadow: 0 0 0 16px rgba(249, 176, 46, 0); } 100% { box-shadow: 0 0 0 0 rgba(249, 176, 46, 0); } }
@media (prefers-reduced-motion: reduce) { .dir-btn--pulse { animation: none; box-shadow: 0 0 0 4px var(--acxpa-ds-gold); } }
.dir-acct__card { background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-xl); }
.dir-acct__card > p { margin: 0 0 var(--acxpa-ds-space-sm); }
.dir-acct__h { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-h2); line-height: 1.2; color: var(--acxpa-ds-ink); }
.dir-acct__form { display: grid; gap: var(--acxpa-ds-space-md); margin: var(--acxpa-ds-space-lg) 0; max-width: 460px; }
.dir-acct__form .dir-form__error { margin: 0; }
.dir-acct__grid { padding: 0; margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-md); }
.dir-form select { font: inherit; padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-sm); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); }
.dir-acct__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--acxpa-ds-space-md); }
.dir-acct__actions .dir-form__error { flex-basis: 100%; }
.dir-acct__alt { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
/* A short message on a page (status or information): light, so it never competes with dark panels (Justin, 9 Nov). */
.dir-acct__note { background: var(--acxpa-ds-white); color: var(--acxpa-ds-ink); border: 1px solid var(--acxpa-ds-stone); border-left: 4px solid var(--acxpa-ds-teal-600); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); font-weight: 600; }
.dir-check--wide { margin-bottom: var(--acxpa-ds-space-xs); }
.dir-acct__none { background: var(--acxpa-ds-cloud); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-md); }
.dir-acct__results { list-style: none; margin: 0 0 var(--acxpa-ds-space-md); padding: 0; border-top: 1px solid var(--acxpa-ds-stone); }
.dir-acct__results li { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-sm) 0; border-bottom: 1px solid var(--acxpa-ds-stone); }
.dir-acct__results small, .dir-acct__company small { display: block; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-caption); }
.dir-acct__company { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); margin-bottom: var(--acxpa-ds-space-lg); padding-bottom: var(--acxpa-ds-space-md); border-bottom: 1px solid var(--acxpa-ds-stone); }
.dir-acct__company img { width: 64px; height: 64px; object-fit: contain; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); padding: 4px; }
.dir-acct__aside { background: var(--acxpa-ds-harbour-deep); color: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-xl); }
.dir-acct__aside .dir-eyebrow--gold { color: var(--acxpa-ds-gold); }
.dir-acct__aside-h { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-white); }
.dir-acct__ticks { list-style: none; margin: 0 0 var(--acxpa-ds-space-md); padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-acct__ticks li { position: relative; padding-left: 28px; font-size: var(--acxpa-ds-text-small); line-height: 1.5; }
.dir-acct__ticks li::before { content: ""; position: absolute; left: 0; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--acxpa-ds-gold); }
.dir-acct__ticks li::after { content: ""; position: absolute; left: 6px; top: 6px; width: 5px; height: 9px; border: solid var(--acxpa-ds-ink); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.dir-acct__aside-small { margin: 0; font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-harbour-tint); }
.dir-acct__bar { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--acxpa-ds-space-md); margin-bottom: var(--acxpa-ds-space-lg); }
.dir-acct__baracts { display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs); justify-content: flex-end; }
.dir-acct__baracts form { margin: 0; }
.dir-pw { position: relative; display: block; }
.dir-pw input { width: 100%; padding-right: 72px; }
.dir-pw__toggle { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); padding: 6px 10px; border: 0; border-radius: 6px; background: var(--acxpa-ds-cloud); color: var(--acxpa-ds-teal-700); font: inherit; font-size: var(--acxpa-ds-text-caption); font-weight: 700; cursor: pointer; }
.dir-pw__toggle:hover { background: var(--acxpa-ds-stone); }
.dir-pw__check { font-weight: 500; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-caption); }
.dir-pw__check.is-ok { color: var(--acxpa-ds-success); font-weight: 700; }
.dir-pw__check.is-todo { color: var(--acxpa-ds-gold-deep); font-weight: 700; }
.dir-acct__pw { margin-top: var(--acxpa-ds-space-md); padding-top: var(--acxpa-ds-space-md); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-acct__pw summary { cursor: pointer; color: var(--acxpa-ds-teal-700); font-weight: 600; font-size: var(--acxpa-ds-text-small); }
.dir-acct__pw[open] summary { margin-bottom: var(--acxpa-ds-space-sm); }
.dir-acct__who { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-acct__co { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) auto; gap: var(--acxpa-ds-space-lg); align-items: center; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); margin-bottom: var(--acxpa-ds-space-md); }
.dir-acct__co .dir-acct__company { margin: 0; padding: 0; border: 0; }
.dir-acct__places { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-small); }
.dir-acct__places small { color: var(--acxpa-ds-slate); margin-left: var(--acxpa-ds-space-xs); }
.dir-acct__empty { background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-xl); }
@media (max-width: 900px) {
    .dir-acct__inner, .dir-acct__co { grid-template-columns: minmax(0, 1fr); }
    .dir-acct__card, .dir-acct__aside { padding: var(--acxpa-ds-space-lg); }
}

/* ---- Supplier dashboard (Phase 4) ---- */
.dir-dash__h2 { margin: var(--acxpa-ds-space-xl) 0 var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-ink); }
.dir-dash__h3 { margin: 0; font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-ink); }
.dir-dash__note { margin: 0 0 var(--acxpa-ds-space-md); color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-dash__tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); }
.dir-dash__tile { display: grid; gap: var(--acxpa-ds-space-2xs); align-content: start; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-md); }
.dir-dash__label { font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-dash__num { font-size: 2rem; line-height: 1.1; }
.dir-dash__hint { font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }
.dir-dash__chg { font-size: var(--acxpa-ds-text-caption); font-weight: 600; color: var(--acxpa-ds-slate); }
.dir-dash__chg--up { color: var(--acxpa-ds-success-deep); }
.dir-dash__chg--down { color: var(--acxpa-ds-clay-deep); }
.dir-dash__chg--up::before { content: "▲ "; }
.dir-dash__chg--down::before { content: "▼ "; }
.dir-dash__panel { margin-top: var(--acxpa-ds-space-md); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); }
.dir-dash__bars { display: grid; grid-template-columns: repeat(12, 1fr); gap: 6px; align-items: end; height: 140px; border-bottom: 1px solid var(--acxpa-ds-stone); }
.dir-dash__bar { position: relative; height: 100%; display: flex; align-items: flex-end; outline: none; }
.dir-dash__bar span { display: block; width: 100%; background: var(--acxpa-ds-teal-600); border-radius: 4px 4px 0 0; }
.dir-dash__bar:hover span, .dir-dash__bar:focus span { background: var(--acxpa-ds-teal-800); }
.dir-dash__bar::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); white-space: nowrap; background: var(--acxpa-ds-ink); color: var(--acxpa-ds-white); font-size: var(--acxpa-ds-text-caption); padding: 4px 8px; border-radius: 4px; opacity: 0; pointer-events: none; z-index: 2; }
.dir-dash__bar:hover::after, .dir-dash__bar:focus::after { opacity: 1; }
.dir-dash__axis { display: flex; justify-content: space-between; margin-top: var(--acxpa-ds-space-2xs); font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }
.dir-dash__listing { background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); margin-bottom: var(--acxpa-ds-space-md); display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--acxpa-ds-space-md); }
.dir-dash__meta { margin: var(--acxpa-ds-space-3xs, 2px) 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-dash__focus { display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs); }
.dir-dash__focus span { background: var(--acxpa-ds-teal-50); border: 1px solid var(--acxpa-ds-teal-200); border-radius: var(--acxpa-ds-radius-pill); padding: 4px 12px; font-size: var(--acxpa-ds-text-small); }
.dir-dash__warn { margin: 0; background: var(--acxpa-ds-gold-tint); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); }
.dir-dash__mini { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); margin: 0; }
.dir-dash__mini > div { background: var(--acxpa-ds-sand); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); }
.dir-dash__mini dt { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-dash__mini dd { margin: var(--acxpa-ds-space-2xs) 0 0; display: grid; gap: 2px; }
.dir-dash__mini strong { font-size: 1.5rem; line-height: 1.1; }
.dir-dash__demand { background: var(--acxpa-ds-harbour-tint); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-md); }
.dir-dash__demand h4 { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-body); }
.dir-dash__demand p { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); }
.dir-dash__table { width: 100%; border-collapse: collapse; font-size: var(--acxpa-ds-text-small); background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-md); overflow: hidden; }
.dir-dash__table th, .dir-dash__table td { text-align: left; padding: 8px 12px; border-bottom: 1px solid var(--acxpa-ds-stone); }
.dir-dash__table th:last-child, .dir-dash__table td:last-child { text-align: right; }
@media (max-width: 1000px) { .dir-dash__tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) {
    .dir-dash__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dir-dash__mini { grid-template-columns: minmax(0, 1fr); }
    .dir-dash__bars { gap: 3px; }
}
.dir-dash__peak { margin: 0 0 var(--acxpa-ds-space-xs); text-align: right; font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); }
.dir-dash__empty { margin: 0; padding: var(--acxpa-ds-space-xl) var(--acxpa-ds-space-md); text-align: center; background: var(--acxpa-ds-sand); border-radius: var(--acxpa-ds-radius-md); color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }

/* ---- Supplier editors (Phase 4) ---- */
.dir-dash__lhead { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--acxpa-ds-space-md); }
.dir-dash__publish .dir-dash__h3 { color: var(--acxpa-ds-white); }
.dir-dash__add .dir-form__error { flex-basis: 100%; margin: 0; }
.dir-edit { max-width: 920px; }
.dir-edit__form { display: grid; gap: var(--acxpa-ds-space-lg); margin-top: var(--acxpa-ds-space-lg); }
.dir-edit__card { margin: 0; min-width: 0; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); }
.dir-edit__card legend { float: left; width: 100%; margin-bottom: var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-h4); font-weight: 700; color: var(--acxpa-ds-ink); }
.dir-edit__card legend + * { clear: both; }
.dir-edit__help { display: block; font-weight: 400; font-size: var(--acxpa-ds-text-caption); color: var(--acxpa-ds-slate); margin: 0; }
.dir-edit__group { padding: var(--acxpa-ds-space-md) 0; border-top: 1px solid var(--acxpa-ds-stone); }
.dir-edit__group:first-of-type { border-top: 0; padding-top: 0; }
.dir-edit__q { margin: 0 0 var(--acxpa-ds-space-xs); font-weight: 600; font-size: var(--acxpa-ds-text-small); }
.dir-edit__checks { display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-xs); }
.dir-form .dir-check { display: inline-flex; align-items: center; gap: 8px; font-weight: 400; background: var(--acxpa-ds-cloud); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-pill); padding: 6px 14px; cursor: pointer; }
.dir-form .dir-check input { width: auto; padding: 0; margin: 0; accent-color: var(--acxpa-ds-teal-600); }
.dir-form .dir-check:has(input:checked) { background: var(--acxpa-ds-teal-50); border-color: var(--acxpa-ds-teal-600); }
.dir-form .dir-check:has(input:disabled:not(:checked)) { opacity: .5; cursor: not-allowed; }
.dir-check--auto small { color: var(--acxpa-ds-slate); }
.dir-edit__logo { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); }
.dir-edit__logo img { width: 96px; height: 96px; object-fit: contain; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); padding: 6px; }
.dir-edit__logo label { flex: 1; }
.dir-edit__save { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); }
/* Always breathing room above the page's action row, whatever sits before it (Justin, 13 Nov: called out more than once). */
* + .dir-edit__save { margin-top: var(--acxpa-ds-space-lg); }
.dir-edit__errors { background: var(--acxpa-ds-error-tint); color: var(--acxpa-ds-error-deep); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-md); }
.dir-edit__errors ul { margin: var(--acxpa-ds-space-xs) 0 0; padding-left: 1.2em; }
.dir-pick__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.dir-pick__chip { font: inherit; font-size: var(--acxpa-ds-text-small); background: var(--acxpa-ds-teal-50); border: 1px solid var(--acxpa-ds-teal-600); color: var(--acxpa-ds-teal-800); border-radius: var(--acxpa-ds-radius-pill); padding: 4px 12px; cursor: pointer; }
.dir-pick__chip:hover { background: var(--acxpa-ds-clay-tint); border-color: var(--acxpa-ds-clay); }
.dir-acct__grid > label { align-content: start; }
@media (max-width: 640px) {
    .dir-dash__publish, .dir-dash__lhead { flex-direction: column; align-items: flex-start; }
}

/* ---- Account shell: sidebar navigation and profile progress (Phase 4, after Justin's review 22 Oct) ---- */
.dir-shell { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: var(--acxpa-ds-space-xl); align-items: start; }
.dir-shell--wide { grid-template-columns: minmax(0, 1fr); }
.dir-shell__side { position: sticky; top: var(--acxpa-ds-space-md); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); overflow: hidden; }
.dir-shell__nav { display: grid; padding: var(--acxpa-ds-space-xs) 0; }
.dir-shell__nav a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px var(--acxpa-ds-space-md); color: var(--acxpa-ds-ink); text-decoration: none; font-weight: 600; font-size: var(--acxpa-ds-text-small); border-left: 4px solid transparent; }
.dir-shell__nav a:hover { background: var(--acxpa-ds-sand); }
.dir-shell__nav a[aria-current="page"] { background: var(--acxpa-ds-teal-50); border-left-color: var(--acxpa-ds-teal-600); color: var(--acxpa-ds-teal-800); }
.dir-shell__nav .dir-shell__sub { font-weight: 400; padding-left: calc(var(--acxpa-ds-space-md) + 8px); }
.dir-shell__nav .dir-shell__add { color: var(--acxpa-ds-teal-700); }
.dir-shell__crumbs { display: flex; gap: 8px; align-items: center; margin-bottom: var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-shell__main > .dir-acct__note { margin-top: 0; }
.dir-shell__main .dir-edit { max-width: none; }
@media (max-width: 900px) {
    .dir-shell { grid-template-columns: 1fr; }
    .dir-shell__side { position: static; }
    .dir-shell__nav { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; padding: 0; }
    .dir-shell__nav a { border-left: 0; border-bottom: 3px solid transparent; }
    .dir-shell__nav a[aria-current="page"] { border-bottom-color: var(--acxpa-ds-teal-600); }
    .dir-shell__label { display: none; }
    .dir-shell__nav .dir-shell__sub { padding-left: var(--acxpa-ds-space-md); }
}

.dir-edit__todo { display: flex; flex-wrap: wrap; align-items: center; gap: var(--acxpa-ds-space-xs); margin-top: var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); }
.dir-edit__todo strong { margin-right: 4px; }
.dir-edit__todo span { background: var(--acxpa-ds-gold-tint); border: 1px solid var(--acxpa-ds-gold); border-radius: var(--acxpa-ds-radius-pill); padding: 3px 12px; }

/* ---- Listing editor: numbered steps, compact specialty rows, one panel per specialty (review 22 Oct) ---- */
.dir-step { background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); }
.dir-step__head { display: flex; gap: var(--acxpa-ds-space-md); align-items: flex-start; margin-bottom: var(--acxpa-ds-space-md); }
.dir-step__head h2 { margin: 0 0 4px; font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-ink); }
.dir-step__head p { margin: 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-step__num { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--acxpa-ds-harbour-deep); color: var(--acxpa-ds-gold); font-weight: 700; }
.dir-step__empty { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-spec { display: grid; grid-template-columns: 1fr 1fr; gap: 8px var(--acxpa-ds-space-md); }
.dir-caps { display: grid; gap: var(--acxpa-ds-space-xs); }
.dir-caps__panel { border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-sand); }
.dir-caps__panel[open] { background: var(--acxpa-ds-white); border-color: var(--acxpa-ds-teal-300); }
.dir-caps__panel summary { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-sm); padding: 12px var(--acxpa-ds-space-md); cursor: pointer; list-style: none; font-weight: 600; }
.dir-caps__panel summary::-webkit-details-marker { display: none; }
.dir-caps__panel summary::before { content: "▸"; color: var(--acxpa-ds-teal-600); margin-right: 4px; }
.dir-caps__panel[open] summary::before { content: "▾"; }
.dir-caps__title { flex: 1; }
.dir-caps__status { font-size: var(--acxpa-ds-text-caption); font-weight: 700; background: var(--acxpa-ds-gold-tint); color: var(--acxpa-ds-gold-deep); border-radius: var(--acxpa-ds-radius-pill); padding: 3px 10px; white-space: nowrap; }
.dir-caps__status.is-ok { background: var(--acxpa-ds-success-tint); color: var(--acxpa-ds-success-deep); }
.dir-caps__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px var(--acxpa-ds-space-md); padding: 0 var(--acxpa-ds-space-md) var(--acxpa-ds-space-md); }
.dir-form .dir-opt { display: flex; align-items: center; gap: 10px; font-weight: 400; padding: 8px 10px; border-radius: var(--acxpa-ds-radius-md); cursor: pointer; }
.dir-form .dir-opt:hover { background: var(--acxpa-ds-cloud); }
.dir-form .dir-opt input { width: 18px; height: 18px; flex: 0 0 18px; accent-color: var(--acxpa-ds-teal-600); }
.dir-form .dir-opt:has(input:checked) { background: var(--acxpa-ds-teal-50); font-weight: 600; }
@media (max-width: 720px) { .dir-spec, .dir-caps__grid { grid-template-columns: 1fr; } .dir-step__head { flex-direction: column; gap: var(--acxpa-ds-space-xs); } }
.dir-step__head p + p { margin-top: 4px; }
.dir-spec__opt { border: 1px solid var(--acxpa-ds-stone); }
.dir-shares { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--acxpa-ds-space-lg); align-items: start; }
.dir-shares[hidden] { display: none; }
.dir-shares__rows { display: grid; gap: 8px; }
.dir-shares__row { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-sm); padding-bottom: 8px; border-bottom: 1px solid var(--acxpa-ds-cloud); }
.dir-shares__row[hidden] { display: none; }
.dir-form .dir-shares__row label { font-weight: 600; }
.dir-shares__input { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; }
.dir-form .dir-shares__input input { width: 72px; padding: 6px 8px; text-align: right; }
.dir-shares__total { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-gold-tint); font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-shares__total strong { font-size: 1.1rem; }
[data-split].is-ok .dir-shares__total { background: var(--acxpa-ds-success-tint); color: var(--acxpa-ds-success-deep); }
[data-split].is-over .dir-shares__total { background: var(--acxpa-ds-clay-tint); color: var(--acxpa-ds-clay-deep); }
.dir-shares__rows > .dir-btn { justify-self: start; }
.dir-shares__preview { margin: 0; background: var(--acxpa-ds-sand); border: 1px dashed var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-md); }
.dir-shares__preview figcaption { font-size: var(--acxpa-ds-text-caption); text-transform: uppercase; letter-spacing: .08em; color: var(--acxpa-ds-slate); font-weight: 700; margin-bottom: var(--acxpa-ds-space-sm); }
.dir-shares__preview .dir-h4 { margin: 0 0 var(--acxpa-ds-space-xs); }
@media (max-width: 720px) { .dir-shares { grid-template-columns: 1fr; } }

/* Sidebar setup steps (review 22 Oct: the sidebar is the checklist) */
.dir-shell__nav .dir-shell__steps a { justify-content: flex-start; gap: 10px; font-weight: 400; }
.dir-shell__nav .dir-shell__steps a[aria-current="step"] { background: var(--acxpa-ds-teal-50); border-left-color: var(--acxpa-ds-teal-600); color: var(--acxpa-ds-teal-800); font-weight: 700; }
.dir-edit__later { margin-left: auto; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
@media (max-width: 900px) {
    .dir-shell__nav .dir-shell__steps a[aria-current="step"] { border-bottom: 3px solid var(--acxpa-ds-teal-600); }
}
.dir-edit__card > .dir-edit__help { margin-bottom: var(--acxpa-ds-space-md); }

.dir-shell__group { margin: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md) 4px; font-size: var(--acxpa-ds-text-caption); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--acxpa-ds-harbour); }
.dir-shell__group small { display: block; text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--acxpa-ds-slate); }
@media (max-width: 900px) { .dir-shell__group { display: none; } }
.dir-edit__checks--stack { flex-direction: column; align-items: flex-start; }
.dir-edit__q + .dir-edit__help { margin: -4px 0 var(--acxpa-ds-space-xs); }
.dir-check__hint { color: var(--acxpa-ds-slate); font-weight: 400; }

.dir-shell__nav .dir-shell__parts a { justify-content: space-between; padding-left: calc(var(--acxpa-ds-space-md) + 38px); }
.dir-prog__part small:not(.dir-tabs__level) { font-weight: 500; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-caption); }
.dir-prog__part .dir-tabs__level { margin-left: 4px; vertical-align: 1px; color: var(--acxpa-ds-ink); font-size: 11px; font-weight: 700; }
.dir-caps__suggest { display: grid; gap: 6px; margin: 0 var(--acxpa-ds-space-md) var(--acxpa-ds-space-md); padding-top: var(--acxpa-ds-space-sm); border-top: 1px dashed var(--acxpa-ds-stone); font-size: var(--acxpa-ds-text-small); }
.dir-form .dir-caps__suggest label { display: block; font-weight: 400; }
.dir-caps__suggest-row { display: flex; gap: var(--acxpa-ds-space-xs); }
.dir-caps__suggest-row input { flex: 1; }
.dir-caps__suggest-msg { display: flex; align-items: center; gap: var(--acxpa-ds-space-xs); margin: 0; padding: 10px 14px; border-radius: var(--acxpa-ds-radius-md); font-weight: 600; font-size: var(--acxpa-ds-text-body); }
.dir-caps__suggest-msg::before { flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-weight: 800; font-size: 13px; }
.dir-caps__suggest-msg.is-ok { background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-caps__suggest-msg.is-ok::before { content: "✓"; background: var(--acxpa-ds-gold); color: var(--acxpa-ds-harbour-deep); }
.dir-caps__suggest-msg.is-err { background: var(--acxpa-ds-error-tint); color: var(--acxpa-ds-error); }
.dir-caps__suggest-msg.is-err::before { content: "!"; background: var(--acxpa-ds-error); color: #fff; }
/* Working state for any button (set by the layout script, or by the suggestion fetch). */
.is-busy { opacity: .8; cursor: progress; pointer-events: none; }
.is-busy::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: 8px; vertical-align: -1px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: dir-spin .7s linear infinite; }
@keyframes dir-spin { to { transform: rotate(360deg); } }
.dir-review__list { margin: var(--acxpa-ds-space-md) 0; font-size: var(--acxpa-ds-text-small); } .dir-review__list ul { columns: 2; margin: var(--acxpa-ds-space-xs) 0 0; padding-left: 1.2em; } .dir-review__list summary { cursor: pointer; color: var(--acxpa-ds-teal-700); font-weight: 600; }

/* Profile: one card per specialty with what the supplier offers in it (replaces the flat capability chips, 23 Oct) */
.dir-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-md); }
.dir-specs__card { background: var(--acxpa-ds-sand); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); }
.dir-specs__card h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: var(--acxpa-ds-text-small); }
.dir-specs__card h4 a { color: var(--acxpa-ds-ink); }
.dir-specs__card h4 strong { margin-left: auto; color: var(--acxpa-ds-slate); }
.dir-specs__card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; font-size: var(--acxpa-ds-text-small); }
.dir-specs__card li { position: relative; padding-left: 20px; }
.dir-specs__card li::before { content: "✓"; position: absolute; left: 0; color: var(--acxpa-ds-success); font-weight: 700; }
@media (max-width: 720px) { .dir-specs { grid-template-columns: 1fr; } }
.dir-edit__help--gap { margin-bottom: var(--acxpa-ds-space-md); }

.dir-acct__card .dir-acct__note { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); line-height: 1.5; }

/* Team admin (checklists). Sand panels and white rows, gold for the "waiting" panel. */
.dir-admin .dir-acct__h { margin-bottom: 4px; }
.dir-admin__crumb { margin: 0 0 var(--acxpa-ds-space-sm); font-weight: 600; }
.dir-admin__panel { margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-xl); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-admin__panel--gold { background: var(--acxpa-ds-gold-tint); border-color: transparent; }
.dir-admin__panel .dir-dash__h2 { margin-top: 0; }
.dir-admin__count { display: inline-grid; place-items: center; min-width: 28px; height: 28px; padding: 0 8px; margin-left: 6px; border-radius: 14px; background: var(--acxpa-ds-harbour-deep); color: #fff; font-size: 15px; vertical-align: 3px; }
.dir-admin__row { display: flex; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-xs); background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-md); }
.dir-admin__row small { display: block; color: var(--acxpa-ds-slate); }
.dir-admin__cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-md); }
.dir-admin__cat { display: grid; gap: 4px; padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); color: inherit; text-decoration: none; }
.dir-admin__cat:hover, .dir-admin__cat:focus-visible { border-color: var(--acxpa-ds-harbour-deep); box-shadow: 0 4px 14px rgba(17, 32, 64, .08); }
.dir-admin__cat small { color: var(--acxpa-ds-slate); }
.dir-admin__cat span { color: var(--acxpa-ds-harbour-deep); font-weight: 600; margin-top: 4px; }
.dir-admin__sub { margin-top: var(--acxpa-ds-space-sm); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); scroll-margin-top: 90px; }
.dir-admin__sub[open] { background: var(--acxpa-ds-sand); }
.dir-admin__sub summary { display: flex; justify-content: space-between; gap: var(--acxpa-ds-space-sm); padding: var(--acxpa-ds-space-md); cursor: pointer; }
.dir-admin__sub summary span { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-admin__items { list-style: none; margin: 0; padding: 0 var(--acxpa-ds-space-md); display: grid; gap: 6px; }
.dir-admin__items li { background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-md); padding: 8px 10px; }
.dir-admin__items li.is-retired { opacity: .65; }
.dir-admin__item { display: grid; grid-template-columns: minmax(0, 1fr) auto 230px 224px; align-items: center; gap: var(--acxpa-ds-space-sm); }
.dir-admin__item input { min-width: 0; padding: 6px 10px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-sm); font: inherit; }
.dir-admin__meta { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); white-space: nowrap; }
.dir-admin__acts { display: grid; grid-template-columns: 32px 32px 76px 60px; align-items: center; gap: 6px; }
.dir-admin__icon { width: 32px; height: 32px; border: 1px solid var(--acxpa-ds-stone); border-radius: 6px; background: var(--acxpa-ds-white); cursor: pointer; font-weight: 700; color: var(--acxpa-ds-harbour-deep); }
.dir-admin__icon:disabled { opacity: .3; cursor: default; }
.dir-admin__icon.is-busy::before { display: none; }
.dir-admin__link { border: 0; background: none; padding: 4px 6px; font: inherit; font-weight: 600; color: var(--acxpa-ds-harbour-deep); text-decoration: underline; cursor: pointer; }
.dir-admin__link--danger { color: var(--acxpa-ds-error); }
.dir-admin__add { display: grid; gap: 6px; margin: var(--acxpa-ds-space-md); padding-top: var(--acxpa-ds-space-sm); border-top: 1px dashed var(--acxpa-ds-stone); }
.dir-admin__add div { display: flex; gap: var(--acxpa-ds-space-xs); }
.dir-admin__add input { flex: 1; padding: 8px 12px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); font: inherit; }
@media (max-width: 720px) {
    .dir-admin__item { grid-template-columns: minmax(0, 1fr) auto; }
    .dir-admin__meta, .dir-admin__acts { grid-column: 1 / -1; }
    .dir-admin__row { flex-direction: column; align-items: flex-start; }
}
.dir-admin__tag { display: inline-block; margin-right: 6px; padding: 2px 8px; border-radius: 10px; background: var(--acxpa-ds-harbour-deep); color: #fff; font-size: 12px; font-weight: 700; vertical-align: 2px; }
.dir-admin__tag--alt { background: var(--acxpa-ds-gold-deep); }
.dir-admin__sub--flat { padding-bottom: 2px; background: var(--acxpa-ds-sand); }
.dir-admin__subh { display: flex; justify-content: space-between; gap: var(--acxpa-ds-space-sm); margin: 0; padding: var(--acxpa-ds-space-md); font-size: 18px; }
.dir-admin__subh span { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); font-weight: 400; }
.dir-admin__item--list { grid-template-columns: minmax(0, 1fr) auto 200px 80px; }

/* Certificates & partners (supplier page, sidebar extra, overview extra, public profile) */
.dir-pill--error { background: var(--acxpa-ds-error-tint); color: var(--acxpa-ds-error-deep); }
.dir-proof { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-proof--alt { background: var(--acxpa-ds-sand); }
.dir-proof__h { margin: 0 0 4px; font-size: var(--acxpa-ds-text-h4); }
.dir-proof__list { list-style: none; margin: var(--acxpa-ds-space-md) 0 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-xs); }
.dir-proof__list li { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--acxpa-ds-space-sm); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-sand); }
.dir-proof--alt .dir-proof__list li { background: var(--acxpa-ds-white); }
.dir-proof__main small { display: block; margin-top: 2px; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-proof__main .dir-pill { margin-left: 6px; vertical-align: 1px; }
.dir-proof__main .dir-proof__why { color: var(--acxpa-ds-ink); }
.dir-proof__add { display: grid; gap: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-md); padding-top: var(--acxpa-ds-space-md); border-top: 1px dashed var(--acxpa-ds-stone); justify-items: start; }
.dir-proof__add .dir-form__grid { width: 100%; }
.dir-proof__addh { margin: 0; font-weight: 700; }
.dir-proof__missing { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-gold-tint); }
.dir-proof__missing p { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-proof__missrow { display: flex; gap: var(--acxpa-ds-space-xs); flex-wrap: wrap; }
.dir-proof__misstext { flex: 1; min-width: 200px; }
.dir-proof__misstext input { width: 100%; }
.dir-proofs { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.dir-proofs__item { display: inline-flex; align-items: center; gap: 6px; }
.dir-proofs__badge { padding: 1px 7px; border-radius: 10px; background: var(--acxpa-ds-success-tint); color: var(--acxpa-ds-success-deep); font-size: 12px; font-weight: 700; }
.dir-proofs__wait { color: var(--acxpa-ds-slate); font-size: 12px; font-style: italic; }
@media (max-width: 720px) { .dir-proof { padding: var(--acxpa-ds-space-md); } .dir-proof__list li { flex-direction: column; } }
.dir-proof, .dir-proof__main, .dir-proof__add, .dir-proof__add label { min-width: 0; }
.dir-proof__main { overflow-wrap: anywhere; }
.dir-proof__add input[type=file] { max-width: 100%; }
.dir-review__list[open] { display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-review__list[open] > .dir-btn { justify-self: start; }
/* Grid children must be allowed to shrink, or the sideways-scrolling mobile nav widens the whole page. */
.dir-shell > *, .dir-shell__nav { min-width: 0; }
/* Screen-reader-only labels are absolutely positioned: keep them inside the scrolling nav, not the page. */
.dir-shell__nav { position: relative; }
.dir-proof__upsell { display: flex; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-lg); margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-gold-tint); }
.dir-proof__upsell p { margin: var(--acxpa-ds-space-xs) 0 0; }
.dir-proof__upsell .dir-btn { flex: none; }
@media (max-width: 720px) { .dir-proof__upsell { flex-direction: column; align-items: flex-start; } }

/* Yearly reconfirm */
.dir-facts__stale { color: var(--acxpa-ds-slate); }
.dir-confirm__facts { margin: var(--acxpa-ds-space-md) 0; padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-sand); }
.dir-confirm__actions { flex-wrap: wrap; }
@media (max-width: 720px) { .dir-dash__confirm { flex-direction: column; align-items: flex-start; } }
.dir-confirm__actions + .dir-form__small { margin-top: var(--acxpa-ds-space-sm); }

/* Sign in with ACXPA */
.dir-acct__sso { display: grid; gap: var(--acxpa-ds-space-sm); justify-items: start; margin: var(--acxpa-ds-space-md) 0 0; padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-gold-tint); }
.dir-acct__sso p { margin: 0; }
.dir-acct__or { display: flex; align-items: center; gap: var(--acxpa-ds-space-sm); margin: var(--acxpa-ds-space-md) 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-acct__or::before, .dir-acct__or::after { content: ""; flex: 1; height: 1px; background: var(--acxpa-ds-stone); }
.dir-admin__tag--claim { background: var(--acxpa-ds-success); }
.dir-admin__tag--flag { background: var(--acxpa-ds-error); }
.dir-admin__rowacts { display: flex; align-items: center; gap: var(--acxpa-ds-space-xs); flex: none; }
.dir-admin__rowacts form { margin: 0; }
.dir-acct__team { margin: 0 0 var(--acxpa-ds-space-md); padding: 10px 14px; border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-teal-50); border: 1px dashed var(--acxpa-ds-teal-200); font-size: var(--acxpa-ds-text-small); }
/* For suppliers: placement levels, members band; Industry bodies */
.dir-sup-head__ctas { display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-lg); }
.dir-sup-note { color: var(--acxpa-ds-slate); }
.dir-levels { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); margin: var(--acxpa-ds-space-lg) 0; align-items: stretch; }
.dir-level { position: relative; display: flex; flex-direction: column; gap: var(--acxpa-ds-space-xs); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); box-shadow: var(--acxpa-ds-shadow-sm); }
.dir-level--free { background: var(--acxpa-ds-sand); box-shadow: none; border: 1px solid var(--acxpa-ds-stone); }
.dir-level--top { background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-level--top .dir-level__who, .dir-level--top .dir-level__price span { color: rgba(255, 255, 255, .78); }
.dir-level--top .dir-level__name, .dir-level--top .dir-level__head { color: #fff; }
.dir-level__flag { position: absolute; top: -12px; left: var(--acxpa-ds-space-lg); margin: 0; padding: 3px 10px; border-radius: 12px; background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); font-size: 12px; font-weight: 700; }
.dir-level__name { margin: 0; font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-teal-800); }
.dir-level__price { margin: 0; }
.dir-level__price strong { font-size: 2rem; line-height: 1.1; }
.dir-level__price span { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-level__head { margin: var(--acxpa-ds-space-xs) 0 0; font-weight: 700; color: var(--acxpa-ds-ink); }
.dir-level__who { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-level__list { list-style: none; margin: var(--acxpa-ds-space-xs) 0 var(--acxpa-ds-space-md); padding: 0; display: grid; gap: 8px; flex: 1; align-content: start; font-size: var(--acxpa-ds-text-small); }
.dir-level__list li { position: relative; padding-left: 24px; }
.dir-level__list li::before { content: "✓"; position: absolute; left: 0; color: var(--acxpa-ds-success); font-weight: 800; }
.dir-level--top .dir-level__list li::before { color: var(--acxpa-ds-gold); }
.dir-sup-members { background: var(--acxpa-ds-teal-800); color: #fff; }
.dir-sup-members__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-xl); }
.dir-sup-members__inner .dir-btn { flex: none; }
.dir-bodies { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); }
.dir-body { display: flex; flex-direction: column; padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-body__name { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-teal-800); }
.dir-body p { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); }
.dir-body__links { margin-top: auto !important; }
@media (max-width: 1000px) { .dir-levels { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--acxpa-ds-space-xl); } .dir-bodies { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .dir-levels, .dir-bodies { grid-template-columns: 1fr; } .dir-sup-members__inner { flex-direction: column; align-items: flex-start; } }
@media (max-width: 720px) { .dir-admin__item--list { grid-template-columns: minmax(0, 1fr) auto; } }
.dir-admin__add, .dir-admin__add div, .dir-admin__add input { min-width: 0; }

/* Listing headline and highlights (paid; highlights Growth and above) */
.dir-placement__headline { margin: var(--acxpa-ds-space-xs) 0 0; font-size: var(--acxpa-ds-text-lead); color: var(--acxpa-ds-ink); }
.dir-highlights { list-style: none; margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-md); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-gold-tint); }
.dir-highlights li { position: relative; padding-left: 28px; font-weight: 600; }
.dir-highlights li::before { content: "★"; position: absolute; left: 0; color: var(--acxpa-ds-gold-deep); }
.dir-hl { display: grid; gap: var(--acxpa-ds-space-xs); border: 0; padding: 0; margin: 0; min-width: 0; }
.dir-hl legend { font-weight: 600; margin-bottom: 4px; }
@media (max-width: 640px) { .dir-highlights { grid-template-columns: minmax(0, 1fr); } }

/* Accelerator media: videos (click to load), social links, service pages, the supplier's Media & links page */
.dir-videos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); }
.dir-videos--one { grid-template-columns: minmax(0, 1fr); }
.dir-video { margin: 0; }
.dir-video__play, .dir-video__frame { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--acxpa-ds-radius-md); }
.dir-video__play { position: relative; cursor: pointer; background: linear-gradient(135deg, var(--acxpa-ds-harbour-deep), var(--acxpa-ds-teal-800)); color: #fff; }
.dir-video__play:hover .dir-video__icon, .dir-video__play:focus-visible .dir-video__icon { transform: translate(-50%, -50%) scale(1.08); }
.dir-video__icon { position: absolute; left: 50%; top: 50%; width: 68px; height: 68px; border-radius: 50%; background: var(--acxpa-ds-gold); transform: translate(-50%, -50%); transition: transform .15s; }
.dir-video__icon::after { content: ""; position: absolute; left: 27px; top: 21px; border-style: solid; border-width: 13px 0 13px 21px; border-color: transparent transparent transparent var(--acxpa-ds-ink); }
.dir-video__src { position: absolute; left: 14px; bottom: 12px; font-size: 12px; opacity: .8; }
.dir-video figcaption { margin-top: 6px; font-weight: 600; font-size: var(--acxpa-ds-text-small); }
.dir-social { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: var(--acxpa-ds-space-sm) 0 0; padding: 0; }
.dir-social a { display: inline-block; padding: 4px 10px; border-radius: 14px; background: var(--acxpa-ds-teal-50); border: 1px solid var(--acxpa-ds-teal-200); font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-teal-800); text-decoration: none; }
.dir-social a:hover { background: var(--acxpa-ds-teal-100); }
.dir-svc-body h3 { margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-teal-800); }
.dir-svc-body > h3:first-child { margin-top: 0; }
.dir-highlights--top { margin-top: 0; }
.dir-media__h2 { margin-top: var(--acxpa-ds-space-xl); }
.dir-media__videos { display: grid; gap: var(--acxpa-ds-space-sm); margin: var(--acxpa-ds-space-md) 0; }
.dir-media__video { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--acxpa-ds-space-sm); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-sand); }
.dir-media__video label, .dir-proof__add label { display: grid; gap: 4px; min-width: 0; font-weight: 600; }
.dir-media__count { margin-left: 8px; font-size: var(--acxpa-ds-text-small); font-weight: 400; color: var(--acxpa-ds-slate); }
.dir-media__grid { list-style: none; margin: var(--acxpa-ds-space-md) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: var(--acxpa-ds-space-sm); }
.dir-media__grid li { background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-md); padding: 6px; }
.dir-media__grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; height: auto; }
.dir-media__acts { display: flex; align-items: center; gap: 6px; margin-top: 6px; }
.dir-media__acts .dir-admin__link--danger { margin-left: auto; }
.dir-media__doc { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px var(--acxpa-ds-space-sm); align-items: center; width: 100%; }
.dir-media__doctitle input { width: 100%; padding: 6px 10px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-sm); font: inherit; font-weight: 600; }
.dir-media__doc small { grid-column: 1; color: var(--acxpa-ds-slate); }
.dir-media__docacts { grid-column: 2; grid-row: 1 / span 2; display: flex; align-items: center; gap: 6px; }
@media (max-width: 720px) {
    .dir-videos, .dir-media__video { grid-template-columns: minmax(0, 1fr); }
    .dir-media__doc { grid-template-columns: minmax(0, 1fr); }
    .dir-media__docacts { grid-column: 1; grid-row: auto; flex-wrap: wrap; }
}
.dir-compare { margin: var(--acxpa-ds-space-md) 0; border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); }
.dir-compare summary { padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); cursor: pointer; font-weight: 700; color: var(--acxpa-ds-teal-800); }
.dir-compare__scroll { overflow-x: auto; padding: 0 var(--acxpa-ds-space-lg) var(--acxpa-ds-space-lg); }
.dir-compare__table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: var(--acxpa-ds-text-small); }
.dir-compare__table th, .dir-compare__table td { padding: 10px 8px; border-bottom: 1px solid var(--acxpa-ds-stone); text-align: center; }
.dir-compare__table thead th { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-teal-800); }
.dir-compare__table thead th:last-child { background: var(--acxpa-ds-gold-tint); border-radius: 6px 6px 0 0; }
.dir-compare__table tbody td:last-child { background: var(--acxpa-ds-gold-tint); }
.dir-compare__table tbody th { text-align: left; font-weight: 400; }
.dir-compare__yes { color: var(--acxpa-ds-success); font-weight: 800; }
.dir-compare__no { color: var(--acxpa-ds-stone); }
.dir-compare__table thead th:first-child { text-align: left; }

/* Dashboard listing tabs */
.dir-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; gap: var(--acxpa-ds-space-xs); margin: 0 0 calc(-1 * var(--acxpa-ds-space-xs)); position: relative; z-index: 1; }
.dir-tabs__tab { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 12px 16px; border: 1px solid var(--acxpa-ds-stone); border-bottom: 0; border-radius: 10px 10px 0 0; background: var(--acxpa-ds-cloud); color: var(--acxpa-ds-slate); font: inherit; font-weight: 600; font-size: var(--acxpa-ds-text-small); cursor: pointer; }
.dir-tabs__tab:hover { color: var(--acxpa-ds-ink); background: var(--acxpa-ds-white); }
.dir-tabs__tab[aria-selected="true"] { background: var(--acxpa-ds-white); color: var(--acxpa-ds-ink); box-shadow: inset 0 3px 0 var(--acxpa-ds-gold); }
.dir-tabs__tab:focus-visible { outline: 2px solid var(--acxpa-ds-teal-600); outline-offset: 2px; }
.dir-tabs__level { padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 700; background: var(--acxpa-ds-stone); color: var(--acxpa-ds-ink); }
.dir-tabs__level--accelerator { background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-tabs__level--growth { background: var(--acxpa-ds-gold-tint); }
.dir-tabs__level--launch { background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-tabs + .dir-dash__listing, .dir-tabs ~ .dir-dash__listing { border-top-left-radius: 0; }
.dir-dash__listing[hidden] { display: none; }
/* More tabs than fit: arrow buttons and a fade on the side that has more (Justin, 7 Nov). */
.dir-tabs-wrap { position: relative; }
.dir-tabs::-webkit-scrollbar { display: none; }
.dir-tabs-wrap.has-more-right .dir-tabs { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 72px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 72px), transparent); }
.dir-tabs-wrap.has-more-left .dir-tabs { -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 72px), transparent); mask-image: linear-gradient(to left, #000 calc(100% - 72px), transparent); }
.dir-tabs-wrap.has-more-left.has-more-right .dir-tabs { -webkit-mask-image: linear-gradient(to right, transparent, #000 72px, #000 calc(100% - 72px), transparent); mask-image: linear-gradient(to right, transparent, #000 72px, #000 calc(100% - 72px), transparent); }
.dir-tabs__more { position: absolute; top: 4px; z-index: 2; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--acxpa-ds-stone); background: var(--acxpa-ds-white); color: var(--acxpa-ds-teal-700); font: inherit; font-size: 18px; font-weight: 700; line-height: 1; cursor: pointer; box-shadow: 0 2px 6px rgba(20, 37, 42, .15); }
.dir-tabs__more:hover { background: var(--acxpa-ds-cloud); }
.dir-tabs__more--prev { left: -6px; }
.dir-tabs__more--next { right: -6px; }
/* Unfinished listing: the next step, up front. Upgrades: one quiet line. */
.dir-dash__todo .dir-btn { flex: none; }
.dir-dash__more { margin: 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-dash__more a { font-weight: 600; white-space: nowrap; }
.dir-dash__more a::after { content: " →"; }
@media (max-width: 640px) { .dir-dash__todo { flex-direction: column; align-items: flex-start; } }
/* Arriving from "+ List in another category": the add form stands out. */
/* Sidebar sections: each group in its own box, so it reads as three chunks, not one long list (Justin, 7 Nov). */
.dir-shell__sec { margin: var(--acxpa-ds-space-xs) 10px 0; padding: 4px 0 6px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); overflow: hidden; }
.dir-shell__sec .dir-shell__group { margin: 8px 12px 4px; }
.dir-shell__sec .dir-shell__steps { margin: 0; }
.dir-shell__nav .dir-shell__sec a { padding-left: 12px; padding-right: 12px; }
.dir-shell__sec--listings { background: var(--acxpa-ds-sand); }
.dir-shell__sec--listings .dir-shell__group--step { margin-left: 12px; padding-left: 0; }
.dir-shell__nav .dir-shell__sec--listings .dir-shell__parts a { padding: 7px 12px 7px 46px; font-size: var(--acxpa-ds-text-caption); line-height: 1.35; }
.dir-shell__nav .dir-shell__sec--listings .dir-shell__parts a:hover { background: var(--acxpa-ds-white); }
.dir-shell__nav .dir-shell__sec--listings .dir-shell__add { margin-top: 4px; padding-top: 8px; border-top: 1px solid var(--acxpa-ds-stone); font-size: var(--acxpa-ds-text-caption); }
.dir-shell__sec--extras { border-style: dashed; background: transparent; }
@media (max-width: 900px) { .dir-shell__sec { display: contents; } }
/* Confirmation dialog */
.dir-notice { background: var(--acxpa-ds-white); width: min(440px, calc(100vw - 32px)); padding: var(--acxpa-ds-space-xl) var(--acxpa-ds-space-lg) var(--acxpa-ds-space-lg); border: 0; border-top: 6px solid var(--acxpa-ds-gold); border-radius: var(--acxpa-ds-radius-lg); text-align: center; color: var(--acxpa-ds-ink); box-shadow: 0 20px 60px rgba(20, 37, 42, .35); }
.dir-notice::backdrop { background: rgba(20, 37, 42, .55); }
.dir-notice__tick { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--acxpa-ds-success); color: #fff; font-size: 28px; font-weight: 700; margin-bottom: var(--acxpa-ds-space-sm); }
.dir-notice__tick--info { background: var(--acxpa-ds-harbour); font-family: Georgia, serif; font-style: italic; }
.dir-notice__h { margin: 0 0 var(--acxpa-ds-space-xs); font-size: 1.375rem; }
.dir-notice p { margin: 0 0 var(--acxpa-ds-space-lg); font-size: var(--acxpa-ds-text-body); line-height: 1.55; }
.dir-notice form { margin: 0; }
.dir-notice .dir-btn { min-width: 140px; }
.dir-notice__later { margin-top: var(--acxpa-ds-space-sm); background: none; border: 0; padding: 6px; font: inherit; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-teal-700); text-decoration: underline; cursor: pointer; }
/* Flagged profile review */
.dir-flag__why { margin: var(--acxpa-ds-space-md) 0; padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border-left: 4px solid var(--acxpa-ds-error); background: var(--acxpa-ds-error-tint); border-radius: var(--acxpa-ds-radius-md); font-size: var(--acxpa-ds-text-small); }
.dir-flag__why ul { margin: 6px 0 0; padding-left: 1.2em; }
.dir-flag__copy { margin: var(--acxpa-ds-space-md) 0; padding: var(--acxpa-ds-space-md); background: var(--acxpa-ds-sand); border-radius: var(--acxpa-ds-radius-md); font-size: var(--acxpa-ds-text-small); }
.dir-flag__copy p { margin: 6px 0 0; }
.dir-btn--danger { background: var(--acxpa-ds-white); color: var(--acxpa-ds-error); border: 2px solid var(--acxpa-ds-error); }
.dir-btn--danger:hover { background: var(--acxpa-ds-error-tint); color: var(--acxpa-ds-error); }
.dir-reasons { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dir-reasons legend { width: 100%; margin-bottom: 6px; font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-admin__tag--muted { background: var(--acxpa-ds-slate); }
.dir-admin__row--muted { opacity: .85; }
/* Another look at a rejected request (13 Nov): two clear choices, each with its own heading. */
.dir-again__h { margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-sm); font-size: 1.15rem; }
.dir-again__form { display: grid; gap: var(--acxpa-ds-space-md); }
.dir-again__acts { display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-sm); align-items: center; }
.dir-dash__changes .dir-btn { flex: none; white-space: nowrap; }
@media (max-width: 640px) { .dir-dash__changes { flex-direction: column; align-items: flex-start; } }
.dir-reasons__mail { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-caption); }
/* Team decisions: green yes, red no, side by side (Justin, 7 Nov: a mistake on a review page) */
.dir-decide { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-md); }
.dir-decide > form { margin: 0; }
.dir-btn--approve { background: var(--acxpa-ds-success); color: #fff; border: 2px solid var(--acxpa-ds-success); }
.dir-btn--approve:hover { background: var(--acxpa-ds-success-deep); border-color: var(--acxpa-ds-success-deep); color: #fff; }   /* keep the text white: the site-wide link hover turned it dark green (Justin, 12 Nov) */
.dir-btn--reject { background: var(--acxpa-ds-error); color: #fff; border: 2px solid var(--acxpa-ds-error); }
.dir-btn--reject:hover { background: var(--acxpa-ds-error-deep); border-color: var(--acxpa-ds-error-deep); color: #fff; }
.dir-decide__no { flex: 0 0 auto; }
.dir-decide__no > summary { list-style: none; cursor: pointer; }
.dir-decide__no > summary::-webkit-details-marker { display: none; }
/* An open panel takes the card's full width, below the other buttons, with room around its button (Justin, 12 Nov). */
.dir-decide__no[open] { flex: 1 0 100%; order: 9; }
.dir-decide__panel { display: grid; gap: var(--acxpa-ds-space-md); width: 100%; margin-top: var(--acxpa-ds-space-sm); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg) var(--acxpa-ds-space-lg); border: 2px solid var(--acxpa-ds-error); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-error-tint); }
.dir-decide__panel > .dir-btn { justify-self: start; }
.dir-decide__panel .dir-form__small { margin: 0; }
.dir-decide__panel textarea { width: 100%; background: var(--acxpa-ds-white); }
.dir-decide__undo { margin-top: var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); }
.dir-decide__panel--amber { border-color: var(--acxpa-ds-warning); background: var(--acxpa-ds-warning-tint); }
/* Admin: every supplier, filterable (7 Nov 2026) */
.dir-sup__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-sm); }
.dir-sup__chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); color: var(--acxpa-ds-ink); font-size: var(--acxpa-ds-text-small); font-weight: 600; text-decoration: none; }
.dir-sup__chip span { background: var(--acxpa-ds-stone); border-radius: 999px; padding: 1px 8px; font-weight: 700; }
.dir-sup__chip:hover { border-color: var(--acxpa-ds-teal-600); }
.dir-sup__chip.is-on { background: var(--acxpa-ds-ink); border-color: var(--acxpa-ds-ink); color: #fff; }
.dir-sup__chip.is-on span { background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); }
.dir-sup__chip.is-empty { opacity: .55; }
.dir-sup__filters { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: var(--acxpa-ds-space-sm); align-items: end; padding: var(--acxpa-ds-space-md); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); }
.dir-sup__filters label { display: grid; gap: 4px; font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-slate); }
.dir-sup__filters input, .dir-sup__filters select { padding: 8px 10px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); font: inherit; font-weight: 400; color: var(--acxpa-ds-ink); background: var(--acxpa-ds-white); min-width: 0; }
.dir-sup__q { grid-column: span 2; }
.dir-sup__filters .dir-btn { justify-self: start; }
.dir-sup__bar { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-sm); flex-wrap: wrap; margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-sm); }
.dir-sup__bar p { margin: 0; }
.dir-sup__wrap { overflow-x: auto; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); }
.dir-sup__table { width: 100%; border-collapse: collapse; font-size: 14px; }
.dir-sup__table th { text-align: left; padding: 10px 12px; background: var(--acxpa-ds-ink); color: #fff; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.dir-sup__table td { padding: 10px 12px; border-top: 1px solid var(--acxpa-ds-stone); vertical-align: top; }
.dir-sup__table tbody tr:nth-child(even) td { background: var(--acxpa-ds-sand); }
.dir-sup__table tbody tr:hover td { background: var(--acxpa-ds-teal-50); }
.dir-sup__table tr.is-retired td { color: var(--acxpa-ds-slate); }
.dir-sup__table small { display: block; color: var(--acxpa-ds-slate); line-height: 1.4; }
.dir-sup__table td:first-child { min-width: 200px; }
.dir-sup__warn { color: var(--acxpa-ds-warning-deep) !important; font-weight: 600; margin-top: 4px; }
.dir-sup__acts { text-align: center; white-space: nowrap; }
.dir-sup__links { display: flex; justify-content: center; gap: 12px; margin-top: 6px; font-size: var(--acxpa-ds-text-small); }
.dir-sup__links form { margin: 0; }
@media (max-width: 720px) { .dir-sup__q { grid-column: 1 / -1; } }
.dir-sup__table .dir-pill { white-space: nowrap; }
.dir-sup__table td:nth-child(4) { min-width: 170px; }
.dir-sup__plan { font-size: 13px; }
/* Paid plans in the account (Phase 5, 8 Nov 2026) */
.dir-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-md); }
.dir-plans .dir-level { border: 1px solid var(--acxpa-ds-stone); }
/* The current plan steps back, so the eye goes to the plans above it (Justin, 9 Nov). */
.dir-plans .dir-level.is-current { background: var(--acxpa-ds-cloud); border-color: var(--acxpa-ds-stone); box-shadow: none; }
.dir-plans .dir-level.is-current > *:not(.dir-level__flag) { opacity: .7; }
/* The current level steps back even when it's Accelerator (Justin, 10 Nov: its white-on-navy text washed out on grey). */
.dir-plans .dir-level--top.is-current { color: var(--acxpa-ds-ink); }
.dir-plans .dir-level--top.is-current .dir-level__name, .dir-plans .dir-level--top.is-current .dir-level__head,
.dir-plans .dir-level--top.is-current .dir-level__example { color: var(--acxpa-ds-ink); }
.dir-plans .dir-level--top.is-current .dir-level__who, .dir-plans .dir-level--top.is-current .dir-level__price span,
.dir-plans .dir-level--top.is-current .dir-level__gst { color: var(--acxpa-ds-slate); }
.dir-plans .dir-level--top.is-current .dir-level__list li::before { color: var(--acxpa-ds-success); }
.dir-plans .dir-level--top.is-current .dir-btn.is-disabled { color: var(--acxpa-ds-slate); border-color: var(--acxpa-ds-stone); }
.dir-level__flag--current { background: var(--acxpa-ds-stone); color: var(--acxpa-ds-ink); }
.dir-level__gst { margin: -4px 0 0; color: var(--acxpa-ds-slate); font-size: 12px; }
.dir-level--top .dir-level__gst { color: rgba(255, 255, 255, .72); }
.dir-btn.is-disabled { opacity: .6; cursor: default; pointer-events: none; }
.dir-level--top .dir-btn.is-disabled { color: #fff; border-color: rgba(255, 255, 255, .5); background: transparent; }
.dir-mem__health { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 2.4fr); gap: var(--acxpa-ds-space-md); margin: var(--acxpa-ds-space-lg) 0; }
.dir-mem__stat, .dir-mem__sync { padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-mem__stat strong { display: block; font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-teal-800); }
.dir-mem__stat span { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-mem__stat.is-attn { background: var(--acxpa-ds-gold-tint); border-color: var(--acxpa-ds-gold); }
.dir-mem__sync p { margin: 0 0 6px; font-size: var(--acxpa-ds-text-small); }
.dir-mem__bad { color: var(--acxpa-ds-error, #B42318); }
@media (max-width: 820px) { .dir-mem__health { grid-template-columns: 1fr 1fr; } .dir-mem__sync { grid-column: 1 / -1; } }
.dir-member { margin: 0 0 var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); }
.dir-member__h { margin: 0 0 6px; font-size: 1.15rem; }
.dir-member p { margin: 0 0 8px; }
.dir-member form { margin-top: var(--acxpa-ds-space-sm); }
.dir-member--quiet { background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-plans__member { margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-gold-tint); }
.dir-plans__member p { margin: 4px 0 0; }
.dir-plans__pick { list-style: none; margin: var(--acxpa-ds-space-lg) 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-plans__pick li { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); }
.dir-plans__pick small { display: block; color: var(--acxpa-ds-slate); }
.dir-pay { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--acxpa-ds-space-lg); align-items: start; margin-top: var(--acxpa-ds-space-lg); }
.dir-pay__form { padding: var(--acxpa-ds-space-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); }
.dir-pay__safe { margin: var(--acxpa-ds-space-sm) 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); text-align: center; }
.dir-pay__sum { padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-pay__sum h2 { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-h4); color: #fff; }
.dir-pay__item { margin: 0 0 var(--acxpa-ds-space-md); display: grid; gap: 2px; }
.dir-pay__item span { color: rgba(255, 255, 255, .78); font-size: var(--acxpa-ds-text-small); }
.dir-pay__sum dl { margin: 0; border-top: 1px solid rgba(255, 255, 255, .2); }
.dir-pay__sum dl > div { display: flex; justify-content: space-between; gap: var(--acxpa-ds-space-sm); padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .2); }
.dir-pay__sum dl > div[hidden] { display: none; }
.dir-pay__sum dt { color: rgba(255, 255, 255, .85); }
.dir-pay__sum dd { margin: 0; font-weight: 700; }
.dir-pay__total dt, .dir-pay__total dd { font-size: 1.15rem; color: #fff; }
.dir-pay__total dd span[hidden] { display: none; }
.dir-pay__total small { font-weight: 400; color: rgba(255, 255, 255, .7); font-size: 12px; }
.dir-pay__note { margin: var(--acxpa-ds-space-sm) 0 0; font-size: var(--acxpa-ds-text-small); color: rgba(255, 255, 255, .78); }
.dir-pay__note[hidden] { display: none; }
.dir-pay__points { list-style: none; margin: var(--acxpa-ds-space-md) 0; padding: 0; display: grid; gap: 6px; font-size: var(--acxpa-ds-text-small); }
.dir-pay__points li { position: relative; padding-left: 22px; }
.dir-pay__points li::before { content: "✓"; position: absolute; left: 0; color: var(--acxpa-ds-gold); font-weight: 800; }
.dir-pay__change { color: var(--acxpa-ds-gold); font-size: var(--acxpa-ds-text-small); font-weight: 600; }
@media (max-width: 900px) { .dir-plans, .dir-pay { grid-template-columns: 1fr; } }
.dir-pay__form { display: grid; gap: var(--acxpa-ds-space-md); }
.dir-pay__form label[hidden] { display: none; }
.dir-pay__form .dir-pay__safe { margin-top: calc(-1 * var(--acxpa-ds-space-xs)); }
.dir-plans .dir-btn { white-space: nowrap; }
/* After payment: confirming, then what to do now (Justin, 8 Nov) */
.dir-confirm { text-align: center; max-width: 560px; margin: 0 auto; }
.dir-confirm__spin { display: inline-block; width: 48px; height: 48px; border: 5px solid var(--acxpa-ds-teal-100); border-top-color: var(--acxpa-ds-teal-600); border-radius: 50%; animation: dir-spin .9s linear infinite; margin-bottom: var(--acxpa-ds-space-sm); }
@keyframes dir-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .dir-confirm__spin { animation-duration: 3s; } }
.dir-confirm__sub { color: var(--acxpa-ds-slate); }
.dir-confirm__steps { list-style: none; margin: var(--acxpa-ds-space-md) auto; padding: 0; display: grid; gap: 8px; text-align: left; max-width: 340px; }
.dir-confirm__steps li { position: relative; padding-left: 30px; color: var(--acxpa-ds-slate); }
.dir-confirm__steps li::before { content: ""; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--acxpa-ds-stone); }
.dir-confirm__steps li.is-done { color: var(--acxpa-ds-ink); }
.dir-confirm__steps li.is-done::before { content: "✓"; display: grid; place-items: center; background: var(--acxpa-ds-success); border-color: var(--acxpa-ds-success); color: #fff; font-size: 11px; font-weight: 800; }
.dir-confirm__steps li.is-now { color: var(--acxpa-ds-ink); font-weight: 600; }
.dir-confirm__steps li.is-now::before { border-color: var(--acxpa-ds-teal-600); border-top-color: transparent; animation: dir-spin .9s linear infinite; }
.dir-confirm__slow { margin-top: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-gold-tint); text-align: left; }
.dir-confirm__slow[hidden] { display: none; }
.dir-welcome { display: flex; gap: var(--acxpa-ds-space-md); align-items: flex-start; padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-success-tint); border: 1px solid #BFE0D1; }
.dir-welcome__badge { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--acxpa-ds-success); color: #fff; font-size: 26px; font-weight: 800; }
.dir-welcome__kicker { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--acxpa-ds-success-deep); }
.dir-welcome__h { margin: 2px 0 6px; font-size: var(--acxpa-ds-text-h3, 1.6rem); line-height: 1.2; color: var(--acxpa-ds-ink); }
.dir-welcome p { margin: 0 0 4px; }
.dir-welcome__meta { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-todo { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); }
.dir-todo--extras { background: var(--acxpa-ds-sand); }
.dir-todo__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--acxpa-ds-space-md); margin-bottom: var(--acxpa-ds-space-md); }
.dir-todo__head h2 { margin: 0 0 4px; font-size: var(--acxpa-ds-text-h4); }
.dir-todo__head p { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-todo__count { flex: none; padding: 6px 12px; border-radius: 999px; background: var(--acxpa-ds-gold-tint); font-size: var(--acxpa-ds-text-small); white-space: nowrap; }
.dir-todo__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-todo__list li { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); border: 1px solid var(--acxpa-ds-stone); background: var(--acxpa-ds-white); }
.dir-todo__list li.is-next { border: 2px solid var(--acxpa-ds-gold); background: #FFFCF4; }
.dir-todo__list li.is-done { background: var(--acxpa-ds-sand); }
.dir-todo__list li.is-done h3 { color: var(--acxpa-ds-slate); }
.dir-todo__no { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--acxpa-ds-teal-600); color: var(--acxpa-ds-teal-700); font-weight: 800; }
.dir-todo__list li.is-done .dir-todo__no { background: var(--acxpa-ds-success); border-color: var(--acxpa-ds-success); color: #fff; }
.dir-todo__list li.is-next .dir-todo__no { background: var(--acxpa-ds-gold); border-color: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); }
.dir-todo__no--opt { border-style: dashed; }
.dir-todo__txt { flex: 1; min-width: 0; }
.dir-todo__txt h3 { margin: 0 0 2px; font-size: 1rem; }
.dir-todo__txt p { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-todo__list .dir-btn { flex: none; white-space: nowrap; }
.dir-todo__edit { flex: none; font-size: var(--acxpa-ds-text-small); font-weight: 600; }
@media (max-width: 640px) { .dir-todo__list li { flex-wrap: wrap; } .dir-todo__list .dir-btn { margin-left: 48px; } .dir-todo__head { flex-direction: column; } }
/* Paid and free listings as two clearly different boxes (Justin, 8 Nov: "still needs better separation") */
.dir-shell__grp { margin: var(--acxpa-ds-space-sm) 8px 0; border-radius: var(--acxpa-ds-radius-md); overflow: hidden; }
.dir-shell__grp--paid { background: var(--acxpa-ds-white); border: 1px solid #C9D5EA; box-shadow: 0 1px 3px rgba(27, 47, 82, .08); }
.dir-shell__grp--free { background: transparent; border: 1px dashed var(--acxpa-ds-stone); }
.dir-shell__sub { display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 6px 10px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.dir-shell__grp--paid .dir-shell__sub { background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); }
.dir-shell__grp--free .dir-shell__sub { background: var(--acxpa-ds-sand); color: var(--acxpa-ds-slate); border-bottom: 1px dashed var(--acxpa-ds-stone); }
.dir-shell__sub b { min-width: 20px; padding: 0 6px; border-radius: 999px; text-align: center; font-size: 11px; }
.dir-shell__grp--paid .dir-shell__sub b { background: var(--acxpa-ds-white); color: var(--acxpa-ds-harbour-deep); }
.dir-shell__grp--free .dir-shell__sub b { background: var(--acxpa-ds-stone); color: var(--acxpa-ds-ink); }
.dir-shell__grp .dir-shell__parts { margin: 0; padding: 4px 0; }
.dir-shell__plan { display: block; width: max-content; margin-top: 2px; padding: 0 6px; border-radius: 6px; font-size: 10.5px; font-weight: 700; background: var(--acxpa-ds-teal-50); color: var(--acxpa-ds-teal-700); }
.dir-shell__plan--growth { background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); }
.dir-shell__plan--accelerator { background: var(--acxpa-ds-harbour); color: #fff; }
.dir-catpick fieldset { border: 0; padding: 0; margin: var(--acxpa-ds-space-lg) 0; }
.dir-catpick__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--acxpa-ds-space-sm); }
.dir-catpick__opt { display: flex; gap: 12px; align-items: flex-start; padding: var(--acxpa-ds-space-md); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); cursor: pointer; }
.dir-catpick__opt:hover { border-color: var(--acxpa-ds-teal-400); }
.dir-catpick__opt:has(input:checked) { border: 2px solid var(--acxpa-ds-teal-600); background: var(--acxpa-ds-teal-50); }
.dir-catpick__opt input { margin-top: 4px; accent-color: var(--acxpa-ds-teal-600); }
.dir-catpick__opt small { display: block; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
@media (max-width: 640px) { .dir-catpick__grid { grid-template-columns: 1fr; } }
.dir-shell__nav .dir-shell__sec--listings .dir-shell__grp .dir-shell__parts a { padding-left: 12px; }
.dir-shell__nav .dir-shell__sec--listings .dir-shell__grp--paid .dir-shell__parts li + li a { border-top: 1px solid var(--acxpa-ds-stone); }
/* Listing editor: one part at a time (Justin, 8 Nov) */
.dir-edit.is-guided .dir-step { transition: opacity .2s; }
.dir-edit.is-guided .dir-step.is-now { border: 2px solid var(--acxpa-ds-teal-600); box-shadow: 0 6px 18px rgba(21, 95, 110, .12); }
.dir-edit.is-guided .dir-step.is-done { padding-block: var(--acxpa-ds-space-md); background: var(--acxpa-ds-sand); cursor: pointer; }
.dir-edit.is-guided .dir-step.is-done .dir-step__head { margin-bottom: 0; align-items: center; }
.dir-edit.is-guided .dir-step.is-done .dir-step__num { background: var(--acxpa-ds-success); color: #fff; }
.dir-edit.is-guided .dir-step.is-later { opacity: .5; padding-block: var(--acxpa-ds-space-md); }
.dir-edit.is-guided .dir-step.is-later .dir-step__head { margin-bottom: 0; align-items: center; }
.dir-edit.is-guided .dir-step.is-later .dir-step__num { background: var(--acxpa-ds-stone); color: var(--acxpa-ds-slate); }
.dir-step__body[hidden], [data-intro][hidden], .dir-step__sum[hidden], .dir-edit__save[hidden] { display: none !important; }
.dir-step__head > div { flex: 1; min-width: 0; }
.dir-step__sum { margin: 2px 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-step__change { flex: none; border: 0; background: none; font: inherit; font-weight: 700; color: var(--acxpa-ds-teal-700); text-decoration: underline; cursor: pointer; }
.dir-step__go { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); flex-wrap: wrap; margin-top: var(--acxpa-ds-space-lg); padding-top: var(--acxpa-ds-space-md); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-step__hint { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-step__hint.is-err { color: var(--acxpa-ds-error); font-weight: 600; }
.dir-edit:not(.is-guided) .dir-step__go { display: none; }
.dir-opt.is-off { opacity: .45; }
.dir-caps__limit { margin: var(--acxpa-ds-space-sm) 0 0; padding: 8px 12px; border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-gold-tint); font-size: var(--acxpa-ds-text-small); }
.dir-caps__limit[hidden] { display: none; }
/* The listing's level, unmissable at the top */
/* Free listing: what upgrading changes, side by side */
.dir-up__intro p:not(.dir-eyebrow) { margin: 0; color: rgba(255, 255, 255, .85); }
@media (max-width: 720px) { .dir-up__cols { grid-template-columns: 1fr; } }
.dir-up .dir-eyebrow--gold { color: var(--acxpa-ds-gold); }
.dir-edit__save.is-ready { flex-wrap: wrap; padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-gold-tint); border: 2px solid var(--acxpa-ds-gold); }
/* ===== Supplier account, restructured (Justin, 8 Nov 2026): wizard to set up, calm home after ===== */
/* Status and plan labels, used everywhere */
.dir-badge { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; line-height: 1.6; }
.dir-badge::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.dir-badge--live { background: var(--acxpa-ds-success-tint); color: var(--acxpa-ds-success-deep); }
.dir-badge--draft { background: var(--acxpa-ds-stone); color: var(--acxpa-ds-ink); }
/* Being checked: waiting on our team, nothing for them to do, so calm blue rather than amber (Justin, 12 Nov). */
.dir-badge--checking { background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); }
.dir-badge--draft::before { background: transparent; border: 2px solid currentColor; width: 5px; height: 5px; }
.dir-badge--attention { background: var(--acxpa-ds-gold-tint); color: var(--acxpa-ds-gold-deep); }
.dir-badge--sm { padding: 0 8px; font-size: 10.5px; }
.dir-badge--dot { padding: 0; width: 18px; height: 18px; justify-content: center; font-size: 11px; }
.dir-badge--dot::before { display: none; }
.dir-plan { display: inline-block; padding: 2px 10px; border-radius: 6px; font-size: 12px; font-weight: 700; background: var(--acxpa-ds-sand); color: var(--acxpa-ds-slate); border: 1px solid var(--acxpa-ds-stone); }
.dir-plan--launch { background: var(--acxpa-ds-teal-50); color: var(--acxpa-ds-teal-700); border-color: var(--acxpa-ds-teal-100); }
.dir-plan--growth { background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); border-color: #C9D5EA; }
.dir-plan--accelerator { background: var(--acxpa-ds-harbour); color: #fff; border-color: var(--acxpa-ds-harbour); }
/* Paid plans carry a star; Accelerator's is gold, on harbour blue, so it never matches the dark headings (Justin, 9 Nov). */
.dir-plan--launch::before, .dir-plan--growth::before, .dir-plan--accelerator::before { content: "★"; margin-right: 4px; }
.dir-plan--accelerator::before { color: var(--acxpa-ds-gold); }
.dir-toast { margin: 0 0 var(--acxpa-ds-space-md); padding: 10px var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-success-tint); border-left: 4px solid var(--acxpa-ds-success); font-weight: 600; }
/* Sidebar: plain links */
.dir-shell__links { list-style: none; margin: 0; padding: 0; }
.dir-shell__links a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 7px 12px; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-ink); text-decoration: none; border-left: 3px solid transparent; }
.dir-shell__links a:hover { background: var(--acxpa-ds-white); }
.dir-shell__links a[aria-current] { border-left-color: var(--acxpa-ds-teal-600); background: var(--acxpa-ds-teal-50); font-weight: 700; }
.dir-shell__grp .dir-shell__links a { padding-left: 10px; }
.dir-shell__grp--paid .dir-shell__links li + li a { border-top: 1px solid var(--acxpa-ds-stone); }
/* Home */
.dir-home__head { margin-bottom: var(--acxpa-ds-space-md); }
.dir-home__head h1 { margin-bottom: 6px; }
.dir-home__state { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); flex-wrap: wrap; margin: 0; font-size: var(--acxpa-ds-text-small); }
/* "Your next step": something to do, so amber (Justin, 9 Nov: away from blue, which is the Accelerator badge's). */
.dir-next { margin: 0 0 var(--acxpa-ds-space-xl, 40px); padding: var(--acxpa-ds-space-lg) var(--acxpa-ds-space-xl, 32px); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-gold-tint); color: var(--acxpa-ds-ink); border: 1px solid var(--acxpa-ds-gold); }
.dir-next h2 { margin: 4px 0 8px; font-size: var(--acxpa-ds-text-h3, 1.6rem); color: var(--acxpa-ds-ink); }
.dir-next p { margin: 0 0 var(--acxpa-ds-space-md); color: var(--acxpa-ds-ink); }
.dir-next form { margin: 0; }
.dir-next__kicker { margin: 0 !important; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--acxpa-ds-gold-deep) !important; }
.dir-next--warn, .dir-next--calm { color: #fff; border-color: transparent; }
.dir-next--warn h2, .dir-next--calm h2 { color: #fff; }
.dir-next--warn p, .dir-next--calm p { color: rgba(255, 255, 255, .85); }
.dir-next--warn .dir-next__kicker, .dir-next--calm .dir-next__kicker { color: var(--acxpa-ds-gold) !important; }
.dir-next--warn { background: #5A2A10; }
.dir-next--calm { background: var(--acxpa-ds-teal-800); }
.dir-next--done { background: var(--acxpa-ds-success-tint); color: var(--acxpa-ds-ink); border-color: #BFE0D1; }
.dir-next--done h2 { color: var(--acxpa-ds-ink); }
.dir-next--done p { color: var(--acxpa-ds-slate); }
.dir-next--done .dir-next__kicker { color: var(--acxpa-ds-success-deep) !important; }
.dir-home__sec { margin-bottom: var(--acxpa-ds-space-xl, 40px); }
.dir-home__sechead { display: flex; justify-content: space-between; align-items: baseline; gap: var(--acxpa-ds-space-md); margin-bottom: var(--acxpa-ds-space-sm); }
.dir-home__sechead h2 { margin: 0; font-size: var(--acxpa-ds-text-h4); }
.dir-home__sechead a { font-weight: 700; font-size: var(--acxpa-ds-text-small); }
.dir-lrows { list-style: none; margin: 0; padding: 0; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); overflow: hidden; }
.dir-lrow { display: flex; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); }
.dir-lrow + .dir-lrow { border-top: 1px solid var(--acxpa-ds-stone); }
.dir-lrow__main strong { display: block; margin-bottom: 4px; }
.dir-lrow__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.dir-lrow__meta small { color: var(--acxpa-ds-slate); }
.dir-lrow__acts { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); flex: none; }
.dir-lrow__up { font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-home__nums { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--acxpa-ds-space-sm); }
@media (max-width: 760px) { .dir-home__nums { grid-template-columns: repeat(2, 1fr); } }
.dir-home__nums div { padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-home__nums strong { display: block; font-size: 1.8rem; line-height: 1.1; }
.dir-home__nums span { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
@media (max-width: 640px) { .dir-lrow { flex-direction: column; align-items: flex-start; } .dir-home__nums { grid-template-columns: 1fr; } }
/* Listing editor */
.dir-listing__chips { display: flex; gap: 8px; flex-wrap: wrap; margin: -4px 0 var(--acxpa-ds-space-sm); }
.dir-edit.is-plain .dir-step__go { display: none; }
.dir-edit.is-plain .dir-step + .dir-step { margin-top: var(--acxpa-ds-space-md); }
/* Setup wizard */
.dir-wiz { padding: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-2xl, 64px); background: var(--acxpa-ds-sand); }
.dir-wiz__wrap { max-width: 860px; }
.dir-wiz__top { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--acxpa-ds-space-md); margin-bottom: var(--acxpa-ds-space-sm); }
.dir-wiz__who { margin: 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-wiz__count { margin: 2px 0 0; font-weight: 700; }
.dir-wiz__exit { font-size: var(--acxpa-ds-text-small); font-weight: 600; white-space: nowrap; }
.dir-wiz__bar { list-style: none; display: flex; gap: 6px; margin: 0 0 var(--acxpa-ds-space-lg); padding: 0; }
.dir-wiz__bar li { flex: 1; height: 8px; border-radius: 4px; background: var(--acxpa-ds-stone); position: relative; }
.dir-wiz__bar li a { position: absolute; inset: -6px 0; }
.dir-wiz__bar li.is-done { background: var(--acxpa-ds-success); }
.dir-wiz__bar li.is-now { background: var(--acxpa-ds-gold); }
.dir-wiz__card { padding: var(--acxpa-ds-space-xl, 32px); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); box-shadow: 0 6px 24px rgba(27, 47, 82, .06); }
.dir-wiz__card .dir-edit { max-width: none; }
.dir-wiz__nav { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-lg); padding-top: var(--acxpa-ds-space-md); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-wiz__nav[hidden] { display: none; }
.dir-edit.is-wizard .dir-step.is-done, .dir-edit.is-wizard .dir-step.is-later { display: none; }
.dir-edit.is-wizard .dir-step.is-now { border: 0; box-shadow: none; padding: 0; }
.dir-edit.is-wizard .dir-step__go { justify-content: space-between; }
.dir-wiz__card .dir-edit__card { border: 0; padding: 0; }
/* Review and publish */
.dir-review__list { list-style: none; margin: var(--acxpa-ds-space-lg) 0; padding: 0; display: grid; gap: 8px; }
.dir-review__list li { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); padding: 12px var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); border: 1px solid var(--acxpa-ds-stone); }
.dir-review__list li > div { flex: 1; }
.dir-review__list small { display: block; color: var(--acxpa-ds-slate); }
.dir-review__list li.is-todo { background: var(--acxpa-ds-gold-tint); border-color: #F3D28E; }
.dir-review__mark { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-weight: 800; background: var(--acxpa-ds-success); color: #fff; }
.dir-review__list li.is-todo .dir-review__mark { background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); }
.dir-review__go { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); flex-wrap: wrap; }
.dir-review__go span { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-review__block { padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-gold-tint); }
.dir-btn--lg { padding: 16px 32px; font-size: 1.1rem; }
.dir-shell__lname { display: grid; gap: 3px; }
.dir-shell__lmeta { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.dir-shell__lmeta .dir-shell__plan { margin: 0; }
.dir-wiz__card .dir-edit__card > legend { display: none; }

/* Accelerator is navy, never amber: amber means 'needs attention' (Justin, 8 Nov). */
.dir-shell__needs { flex: none; font-size: 10.5px; font-weight: 700; color: var(--acxpa-ds-slate); }
/* Optional extras say what's there; only a real finish gets a green tick (Justin, 8 Nov) */
.dir-todo__sum { margin: 2px 0 4px !important; font-weight: 700; color: var(--acxpa-ds-ink) !important; }
.dir-todo__list li.is-attention { border-color: #F3D28E; background: var(--acxpa-ds-gold-tint); }
.dir-todo__list li.is-done .dir-todo__no--done { background: var(--acxpa-ds-success); border-color: var(--acxpa-ds-success); color: #fff; }
.dir-todo__no--attention { background: var(--acxpa-ds-gold); border-color: var(--acxpa-ds-gold) !important; color: var(--acxpa-ds-ink) !important; border-style: solid !important; }
.dir-todo__no--partial { border-style: solid !important; border-color: var(--acxpa-ds-slate) !important; color: var(--acxpa-ds-slate) !important; }

/* Profile: one page, a tab per category (Justin, 8 Nov) */
.dir-ptabs { display: flex; gap: 4px; flex-wrap: wrap; margin: 0 0 var(--acxpa-ds-space-md); padding: 4px; border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-ptabs a { padding: 10px 16px; border-radius: var(--acxpa-ds-radius-md); font-weight: 700; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-teal-800); text-decoration: none; }
.dir-ptabs a:hover { background: var(--acxpa-ds-teal-50); }
.dir-ptabs a[aria-current] { background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-povw { padding: var(--acxpa-ds-space-lg); background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); border: 1px solid var(--acxpa-ds-stone); }
.dir-povw__h { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-h4); }
.dir-povw__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-povw__item { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-sand); }
.dir-povw__item h3 { margin: 0 0 4px; font-size: 1rem; }
.dir-povw__headline { margin: 0 0 6px; color: var(--acxpa-ds-slate); }
.dir-povw__item .dir-btn { flex: none; }
.dir-placement .dir-prose + .dir-svc-body { margin-top: var(--acxpa-ds-space-md); }
@media (max-width: 640px) { .dir-povw__item { flex-direction: column; align-items: flex-start; } }

/* Listing editor, part F: the listing's own videos, photos and brochures (outside the listing form, so its uploads can post alone). */
.dir-step--after { margin-top: var(--acxpa-ds-space-lg); }
.dir-lm__block + .dir-lm__block, .dir-lm__block + [data-media-box] .dir-lm__block:first-of-type { margin-top: var(--acxpa-ds-space-lg); padding-top: var(--acxpa-ds-space-lg); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-lm__h { margin: 0 0 4px; font-size: 1.05rem; }
.dir-lm__add { display: grid; gap: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-md); justify-items: start; }
.dir-lm__add .dir-form__grid { width: 100%; padding: 0; }
.dir-lm__add label { display: grid; gap: 4px; min-width: 0; font-weight: 600; }
.dir-lm__add input[type=file] { max-width: 100%; }
.dir-lm__msg { margin: 0 0 var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-success-tint); color: var(--acxpa-ds-success-deep); font-weight: 600; }
.dir-lm__msg.is-err { background: var(--acxpa-ds-gold-tint); color: var(--acxpa-ds-ink); }
.dir-step--after + .dir-wiz__nav { margin-top: var(--acxpa-ds-space-lg); }

/* Listing editor: what a Free, Launch or Growth listing is missing out on (account/partials/listing-upsell). */
.dir-miss { margin-top: var(--acxpa-ds-space-2xl, 48px); padding: var(--acxpa-ds-space-xl, 32px) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-miss .dir-eyebrow { color: #C9D5EA; }
.dir-miss__h { margin: 0 0 var(--acxpa-ds-space-xs); color: #fff; font-size: var(--acxpa-ds-text-h3); }
.dir-miss__lead { margin: 0 0 4px; color: #E0E7F2; }
.dir-miss__grid { display: grid; gap: var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-lg); grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); align-items: stretch; }
.dir-miss__plan { display: flex; flex-direction: column; gap: var(--acxpa-ds-space-xs); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); color: var(--acxpa-ds-ink); }
.dir-miss__plan p { margin: 0; }
.dir-miss__price { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-miss__price strong { color: var(--acxpa-ds-ink); font-size: 1.15rem; }
.dir-miss__top { display: grid; gap: var(--acxpa-ds-space-md); }
.dir-miss__offer { display: grid; gap: var(--acxpa-ds-space-xs); align-content: start; }
.dir-miss__cta { display: grid; gap: 8px; align-content: start; }
.dir-miss__cta .dir-miss__example { margin: 0; }
.dir-miss__adds { margin: var(--acxpa-ds-space-md) 0 0 !important; padding-top: var(--acxpa-ds-space-md); border-top: 1px solid var(--acxpa-ds-stone); font-size: var(--acxpa-ds-text-caption); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--acxpa-ds-slate); }
.dir-miss__feats { flex: 1; margin: var(--acxpa-ds-space-xs) 0 0; padding: 0; list-style: none; display: grid; gap: var(--acxpa-ds-space-md); align-content: start; }
.dir-miss__feats li { display: flex; gap: 12px; align-items: flex-start; font-size: var(--acxpa-ds-text-small); }
.dir-miss__feats strong { display: block; font-weight: 700; line-height: 1.35; }
.dir-miss__feats small { display: block; margin-top: 2px; color: var(--acxpa-ds-slate); font-size: 13px; line-height: 1.5; }
.dir-miss__ico { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--acxpa-ds-teal-100); color: var(--acxpa-ds-teal-800); }
/* One plan to move up to: offer on the left, the button on the right, then the features in a balanced grid. */
.dir-miss__grid--1 .dir-miss__top { grid-template-columns: minmax(0, 1fr) 280px; align-items: start; }
.dir-miss__grid--1 .dir-miss__feats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--acxpa-ds-space-lg) var(--acxpa-ds-space-md); }
@media (max-width: 1100px) { .dir-miss__grid--1 .dir-miss__feats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .dir-miss__grid--1 .dir-miss__top, .dir-miss__grid--1 .dir-miss__feats { grid-template-columns: 1fr; } }
.dir-pay__feats { margin: var(--acxpa-ds-space-sm) 0 var(--acxpa-ds-space-lg); }
.dir-miss__more { margin: var(--acxpa-ds-space-md) 0 0; }
.dir-miss__more a { color: #fff; }
.dir-miss__price small { display: block; font-size: 12px; }
.dir-miss__why { margin: 4px 0 0; font-size: 1.05rem; color: var(--acxpa-ds-ink); }
.dir-miss__today { padding: 6px 10px; border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-teal-50); color: var(--acxpa-ds-teal-700); font-size: var(--acxpa-ds-text-small); font-weight: 600; }

/* What each feature means, under its name (Justin, 8 Nov: the bare feature names undersold them). */
.dir-compare__table tbody th strong { display: block; font-weight: 700; color: var(--acxpa-ds-ink); }
.dir-compare__why { display: block; margin-top: 2px; color: var(--acxpa-ds-slate); font-size: 13px; line-height: 1.45; }
.dir-compare__table tbody th { min-width: 260px; }

/* Example profiles (/for-suppliers/example/{level}): a banner with a plan switcher, and labels on what each plan adds.
   Not amber or gold: those mean "needs attention" in the account (Justin, 8 Nov). */
.dir-xbar { background: var(--acxpa-ds-harbour-deep); color: #fff; padding: var(--acxpa-ds-space-md) 0; }
.dir-xbar__inner { display: grid; grid-template-columns: 1fr auto; gap: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-lg); align-items: center; }
.dir-xbar__eyebrow { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #C9D5EA; }
.dir-xbar__text { margin: 4px 0 0; color: #E0E7F2; font-size: var(--acxpa-ds-text-small); }
.dir-xbar__switch { display: inline-flex; padding: 4px; border-radius: 999px; background: rgba(255,255,255,.1); gap: 2px; flex-wrap: wrap; }
.dir-xbar__switch a { padding: 6px 14px; border-radius: 999px; color: #fff; text-decoration: none; font-weight: 600; font-size: var(--acxpa-ds-text-small); }
.dir-xbar__switch a[aria-current] { background: #fff; color: var(--acxpa-ds-harbour-deep); }
.dir-xbar__switch a:not([aria-current]):hover { background: rgba(255,255,255,.15); }
.dir-xbar__back { grid-column: 1 / -1; color: #fff; font-size: var(--acxpa-ds-text-small); }
@media (max-width: 760px) { .dir-xbar__inner { grid-template-columns: 1fr; } }
.dir-xtag { display: inline-block; margin: 0 4px 4px 0; padding: 1px 8px; border: 1.5px dashed var(--acxpa-ds-harbour); border-radius: 6px; background: var(--acxpa-ds-white); color: var(--acxpa-ds-harbour-deep); font-size: 11.5px; font-weight: 700; letter-spacing: .01em; line-height: 1.6; vertical-align: middle; white-space: normal; text-transform: none; }
.dir-badges .dir-xtag { align-self: center; }
.dir-profile-head__actions .dir-xtag { display: block; width: fit-content; margin: 6px 0 4px; }
.dir-video--example .dir-video__play { cursor: default; }
.dir-level__example { display: block; margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-level--top .dir-level__example { color: #fff; }
.dir-miss__example { margin-bottom: 4px; font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-contact .dir-xtag { text-transform: none; letter-spacing: 0; margin-left: 4px; }
.dir-xnote { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }

/* Example profiles: each tab shows its plan as the usual plan chip, under the category name. */
.dir-ptabs a:has(.dir-ptabs__plan) { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.dir-ptabs__plan { font-size: 11px; padding: 1px 8px; }
.dir-ptabs a[aria-current] .dir-plan--accelerator { border-color: #fff; }
.dir-ptabs:has(.dir-ptabs__plan) a:not(:has(.dir-ptabs__plan)) { display: inline-flex; align-items: center; }

/* Billing page (account/billing) and its confirm page (account/billing-change). */
.dir-bill__line { margin: 6px 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-bill__row--failed { border-left-color: var(--acxpa-ds-gold); }
.dir-bill__row--cancelling { border-left-color: var(--acxpa-ds-stone); }
.dir-bill__cancel { color: var(--acxpa-ds-slate); }
.dir-bill__fine { margin: var(--acxpa-ds-space-sm) 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-bill__empty { padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); }
.dir-bill__empty p { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-bill__card { display: flex; justify-content: space-between; align-items: center; gap: var(--acxpa-ds-space-lg); flex-wrap: wrap; padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-bill__dl { display: grid; gap: 6px; margin: 0; }
.dir-bill__dl div { display: flex; gap: var(--acxpa-ds-space-sm); flex-wrap: wrap; }
.dir-bill__dl dt { min-width: 150px; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-bill__dl dd { margin: 0; font-weight: 600; }
.dir-bill__safe { margin: 6px 0 0; font-size: 12px; color: var(--acxpa-ds-slate); }
.dir-bill__scroll { overflow-x: auto; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); }
.dir-bill__table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: var(--acxpa-ds-text-small); }
.dir-bill__table th, .dir-bill__table td { padding: 12px var(--acxpa-ds-space-md); text-align: left; border-bottom: 1px solid var(--acxpa-ds-stone); vertical-align: top; }
.dir-bill__table tbody tr:last-child td { border-bottom: 0; }
.dir-bill__table thead th { background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); }
.dir-bill__table small { display: block; color: var(--acxpa-ds-slate); font-size: 12px; }
.dir-bill__dl-links a { display: block; font-weight: 600; }
/* What a listing would lose (cancel / move down): a white card on the sand page, the upgrade card's icon list in
   muted grey tiles, two across (Justin, 10 Nov: the points had no styling). */
.dir-bill__lose { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-bill__lose h2 { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-h4); }
.dir-bill__lose-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--acxpa-ds-space-lg) var(--acxpa-ds-space-lg); margin: 0; }
.dir-bill__lose-list .dir-miss__ico { background: var(--acxpa-ds-cloud); color: var(--acxpa-ds-slate); }
.dir-plan-next { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; border: 1px dashed var(--acxpa-ds-slate); background: var(--acxpa-ds-white); color: var(--acxpa-ds-ink); font-size: 12px; font-weight: 700; white-space: nowrap; line-height: 1.5; }
.dir-shell__lmeta .dir-plan-next { padding: 0 6px; font-size: 10.5px; }
.dir-level__flag--next { background: var(--acxpa-ds-white); color: var(--acxpa-ds-ink); border: 1px dashed var(--acxpa-ds-slate); }
/* Billing's two pages as a clear switch (Justin, 11 Nov: "the tabs don't even look like tabs"): a white track with two
   buttons, the current one filled teal, each with an icon. */
.dir-btabs { display: inline-flex; gap: 4px; margin: 0 0 var(--acxpa-ds-space-xl); padding: 5px; border-radius: 14px; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); box-shadow: 0 1px 2px rgba(20, 37, 42, .06); }
.dir-btabs a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 10px; color: var(--acxpa-ds-ink); font-weight: 700; text-decoration: none; }
.dir-btabs a:hover { background: var(--acxpa-ds-teal-50); }
.dir-btabs a[aria-current="page"] { background: var(--acxpa-ds-teal-700); color: #fff; }
.dir-btabs .dir-ico { flex: none; }
@media (max-width: 560px) { .dir-btabs { display: flex; } .dir-btabs a { flex: 1; justify-content: center; padding: 10px; font-size: var(--acxpa-ds-text-small); } }
.dir-form__addr { margin: 0; padding: 0; border: 0; display: grid; gap: 8px; min-width: 0; }
.dir-form__addr legend { padding: 0; margin-bottom: 6px; font-weight: 700; font-size: var(--acxpa-ds-text-small); }
.dir-form__addr-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr); gap: 8px; }
/* Address lookup suggestions under the street field (13 Nov). */
.dir-addr { position: relative; }
.dir-addr__list { position: absolute; z-index: 20; left: 0; right: 0; top: 100%; margin: 4px 0 0; padding: 4px 0; list-style: none; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); box-shadow: 0 8px 24px rgba(20, 37, 42, .12); }
.dir-addr__opt { display: flex; flex-wrap: wrap; gap: 0 8px; padding: 8px 12px; cursor: pointer; font-size: var(--acxpa-ds-text-small); }
.dir-addr__opt span { color: var(--acxpa-ds-slate); }
.dir-addr__opt:hover, .dir-addr__opt.is-active { background: var(--acxpa-ds-harbour-tint, #EAF3F6); }
.dir-addr__by { padding: 4px 12px 2px; text-align: right; font-size: 11px; color: var(--acxpa-ds-slate); }
.dir-form__addr-row span { font-size: 12.5px; }
@media (max-width: 560px) { .dir-form__addr-row { grid-template-columns: 1fr 1fr; } .dir-form__addr-row label:first-child { grid-column: 1 / -1; } }
.dir-bill__missing { color: var(--acxpa-ds-warning-deep); font-weight: 600; }
.dir-bill__box { padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-bill__details { margin-top: var(--acxpa-ds-space-md); padding-top: var(--acxpa-ds-space-md); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-bill__cc { display: flex; align-items: center; gap: 14px; }
.dir-bill__cc strong { display: block; font-size: 1.05rem; }
.dir-bill__cc small { color: var(--acxpa-ds-slate); }
.dir-bill__ccicon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); }
.dir-bill__details summary { cursor: pointer; font-weight: 700; color: var(--acxpa-ds-teal-700); }
.dir-bill__details[open] summary { margin-bottom: var(--acxpa-ds-space-md); }
.dir-bill__details .dir-form { max-width: 560px; display: grid; gap: var(--acxpa-ds-space-md); }
.dir-bill__details .dir-form .dir-btn { justify-self: start; }
@media (max-width: 700px) { .dir-bill__lose-list { grid-template-columns: 1fr; } }
.dir-bill__fine + .dir-bill__fine { margin-top: 2px; }
@media (max-width: 640px) {
    .dir-bill__table { min-width: 0; }
    .dir-bill__table thead { display: none; }
    .dir-bill__table tr { display: block; padding: 12px var(--acxpa-ds-space-md); border-bottom: 1px solid var(--acxpa-ds-stone); }
    .dir-bill__table tbody tr:last-child { border-bottom: 0; }
    .dir-bill__table td { display: block; padding: 2px 0; border: 0; }
    .dir-bill__table td:first-child { color: var(--acxpa-ds-slate); font-size: 12px; }
    .dir-bill__dl-links a { display: inline-block; margin-right: 12px; }
}

/* Admin: numbers at a glance and the activity log. Varied surfaces, not all teal (Justin's standing rule). */
.dir-num__tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); margin: var(--acxpa-ds-space-lg) 0; }
.dir-num__tile { padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-num__tile span { display: block; font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-slate); }
.dir-num__tile strong { display: block; margin: 6px 0; font-size: 2rem; line-height: 1.1; color: var(--acxpa-ds-ink); }
.dir-num__tile small { display: block; font-size: 12.5px; color: var(--acxpa-ds-slate); line-height: 1.45; }
.dir-num__tile--navy { background: var(--acxpa-ds-harbour-deep); border-color: transparent; }
.dir-num__tile--navy span, .dir-num__tile--navy small { color: #C9D5EA; }
.dir-num__tile--navy strong { color: #fff; }
.dir-num__tile--sand { background: var(--acxpa-ds-sand); }
.dir-num__tile--blue { background: var(--acxpa-ds-harbour-tint); border-color: transparent; }
.dir-num__grid { display: grid; grid-template-columns: 3fr 2fr; gap: var(--acxpa-ds-space-md); }
.dir-num__grid .dir-admin__panel { margin: 0 0 var(--acxpa-ds-space-md); }
.dir-num__table { width: 100%; border-collapse: collapse; font-size: var(--acxpa-ds-text-small); }
.dir-num__table th, .dir-num__table td { padding: 10px 8px; border-bottom: 1px solid var(--acxpa-ds-stone); text-align: left; }
.dir-num__table thead th { color: var(--acxpa-ds-slate); font-weight: 600; }
.dir-num__dl { margin: 0; display: grid; gap: 0; }
.dir-num__dl div { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--acxpa-ds-stone); }
.dir-num__dl dt { color: var(--acxpa-ds-slate); }
.dir-num__dl dd { margin: 0; font-weight: 700; }
@media (max-width: 900px) { .dir-num__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dir-num__grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .dir-num__tiles { grid-template-columns: 1fr; } }
.dir-act { list-style: none; margin: var(--acxpa-ds-space-md) 0; padding: 0; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); overflow: hidden; }
.dir-act__row { display: grid; grid-template-columns: 120px 1fr auto; gap: var(--acxpa-ds-space-md); align-items: start; padding: 12px var(--acxpa-ds-space-md); border-left: 4px solid var(--acxpa-ds-stone); }
.dir-act__row + .dir-act__row { border-top: 1px solid var(--acxpa-ds-stone); }
.dir-act__row--payment { border-left-color: var(--acxpa-ds-success); }
.dir-act__row--plan { border-left-color: var(--acxpa-ds-harbour); }
.dir-act__row--decision { border-left-color: var(--acxpa-ds-teal-600); }
.dir-act__row--email { border-left-color: #C9D5EA; }
.dir-act time { font-size: 12.5px; color: var(--acxpa-ds-slate); padding-top: 2px; }
.dir-act__what { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.dir-act__meta { margin: 2px 0 0; font-size: 12.5px; color: var(--acxpa-ds-slate); }
.dir-act__kind { font-size: 11.5px; font-weight: 700; color: var(--acxpa-ds-slate); white-space: nowrap; }
@media (max-width: 640px) { .dir-act__row { grid-template-columns: 1fr; gap: 2px; } .dir-act__kind { display: none; } }
.dir-bill__lose-note { margin: var(--acxpa-ds-space-md) 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-ink); font-weight: 600; }

/* The company at the top of the account sidebar (Justin, 10 Nov: the second top bar is gone; Dashboard, Stats and
   Billing are in the main menu). */
.dir-shell__co { display: flex; align-items: center; gap: 10px; margin: 8px 12px 2px; }
.dir-shell__co img { width: 44px; height: 44px; flex: none; object-fit: contain; background: #fff; border-radius: var(--acxpa-ds-radius-md); padding: 3px; border: 1px solid var(--acxpa-ds-stone); }
.dir-shell__co strong { display: block; line-height: 1.25; margin-bottom: 3px; font-size: var(--acxpa-ds-text-body); }
.dir-shell__nav .dir-shell__pub { display: inline-block; padding: 0; border: 0; margin: 8px 0 10px; background: none; text-decoration: underline; text-underline-offset: 3px; font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-teal-700); }
.dir-shell__co + .dir-shell__pub + .dir-shell__group, .dir-shell__co + .dir-shell__group { padding-top: 10px; border-top: 1px solid var(--acxpa-ds-stone); margin-top: 6px; }
.dir-shell__me { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: var(--acxpa-ds-space-sm) 14px 4px; font-size: var(--acxpa-ds-text-small); }
.dir-shell__nav .dir-shell__me a { display: inline; padding: 0; border: 0; color: var(--acxpa-ds-teal-700); text-decoration: underline; font-weight: 500; }
.dir-shell__mco { display: none; }
.dir-nav .dir-nav__menu-only { display: none; }
@media (max-width: 900px) {
    .dir-shell__co, .dir-shell__nav .dir-shell__pub, .dir-shell__nav .dir-shell__me { display: none; }
    .dir-shell__mco { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--acxpa-ds-space-sm); }
    .dir-shell__mco img { width: 36px; height: 36px; object-fit: contain; background: #fff; border-radius: var(--acxpa-ds-radius-md); padding: 2px; border: 1px solid var(--acxpa-ds-stone); }
}
.dir-nav a[aria-current="page"] { color: var(--acxpa-ds-teal-700); font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.dir-acct--home { padding-top: var(--acxpa-ds-space-lg); }

/* Billing: each plan with a days box on the right (Justin, 9 Nov). Amber under 30 days and red under 7, only when the
   listing ends unless the supplier acts; a plan that renews by itself stays calm. */
.dir-plist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-plist__row { display: flex; justify-content: space-between; align-items: stretch; gap: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-plist__main { min-width: 0; flex: 1; }
/* A cancelled plan steps back (Justin, 11 Nov: "a soft shading"): cool grey, dashed edge, text softened; the Renew
   button stays at full strength so undoing it is obvious. */
.dir-plist__row--cancelling { background: var(--acxpa-ds-cloud); border-style: dashed; border-color: var(--acxpa-ds-slate); }
.dir-plist__row--cancelling .dir-plist__name strong, .dir-plist__row--cancelling .dir-bill__line { color: var(--acxpa-ds-slate); }
.dir-plist__row--cancelling .dir-plan { opacity: .75; }
.dir-plist__name { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; }
.dir-plist__name strong { font-size: 1.05rem; margin-right: 4px; }
.dir-plist__acts { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); flex-wrap: wrap; margin: var(--acxpa-ds-space-sm) 0 0; }
.dir-plist__acts form { margin: 0; }
.dir-plist__link { font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-days { flex: none; width: 112px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-sm); }
.dir-days strong { font-size: 2rem; line-height: 1; }
.dir-days span { margin-top: 4px; font-size: 12px; font-weight: 600; line-height: 1.25; }
/* Calm: white with a border inside the card, the number in the plan's colour (colour option A, Justin 11 Nov). */
.dir-days--calm { background: var(--acxpa-ds-white); color: var(--acxpa-ds-ink); border: 2px solid var(--acxpa-ds-stone); }
.is-plan-launch .dir-days--calm strong { color: var(--acxpa-ds-teal-700); }
.is-plan-growth .dir-days--calm strong, .is-plan-accelerator .dir-days--calm strong, .is-plan-featured .dir-days--calm strong { color: var(--acxpa-ds-harbour-deep); }
.dir-days--amber { background: var(--acxpa-ds-gold-tint); color: var(--acxpa-ds-gold-deep); border: 1px solid var(--acxpa-ds-gold); }
.dir-days--red { background: var(--acxpa-ds-error-tint); color: var(--acxpa-ds-error-deep); border: 1px solid var(--acxpa-ds-error); }
@media (max-width: 640px) { .dir-plist__row { flex-direction: column-reverse; gap: var(--acxpa-ds-space-sm); } .dir-days { width: auto; flex-direction: row; gap: 8px; justify-content: flex-start; } .dir-days strong { font-size: 1.4rem; } .dir-days span { margin: 0; } }

/* Home: an unsold featured spot invites suppliers to take it (Justin, 9 Nov). */
.dir-feat__card--open { align-items: center; justify-content: center; text-align: center; gap: 6px; background: var(--acxpa-ds-sand); border: 2px dashed var(--acxpa-ds-stone); box-shadow: none; }
.dir-feat__openmark { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--acxpa-ds-white); color: var(--acxpa-ds-harbour); font-size: 30px; font-weight: 700; border: 1px solid var(--acxpa-ds-stone); }
.dir-feat__card--open .dir-btn { margin-top: 6px; }
.dir-sup-feat { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--acxpa-ds-space-xl); align-items: center; }
.dir-sup-feat p { margin: 0 0 var(--acxpa-ds-space-sm); }
.dir-sup-feat__box { display: grid; gap: 6px; justify-items: center; text-align: center; padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-sup-feat__box strong { font-size: 2.2rem; line-height: 1; color: var(--acxpa-ds-harbour-deep); }
.dir-sup-feat__box span { color: var(--acxpa-ds-slate); font-weight: 600; margin-bottom: 8px; }
.dir-sup-feat__ex { font-size: var(--acxpa-ds-text-small); font-weight: 600; }
@media (max-width: 760px) { .dir-sup-feat { grid-template-columns: 1fr; } }
/* An add-on to buy, so a different surface from the listings above it (Justin, 13 Nov). */
.dir-feat-buy { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: var(--acxpa-ds-space-lg); align-items: center; padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); border: 1px solid #C9D5EA; }
.dir-feat-buy p { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-feat-buy__h { font-weight: 700; font-size: 1.05rem; }
.dir-feat-buy__box { display: grid; gap: 6px; justify-items: center; text-align: center; padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); border: 1px solid #C9D5EA; }
.dir-feat-buy__box strong { font-size: 1.8rem; line-height: 1; color: var(--acxpa-ds-harbour-deep); }
.dir-feat-buy__box span { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); font-weight: 600; }
.dir-feat-buy__box form { width: 100%; }
.dir-feat-buy__note { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); margin: 0; }
@media (max-width: 640px) { .dir-feat-buy { grid-template-columns: 1fr; } }
.dir-admin__price { display: grid; gap: var(--acxpa-ds-space-sm); justify-items: start; max-width: 420px; }
.dir-admin__money { display: flex; align-items: center; gap: 6px; font-weight: 700; }
.dir-admin__money input { width: 160px; }


/* Stats: how often buyers saw the supplier, and where (Justin, 9 Nov: profile views alone undersell the exposure). */
.dir-seen { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: var(--acxpa-ds-space-md) var(--acxpa-ds-space-xl); align-items: center; margin: var(--acxpa-ds-space-md) 0; padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); }
.dir-seen__label { margin: 0; font-weight: 700; color: var(--acxpa-ds-harbour-deep); }
.dir-seen__num strong { display: block; margin: 4px 0; font-size: 3rem; line-height: 1; color: var(--acxpa-ds-harbour-deep); }
.dir-seen__where { margin: 0; display: grid; gap: 0; background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-md); padding: 4px var(--acxpa-ds-space-md); }
.dir-seen__where div { display: flex; justify-content: space-between; gap: var(--acxpa-ds-space-md); padding: 8px 0; border-bottom: 1px solid var(--acxpa-ds-stone); font-size: var(--acxpa-ds-text-small); }
.dir-seen__where div:last-child { border-bottom: 0; }
.dir-seen__where dt { color: var(--acxpa-ds-slate); }
.dir-seen__where dd { margin: 0; font-weight: 700; }
.dir-seen__note { grid-column: 1 / -1; margin: 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-harbour-deep); }
@media (max-width: 760px) { .dir-seen { grid-template-columns: 1fr; } }

/* Colour option A (Justin, 11 Nov: "Go with A"): every paid listing carries its plan's colour as a thick left edge, on
   Billing, the Dashboard and the sidebar, so the level reads at a glance.
   Launch teal, Growth mid blue, Accelerator deep blue (the badge's harbour), featured spot deep teal. Section headings stay
   plain (Justin, 12 Nov: a marker on them read like another listing edge). */
:root { --dir-plan-launch: var(--acxpa-ds-teal-400); --dir-plan-growth: #6F86B5; --dir-plan-accelerator: var(--acxpa-ds-harbour); --dir-plan-featured: var(--acxpa-ds-teal-700); }
.dir-plist__row.is-plan-launch, .dir-lrow.is-plan-launch { border-left: 6px solid var(--dir-plan-launch); }
.dir-plist__row.is-plan-growth, .dir-lrow.is-plan-growth { border-left: 6px solid var(--dir-plan-growth); }
.dir-plist__row.is-plan-accelerator, .dir-lrow.is-plan-accelerator { border-left: 6px solid var(--dir-plan-accelerator); }
.dir-plist__row.is-plan-featured { border-left: 6px solid var(--dir-plan-featured); }
.dir-plist__row--cancelling[class*="is-plan-"] { border-left-style: solid; opacity: 1; }
.dir-lrow.is-plan-free { border-left: 6px solid transparent; }
.dir-shell__grp--paid li.is-plan-launch > a { box-shadow: inset 4px 0 0 var(--dir-plan-launch); }
.dir-shell__grp--paid li.is-plan-growth > a { box-shadow: inset 4px 0 0 var(--dir-plan-growth); }
.dir-shell__grp--paid li.is-plan-accelerator > a { box-shadow: inset 4px 0 0 var(--dir-plan-accelerator); }
.dir-shell__grp--paid li[class*="is-plan-"] > a[aria-current="page"] { box-shadow: none; }

/* Featured spot sales page (Justin, 11 Nov): benefits, a live preview of their card among the others, choose the listing, then pay. */
.dir-fsale { display: grid; gap: var(--acxpa-ds-space-xl); }
.dir-fsale__why, .dir-fsale__preview { padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-fsale__points { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--acxpa-ds-space-lg) var(--acxpa-ds-space-md); }
@media (max-width: 1000px) { .dir-fsale__points { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .dir-fsale__points { grid-template-columns: 1fr; } }
.dir-fsale__pick { display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-sm); margin-bottom: var(--acxpa-ds-space-md); }
.dir-fsale__opt { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border: 2px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); cursor: pointer; min-width: 240px; flex: 1; background: #fff; }
.dir-fsale__opt:has(input:checked) { border-color: var(--acxpa-ds-teal-600); background: var(--acxpa-ds-teal-50); }
.dir-fsale__opt input { margin-top: 4px; accent-color: var(--acxpa-ds-teal-700); }
.dir-fsale__opt strong { display: block; }
.dir-fsale__opt small { display: block; color: var(--acxpa-ds-slate); font-size: 12.5px; }
.dir-fsale__stage { padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-sand); border: 1px dashed var(--acxpa-ds-stone); }
.dir-fsale__stage-h { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-caption); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--acxpa-ds-slate); }
.dir-fsale__other { opacity: .55; }
.dir-fsale__tip { margin: var(--acxpa-ds-space-md) 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-fsale__buy { display: flex; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-lg); flex-wrap: wrap; padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); border: 1px solid #C9D5EA; border-left: 6px solid var(--acxpa-ds-harbour); }
.dir-fsale__buy strong { display: block; font-size: 1.5rem; color: var(--acxpa-ds-ink); }
.dir-fsale__buy strong small { font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-slate); margin-left: 4px; }
.dir-fsale__buy span { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-feat > li[hidden] { display: none; }
.dir-fsale .dir-dash__h2 { margin-top: 0; margin-bottom: var(--acxpa-ds-space-md); }

/* "Show more suppliers" under category lists (Justin, 12 Nov), replacing Previous/Next for people with JavaScript. */
.dir-more { display: grid; justify-items: center; gap: var(--acxpa-ds-space-sm); margin-top: var(--acxpa-ds-space-lg); }
.dir-more__count { margin: 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-more .dir-btn { min-width: 240px; }
.dir-pager[hidden], .dir-more[hidden] { display: none; }

/* Stats for free suppliers (Justin, 12 Nov): where they sit in each list, and the paid detail as a locked preview. */
.dir-dash__tiles--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dir-dash__tiles--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 640px) { .dir-dash__tiles--3, .dir-dash__tiles--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dir-pos { margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); }
.dir-pos__h { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-h4); }
.dir-pos__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-pos__list li { display: flex; align-items: center; gap: var(--acxpa-ds-space-md); }
.dir-pos__list li + li { padding-top: var(--acxpa-ds-space-sm); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-pos__list div { flex: 1; min-width: 0; }
.dir-pos__page { margin-left: 8px; padding: 1px 8px; border-radius: 999px; background: var(--acxpa-ds-warning-tint); color: var(--acxpa-ds-warning-deep); font-size: 12px; font-weight: 700; }
.dir-pos__list p { margin: 2px 0 0; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-pos__rank { flex: none; display: grid; justify-items: center; width: 72px; padding: 8px 0; border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-sand); border: 1px solid var(--acxpa-ds-stone); }
.dir-pos__rank b { font-size: 1.5rem; line-height: 1; color: var(--acxpa-ds-ink); }
.dir-pos__rank small { font-size: 11.5px; color: var(--acxpa-ds-slate); font-weight: 600; }
@media (max-width: 640px) { .dir-pos__list li { flex-wrap: wrap; } }
.dir-dash__posline { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-locked { position: relative; border-radius: var(--acxpa-ds-radius-md); overflow: hidden; min-height: 150px; }
.dir-locked__ghost { filter: blur(3px); opacity: .9; padding: var(--acxpa-ds-space-md); }
.dir-locked__ghost--bars { display: flex; align-items: flex-end; gap: 8px; height: 170px; }
.dir-locked__ghost--bars span { flex: 1; border-radius: 4px 4px 0 0; background: var(--acxpa-ds-teal-400); }
.dir-locked__ghost--rows, .dir-locked__ghost--tiles { display: grid; gap: 10px; }
.dir-locked__ghost--tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dir-locked__ghost span { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px; border-radius: 8px; background: var(--acxpa-ds-cloud); }
.dir-locked__ghost--tiles span { flex-direction: column; align-items: flex-start; height: 70px; }
.dir-locked__ghost i { display: block; width: 55%; height: 10px; border-radius: 5px; background: var(--acxpa-ds-teal-300); }
.dir-locked__ghost b { display: block; width: 18%; min-width: 28px; height: 14px; border-radius: 5px; background: var(--acxpa-ds-teal-400); }
.dir-locked__card { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: var(--acxpa-ds-space-md); text-align: center; background: rgba(255, 255, 255, .4); }
.dir-locked__icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--acxpa-ds-white); color: var(--acxpa-ds-teal-700); border: 1px solid var(--acxpa-ds-stone); }
.dir-locked__h { margin: 4px 0 0; font-weight: 700; color: var(--acxpa-ds-ink); }
.dir-locked__why { margin: 0 0 6px; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-seen .dir-locked { background: var(--acxpa-ds-white); }
.dir-pw__change { margin: var(--acxpa-ds-space-md) 0; padding: var(--acxpa-ds-space-md); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); }
.dir-pw__change summary { cursor: pointer; font-weight: 700; color: var(--acxpa-ds-teal-700); }
.dir-pw__change[open] summary { margin-bottom: var(--acxpa-ds-space-md); }

/* Email not on the website's domain (Justin, 12 Nov): needs their attention, so amber, on the white form card. */
.dir-mismatch { background: var(--acxpa-ds-gold-tint); border: 1px solid var(--acxpa-ds-gold); border-left: 4px solid var(--acxpa-ds-gold); border-radius: var(--acxpa-ds-radius-md); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); }
.dir-mismatch[hidden] { display: none; }
.dir-mismatch > p { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); line-height: 1.5; }
.dir-mismatch .dir-mismatch__h { font-weight: 700; font-size: var(--acxpa-ds-text-body); color: var(--acxpa-ds-ink); }
.dir-mismatch__opts { margin: 0 0 var(--acxpa-ds-space-md); padding-left: 1.2em; font-size: var(--acxpa-ds-text-small); line-height: 1.5; }
.dir-mismatch__opts li + li { margin-top: 4px; }
.dir-mismatch textarea { background: var(--acxpa-ds-white); }

/* Rejecting a claim: why, then the message to them (Justin, 12 Nov). */
.dir-reject { display: grid; gap: var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-lg); padding-top: var(--acxpa-ds-space-lg); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-reject__msg[hidden] { display: none; }
.dir-reject__msg textarea { width: 100%; line-height: 1.5; }
.dir-reject .dir-btn { justify-self: start; }
.dir-reject .dir-form__small { margin: 0; }

/* "Free listings show one specialty": a plan limit they shouldn't miss (Justin, 12 Nov). Info, not a warning, so not amber. */
.dir-limit { display: flex; gap: 10px; align-items: flex-start; margin: var(--acxpa-ds-space-sm) 0 0; padding: 10px 14px; background: var(--acxpa-ds-harbour-tint); border: 1px solid #C9D5EA; border-radius: var(--acxpa-ds-radius-md); font-size: var(--acxpa-ds-text-small); line-height: 1.5; color: var(--acxpa-ds-ink); }
.dir-limit .dir-ico { flex: 0 0 auto; margin-top: 2px; color: var(--acxpa-ds-harbour); }
.dir-limit a { white-space: nowrap; }
/* What the team asked, quoted on the dark "update" panel (Justin, 12 Nov: the note had been the heading). */
.dir-next__ask { margin: var(--acxpa-ds-space-sm) 0; padding: 12px 16px; background: rgba(255, 255, 255, .1); border-left: 3px solid var(--acxpa-ds-gold); border-radius: var(--acxpa-ds-radius-md); color: #fff; font-size: var(--acxpa-ds-text-body); line-height: 1.55; }

/* Admin: one supplier's history (Justin, 12 Nov). */
.dir-hist__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--acxpa-ds-space-md); flex-wrap: wrap; margin-bottom: var(--acxpa-ds-space-md); }
.dir-hist__head .dir-acct__h { margin-bottom: 6px; }
.dir-hist__acts { display: flex; gap: var(--acxpa-ds-space-xs); flex-wrap: wrap; }
.dir-hist__waiting { margin: 0 0 var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg); background: var(--acxpa-ds-gold-tint); border: 1px solid var(--acxpa-ds-gold); border-left: 4px solid var(--acxpa-ds-gold); border-radius: var(--acxpa-ds-radius-md); }
.dir-hist__waiting p { margin: 6px 0 0; }
.dir-hist__card { margin: 0 0 var(--acxpa-ds-space-xl); padding: var(--acxpa-ds-space-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); }
.dir-hist__claims { list-style: none; margin: 0 0 var(--acxpa-ds-space-xl); padding: 0; background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-lg); }
.dir-hist__claims li { padding: 12px var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); }
.dir-hist__claims li + li { border-top: 1px solid var(--acxpa-ds-stone); }
.dir-hist__claims small { display: block; margin-top: 2px; color: var(--acxpa-ds-slate); }
.dir-hist__note { margin: 8px 0 0; padding: 10px 14px; background: var(--acxpa-ds-cloud); border-left: 3px solid var(--acxpa-ds-teal-600); border-radius: var(--acxpa-ds-radius-sm, 4px); font-size: var(--acxpa-ds-text-small); line-height: 1.55; }
.dir-hist__mail { margin-top: 8px; }
.dir-hist__mail summary { cursor: pointer; font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-teal-700, #155F6E); }
.dir-hist__mail iframe { display: block; width: 100%; max-width: 720px; height: 620px; margin-top: 8px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: #fff; }

/* "Show prices in" and the approximate amounts (the plan cards show their currency as the big number) (Justin, 12 Nov: display only). */
.dir-cur { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: var(--acxpa-ds-space-sm) 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); }
.dir-cur label { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.dir-cur select { padding: 6px 10px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); font: inherit; font-weight: 400; }
.dir-cur__note { color: var(--acxpa-ds-slate); }
.dir-pay__fx { margin: 8px 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }

/* Industry bodies (Justin, 12-13 Nov): country filter, logos and where they work. */
.dir-ibf__count { margin: 0; font-weight: 700; }
.dir-ibf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-lg); margin-bottom: var(--acxpa-ds-space-md); }
.dir-ibf__country { display: inline-flex; align-items: center; gap: 8px; font-size: var(--acxpa-ds-text-small); font-weight: 600; }
.dir-ibf__country select { padding: 8px 12px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); font: inherit; font-weight: 400; min-width: 220px; }
.dir-ibf__note { margin: 0 0 var(--acxpa-ds-space-md); font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
.dir-body__meta { margin: 0 0 var(--acxpa-ds-space-sm) !important; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-body__name { margin-bottom: 4px !important; }
/* The industry body form. */
.dir-form__set { border: 0; margin: 0 0 var(--acxpa-ds-space-lg); padding: 0; }
.dir-form__set > legend { margin-bottom: var(--acxpa-ds-space-sm); font-weight: 700; font-size: var(--acxpa-ds-text-h4); }
.dir-form__count { display: block; margin-top: 4px; color: var(--acxpa-ds-slate); font-weight: 400; }
.dir-form__count.is-over { color: var(--acxpa-ds-error); font-weight: 700; }
.dir-review__logo { max-height: 72px; max-width: 220px; padding: 8px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: #fff; }
/* ACXPA first on the industry bodies page (Justin, 12 Nov): navy, so it stands apart from the white cards. */
.dir-body-home { display: flex; align-items: center; gap: var(--acxpa-ds-space-xl); margin-bottom: var(--acxpa-ds-space-xl); padding: var(--acxpa-ds-space-xl); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-deep); color: #fff; }
.dir-body-home__logo { flex: 0 0 220px; display: grid; place-items: center; height: 110px; padding: 18px 20px; border-radius: var(--acxpa-ds-radius-lg); background: #fff; }
.dir-body-home__logo img { width: 100%; height: auto; }
.dir-body-home__text { flex: 1; }
.dir-body-home__text p { margin: 0 0 var(--acxpa-ds-space-xs); color: rgba(255, 255, 255, .88); }
.dir-body-home__kicker { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--acxpa-ds-gold) !important; }
.dir-body-home__name { margin: 0 0 6px; font-size: var(--acxpa-ds-text-h2); color: #fff; }
.dir-body-home__meta { display: flex; align-items: center; gap: 8px; }
.dir-body-home .dir-btn { flex: 0 0 auto; }
.dir-bodies__intro { margin-bottom: var(--acxpa-ds-space-md); }
.dir-bodies__intro h2 { margin: 0 0 6px; font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-teal-800); }
.dir-bodies__intro p { margin: 0; }
@media (max-width: 800px) { .dir-body-home { flex-direction: column; align-items: flex-start; } .dir-body-home__logo { flex-basis: auto; } }
/* A listing's own questions, part G (Justin, 12 Nov). */
.dir-facts-q { border: 0; margin: 0 0 var(--acxpa-ds-space-lg); padding: 0; }
.dir-facts-q > legend { margin-bottom: var(--acxpa-ds-space-xs); font-weight: 700; }
.dir-edit__checks--langs { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 6px; }
.dir-edit__checks--langs .dir-check { border-radius: var(--acxpa-ds-radius-md); }
/* Industry body cards: logo panel on top, centred, then the name (Justin, 13 Nov). */
.dir-body__mark { display: grid; place-items: center; height: 104px; margin: 0 0 var(--acxpa-ds-space-md); padding: 14px 20px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: #fff; }
.dir-body__mark img { max-width: 100%; max-height: 72px; object-fit: contain; }
.dir-body__initials { display: grid; place-items: center; min-width: 72px; padding: 0 14px; height: 72px; border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); color: var(--acxpa-ds-harbour-deep); font-weight: 700; font-size: var(--acxpa-ds-text-h4); letter-spacing: .02em; }
/* Upgrade cards side by side: price, buttons, "what it adds" and the list line up across cards, whatever wraps
   (Justin, 13 Nov: one button on one line and two on two put everything below out of line). */
@supports (grid-template-rows: subgrid) {
    /* Rows: offer, button, links, "what it adds", list. Each row is as tall as its tallest card, so buttons are the same
       height even when one label wraps and another doesn't. */
    .dir-miss__grid--2 .dir-miss__plan, .dir-miss__grid--3 .dir-miss__plan { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: var(--acxpa-ds-space-sm); }
    .dir-miss__grid--2 .dir-miss__top, .dir-miss__grid--3 .dir-miss__top,
    .dir-miss__grid--2 .dir-miss__cta, .dir-miss__grid--3 .dir-miss__cta { display: contents; }
    .dir-miss__grid--2 .dir-miss__cta > .dir-btn, .dir-miss__grid--3 .dir-miss__cta > .dir-btn { display: flex; align-items: center; justify-content: center; text-align: center; }
    .dir-miss__grid--2 .dir-miss__adds, .dir-miss__grid--3 .dir-miss__adds { margin-top: var(--acxpa-ds-space-xs) !important; align-self: start; }
    .dir-miss__grid--2, .dir-miss__grid--3 { row-gap: var(--acxpa-ds-space-md); }
}
/* Room between the last part of the listing editor and its Save bar (Justin, 13 Nov). */
.dir-miss__extra { display: grid; gap: 8px; align-content: start; }
.dir-fsale__buy > div { flex: 1 1 360px; } .dir-fsale__buy > div > span { display: block; } .dir-fsale__buy > .dir-btn { flex: 0 0 auto; }

/* ---- The move from cxdirectory.com.au (15 Nov 2026): bar on every page, What's new, Why list now ---- */
.dir-news { background: var(--acxpa-ds-harbour-deep); color: var(--acxpa-ds-white); font-size: var(--acxpa-ds-text-small); }
.dir-news__inner { display: flex; align-items: center; justify-content: center; gap: var(--acxpa-ds-space-md); padding-top: 10px; padding-bottom: 10px; }
.dir-news p { margin: 0; }
.dir-news__link { color: var(--acxpa-ds-gold); font-weight: 600; white-space: nowrap; }
.dir-news__link:hover { color: var(--acxpa-ds-white); }
.dir-news__close { flex: none; width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; color: var(--acxpa-ds-white); font-size: 1.25rem; line-height: 1; cursor: pointer; }
.dir-news__close:hover { background: color-mix(in srgb, var(--acxpa-ds-white) 12%, transparent); }
.dir-news[hidden] { display: none; }
@media (max-width: 640px) { .dir-news__more { display: none; } .dir-news__inner { flex-wrap: wrap; justify-content: flex-start; gap: 4px var(--acxpa-ds-space-sm); position: relative; padding-right: 48px; } .dir-news__close { position: absolute; top: 6px; right: 8px; } }
.dir-new { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-lg); }
.dir-new__card { background: var(--acxpa-ds-white); border-top: 4px solid var(--acxpa-ds-clay); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-lg); box-shadow: var(--acxpa-ds-shadow-sm); }
.dir-section--harbour .dir-new__card { border-top-color: var(--acxpa-ds-harbour); }
.dir-new__card h3 { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-h4); line-height: var(--acxpa-ds-leading-snug); color: var(--acxpa-ds-teal-800); }
.dir-new__card p { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-new__card p:last-child { margin-bottom: 0; }
.dir-new__moved { margin-top: var(--acxpa-ds-space-xl); background: var(--acxpa-ds-white); border-left: 4px solid var(--acxpa-ds-gold); box-shadow: var(--acxpa-ds-shadow-sm); }
.dir-cta-band__inner > .dir-btn { flex: none; white-space: nowrap; }
.dir-new__moved p { margin: 0; }
.dir-whynow { background: var(--acxpa-ds-harbour-deep); color: var(--acxpa-ds-white); }
.dir-whynow .dir-eyebrow { color: #C9D5EA; }
.dir-whynow__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--acxpa-ds-space-xl); }
.dir-whynow__inner p:not(.dir-eyebrow) { color: #E0E7F2; }
.dir-whynow__inner .dir-btn { flex: none; }
@media (max-width: 720px) { .dir-new { grid-template-columns: 1fr; } .dir-whynow__inner, .dir-new__moved { flex-direction: column; align-items: flex-start; } }
/* Vendor membership on the Premium card (15 Nov 2026) */
.dir-level__member { margin: 0 0 var(--acxpa-ds-space-sm); padding: 10px 12px; border-left: 3px solid var(--acxpa-ds-gold); border-radius: var(--acxpa-ds-radius-md); background: color-mix(in srgb, var(--acxpa-ds-white) 10%, transparent); font-size: var(--acxpa-ds-text-small); line-height: 1.45; }
.dir-level__member a { color: var(--acxpa-ds-gold); font-weight: 600; white-space: nowrap; }

/* Team admin shell (15 Nov 2026): navy sidebar on every admin page, one job per page. */
.dir-adm { padding-top: var(--acxpa-ds-space-xl); }
.dir-adm .dir-adm__grid { max-width: 1440px; display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: var(--acxpa-ds-space-xl); align-items: start; }
.dir-adm__grid > * { min-width: 0; }
.dir-adm__side { position: sticky; top: var(--acxpa-ds-space-md); display: grid; background: var(--acxpa-ds-harbour-deep); color: #fff; border-radius: var(--acxpa-ds-radius-lg); overflow: hidden; }
.dir-adm__team { padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-md) var(--acxpa-ds-space-sm); border-bottom: 1px solid rgba(255, 255, 255, .12); }
.dir-adm__teamh { margin: 0; font-size: var(--acxpa-ds-text-caption); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--acxpa-ds-gold); }
.dir-adm__who { margin: 2px 0 0; font-size: var(--acxpa-ds-text-caption); color: #C9D5EA; overflow-wrap: anywhere; }
.dir-adm__nav { display: grid; padding: 4px 0 var(--acxpa-ds-space-sm); }
.dir-adm__group { margin: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md) 4px; font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #8FA3C6; }
.dir-adm__nav a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 9px var(--acxpa-ds-space-md); border-left: 4px solid transparent; color: #fff; font-size: var(--acxpa-ds-text-small); font-weight: 600; text-decoration: none; }
.dir-adm__nav a:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.dir-adm__nav a[aria-current="page"] { background: var(--acxpa-ds-harbour); border-left-color: var(--acxpa-ds-gold); }
.dir-adm__nav a:focus-visible { outline-color: var(--acxpa-ds-gold); outline-offset: -3px; }
.dir-adm__badge { display: inline-grid; place-items: center; min-width: 24px; height: 22px; padding: 0 7px; border-radius: 11px; background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); font-size: 12px; font-weight: 700; }
.dir-adm__me { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); background: rgba(0, 0, 0, .18); font-size: var(--acxpa-ds-text-caption); }
.dir-adm__me a, .dir-adm__me button { color: #fff; font: inherit; font-weight: 600; text-decoration: underline; background: none; border: 0; padding: 0; cursor: pointer; }
.dir-adm__me form { margin: 0; }
.dir-adm__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--acxpa-ds-space-lg); margin-bottom: var(--acxpa-ds-space-lg); }
.dir-adm__head .dir-acct__h { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-adm__intro p { margin: 0 0 6px; color: var(--acxpa-ds-slate); }
.dir-adm__actions { flex: none; }
.dir-adm__main > .dir-acct__note { margin-top: 0; }
.dir-adm__main .dir-admin__panel:first-child { margin-top: 0; }
.dir-adm__find { display: flex; gap: var(--acxpa-ds-space-xs); }
.dir-adm__find input { width: 300px; padding: 8px 12px; border: 1px solid var(--acxpa-ds-stone); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); font: inherit; font-size: var(--acxpa-ds-text-small); }
@media (max-width: 900px) {
    .dir-adm .dir-adm__grid { grid-template-columns: 1fr; gap: var(--acxpa-ds-space-lg); }
    .dir-adm__side { position: static; }
    .dir-adm__team, .dir-adm__group, .dir-adm__me { display: none; }
    .dir-adm__nav { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; padding: 0; }
    .dir-adm__nav a { border-left: 0; border-bottom: 3px solid transparent; }
    .dir-adm__nav a[aria-current="page"] { border-bottom-color: var(--acxpa-ds-gold); }
    .dir-adm__head { flex-direction: column; }
    .dir-adm__actions, .dir-adm__find, .dir-adm__find input { width: 100%; }
}

/* Admin overview */
.dir-ov__wait { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--acxpa-ds-space-xl); align-items: center; padding: var(--acxpa-ds-space-lg) var(--acxpa-ds-space-xl); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-gold-tint); }
.dir-ov__wait.is-clear { background: var(--acxpa-ds-success-tint); }
.dir-ov__waitnum { display: grid; justify-items: center; min-width: 120px; padding: var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-white); }
.dir-ov__waitnum strong { font-size: 3rem; line-height: 1; color: var(--acxpa-ds-ink); }
.dir-ov__waitnum span { margin-top: 4px; font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-slate); }
.dir-ov__waitbody .dir-dash__h2 { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-ov__waitbody p { margin: 0; }
.dir-ov__groups { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.dir-ov__groups a { display: inline-flex; gap: 6px; padding: 5px 12px; border-radius: 999px; background: var(--acxpa-ds-white); color: var(--acxpa-ds-ink); font-size: var(--acxpa-ds-text-small); text-decoration: none; }
.dir-ov__groups a:hover { box-shadow: 0 0 0 2px var(--acxpa-ds-gold-deep); }
.dir-ov__also { margin-top: var(--acxpa-ds-space-sm) !important; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-warm-slate); }
.dir-ov__h2 { margin-top: var(--acxpa-ds-space-2xl); }
.dir-ov__checks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--acxpa-ds-space-md); margin-top: var(--acxpa-ds-space-md); }
.dir-ov__check { display: grid; grid-template-rows: auto auto 1fr auto; gap: 6px; padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg) var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-top: 5px solid var(--acxpa-ds-success); color: var(--acxpa-ds-ink); text-decoration: none; }
.dir-ov__check:hover { color: var(--acxpa-ds-ink); box-shadow: 0 6px 18px rgba(17, 32, 64, .1); }
.dir-ov__check--attn { background: var(--acxpa-ds-error-tint); border-color: transparent; border-top-color: var(--acxpa-ds-error); }
.dir-ov__check--wait { background: var(--acxpa-ds-harbour-tint); border-color: transparent; border-top-color: var(--acxpa-ds-harbour); }
.dir-ov__state { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--acxpa-ds-success-deep); }
.dir-ov__check--attn .dir-ov__state { color: var(--acxpa-ds-error-deep); }
.dir-ov__check--wait .dir-ov__state { color: var(--acxpa-ds-harbour); }
.dir-ov__check strong { font-size: 18px; }
.dir-ov__checktext { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); line-height: 1.5; }
.dir-ov__cta { margin-top: var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-small); font-weight: 700; color: var(--acxpa-ds-harbour-deep); }
.dir-ov__tiles { margin-bottom: var(--acxpa-ds-space-sm); }
.dir-ov__more { margin: var(--acxpa-ds-space-md) 0 0; font-weight: 600; }
@media (max-width: 1100px) { .dir-ov__checks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) {
    .dir-ov__wait { grid-template-columns: 1fr; gap: var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-lg); }
    .dir-ov__waitnum { justify-items: start; }
    .dir-ov__checks { grid-template-columns: 1fr; }
}

/* Admin to-do: each kind of item in its own panel */
.dir-todo__group { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-white); border: 1px solid var(--acxpa-ds-stone); border-left: 6px solid var(--acxpa-ds-harbour); scroll-margin-top: 90px; }
.dir-todo__group .dir-dash__h2 { margin: 0 0 4px; }
.dir-todo__group .dir-admin__row { background: var(--acxpa-ds-sand); }
.dir-todo__group--claims { border-left-color: var(--acxpa-ds-success); }
.dir-todo__group--flags { border-left-color: var(--acxpa-ds-error); }
.dir-todo__group--proof { border-left-color: var(--acxpa-ds-harbour); }
.dir-todo__group--requests, .dir-todo__group--ideas { border-left-color: var(--acxpa-ds-gold-mid); }
.dir-todo__group--muted { background: var(--acxpa-ds-harbour-tint); border-color: transparent; border-left-color: var(--acxpa-ds-slate); }
.dir-todo__group--muted .dir-admin__row { background: var(--acxpa-ds-white); }
.dir-todo__h3 { margin: 0 0 4px; font-size: var(--acxpa-ds-text-h4); }
.dir-todo__why { margin: 0 0 var(--acxpa-ds-space-sm); color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
.dir-todo__clear { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-success-tint); }
.dir-todo__clear .dir-dash__h2 { margin-top: 0; }
.dir-todo__clear p { margin: 0; }
.dir-todo__note { margin: 0 0 var(--acxpa-ds-space-md); padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-gold-tint); }
.dir-ov__tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.dir-num__tile--gold { background: var(--acxpa-ds-gold-tint); border-color: transparent; color: inherit; text-decoration: none; }
a.dir-num__tile:hover { box-shadow: 0 6px 18px rgba(17, 32, 64, .1); color: inherit; }
@media (max-width: 1200px) { .dir-ov__tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .dir-ov__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .dir-ov__tiles { grid-template-columns: 1fr; } }
/* Vendor membership as the best-value option under the plans (15 Nov 2026) */
.dir-vm { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) 280px; gap: var(--acxpa-ds-space-xl); align-items: center; margin-top: var(--acxpa-ds-space-xl); padding: var(--acxpa-ds-space-xl); background: var(--acxpa-ds-white); border: 2px solid var(--acxpa-ds-gold); border-radius: var(--acxpa-ds-radius-lg); box-shadow: var(--acxpa-ds-shadow-sm); }
.dir-vm__flag { position: absolute; top: -13px; left: var(--acxpa-ds-space-xl); margin: 0; padding: 3px 10px; border-radius: 999px; background: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); font-size: 12px; font-weight: 700; }
.dir-vm__h { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-h3); line-height: var(--acxpa-ds-leading-snug); color: var(--acxpa-ds-harbour-deep); }
.dir-vm__copy p:not(.dir-eyebrow):not(.dir-vm__flag) { margin: 0 0 var(--acxpa-ds-space-xs); }
.dir-vm__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--acxpa-ds-space-sm); }
.dir-vm__list li { position: relative; padding-left: 26px; }
.dir-vm__list li::before { content: "✓"; position: absolute; left: 0; color: var(--acxpa-ds-gold-deep); font-weight: 800; }
.dir-vm__list strong { color: var(--acxpa-ds-ink); }
.dir-vm__buy { padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-deep); color: var(--acxpa-ds-white); }
.dir-vm__price { margin: 0; }
.dir-vm__price strong { font-size: 2rem; font-weight: 800; }
.dir-vm__price span { color: rgba(255, 255, 255, .78); }
.dir-vm__value { display: inline-block; margin: 4px 0 var(--acxpa-ds-space-md); padding: 2px 10px; border-radius: 999px; background: color-mix(in srgb, var(--acxpa-ds-gold) 22%, transparent); color: var(--acxpa-ds-gold); font-size: var(--acxpa-ds-text-small); font-weight: 700; }
.dir-vm__small { margin: var(--acxpa-ds-space-sm) 0 0; font-size: 13px; color: rgba(255, 255, 255, .78); }
@media (max-width: 1000px) { .dir-vm { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .dir-vm__buy { grid-column: 1 / -1; } }
@media (max-width: 640px) { .dir-vm { grid-template-columns: 1fr; padding: var(--acxpa-ds-space-lg); } }
/* The option to explore every plan during sign-up (15 Nov 2026) */
.dir-acct__aside-plans { margin: 0 0 var(--acxpa-ds-space-md); padding-top: var(--acxpa-ds-space-md); border-top: 1px solid rgba(255, 255, 255, .15); font-weight: 600; }
.dir-acct__aside-plans a { color: var(--acxpa-ds-gold); white-space: nowrap; }
.dir-acct__plans { margin-top: var(--acxpa-ds-space-lg); padding: var(--acxpa-ds-space-lg); border-radius: var(--acxpa-ds-radius-lg); background: var(--acxpa-ds-harbour-tint); }
.dir-acct__plans-h { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-harbour-deep); }
.dir-acct__plans p { margin: 0 0 var(--acxpa-ds-space-sm); }
/* Black Friday (15 Nov 2026): sale price on plan cards, the bar, checkout and Vendor membership */
.dir-level__sale, .dir-vm__sale { display: inline-block; align-self: flex-start; width: max-content; margin: 0 0 6px; padding: 2px 10px; border-radius: 999px; background: var(--acxpa-ds-clay); color: var(--acxpa-ds-white); font-size: 12px; font-weight: 700; }
.dir-vm__price s { margin-right: 4px; font-size: 1.05rem; font-weight: 600; color: rgba(255, 255, 255, .7); }
.dir-sale-note { margin: 0 0 var(--acxpa-ds-space-md); padding: 10px 14px; border-left: 4px solid var(--acxpa-ds-clay); border-radius: var(--acxpa-ds-radius-md); background: var(--acxpa-ds-clay-tint); color: var(--acxpa-ds-ink); }
.dir-news--sale { background: var(--acxpa-ds-clay-deep); }
.dir-pay__off dd, .dir-pay__off dt { color: var(--acxpa-ds-gold); font-weight: 600; }
.dir-pay__off dd { white-space: nowrap; }
/* Privacy policy and supplier terms (15 Nov 2026) */
.dir-legal { background: var(--acxpa-ds-white); border-radius: var(--acxpa-ds-radius-lg); padding: var(--acxpa-ds-space-2xl) var(--acxpa-ds-space-xl); box-shadow: var(--acxpa-ds-shadow-sm); }
.dir-legal h2 { margin: var(--acxpa-ds-space-xl) 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-h3); color: var(--acxpa-ds-harbour-deep); }
.dir-legal h2:first-child { margin-top: 0; }
.dir-legal p { margin: 0 0 var(--acxpa-ds-space-sm); line-height: 1.65; }
.dir-legal ul { margin: 0 0 var(--acxpa-ds-space-md); padding-left: var(--acxpa-ds-space-lg); }
.dir-legal li { margin-bottom: var(--acxpa-ds-space-xs); line-height: 1.6; }
.dir-legal__also { margin-top: var(--acxpa-ds-space-xl) !important; padding-top: var(--acxpa-ds-space-md); border-top: 1px solid var(--acxpa-ds-stone); }
.dir-pay__terms { margin: 6px 0 0; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
@media (max-width: 640px) { .dir-legal { padding: var(--acxpa-ds-space-lg); } }
/* Cookie question and Cookie settings (15 Nov 2026) */
.dir-cookies { position: fixed; left: var(--acxpa-ds-space-lg); bottom: var(--acxpa-ds-space-lg); z-index: 60; width: 420px; padding: var(--acxpa-ds-space-lg); background: var(--acxpa-ds-white); border-top: 4px solid var(--acxpa-ds-harbour); border-radius: var(--acxpa-ds-radius-lg); box-shadow: 0 12px 32px rgba(17, 32, 64, .22); }
.dir-cookies[hidden] { display: none; }
.dir-cookies__h { margin: 0 0 var(--acxpa-ds-space-xs); font-size: var(--acxpa-ds-text-h4); color: var(--acxpa-ds-harbour-deep); }
.dir-cookies p { margin: 0 0 var(--acxpa-ds-space-sm); font-size: var(--acxpa-ds-text-small); line-height: 1.55; }
.dir-cookies__state { font-weight: 600; }
.dir-cookies__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--acxpa-ds-space-sm); }
.dir-cookies__more { font-size: var(--acxpa-ds-text-small); }
@media (max-width: 640px) { .dir-cookies { left: var(--acxpa-ds-space-sm); right: var(--acxpa-ds-space-sm); bottom: var(--acxpa-ds-space-sm); width: auto; } }
