/* ══════════════════════════════════════════════
   Haras Encanto Blocks — Global Styles v3
   ══════════════════════════════════════════════ */

:root {
  --gold:       #c9a84c;
  --gold-light: #e8d28a;
  --green-dark: #0f1f10;
  --green-mid:  #1c3a1e;
  --cream:      #f7f2e8;
  --cream-dark: #ede5d0;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; font-family: 'Raleway', sans-serif; }

/* ── Remove default WP block margins that break layout ── */
.wp-site-blocks > * { margin-block-start: 0 !important; margin-block-end: 0 !important; }
.wp-block-group { margin: 0 !important; }

/* ═══════════════════════════════════
   FLOATING PILL NAVBAR
═══════════════════════════════════ */
.haras-header {
  position: fixed !important;
  top: 1rem !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 2.5rem) !important;
  max-width: 1140px !important;
  border-radius: 999px !important;
  background: rgba(12, 25, 12, 0.88) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(201, 168, 76, 0.28) !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.35), 0 1px 0 rgba(201,168,76,0.15) !important;
  z-index: 9999 !important;
  padding: 0.6rem 0.8rem 0.6rem 2rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  transition: all 0.3s ease !important;
}

/* Site title inside nav */
.haras-header .wp-block-site-title,
.haras-header .wp-block-site-title a {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--gold) !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

/* Nav links */
.haras-header .wp-block-navigation,
.haras-header .wp-block-navigation__container {
  display: flex !important;
  align-items: center !important;
  gap: 0.25rem !important;
}

.haras-header .wp-block-navigation-item__content,
.haras-header .wp-block-navigation a {
  color: rgba(255,255,255,0.78) !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  font-family: 'Raleway', sans-serif !important;
  padding: 0.4rem 0.9rem !important;
  border-radius: 999px !important;
  transition: all 0.25s !important;
}

.haras-header .wp-block-navigation a:hover,
.haras-header .wp-block-navigation-item__content:hover {
  color: var(--gold) !important;
  background: rgba(201,168,76,0.08) !important;
}

/* CTA link in nav */
.haras-nav-cta .wp-block-navigation-item__content,
.haras-nav-cta a {
  background: var(--gold) !important;
  color: var(--green-dark) !important;
  font-weight: 700 !important;
  padding: 0.55rem 1.3rem !important;
  border-radius: 999px !important;
}

.haras-nav-cta a:hover,
.haras-nav-cta .wp-block-navigation-item__content:hover {
  background: var(--gold-light) !important;
  color: var(--green-dark) !important;
}

/* Mobile: hide links */
@media (max-width: 860px) {
  .haras-header { padding: 0.6rem 0.8rem 0.6rem 1.5rem !important; }
  .haras-header .wp-block-navigation__container { display: none !important; }
}

/* ═══════════════════════════════════
   HERO
═══════════════════════════════════ */
.haras-hero { position: relative; }

/* Push inner content down from floating nav */
.haras-hero .wp-block-cover__inner-container {
  padding-top: 5rem !important;
  padding-bottom: 3rem !important;
  max-width: 860px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

/* Strong text shadow for readability over any image/video */
.haras-hero h1,
.haras-hero .wp-block-heading {
  text-shadow: 0 2px 16px rgba(0,0,0,0.85), 0 4px 48px rgba(0,0,0,0.6) !important;
  font-family: 'Playfair Display', serif !important;
}

.haras-hero p,
.haras-hero .wp-block-paragraph {
  text-shadow: 0 1px 8px rgba(0,0,0,0.7) !important;
}

.haras-hero em { color: var(--gold-light); font-style: italic; }

/* ═══════════════════════════════════
   SHARED TYPOGRAPHY HELPERS
═══════════════════════════════════ */
.h-eyebrow {
  font-size: 0.72rem !important;
  letter-spacing: 5px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: var(--gold) !important;
  margin-bottom: 1rem !important;
}

.h-playfair, .h-playfair * {
  font-family: 'Playfair Display', serif !important;
}

/* Gold divider bar */
hr.h-divider {
  width: 60px !important;
  max-width: 60px !important;
  height: 3px !important;
  background: var(--gold) !important;
  border: none !important;
  opacity: 1 !important;
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

hr.h-divider-center {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ═══════════════════════════════════
   STATS BAR
═══════════════════════════════════ */
.haras-stats-wrap {
  background: var(--green-dark) !important;
  border-top: 3px solid var(--gold) !important;
}

.haras-stat-col {
  padding: 2rem 1rem !important;
  text-align: center !important;
  border-right: 1px solid rgba(255,255,255,0.07) !important;
}
.haras-stat-col:last-child { border-right: none !important; }

p.haras-stat-num {
  font-family: 'Playfair Display', serif !important;
  font-size: 2.4rem !important;
  font-weight: 700 !important;
  color: var(--gold) !important;
  line-height: 1 !important;
  margin: 0 !important;
}

p.haras-stat-lbl {
  font-size: 0.68rem !important;
  color: rgba(255,255,255,0.45) !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin: 0.4rem 0 0 !important;
}

/* ═══════════════════════════════════
   ABOUT SECTION
═══════════════════════════════════ */
.haras-about {
  background: var(--cream) !important;
  padding: 7rem clamp(1rem,4vw,2rem) !important;
}

.haras-about-img img {
  width: 100% !important;
  height: 520px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
  display: block !important;
}

.haras-about h2,
.haras-about .wp-block-heading {
  font-family: 'Playfair Display', serif !important;
  color: var(--green-dark) !important;
  line-height: 1.2 !important;
}

.haras-about p { font-weight: 300 !important; line-height: 1.8 !important; color: #4a4a4a !important; }

.haras-feature-title {
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  color: var(--green-dark) !important;
  margin: 0 0 0.2rem !important;
}

.haras-feature-sub {
  font-size: 0.8rem !important;
  font-weight: 300 !important;
  color: #4a4a4a !important;
  margin: 0 !important;
}

/* ═══════════════════════════════════
   SERVICES SECTION
═══════════════════════════════════ */
.haras-services {
  background: var(--green-dark) !important;
  padding: 7rem clamp(1rem,4vw,2rem) !important;
  position: relative;
  overflow: hidden;
}

.haras-services::before {
  content: '';
  position: absolute;
  top: -80px; right: -80px;
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(201,168,76,0.07) 0%, transparent 70%);
  pointer-events: none;
}

.haras-services h2,
.haras-services .wp-block-heading {
  font-family: 'Playfair Display', serif !important;
  color: #fff !important;
}

.haras-service-card {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(201,168,76,0.17) !important;
  border-radius: 6px !important;
  padding: 2.5rem 2rem !important;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, background 0.3s ease, border-color 0.3s ease;
}

.haras-service-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.3s ease;
}

.haras-service-card:hover {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(201,168,76,0.4) !important;
  transform: translateY(-5px);
}

.haras-service-card:hover::after { transform: scaleX(1); }

.haras-service-card h3,
.haras-service-card .wp-block-heading {
  font-family: 'Playfair Display', serif !important;
  color: #fff !important;
  font-size: 1.25rem !important;
}

.haras-service-card p {
  color: rgba(255,255,255,0.52) !important;
  font-size: 0.9rem !important;
  font-weight: 300 !important;
  line-height: 1.7 !important;
}

p.haras-service-icon {
  font-size: 2.4rem !important;
  margin: 0 0 1.2rem !important;
  line-height: 1 !important;
}

/* ═══════════════════════════════════
   EXPERIENCE SECTION
═══════════════════════════════════ */
.haras-experience {
  background: var(--cream-dark) !important;
  padding: 7rem clamp(1rem,4vw,2rem) !important;
}

.haras-experience h2,
.haras-experience .wp-block-heading {
  font-family: 'Playfair Display', serif !important;
  color: var(--green-dark) !important;
  line-height: 1.2 !important;
}

.haras-experience p { font-weight: 300 !important; line-height: 1.8 !important; color: #4a4a4a !important; }

.haras-experience .wp-block-list {
  padding-left: 0 !important;
  list-style: none !important;
}

.haras-experience .wp-block-list li {
  padding: 0.5rem 0 0.5rem 1.5rem !important;
  position: relative;
  font-size: 0.9rem !important;
  color: #4a4a4a !important;
  border-bottom: 1px solid rgba(0,0,0,0.07);
}

.haras-experience .wp-block-list li::before {
  content: '';
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  width: 8px; height: 8px;
  background: var(--gold);
  border-radius: 50%;
}

.haras-exp-img-tall img {
  width: 100% !important;
  height: 300px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
  display: block !important;
  margin-bottom: 1rem !important;
}

.haras-exp-img-sm img {
  width: 100% !important;
  height: 185px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
  display: block !important;
}

/* ═══════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════ */
.haras-testimonials {
  background: var(--green-mid) !important;
  padding: 7rem clamp(1rem,4vw,2rem) !important;
}

.haras-testimonials h2,
.haras-testimonials .wp-block-heading {
  font-family: 'Playfair Display', serif !important;
  color: #fff !important;
}

.haras-test-card {
  background: rgba(255,255,255,0.055) !important;
  border: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 8px !important;
  padding: 2rem !important;
}

p.haras-test-quote {
  font-family: 'Playfair Display', serif !important;
  font-size: 4.5rem !important;
  color: var(--gold) !important;
  opacity: 0.3 !important;
  line-height: 0.7 !important;
  margin: 0 0 0.5rem !important;
}

p.haras-test-stars {
  color: var(--gold) !important;
  font-size: 0.85rem !important;
  letter-spacing: 3px !important;
  margin: 0 0 0.8rem !important;
}

p.haras-test-body {
  font-style: italic !important;
  font-weight: 300 !important;
  line-height: 1.7 !important;
  color: rgba(255,255,255,0.68) !important;
  font-size: 0.95rem !important;
  margin: 0 0 1.2rem !important;
}

p.haras-test-author {
  font-weight: 600 !important;
  color: #fff !important;
  font-size: 0.85rem !important;
  margin: 0 !important;
}

p.haras-test-role {
  font-weight: 300 !important;
  color: rgba(255,255,255,0.38) !important;
  font-size: 0.75rem !important;
  margin: 0 !important;
}

/* ═══════════════════════════════════
   CONTACT SECTION
═══════════════════════════════════ */
.haras-contact {
  background: var(--green-dark) !important;
  padding: 7rem clamp(1rem,4vw,2rem) !important;
  position: relative;
  overflow: hidden;
}

.haras-contact::before {
  content: '';
  position: absolute;
  bottom: -120px; left: -120px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(201,168,76,0.06) 0%, transparent 70%);
  pointer-events: none;
}

.haras-contact h2,
.haras-contact .wp-block-heading {
  font-family: 'Playfair Display', serif !important;
  color: #fff !important;
  line-height: 1.2 !important;
}

.haras-contact p { color: rgba(255,255,255,0.65) !important; font-weight: 300 !important; line-height: 1.7 !important; }

/* Contact detail rows */
.haras-contact-row {
  display: flex !important;
  align-items: flex-start !important;
  gap: 1rem !important;
  padding: 0.9rem 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  margin: 0 !important;
}

.haras-contact-row-icon {
  font-size: 1.1rem !important;
  line-height: 1.6 !important;
  flex-shrink: 0 !important;
}

/* Map */
.haras-map-wrap {
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(201,168,76,0.25);
  box-shadow: 0 20px 60px rgba(0,0,0,0.35);
  height: 100%;
  min-height: 480px;
}

.haras-map-wrap iframe {
  width: 100%;
  height: 100%;
  min-height: 480px;
  border: 0;
  display: block;
  filter: invert(0.85) hue-rotate(160deg) saturate(0.6) brightness(0.9);
}

/* ═══════════════════════════════════
   BUTTONS
═══════════════════════════════════ */
.haras-btn-gold .wp-block-button__link {
  background: var(--gold) !important;
  color: var(--green-dark) !important;
  border: 2px solid var(--gold) !important;
  border-radius: 4px !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 0.9rem 2.2rem !important;
  text-decoration: none !important;
  transition: all 0.3s !important;
}

.haras-btn-gold .wp-block-button__link:hover {
  background: transparent !important;
  color: var(--gold) !important;
}

.haras-btn-outline .wp-block-button__link {
  background: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,0.38) !important;
  border-radius: 4px !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 0.9rem 2.2rem !important;
  text-decoration: none !important;
  transition: all 0.3s !important;
}

.haras-btn-outline .wp-block-button__link:hover {
  border-color: #fff !important;
  background: rgba(255,255,255,0.08) !important;
}

.haras-btn-whatsapp .wp-block-button__link {
  background: #25d366 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 4px !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 0.9rem 2.2rem !important;
  text-decoration: none !important;
}

/* ═══════════════════════════════════
   FOOTER
═══════════════════════════════════ */
.haras-footer {
  background: #070f08 !important;
  border-top: 3px solid var(--gold) !important;
  padding: 4rem clamp(1rem,4vw,2rem) 2rem !important;
}

.haras-footer .wp-block-site-title a {
  font-family: 'Playfair Display', serif !important;
  color: var(--gold) !important;
  text-decoration: none !important;
  font-size: 1.6rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
}

.haras-footer-text p {
  font-size: 0.85rem !important;
  color: rgba(255,255,255,0.38) !important;
  line-height: 1.7 !important;
  font-weight: 300 !important;
}

p.haras-footer-heading {
  font-size: 0.68rem !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: var(--gold) !important;
  margin-bottom: 1rem !important;
}

.haras-footer-links p {
  font-size: 0.85rem !important;
  color: rgba(255,255,255,0.42) !important;
  line-height: 2.1 !important;
  font-weight: 300 !important;
  margin: 0 !important;
}

.haras-footer-links a {
  color: rgba(255,255,255,0.42) !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

.haras-footer-links a:hover { color: var(--gold) !important; }

p.haras-footer-copy {
  font-size: 0.72rem !important;
  color: rgba(255,255,255,0.22) !important;
  margin: 0 !important;
}
