/*
Theme Name: Discover the Alamo City - GeneratePress Child
Template: generatepress
Description: Child theme for Discover the Alamo City. Centralizes the Direction B (Modern Navigator) design tokens and component library approved in SG7.5 (D-021), replacing the per-page inline <style> blocks used on the first pages pushed to WordPress.
Author: Digital Consulting Firm
Version: 1.0.2
Text Domain: dac-generatepress-child
*/

/* =========================================================================
   DESIGN TOKENS — Direction B (Modern Navigator), approved SG7.5 / D-021.
   Values match what is already live in the Home (page 13) and PCS/Lackland
   (page 15) pages' inline styles exactly — this file centralizes them, it
   does not introduce new values.
   ========================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');

:root {
  --dac-font: 'Plus Jakarta Sans', sans-serif;
  --dac-bg: oklch(97% 0.01 85);
  --dac-text: oklch(22% 0.01 230);
  --dac-text-heading: oklch(20% 0.01 230);
  --dac-text-body: oklch(42% 0.01 230);
  --dac-text-muted: oklch(45% 0.01 230);
  --dac-text-muted-2: oklch(48% 0.01 230);
  --dac-text-muted-3: oklch(50% 0.01 230);
  --dac-primary: oklch(38% 0.07 220);
  --dac-primary-hover: oklch(32% 0.07 220);
  --dac-primary-tint: oklch(94% 0.01 220);
  --dac-primary-tint-2: oklch(93% 0.01 220);
  --dac-primary-tint-3: oklch(93% 0.02 220);
  --dac-focus-ring: oklch(62% 0.15 35);
  --dac-border: oklch(90% 0.01 230);
  --dac-border-dashed: oklch(78% 0.02 220);
  --dac-card-bg-soft: oklch(98% 0.006 220);
  --dac-em-color: oklch(50% 0.1 220);
  --dac-white: #fff;
}

/* =========================================================================
   BASE
   ========================================================================= */
body.page {
  background: var(--dac-bg);
  color: var(--dac-text);
  font-family: var(--dac-font);
}

/* Remove the GeneratePress default sidebar (Search/Recent Posts/Recent
   Comments sample widgets) site-wide for Pages — no page in this build uses
   it, and it was previously a page-13-only scoped override. Centralizing
   here per D-024. */
body.page #right-sidebar { display: none !important; }
body.page .site-content { grid-template-columns: 1fr !important; }
body.page .content-area { width: 100%; max-width: 100%; }

h2 {
  font: 700 24px/1.3 var(--dac-font);
  letter-spacing: -0.3px;
  color: var(--dac-text-heading);
  margin: 0 0 16px;
}

em { color: var(--dac-em-color); font-style: italic; }

/* =========================================================================
   LAYOUT WRAPPERS — two content widths used across templates.
   ========================================================================= */
.dac-hero, .dac-community-hero, .dac-page-hero, .dac-router,
.dac-community-card-grid, .dac-navigator-bio,
.dac-video-teaser, .dac-testimonials, .dac-conversion-frame,
.dac-at-a-glance, .dac-content-block, .dac-crosslink-module,
.dac-nearby-module, .dac-faq, .dac-process-steps, .dac-glossary {
  max-width: 1200px;
  margin: 0 auto;
  padding: 56px 24px;
  box-sizing: border-box;
}

.dac-toc, .dac-comparison, .dac-area-grid, .dac-checklist,
.dac-download-frame {
  max-width: 1080px;
  margin: 0 auto;
  padding: 40px 24px;
  box-sizing: border-box;
}

/* =========================================================================
   HERO — .dac-hero (Home), .dac-community-hero (community guides),
   .dac-page-hero (Buy hubs) all share the same visual treatment.
   ========================================================================= */
.dac-hero, .dac-community-hero, .dac-page-hero { padding-top: 56px; padding-bottom: 40px; }
.dac-eyebrow {
  font: 700 11px/1 var(--dac-font);
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--dac-primary);
  margin: 0 0 12px;
}
.dac-hero h1, .dac-community-hero h1, .dac-page-hero h1 {
  font: 800 44px/1.15 var(--dac-font);
  letter-spacing: -0.5px;
  color: var(--dac-text-heading);
  margin: 0 0 20px;
}
.dac-hero p, .dac-community-hero p, .dac-page-hero p {
  font: 500 17px/1.6 var(--dac-font);
  color: var(--dac-text-body);
  max-width: 720px;
  margin: 0 0 28px;
}
/* Secondary-tier community pages (lighter template, no body copy in hero) */
.dac-community-hero--secondary { padding-bottom: 24px; }
.dac-community-hero--secondary h1 { font-size: 34px; margin-bottom: 0; }
@media (max-width: 640px) {
  .dac-hero h1, .dac-community-hero h1, .dac-page-hero h1 { font-size: 30px; }
}

/* Compact "at a glance" variant used on secondary community pages (2 stat cards) */
.dac-at-a-glance--compact .dac-at-a-glance__grid {
  grid-template-columns: repeat(2, minmax(200px, 1fr));
  max-width: 480px;
}

/* =========================================================================
   BUTTONS
   ========================================================================= */
.dac-button, a.dac-button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font: 700 16px/1 var(--dac-font);
  color: var(--dac-white) !important;
  background: var(--dac-primary);
  padding: 15px 26px;
  border-radius: 10px;
  text-decoration: none;
}
.dac-button:hover, a.dac-button:hover { background: var(--dac-primary-hover); }
.dac-button:focus-visible, a.dac-button:focus-visible {
  outline: 2px solid var(--dac-focus-ring);
  outline-offset: 3px;
}

/* =========================================================================
   AUDIENCE ROUTER (Home)
   ========================================================================= */
.dac-router h2,
.dac-community-card-grid h2,
.dac-navigator-bio h2,
.dac-video-teaser h2,
.dac-testimonials h2,
.dac-conversion-frame h2 {
  font: 700 28px/1.2 var(--dac-font);
  letter-spacing: -0.3px;
  margin: 0 0 32px;
  color: var(--dac-text-heading);
}
.dac-router__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}
.dac-router__card {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-top: 3px solid var(--dac-primary);
  border-radius: 14px;
  padding: 26px 22px;
}
.dac-router__card p:first-child strong {
  font: 700 11px/1;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--dac-primary);
}
.dac-router__card p:nth-child(2) {
  font: 700 18px/1.3 var(--dac-font);
  color: var(--dac-text-heading);
  margin: 8px 0 12px;
}
.dac-router__card a {
  font: 700 14px/1 var(--dac-font);
  color: var(--dac-primary);
  text-decoration: none;
}

/* =========================================================================
   COMMUNITY CARD GRID (Home "Featured Communities")
   ========================================================================= */
.dac-community-card-grid { display: block; }
.dac-community-card {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 16px;
}
.dac-community-card p:first-child {
  font: 700 18px/1.3 var(--dac-font);
  margin: 0 0 6px;
}

/* =========================================================================
   NAVIGATOR BIO / VIDEO / TESTIMONIALS (Home)
   ========================================================================= */
.dac-navigator-bio {
  background: var(--dac-primary);
  border-radius: 16px;
  color: var(--dac-white);
}
.dac-navigator-bio h2 { color: var(--dac-white); }
.dac-navigator-bio p {
  font: 500 18px/1.55 var(--dac-font);
  color: var(--dac-primary-tint);
}
.dac-testimonials p {
  font: 500 15px/1.5 var(--dac-font);
  color: var(--dac-text-muted-2);
  background: var(--dac-card-bg-soft);
  border: 1.5px dashed var(--dac-border-dashed);
  border-radius: 14px;
  padding: 24px;
}
.dac-video-teaser p {
  font: 500 15px/1.5 var(--dac-font);
  color: var(--dac-text-muted-2);
}

/* =========================================================================
   FINAL CTA FRAME (all templates)
   ========================================================================= */
.dac-conversion-frame {
  background: var(--dac-primary);
  border-radius: 16px;
  text-align: center;
}
.dac-conversion-frame h2 { color: var(--dac-white); }
.dac-conversion-frame .dac-button {
  color: var(--dac-primary) !important;
  background: var(--dac-white);
}
.dac-conversion-frame .dac-button:hover { background: var(--dac-primary-tint-2); }

/* =========================================================================
   TABLE OF CONTENTS (PCS pillar / long-form guides)
   ========================================================================= */
.dac-toc {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-radius: 16px;
  padding: 32px;
}
.dac-toc ul { margin: 0; padding-left: 20px; }
.dac-toc li { margin-bottom: 8px; }
.dac-toc a {
  color: var(--dac-primary);
  font: 600 15px/1.4 var(--dac-font);
  text-decoration: none;
}
.dac-toc a:hover { text-decoration: underline; }

/* =========================================================================
   CONTENT BLOCKS / COMPARISON / CHECKLIST (shared card treatment)
   ========================================================================= */
.dac-comparison, .dac-content-block, .dac-checklist {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-radius: 16px;
  padding: 32px;
}
.dac-comparison p, .dac-content-block p, .dac-checklist p {
  font: 500 15.5px/1.65 var(--dac-font);
  color: var(--dac-text-muted);
}

/* =========================================================================
   AREA / STAT CARD GRIDS (PCS area comparison, community "at a glance")
   ========================================================================= */
.dac-area-card-grid,
.dac-at-a-glance__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin-top: 24px;
}
.dac-area-card,
.dac-stat-card {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-radius: 12px;
  padding: 18px 20px;
}
.dac-area-card p:first-child,
.dac-stat-card__label {
  font: 700 15.5px/1.3 var(--dac-font);
  margin: 0 0 6px;
  color: var(--dac-text-heading);
}
.dac-area-card p:nth-child(2),
.dac-stat-card__value {
  font: 500 13.5px/1.5 var(--dac-font);
  color: var(--dac-text-muted-2);
  margin: 0 0 10px;
}
.dac-area-card a {
  font: 700 13.5px/1 var(--dac-font);
  color: var(--dac-primary);
  text-decoration: none;
}

/* =========================================================================
   DOWNLOAD / LEAD-CAPTURE FRAME (PCS guide download)
   ========================================================================= */
.dac-download-frame {
  background: var(--dac-primary-tint-3);
  border-radius: 16px;
  text-align: center;
}

/* =========================================================================
   FAQ ACCORDION — real <button aria-expanded> accordions per O-023.
   Markup is progressively enhanced by js/faq-accordion.js: the first <p> in
   each .dac-faq__item becomes the trigger button, the remaining content
   becomes the collapsible panel. Degrades to plain visible Q&A text if JS
   is unavailable.
   ========================================================================= */
.dac-faq__item {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-radius: 12px;
  padding: 20px 24px;
  margin-bottom: 12px;
}
.dac-faq__item p:first-child {
  font: 700 15.5px/1.3 var(--dac-font);
  margin: 0 0 8px;
}
.dac-faq__item p:nth-child(2) {
  font: 500 14.5px/1.6 var(--dac-font);
  color: var(--dac-text-muted-3);
  margin: 0;
}
.dac-faq__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font: 700 15.5px/1.3 var(--dac-font);
  color: var(--dac-text-heading);
  padding: 0;
  margin: 0 0 8px;
}
.dac-faq__trigger:focus-visible {
  outline: 2px solid var(--dac-focus-ring);
  outline-offset: 3px;
}
.dac-faq__chevron {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-right: 2px solid var(--dac-primary);
  border-bottom: 2px solid var(--dac-primary);
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.dac-faq__trigger[aria-expanded="true"] .dac-faq__chevron {
  transform: rotate(-135deg);
}
.dac-faq__panel[hidden] { display: none; }

/* =========================================================================
   PROCESS STEPS (First-Time Buyers guide)
   ========================================================================= */
.dac-process-steps h2 {
  font: 700 28px/1.2 var(--dac-font);
  letter-spacing: -0.3px;
  margin: 0 0 32px;
  color: var(--dac-text-heading);
}
.dac-process-step {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-left: 3px solid var(--dac-primary);
  border-radius: 12px;
  padding: 20px 24px;
  margin-bottom: 14px;
}
.dac-process-step p:first-child {
  font: 700 17px/1.3 var(--dac-font);
  color: var(--dac-text-heading);
  margin: 0 0 8px;
}
.dac-process-step p:nth-child(2) {
  font: 500 15px/1.6 var(--dac-font);
  color: var(--dac-text-muted);
  margin: 0;
}

/* =========================================================================
   GLOSSARY (First-Time Buyers guide)
   ========================================================================= */
.dac-glossary h2 {
  font: 700 28px/1.2 var(--dac-font);
  letter-spacing: -0.3px;
  margin: 0 0 24px;
  color: var(--dac-text-heading);
}
.dac-glossary__list {
  background: var(--dac-white);
  border: 1px solid var(--dac-border);
  border-radius: 16px;
  padding: 32px;
  margin: 0;
}
.dac-glossary__list dt {
  font: 700 16px/1.3 var(--dac-font);
  color: var(--dac-text-heading);
  margin: 0 0 4px;
}
.dac-glossary__list dt:not(:first-child) { margin-top: 20px; }
.dac-glossary__list dd {
  font: 500 15px/1.6 var(--dac-font);
  color: var(--dac-text-muted);
  margin: 0;
}

/* =========================================================================
   CROSS-LINK / NEARBY MODULES (community pages)
   ========================================================================= */
.dac-crosslink-module, .dac-nearby-module {
  text-align: left;
}
.dac-nearby-module__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-top: 16px;
}
