/*
 * selva-overrides.css — Selva Dorada v2.0 LUXURY EDITION
 * ════════════════════════════════════════════════════════════════════════════
 *
 * Loaded LAST (priority 30) so every declaration here wins the cascade.
 * Complete luxury redesign — deep charcoal, muted antique gold, soft cream.
 * Replaces the previous teal palette with a timeless high-end aesthetic.
 *
 * Covers:
 *   1.  Luxury design tokens (cream, charcoal, antique gold)
 *   2.  Cormorant Garamond + Lato — refined font application
 *   3.  Blog archive grid & card styles
 *   4.  Services page — card polish
 *   5.  CTA ribbon — dark luxury
 *   6.  Buttons — gold & charcoal variants
 *   7.  Spacing & layout generosity
 *   8.  Pagination
 *   9.  Misc utility (section eyebrow, ornament, contact form)
 *  10.  Elementor canvas integration
 *
 * @package selva-dorada
 */


/* ════════════════════════════════════════════════════════════════════════════
   1. LUXURY DESIGN TOKENS
      Deep charcoal (#1A1A1A), antique muted gold (#C5A059), soft cream (#F4EFE6)
   ════════════════════════════════════════════════════════════════════════════ */

html.skin-light,
:root {
  /* ── Backgrounds — warm cream palette ── */
  --color-bg-primary:    #F4EFE6;   /* Soft warm cream — primary canvas       */
  --color-bg-secondary:  #EFE9DF;   /* Warmer cream — alternate sections       */
  --color-bg-card:       #FFFFFF;   /* Pure white cards for clean contrast     */
  --color-bg-dark:       #1A1A1A;   /* Deep charcoal — dark sections & footer  */

  /* ── Text — charcoal hierarchy ── */
  --color-text-primary:  #1A1A1A;   /* Deep charcoal — primary body text       */
  --color-text-muted:    #5C5652;   /* Warm mid-gray — secondary text          */
  --color-text-light:    #9C9490;   /* Muted warm gray — timestamps, labels    */

  /* ── Borders — warm stone ── */
  --color-border:        #DDD5C8;   /* Warm stone border                       */
  --color-border-light:  #EDE9E4;   /* Featherweight divider                   */

  /* ── Accent — antique muted gold (NOT yellow) ── */
  --color-accent:        #C5A059;   /* Antique gold — primary accent           */
  --color-accent-hover:  #D4B576;   /* Lighter gold on hover                   */
  --color-accent-dark:   #A8863E;   /* Deeper gold — links, hover text         */
  --color-accent-pale:   #F5EBD6;   /* Cream-gold wash — subtle bg tints       */
  --color-accent-text:   #FFFFFF;   /* Text on gold backgrounds                */

  /* ── CTA button — deep charcoal ── */
  --color-cta:           #C5A059;   /* Antiqued Gold CTA button background     */
  --color-cta-hover:     #A8863E;   /* Deeper gold on hover                    */
  --color-cta-text:      #FFFFFF;   /* White text on dark buttons              */

  /* ── Hero overlay ── */
  --color-hero-overlay:  rgba(15, 13, 11, 0.52);

  /* ── Shadows — warm charcoal tint ── */
  --shadow-sm:  0 1px 4px  rgba(28, 25, 23, 0.06);
  --shadow-md:  0 4px 16px rgba(28, 25, 23, 0.09);
  --shadow-lg:  0 12px 40px rgba(28, 25, 23, 0.13);
  --shadow-xl:  0 24px 64px rgba(28, 25, 23, 0.18);

  /* ── Card shadows ── */
  --card-shadow:     0 2px 8px rgba(28, 25, 23, 0.06), 0 8px 24px rgba(28, 25, 23, 0.08);
  --card-shadow-hov: 0 16px 48px rgba(28, 25, 23, 0.14), 0 4px 12px rgba(28, 25, 23, 0.10);
}


/* ════════════════════════════════════════════════════════════════════════════
   2. TYPOGRAPHY — Cormorant Garamond (display) + Lato (body)
      The most refined luxury pairing: editorial serif elegance + clean sans
   ════════════════════════════════════════════════════════════════════════════ */

:root {
  --font-display:    'Cormorant Garamond', 'Cormorant', Georgia, 'Times New Roman', serif;
  --font-display-sc: 'Cormorant SC', 'Cormorant Garamond', Georgia, serif;
  --font-alt:        'Playfair Display', 'Times New Roman', Georgia, serif;
  --font-body:       'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Display / headings — elegant Cormorant weight */
h1, h2, h3, h4, h5, h6,
.hero__title,
.selva-page-title,
.selva-section-title,
.selva-cta-ribbon__title,
.selva-svc-card__title,
.selva-service-card__title,
.selva-team-card__name,
.selva-logo__text,
.card__title,
.post-card__title,
.archive-title,
.selva-page-hero__title {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1.1;
}

/* Grand editorial hero title */
.hero__title {
  font-size: clamp(3rem, 8.5vw, 6.5rem);
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 1.0;
}

.selva-page-title,
.archive-title {
  font-size: clamp(2.2rem, 6vw, 4.2rem);
  font-weight: 400;
}

.selva-section-title {
  font-size: clamp(1.9rem, 4vw, 3.4rem);
  font-weight: 400;
}

/* Body elements — clean Lato */
body, p, li, td, th, label,
input, textarea, select, button,
.selva-btn, .btn,
.selva-nav__menu a,
.selva-nav__menu--fallback a,
.selva-footer__nav a {
  font-family: var(--font-body);
}

/* Nav links — refined small caps feel */
.selva-nav__menu > .menu-item > a,
.selva-nav__menu--fallback > .menu-item > a {
  font-size: 10.5px;
  letter-spacing: 0.14em;
}

/* Section eyebrow labels — Cormorant SC small caps */
.selva-section-eyebrow {
  font-family: var(--font-display-sc, var(--font-body));
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--color-accent);
}


/* ════════════════════════════════════════════════════════════════════════════
   3. HEADER — luxury cream with gold accents
   ════════════════════════════════════════════════════════════════════════════ */

.selva-header {
  background: rgba(244,239,230,0.97);
  border-bottom-color: var(--color-border);
}
.selva-header.is-scrolled {
  box-shadow: 0 2px 20px rgba(28, 25, 23, 0.08);
}

.selva-nav__menu > .menu-item > a::after,
.selva-nav__menu--fallback > .menu-item > a::after {
  background: var(--color-accent);
}
.selva-nav__menu > .menu-item > a:hover,
.selva-nav__menu--fallback > .menu-item > a:hover {
  color: var(--color-text-primary);
}


/* ════════════════════════════════════════════════════════════════════════════
   4. BLOG ARCHIVE — Premium card grid
   ════════════════════════════════════════════════════════════════════════════ */

.selva-blog-archive {
  padding-bottom: var(--sp-12, 96px);
}
.selva-blog-archive .selva-page-header {
  padding: var(--sp-8, 64px) 0 var(--sp-6, 48px);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--sp-8, 64px);
}

/* ── BLOG GRID ─────────────────────────────────────────────────────────── */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(20px, 2.5vw, 32px);
  margin-top: var(--sp-4, 32px);
}
@media (max-width: 1023px) { .blog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 599px)  { .blog-grid { grid-template-columns: 1fr; } }

/* ── BLOG CARD ─────────────────────────────────────────────────────────── */
.selva-blog-card {
  display: flex;
  flex-direction: column;
  background: var(--color-bg-card, #fff);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--card-shadow);
  transition: transform .32s cubic-bezier(.22,1,.36,1), box-shadow .32s cubic-bezier(.22,1,.36,1);
}
.selva-blog-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--card-shadow-hov);
}
.selva-blog-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  flex-shrink: 0;
  text-decoration: none;
}
.selva-blog-card__thumb {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .55s cubic-bezier(.22,1,.36,1);
}
.selva-blog-card:hover .selva-blog-card__thumb { transform: scale(1.07); }
.selva-blog-card__thumb-fallback {
  width: 100%; height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  color: rgba(255,255,255,.4);
  transition: transform .55s cubic-bezier(.22,1,.36,1);
}
.selva-blog-card:hover .selva-blog-card__thumb-fallback { transform: scale(1.04); }
.selva-blog-card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 40%, rgba(28,25,23,.45) 100%);
  opacity: 0;
  transition: opacity .35s ease;
  pointer-events: none;
}
.selva-blog-card:hover .selva-blog-card__overlay { opacity: 1; }
.selva-blog-card__cat {
  position: absolute;
  top: 14px; left: 14px;
  font-family: var(--font-body);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #fff;
  background: var(--color-accent);
  padding: 5px 10px;
  border-radius: 20px;
  z-index: 2;
  backdrop-filter: blur(4px);
}
.selva-blog-card__readtime {
  position: absolute;
  bottom: 12px; right: 12px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: rgba(255,255,255,.9);
  background: rgba(28,25,23,.55);
  padding: 4px 9px;
  border-radius: 20px;
  z-index: 2;
  backdrop-filter: blur(4px);
}
.selva-blog-card__body {
  padding: 24px 24px 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.selva-blog-card__title {
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1.2;
  margin: 0;
}
.selva-blog-card__title a {
  color: var(--color-text-primary);
  text-decoration: none;
  transition: color .2s ease;
}
.selva-blog-card__title a:hover { color: var(--color-accent-dark); }
.selva-blog-card__excerpt {
  font-size: .875rem;
  line-height: 1.65;
  color: var(--color-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}
.selva-blog-card__footer {
  padding: 16px 24px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--color-border-light, #EDE9E4);
  margin-top: 16px;
}
.selva-blog-card__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.selva-blog-card__avatar {
  border-radius: 50%;
  width: 28px !important;
  height: 28px !important;
  object-fit: cover;
  flex-shrink: 0;
}
.selva-blog-card__meta > div {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.selva-blog-card__author {
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}
.selva-blog-card__date {
  font-size: 10px;
  color: var(--color-text-light);
  line-height: 1.3;
}
.selva-blog-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-accent-dark);
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: color .2s ease, gap .2s ease;
}
.selva-blog-card__cta:hover { color: var(--color-accent); gap: 8px; }
.selva-blog-card__cta svg { transition: transform .2s ease; }
.selva-blog-card__cta:hover svg { transform: translateX(3px); }


/* ── PAGINATION ─────────────────────────────────────────────────────────── */
.page-links, .nav-links {
  display: flex; flex-wrap: wrap; gap: 8px;
  justify-content: center;
  margin-top: var(--sp-8, 64px);
}
.page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; padding: 0 12px;
  border: 1.5px solid var(--color-border);
  border-radius: 6px;
  font-size: 13px; font-weight: 700;
  color: var(--color-text-muted);
  text-decoration: none;
  transition: all .18s ease;
}
.page-numbers:hover, .page-numbers.current {
  background: var(--color-accent); border-color: var(--color-accent); color: #fff;
}


/* ════════════════════════════════════════════════════════════════════════════
   5. SERVICES — gold card accents
   ════════════════════════════════════════════════════════════════════════════ */

.selva-svc-card__title a:hover    { color: var(--color-accent-dark); }
.selva-svc-card__price            { color: var(--color-accent); }
.selva-service-card__price        { color: var(--color-accent-dark); }
.selva-service-card:hover         { background: var(--color-accent-pale); }
.selva-services-grid              { background: var(--color-border); border-color: var(--color-border); }
.selva-services-section           { background: var(--color-bg-secondary); }


/* ════════════════════════════════════════════════════════════════════════════
   6. BUTTONS — charcoal + gold system
   ════════════════════════════════════════════════════════════════════════════ */

/* Primary / CTA — deep charcoal */
.selva-btn--cta, .btn--primary {
  background:   var(--color-cta);
  border-color: var(--color-cta);
  color:        var(--color-cta-text);
}
.selva-btn--cta:hover, .btn--primary:hover {
  background:   var(--color-cta-hover);
  border-color: var(--color-cta-hover);
  box-shadow:   0 6px 20px rgba(28, 25, 23, 0.30);
}

/* Gold button */
.selva-btn--gold {
  background:   var(--color-accent);
  border-color: var(--color-accent);
  color:        #fff;
}
.selva-btn--gold:hover {
  background:   var(--color-accent-hover);
  border-color: var(--color-accent-hover);
  box-shadow:   0 6px 20px rgba(197,160,89, 0.35);
}

/* Outline */
.selva-btn--outline, .btn--outline {
  border-color: var(--color-accent);
  color:        var(--color-accent-dark);
}
.selva-btn--outline:hover, .btn--outline:hover {
  background:   var(--color-accent);
  border-color: var(--color-accent);
  color:        #fff;
}

/* Filter tabs */
.selva-filter-tabs__btn:hover,
.selva-filter-tabs__btn.is-active,
.selva-filter-btn:hover,
.selva-filter-btn.is-active,
.gallery-filters__btn:hover,
.gallery-filters__btn.is-active {
  background:   var(--color-accent);
  border-color: var(--color-accent);
  color:        #fff;
}


/* ════════════════════════════════════════════════════════════════════════════
   7. HERO — charcoal gradient + gold accents
   ════════════════════════════════════════════════════════════════════════════ */

.hero__eyebrow { color: var(--color-accent); }

.hero__cta-primary {
  background:   var(--color-cta);
  border-color: var(--color-cta);
}
.hero__cta-primary:hover {
  background:   transparent;
  color:        var(--color-cta);
}

/* No-media hero: deep charcoal gradient */
.hero:not(:has(.hero__video)):not(:has(.hero__image-bg)) {
  background:
    radial-gradient(ellipse at 25% 60%, rgba(197,160,89,.14) 0%, transparent 55%),
    linear-gradient(160deg, #1A1A1A 0%, #2A2420 45%, #332D29 100%);
}


/* ════════════════════════════════════════════════════════════════════════════
   8. CTA RIBBON — deep charcoal + gold
   ════════════════════════════════════════════════════════════════════════════ */

.selva-cta-ribbon { background: var(--color-bg-dark); }

.selva-cta-ribbon::before {
  background:
    radial-gradient(ellipse at 15% 50%, rgba(197,160,89,.18) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 50%, rgba(197,160,89,.09) 0%, transparent 50%);
}

.selva-cta-ribbon__btn-book {
  background:   var(--color-accent);
  border-color: var(--color-accent);
}
.selva-cta-ribbon__btn-book:hover {
  background:   var(--color-accent-hover);
  border-color: var(--color-accent-hover);
}


/* ════════════════════════════════════════════════════════════════════════════
   9. SECTION ORNAMENT & EYEBROW — gold
   ════════════════════════════════════════════════════════════════════════════ */

.selva-section-ornament          { background: var(--color-accent); }
.selva-section-eyebrow           { color: var(--color-accent); }
.selva-section-ornament::before,
.selva-section-ornament::after   { color: var(--color-accent); }


/* ════════════════════════════════════════════════════════════════════════════
   10. STATS, TESTIMONIALS, TEAM — gold accents
   ════════════════════════════════════════════════════════════════════════════ */

.selva-stat__num                  { color: var(--color-accent); }
.selva-star--filled               { color: var(--color-accent); }
.selva-testimonial-card__service  { color: var(--color-accent); }
.selva-team-card__role            { color: var(--color-accent); }
.selva-team-card__name a:hover    { color: var(--color-accent-dark); }


/* ════════════════════════════════════════════════════════════════════════════
   11. FOOTER — gold accent links
   ════════════════════════════════════════════════════════════════════════════ */

.selva-footer__col-title              { color: var(--color-accent); }
.selva-footer__social a:hover         { border-color: var(--color-accent); color: var(--color-accent); }
.selva-footer__contact-icon           { color: var(--color-accent); }
.selva-footer__contact-line a:hover   { color: var(--color-accent); }
.selva-footer__legal-nav li a:hover   { color: var(--color-accent); }


/* ════════════════════════════════════════════════════════════════════════════
   12. FORMS — gold focus ring
   ════════════════════════════════════════════════════════════════════════════ */

.selva-form__input:focus,
.form__input:focus,
.selva-form__textarea:focus,
.form__textarea:focus,
.selva-contact-form input:focus,
.selva-contact-form textarea:focus {
  border-color: var(--color-accent);
  box-shadow:   0 0 0 3px rgba(197,160,89, 0.18);
  outline:      none;
}
.selva-contact-form { max-width: 640px; }
.selva-contact-form .selva-form__group { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--sp-3, 24px); }


/* ════════════════════════════════════════════════════════════════════════════
   13. ACCESSIBILITY — gold focus outline
   ════════════════════════════════════════════════════════════════════════════ */

:focus-visible { outline-color: var(--color-accent); }


/* ════════════════════════════════════════════════════════════════════════════
   14. LUXURY TYPOGRAPHY REFINEMENTS
       Generous spacing + elegant Cormorant Garamond + Lato pairing
   ════════════════════════════════════════════════════════════════════════════ */

/* Drop-cap on first paragraph — editorial sophistication */
.selva-services-intro > p:first-of-type::first-letter,
.entry-content > p:first-of-type::first-letter {
  font-family: var(--font-display);
  font-size: 3.8em;
  font-weight: 400;
  line-height: 0.75;
  float: left;
  margin: 0.06em 0.12em 0 0;
  color: var(--color-accent);
}

/* Italic elegance on section subtitles */
.selva-section-subtitle {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: var(--color-text-muted);
  font-weight: 400;
  letter-spacing: 0.01em;
}

/* Service card titles */
.selva-svc-card__title {
  font-size: clamp(1.15rem, 2.2vw, 1.45rem);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

/* Blog post card title */
.card__title {
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

/* Readable body paragraphs with generous leading */
.selva-page-body p,
.entry-content p,
.prose p {
  line-height: 1.8;
  letter-spacing: 0.01em;
  color: var(--color-text-primary);
}

/* Generous section spacing for premium breathable layout */
.selva-section {
  padding-top:    clamp(64px, 8vw, 120px);
  padding-bottom: clamp(64px, 8vw, 120px);
}


/* ════════════════════════════════════════════════════════════════════════════
   15. SERVICES PAGE — layout polish
   ════════════════════════════════════════════════════════════════════════════ */

.page-services .selva-page-header {
  padding-top:    var(--sp-8, 64px);
  padding-bottom: var(--sp-4, 32px);
  border-bottom:  1px solid var(--color-border-light);
  margin-bottom:  var(--sp-6, 48px);
}
.page-services .selva-services-intro {
  max-width: 720px;
  margin-bottom: var(--sp-6, 48px);
  font-size: 1.08rem;
  line-height: 1.78;
}
.selva-page-body,
.selva-services-intro {
  font-family: var(--font-body);
  color: var(--color-text-primary);
}
.selva-page-body p:empty,
.selva-services-intro p:empty {
  display: none;
}
.selva-admin-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  background: var(--color-accent-pale);
  border: 1.5px solid var(--color-border);
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: var(--sp-6, 48px);
  color: var(--color-text-muted);
}
.selva-admin-banner__link {
  color: var(--color-accent-dark);
  font-weight: 700;
  text-decoration: none;
  margin-left: 6px;
}
.selva-admin-banner__link:hover { text-decoration: underline; }


/* ════════════════════════════════════════════════════════════════════════════
   16. BLOG GRID — final layout pass
   ════════════════════════════════════════════════════════════════════════════ */

.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--svc-grid-gap, 28px);
  margin-top: var(--sp-4, 32px);
}
.blog-grid .card {
  background: var(--color-bg-card);
  border-radius: var(--card-radius, 12px);
  overflow: hidden;
  box-shadow: var(--card-shadow);
}
.blog-grid .card:not(:has(.card__image)) {
  border-top: 4px solid var(--color-accent);
}
.blog-grid .card.card--blog { min-height: 360px; }
.card__excerpt {
  font-size: 0.9rem;
  line-height: 1.65;
  color: var(--color-text-muted);
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
}
.card__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: var(--color-text-light);
}
.card__meta img {
  border-radius: 50%;
  width: 32px;
  height: 32px;
  object-fit: cover;
}
@media (max-width: 640px) { .blog-grid { grid-template-columns: 1fr; } }


/* ════════════════════════════════════════════════════════════════════════════
   17. SERVICES GRID — strong override for always-visible cards
   ════════════════════════════════════════════════════════════════════════════ */

.selva-services-grid,
.selva-services-grid--page {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: clamp(20px, 2.5vw, 32px) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
}
@media (max-width: 1023px) {
  .selva-services-grid,
  .selva-services-grid--page { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 599px) {
  .selva-services-grid,
  .selva-services-grid--page { grid-template-columns: 1fr !important; }
}

.selva-svc-card {
  background: var(--color-bg-card, #fff) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: var(--card-shadow) !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 380px;
}
.selva-svc-card__media {
  aspect-ratio: 3/2;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--color-bg-secondary, #EFE9DF);
  position: relative;
}
.selva-svc-card__img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.selva-svc-card__body {
  padding: 20px 20px 0;
  flex: 1;
  display: flex; flex-direction: column; gap: 8px;
}
.selva-svc-card__title {
  font-family: var(--font-display) !important;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--color-text-primary);
}
.selva-svc-card__title a {
  color: inherit; text-decoration: none;
  transition: color .2s ease;
}
.selva-svc-card__title a:hover { color: var(--color-accent-dark); }
.selva-svc-card__excerpt {
  font-size: .875rem;
  line-height: 1.6;
  color: var(--color-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.selva-svc-card__meta {
  display: flex; gap: 14px; flex-wrap: wrap;
  margin-top: auto;
  padding-top: 10px;
}
.selva-svc-card__price { color: var(--color-accent) !important; font-weight: 700; font-size: .85rem; }
.selva-svc-card__dur   { color: var(--color-text-muted); font-size: .85rem; }
.selva-svc-card__footer {
  padding: 14px 20px 18px;
  display: flex; gap: 10px;
  border-top: 1px solid var(--color-border-light);
  margin-top: 14px;
}


/* ════════════════════════════════════════════════════════════════════════════
   18. ELEMENTOR CANVAS — clean integration
   ════════════════════════════════════════════════════════════════════════════ */

/* Full-width canvas: remove all container constraints when Elementor renders */
.selva-elementor-canvas {
  padding: 0;
  margin: 0;
  min-height: 60vh;
}
.selva-elementor-canvas .elementor {
  width: 100%;
}

/* Elementor sections: inherit luxury spacing */
.elementor-section-wrap .elementor-section {
  font-family: var(--font-body);
}
.elementor-section-wrap h1,
.elementor-section-wrap h2,
.elementor-section-wrap h3,
.elementor-section-wrap h4 {
  font-family: var(--font-display);
  font-weight: 500;
}

/* Ensure Elementor widgets pick up our luxury colour tokens */
.elementor-widget-heading .elementor-heading-title {
  font-family: var(--font-display);
}
.elementor-widget-button .elementor-button {
  font-family: var(--font-body);
  letter-spacing: 0.1em;
}


/* ════════════════════════════════════════════════════════════════════════════
   18. DARK NAVIGATION — Black header, white nav text, gold accents
       Luxury standard: think Chanel, Dior, La Mer — dark bar, refined caps
   ════════════════════════════════════════════════════════════════════════════ */

/*
 * ── Base header: deep charcoal on every page ─────────────────────────────
 * Overrides the cream rgba(244,239,230,0.97) set in Section 3 above.
 * Specificity: same selector + !important wins.
 */
.selva-header {
  background: #0E0C0A !important;          /* Near-black, warm tint             */
  border-bottom-color: rgba(197,160,89,.18) !important; /* Subtle gold hairline  */
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}
.selva-header.is-scrolled {
  background: rgba(14, 12, 10, 0.98) !important;
  box-shadow: 0 2px 24px rgba(0,0,0,.38) !important;
}

/*
 * ── Nav link text: white with gold hover ─────────────────────────────────
 */
.selva-nav__menu a,
.selva-nav__menu > .menu-item > a,
.selva-nav__menu--fallback > .menu-item > a {
  color: rgba(245, 240, 232, 0.72) !important;   /* Warm white, slightly muted  */
  text-shadow: none !important;
  letter-spacing: 0.18em !important;
  font-size: 10px !important;
}
.selva-nav__menu a:hover,
.selva-nav__menu > .menu-item > a:hover,
.selva-nav__menu .current-menu-item > a,
.selva-nav__menu .current_page_item > a {
  color: #F5F0E8 !important;                      /* Bright warm white on active */
}
.selva-nav__menu .current-menu-item > a::after,
.selva-nav__menu .current_page_item > a::after {
  background: var(--color-accent, #C5A059) !important; /* Gold underline dot     */
}

/*
 * ── Logo text: white on dark bar ─────────────────────────────────────────
 */
.selva-logo__text {
  color: #F5F0E8 !important;
}

/*
 * ── Mobile menu toggle (hamburger lines): white ───────────────────────────
 */
.selva-nav__toggle span {
  background: rgba(245, 240, 232, 0.85) !important;
}

/*
 * ── Book Now CTA button: antique gold, always ─────────────────────────────
 */
.selva-header .selva-btn--cta {
  background: var(--color-accent, #C5A059) !important;
  border-color: var(--color-accent, #C5A059) !important;
  color: #ffffff !important;
}
.selva-header .selva-btn--cta:hover {
  background: var(--color-accent-hover, #D4B576) !important;
  border-color: var(--color-accent-hover, #D4B576) !important;
}

/*
 * ── V1 Homepage (transparent hero) — PERMANENTLY SOLID BLACK ─────────────
 * No gradient. Black always, scroll or no scroll.
 */
.selva-header--v1:not(.is-scrolled),
.selva-header--transparent:not(.is-scrolled) {
  background: #0E0C0A !important;
  border-bottom-color: rgba(197,160,89,.18) !important;
  box-shadow: none !important;
}

/* V1 scrolled state: solid dark ----------------------------------------- */
.selva-header--v1.is-scrolled,
.selva-header--transparent.is-scrolled {
  background: rgba(14, 12, 10, 0.98) !important;
  border-bottom-color: rgba(197,160,89,.18) !important;
}

/*
 * ── Elementor editor override: keep dark header in editor too ────────────
 */
body.elementor-editor-active .selva-header--v1,
body.elementor-editor-active .selva-header--transparent,
body.elementor-page-edit .selva-header--v1,
body.elementor-page-edit .selva-header--transparent {
  background: rgba(14, 12, 10, 0.96) !important;
  border-bottom-color: rgba(197,160,89,.18) !important;
}

/*
 * ── Mobile nav dropdown: dark background ─────────────────────────────────
 */
.selva-nav__mobile,
.selva-mobile-menu,
.selva-nav.is-open {
  background: #0E0C0A !important;
}
.selva-nav__mobile .menu-item a,
.selva-mobile-menu .menu-item a {
  color: rgba(245, 240, 232, 0.8) !important;
  border-bottom-color: rgba(197,160,89,.12) !important;
}
.selva-nav__mobile .menu-item a:hover,
.selva-mobile-menu .menu-item a:hover {
  color: #F5F0E8 !important;
  background: rgba(197,160,89,.08) !important;
}


/* ════════════════════════════════════════════════════════════════════════════
   19. LUXURY TYPOGRAPHY REFINEMENTS
       Elevate the type feel: tighter tracking on headings, optical sizing
       on Cormorant, and more generous line-height on body paragraphs.
   ════════════════════════════════════════════════════════════════════════════ */

/*
 * ── Import Google Fonts upgrade: Cormorant + Lato ─────────────────────────
 * Adds optical sizing axis and italic for Cormorant Garamond.
 * (Self-host in production — these are safe for admin/preview use.)
 */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Cormorant+SC:wght@300;400;500&family=Lato:ital,wght@0,300;0,400;0,700;1,300;1,400&display=swap');

/*
 * ── Section headings: lighter weight for editorial luxury ─────────────────
 */
.selva-section-title {
  font-weight: 300 !important;
  letter-spacing: -0.03em !important;
}

h1.selva-page-hero__title,
.selva-page-hero__title {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  color: #fff !important;
  text-shadow: 0 4px 40px rgba(0,0,0,.3);
}

/*
 * ── Body text: slightly looser for luxury breathing room ──────────────────
 */
body, p {
  line-height: 1.78 !important;
  letter-spacing: 0.01em !important;
}

/*
 * ── Eyebrow labels: Cormorant SC small caps ───────────────────────────────
 */
.selva-section-eyebrow {
  font-family: var(--font-display-sc, 'Cormorant SC', Georgia, serif) !important;
  font-size: 11px !important;
  letter-spacing: 0.28em !important;
  font-weight: 400 !important;
}

/*
 * ── Price display: editorial italic ───────────────────────────────────────
 */
.selva-service-card__price,
.selva-stat__num {
  font-family: var(--font-display) !important;
  font-style: italic !important;
  font-weight: 300 !important;
  letter-spacing: -0.02em !important;
}

/*
 * ── CTA buttons: refined uppercase tracking ───────────────────────────────
 */
.selva-btn {
  letter-spacing: 0.14em !important;
  font-weight: 400 !important;
}


/* ════════════════════════════════════════════════════════════════════════════
   20. FIX: White strip below navigation — all pages
       Root cause: .selva-main / .selva-page-main / .site-main carry a
       padding-top: 48px (from selva-enhancements.css) that exposes the
       cream body background as a visible strip between the nav and the
       first content section.
       Fix: zero out top-padding on every main-content wrapper here (last
       loaded file wins). Re-attach internal spacing via .selva-page-header
       so regular text pages still get breathing room.
   ════════════════════════════════════════════════════════════════════════════ */

/* Remove the strip — all page wrappers */
.selva-main,
.selva-page-main,
.site-main,
.selva-elementor-canvas {
  padding-top: 0 !important;
}

/* Elementor canvas: zero everything so hero fills edge-to-edge */
.selva-elementor-canvas {
  padding-bottom: 0 !important;
  min-height: 0 !important;
}

/* Restore breathing room for standard text pages (About, Contact, etc.)
   Spacing now lives inside the content, not the wrapper */
.selva-page-header {
  padding-top: var(--sp-10, 80px) !important;
}

/* ── Sobre Mí — constrain Elementor hero to match standard page-banner (58 vh)
   The section carries css_classes "selva-hero-section selva-about-hero"
   set in the Elementor editor. Max-height + overflow:hidden clips the tall
   portrait column so the hero stays the same visual weight as every other
   inner-page banner. ──────────────────────────────────────────────────────── */
.selva-about-hero.elementor-section,
.selva-about-hero.e-con,
.selva-about-hero {
  min-height: 58vh !important;
  max-height: 58vh !important;
  overflow: hidden !important;
}
/* Ensure inner columns/containers don't push the section taller */
.selva-about-hero .elementor-container,
.selva-about-hero .elementor-column,
.selva-about-hero .elementor-col-50,
.selva-about-hero .elementor-col-100 {
  max-height: 58vh;
  overflow: hidden;
}
/* Keep the portrait image proportional inside its clipped column */
.selva-about-hero .elementor-widget-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}