/* ═══════════════════════════════════════════════════════════
   INSPIRA RANCH · PASTEL WEDDING THEME (Nov 2026)
   Loaded after style.css on every page. Soft ivory, petal, sage and sky
   sections; Cormorant Garamond headings, Cinzel caps for labels and buttons,
   Pinyon Script accents; one deep ink color for the strong actions.
   ═══════════════════════════════════════════════════════════ */

html { background: var(--ivory); }
body { background: var(--ivory); color: var(--ink); }
::selection { background: var(--blush); color: var(--ink-deep); }

a { color: var(--accent); }
a:hover { color: var(--ink-deep); }

/* ── Type ─────────────────────────────────────────────── */
h1, h2, h3, h4 {
  font-family: var(--font-heading);
  font-weight: 400;
  letter-spacing: .005em;
  color: var(--ink-deep);
}
h1 { font-weight: 300; }
h2 { font-size: clamp(2.1rem, 3.6vw, 3.2rem); line-height: 1.12; }
h3 { font-weight: 500; }
p  { color: var(--ink); font-weight: 300; }
em, i { font-family: inherit; }

.gold-label, .hero-eyebrow, .section-label, .eyebrow, .kicker {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .28em !important;
  color: var(--accent) !important;
}

/* Script accent: any element can opt in with class="script" */
.script, .ir-script {
  font-family: var(--font-script);
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--accent);
}

/* Section rhythm: ivory → petal → linen → sage → sky */
section { color: var(--ink); }
.section-dark  { background: var(--petal) !important; }
.section-black { background: var(--ivory) !important; }
.section-light { background: var(--linen) !important; color: var(--ink); }
.testimonials, .testimonials.section-dark { background: var(--sage) !important; }
.stats-strip { background: var(--sky) !important; border-top: 0 !important; }
.faq-section { background: var(--ivory) !important; }
.section-dark h2, .section-dark h3, .section-black h2, .section-black h3,
.section-header h2, .section-light h2, .section-light h3 { color: var(--ink-deep) !important; }
.section-dark p, .section-black p { color: var(--ink); }

/* hairline dividers between sections in champagne, not gold */
.section-dark, .section-black, .section-light, .services-teaser, .testimonials,
.contact-section, .story-section, .team-section, .values-section,
.packages-section, .lodging-section, .conferences-section {
  border-top: 1px solid rgba(217,198,182,.55) !important;
}

/* ── Buttons ──────────────────────────────────────────── */
.btn-primary, button.btn-primary, a.btn-primary, #submitBtn {
  background: var(--ink-deep) !important;
  border: 1px solid var(--ink-deep) !important;
  color: #FBF8F4 !important;
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  font-size: 12.5px !important;
  letter-spacing: .22em !important;
  border-radius: 0 !important;
  outline: 1px solid rgba(251,248,244,.55);
  outline-offset: -5px;
  box-shadow: none !important;
}
.btn-primary:hover, #submitBtn:hover {
  background: var(--ink-soft) !important;
  border-color: var(--ink-soft) !important;
  color: #fff !important;
}
.btn-outline, .btn-outline-dark, .btn-secondary {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .22em !important;
  border-radius: 0 !important;
  border: 1px solid var(--ink-deep) !important;
  color: var(--ink-deep) !important;
  background: transparent !important;
}
.btn-outline:hover, .btn-outline-dark:hover, .btn-secondary:hover {
  background: var(--ink-deep) !important; color: #FBF8F4 !important;
}
/* On photos, outline buttons are light */
.hero .btn-outline, .page-hero .btn-outline, .cta-overlay .btn-outline,
.landscape-banner-overlay .btn-outline, .services-hero .btn-outline {
  border-color: rgba(255,255,255,.85) !important;
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  backdrop-filter: blur(2px);
}
.hero .btn-outline:hover, .page-hero .btn-outline:hover, .cta-overlay .btn-outline:hover {
  background: #FBF8F4 !important; color: var(--ink-deep) !important;
}
.hero .btn-primary, .page-hero .btn-primary, .cta-overlay .btn-primary {
  background: #FBF8F4 !important; border-color: #FBF8F4 !important; color: var(--ink-deep) !important;
  outline-color: rgba(47,53,71,.35);
}
.hero .btn-primary:hover, .page-hero .btn-primary:hover, .cta-overlay .btn-primary:hover {
  background: var(--blush-light) !important; border-color: var(--blush-light) !important; color: var(--ink-deep) !important;
}

/* ── Navigation: always a light bar, like a printed invitation ── */
nav:not(.footer-nav):not([aria-label]), #mainNav {
  background: rgba(251,248,244,.96) !important;
  border-bottom: 1px solid rgba(217,198,182,.6) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: saturate(1.2) blur(8px);
  backdrop-filter: saturate(1.2) blur(8px);
}
#mainNav { padding: 14px 40px; }
#mainNav.scrolled { padding: 10px 40px; box-shadow: 0 6px 24px rgba(70,63,66,.06) !important; }
.nav-logo, .nav-logo-text, #mainNav .nav-logo-text, #mainNav.scrolled .nav-logo-text {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .32em !important;
  font-size: 1.12rem !important;
  color: var(--ink-deep) !important;
}
#mainNav .logo-img, #mainNav:not(.scrolled) .logo-img { filter: none; }
.nav-links a, #mainNav .nav-links a {
  font-family: var(--font-heading) !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  color: var(--ink-deep) !important;
}
#mainNav .nav-links a:hover, .nav-links a:hover, #mainNav .nav-links a.active { color: var(--accent) !important; }
#mainNav .nav-links a.active { text-decoration: underline; text-decoration-color: var(--champagne); text-underline-offset: 8px; }
/* Free Brochure = the one boxed button in the nav (Chateau-style "Book a tour") */
#mainNav .nav-links a.nav-bundle {
  font-family: var(--font-display) !important;
  font-size: 12px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  color: #FBF8F4 !important;
  background: var(--ink-deep);
  padding: 11px 18px 10px;
  outline: 1px solid rgba(251,248,244,.6);
  outline-offset: -4px;
  text-decoration: none !important;
}
#mainNav .nav-links a.nav-bundle:hover { background: var(--ink-soft); color: #fff !important; }
.lang-toggle, #mainNav .nav-inner > #langBtn, #langBtn {
  font-family: var(--font-display) !important;
  letter-spacing: .18em !important;
  color: var(--ink-deep) !important;
  border: 1px solid var(--champagne) !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.lang-toggle:hover, #langBtn:hover { border-color: var(--accent) !important; color: var(--accent) !important; }
.hamburger span, #mainNav .hamburger span { background: var(--ink-deep) !important; }
@media (max-width: 1024px) {
  #mainNav { padding: 12px 20px; }
  #mainNav .nav-links.open, .nav-links.open {
    background: var(--ivory) !important;
    border-top: 1px solid var(--champagne);
  }
  #mainNav .nav-links.open a { font-size: 22px !important; }
  #mainNav .nav-links.open a.nav-bundle { font-size: 13px !important; align-self: center; }
}

/* ── Hero ─────────────────────────────────────────────── */
.hero-overlay {
  background:
    linear-gradient(180deg, rgba(47,40,44,.18) 0%, rgba(47,40,44,.30) 45%, rgba(47,40,44,.52) 100%) !important;
}
.hero-content h1, .page-hero-content h1, .services-hero h1 {
  font-family: var(--font-heading) !important;
  font-weight: 300 !important;
  font-style: normal !important;
  color: #fff !important;
  letter-spacing: .01em;
  text-shadow: 0 2px 30px rgba(40,30,35,.35) !important;
}
.hero-content .hero-eyebrow, .hero .gold-label, .page-hero .gold-label {
  color: #FBEDE8 !important;
}
.hero-rule { background: rgba(255,255,255,.75) !important; width: 72px; }
.hero-content p { color: rgba(255,255,255,.92) !important; font-weight: 300; }
.hero-scroll-hint { color: rgba(255,255,255,.8) !important; border-color: rgba(255,255,255,.5) !important; }

/* ── Cards, tiles, panels on light ───────────────────── */
.faq-item, .pkg-card, .pkg-select-card, .amenity-card, .value-item, .service-item,
.blog-card, .review-card, .contact-form-wrap, .ir-facts, .pkg-note-card {
  border-color: rgba(217,198,182,.7) !important;
}
.faq-item { background: #fff !important; }
.pkg-note-card { background: var(--mauve) !important; }
.pkg-note-card h2, .pkg-note-card > p, .pkg-note-card .pkg-note-sub { color: #fff !important; }
.stat-number { color: var(--ink-deep) !important; font-family: var(--font-heading) !important; font-weight: 300 !important; }
.stats-strip .stat-label, .stats-strip p, .stats-strip span { color: var(--muted); }

/* forms */
input, select, textarea {
  color: var(--ink) !important;
}
.form-group input, .form-group select, .form-group textarea,
.contact-form-wrap .form-group select, .newsletter-form input {
  background: #fff !important;
  border: 1px solid rgba(185,163,155,.55) !important;
  border-radius: 0 !important;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(233,207,200,.6) !important;
  outline: none;
}
::placeholder { color: #9A8F91 !important; opacity: 1; }

/* ── Footer: deep mauve, ivory type ─────────────────── */
footer[role="contentinfo"], footer.site-footer, body > footer {
  background: #5E4E4B !important;
  color: #F3E9E4 !important;
  border-top: 0 !important;
}
footer[role="contentinfo"] *, body > footer * { border-color: rgba(243,233,228,.18) !important; }
footer[role="contentinfo"] p, footer[role="contentinfo"] li, footer[role="contentinfo"] address,
footer[role="contentinfo"] span, footer[role="contentinfo"] small,
body > footer p, body > footer li, body > footer address, body > footer span {
  color: #EADCD6 !important;
}
footer[role="contentinfo"] a, body > footer a { color: #FBF3EF !important; }
footer[role="contentinfo"] a:hover, body > footer a:hover { color: #fff !important; text-decoration: underline; }
footer[role="contentinfo"] h2, footer[role="contentinfo"] h3, footer[role="contentinfo"] h4,
body > footer h3, body > footer h4 {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .24em !important;
  color: #F6DCD4 !important;
}
.footer-logo, .footer-logo-text {
  font-family: var(--font-display) !important; font-weight: 400 !important;
  letter-spacing: .3em !important; color: #FBF3EF !important;
}

/* ── Cookie banner, a11y toolbar ─────────────────────── */
#cookie-banner, .cookie-banner, [id*="cookie"][role="dialog"], [id*="cookie"][role="region"] {
  background: var(--ivory) !important;
  color: var(--ink) !important;
  border-top: 1px solid var(--champagne) !important;
  box-shadow: 0 -10px 40px rgba(70,63,66,.08) !important;
}
#cookie-banner p *, .cookie-banner p * { color: inherit; }

/* ── Image placeholders while loading ─────────────────── */
img { background: var(--linen); }

@media (prefers-reduced-motion: reduce) {
  .btn-primary, .btn-outline { transition: none !important; }
}

/* ── Cookie banner (Tailwind markup) on ivory ─────────── */
#cookie-banner.bg-brand-navy, #cookie-banner { background: var(--ivory) !important; border-top: 1px solid var(--champagne) !important; }
#cookie-banner p, #cookie-banner .text-white, #cookie-banner .text-gray-400 { color: var(--ink) !important; }
#cookie-banner a { color: var(--accent) !important; }
#cookie-banner button { border-radius: 0 !important; font-family: var(--font-display) !important; font-weight: 400 !important; letter-spacing: .2em !important; min-height: 44px; }
#cookie-banner button.bg-brand-gold { background: var(--ink-deep) !important; color: #FBF8F4 !important; }
#cookie-banner button.border { border-color: var(--ink-deep) !important; color: var(--ink-deep) !important; background: transparent !important; }
#cookie-banner button.border:hover { background: var(--petal) !important; }
/* A11Y pill */
#a11y-toggle-btn { background: var(--ink-deep) !important; color: #FBF8F4 !important; border-color: var(--ink-deep) !important; }

/* ── Homepage hero: text on ivory above, the venue photo below with nothing over it ── */
.hero {
  height: auto !important; min-height: 0 !important;
  flex-direction: column; align-items: stretch !important; justify-content: flex-start !important;
  padding: 0 !important; background: var(--ivory) !important; overflow: hidden;
}
.hero .hero-content {
  order: 0; position: relative; z-index: 1;
  max-width: 920px; margin: 0 auto !important;
  padding: clamp(96px, 12vh, 120px) 24px clamp(26px, 4vh, 40px) !important;
  text-align: center;
}
.hero .hero-content h1 {
  color: var(--ink-deep) !important; text-shadow: none !important;
  font-weight: 300 !important; font-style: normal !important;
  font-size: clamp(2.1rem, 3.3vw, 3.25rem) !important; line-height: 1.12 !important;
  margin: 10px auto 4px !important; max-width: 24ch;
}
.hero .hero-content .gold-label, .hero .hero-content .hero-eyebrow { color: var(--accent) !important; }
.hero .hero-rule { background: var(--champagne) !important; width: 90px; margin: 14px auto !important; }
.hero .hero-content p { color: var(--ink) !important; font-size: 1.05rem !important; margin-bottom: 22px !important; }
.hero .hero-btns-break { display: none !important; }
.hero .hero-btns .btn-primary, .hero .hero-btns .btn-outline { min-width: 210px; padding: 14px 24px !important; }
.hero .hero-bg {
  order: 1; position: relative !important; inset: auto !important;
  height: clamp(340px, 74vh, 780px); transform: none !important; background: var(--linen) !important;
}
.hero .hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.hero .hero-overlay, .hero .hero-scroll-hint { display: none !important; }
/* buttons sit on ivory now */
.hero .btn-primary { background: var(--ink-deep) !important; border-color: var(--ink-deep) !important; color: #FBF8F4 !important; outline-color: rgba(251,248,244,.55); }
.hero .btn-primary:hover { background: var(--ink-soft) !important; border-color: var(--ink-soft) !important; color: #fff !important; }
.hero .btn-outline { background: transparent !important; border-color: var(--ink-deep) !important; color: var(--ink-deep) !important; backdrop-filter: none; }
.hero .btn-outline:hover { background: var(--ink-deep) !important; color: #FBF8F4 !important; }
@media (max-width: 1024px) {
  .hero .hero-content { padding: 86px 20px 22px !important; }
  .hero .hero-content h1 { font-size: clamp(1.75rem, 7.2vw, 2.6rem) !important; }
  .hero .hero-content .gold-label { font-size: 10px !important; margin-bottom: 6px !important; }
  .hero .hero-content p { font-size: .95rem !important; margin-bottom: 16px !important; line-height: 1.6 !important; }
  .hero .hero-rule { margin: 10px auto !important; width: 60px; }
  .hero .hero-btns { gap: 8px !important; display: grid !important; grid-template-columns: 1fr 1fr; }
  .hero .hero-btns .btn-primary, .hero .hero-btns .btn-outline { min-width: 0 !important; width: 100%; padding: 13px 6px !important; font-size: 10.5px !important; letter-spacing: .14em !important; }
  .hero .hero-btns .btn-outline { display: none !important; }
  .hero .hero-bg { height: 58vh; min-height: 300px; }
}
@media (max-width: 1024px) { .hero .hero-btns .btn-primary { display: flex !important; align-items: center; justify-content: center; text-align: center; } }

/* Services page header has no photo: dark type on petal */
.booking-hero .page-hero-content h1 { color: var(--ink-deep) !important; text-shadow: none !important; }
.booking-hero .page-hero-content .gold-label, .booking-hero .sv-kicker { color: var(--accent) !important; }
.booking-hero .page-hero-content p { color: var(--ink) !important; }
.sv-cta { border-radius: 0 !important; font-family: var(--font-display) !important; font-weight: 400 !important; letter-spacing: .18em !important; text-transform: uppercase; font-size: .8rem !important; outline: 1px solid rgba(251,248,244,.5); outline-offset: -5px; }
.sv-jump a { color: var(--ink-deep) !important; font-family: var(--font-display); letter-spacing: .14em !important; font-size: .78rem !important; }
.sv-jump { background: rgba(251,248,244,.96) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }

/* ── Inner-page and landing-page heroes: same pattern as the homepage.
      Type on ivory first, the venue photo below it, nothing printed over the photo. ── */
.hou-hero, .page-hero:has(> .page-hero-bg) {
  min-height: 0 !important; height: auto !important;
  display: flex !important; flex-direction: column; align-items: stretch !important; justify-content: flex-start !important;
  padding: 0 !important; background: var(--ivory) !important; overflow: hidden; text-align: center;
}
.hou-hero-content, .page-hero:has(> .page-hero-bg) .page-hero-content {
  order: 0; position: relative !important; z-index: 1; max-width: 900px; margin: 0 auto !important;
  padding: clamp(104px, 13vh, 132px) 24px clamp(28px, 4vh, 44px) !important; text-align: center !important;
}
.hou-hero-content h1, .page-hero:has(> .page-hero-bg) .page-hero-content h1 {
  color: var(--ink-deep) !important; text-shadow: none !important; font-weight: 300 !important; font-style: normal !important;
  font-size: clamp(2rem, 3.6vw, 3.3rem) !important; line-height: 1.12 !important;
}
.hou-hero-content .gold-label, .page-hero:has(> .page-hero-bg) .gold-label { color: var(--accent) !important; }
.hou-hero-content p, .page-hero:has(> .page-hero-bg) .page-hero-content p { color: var(--ink) !important; max-width: 62ch; margin-left: auto; margin-right: auto; }
.hou-hero-bg, .page-hero:has(> .page-hero-bg) .page-hero-bg {
  order: 1; position: relative !important; inset: auto !important; height: clamp(300px, 62vh, 680px); transform: none !important;
}
.hou-hero-bg img, .page-hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.hou-hero-overlay, .page-hero:has(> .page-hero-bg) .page-hero-overlay { display: none !important; }
.hou-hero .hero-btns { justify-content: center; }
.hou-hero .btn-outline { background: transparent !important; border-color: var(--ink-deep) !important; color: var(--ink-deep) !important; }
.hou-hero .btn-outline:hover { background: var(--ink-deep) !important; color: #FBF8F4 !important; }
@media (max-width: 1024px) {
  .hou-hero-content, .page-hero:has(> .page-hero-bg) .page-hero-content { padding: 92px 20px 24px !important; }
  .hou-hero-bg, .page-hero:has(> .page-hero-bg) .page-hero-bg { height: 48vh; min-height: 260px; }
}
.page-hero:not(:has(> .page-hero-bg)) .page-hero-content h1, .page-hero:not(:has(> .page-hero-bg)) h1 { color: var(--ink-deep) !important; text-shadow: none !important; }
.page-hero:not(:has(> .page-hero-bg)) .page-hero-content p { color: var(--ink) !important; }
.page-hero:not(:has(> .page-hero-bg)) .gold-label { color: var(--accent) !important; }
.page-hero-bg img { opacity: 1 !important; }
.hou-distance-strip { background: var(--sky) !important; border-bottom: 1px solid rgba(217,198,182,.6); }
.hou-dist-item { border-color: rgba(47,53,71,.15) !important; }
.hou-dist-time { color: var(--ink-deep) !important; font-weight: 400 !important; }
.hou-dist-city { color: var(--muted) !important; font-weight: 500 !important; }

/* Blog post heroes: title on ivory, photo below */
.post-hero { min-height: 0 !important; height: auto !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; padding: 0 !important; background: var(--ivory) !important; }
.post-hero-content { order: 0; position: relative !important; max-width: 860px !important; margin: 0 auto !important; padding: clamp(104px, 13vh, 132px) 24px 32px !important; text-align: center; }
.post-hero-content h1 { color: var(--ink-deep) !important; text-shadow: none !important; font-weight: 300 !important; font-style: normal !important; }
.post-hero-content .post-meta, .post-hero-content .post-meta * { color: var(--accent) !important; justify-content: center; }
.post-hero-bg { order: 1; position: relative !important; inset: auto !important; height: clamp(260px, 52vh, 600px); transform: none !important; opacity: 1 !important; }
.post-hero-overlay { display: none !important; }
@media (max-width: 1024px) { .post-hero-content { padding: 92px 20px 24px !important; } .post-hero-bg { height: 40vh; } }

#cookie-banner button span { color: inherit !important; }
.contact-form-wrap { background: #fff !important; border: 1px solid rgba(217,198,182,.8) !important; }
.contact-form-wrap .form-group label { color: var(--accent) !important; }
.post-breadcrumb, .post-breadcrumb a, .post-breadcrumb span { color: var(--muted) !important; opacity: 1 !important; }
.legal-hero { background: var(--petal) !important; }
.legal-hero h1 { color: var(--ink-deep) !important; text-shadow: none !important; }
.legal-hero p { color: var(--ink) !important; }
.legal-hero .gold-label { color: var(--accent) !important; }
/* "Celebration services" note card: deeper mauve so white type reads */
.pkg-note-card { background: #86706A !important; }
.pkg-note-card .gold-label, .pkg-note-card .gold-label * { color: #fff !important; }
.pkg-note-card .pkg-chips li, .pkg-note-card li { background: #FBF8F4 !important; color: var(--ink-deep) !important; border-color: #FBF8F4 !important; }
.pkg-note-card .pkg-chips li * { color: var(--ink-deep) !important; }
.pkg-note-card .btn-primary { background: #FBF8F4 !important; border-color: #FBF8F4 !important; color: var(--ink-deep) !important; outline-color: rgba(134,112,106,.45); }
.pkg-note-card .btn-primary * { color: var(--ink-deep) !important; }
.pkg-note-card a:not(.btn-primary), .pkg-note-card .pkg-note-sub, .pkg-note-card .pkg-note-sub * { color: #fff !important; }
footer strong { color: #F6DCD4 !important; }
.back-link { color: var(--accent) !important; }
@media (max-width: 1024px) { #mainNav .nav-links.open a.nav-bundle { align-self: flex-start !important; margin: 14px 24px !important; } }

/* ── Hero order (owner, Nov 8): venue photo FIRST under the menu, headline and buttons below it ── */
.hero, .hou-hero, .page-hero:has(> .page-hero-bg), .post-hero { padding-top: 66px !important; }
.hero .hero-bg, .hou-hero-bg, .page-hero:has(> .page-hero-bg) .page-hero-bg, .post-hero-bg { order: 0 !important; }
.hero .hero-content, .hou-hero-content, .page-hero:has(> .page-hero-bg) .page-hero-content, .post-hero-content {
  order: 1 !important;
  padding-top: clamp(30px, 5vh, 52px) !important;
  padding-bottom: clamp(40px, 6vh, 64px) !important;
}
.hero .hero-bg { height: clamp(380px, 62vh, 720px) !important; }
@media (max-width: 1024px) {
  .hero, .hou-hero, .page-hero:has(> .page-hero-bg), .post-hero { padding-top: 69px !important; }
  .hero .hero-content, .hou-hero-content, .page-hero:has(> .page-hero-bg) .page-hero-content, .post-hero-content {
    padding-top: 24px !important; padding-bottom: 36px !important;
  }
  .hero .hero-bg { height: 46vh !important; min-height: 280px; }
}
