
/* D3 fix — match Divi's container width so directory pages align with the rest of
   the site on desktop and mobile. Divi's row is 80% wide, max 1080px. */
.gravdir-crumbs,
.gravdir-hero,
.gravdir-section > h2,
.gravdir-section > .gravdir-grid,
.gravdir-section > .gravdir-copy,
.gravdir-section > .gravdir-compare,
.gravdir-section > .gravdir-faqs,
.gravdir-section > .gravdir-storefinder,
.gravdir-section > .gravdir-availability{
  width:80%;max-width:1080px;margin-left:auto;margin-right:auto
}
.gravdir-section{padding:56px 0}
@media(max-width:980px){
  .gravdir-crumbs,.gravdir-hero,.gravdir-section > *{width:90%;max-width:none}
  .gravdir-section{padding:40px 0}
  .gravdir-hero h1{font-size:32px}
}

/* Gravitate Directory — enqueued, versioned, cacheable.
   Replaces the inline <style> blocks in Code Snippet #40.
   Contains NO display:none rules against theme header/footer. */

.gd{--gd-ink:#111;--gd-muted:#5a5a5a;--gd-line:rgba(0,0,0,.12);--gd-radius:12px}
.gravdir-crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;padding:16px 0;color:var(--gd-muted)}
.gravdir-crumbs a{color:inherit;text-decoration:underline}
.gravdir-crumbs [aria-current=page]{color:var(--gd-ink);font-weight:600}
.gravdir-hero{padding:24px 0 32px}
.gravdir-hero h1{margin:0 0 12px;line-height:1.15}
.gravdir-lead{font-size:18px;color:var(--gd-muted);margin:0 0 16px;max-width:70ch}
.gravdir-warning{border:1px solid var(--gd-line);border-radius:var(--gd-radius);padding:12px 16px;font-size:14px;line-height:1.5}
.gravdir-section{padding:40px 0;border-top:1px solid var(--gd-line)}
.gravdir-section h2{margin-top:0;margin-bottom:20px}
.gravdir-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.gravdir-card{border:1px solid var(--gd-line);border-radius:var(--gd-radius);padding:20px;display:flex;flex-direction:column;gap:10px}
.gravdir-card h3{margin:0;font-size:18px}
.gravdir-card p{margin:0;color:var(--gd-muted);font-size:15px;line-height:1.55}
.gravdir-eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--gd-muted)}
.gravdir-btn{display:inline-block;padding:12px 20px;border-radius:999px;font-weight:600;text-decoration:none;border:1px solid currentColor;margin-top:auto;align-self:flex-start}
.gravdir-btn--secondary{opacity:.75}
.gravdir-copy{display:grid;gap:28px;grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:start}
.gravdir-copy p{max-width:70ch;line-height:1.65}
.gravdir-compare{line-height:1.8;padding-left:1.2em}
.gravdir-availability{color:var(--gd-muted);font-size:15px;margin-top:20px}
.gravdir-storefinder{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.gravdir-storefinder p{flex:1 1 320px;margin:0;color:var(--gd-muted)}
.gravdir-media{margin:0 0 20px;border:1px solid var(--gd-line);border-radius:var(--gd-radius);overflow:hidden}
.gravdir-media__img{display:block;width:100%;height:auto;max-height:480px;object-fit:contain}
.gravdir-faqs{display:grid;gap:10px;max-width:80ch}
.gravdir-faq{border:1px solid var(--gd-line);border-radius:var(--gd-radius);padding:14px 18px}
.gravdir-faq summary{cursor:pointer;font-weight:600}
.gravdir-faq p{margin:10px 0 0;color:var(--gd-muted);line-height:1.6}
@media(max-width:900px){.gravdir-copy{grid-template-columns:1fr}.gravdir-btn{width:100%;text-align:center}}


/* v1.1.3 — H2 alignment fix.
   Root cause: the later `.gravdir-section h2{margin:0 0 20px}` shorthand reset the
   margin-left/right:auto set by the container rule above, so section headings rendered
   flush-left instead of inside the Divi container. Shorthand replaced with longhands and
   the container constraint restated at higher specificity so no theme rule can win. */
.gd .gravdir-section > h2,
.gd .gravdir-section > h2.gravdir-h2,
body .gd .gravdir-section > h2{
  width:80%;max-width:1080px;
  margin-left:auto !important;margin-right:auto !important;
  padding-left:0;padding-right:0;text-align:left;
}
@media(max-width:980px){
  .gd .gravdir-section > h2,
  body .gd .gravdir-section > h2{width:90%;max-width:none}
}

/* Location page FAQ block (v1.3.1) — matches the Brands/Categories card system. */
.gravdir-location-faqs{width:80%;max-width:1080px;margin:0 auto;padding:40px 0 8px}
.gravdir-location-faqs h2{font-size:24px;margin:0 0 16px;color:var(--gd-ink,#111)}
.gravdir-location-faqs .gravdir-faq{border:1px solid var(--gd-line,rgba(0,0,0,.12));border-radius:var(--gd-radius,12px);margin:0 0 10px;background:#fff}
.gravdir-location-faqs .gravdir-faq summary{display:flex;align-items:center;min-height:48px;padding:12px 16px;cursor:pointer;font-weight:600;line-height:1.4}
.gravdir-location-faqs .gravdir-faq summary:focus-visible{outline:3px solid #fe0102;outline-offset:2px}
.gravdir-location-faqs .gravdir-faq p{margin:0;padding:0 16px 16px;color:var(--gd-muted,#5a5a5a);line-height:1.6}
.gravdir-location-links{margin:16px 0 0;line-height:2}
.gravdir-location-links a{min-height:48px;display:inline-flex;align-items:center}
@media(max-width:980px){.gravdir-location-faqs{width:90%;max-width:none}}

/* 1.4.0 — authoritative store hours, rendered from Gravdir_Hours. */
.gravdir-hours { white-space: normal; }

/* 1.5.0 — /location/ store finder. Reuses the existing card tokens. */
.gravdir-store-finder { margin: 2.5em 0 0; }
.gravdir-finder-intro, .gravdir-finder-links { max-width: 70ch; }
.gravdir-city-heading { margin: 1.6em 0 .6em; }
.gravdir-store-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem;
	margin-bottom: 1.5em;
}
.gravdir-store-card {
	border: 1px solid var(--gd-line, #e3e3e3);
	border-radius: var(--gd-radius, 6px);
	padding: 1rem 1.1rem 1.1rem;
	color: var(--gd-ink, #111);
}
.gravdir-store-name { margin: 0 0 .35em; font-size: 1.05rem; }
.gravdir-store-address, .gravdir-store-hours { margin: 0 0 .5em; font-size: .95rem; }
.gravdir-label { font-weight: 600; }
.gravdir-store-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: .75em 0 0; }
.gravdir-store-actions .gravdir-action {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0 .9rem;
	border: 1px solid var(--gd-line, #e3e3e3);
	border-radius: var(--gd-radius, 6px);
	text-decoration: none;
	font-size: .92rem;
	line-height: 1.2;
}
.gravdir-finder-note { margin-top: 1.5em; font-size: .9rem; }

/* v1.6.0 — brand/category body copy */
.gravdir-intro{max-width:70ch;margin:0 0 1.1em;color:var(--gd-ink);line-height:1.65}
.gravdir-section .gravdir-intro:last-child{margin-bottom:0}
.gravdir-copy h3{margin-top:1.4em}
.gravdir-availability a{text-decoration:underline}
/* v1.6.1 — every actionable control reaches the 48px minimum */
.gravdir-btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center}
.gravdir-section > .gravdir-btn{margin-top:1rem}

/* v1.6.2 — Brand/Category archive FAQ accordions: 48px interactive target.
   Scoped to .gravdir-main, which exists ONLY in templates/archive-brand.php and
   templates/archive-category.php. Location-page accordions live in
   .gravdir-location-faqs and are deliberately untouched.
   The padding moves from .gravdir-faq onto summary/p so the clickable row fills
   the existing box: border, radius, font-size, font-weight and spacing are
   preserved, and native <details>/<summary> behaviour is unchanged. No JS. */
.gravdir-main .gravdir-faq{padding:0}
.gravdir-main .gravdir-faq summary{
	display:block;box-sizing:border-box;min-height:48px;
	padding:14px 18px;line-height:1.4;cursor:pointer;font-weight:600}
.gravdir-main .gravdir-faq summary:focus-visible{outline:3px solid #fe0102;outline-offset:2px}
.gravdir-main .gravdir-faq p{margin:0;padding:0 18px 14px}
