/* ============================================================
   Solitude Stables — solitudestables.com
   Warm rustic farmhouse design system
   WCAG 2.0 AAA-minded: 7:1 text contrast, 44px targets,
   visible focus, reduced-motion support, no justified text.
   ============================================================ */

/* ---------- 1. Reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
}
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
ul, ol { list-style: none; }
a { color: inherit; }

/* ---------- 2. Design tokens ---------- */
:root {
  --cream:       #faf4e6;
  --cream-2:     #f2e7cf;
  --cream-3:     #ede0c2;
  --paper:       #fffdf8;
  --ink:         #2c2620;
  --ink-soft:    #4a4339;
  --forest:      #2c4631;
  --forest-deep: #1f3324;
  --forest-mid:  #3a5c41;
  --barn:        #8a2f20;
  --barn-deep:   #6e2417;
  --gold:        #c2962f;
  --gold-deep:   #7e5c17;
  --gold-lt:     #e8cd86;
  --gold-btn:    #d9b365;
  --moss:        #6b7d57;
  --line:        #ddccab;
  --font-display: "Fraunces", "Georgia", "Times New Roman", serif;
  --font-body: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-script: "Caveat", "Segoe Script", cursive;
  --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem;
  --s-5: 1.5rem; --s-6: 2rem; --s-7: 3rem; --s-8: 4rem; --s-9: 6rem;
  --r-sm: 6px; --r-md: 12px; --r-lg: 20px; --r-xl: 30px;
  --shadow-sm: 0 2px 8px rgba(43, 38, 32, .08);
  --shadow-md: 0 10px 30px rgba(43, 38, 32, .12);
  --shadow-lg: 0 24px 60px rgba(43, 38, 32, .18);
  --container: 1180px;
  --prose: 68ch;
  --header-h: 92px;
}

/* ---------- 3. Base ---------- */
body {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--ink);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
  overflow-wrap: break-word;
}
p, li, h1, h2, h3, h4, h5, h6, a, blockquote, dd, dt, figcaption, td, th {
  overflow-wrap: break-word;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.18;
  color: var(--forest);
  letter-spacing: -.01em;
  text-wrap: balance;
}
h2 { font-size: clamp(1.65rem, 1.1rem + 2.4vw, 2.6rem); }
h3 { font-size: clamp(1.3rem, 1.1rem + 1vw, 1.7rem); }
h4 { font-size: 1.2rem; }
h5 { font-size: 1.05rem; }
h6 { font-size: .95rem; text-transform: uppercase; letter-spacing: .08em; }
p { max-width: var(--prose); }
strong, b { font-weight: 800; }

a { color: var(--barn-deep); text-underline-offset: 3px; }
a:hover { color: var(--barn); }

main p a, .prose a, article p a {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--gold);
  font-weight: 700;
}
main p a:hover, .prose a:hover, article p a:hover { text-decoration-color: var(--barn); }

.ic { display: inline-block; width: 1.1em; height: 1.1em; vertical-align: -0.18em; flex-shrink: 0; }

/* ---------- 4. Accessibility utilities ---------- */
.skip-link {
  position: absolute; left: var(--s-3); top: -200px;
  background: var(--forest-deep); color: #fff7e9;
  padding: .8rem 1.25rem; border-radius: 0 0 var(--r-md) var(--r-md);
  z-index: 2000; font-weight: 800; text-decoration: none;
  transition: top .18s ease;
}
.skip-link:focus { top: 0; color: #fff7e9; }
.sr-only {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
:focus-visible {
  outline: 3px solid var(--forest);
  outline-offset: 3px;
  border-radius: 3px;
}
.on-dark :focus-visible,
.site-footer :focus-visible,
.topbar :focus-visible { outline-color: var(--gold); }

/* ---------- 5. Layout ---------- */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--s-5); }
.container-narrow { max-width: 820px; }
.section { padding-block: clamp(3rem, 2rem + 5vw, 6rem); position: relative; }
.section--cream2 { background: var(--cream-2); }
.section--paper { background: var(--paper); }
.section--forest { background: var(--forest-deep); color: var(--cream); }
.section--forest h1, .section--forest h2, .section--forest h3, .section--forest h4 { color: #fff7e9; }
.grid { display: grid; gap: var(--s-5); }
@media (min-width: 620px) { .g-2 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 900px) {
  .g-3 { grid-template-columns: repeat(3,1fr); }
  .g-4 { grid-template-columns: repeat(4,1fr); }
  .g-2-wide { grid-template-columns: 1.1fr .9fr; }
}
.center { text-align: center; }
.center p { margin-inline: auto; }

/* ---------- 6. Top bar ---------- */
.topbar {
  background: var(--forest-deep); color: var(--cream);
  font-size: .92rem; font-weight: 600;
}
.topbar .container {
  display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5);
  align-items: center; justify-content: center; padding-block: .5rem;
}
.topbar a { color: #fff7e9; text-decoration: none; display: inline-flex; align-items: center; gap: .4rem; }
.topbar a:hover { color: var(--gold); text-decoration: underline; }
.topbar svg { width: 17px; height: 17px; }
@media (min-width: 760px) { .topbar .container { justify-content: space-between; } }

/* ---------- 7. Header & navigation ---------- */
.site-header {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(250, 244, 230, .96);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
  transition: box-shadow .25s ease;
}
.site-header.scrolled { box-shadow: var(--shadow-sm); }
.nav {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--s-5); min-height: var(--header-h);
}
.brand { display: flex; align-items: center; gap: .65rem; text-decoration: none; flex-shrink: 0; }
.brand img.brand-logo { width: auto; height: clamp(58px, 3rem + 1.8vw, 80px); }
.brand-text { display: flex; flex-direction: column; line-height: 1.05; }
.brand-name { font-family: var(--font-display); font-weight: 600; font-size: 1.32rem; color: var(--forest); }
.brand-tag { font-family: var(--font-script); font-size: 1.05rem; color: var(--barn); }
.nav-toggle {
  display: inline-flex; align-items: center; gap: .5rem;
  background: var(--forest-deep); color: #fff7e9; border: 0;
  padding: .7rem .95rem; border-radius: var(--r-sm); cursor: pointer;
  font-weight: 800; min-height: 44px;
}
.nav-toggle .bars { width: 20px; height: 14px; position: relative; }
.nav-toggle .bars span, .nav-toggle .bars::before, .nav-toggle .bars::after {
  content: ""; position: absolute; left: 0; width: 100%; height: 2.6px;
  background: #fff7e9; border-radius: 2px; transition: transform .22s ease, opacity .22s ease;
}
.nav-toggle .bars::before { top: 0; }
.nav-toggle .bars span { top: 5.7px; }
.nav-toggle .bars::after { top: 11.4px; }
.nav-toggle[aria-expanded="true"] .bars::before { transform: translateY(5.7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .bars span { opacity: 0; }
.nav-toggle[aria-expanded="true"] .bars::after { transform: translateY(-5.7px) rotate(-45deg); }
.nav-menu { display: flex; align-items: center; gap: var(--s-2); }
.nav-list { display: flex; align-items: center; gap: var(--s-1); }
.nav-list > li { position: relative; }
.nav-link {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .65rem .8rem; border-radius: var(--r-sm);
  text-decoration: none; font-weight: 700; color: var(--ink);
  min-height: 44px;
}
.nav-link:hover { background: var(--cream-3); color: var(--barn-deep); }
.nav-link[aria-current="page"] {
  color: var(--barn-deep);
  box-shadow: inset 0 -3px 0 var(--gold);
}
.nav-link .caret { width: 12px; height: 12px; transition: transform .2s ease; }
[aria-expanded="true"] .caret { transform: rotate(180deg); }
.has-submenu > .submenu {
  position: absolute; top: calc(100% + 8px); left: 0;
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--shadow-md);
  padding: var(--s-2); min-width: 268px;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.has-submenu:hover > .submenu,
.has-submenu:focus-within > .submenu,
.has-submenu > .submenu.open { opacity: 1; visibility: visible; transform: translateY(0); }
.submenu a {
  display: block; padding: .7rem .8rem; border-radius: var(--r-sm);
  text-decoration: none; font-weight: 700; color: var(--ink);
}
.submenu a span { display: block; font-weight: 600; font-size: .88rem; color: var(--ink-soft); }
.submenu a:hover { background: var(--cream-2); color: var(--barn-deep); }

/* ---------- 8. Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font-family: var(--font-body); font-weight: 800; font-size: 1.02rem;
  padding: .85rem 1.5rem; min-height: 48px;
  border-radius: 999px; border: 2.5px solid transparent;
  text-decoration: none; cursor: pointer;
  transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease;
}
.btn svg { width: 19px; height: 19px; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--barn-deep); color: #fff7e9; box-shadow: var(--shadow-sm); }
.btn-primary:hover { background: var(--barn); color: #fff7e9; box-shadow: var(--shadow-md); }
.btn-secondary { background: transparent; color: var(--forest); border-color: var(--forest); }
.btn-secondary:hover { background: var(--forest); color: #fff7e9; }
.btn-gold { background: var(--gold-btn); color: var(--ink); box-shadow: var(--shadow-sm); }
.btn-gold:hover { background: var(--barn-deep); color: #fff7e9; }
.btn-ghost { background: rgba(255,253,248,.14); color: #fff7e9; border-color: rgba(255,247,233,.55); }
.btn-ghost:hover { background: #fff7e9; color: var(--forest-deep); }
.btn-lg { font-size: 1.1rem; padding: 1.05rem 1.9rem; min-height: 56px; }
.btn-block { width: 100%; }
.btn-row { display: flex; flex-wrap: wrap; gap: var(--s-3); }
.center .btn-row { justify-content: center; }

/* ---------- 9. Hero & the H2-over-H1 headline technique ---------- */
.hero { position: relative; color: #fff7e9; isolation: isolate; }
.hero-media { position: absolute; inset: 0; z-index: -2; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(110deg, rgba(31,51,36,.93) 0%, rgba(31,51,36,.78) 42%, rgba(31,51,36,.42) 100%);
}
.hero-inner { padding-block: clamp(3rem, 2rem + 7vw, 6.5rem); max-width: 760px; }
.headline-group { display: flex; flex-direction: column; gap: .35rem; }
.headline-group > h2 {
  order: 1;
  font-size: clamp(2.1rem, 1.3rem + 4.4vw, 4rem);
  font-weight: 600; line-height: 1.08; color: #fff7e9;
  letter-spacing: -.02em;
}
.headline-group > h1 {
  order: 2;
  font-size: clamp(1rem, .9rem + .7vw, 1.3rem);
  font-weight: 700; line-height: 1.4; color: var(--gold-lt);
  text-transform: none; letter-spacing: .01em;
}
.headline-group--light > h1 { color: var(--gold-lt); }
.headline-group--ink > h2 { color: var(--forest); }
.headline-group--ink > h1 { color: var(--barn-deep); }
.hero-lead { font-size: 1.18rem; margin-top: var(--s-4); max-width: 56ch; }
.hero .btn-row { margin-top: var(--s-6); }
.hero-trust {
  margin-top: var(--s-6); display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5);
  font-weight: 700; font-size: .96rem;
}
.hero-trust li { display: flex; align-items: center; gap: .45rem; }
.hero-trust svg { width: 20px; height: 20px; color: var(--gold-lt); flex-shrink: 0; }
.hero .eyebrow, .page-hero .eyebrow { color: var(--gold-lt); margin-bottom: .4rem; }
.page-hero { background: var(--forest-deep); color: #fff7e9; position: relative; isolation: isolate; }
.page-hero .hero-inner { padding-block: clamp(2.2rem, 1.5rem + 4vw, 4rem); }
.page-hero-media { position: absolute; inset: 0; z-index: -2; opacity: .26; }
.page-hero-media img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- 10. Eyebrow / section heading ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: .45rem;
  font-family: var(--font-script); font-size: 1.4rem; font-weight: 600;
  color: var(--barn); line-height: 1;
}
.eyebrow svg { width: 22px; height: 22px; }
.section-head { max-width: 760px; margin-bottom: var(--s-6); }
.section-head.center { margin-inline: auto; }
.section-head p { font-size: 1.1rem; color: var(--ink-soft); margin-top: var(--s-3); }
.section--forest .eyebrow { color: var(--gold-lt); }
.section--forest .section-head p { color: #ece2c8; }

/* ---------- 11. Cards ---------- */
.card {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: var(--s-5);
  box-shadow: var(--shadow-sm);
  transition: transform .2s ease, box-shadow .2s ease;
  height: 100%;
}
.card-hover:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.card-icon {
  width: 56px; height: 56px; border-radius: 14px;
  background: var(--cream-2); color: var(--barn);
  display: grid; place-items: center; margin-bottom: var(--s-3);
}
.card-icon svg { width: 30px; height: 30px; }
.card h3 { margin-bottom: var(--s-2); }
.card-link {
  display: inline-flex; align-items: center; gap: .4rem;
  font-weight: 800; color: var(--barn-deep); text-decoration: none;
  margin-top: var(--s-3);
}
.card-link svg { width: 16px; height: 16px; transition: transform .18s ease; }
.card-link:hover svg { transform: translateX(4px); }
.media-card {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow-sm);
  transition: transform .2s ease, box-shadow .2s ease; height: 100%;
  display: flex; flex-direction: column;
}
.media-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.media-card .thumb { aspect-ratio: 3/2; overflow: hidden; border-radius: var(--r-lg) var(--r-lg) 0 0; }
.media-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.media-card:hover .thumb img { transform: scale(1.06); }
.media-card .body { padding: var(--s-5); display: flex; flex-direction: column; flex: 1; }
.media-card .body h3 { margin-bottom: var(--s-2); }
.media-card .card-link { margin-top: auto; padding-top: var(--s-3); }

/* ---------- 12. Stat counters ---------- */
.stats { display: grid; gap: var(--s-5); grid-template-columns: repeat(2,1fr); }
@media (min-width: 760px) { .stats { grid-template-columns: repeat(4,1fr); } }
.stat { text-align: center; }
.stat-num {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(2.4rem, 1.6rem + 3vw, 3.6rem);
  color: var(--barn); line-height: 1;
}
.section--forest .stat-num { color: var(--gold-lt); }
.stat-label { font-weight: 700; margin-top: var(--s-2); }

/* ---------- 13. Feature list ---------- */
.checklist { display: grid; gap: var(--s-3); }
.checklist li { display: flex; gap: .65rem; align-items: flex-start; }
.checklist li svg {
  width: 24px; height: 24px; flex-shrink: 0; color: var(--barn);
  margin-top: 2px;
}
.section--forest .checklist li svg { color: var(--gold-lt); }

/* ---------- 14. Steps / timeline ---------- */
.steps { display: grid; gap: var(--s-5); counter-reset: step; }
@media (min-width: 900px) { .steps { grid-template-columns: repeat(4,1fr); } }
.step {
  position: relative; background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: var(--s-6) var(--s-5) var(--s-5);
}
.step-num {
  position: absolute; top: -22px; left: var(--s-5);
  width: 46px; height: 46px; border-radius: 50%;
  background: var(--barn-deep); color: #fff7e9;
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 600; font-size: 1.3rem;
}
.step h3 { margin: var(--s-2) 0; font-size: 1.2rem; }

/* ---------- 15. FAQ accordion ---------- */
.faq { display: grid; gap: var(--s-3); max-width: 860px; margin-inline: auto; }
.faq-item { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.faq-q {
  width: 100%; text-align: left; background: none; border: 0; cursor: pointer;
  padding: 1.2rem 1.4rem; display: flex; gap: var(--s-4);
  align-items: center; justify-content: space-between;
  font-family: var(--font-display); font-weight: 600; font-size: 1.12rem;
  color: var(--forest); min-height: 56px;
}
.faq-q:hover { color: var(--barn-deep); }
.faq-q .plus { width: 26px; height: 26px; flex-shrink: 0; position: relative; }
.faq-q .plus::before, .faq-q .plus::after {
  content: ""; position: absolute; background: var(--barn); border-radius: 2px;
  transition: transform .25s ease;
}
.faq-q .plus::before { top: 50%; left: 3px; right: 3px; height: 3px; transform: translateY(-50%); }
.faq-q .plus::after { left: 50%; top: 3px; bottom: 3px; width: 3px; transform: translateX(-50%); }
.faq-q[aria-expanded="true"] .plus::after { transform: translateX(-50%) scaleY(0); }
.faq-a { padding: 0 1.25rem; max-height: 0; overflow: hidden; transition: max-height .3s ease, padding .3s ease; }
.faq-a > div { padding-bottom: 1.2rem; }
.faq-a p { color: var(--ink-soft); }
.faq-item.open .faq-a { padding-block: .2rem; }

/* ---------- 16. Q&A / answer blocks (AEO) ---------- */
.qa-block {
  background: var(--cream-2); border-left: 5px solid var(--gold);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  padding: var(--s-5); margin-block: var(--s-5);
}
.qa-block h3 { color: var(--barn-deep); margin-bottom: var(--s-2); }
.qa-answer { font-weight: 700; }

/* ---------- 17. Savanna's note callout ---------- */
.note {
  background: var(--cream-2); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 1.3rem 1.5rem;
  display: grid; gap: .65rem; position: relative;
}
.note-quote { display: flex; align-items: flex-start; gap: .5rem; }
.note-mark { color: var(--gold-deep); display: flex; flex: none; margin-top: .15rem; }
.note-mark svg { width: 34px; height: 34px; }
.note p { font-family: var(--font-display); font-style: italic; font-size: 1.22rem; line-height: 1.4; color: var(--forest-deep); margin: 0; }
.note-sign { font-family: var(--font-script); font-size: 1.5rem; color: var(--forest); }

/* ---------- 18. Notices ---------- */
.notice {
  display: flex; gap: var(--s-3); align-items: flex-start;
  background: #fbf0d8; border: 1px solid var(--gold);
  border-radius: var(--r-md); padding: var(--s-4) var(--s-5);
}
.notice svg { width: 26px; height: 26px; color: var(--gold-deep); flex-shrink: 0; }
.notice strong { color: var(--barn-deep); }
.notice p { margin: 0; }

/* ---------- 19. Pricing ---------- */
.price-grid { display: grid; gap: var(--s-5); }
@media (min-width: 760px) { .price-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px) { .price-grid.cols-3 { grid-template-columns: repeat(3,1fr); } }
.price-card {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: var(--s-6); text-align: center;
  box-shadow: var(--shadow-sm); position: relative; height: 100%;
  display: flex; flex-direction: column;
}
.price-card.featured { border: 2.5px solid var(--gold); box-shadow: var(--shadow-md); }
.price-flag {
  position: absolute; top: -15px; left: 50%; transform: translateX(-50%);
  background: var(--barn-deep); color: #fff7e9; font-weight: 800;
  font-size: .82rem; padding: .35rem 1rem; border-radius: 999px; white-space: nowrap;
}
.price-card h3 { font-size: 1.35rem; }
.price-amt { font-family: var(--font-display); font-size: 3rem; color: var(--barn); line-height: 1; margin: var(--s-3) 0 var(--s-1); }
.price-amt span { font-size: 1rem; color: var(--ink-soft); font-family: var(--font-body); font-weight: 700; }
.price-meta { color: var(--ink-soft); font-weight: 700; }
.price-card .checklist { margin: var(--s-4) 0; text-align: left; }
.price-card .btn { margin-top: auto; }
.table-wrap { overflow-x: auto; border-radius: var(--r-md); border: 1px solid var(--line); }
table.data { width: 100%; border-collapse: collapse; background: var(--paper); min-width: 460px; }
table.data caption { text-align: left; font-weight: 700; color: var(--ink-soft); padding: var(--s-3); }
table.data th, table.data td { padding: .9rem 1rem; text-align: left; border-bottom: 1px solid var(--line); }
table.data thead th { background: var(--forest-deep); color: #fff7e9; font-weight: 800; }
table.data tbody tr:nth-child(even) { background: var(--cream); }
table.data tbody tr:hover { background: var(--cream-2); }
.slide {
  min-width: 100%; padding: var(--s-2);
  transition: opacity .4s ease; opacity: .25;
}
.slide[aria-hidden="false"] { opacity: 1; }

/* ---------- 21. CTA band ---------- */
.cta-band {
  background: radial-gradient(440px circle at 88% 14%, rgba(255,247,233,.09), transparent 62%), var(--barn-deep);
  color: #fff7e9;
  border-radius: var(--r-xl);
  padding: clamp(2.75rem, 2rem + 2.6vw, 4.25rem) clamp(1.5rem, 1rem + 2.5vw, 3.5rem);
  text-align: center;
}
.cta-band h2 { color: #fff7e9; }
.cta-band p { color: #f3e6d4; margin-inline: auto; max-width: 52ch; margin-top: var(--s-3); }
.cta-band .btn-row { justify-content: center; margin-top: var(--s-5); }

/* ---------- 22. Breadcrumbs ---------- */
.breadcrumb { padding-block: var(--s-3); font-size: .92rem; }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; }
.breadcrumb li { display: flex; align-items: center; gap: .3rem; color: var(--ink-soft); }
.breadcrumb a { color: var(--barn-deep); text-decoration: none; font-weight: 700; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb [aria-current="page"] { color: var(--ink-soft); }
.breadcrumb .sep { color: var(--line); display: inline-flex; align-items: center; }
.breadcrumb .sep .ic { width: 13px; height: 13px; transform: rotate(-90deg); }
.page-hero .breadcrumb a { color: var(--gold); }
.page-hero .breadcrumb li, .page-hero .breadcrumb [aria-current="page"] { color: #ece2c8; }
.page-hero .breadcrumb .sep { color: rgba(255,247,233,.4); }

/* ---------- 23. Prose ---------- */
.prose { max-width: var(--prose); margin-inline: auto; }
.prose > * + * { margin-top: var(--s-4); }
.prose h2 { margin-top: var(--s-7); }
.prose h3 { margin-top: var(--s-6); }
.prose ul, .prose ol { padding-left: 1.3rem; }
.prose ul li { list-style: none; position: relative; padding-left: 1.4rem; margin-block: .4rem; }
.prose ul li::before {
  content: ""; position: absolute; left: 0; top: .6em;
  width: 9px; height: 9px; background: var(--gold-deep);
  border-radius: 2px; transform: rotate(45deg);
}
.prose ol { list-style: decimal; }
.prose ol li { margin-block: .4rem; padding-left: .3rem; }
.prose blockquote {
  border-left: 5px solid var(--gold); background: var(--cream-2);
  padding: var(--s-4) var(--s-5); border-radius: 0 var(--r-md) var(--r-md) 0;
  font-family: var(--font-display); font-size: 1.2rem; color: var(--forest);
}
.prose figure { margin-block: var(--s-5); }
.prose figure img { border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }
.prose figcaption { font-size: .92rem; color: var(--ink-soft); margin-top: var(--s-2); font-style: italic; }
.toc {
  background: var(--cream-2); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: var(--s-5);
}
.toc h2 { font-size: 1.1rem; margin-bottom: var(--s-3); }
.toc ol { list-style: none; display: grid; gap: .3rem; counter-reset: toc; }
.toc li { counter-increment: toc; }
.toc a { display: flex; gap: .5rem; text-decoration: none; font-weight: 700; padding: .35rem 0; }
.toc a::before { content: counter(toc) "."; color: var(--barn-deep); }
.toc a:hover { color: var(--barn-deep); text-decoration: underline; }

/* ---------- 24. Tags / pills ---------- */
.tag-row { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.tag {
  display: inline-flex; align-items: center; gap: .35rem;
  background: var(--cream-2); border: 1px solid var(--line);
  padding: .35rem .85rem; border-radius: 999px;
  font-weight: 700; font-size: .9rem; color: var(--ink-soft);
}
.tag svg { width: 15px; height: 15px; color: var(--barn); }

/* ---------- 25. Horse flip cards ---------- */
.horse-card { perspective: 1200px; height: 360px; }
.horse-inner {
  position: relative; width: 100%; height: 100%;
  transition: transform .6s ease; transform-style: preserve-3d;
}
.horse-card.flipped .horse-inner,
.horse-card:hover .horse-inner { transform: rotateY(180deg); }
.horse-face {
  position: absolute; inset: 0; backface-visibility: hidden;
  border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}
.horse-front img { width: 100%; height: 100%; object-fit: cover; }
.horse-front .horse-name {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: linear-gradient(transparent, rgba(31,51,36,.92));
  color: #fff7e9; padding: var(--s-5) var(--s-4) var(--s-4);
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 600;
  display: flex; align-items: center; justify-content: space-between;
}
.horse-front .horse-name svg { width: 22px; height: 22px; color: var(--gold); }
.horse-back {
  transform: rotateY(180deg); background: var(--forest-deep); color: var(--cream);
  padding: var(--s-5); display: flex; flex-direction: column; justify-content: center; gap: var(--s-2);
}
.horse-back h3 { color: var(--gold-lt); }
.horse-back .horse-fact { font-size: .92rem; }

/* ---------- 26. Gallery / lightbox ---------- */
.gallery { display: grid; gap: var(--s-3); grid-template-columns: repeat(2,1fr); }
@media (min-width: 760px) { .gallery { grid-template-columns: repeat(4,1fr); } }
.gallery button {
  padding: 0; border: 0; cursor: pointer; border-radius: var(--r-md);
  overflow: hidden; background: none; aspect-ratio: 1;
}
.gallery button img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.gallery button:hover img { transform: scale(1.08); }
.lightbox {
  position: fixed; inset: 0; z-index: 2000; display: none;
  background: rgba(31,51,36,.95); padding: var(--s-5);
  align-items: center; justify-content: center;
}
.lightbox.open { display: flex; }
.lightbox img { max-width: 92vw; max-height: 82vh; border-radius: var(--r-md); }
.lightbox-close, .lightbox-nav {
  position: absolute; background: var(--paper); color: var(--forest);
  border: 0; cursor: pointer; border-radius: 50%;
  width: 52px; height: 52px; display: grid; place-items: center;
}
.lightbox-close { top: var(--s-5); right: var(--s-5); }
.lightbox-nav.prev { left: var(--s-4); top: 50%; transform: translateY(-50%); }
.lightbox-nav.next { right: var(--s-4); top: 50%; transform: translateY(-50%); }
.lightbox-cap { position: absolute; bottom: var(--s-5); left: 0; right: 0; text-align: center; color: #fff7e9; font-weight: 700; }

/* ---------- 27. Lesson finder quiz ---------- */
.quiz {
  background: var(--forest-deep); color: var(--cream);
  border-radius: var(--r-xl); padding: clamp(2rem, 1.6rem + 2.2vw, 3.4rem);
}
.quiz h2, .quiz h3 { color: #fff7e9; }
.quiz-step { display: none; }
.quiz-step.active { display: block; animation: fadeUp .35s ease; }
.quiz-progress { height: 8px; background: rgba(255,247,233,.18); border-radius: 999px; margin-bottom: var(--s-5); overflow: hidden; }
.quiz-progress span { display: block; height: 100%; background: var(--gold); transition: width .35s ease; }
.quiz-options { display: grid; gap: var(--s-4); margin-top: var(--s-4); }
@media (min-width: 620px) { .quiz-options { grid-template-columns: repeat(2,1fr); } }
.quiz-option {
  text-align: left; background: rgba(255,253,248,.06);
  border: 2px solid rgba(255,247,233,.3); color: #fff7e9;
  border-radius: var(--r-md); padding: var(--s-4); cursor: pointer;
  font-weight: 700; min-height: 64px; display: flex; align-items: center; gap: .7rem;
  transition: background-color .15s ease, border-color .15s ease;
}
.quiz-option:hover { background: rgba(255,247,233,.16); border-color: var(--gold); }
.quiz-option svg { width: 28px; height: 28px; color: var(--gold); flex-shrink: 0; }
.quiz-result { display: none; }
.quiz-result.active { display: block; animation: fadeUp .35s ease; }
.quiz-result .card { color: var(--ink); }
.quiz-step h3, .quiz-result h3 { margin-bottom: var(--s-3); text-align: center; }
.quiz .card h2, .quiz .card h3, .quiz .card h4 { color: var(--forest); }
.quiz .card p, .quiz .card { color: var(--ink); }

/* ---------- 28. Forms ---------- */
.form-card { background: transparent; border: 0; border-radius: 0; padding: 0; box-shadow: none; }
.form-grid { display: grid; gap: var(--s-4); }
@media (min-width: 620px) { .form-grid .span-2 { grid-column: 1 / -1; } .form-grid.two { grid-template-columns: 1fr 1fr; } }
.field label { display: block; font-weight: 800; margin-bottom: .35rem; }
.field .hint { font-weight: 600; color: var(--ink-soft); font-size: .9rem; }
.field .req { color: var(--barn); }
.field input, .field select, .field textarea {
  width: 100%; padding: .8rem .9rem; min-height: 48px;
  border: 2px solid var(--line); border-radius: var(--r-sm);
  background: var(--cream); color: var(--ink); font-size: 1rem;
}
.field textarea { min-height: 130px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: 3px solid var(--forest); outline-offset: 1px; border-color: var(--forest);
}
.field input:invalid:not(:placeholder-shown),
.field textarea:invalid:not(:placeholder-shown) { border-color: var(--barn); }
.form-error { color: var(--barn-deep); font-weight: 800; font-size: .9rem; margin-top: .25rem; }
.form-success {
  display: none; background: #e7efe1; border: 2px solid var(--forest-mid);
  border-radius: var(--r-md); padding: var(--s-5); text-align: center;
}
.form-success.show { display: block; }
.form-success svg { width: 52px; height: 52px; color: var(--forest-mid); margin: 0 auto var(--s-3); }
fieldset { border: 0; }
fieldset legend { font-weight: 800; margin-bottom: var(--s-2); }

/* ---------- 29. Footer ---------- */
.site-footer { background: var(--forest-deep); color: var(--cream); padding-top: var(--s-8); }
.footer-grid { display: grid; gap: var(--s-6); }
@media (min-width: 720px) { .footer-grid { grid-template-columns: 1.6fr 1fr 1fr 1.4fr; } }
.footer-brand .brand-name { color: #fff7e9; }
.footer-brand p { color: #d8cdb0; margin-top: var(--s-3); }
.footer-col h3 { color: var(--gold-lt); font-size: 1.1rem; margin-bottom: var(--s-3); }
.footer-col ul { display: grid; gap: .55rem; }
.footer-col a { color: #e6dcc2; text-decoration: none; font-weight: 600; }
.footer-col a:hover { color: #fff7e9; text-decoration: underline; }
.footer-contact li { display: flex; gap: .6rem; align-items: flex-start; color: #e6dcc2; margin-bottom: .6rem; }
.footer-contact svg { width: 20px; height: 20px; color: var(--gold-lt); flex-shrink: 0; margin-top: 3px; }
.footer-contact a { color: #e6dcc2; }
.social-row { display: flex; gap: var(--s-3); margin-top: var(--s-4); }
.social-row a {
  width: 46px; height: 46px; border-radius: 50%;
  background: rgba(255,247,233,.1); display: grid; place-items: center;
}
.social-row a:hover { background: var(--gold-deep); }
.social-row svg { width: 22px; height: 22px; color: #fff7e9; }
.footer-bar {
  margin-top: var(--s-7); border-top: 1px solid rgba(255,247,233,.16);
  padding-block: var(--s-5);
}
.footer-bar .container { display: flex; flex-wrap: wrap; gap: var(--s-3); justify-content: space-between; }
.footer-bar p, .footer-bar a { color: #d8cdb0; font-size: .9rem; }
.footer-bar nav { display: flex; flex-wrap: wrap; gap: var(--s-4); }
.footer-bar a { text-decoration: none; font-weight: 600; }
.footer-bar a:hover { color: #fff7e9; text-decoration: underline; }

/* ---------- 30. Back to top ---------- */
.to-top {
  position: fixed; right: var(--s-5); bottom: var(--s-5); z-index: 900;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--barn-deep); color: #fff7e9; border: 0; cursor: pointer;
  display: grid; place-items: center; box-shadow: var(--shadow-md);
  opacity: 0; visibility: hidden; transform: translateY(12px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s;
}
.to-top.show { opacity: 1; visibility: visible; transform: translateY(0); }
.to-top svg { width: 24px; height: 24px; }

/* ---------- 31. Decorative dividers ---------- */
.divider-hills { display: block; width: 100%; height: auto; color: var(--cream-2); }
.divider-hills.flip { transform: scaleY(-1); }
.split { display: grid; gap: var(--s-7); align-items: center; }
@media (min-width: 900px) {
  .split { grid-template-columns: 1fr 1fr; }
  .split.wide-left { grid-template-columns: 1.15fr .85fr; }
}
.split-media img { border-radius: var(--r-lg); box-shadow: var(--shadow-md); width: 100%; }
.split-media { position: relative; }
.frame-tag {
  position: absolute; bottom: -18px; left: -18px;
  background: var(--barn-deep); color: #fff7e9;
  font-family: var(--font-script); font-size: 1.5rem;
  padding: .4rem 1.1rem; border-radius: var(--r-md); box-shadow: var(--shadow-sm);
}
@media (max-width: 620px) { .frame-tag { left: 8px; bottom: 8px; font-size: 1.2rem; } }

/* ---------- 32. Animations ---------- */
@keyframes fadeUp { from { opacity: 0; } to { opacity: 1; } }
.reveal { opacity: 0; }
.reveal.in { animation: fadeUp .6s ease forwards; }
.reveal.d1 { animation-delay: .08s; }
.reveal.d2 { animation-delay: .16s; }
.reveal.d3 { animation-delay: .24s; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; animation: none !important; }
}

/* ---------- 33. Blog ---------- */
.post-meta { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); color: var(--ink-soft); font-weight: 700; font-size: .92rem; }
.post-meta span { display: flex; align-items: center; gap: .35rem; }
.post-meta svg { width: 16px; height: 16px; color: var(--barn); }
.article-hero img { width: 100%; border-radius: var(--r-lg); box-shadow: var(--shadow-md); }
.author-box {
  display: flex; gap: var(--s-4); align-items: center;
  background: var(--cream-2); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: var(--s-5);
}
.author-box .avatar {
  width: 72px; height: 72px; border-radius: 50%; flex-shrink: 0;
  background: var(--barn-deep); color: #fff7e9; display: grid; place-items: center;
  font-family: var(--font-display); font-size: 1.8rem;
}

/* ---------- 34. Utilities ---------- */
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.lead {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 1.1rem + 0.7vw, 1.6rem);
  font-weight: 400; line-height: 1.46; color: var(--forest);
}
.text-gold { color: var(--gold-deep); }
.nowrap { white-space: nowrap; }
.bg-pattern {
  background-color: var(--cream);
  background-image: radial-gradient(var(--cream-3) 1.1px, transparent 1.1px);
  background-size: 22px 22px;
}
.pill-list { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.hr-fence {
  border: 0; height: 14px; margin-block: var(--s-6);
  background:
    linear-gradient(var(--barn-deep),var(--barn-deep)) 8% 0/4px 100% no-repeat,
    linear-gradient(var(--barn-deep),var(--barn-deep)) 92% 0/4px 100% no-repeat,
    linear-gradient(var(--barn-deep),var(--barn-deep)) 0 3px/100% 3px no-repeat,
    linear-gradient(var(--barn-deep),var(--barn-deep)) 0 10px/100% 3px no-repeat;
}

/* ---------- 35. Mobile navigation ---------- */
@media (max-width: 979px) {
  .nav-toggle { display: inline-flex; }
  .nav-menu {
    position: fixed; inset: 0 0 auto auto; top: 0; right: 0;
    width: min(360px, 88vw); height: 100vh; height: 100dvh; max-height: 100dvh;
    background: linear-gradient(180deg,#fbf5e6 0%,#f2e8d1 100%);
    border-left: 1px solid var(--line);
    flex-direction: column; align-items: stretch; gap: 0;
    padding: calc(var(--header-h) + 1rem) var(--s-5) calc(var(--s-6) + env(safe-area-inset-bottom, 0px) + 1.5rem);
    overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    box-shadow: var(--shadow-lg); z-index: 1001;
    transform: translateX(102%); transition: transform .28s ease;
  }
  .nav-menu.open { transform: translateX(0); }
  .nav-list { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
  .nav-link { padding: .9rem .5rem; border-bottom: 1px solid var(--line); border-radius: 0; }
  .nav-link[aria-current="page"] { box-shadow: inset 4px 0 0 var(--gold); }
  .has-submenu > .submenu {
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: 0; border-bottom: 1px solid var(--line);
    border-radius: 0; padding: 0 0 var(--s-2) var(--s-4);
    display: none; min-width: 0;
  }
  .has-submenu > .submenu.open { display: block; }
  .nav-menu .btn { margin-top: var(--s-4); }
  .nav-backdrop {
    position: fixed; inset: 0; background: rgba(31,51,36,.5);
    z-index: 999; opacity: 0; visibility: hidden; transition: opacity .25s ease;
  }
  .nav-backdrop.show { opacity: 1; visibility: visible; }
  body.nav-open { overflow: hidden; }
}
@media (min-width: 980px) {
  .nav-toggle { display: none; }
  .nav-backdrop { display: none; }
}

/* ---------- 37. Blog content components ---------- */
.callout {
  display: flex; gap: var(--s-3); align-items: flex-start;
  border-radius: var(--r-md); padding: var(--s-5);
  margin: var(--s-5) 0; border: 1px solid var(--line);
}
.callout > svg { width: 28px; height: 28px; flex-shrink: 0; margin-top: 3px; }
.callout-body { flex: 1; }
.callout h3, .callout h4 { margin: 0 0 .3rem; font-size: 1.1rem; }
.callout p { margin: 0; }
.callout p + p { margin-top: .6rem; }
.callout--tip    { background: #e7efe1; border-color: #7d9469; }
.callout--tip > svg { color: var(--forest-mid); }
.callout--note   { background: var(--cream-2); border-color: var(--line); }
.callout--note > svg { color: var(--barn); }
.callout--local  { background: #fbf0d8; border-color: var(--gold); }
.callout--local > svg { color: var(--gold-deep); }
.callout--safety { background: #f6e6e1; border-color: #c98b7e; }
.callout--safety > svg { color: var(--barn-deep); }
.statcards { display: grid; gap: var(--s-3); margin: var(--s-6) 0; }
.statcards.c2 { grid-template-columns: repeat(2,1fr); }
.statcards.c3 { grid-template-columns: repeat(2,1fr); }
.statcards.c4 { grid-template-columns: repeat(2,1fr); }
@media (min-width: 720px) {
  .statcards.c3 { grid-template-columns: repeat(3,1fr); }
  .statcards.c4 { grid-template-columns: repeat(4,1fr); }
}
.statcard {
  background: var(--forest-deep); color: var(--cream);
  border-radius: var(--r-md); padding: var(--s-4); text-align: center;
}
.statcard .sc-num {
  font-family: var(--font-display); font-size: clamp(1.9rem,1.4rem + 1.6vw,2.4rem);
  color: var(--gold-lt); line-height: 1;
}
.statcard .sc-lab { font-weight: 700; font-size: .92rem; margin-top: .45rem; }
.pullquote {
  font-family: var(--font-display); font-size: clamp(1.25rem,1rem + 1.1vw,1.6rem);
  line-height: 1.4; color: var(--forest); font-weight: 500;
  border-top: 3px solid var(--gold); border-bottom: 3px solid var(--gold);
  padding: var(--s-5) var(--s-4); margin: var(--s-6) 0; text-align: center;
}
.pullquote cite { display: block; font-family: var(--font-script);
  font-size: 1.3rem; color: var(--barn); font-style: normal; margin-top: .5rem; }
.blog-figure { margin: var(--s-6) 0; }
.blog-figure img { border-radius: var(--r-lg); box-shadow: var(--shadow-sm); width: 100%; }
.blog-figure figcaption {
  font-size: .9rem; color: var(--ink-soft); font-style: italic;
  margin-top: .6rem; text-align: center;
}
.sources {
  background: var(--cream-2); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: var(--s-5) var(--s-6); margin-top: var(--s-6);
}
.sources h2 { font-size: 1.35rem; margin-bottom: var(--s-2); display: flex; align-items: center; gap: .5rem; }
.sources h2 svg { color: var(--barn); }
.sources > p { color: var(--ink-soft); font-size: .95rem; margin-bottom: var(--s-3); }
.sources ol { list-style: decimal; padding-left: 1.5rem; display: grid; gap: .65rem; }
.sources li { padding-left: .25rem; }
.sources li a { font-weight: 700; }
.sources .src-pub { color: var(--ink-soft); font-weight: 600; }

/* ---------- 38. Review refinements ---------- */
.section--forest .card { color: var(--ink); }
.section--forest .card h2,
.section--forest .card h3,
.section--forest .card h4 { color: var(--forest); }
.section--forest .card p { color: var(--ink-soft); }
.section--forest .card .checklist li { color: var(--ink); }
.section--forest .card .checklist li svg { color: var(--barn); }
.section--forest .card .card-link { color: var(--barn-deep); }
p.center { margin-inline: auto; }
.container-narrow > p { margin-inline: auto; text-align: center; }
.section--forest .lead, .section--forest .container-narrow > p { color: #fff7e9; }
.carousel .slide { min-width: 0; opacity: 1; padding: 0; }
.cta-band { padding: clamp(2rem, 1.6rem + 1.3vw, 2.9rem) clamp(1.5rem, 1.1rem + 1.8vw, 3rem); }
.site-footer a.btn-gold { color: var(--ink); }
main p a, .prose a, article p a {
  text-decoration-color: var(--barn);
  text-underline-offset: 5px;
}
.faq-q { padding: 1.2rem 1.4rem; }
.map-embed {
  width: 100%; aspect-ratio: 4 / 3; border: 0;
  border-radius: var(--r-lg); box-shadow: var(--shadow-md); display: block;
}

/* ---------- 39. Intro & quiz polish ---------- */
.container-narrow > p + p { margin-top: var(--s-5); }
.container-narrow > p:not(.lead) {
  font-family: var(--font-display);
  font-size: 1.14rem; line-height: 1.6; color: var(--ink-soft);
}
.section--forest .container-narrow > p:not(.lead) { color: #ece2c8; }
.table-wrap + p { text-align: center; margin-inline: auto; }

/* ---------- 36. Print ---------- */
@media print {
  .topbar, .site-header, .site-footer, .to-top, .cta-band, .nav-backdrop { display: none !important; }
  body { background: #fff; color: #000; }
  a { color: #000; text-decoration: underline; }
}

/* ======================================================================
   v2.1 additions — rustic-themed styles for components added after v1
   (gallery, Before-You-Ride, trail offer cards, 4-col pricing, AI-cite)
   + alias vars so content blocks authored with elegant var names resolve.
   ====================================================================== */
:root{
  --ivory:var(--cream); --ivory-2:var(--cream-2); --ivory-3:var(--cream-3);
  --char:var(--forest-deep); --char-2:var(--forest-mid); --char-3:var(--forest);
  --serif:var(--font-display); --sans:var(--font-body);
  --gold-text:var(--gold-deep); --ink-mute:#6b6253; --line-soft:#e9dcc0;
  --sage-deep:var(--moss); --pad:clamp(3.5rem,2.5rem + 4vw,6rem);
}

/* trail offer cards */
.offer-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow-sm);transition:transform .35s,box-shadow .35s}
.offer-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.offer-media{aspect-ratio:16/10;overflow:hidden}
.offer-media img{width:100%;height:100%;object-fit:cover;transition:transform 1s ease}
.offer-card:hover .offer-media img{transform:scale(1.05)}
.offer-body{padding:1.8rem 1.8rem 2rem;display:flex;flex-direction:column;flex:1}
.offer-tag{font-family:var(--font-body);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--barn-deep);font-weight:800;display:inline-flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.offer-body h3{margin-bottom:.6rem}
.offer-body p{color:var(--ink-soft);margin-bottom:1.3rem}
.offer-body .btn{margin-top:auto;align-self:flex-start}

/* Before You Ride grid */
.byr-grid{display:grid;gap:1.3rem;grid-template-columns:1fr}
@media(min-width:640px){.byr-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.byr-grid{grid-template-columns:repeat(3,1fr)}}
.byr-item{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.6rem 1.5rem;
  box-shadow:var(--shadow-sm)}
.byr-item .card-icon{margin-bottom:.85rem}
.byr-item h3{font-size:1.2rem;margin-bottom:.4rem}
.byr-item p{color:var(--ink-soft);font-size:.97rem}

/* 4-up pricing grid */
.price-grid.cols-4{display:grid;gap:1.4rem;grid-template-columns:1fr}
@media(min-width:680px){.price-grid.cols-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.price-grid.cols-4{grid-template-columns:repeat(4,1fr)}}

/* ---- Gallery (filterable masonry) ---- */
.gallery-filters{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-bottom:2.2rem}
.gal-filter{font-family:var(--font-body);font-weight:700;font-size:.82rem;letter-spacing:.03em;
  background:var(--paper);border:1px solid var(--line);color:var(--ink);padding:.7rem 1.3rem;cursor:pointer;
  border-radius:40px;transition:.2s;min-height:44px}
.gal-filter:hover{border-color:var(--gold);background:var(--cream-2)}
.gal-filter[aria-pressed=true]{background:var(--forest-deep);color:#fff7e9;border-color:var(--forest-deep)}
.gallery-grid{columns:3 280px;column-gap:1rem}
@media(max-width:640px){.gallery-grid{columns:2 150px;column-gap:.7rem}}
.gal-item{break-inside:avoid;margin:0 0 1rem;position:relative;overflow:hidden;border-radius:var(--r-md);
  cursor:pointer;background:var(--cream-2);display:block;width:100%;border:0;padding:0}
.gal-item img{width:100%;display:block;transition:transform .9s ease}
.gal-item::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(31,51,36,.62));
  opacity:0;transition:opacity .35s}
.gal-item:hover img{transform:scale(1.05)}
.gal-item:hover::after{opacity:1}
.gal-cap{position:absolute;left:0;right:0;bottom:0;padding:1rem;color:#fff7e9;font-family:var(--font-display);
  font-size:1.15rem;opacity:0;transform:translateY(8px);transition:.35s;z-index:2;text-align:left}
.gal-item:hover .gal-cap{opacity:1;transform:none}
.gal-item.is-hidden{display:none}

/* ---- AI citation block ---- */
.ai-cite{background:var(--cream-2);border-top:2px solid var(--gold)}
.ai-cite .container{padding-top:2rem;padding-bottom:2rem}
.ai-cite h2{font-size:1rem;letter-spacing:.04em;text-transform:uppercase;color:var(--barn-deep);
  font-family:var(--font-body);font-weight:800;margin-bottom:.7rem}
.ai-cite p{margin-bottom:.5rem;max-width:80ch;font-size:.88rem;color:var(--ink-soft)}
.ai-cite code{background:var(--paper);padding:.1rem .4rem;border-radius:var(--r-sm);font-size:.85em}

/* ======================================================================
   v3.1 refinements — nav CTA, 2-line hero, AI-cite accordion, a11y focus
   ====================================================================== */
/* keep nav labels + CTA on one line so nothing wraps into a "circle" */
.btn { white-space: nowrap; }
.nav-link { white-space: nowrap; }
.site-header .nav-menu .btn-primary {
  border-radius: 999px; padding: .7rem 1.4rem; white-space: nowrap;
}
@media (min-width: 941px){
  .nav-list { gap: clamp(.7rem, .2rem + .9vw, 1.5rem); }
  .nav-menu { gap: clamp(.8rem, .3rem + 1vw, 1.6rem); }
}

/* hero headline: cap at ~2 lines on desktop, balanced */
.hero .headline-group > h2 { max-width: none; font-size: clamp(1.9rem, 1.2rem + 3.1vw, 3.5rem); }

/* AI citation -> collapsed, centered, native-looking accordion */
.ai-cite .container { display: flex; justify-content: center; }
.ai-cite-acc {
  width: 100%; max-width: 74ch; margin: 0 auto; background: var(--paper);
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
}
.ai-cite-acc summary {
  cursor: pointer; list-style: none; display: flex; align-items: center; gap: .6rem;
  padding: .9rem 1.3rem; font-family: var(--font-body); font-weight: 800;
  font-size: .8rem; letter-spacing: .04em; text-transform: uppercase;
  color: var(--barn-deep); min-height: 44px;
}
.ai-cite-acc summary::-webkit-details-marker { display: none; }
.ai-cite-acc summary::after {
  content: ""; width: 9px; height: 9px; margin-left: auto;
  border-right: 2px solid var(--barn-deep); border-bottom: 2px solid var(--barn-deep);
  transform: rotate(45deg); transition: transform .25s;
}
.ai-cite-acc[open] summary::after { transform: rotate(-135deg); }
.ai-cite-acc[open] summary { border-bottom: 1px solid var(--line); }
.ai-cite-body { padding: 1.2rem 1.4rem; text-align: left; }
.ai-cite-body p { margin-bottom: .6rem; }

/* ---- WCAG 2.1 AA: visible focus on every interactive element ---- */
a:focus-visible, button:focus-visible, summary:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible,
[tabindex]:focus-visible, .quiz-option:focus-visible, .gal-filter:focus-visible,
.gal-item:focus-visible, .horse-card:focus-visible, .area-pin:focus-visible {
  outline: 3px solid var(--barn-deep); outline-offset: 2px; border-radius: 3px;
}
.section--forest a:focus-visible, .section--char a:focus-visible,
.hero a:focus-visible, .page-hero a:focus-visible, .site-footer a:focus-visible {
  outline-color: var(--gold-lt);
}
/* ensure tap targets are comfortable */
.nav-link, .footer-col a, .submenu a, .tag, .card-link { min-height: 32px; }
.cine-slide.is-active { opacity: 1; transform: none; pointer-events: auto; }
.cine-slide.is-active .cine-star {
  animation: starPop .55s cubic-bezier(.2,1.5,.4,1) forwards;
  animation-delay: calc(var(--i) * .11s + .12s);
}
@keyframes starPop { to { opacity: 1; transform: none; } }
.cine-dot.is-active::before { background: var(--barn-deep); width: 26px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) {
  .cine-slide.is-active .cine-star { animation: none; opacity: 1; transform: none; }
}
.ride-trail.in .ride-trail-prog { stroke-dashoffset: 0; }
.ride-step:hover .ride-step-badge .num { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .ride-trail.in .ride-trail-prog { transition: none; stroke-dashoffset: 0; }
}

/* ======================================================================
   Interactive "Areas We Serve" map (Anne Arundel County)
   ====================================================================== */
.areas-map-sec { overflow: hidden; }
@keyframes farmPulse {
  0% { transform: translate(-50%,-50%) scale(1); opacity: .55; }
  100% { transform: translate(-50%,-50%) scale(2.8); opacity: 0; }
}

/* ======================================================================
   "Before you load up" interactive rule cards (trails resource)
   ====================================================================== */
.rule-grid { display: grid; gap: 1.2rem; margin-top: 2.6rem; }
@media (min-width: 620px) { .rule-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .rule-grid { grid-template-columns: repeat(4, 1fr); } }
.rule-card {
  position: relative; text-align: left; background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 1.7rem 1.5rem 1.6rem; cursor: pointer; font: inherit;
  display: flex; flex-direction: column; gap: .9rem; overflow: hidden;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .35s, background .35s;
}
.rule-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--gold); transform: scaleY(0); transform-origin: top; transition: transform .35s;
}
.rule-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--gold); }
.rule-card:hover::before { transform: scaleY(1); }
.rule-ic {
  width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center;
  background: var(--cream-2); color: var(--barn-deep); transition: .35s;
}
.rule-ic svg { width: 26px; height: 26px; }
.rule-card:hover .rule-ic { background: var(--barn-deep); color: #fff7e9; transform: rotate(-6deg); }
.rule-body b { display: block; font-family: var(--font-display); font-size: 1.2rem; color: var(--forest-deep); margin-bottom: .35rem; }
.rule-body span { color: var(--ink-soft); font-size: .95rem; }
.rule-check {
  position: absolute; top: 1rem; right: 1rem; width: 30px; height: 30px; border-radius: 50%;
  border: 2px solid var(--line); display: grid; place-items: center; color: transparent;
  transition: .3s; transform: scale(.7);
}
.rule-check svg { width: 18px; height: 18px; }
.rule-card[aria-pressed="true"] { background: #f3f7f0; border-color: var(--forest-mid); }
.rule-card[aria-pressed="true"]::before { transform: scaleY(1); background: var(--forest-mid); }
.rule-card[aria-pressed="true"] .rule-check { border-color: var(--forest-mid); background: var(--forest-mid); color: #fff7e9; transform: scale(1); }
.rule-card[aria-pressed="true"] .rule-ic { background: var(--forest-mid); color: #fff7e9; }
@media (prefers-reduced-motion: reduce) { .rule-card, .rule-ic, .rule-check, .rule-card::before { transition: none; } }

/* always-visible tappable legend below the map (mobile + a11y) */
.area-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin: 2rem auto 0; max-width: 760px; }
.area-legend a {
  display: inline-flex; align-items: center; gap: .35rem; font-size: .85rem; font-weight: 700;
  color: var(--forest-deep); background: var(--paper); border: 1px solid var(--line);
  border-radius: 40px; padding: .5rem .9rem; min-height: 40px; transition: .2s;
}
.area-legend a:hover { border-color: var(--gold); background: var(--cream-2); color: var(--barn-deep); }
.area-legend a svg { width: 15px; height: 15px; color: var(--barn); }

/* ---- living hero: slow Ken Burns motion (reduced-motion aware) ---- */
@media (prefers-reduced-motion: no-preference) {
  .hero-media img { animation: heroKen 26s ease-in-out infinite alternate; transform-origin: 58% 42%; will-change: transform; }
  @keyframes heroKen { from { transform: scale(1.04); } to { transform: scale(1.13); } }
}
.hero-media { overflow: hidden; }
/* hero supports a <video> background too (drop-in when real footage is provided) */
.hero-media video { width: 100%; height: 100%; object-fit: cover; }

/* ---- real map embed frame (areas we serve) ---- */
.area-embed {
  max-width: 600px; margin: 2rem auto 0; border-radius: var(--r-lg); overflow: hidden;
  border: 1px solid var(--line); box-shadow: var(--shadow-md); aspect-ratio: 16 / 10; background: var(--cream-2);
}
.area-embed iframe { width: 100%; height: 100%; border: 0; display: block; filter: saturate(.92); }
@media (max-width: 640px) { .area-embed { aspect-ratio: 3 / 4; } }

/* ======================================================================
   Maryland Horse Trail Finder tool
   ====================================================================== */
.tf { display: grid; gap: 1.8rem; }
@media (min-width: 900px) { .tf { grid-template-columns: 320px 1fr; align-items: start; } }
.tf-controls {
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 1.5rem 1.4rem; box-shadow: var(--shadow-sm);
}
@media (min-width: 900px) { .tf-controls { position: sticky; top: 96px; } }
.tf-controls-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.1rem; }
.tf-controls-head h2 { font-size: 1.4rem; }
.tf-reset {
  display: inline-flex; align-items: center; gap: .35rem; background: none; border: 1px solid var(--line);
  border-radius: 40px; padding: .45rem .85rem; font: inherit; font-size: .82rem; font-weight: 700;
  color: var(--barn-deep); cursor: pointer; min-height: 38px; transition: .2s;
}
.tf-reset:hover { background: var(--cream-2); border-color: var(--gold); }
.tf-reset svg { width: 15px; height: 15px; }
.tf-filters { display: grid; gap: 1.4rem; }
.tf-filter { border: 0; padding: 0; margin: 0; }
.tf-filter legend { font-family: var(--font-display); font-size: 1.1rem; color: var(--forest-deep); font-weight: 600; padding: 0; }
.tf-hint { font-size: .82rem; color: var(--ink-mute); margin: .2rem 0 .6rem; }
.tf-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.tf-chip {
  font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer;
  background: var(--cream); border: 1.5px solid var(--line); color: var(--ink);
  border-radius: 40px; padding: .55rem .95rem; min-height: 40px; transition: .18s;
}
.tf-chip:hover { border-color: var(--gold); background: var(--cream-2); }
.tf-chip[aria-checked="true"] {
  background: var(--forest-deep); border-color: var(--forest-deep); color: #fff7e9;
}
.tf-chip[aria-checked="true"]::before { content: "\2713  "; font-weight: 800; }
/* results */
.tf-count { font-family: var(--font-display); font-style: italic; font-size: 1.15rem; color: var(--barn-deep); margin-bottom: 1.1rem; }
.tf-grid { display: grid; gap: 1.2rem; }
@media (min-width: 600px) { .tf-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .tf-grid { grid-template-columns: repeat(2, 1fr); } }
.tf-card {
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 1.5rem 1.4rem 1.3rem; display: flex; flex-direction: column; gap: .5rem;
  transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s, border-color .3s;
}
.tf-card:hover, .tf-card:focus-within { transform: translateY(-5px); box-shadow: var(--shadow-md); border-color: var(--gold); }
.tf-card.tf-ours { border-color: var(--barn); background: linear-gradient(180deg, #fff8ef, var(--paper)); }
.tf-card.tf-ours::before { content: "Our farm"; align-self: flex-start; font-size: .64rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #fff7e9; background: var(--barn-deep); padding: .2rem .6rem; border-radius: 30px; margin-bottom: .2rem; }
.tf-card-top { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; }
.tf-card-top h3 { font-size: 1.3rem; line-height: 1.15; }
.tf-miles { font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--gold-deep); white-space: nowrap; }
.tf-area { font-size: .85rem; color: var(--ink-mute); display: flex; align-items: center; gap: .3rem; }
.tf-area svg { width: 14px; height: 14px; color: var(--barn); }
.tf-blurb { color: var(--ink-soft); font-size: .96rem; }
.tf-meta { display: flex; flex-wrap: wrap; gap: .4rem; }
.tf-pill { display: inline-flex; align-items: center; gap: .3rem; font-size: .74rem; font-weight: 700; color: var(--forest-deep); background: var(--cream-2); border-radius: 30px; padding: .25rem .6rem; }
.tf-pill svg { width: 14px; height: 14px; color: var(--barn-deep); }
.tf-badge { font-size: .68rem; }
.tf-card-foot { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: auto; padding-top: .7rem; border-top: 1px solid var(--line-soft); flex-wrap: wrap; }
.tf-drive { display: inline-flex; align-items: center; gap: .35rem; font-size: .82rem; font-weight: 700; color: var(--ink-soft); }
.tf-drive svg { width: 15px; height: 15px; color: var(--barn-deep); }
.tf-empty { text-align: center; padding: 2.5rem 1rem; color: var(--ink-soft); }
.tf-empty svg { width: 20px; height: 20px; color: var(--barn-deep); vertical-align: -.2em; }
@media (prefers-reduced-motion: reduce) { .tf-card { transition: none; } }

/* ---- center interior-page heroes to match their centered content below ---- */
.page-hero .hero-inner { text-align: center; margin-inline: auto; max-width: 920px; }
.page-hero .headline-group { align-items: center; }
.page-hero .headline-group > h1 { margin-inline: auto; }
.page-hero .headline-group > h2 { margin-inline: auto; }

/* ---- compact, grouped nav dropdowns ---- */
.submenu { min-width: 236px; padding: .45rem .4rem; }
.submenu li a { padding: .5rem .8rem; min-height: 40px; display: flex; align-items: center; line-height: 1.2; }
.submenu li a span { display: none; }            /* label-only = compact */
.submenu-group { padding: .65rem .8rem .2rem; pointer-events: none; }
.submenu-group span {
  font-family: var(--font-body); font-size: .64rem; font-weight: 800; letter-spacing: .15em;
  text-transform: uppercase; color: var(--gold-deep);
}
.submenu-group:not(:first-child) { border-top: 1px solid var(--line-soft); margin-top: .25rem; }
/* on mobile the submenu is inline; keep groups readable */
@media (max-width: 940px){ .submenu-group span { color: var(--gold-lt); } }

/* ---- hero background video + accessible pause control ---- */
.hero-video { width: 100%; height: 100%; object-fit: cover; display: block; }

/* fix: [hidden] must beat .tf-card's display:flex */
.tf-card[hidden] { display: none !important; }

/* welcome section headline: one line on desktop + space before paragraph */
.welcome-title {
  font-size: clamp(1.55rem, 1.05rem + 1.5vw, 1.95rem);
  line-height: 1.2; margin-bottom: 1.15rem;
}
@media (min-width: 1080px) { .welcome-title { white-space: nowrap; } }

/* real brand logo (header = colour on cream, footer = white on dark) */
.brand-logo { width: auto; display: block; }
.site-footer .brand { margin-bottom: .5rem; }
.site-footer .brand img.brand-logo { height: 92px; }
@media (max-width: 600px){
  :root { --header-h: 74px; }
  .brand img.brand-logo { height: 54px; }
  .site-footer .brand img.brand-logo { height: 78px; }
}

/* ============================================================
   CONTRAST FIX — non-button links legible on every background
   ============================================================ */
.section--forest a:not(.btn), .section--char a:not(.btn),
.cta-band a:not(.btn), .page-hero a:not(.btn), .hero a:not(.btn) {
  color: var(--gold-lt); text-decoration-color: var(--gold);
}
.section--forest a:not(.btn):hover, .section--char a:not(.btn):hover,
.cta-band a:not(.btn):hover, .page-hero a:not(.btn):hover, .hero a:not(.btn):hover {
  color: #fff7e9;
}

/* ============================================================
   MOBILE HARDENING — no overflow, readable sizes, sane stacking
   ============================================================ */
html, body { overflow-x: hidden; max-width: 100%; }
img, picture, video, iframe, svg, table { max-width: 100%; }
h1, h2, h3, .headline-group > h2, .section-head h2, .cine-quote, .welcome-title { overflow-wrap: break-word; }

/* home hero: keep the two forced lines from wrapping into 4 on small phones */
@media (max-width: 600px){
  .hero .headline-group > h2 { font-size: clamp(1.5rem, 1rem + 4vw, 2.1rem); }
}

@media (max-width: 760px){
  /* interior-page heroes: cap so long titles stay within ~3 lines */
  .page-hero .headline-group > h2 { font-size: clamp(1.6rem, 1.1rem + 4vw, 2.3rem); line-height: 1.12; }
  .page-hero { min-height: clamp(360px, 56vh, 460px); }
  /* generous-but-not-huge section rhythm on phones */
  .section { padding-top: clamp(2.4rem, 1.5rem + 6vw, 3.4rem); padding-bottom: clamp(2.4rem, 1.5rem + 6vw, 3.4rem); }
  /* trail finder: filters sit above results, comfortable spacing */
  .tf-controls { position: static; }
  /* tables scroll instead of breaking the layout */
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* stat numbers shouldn't dominate the screen */
  .stat-num, .sc-num { font-size: clamp(2rem, 1.4rem + 5vw, 2.8rem); }
}

@media (max-width: 480px){
  /* avoid oversized section headings on the smallest screens */
  h2 { font-size: clamp(1.5rem, 1.2rem + 3vw, 2rem); }
  .section-head h2 { font-size: clamp(1.5rem, 1.2rem + 3vw, 2rem); }
  .cta-band h2 { font-size: clamp(1.5rem, 1.2rem + 3vw, 2rem); }
  /* prevent any inline-styled wide buttons from overflowing */
  .btn { white-space: normal; }
  .btn-row { width: 100%; }
  .btn-row .btn { flex: 1 1 auto; justify-content: center; }
  /* area map taller-but-bounded so it isn't a sliver */
  .area-embed { aspect-ratio: 1 / 1; }
}

/* ============================================================
   Richer audience-page sections: myth-buster, timeline, fact bar
   ============================================================ */
.timeline { list-style: none; position: relative; margin: 2.4rem auto 0; padding-left: 2rem; max-width: 640px; }
.timeline::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: var(--line); }
.tl-item { position: relative; padding: 0 0 1.7rem 1.4rem; }
.tl-item:last-child { padding-bottom: 0; }
.tl-dot { position: absolute; left: -2rem; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--barn-deep); border: 3px solid var(--cream); box-shadow: 0 0 0 2px var(--line); }
.tl-when { font-family: var(--font-body); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-deep); }
.tl-item h3 { font-size: 1.2rem; margin: .15rem 0 .3rem; }
.tl-item p { color: var(--ink-soft); }

.fact-bar { display: grid; gap: 1px; background: rgba(230,220,194,.16); border: 1px solid rgba(230,220,194,.16); border-radius: var(--r-lg); overflow: hidden; margin-top: 2rem; grid-template-columns: 1fr; }
@media (min-width: 560px){ .fact-bar { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 900px){ .fact-bar { grid-template-columns: repeat(4,1fr); } }
.fact-cell { background: var(--forest); padding: 1.6rem 1.2rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: .25rem; }
.fact-ic svg { width: 26px; height: 26px; color: var(--gold-lt); }
.fact-v { font-family: var(--font-display); font-size: 1.45rem; color: #fff7e9; line-height: 1.15; margin-top: .3rem; }
.fact-l { font-size: .85rem; color: #d8cdb0; }

/* ============================================================
   Stat band — full-bleed photo, dark veil, flex-centered (bulletproof)
   ============================================================ */
.statband { position: relative; isolation: isolate; overflow: hidden; color: #fff7e9;
  padding-block: clamp(2.8rem, 2rem + 3vw, 4.6rem); }
.statband-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 42%; }
.statband-bg ~ picture, .statband > picture { position: absolute; inset: 0; z-index: -2; }
.statband-veil { position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(20,36,24,.84), rgba(40,25,16,.88)); }
.statband::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(120% 72% at 50% 0%, rgba(214,168,74,.24), transparent 58%); }
.statband-inner { max-width: 660px; margin-inline: auto;
  display: flex; flex-direction: column; align-items: center; text-align: center; }
.statband-kicker { display: inline-flex; align-items: center; gap: .55rem; color: var(--gold-lt); margin-bottom: .7rem; }
.statband-kicker svg { width: 24px; height: 24px; }
.statband-kicker .kr-line { width: 32px; height: 1px; background: var(--gold-lt); opacity: .55; }
.statband-num { font-family: var(--font-display); font-size: clamp(2.7rem, 1.9rem + 4vw, 4.6rem); font-weight: 600; color: var(--gold-lt); line-height: 1.04; letter-spacing: -.01em; }
.statband-num::after { content: ""; display: block; width: 0; height: 3px; margin: .75rem auto 0; border-radius: 3px;
  background: linear-gradient(90deg, transparent, var(--gold) 30%, var(--gold) 70%, transparent); transition: width 1.1s cubic-bezier(.2,.7,.2,1) .25s; }
.statband-inner.in .statband-num::after { width: 130px; }
.statband-label { font-size: 1.08rem; font-weight: 700; color: #fff7e9; margin: .9rem 0 0; max-width: 44ch; }
.statband-body { font-size: 1.02rem; max-width: 54ch; margin: 1.05rem 0 0; color: #e9dfc6; }
.statband-src { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1.5rem;
  font-size: .82rem; font-weight: 700; color: var(--cream);
  background: rgba(255,247,233,.10); border: 1px solid rgba(255,247,233,.24);
  padding: .5rem .95rem; border-radius: 30px; transition: background .3s, border-color .3s, color .3s; }
.statband-src:hover, .statband-src:focus-visible { background: rgba(214,168,74,.22); border-color: var(--gold); color: #fff7e9; }
.statband-src svg { width: 14px; height: 14px; flex: none; }

/* Editorial drop cap on intro lead paragraphs */
.lead { font-size: clamp(1.15rem, 1.05rem + .5vw, 1.4rem); line-height: 1.6; color: var(--ink); }
.lead::first-letter { float: left; font-family: var(--font-display); font-weight: 600; font-size: 3.5em;
  line-height: .82; padding: .04em .12em 0 0; color: var(--barn); }
@media (prefers-reduced-motion: reduce){ .statband-num::after { transition: none; } }

/* ============================================================
   Myth-buster — worry -> truth cards (polished + animated)
   ============================================================ */
.myth-grid { display: grid; gap: 1.5rem; margin-top: 2.8rem; }
@media (min-width: 760px){ .myth-grid { grid-template-columns: repeat(3, 1fr); } }
.myth-card { position: relative; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-xl); padding: 2.4rem 1.7rem 2rem; text-align: center; overflow: hidden;
  transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s, border-color .45s; }
.myth-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 5px; background: linear-gradient(90deg, var(--barn), var(--gold) 55%, var(--forest-mid)); }
.myth-card:hover { transform: translateY(-9px); box-shadow: var(--shadow-lg); border-color: var(--gold); }
.myth-badge { width: 66px; height: 66px; margin: 0 auto 1.3rem; border-radius: 50%; background: var(--cream-2); color: var(--barn-deep); display: grid; place-items: center; box-shadow: inset 0 0 0 2px var(--line); transition: .45s cubic-bezier(.2,1.4,.4,1); }

.myth-badge svg { width: 30px; height: 30px; }
.myth-card:hover .myth-badge { background: var(--forest-deep); color: var(--gold-lt); transform: rotate(-10deg) scale(1.08); }
.myth-tag { display: inline-flex; align-items: center; gap: .35rem; font-family: var(--font-body); font-size: .63rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; padding: .28rem .65rem; border-radius: 30px; margin-bottom: .55rem; }
.myth-tag svg { width: 13px; height: 13px; }
.myth-tag--no { background: #f6e3df; color: #a4392a; }
.myth-tag--yes { background: #e3efdf; color: #2c7a3c; }
.myth-worry p { font-style: italic; color: var(--ink-soft); font-size: 1.05rem; margin: 0; }
.myth-bridge { display: flex; align-items: center; justify-content: center; gap: .55rem; margin: 1.15rem 0; color: var(--gold-deep); }
.myth-bridge span { height: 1px; width: 26px; background: var(--line); display: inline-block; }
.myth-bridge svg { width: 22px; height: 22px; transition: transform .5s ease; }
.myth-card:hover .myth-bridge svg { transform: rotate(360deg); }
.myth-truth p { font-weight: 600; color: var(--forest-deep); margin: 0; font-size: 1.04rem; line-height: 1.5; }
.myth-truth a { color: var(--barn-deep); font-weight: 700; }

/* ============================================================
   Homepage reviews band — testimonial cards w/ floating quote badge
   ============================================================ */
.reviews-band { position: relative; isolation: isolate; overflow: hidden;
  padding-block: clamp(2.8rem, 2rem + 3vw, 4.4rem);
  background: var(--rev-img) center/cover no-repeat fixed; }
.reviews-band::before { content:""; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(180deg, rgba(26,42,30,.9), rgba(46,28,20,.86)); }
.reviews-band::after { content:""; position:absolute; inset:0; z-index:-1;
  background: radial-gradient(120% 75% at 50% 0%, rgba(214,168,74,.22), transparent 58%); }
.reviews-band-head { margin-bottom: clamp(1.6rem, 1rem + 1.8vw, 2.6rem); }
.reviews-band-head h2 { color: #fff7e9; }
.reviews-band-head .eyebrow { color: var(--gold-lt); }
.reviews-band-head p { color: #ece2c8; max-width: 56ch; margin-inline: auto; }
.rev-grid { display: grid; gap: 1.5rem; grid-template-columns: 1fr; padding-top: 26px; }
@media (min-width: 700px){ .rev-grid { grid-template-columns: repeat(3, 1fr); } }
.rev-card { position: relative; text-align: left; display: flex; flex-direction: column; overflow: visible;
  background: #fffdf7; border: 1px solid rgba(255,247,233,.6); border-radius: var(--r-xl);
  padding: 1.9rem 1.5rem 1.5rem; box-shadow: 0 16px 36px rgba(0,0,0,.30);
  transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s; }
.rev-card:hover, .rev-card:focus-within { transform: translateY(-9px); box-shadow: 0 28px 54px rgba(0,0,0,.42); }
.rev-qmark { position: absolute; top: -22px; left: 22px; width: 50px; height: 50px; border-radius: 50%;
  display: grid; place-items: center; color: var(--forest-deep);
  background: linear-gradient(150deg, var(--gold-lt), var(--gold-deep));
  box-shadow: 0 8px 18px rgba(140,90,20,.4); transition: transform .45s cubic-bezier(.2,1.4,.4,1); }
.rev-card:hover .rev-qmark { transform: rotate(-9deg) scale(1.08); }
.rev-qmark svg { width: 26px; height: 26px; }
.rev-stars { display: inline-flex; gap: .3rem; margin: .2rem 0 .8rem; }
.rev-star { display: inline-block; width: 19px; height: 19px; color: var(--gold-deep); flex: none; opacity: 0; transform: scale(.3) rotate(-30deg); }
.rev-card.in .rev-star { animation: starPop .5s cubic-bezier(.2,1.4,.4,1) forwards; animation-delay: calc(var(--i) * .08s + .2s); }
.rev-quote { font-family: var(--font-display); font-size: 1.12rem; line-height: 1.5; color: var(--forest-deep); margin: 0 0 1.1rem; font-weight: 500; }
.rev-by { display: flex; flex-direction: column; gap: .1rem; margin: auto 0 0; padding-top: 1rem; border-top: 1px solid var(--line); }
.rev-tag { font-family: var(--font-script); font-size: 1.32rem; color: var(--barn); line-height: 1.05; }
.rev-by cite { font-style: normal; font-size: .82rem; color: var(--ink-soft); }
.reviews-band-cta { margin-top: clamp(1.6rem, 1rem + 1.8vw, 2.6rem); }
.reviews-band-cta a { color: var(--gold-lt); font-weight: 700; }
.reviews-band-cta a:hover { color: #fff7e9; }
@media (prefers-reduced-motion: reduce){ .rev-card.in .rev-star { animation:none; opacity:1; transform:none; } }
@media (max-width: 760px){ .reviews-band { background-attachment: scroll; } }
.stall:hover, .stall:focus-within, .stall.is-open { z-index: 6; }
.stall-door, .stall.is-open .stall-door { box-shadow: inset 0 0 0 3px rgba(255,247,233,.12), inset 0 0 46px rgba(0,0,0,.30), 0 10px 24px rgba(0,0,0,.20); }
.stall:hover .stall-door, .stall:focus-within .stall-door, .stall.is-open .stall-door {
  transform: rotateY(-112deg); box-shadow: 0 26px 40px rgba(0,0,0,.30); }
@media (prefers-reduced-motion: reduce){
  .stall:hover .stall-door, .stall:focus-within .stall-door, .stall.is-open .stall-door { transform: none; opacity: 0; pointer-events: none; }
}
.wheel-wrap.in .wheel-node-ic { opacity: 1; transform: scale(1); transition-delay: calc(var(--i) * .08s); }
.wheel-node.is-active .wheel-node-ic { background: var(--gold); color: var(--forest-deep); border-color: var(--gold-deep); box-shadow: 0 8px 20px rgba(180,130,40,.42); transform: scale(1.14); }
.reason-panel.is-active { opacity: 1; visibility: visible; transform: none; position: relative; }
@media (max-width: 879px){
  .wheel-wrap.in .wheel-node-ic { transition-delay: 0s; }
}

/* ============================================================
   Booking steps — icon stepper, reveal-triggered progress line
   ============================================================ */
.steps-wrap { position: relative; margin-top: 2.6rem; }
.steps-row { display: grid; gap: 2.2rem; grid-template-columns: 1fr; }
@media (min-width: 760px){ .steps-row { grid-template-columns: repeat(4, 1fr); gap: 1.5rem; } }
.steps-line { display: none; }
@media (min-width: 760px){
  .steps-line { display: block; position: absolute; top: 30px; transform: translateY(-50%); left: 12.5%; right: 12.5%;
    height: 4px; border-radius: 4px; background: var(--line); z-index: 0; overflow: hidden; }
  .steps-line-fill { position: absolute; left: 0; top: 0; height: 100%; width: 0; border-radius: 4px;
    background: linear-gradient(90deg, var(--gold) 0%, var(--barn) 50%, var(--forest) 100%);
    transition: width 1.9s cubic-bezier(.4,.1,.2,1); }
  .steps-wrap.in .steps-line-fill { width: 100%; }
}
.step-item { text-align: center; position: relative; }
.step-num { position: relative; z-index: 1; width: 60px; height: 60px; border-radius: 50%; margin: 0 auto 1.1rem;
  display: grid; place-items: center; background: #fffdf7; color: var(--barn); box-shadow: inset 0 0 0 2px var(--gold-deep);
  transition: background .55s ease, color .55s ease, box-shadow .55s ease, transform .55s ease; }
.step-num svg { width: 28px; height: 28px; }
.steps-wrap.in .step-num { background: var(--barn); color: #fff7e9; box-shadow: 0 8px 18px rgba(124,42,29,.3); transform: scale(1.05); }
.steps-row .step-item:nth-child(1) .step-num { transition-delay: .15s; }
.steps-row .step-item:nth-child(2) .step-num { transition-delay: .75s; }
.steps-row .step-item:nth-child(3) .step-num { transition-delay: 1.3s; }
.steps-row .step-item:nth-child(4) .step-num { transition-delay: 1.85s; }
.step-item h3 { font-size: 1.2rem; margin-bottom: .4rem; }
.step-item p { color: var(--ink-soft); font-size: .97rem; max-width: 30ch; margin-inline: auto; }
@media (prefers-reduced-motion: reduce){ .steps-line-fill { transition: none; width: 100%; } .step-num { transition: none; } }

/* ============================================================
   Areas we serve — split layout (map beside scannable content)
   ============================================================ */
.areas-split { display: grid; gap: 2rem; grid-template-columns: 1fr; margin-top: 2.4rem; align-items: center; }
@media (min-width: 900px){ .areas-split { grid-template-columns: 1fr 1.05fr; gap: 3rem; } }
.areas-lead { font-size: 1.08rem; color: var(--ink-soft); margin: 0 0 1.6rem; max-width: 46ch; }
.areas-stats { display: grid; gap: 1rem; margin-bottom: 1.8rem; }
@media (min-width: 520px){ .areas-stats { grid-template-columns: repeat(3, 1fr); gap: 1.1rem; } }
.areas-stat { display: flex; align-items: center; gap: .7rem; }
.areas-stat-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  background: var(--cream-2); color: var(--barn); flex: none; box-shadow: inset 0 0 0 1px var(--line); }
.areas-stat-ic svg { width: 21px; height: 21px; }
.areas-stat > div { display: flex; flex-direction: column; line-height: 1.25; }
.areas-stat strong { font-family: var(--font-display); color: var(--forest); font-size: 1.05rem; }
.areas-stat span { font-size: .82rem; color: var(--ink-soft); }
.areas-info .area-legend { justify-content: flex-start; margin: 0 0 1.8rem; max-width: none; }
.areas-mapwrap { position: relative; }
.areas-mapwrap .area-embed { max-width: none; margin: 0; aspect-ratio: 4 / 3;
  border: 3px solid #fff7e9; box-shadow: 0 18px 40px rgba(58,38,22,.22); }
.areas-map-tag { position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: .35rem;
  background: var(--barn-deep); color: #fff7e9; font-size: .8rem; font-weight: 700;
  padding: .42rem .75rem; border-radius: 30px; box-shadow: var(--shadow-md); }
.areas-map-tag svg { width: 14px; height: 14px; }
@media (max-width: 640px){ .areas-mapwrap .area-embed { aspect-ratio: 1 / 1; } }

/* ============================================================
   Footer — top (brand + visit) + SEO link directory (accordion)
   ============================================================ */
.footer-top { display: grid; gap: var(--s-6); }
@media (min-width: 760px){ .footer-top { grid-template-columns: 1.7fr 1fr; gap: var(--s-8); align-items: start; } }
.footer-visit h3 { color: var(--gold-lt); font-size: 1.1rem; margin-bottom: var(--s-3); }
.footer-contact { display: grid; gap: .4rem; }
.footer-contact li { margin-bottom: 0; align-items: flex-start; }
.footer-contact li span, .footer-contact li a { line-height: 1.3; }
.footer-contact svg { margin-top: 2px; }
.footer-directory { margin-top: var(--s-7); border-top: 1px solid rgba(214,168,74,.2); padding-top: var(--s-3); max-width: 1040px; }
.fdir-group { border-bottom: 1px solid rgba(214,168,74,.16); }
.fdir-head { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  background: none; border: 0; cursor: pointer; padding: 1.05rem 0; color: var(--gold-lt);
  font-family: var(--font-display); font-size: 1.12rem; font-weight: 600; text-align: left; }
.fdir-head-l { display: inline-flex; align-items: center; gap: .6rem; }
.fdir-head-l svg { width: 19px; height: 19px; flex: none; }
.fdir-chev { width: 20px; height: 20px; transition: transform .3s; flex: none; }
.fdir-group.open .fdir-chev { transform: rotate(180deg); }
.fdir-panel { overflow: hidden; max-height: 0; transition: max-height .4s ease; }
.fdir-group.open .fdir-panel { max-height: 460px; }
.fdir-panel ul { columns: 2; column-gap: 2rem; padding: .2rem 0 1.2rem; }
@media (min-width: 600px){ .fdir-panel ul { columns: 3; } }
@media (min-width: 920px){ .fdir-panel ul { columns: 4; } }
.fdir-panel li { break-inside: avoid; margin-bottom: .6rem; }
.fdir-panel a { color: #d8cdb0; text-decoration: none; font-size: .93rem; font-weight: 500; }
.fdir-panel a:hover { color: #fff7e9; text-decoration: underline; }

/* Hero video: clean background, never show native controls or interaction UI */
.hero-video { pointer-events: none; }
.hero-video::-webkit-media-controls,
.hero-video::-webkit-media-controls-enclosure,
.hero-video::-webkit-media-controls-panel,
.hero-video::-webkit-media-controls-start-playback-button,
.hero-video::-webkit-media-controls-overlay-play-button { display: none !important; -webkit-appearance: none !important; }

/* ===== How-it-works step cards (scoped: .step is only used on this page) ===== */
.grid.g-2 .step{
  text-align:center;
  background:linear-gradient(180deg,#fffdf8 0%,#fbf3e4 100%);
  border:1px solid rgba(168,128,58,.30);
  border-radius:var(--r-lg);
  box-shadow:0 10px 26px rgba(60,42,20,.09);
  padding:var(--s-6) var(--s-5) var(--s-5);
  position:relative; overflow:hidden;
  transition:transform .35s ease, box-shadow .35s ease;
}
.grid.g-2 .step::before{
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--gold-deep),var(--barn));
}
.grid.g-2 .step:hover{ transform:translateY(-4px); box-shadow:0 16px 34px rgba(60,42,20,.15); }
.grid.g-2 .step .step-num{
  position:relative; top:auto; left:auto;
  margin:.4rem auto 1rem; width:58px; height:58px;
  background:var(--barn-deep); color:#fff7e9;
  box-shadow:0 6px 16px rgba(124,42,29,.30), inset 0 0 0 2px rgba(255,247,233,.20);
}
.grid.g-2 .step h3{ text-align:center; margin:.2rem 0 .5rem; }
.grid.g-2 .step p{ color:var(--ink-soft); max-width:38ch; margin-inline:auto; }
/* balance the orphaned final step (5 of 5) by centering it across both columns */
@media (min-width:620px){
  .grid.g-2 .step:last-child:nth-child(odd){
    grid-column:1 / -1; max-width:calc(50% - 14px); margin-inline:auto;
  }
}


/* Mobile nav: close button + polish (button injected by JS) */
.nav-close{ position:absolute; top:.7rem; right:.75rem; width:42px; height:42px;
  border:0; border-radius:50%; background:var(--forest-deep); color:#fff7e9;
  font-size:1.6rem; line-height:1; cursor:pointer; display:none; z-index:3;
  align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(31,51,36,.28);
  transition:background .18s ease, transform .18s ease; }
.nav-close:hover{ background:var(--barn-deep); transform:rotate(90deg); }
@media (max-width:979px){ .nav-close{ display:inline-flex; } }

/* eyebrow span spacing */
.eyebrow{ margin-top:.2rem; }

/* ===== UI polish batch v1 ===== */
/* Steps timeline: neutralize legacy .step-num{top:-22px;left:24px} so dots center + line meets them */
.steps-row .step-num { top: 0; left: 0; }
/* Testimonials: space stacked quote cards on mobile so the quote badges don't collide */
@media (max-width: 699px){ .rev-grid { gap: 2.75rem; } }
/* Mobile hero: vertically center the headline block and make the media cover the whole hero (no green gap) */
@media (max-width: 759px){
  .hero, .page-hero { min-height: 88vh; min-height: 88svh; display: flex; flex-direction: column; justify-content: center; }
  .hero .hero-inner, .page-hero .hero-inner { padding-block: 1.25rem; }
  .hero-media, .page-hero-media { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; }
  .hero-media img, .hero-media video, .hero-video,
  .page-hero-media img, .page-hero-media picture, .page-hero-media picture img {
    width: 100%; height: 100%; object-fit: cover; display: block;
  }
  /* Mobile hero breathing room: smaller one-line eyebrow, tighter lead, balanced gaps */
  .hero .eyebrow, .page-hero .eyebrow { font-size: .92rem; line-height: 1.3; margin-bottom: .55rem; }
  .hero .headline-group { gap: .6rem; }
  .hero-lead, .page-hero .hero-lead { font-size: 1.02rem; line-height: 1.5; margin-top: 1.05rem; }
}


/* ===== UI polish batch v2 ===== */
/* Sitemap page reuses .footer-contact (light text meant for the dark footer) inside light .card tiles — restore readable contrast */
.card .footer-contact a { color: var(--barn-deep); font-weight: 600; }
.card .footer-contact a:hover { color: var(--barn); text-decoration: underline; }
.card .footer-contact svg { color: var(--gold-deep); }


/* ===== glossary UX v1 ===== */
.gloss-tools{position:sticky;top:64px;z-index:5;background:var(--cream);padding:1rem 0 .9rem;margin:0 0 1.4rem;border-bottom:1px solid var(--cream-3);text-align:center}
.gloss-search{display:flex;align-items:center;gap:.55rem;background:#fff;border:1.5px solid var(--cream-3);border-radius:999px;padding:.6rem 1.1rem;width:min(460px,100%);margin:0 auto;box-shadow:var(--shadow-sm);text-align:left}
.gloss-search:focus-within{border-color:var(--gold);box-shadow:0 0 0 3px rgba(194,150,47,.18)}
.gloss-search svg{width:20px;height:20px;color:var(--gold-deep);flex:none}
.gloss-search input{border:0;outline:0;background:transparent;font:inherit;width:100%;color:var(--ink)}
.gloss-az{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.9rem}
.gloss-az a{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 .4rem;border-radius:9px;background:var(--cream-2);color:var(--barn-deep);font-weight:800;font-size:.92rem;text-decoration:none;transition:background .15s,color .15s,transform .15s}
.gloss-az a:hover{background:var(--barn-deep);color:#fff7e9;transform:translateY(-2px)}
.gloss-noresult{margin:.9rem 0 0;color:var(--ink-soft)}
.gloss-dl{display:grid;gap:.9rem}
.gloss-dl dt{scroll-margin-top:130px}
.gloss-dl dd{margin:.3rem 0 0;color:var(--ink-soft);background:#fff;border:1px solid var(--cream-3);border-left:4px solid var(--gold);border-radius:12px;padding:.9rem 1.1rem;transition:box-shadow .15s,border-color .15s}
.gloss-dl dd:hover{box-shadow:var(--shadow-md);border-left-color:var(--barn)}
.gloss-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.7rem}
.gloss-chip{display:inline-flex;align-items:center;gap:.3rem;font-size:.84rem;font-weight:700;color:var(--barn-deep);background:var(--cream-2);border:1px solid var(--cream-3);border-radius:999px;padding:.28rem .7rem;text-decoration:none;transition:background .15s,color .15s}
.gloss-chip::before{content:"\2192";color:var(--gold-deep)}
.gloss-chip:hover{background:var(--barn-deep);color:#fff7e9}
.gloss-chip:hover::before{color:#fff7e9}
/* homepage glossary callout */
.gloss-callout{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--forest-deep),var(--forest-mid));color:var(--cream);border-radius:24px;padding:clamp(2.5rem,1.8rem + 3.4vw,4rem);display:flex;flex-direction:column;gap:2rem;box-shadow:var(--shadow-md);border:1px solid rgba(232,205,150,.22)}
.gloss-callout::before{content:"";position:absolute;top:-45px;right:-35px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(232,205,150,.16),transparent 68%);pointer-events:none}
@media(min-width:860px){.gloss-callout{flex-direction:row;align-items:center;justify-content:space-between;gap:3.5rem}}
.gloss-callout-copy{position:relative;flex:1;min-width:0}
.gloss-callout .eyebrow{color:var(--gold-lt);margin:0 0 1rem}
.gloss-callout h2{color:#fff7e9;font-size:clamp(1.55rem,1.2rem + 1.4vw,2.05rem);line-height:1.2;margin:0 0 1rem}
.gloss-callout-copy p{color:#ece2c8;max-width:60ch;margin:0;line-height:1.75;font-size:1.03rem}
.gloss-callout-copy a{color:var(--gold-lt);text-decoration:underline;text-decoration-color:rgba(232,205,150,.5);text-underline-offset:2px;font-weight:600}
.gloss-callout-copy a:hover{text-decoration-color:var(--gold-lt)}
.gloss-callout .btn{position:relative;flex:none;white-space:nowrap}


/* ===== blog carousel v2 ===== */
.blog-carousel-sec .section-head{max-width:none;width:100%;margin:0 0 1.5rem;text-align:left}
.blog-carousel-sec .bc-head-row{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.blog-carousel-sec h2{flex:1;min-width:0;margin:.15rem 0 0;line-height:1.12;font-size:clamp(1.55rem,1rem + 2vw,2.35rem)}
.blog-carousel-sec .sec-sub{color:var(--ink-soft);margin:.55rem 0 0;max-width:none}
.blog-carousel-wrap{position:relative}
.blog-carousel{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,82%);gap:1.15rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:.35rem .2rem 1.1rem;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.blog-carousel::-webkit-scrollbar{display:none}
@media(min-width:640px){.blog-carousel{grid-auto-columns:minmax(280px,44%)}}
@media(min-width:1000px){.blog-carousel{grid-auto-columns:minmax(300px,31.4%)}}
.blog-card{position:relative;scroll-snap-align:start;background:#fff;border:1px solid var(--cream-3);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.blog-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--gold-lt)}
.bc-img{display:block;overflow:hidden;aspect-ratio:16/10}
.bc-img img{width:100%;height:100%;object-fit:cover;display:block;background:var(--cream-2);transition:transform .4s ease}
.blog-card:hover .bc-img img{transform:scale(1.06)}
.bc-body{padding:1.05rem 1.15rem 1.2rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.bc-body h3{font-size:1.1rem;line-height:1.28;margin:0;color:var(--forest);font-weight:600}
.bc-link{color:inherit;text-decoration:none}
.bc-link::after{content:"";position:absolute;inset:0;z-index:1}
.blog-card:hover .bc-link{color:var(--barn-deep)}
.bc-more{margin-top:auto;color:var(--barn-deep);font-weight:700;font-size:.9rem}
.bc-more::after{content:" \2192";transition:margin-left .15s ease}
.blog-card:hover .bc-more::after{margin-left:.25rem}
.bc-nav{flex:none;display:flex;gap:.5rem}
.bc-btn{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--cream-3);background:#fff;color:var(--barn-deep);display:grid;place-items:center;cursor:pointer;transition:background .15s,color .15s,transform .15s;box-shadow:var(--shadow-sm)}
.bc-btn:hover{background:var(--barn-deep);color:#fff7e9;transform:translateY(-2px)}
.bc-btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.bc-btn svg{width:20px;height:20px}
@media(max-width:520px){.bc-nav{display:none}}


/* ===== social row polish v1 ===== */
.social-row{gap:.7rem;flex-wrap:wrap}
.social-row a{transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.social-row a:hover{background:var(--gold-deep);transform:translateY(-3px);box-shadow:0 6px 16px rgba(0,0,0,.28)}
.social-row a:focus-visible{outline:3px solid var(--gold);outline-offset:2px}


/* ===== form prefill v1 ===== */
.form-prefill{display:flex;gap:.7rem;align-items:flex-start;background:#eef5ea;border:1px solid #cfe3cf;border-left:4px solid var(--forest-mid);border-radius:12px;padding:.95rem 1.15rem;margin:0 0 1.35rem;color:var(--forest);font-size:.98rem;line-height:1.55}
.form-prefill svg{width:21px;height:21px;color:var(--forest-mid);flex:none;margin-top:2px}
.form-prefill strong{color:var(--barn-deep)}

