/* ============================================================
   ZAHRADY PEŠINA – redesign v51b
   Botanický styl: krém, šalvěj, zlato, patková písma
   Fonty: načítány přes <link> v header.php
   ============================================================ */

/* ── Proměnné ─────────────────────────────────────────────── */
:root {
  --cream:      #f8f4ec;
  --cream-2:    #f2ede0;
  --cream-3:    #ede6d5;
  --card-bg:    #ffffff;
  --sage:       #7a9e7e;
  --sage-circle:#e6ede6;
  --sage-tag:   #ddeadd;
  --gold:       #c9a240;
  --gold-light: #e8d49a;
  --gold-btn:   linear-gradient(135deg, #d4b870 0%, #c49a38 100%);
  --green-dark: #1e3020;
  --green-mid:  #2d5030;
  --green-950:  #0d2318;
  --green-900:  #123321;
  --green-800:  #17472d;
  --green-700:  #245b3a;
  --ink:        #222820;
  --ink-soft:   #5f6b64;
  --muted:      #6b7a65;
  --border:     #e4ddd0;
  --line:       #e4ddd0;
  --shadow-card: 0 4px 24px rgba(30,48,32,.07);
  --shadow-hdr:  0 2px 24px rgba(30,48,32,.08);
  --shadow:      0 18px 50px rgba(13,35,24,.10);
  --radius-card: 20px;
  --radius-tag:  999px;
}

/* ══════════════════════════════════════════════════════════════
   BODY – krémové pozadí + botanické listy po stranách
   ══════════════════════════════════════════════════════════════ */
html, html body {
  background: var(--cream) !important;
  background-image: none !important;
}
html body {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--ink) !important;
}
html body * { text-shadow: none !important; }

/* Botanické listy – na body, position fixed, vždy viditelné */
html body::before,
html body::after {
  content: '' !important;
  display: block !important;
  position: fixed !important;
  top: 0 !important; bottom: 0 !important;
  width: 260px !important;
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: .5 !important;
  background-repeat: repeat-y !important;
  background-size: 220px auto !important;
}
html body::before {
  left: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 600'%3E%3Cg fill='none' stroke='%237a9e7e' stroke-width='1.2' opacity='.5'%3E%3Cellipse cx='80' cy='120' rx='30' ry='55' transform='rotate(-30 80 120)'/%3E%3Cellipse cx='50' cy='200' rx='25' ry='48' transform='rotate(20 50 200)'/%3E%3Cellipse cx='110' cy='260' rx='28' ry='52' transform='rotate(-15 110 260)'/%3E%3Cellipse cx='60' cy='340' rx='22' ry='44' transform='rotate(35 60 340)'/%3E%3Cellipse cx='100' cy='420' rx='26' ry='50' transform='rotate(-25 100 420)'/%3E%3Cpath d='M90 80 Q70 140 60 210 Q50 280 70 360' stroke-width='1.5'/%3E%3Cellipse cx='140' cy='160' rx='18' ry='36' transform='rotate(40 140 160)'/%3E%3Ccircle cx='45' cy='130' r='4' fill='%23c9a240' stroke='none' opacity='.6'/%3E%3Ccircle cx='120' cy='300' r='3' fill='%23c9a240' stroke='none' opacity='.5'/%3E%3Ccircle cx='70' cy='380' r='5' fill='%23c9a240' stroke='none' opacity='.4'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-position: top left !important;
}
html body::after {
  right: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 600'%3E%3Cg fill='none' stroke='%237a9e7e' stroke-width='1.2' opacity='.5'%3E%3Cellipse cx='120' cy='100' rx='30' ry='55' transform='rotate(30 120 100)'/%3E%3Cellipse cx='150' cy='190' rx='25' ry='48' transform='rotate(-20 150 190)'/%3E%3Cellipse cx='90' cy='270' rx='28' ry='52' transform='rotate(15 90 270)'/%3E%3Cellipse cx='140' cy='350' rx='22' ry='44' transform='rotate(-35 140 350)'/%3E%3Cellipse cx='100' cy='440' rx='26' ry='50' transform='rotate(25 100 440)'/%3E%3Cpath d='M110 60 Q130 130 140 200 Q150 280 130 360' stroke-width='1.5'/%3E%3Cellipse cx='60' cy='150' rx='18' ry='36' transform='rotate(-40 60 150)'/%3E%3Ccircle cx='155' cy='120' r='4' fill='%23c9a240' stroke='none' opacity='.6'/%3E%3Ccircle cx='80' cy='310' r='3' fill='%23c9a240' stroke='none' opacity='.5'/%3E%3Ccircle cx='130' cy='390' r='5' fill='%23c9a240' stroke='none' opacity='.4'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-position: top right !important;
}

/* ── Typografie ────────────────────────────────────────────── */
html body h1, html body h2, html body h3, html body h4, html body h5 {
  font-family: 'Playfair Display', Georgia, serif !important;
  letter-spacing: -.01em !important;
  color: var(--green-dark) !important;
}
html body p, html body li, html body small { color: var(--muted) !important; }

/* ── Topbar – skryt ────────────────────────────────────────── */
html body .topbar { display: none !important; }
html body.is-home .site-header { top: 0 !important; }
html body.is-inner .site-header { top: 0 !important; }

/* ══════════════════════════════════════════════════════════════
   HEADER – BÍLÝ (nejvyšší specificita)
   ══════════════════════════════════════════════════════════════ */
html body .site-header,
html body .site-header--overlay,
html body .site-header.is-scrolled,
html body.is-home .site-header,
html body.is-inner .site-header,
html body.is-home .site-header--overlay,
html body.is-home .site-header.is-scrolled {
  background: #ffffff !important;
  background-image: none !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: var(--shadow-hdr) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  position: sticky !important;
  z-index: 50 !important;
}

html body .site-header .nav-wrap { height: 80px !important; }

/* Logo – bez filtrů */
html body .brand img {
  height: 62px !important;
  width: auto !important;
  filter: none !important;
  opacity: 1 !important;
}

/* Nav links – tmavé na bílém pozadí */
html body .site-header .main-nav > a,
html body .site-header .nav-dropdown > a {
  color: var(--green-dark) !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
  opacity: 1 !important;
}
html body .site-header .main-nav a:hover,
html body .site-header .main-nav .is-active {
  background: var(--sage-circle) !important;
  color: var(--green-mid) !important;
}

/* Hamburger – tmavý */
html body .site-header .nav-toggle span {
  background: var(--green-dark) !important;
}

/* Phone v headeru */
html body .header-phone {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--green-dark) !important;
  font-weight: 700;
  font-size: 14px;
  white-space: nowrap;
  margin-left: auto;
  margin-right: 14px;
}
html body .header-phone svg { color: var(--sage); flex-shrink: 0; }

/* CTA tlačítko – zlaté */
html body .site-header .nav-cta,
html body .nav-cta {
  background: var(--gold-btn) !important;
  color: var(--green-dark) !important;
  font-weight: 800 !important;
  border-radius: 999px !important;
  padding: 12px 20px !important;
  border: none !important;
  box-shadow: 0 6px 20px rgba(196,154,56,.28) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

/* Mega menu – bílé, čisté */
html body .site-header .mega-menu,
html body .mega-menu {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 20px 50px rgba(30,48,32,.12) !important;
  color: var(--ink) !important;
}
html body .site-header .mega-menu a,
html body .mega-menu a {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--ink) !important;
}
html body .site-header .mega-menu a:hover,
html body .mega-menu a:hover {
  background: var(--sage-circle) !important;
}
html body .site-header .mega-menu strong,
html body .mega-menu strong { color: var(--green-dark) !important; }
html body .site-header .mega-menu span,
html body .mega-menu span { color: var(--muted) !important; }
html body .site-header .mega-menu *,
html body .mega-menu * { opacity: 1 !important; }

html body .mega-menu .mega-intro {
  background: linear-gradient(135deg, var(--green-dark), var(--green-mid)) !important;
  border: none !important;
}
html body .mega-menu .mega-intro strong,
html body .mega-menu .mega-intro span,
html body .mega-menu .mega-intro * { color: #fff !important; }
html body .mega-menu .mega-intro span { color: #dfeee0 !important; }

/* Mobilní menu */
@media (max-width: 820px) {
  html body .brand img { height: 50px !important; }
  html body .main-nav {
    background: #fff !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 20px 50px rgba(30,48,32,.14) !important;
  }
  html body .site-header .main-nav > a,
  html body .site-header .nav-dropdown > a,
  html body .main-nav > a,
  html body .nav-dropdown > a { color: var(--green-dark) !important; }
  html body .header-phone { display: none !important; }
  html body .site-header .mega-menu {
    position: static !important;
    width: 100% !important;
    grid-template-columns: 1fr !important;
    box-shadow: none !important;
  }
}

/* ══════════════════════════════════════════════════════════════
   HERO – zahradní tapeta
   ══════════════════════════════════════════════════════════════ */
html body .hero,
html body .hero--home,
html body .hero.hero--home {
  background: url('../img/hero-tapeta.webp') center/cover no-repeat !important;
  position: relative !important;
  z-index: 1 !important;
  min-height: auto !important;
}
/* Tmavý overlay pro čitelnost */
html body .hero::before,
html body .hero--home::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(15,30,18,.55) 0%, rgba(15,30,18,.65) 100%) !important;
  z-index: 0 !important;
}
html body .hero::after { display: none !important; content: none !important; }

/* Hero grid – nižší, single column */
html body .hero-grid {
  grid-template-columns: 1fr !important;
  min-height: 480px !important;
  padding: 100px 0 60px !important;
  position: relative !important;
  z-index: 1 !important;
}
html body .hero-grid--single {
  max-width: 940px !important;
}

/* Skleněná karta za textem */
html body .hero-copy {
  background: rgba(255,255,255,.12) !important;
  backdrop-filter: blur(18px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 28px !important;
  padding: 40px 38px 36px !important;
  max-width: 700px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.18) !important;
}

html body .hero h1 { color: #fff !important; font-size: clamp(36px,5vw,60px) !important; margin-bottom: 18px !important; }
html body .hero p { color: rgba(255,255,255,.92) !important; font-size: 17px !important; }
html body .hero .eyebrow { color: var(--gold-light) !important; }
html body .hero-trust span { color: #fff !important; background: rgba(255,255,255,.12) !important; border: 1px solid rgba(255,255,255,.18) !important; }

/* Vizuální panel (starý ilustrační) – schovat pokud je tapeta */
html body .hero-panel { display: none !important; }
html body .floating-card { display: none !important; }

/* Hero s custom pozadím (admin tapeta) */
html body .hero--bg {
  background: var(--green-dark) !important;
  position: relative !important;
  z-index: 1 !important;
}
html body .hero--bg::before {
  background-image: linear-gradient(180deg, rgba(15,30,18,.50), rgba(15,30,18,.60)), var(--hero-bg-image) !important;
  background-size: cover !important;
  background-position: center !important;
}
html body .hero--bg::after { display: none !important; content: none !important; }
html body .hero--bg h1 { color: #fff !important; }
html body .hero--bg p { color: rgba(255,255,255,.88) !important; }
html body .hero--bg .eyebrow { color: var(--gold-light) !important; }

/* Page hero (podstránky) – zelený gradient */
html body .page-hero {
  background: radial-gradient(ellipse at 60% 0%, rgba(201,162,64,.18) 0%, transparent 50%),
              linear-gradient(135deg, var(--green-dark) 0%, #3a6040 100%) !important;
  padding: 80px 0 !important;
  position: relative !important;
  z-index: 1 !important;
}
html body .page-hero::after { display: none !important; content: none !important; }
html body .page-hero h1 { color: #fff !important; }
html body .page-hero p { color: rgba(255,255,255,.88) !important; }
html body .page-hero .eyebrow { color: var(--gold-light) !important; }

/* Page hero s tapetou */
html body .page-hero.has-bg { background: var(--green-dark) !important; }
html body .page-hero.has-bg::after { display: none !important; content: none !important; }
html body .page-hero.has-bg h1 { color: #fff !important; }
html body .page-hero.has-bg p { color: rgba(255,255,255,.88) !important; }
html body .page-hero.has-bg .eyebrow { color: var(--gold-light) !important; }

/* Podstránky hero */
html body.is-inner .page-hero {
  background: radial-gradient(ellipse at 60% 0%, rgba(201,162,64,.18) 0%, transparent 50%),
              linear-gradient(135deg, var(--green-dark) 0%, #3a6040 100%) !important;
}
html body.is-inner .page-hero h1 { color: #fff !important; }
html body.is-inner .page-hero p { color: rgba(255,255,255,.88) !important; }
html body.is-inner .page-hero .eyebrow { color: var(--gold-light) !important; }

/* Mobil – hero ještě kompaktnější */
@media (max-width: 820px) {
  html body .hero-grid { min-height: 400px !important; padding: 90px 0 40px !important; }
  html body .hero-copy { padding: 28px 24px 24px !important; }
  html body .hero h1 { font-size: clamp(30px,8vw,42px) !important; }
}

/* ══════════════════════════════════════════════════════════════
   SEKCE – průhledné pozadí na krému
   ══════════════════════════════════════════════════════════════ */
html body main > section,
html body .section,
html body .services-section,
html body .split-section,
html body .refs-section,
html body .articles-section,
html body .process-section,
html body .process-section.light {
  background: transparent !important;
  background-image: none !important;
  color: var(--ink) !important;
  position: relative !important;
  z-index: 1 !important;
}
html body .quick-paths {
  position: relative !important;
  z-index: 2 !important;
}
html body .site-footer,
html body footer {
  position: relative !important;
  z-index: 1 !important;
}
html body .section:nth-of-type(even) { background: rgba(255,255,255,.45) !important; }

html body main h1,
html body main h2,
html body main h3,
html body main h4,
html body .section-head h2,
html body .section h2,
html body .split-grid h2 { color: var(--green-dark) !important; }

html body main p,
html body main li,
html body .section-head p,
html body .text-stack p,
html body .split-grid p { color: var(--muted) !important; }

html body .eyebrow { color: var(--gold) !important; }

/* ── Dekorativní zlatá ikona nad nadpisy ─────────────────── */
.section-ornament { display: flex; justify-content: center; margin-bottom: 12px; }
.section-ornament svg { color: var(--gold); }

/* ══════════════════════════════════════════════════════════════
   KARTY – univerzální bílý styl
   ══════════════════════════════════════════════════════════════ */
html body .service-card,
html body .service-card-new,
html body .ref-card,
html body .article-list article,
html body .proof-list div,
html body .quick-grid a,
html body .side-card,
html body .empty-showcase,
html body .faq-list details,
html body .inquiry-form,
html body .timeline div,
html body .faq-card,
html body .note-box,
html body [class*="card"]:not(.location-card):not(.visual-card):not(.floating-card) {
  background: var(--card-bg) !important;
  background-image: none !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-card) !important;
  color: var(--ink) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body .service-card *,
html body .ref-card *,
html body .article-list article *,
html body .proof-list div *,
html body .quick-grid a *,
html body .side-card *,
html body .timeline div *,
html body .faq-list details *,
html body .faq-card * {
  opacity: 1 !important;
}
html body .service-card h2, html body .service-card h3,
html body .ref-card h2, html body .ref-card h3,
html body .article-list h2, html body .article-list h3,
html body .quick-grid strong,
html body .proof-list strong,
html body .timeline h3 { color: var(--green-dark) !important; }

html body .service-card p, html body .ref-card p,
html body .article-list article p,
html body .proof-list div span,
html body .quick-grid em,
html body .timeline p { color: var(--muted) !important; }

html body .service-card a,
html body .ref-card a,
html body .article-list a,
html body .empty-showcase a { color: var(--green-mid) !important; font-weight: 900 !important; }

html body .quick-grid a::before { display: none !important; content: none !important; }
html body .quick-grid span { color: var(--gold) !important; }

/* ── Nové karty služeb (se SVG ikonami) ───────────────────── */
.cards--services-new {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 1100px) { .cards--services-new { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px)  { .cards--services-new { grid-template-columns: 1fr; } }

html body .service-card-new {
  background: var(--card-bg) !important;
  background-image: none !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-card);
  padding: 28px 22px 24px;
  text-align: center;
  box-shadow: var(--shadow-card) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: transform .2s, box-shadow .2s;
  overflow: hidden;
}
html body .service-card-new:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(30,48,32,.12) !important;
}

html body .svc-icon-circle {
  width: 72px; height: 72px;
  min-width: 72px; min-height: 72px;
  border-radius: 50%;
  background: var(--sage-circle) !important;
  background-image: none !important;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
  border: 1.5px solid rgba(122,158,126,.25) !important;
  color: var(--sage);
}
.svc-icon-circle svg { width: 36px; height: 36px; flex-shrink: 0; }

html body .service-card-new h2 {
  font-size: 18px !important;
  line-height: 1.25 !important;
  margin: 0 0 10px !important;
  color: var(--green-dark) !important;
}
html body .service-card-new p {
  font-size: 13.5px !important;
  color: var(--muted) !important;
  line-height: 1.6;
  margin: 0 0 16px;
  flex: 1;
}

.svc-tags {
  display: flex; flex-wrap: wrap; gap: 6px;
  justify-content: center; margin-bottom: 16px;
  max-width: 100%; overflow: hidden;
}
.svc-tag {
  background: var(--sage-tag); color: var(--green-mid) !important;
  border-radius: var(--radius-tag); padding: 4px 10px;
  font-size: 11px; font-weight: 600;
  border: 1px solid rgba(122,158,126,.2);
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.svc-more {
  color: var(--green-mid) !important; font-weight: 700 !important;
  font-size: 13.5px !important; display: inline-flex;
  align-items: center; gap: 6px; padding: 8px 0;
  text-decoration: none; transition: color .18s, gap .18s;
}
.svc-more:hover { color: var(--gold) !important; gap: 10px; }
.svc-more svg { width: 15px; height: 15px; transition: transform .18s; }
.svc-more:hover svg { transform: translateX(3px); }

/* ── Tlačítka ─────────────────────────────────────────────── */
html body .btn-primary {
  background: var(--gold-btn) !important;
  color: var(--green-dark) !important;
  border: none !important;
  box-shadow: 0 8px 22px rgba(196,154,56,.28) !important;
}
html body .btn-ghost {
  border-color: rgba(255,255,255,.4) !important;
  color: #fff !important;
  background: rgba(255,255,255,.11) !important;
}
html body .btn-soft {
  background: var(--sage-circle) !important;
  color: var(--green-dark) !important;
}

/* ── Timeline / proces ────────────────────────────────────── */
html body .timeline span {
  display: grid !important;
  background: var(--gold-btn) !important;
  color: var(--green-dark) !important;
}

/* ── Články ───────────────────────────────────────────────── */
html body .article-list span { color: var(--gold) !important; }

/* ══════════════════════════════════════════════════════════════
   KONTAKT SEKCE
   ══════════════════════════════════════════════════════════════ */
html body .contact-section,
html body #formular,
html body section#formular {
  background: linear-gradient(135deg, #f5f0e4, #f9f6f0) !important;
  background-image: linear-gradient(135deg, #f5f0e4, #f9f6f0) !important;
  color: var(--ink) !important;
}
html body .contact-section::before,
html body .contact-section::after,
html body #formular::before,
html body #formular::after,
html body .contact-copy::before,
html body .contact-copy::after { display: none !important; content: none !important; }

html body .contact-copy {
  background: var(--card-bg) !important;
  background-image: none !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
  border-radius: 32px !important;
  box-shadow: var(--shadow) !important;
  backdrop-filter: none !important;
  padding: 40px !important;
}
html body .contact-copy * { opacity: 1 !important; }
html body .contact-copy h2 { color: var(--green-dark) !important; }
html body .contact-copy p { color: var(--muted) !important; }
html body .contact-copy li { color: var(--muted) !important; }
html body .contact-copy strong { color: var(--ink) !important; }
html body .contact-copy .eyebrow { color: var(--gold) !important; }
html body .contact-direct a {
  color: var(--green-mid) !important;
  background: none !important;
  display: block !important;
  font-weight: 900 !important;
  font-size: 17px !important;
  margin-top: 8px !important;
}

html body .inquiry-form { border-radius: 24px !important; }
html body .inquiry-form label,
html body .inquiry-form span,
html body .inquiry-form strong,
html body .inquiry-form p { color: var(--ink) !important; }
html body .inquiry-form input,
html body .inquiry-form textarea,
html body .inquiry-form select {
  background: var(--cream) !important;
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  color: var(--ink) !important;
}

/* ══════════════════════════════════════════════════════════════
   LOKACE – zelená karta, kompaktní pilulky
   ══════════════════════════════════════════════════════════════ */
html body .location-card {
  background: var(--green-mid) !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
  border-radius: 34px !important;
  padding: 46px !important;
}
html body .location-card h2 { color: #fff !important; }
html body .location-card p { color: #dce9dd !important; }
html body .location-card * { color: #fff !important; }

/* Pilulky lokací – kompaktní, NE obrovské ovály */
html body .locations,
html body .locations--large {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  grid-template-columns: none !important;
}
html body .locations span,
html body .locations--large span {
  background: rgba(255,255,255,.92) !important;
  background-image: none !important;
  color: var(--green-dark) !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 10px 18px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  min-height: auto !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.08) !important;
}
html body .locations span * { color: var(--green-dark) !important; }

/* ══════════════════════════════════════════════════════════════
   FOOTER – tmavě zelený
   ══════════════════════════════════════════════════════════════ */
html body .site-footer,
html body footer,
html body .footer-bar {
  background: var(--green-dark) !important;
  background-image: none !important;
  color: #fff !important;
}
html body .site-footer *,
html body footer * { color: #dce9dd !important; }
html body .site-footer h3,
html body footer h3 { color: #fff !important; }

/* ── Cookie + float ───────────────────────────────────────── */
html body .cookiebar {
  background: #fff !important;
  border: 1px solid var(--border) !important;
}
html body .cookiebar button {
  background: var(--green-dark) !important;
  color: #fff !important;
}
html body .float-call { background: var(--sage) !important; }

/* ── FAQ ──────────────────────────────────────────────────── */
html body .faq-list details { border-radius: 18px; }
html body .faq-list details p { color: var(--muted) !important; }

/* ── Reference ────────────────────────────────────────────── */
html body .ref-image { background-color: var(--sage-circle); }

/* ── Antispam ─────────────────────────────────────────────── */
.hp-field { position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important; }

/* ══════════════════════════════════════════════════════════════
   RESPONZIVITA
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  html body .location-card,
  html body .contact-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  html body::before,
  html body::after { width: 80px !important; opacity: .25 !important; }
}