/* ==========================================================================
   ASSICOMUNALE — Reskin Comunale v5.0.0
   Purple Prima Assicurazioni Theme

   Loaded AFTER design-system.css — overrides all ac-* custom properties.
   Pure visual reskin: ZERO content changes.

   TABLE OF CONTENTS
   1. Custom Properties Override (Design Tokens)
   2. CSS Reset & Base
   3. Typography System
   ========================================================================== */


/* ==========================================================================
   1. CUSTOM PROPERTIES OVERRIDE
   Replaces teal palette with Purple Prima Assicurazioni identity.
   All downstream components using --ac-* vars inherit automatically.
   ========================================================================== */

:root {
  /* ---- Brand Colors — Prima Assicurazioni Purple ---- */
  --c-primary:            #6B21A8;
  --c-primary-hover:      #5B1898;
  --c-primary-light:      #7C3AED;
  --c-primary-dark:       #4C1D95;
  --c-primary-ultra-light: #F5F0FF;
  --c-accent:             #EC4899;
  --c-accent-hover:       #DB2777;

  /* ---- Neutrals ---- */
  --c-bg:            #FFFFFF;
  --c-bg-subtle:     #F8F5FF;
  --c-bg-dark:       #1E1B4B;
  --c-text:          #1E1B4B;
  --c-text-muted:    #6B7280;
  --c-text-light:    #9CA3AF;
  --c-border:        #E9D5FF;
  --c-border-subtle: #F3E8FF;

  /* ---- Spacing ---- */
  --space-xs:  8px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  48px;
  --space-xl:  80px;
  --space-2xl: 120px;

  /* ---- Typography ---- */
  --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --text-base:    17px;
  --line-height-body: 1.7;

  /* ---- Borders & Shadows (purple-tinted) ---- */
  --radius-sm:   8px;
  --radius-md:   16px;
  --radius-lg:   24px;
  --radius-pill:  50px;
  --shadow-sm:   0 4px 12px rgba(107, 33, 168, 0.08);
  --shadow-md:   0 12px 40px rgba(107, 33, 168, 0.12);
  --shadow-lg:   0 24px 80px rgba(107, 33, 168, 0.18);
  --shadow-card-hover: 0 20px 60px rgba(107, 33, 168, 0.20);

  /* ---- Transition ---- */
  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);

  /* ============================================================
     Override existing --ac-* tokens from design-system.css
     All components using these vars change automatically.
     ============================================================ */

  /* Primary palette → Purple */
  --ac-primary-50:  #F5F0FF;
  --ac-primary-100: #EDE5FF;
  --ac-primary-200: #DDD6FE;
  --ac-primary-300: #C4B5FD;
  --ac-primary-400: #A78BFA;
  --ac-primary-500: #6B21A8;
  --ac-primary-600: #5B1898;
  --ac-primary-700: #4C1D95;
  --ac-primary-800: #3B0764;
  --ac-primary-900: #2E1065;

  --ac-primary:       #6B21A8;
  --ac-primary-dark:  #4C1D95;
  --ac-primary-light: #F5F0FF;
  --ac-primary-rgb:   107, 33, 168;

  /* Accent palette → Pink */
  --ac-accent-50:  #FDF2F8;
  --ac-accent-100: #FCE7F3;
  --ac-accent-200: #FBCFE8;
  --ac-accent-300: #F9A8D4;
  --ac-accent-400: #F472B6;
  --ac-accent-500: #EC4899;
  --ac-accent-600: #DB2777;
  --ac-accent-700: #BE185D;
  --ac-accent-800: #9D174D;
  --ac-accent-900: #831843;

  --ac-accent:       #EC4899;
  --ac-accent-hover: #DB2777;

  /* Gradients → Purple-based */
  --ac-gradient:         linear-gradient(135deg, #6B21A8 0%, #EC4899 100%);
  --ac-gradient-reverse: linear-gradient(135deg, #EC4899 0%, #6B21A8 100%);
  --ac-gradient-primary: linear-gradient(135deg, #6B21A8 0%, #4C1D95 100%);
  --ac-gradient-hero:    linear-gradient(135deg, rgba(107,33,168,0.88) 0%, rgba(30,27,75,0.92) 100%);
  --ac-gradient-dark:    linear-gradient(180deg, #1E1B4B 0%, #0F0A2A 100%);
  --ac-gradient-subtle:  linear-gradient(180deg, #F8F5FF 0%, #FFFFFF 100%);

  /* Neutrals → Warmer purple-tinted */
  --ac-neutral-50:  #FAFAFF;
  --ac-neutral-100: #F3F0FA;
  --ac-neutral-200: #E9E5F5;
  --ac-neutral-300: #D8D3E8;
  --ac-neutral-400: #A8A3BE;
  --ac-neutral-500: #6B7280;
  --ac-neutral-600: #4B5563;
  --ac-neutral-700: #374151;
  --ac-neutral-800: #1F2937;
  --ac-neutral-900: #111827;

  /* Semantic neutral aliases */
  --ac-dark:   #1E1B4B;
  --ac-body:   #4B5563;
  --ac-muted:  #6B7280;
  --ac-border: #E9D5FF;
  --ac-bg:     #FFFFFF;
  --ac-bg-alt: #F8F5FF;

  /* Semantic colors */
  --ac-success-500: #059669;
  --ac-success-50:  #ECFDF5;
  --ac-star:        #F59E0B;

  /* Fluid headings — slightly larger for enterprise presence */
  --ac-h1: clamp(2.2rem, 4vw + 0.5rem, 3.5rem);
  --ac-h2: clamp(1.8rem, 3vw + 0.5rem, 2.8rem);
  --ac-h3: clamp(1.2rem, 2vw + 0.3rem, 1.5rem);

  /* Font weights — heavier for headings */
  --ac-weight-bold: 700;

  /* Border radius — rounder for premium feel */
  --ac-radius-sm:   6px;
  --ac-radius-md:   12px;
  --ac-radius-lg:   16px;
  --ac-radius-xl:   20px;
  --ac-radius-2xl:  28px;
  --ac-radius:      var(--ac-radius-lg);

  /* Shadows — purple-tinted */
  --ac-shadow-xs:  0 1px 3px rgba(107, 33, 168, 0.04);
  --ac-shadow-sm:  0 2px 8px rgba(107, 33, 168, 0.06);
  --ac-shadow-md:  0 8px 24px rgba(107, 33, 168, 0.10);
  --ac-shadow-lg:  0 16px 48px rgba(107, 33, 168, 0.14);
  --ac-shadow-xl:  0 24px 64px rgba(107, 33, 168, 0.18);
  --ac-shadow-2xl: 0 32px 80px rgba(107, 33, 168, 0.22);
  --ac-shadow:     var(--ac-shadow-md);

  /* Section padding — more generous for enterprise white space */
  --ac-section-py: clamp(4rem, 10vw, 7rem);
}


/* ==========================================================================
   2. CSS RESET & BASE
   Scoped to .ac-home to avoid affecting other pages that use Elementor.
   ========================================================================== */

body.ac-home {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--c-text);
  background: var(--c-bg);
  line-height: var(--line-height-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body.ac-home *,
body.ac-home *::before,
body.ac-home *::after {
  box-sizing: border-box;
}

/* Override GP's inside-article padding — our sections handle their own spacing */
body.ac-home .inside-article {
  padding: 0;
  background: transparent;
}

/* Override GP's entry-content max-width — we use full-width sections */
body.ac-home .entry-content {
  max-width: none;
  padding: 0;
  margin: 0;
}

/* Override GP separate-containers box if present */
body.ac-home.separate-containers .inside-article {
  border-radius: 0;
  box-shadow: none;
}

/* Smooth scroll for anchor links */
@media (prefers-reduced-motion: no-preference) {
  body.ac-home {
    scroll-behavior: smooth;
  }
}

/* Selection color */
body.ac-home ::selection {
  background: var(--c-primary-ultra-light);
  color: var(--c-primary);
}

/* Remove default link underline within content sections */
body.ac-home .entry-content a:not(.ac-btn):not([class*="ac-nav"]):not([class*="ac-footer"]) {
  color: var(--c-primary);
  text-decoration: none;
  transition: color var(--transition);
}

body.ac-home .entry-content a:not(.ac-btn):not([class*="ac-nav"]):not([class*="ac-footer"]):hover {
  color: var(--c-primary-hover);
  text-decoration: underline;
}

/* Focus visible — accessible purple ring */
body.ac-home :focus-visible {
  outline: 2px solid var(--c-primary-light);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}


/* ==========================================================================
   3. TYPOGRAPHY SYSTEM
   Scoped to .entry-content to target only the homepage content area.
   Uses the existing ac-* heading classes from HTML — no generic h1-h6
   selectors that would conflict with GP or Elementor.
   ========================================================================== */

/* --- Heading defaults within our content --- */
body.ac-home .entry-content h1 {
  font-family: var(--font-heading);
  font-size: var(--ac-h1);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--c-text);
  margin: 0 0 1.25rem;
}

body.ac-home .entry-content h2 {
  font-family: var(--font-heading);
  font-size: var(--ac-h2);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--c-text);
  margin: 0 0 1rem;
}

body.ac-home .entry-content h3 {
  font-family: var(--font-heading);
  font-size: var(--ac-h3);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--c-text);
  margin: 0 0 0.75rem;
}

/* Dark-bg heading overrides (hero, reviews, form) */
body.ac-home .entry-content .ac-hero h1 { color: #fff; }
body.ac-home .entry-content .ac-form-section h2 { color: #fff; }
body.ac-home .entry-content .ac-reviews h2,
body.ac-home .entry-content .ac-reviews h3 { color: #fff; }

/* --- Body text --- */
body.ac-home .entry-content p {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--c-text-muted);
  line-height: var(--line-height-body);
  margin: 0 0 1rem;
}

/* !! Dark-bg sections: text stays white, NOT overridden by entry-content rules */
body.ac-home .ac-hero .entry-content h1,
body.ac-home .entry-content .ac-hero h1,
body.ac-home .ac-hero h1 {
  color: #fff;
  font-weight: 800;
}

body.ac-home .ac-hero .entry-content p,
body.ac-home .entry-content .ac-hero p,
body.ac-home .ac-hero p {
  color: rgba(255, 255, 255, 0.78);
}

body.ac-home .ac-hero p:first-of-type {
  color: rgba(255, 255, 255, 0.85);
}

body.ac-home .ac-hero p strong,
body.ac-home .entry-content .ac-hero p strong {
  color: #fff;
}

body.ac-home .entry-content .ac-form-section h2,
body.ac-home .ac-form-section h2 {
  color: #fff;
}

body.ac-home .entry-content .ac-form-section p,
body.ac-home .ac-form-section p {
  color: rgba(255, 255, 255, 0.90);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

body.ac-home .entry-content .ac-form-section p strong,
body.ac-home .ac-form-section p strong {
  color: #fff;
}

body.ac-home .entry-content .ac-reviews h2,
body.ac-home .entry-content .ac-reviews h3,
body.ac-home .ac-reviews h2,
body.ac-home .ac-reviews h3 {
  color: #fff;
}

body.ac-home .entry-content .ac-reviews p,
body.ac-home .ac-reviews p {
  color: rgba(255, 255, 255, 0.85);
}

/* Strong text inherits dark color for emphasis */
body.ac-home .entry-content p strong,
body.ac-home .entry-content li strong {
  color: var(--c-text);
  font-weight: 600;
}

/* --- Lists within content sections --- */
body.ac-home .entry-content ul,
body.ac-home .entry-content ol {
  padding-left: 0;
  margin: 0 0 1.5rem;
  list-style: none;
}

body.ac-home .entry-content li {
  font-size: var(--text-base);
  color: var(--c-text-muted);
  line-height: 1.6;
  margin-bottom: 0.5rem;
}

/* --- Section header pattern --- */
body.ac-home .ac-section-header {
  text-align: center;
  max-width: 820px;
  margin: 0 auto var(--space-lg);
}

body.ac-home .ac-section-header h2 {
  position: relative;
  padding-bottom: var(--space-md);
}

/* Decorative purple underline after section h2 */
body.ac-home .ac-section-header h2::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background: var(--ac-gradient);
  border-radius: 2px;
}

/* --- Blockquotes --- */
body.ac-home .entry-content blockquote {
  margin: 2rem 0;
  padding: 1.5rem 2rem 1.5rem 2.5rem;
  border-left: 4px solid var(--c-primary);
  background: var(--c-primary-ultra-light);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-style: normal;
}

body.ac-home .entry-content blockquote p {
  color: var(--c-text);
  font-size: var(--text-base);
  margin-bottom: 0;
}


/* ==========================================================================
   4. NAVBAR RESKIN
   Overrides header.css styles.
   Target: .ac-top-bar, .ac-header, .ac-nav, .ac-mega
   ========================================================================== */

/* ---- Top Bar: Purple-dark instead of neutral dark ---- */
.ac-top-bar {
  background: var(--c-bg-dark);
  border-bottom-color: rgba(107, 33, 168, 0.2);
}

.ac-top-bar__social a:hover {
  background: var(--c-primary);
}

/* ---- Main Header: Glassmorphism ---- */
.ac-header {
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.ac-header__inner {
  height: 72px;
}

.ac-header__logo img {
  max-height: 48px;
  height: 44px;
  object-fit: contain;
}

/* Scrolled state — purple-tinted shadow */
.ac-header--scrolled {
  box-shadow: 0 2px 20px rgba(107, 33, 168, 0.08);
}

.ac-header--scrolled .ac-header__inner {
  height: 60px;
}

.ac-header--scrolled .ac-header__logo img {
  height: 36px;
}

/* ---- Nav Links ---- */
.ac-nav__link {
  color: var(--c-text);
  font-weight: 500;
  font-size: 15px;
  padding: 8px 16px;
  border-radius: var(--radius-sm);
  transition: color var(--transition), background var(--transition);
}

.ac-nav__link:hover,
.ac-nav__link--active {
  color: var(--c-primary);
}

/* Underline indicator → purple */
.ac-nav__link::after {
  background: var(--c-primary);
}

/* ---- Mega Menu: Premium purple-tinted ---- */
.ac-mega {
  background: #fff;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  box-shadow: var(--shadow-md);
  border: 1px solid var(--c-border-subtle);
  border-top: 3px solid;
  border-image: linear-gradient(90deg, var(--c-primary), var(--c-accent)) 1;
}

.ac-mega__col + .ac-mega__col {
  border-left-color: var(--c-border-subtle);
  background: linear-gradient(135deg, rgba(107,33,168,0.02) 0%, rgba(236,72,153,0.02) 100%);
}

.ac-mega__title {
  color: var(--c-primary);
}

.ac-mega__title::after {
  background: linear-gradient(90deg, var(--c-primary), var(--c-primary-light), transparent);
}

.ac-mega__link:hover {
  background: var(--c-primary-ultra-light);
  color: var(--c-primary);
}

/* Promo card in mega menu */
.ac-mega__promo {
  background: linear-gradient(135deg, var(--c-primary), var(--c-primary-dark));
}

/* ---- Dropdown (non-mega) ---- */
.ac-dropdown {
  background: #fff;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  border: 1px solid var(--c-border-subtle);
  padding: 8px;
  min-width: 220px;
}

.ac-dropdown__link:hover {
  background: var(--c-primary-ultra-light);
  color: var(--c-primary);
}

/* ---- CTA Button in header ---- */
.ac-header__cta .ac-btn,
.ac-header__cta a {
  background: var(--c-accent) !important;
  color: #fff !important;
  border-radius: var(--radius-pill) !important;
  padding: 10px 24px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(236, 72, 153, 0.35);
  transition: all var(--transition);
  text-decoration: none !important;
}

.ac-header__cta .ac-btn:hover,
.ac-header__cta a:hover {
  background: var(--c-accent-hover) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(236, 72, 153, 0.45);
}

/* ---- Phone link in header ---- */
.ac-header__phone {
  color: var(--c-text);
  font-weight: 500;
}

.ac-header__phone:hover {
  color: var(--c-primary);
}

/* ---- Partner badge ---- */
.ac-partner-badge {
  background: var(--c-primary-ultra-light);
  border-color: var(--c-border);
  color: var(--c-primary);
}

/* ---- Mobile Nav ---- */
.ac-mobile-nav {
  background: #fff;
}

.ac-mobile-nav__link {
  color: var(--c-text);
}

.ac-mobile-nav__link:hover,
.ac-mobile-nav__link:focus {
  color: var(--c-primary);
  background: var(--c-primary-ultra-light);
}

.ac-mobile-nav__cta .ac-btn {
  background: var(--c-accent);
  border-radius: var(--radius-pill);
}

.ac-mobile-nav__cta .ac-btn:hover {
  background: var(--c-accent-hover);
}

/* Hamburger lines → dark */
.ac-hamburger__line {
  background: var(--c-text);
}


/* ==========================================================================
   5. HERO SECTION RESKIN
   Overrides homepage.css .ac-hero styles.
   Goal: purple gradient overlay, white-bg text area with decorative blob.
   ========================================================================== */

/* Purple gradient overlay instead of teal */
.ac-hero::before {
  background: var(--ac-gradient-hero);
}

/* Bottom fade → purple dark */
.ac-hero::after {
  background: linear-gradient(to top, var(--c-primary-dark), transparent);
}

/* Hero content area */
.ac-hero__content {
  max-width: 760px;
  padding: 5rem 2rem 6rem;
}

/* Decorative blob — top-right of hero */
.ac-hero__content::before {
  content: '';
  position: absolute;
  top: -120px;
  right: -200px;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(107, 33, 168, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

/* H1 in hero */
.ac-hero h1 {
  color: #fff;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-shadow: 0 2px 20px rgba(30, 27, 75, 0.3);
}

/* Hero paragraphs */
.ac-hero p {
  color: rgba(255, 255, 255, 0.9);
}

.ac-hero p:first-of-type {
  color: rgba(255, 255, 255, 0.95);
  font-size: 1.2rem;
}

.ac-hero p strong {
  color: #fff;
}

/* Hero CTA button — accent pink pill */
.ac-hero .ac-btn--primary {
  background: var(--c-accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  padding: 16px 36px;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.01em;
  box-shadow: 0 8px 32px rgba(236, 72, 153, 0.35);
  transition: all var(--transition);
}

.ac-hero .ac-btn--primary:hover {
  background: var(--c-accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(236, 72, 153, 0.45);
}

/* Arrow in CTA button */
.ac-hero .ac-btn--arrow::after {
  transition: transform var(--transition);
}

.ac-hero .ac-btn--arrow:hover::after {
  transform: translateX(4px);
}


/* ==========================================================================
   6. TRUST BAR RESKIN
   Overrides homepage.css .ac-trust-bar styles.
   Goal: purple gradient strip with white text — authoritative, premium.
   ========================================================================== */

.ac-trust-bar {
  background: linear-gradient(135deg, var(--c-primary) 0%, var(--c-primary-dark) 100%);
  padding: 1.25rem 0;
  border-bottom: none;
  border-top: none;
  box-shadow: 0 4px 20px rgba(107, 33, 168, 0.25);
}

.ac-trust-bar__item {
  color: #fff;
  font-weight: 600;
  font-size: 15px;
}

.ac-trust-bar__icon {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.9);
}

.ac-trust-bar__stars {
  color: var(--ac-star);
}


/* ==========================================================================
   7. "PERCHÉ SCEGLIERCI" SECTION RESKIN
   Target: .ac-section > .ac-grid--2 > .ac-card (4 cards)
   Goal: white cards on #F8F5FF bg, purple icon containers, hover lift.
   ========================================================================== */

/* Container section — subtle purple bg */
body.ac-home .ac-section:not(.ac-product):not(.ac-section--alt):not(.ac-reviews):not(.ac-form-section) {
  background: var(--c-bg-subtle);
}

/* Card styling — white, bordered, rounded */
body.ac-home .ac-grid--2 .ac-card,
body.ac-home .ac-services-grid .ac-card {
  background: #fff;
  border: 1px solid var(--c-border-subtle);
  border-radius: var(--radius-md);
  padding: 32px;
  transition: all var(--transition);
}

body.ac-home .ac-grid--2 .ac-card:hover,
body.ac-home .ac-services-grid .ac-card:hover {
  box-shadow: var(--shadow-card-hover);
  transform: translateY(-6px);
  border-color: var(--c-border);
}

/* Card icon container — purple-tinted circle */
body.ac-home .ac-card__icon {
  width: 64px;
  height: 64px;
  background: rgba(107, 33, 168, 0.08);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  transition: all var(--transition);
}

body.ac-home .ac-card__icon svg {
  color: var(--c-primary);
  stroke: var(--c-primary);
}

body.ac-home .ac-card:hover .ac-card__icon {
  background: var(--c-primary);
}

body.ac-home .ac-card:hover .ac-card__icon svg {
  color: #fff;
  stroke: #fff;
}

/* Card headings */
body.ac-home .ac-card h3 {
  color: var(--c-text);
  font-weight: 700;
  margin-bottom: 0.75rem;
}

/* Payment methods standalone card */
body.ac-home .ac-card.ac-mt-8 {
  background: #fff;
  border: 1px solid var(--c-border-subtle);
  border-radius: var(--radius-md);
  padding: 32px;
}

/* Payment pill badges — purple-tinted */
body.ac-home .ac-card ul li {
  background: var(--c-primary-ultra-light);
  color: var(--c-primary);
  border-radius: var(--radius-sm);
  font-weight: 600;
}


/* ==========================================================================
   8. SERVICES GRID RESKIN
   Target: .ac-section--alt .ac-services-grid
   Goal: 4-col grid on white bg, same card styling as Perché Sceglierci.
   ========================================================================== */

/* Alt section bg — white instead of colored */
body.ac-home .ac-section--alt {
  background: #fff;
}

/* Services section header h2 decorative underline → purple gradient */
body.ac-home .ac-section-header h2::after {
  background: var(--ac-gradient);
}


/* ==========================================================================
   9. PRODUCT SECTIONS RESKIN
   Target: .ac-product (Auto, Moto, Casa, Famiglia)
   Goal: purple H2 with accent border-left, benefit lists with purple checks,
         pill CTA buttons, alternating white/subtle backgrounds.
   ========================================================================== */

/* Product H2 — purple with accent left border */
body.ac-home .ac-product h2 {
  color: var(--c-primary);
  font-weight: 800;
  border-left: 4px solid var(--c-accent);
  padding-left: 20px;
  padding-bottom: 0;
  margin-bottom: 1.5rem;
}

/* Remove the bottom underline ::after from product H2 (using border-left instead) */
body.ac-home .ac-product h2::after {
  display: none;
}

/* Product body text */
body.ac-home .ac-product p {
  color: var(--c-text-muted);
  line-height: 1.7;
}

body.ac-home .ac-product p strong {
  color: var(--c-text);
}

/* Benefit list items — purple check icons */
body.ac-home .ac-product li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236B21A8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E");
}

body.ac-home .ac-product li {
  padding-bottom: 0.875rem;
  border-bottom: 1px solid var(--c-border-subtle);
  margin-bottom: 0.875rem;
}

body.ac-home .ac-product li:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

/* CTA Primary button — purple pill */
body.ac-home .ac-product .ac-btn--primary {
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  padding: 14px 32px;
  font-weight: 600;
  font-size: 15px;
  box-shadow: 0 6px 24px rgba(107, 33, 168, 0.30);
  transition: all var(--transition);
  text-decoration: none;
}

body.ac-home .ac-product .ac-btn--primary:hover {
  background: var(--c-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 10px 36px rgba(107, 33, 168, 0.40);
}

/* CTA Outline button — purple border, pill */
body.ac-home .ac-product .ac-btn--outline {
  background: transparent;
  color: var(--c-primary);
  border: 2px solid var(--c-primary);
  border-radius: var(--radius-pill);
  padding: 12px 28px;
  font-weight: 600;
  font-size: 15px;
  transition: all var(--transition);
  text-decoration: none;
}

body.ac-home .ac-product .ac-btn--outline:hover {
  background: var(--c-primary);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(107, 33, 168, 0.30);
}

/* Alternating product section backgrounds */
body.ac-home .ac-product:nth-child(odd) {
  background: #fff;
}

body.ac-home .ac-product:nth-child(even) {
  background: var(--c-bg-subtle);
}

/* Blockquote in product sections — purple accent */
body.ac-home .ac-section blockquote {
  border-left-color: var(--c-primary);
  background: var(--c-primary-ultra-light);
}


/* ==========================================================================
   10. STATS SECTION RESKIN
   Target: .ac-stats-grid > .ac-stat
   Goal: white cards, purple borders on hover, large purple numbers.
   ========================================================================== */

/* Stats section — white bg, generous padding */
body.ac-home .ac-section:has(.ac-stats-grid) {
  background: #fff;
  padding: var(--space-2xl) 0;
}

/* Stat card */
body.ac-home .ac-stat {
  background: #fff;
  border: 2px solid var(--c-border);
  border-radius: var(--radius-lg);
  padding: 40px 32px;
  text-align: center;
  box-shadow: none;
  transition: all var(--transition);
}

body.ac-home .ac-stat:hover {
  border-color: var(--c-primary);
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
}

/* Stat top gradient bar — purple on hover */
body.ac-home .ac-stat::before {
  background: var(--ac-gradient);
}

/* Stat number — large purple */
body.ac-home .ac-stat__number {
  font-size: clamp(2.5rem, 4vw, 3.5rem);
  font-weight: 900;
  color: var(--c-primary);
  letter-spacing: -0.03em;
  line-height: 1;
  display: block;
  margin-bottom: 8px;
}

/* Stat label — uppercase muted */
body.ac-home .ac-stat__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* Stats descriptive text — centered */
body.ac-home .ac-section:has(.ac-stats-grid) > .ac-container > p {
  color: var(--c-text-muted);
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

/* Stats callout blockquote */
body.ac-home .ac-section:has(.ac-stats-grid) blockquote {
  background: var(--c-bg-subtle);
  border-left: 4px solid var(--c-primary);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  padding: 24px 28px;
  font-style: italic;
}

body.ac-home .ac-section:has(.ac-stats-grid) blockquote p {
  color: var(--c-text);
  margin-bottom: 0;
}

/* Stats check list — purple icons */
body.ac-home .ac-section:has(.ac-stats-grid) li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236B21A8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E");
}


/* ==========================================================================
   11. "3 SEMPLICI PASSI" SECTION RESKIN
   Target: .ac-steps-grid > .ac-step
   Goal: white cards on #F8F5FF bg, purple number badge, accent CTA.
   ========================================================================== */

/* Steps section — subtle bg */
body.ac-home .ac-section:has(.ac-steps-grid) {
  background: var(--c-bg-subtle);
  padding: var(--space-2xl) 0;
}

/* Step card */
body.ac-home .ac-step {
  background: #fff;
  border-radius: var(--radius-md);
  padding: 40px 32px;
  text-align: center;
  box-shadow: var(--shadow-sm);
}

/* Step number badge — purple filled circle (overrides counter) */
body.ac-home .ac-step::before {
  width: 56px;
  height: 56px;
  background: var(--c-primary);
  color: #fff;
  border-radius: 50%;
  font-size: 1.5rem;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  position: static;
  margin: 0 auto var(--space-md);
  box-shadow: 0 8px 24px rgba(107, 33, 168, 0.35);
}

/* Step icon container — override base teal styles */
body.ac-home .ac-step__icon {
  background: rgba(107, 33, 168, 0.08);
  color: var(--c-primary);
  box-shadow: 0 4px 16px rgba(107, 33, 168, 0.12);
}

body.ac-home .ac-step__icon svg {
  color: var(--c-primary);
  stroke: var(--c-primary);
}

body.ac-home .ac-step:hover .ac-step__icon {
  background: var(--c-primary);
  color: #fff;
  box-shadow: 0 8px 24px rgba(107, 33, 168, 0.25);
}

body.ac-home .ac-step:hover .ac-step__icon svg {
  color: #fff;
  stroke: #fff;
}

/* Step title */
body.ac-home .ac-step h3 {
  font-weight: 700;
  color: var(--c-text);
  margin-bottom: 12px;
}

/* Step description */
body.ac-home .ac-step p {
  color: var(--c-text-muted);
  font-size: 15px;
}

/* Connector between steps — dashed purple border */
body.ac-home .ac-step:not(:last-child)::after {
  background: none;
  border-top: 2px dashed var(--c-border);
  height: 0;
}

/* Steps CTA button — accent pink pill */
body.ac-home .ac-section:has(.ac-steps-grid) > .ac-container > .ac-text-center .ac-btn--primary {
  background: var(--c-accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  padding: 18px 48px;
  font-size: 18px;
  font-weight: 600;
  box-shadow: 0 8px 32px rgba(236, 72, 153, 0.35);
  transition: all var(--transition);
}

body.ac-home .ac-section:has(.ac-steps-grid) > .ac-container > .ac-text-center .ac-btn--primary:hover {
  background: var(--c-accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(236, 72, 153, 0.45);
}

/* Hide connector on mobile */
@media (max-width: 1024px) {
  body.ac-home .ac-step:not(:last-child)::after {
    display: none;
  }
}


/* ==========================================================================
   12. LOCATIONS SECTION RESKIN ("TROVA LA TUA SEDE")
   Target: .ac-locations-grid > .ac-location-card
   Goal: white section, bordered cards, purple accents, pill outline CTAs.
   ========================================================================== */

/* Location cards — bordered, no border-left accent (clean look) */
body.ac-home .ac-location-card {
  border: 2px solid var(--c-border-subtle);
  border-left: 2px solid var(--c-border-subtle);
  border-radius: var(--radius-md);
  padding: 32px;
  background: #fff;
  transition: all var(--transition);
}

body.ac-home .ac-location-card:hover {
  border-color: var(--c-primary);
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
}

/* Location title */
body.ac-home .ac-location-card h3 {
  color: var(--c-primary);
  font-weight: 700;
  font-size: 1.1rem;
}

/* Location description */
body.ac-home .ac-location-card p {
  color: var(--c-text-muted);
  font-size: 15px;
}

/* Location CTA — outline pill */
body.ac-home .ac-location-card .ac-btn--outline {
  background: transparent;
  border: 2px solid var(--c-primary);
  color: var(--c-primary);
  border-radius: var(--radius-pill);
  padding: 10px 20px;
  font-weight: 600;
  font-size: 14px;
  transition: all var(--transition);
  text-decoration: none;
  display: inline-block;
  margin-top: 0.75rem;
}

body.ac-home .ac-location-card .ac-btn--outline:hover {
  background: var(--c-primary);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(107, 33, 168, 0.25);
}

/* Disabled location button (Lecce — no link yet) */
body.ac-home .ac-location-card .ac-btn--outline[style*="opacity"] {
  border-color: var(--c-border);
  color: var(--c-text-light);
}


/* ==========================================================================
   13. MAP & SEDI TABLE RESKIN
   Target: .ac-map, .ac-sedi-table
   Goal: purple-tinted table, rounded map, purple links.
   ========================================================================== */

/* Map container — purple shadow */
body.ac-home .ac-map {
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}

/* Sedi table — purple header */
body.ac-home .ac-sedi-table th {
  background: var(--c-primary);
}

/* Table row hover — subtle purple */
body.ac-home .ac-sedi-table tr:hover td {
  background: var(--c-primary-ultra-light);
}

/* Table border */
body.ac-home .ac-sedi-table-wrap {
  border-color: var(--c-border);
  border-radius: var(--radius-md);
}

body.ac-home .ac-sedi-table td {
  border-bottom-color: var(--c-border-subtle);
}

/* Table links — purple */
body.ac-home .ac-sedi-table a {
  color: var(--c-primary);
}

body.ac-home .ac-sedi-table a:hover {
  color: var(--c-accent);
}


/* ==========================================================================
   13b. GOOGLE REVIEWS WIDGET FIX
   Target: .gmbrr widget inside .ac-reviews
   Goal: fix encoding bug in business name, force Inter font, purple theme.
   ========================================================================== */

/* Force safe font stack on entire GMB widget */
body.ac-home .ac-reviews .gmbrr,
body.ac-home .ac-reviews .gmbrr * {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Hide broken business name title — shows ???? encoding */
body.ac-home .ac-reviews .gmbrr .heading {
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden;
  height: 0;
  padding: 0 !important;
  margin: 0 !important;
}

/* Keep review text readable */
body.ac-home .ac-reviews .gmbrr .listing .text {
  font-size: 0.95rem !important;
  color: rgba(255, 255, 255, 0.85) !important;
  line-height: 1.6 !important;
}

body.ac-home .ac-reviews .gmbrr .listing .author a {
  color: rgba(255, 255, 255, 0.95) !important;
  font-weight: 600 !important;
}

body.ac-home .ac-reviews .gmbrr .rating .number {
  color: #fff !important;
  font-weight: 700 !important;
}

body.ac-home .ac-reviews .gmbrr .rating .count {
  color: var(--ac-star) !important;
}

/* Review card backgrounds — translucent on dark */
body.ac-home .ac-reviews .gmbrr .listing {
  background: rgba(255, 255, 255, 0.06) !important;
  border-radius: var(--radius-md) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}


/* ==========================================================================
   14. ANIMATIONS & MICRO-INTERACTIONS
   Scroll reveal, ripple effect, WhatsApp pulse, counter prep.
   ========================================================================== */

/* --- Scroll Reveal --- */
.ac-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.ac-reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered children */
.ac-reveal--visible > :nth-child(1) { transition-delay: 0s; }
.ac-reveal--visible > :nth-child(2) { transition-delay: 0.1s; }
.ac-reveal--visible > :nth-child(3) { transition-delay: 0.1s; }
.ac-reveal--visible > :nth-child(4) { transition-delay: 0.15s; }

/* Stagger for grid children */
.ac-reveal--visible .ac-card,
.ac-reveal--visible .ac-stat,
.ac-reveal--visible .ac-step,
.ac-reveal--visible .ac-location-card,
.ac-reveal--visible .ac-review-card {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.ac-reveal--visible .ac-card:nth-child(1),
.ac-reveal--visible .ac-stat:nth-child(1),
.ac-reveal--visible .ac-step:nth-child(1),
.ac-reveal--visible .ac-location-card:nth-child(1),
.ac-reveal--visible .ac-review-card:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: 0.1s; }

.ac-reveal--visible .ac-card:nth-child(2),
.ac-reveal--visible .ac-stat:nth-child(2),
.ac-reveal--visible .ac-step:nth-child(2),
.ac-reveal--visible .ac-location-card:nth-child(2),
.ac-reveal--visible .ac-review-card:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: 0.2s; }

.ac-reveal--visible .ac-card:nth-child(3),
.ac-reveal--visible .ac-stat:nth-child(3),
.ac-reveal--visible .ac-step:nth-child(3),
.ac-reveal--visible .ac-location-card:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: 0.3s; }

.ac-reveal--visible .ac-card:nth-child(4),
.ac-reveal--visible .ac-stat:nth-child(4),
.ac-reveal--visible .ac-location-card:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: 0.4s; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .ac-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .ac-reveal--visible .ac-card,
  .ac-reveal--visible .ac-stat,
  .ac-reveal--visible .ac-step,
  .ac-reveal--visible .ac-location-card,
  .ac-reveal--visible .ac-review-card {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* --- CTA Ripple Effect --- */
body.ac-home .ac-btn {
  position: relative;
  overflow: hidden;
}

body.ac-home .ac-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: width 0.5s ease, height 0.5s ease, opacity 0.5s ease;
  opacity: 0;
  pointer-events: none;
}

body.ac-home .ac-btn:active::after {
  width: 300px;
  height: 300px;
  opacity: 1;
  transition: width 0s, height 0s, opacity 0s;
}

/* Don't override arrow ::after */
body.ac-home .ac-btn--arrow::after {
  background: none;
  width: auto;
  height: auto;
  border-radius: 0;
  opacity: 1;
}

/* --- WhatsApp Floating Button --- */
.joinchat__button,
.wa__btn,
[class*="whatsapp"] .wa__btn_popup,
.whatsapp-chat-popup .wa__btn_popup {
  border-radius: 50% !important;
  width: 56px !important;
  height: 56px !important;
  background: #25D366 !important;
  box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4) !important;
  animation: ac-wa-pulse 2s infinite !important;
  transition: transform 0.3s ease !important;
}

.joinchat__button:hover,
.wa__btn:hover,
[class*="whatsapp"] .wa__btn_popup:hover {
  transform: scale(1.1) !important;
}

@keyframes ac-wa-pulse {
  0%, 100% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4), 0 0 0 0 rgba(37, 211, 102, 0.4); }
  50% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4), 0 0 0 12px rgba(37, 211, 102, 0); }
}


/* ==========================================================================
   15. RESPONSIVE OVERRIDES
   All breakpoints for purple reskin — overrides homepage.css responsive.
   ========================================================================== */

/* ---------- Tablet ≤ 1024px ---------- */
@media (max-width: 1024px) {
  /* Reduce section padding */
  body.ac-home .ac-section,
  body.ac-home .ac-product,
  body.ac-home .ac-reviews,
  body.ac-home .ac-form-section {
    padding: var(--space-xl) 0;
  }

  /* Stats grid → 3 cols still OK on tablet */
  body.ac-home .ac-stats-grid {
    gap: 1.5rem;
  }

  /* Trust bar — wrap items */
  body.ac-home .ac-trust-bar__inner {
    flex-wrap: wrap;
    gap: 1.25rem;
  }

  /* Step connector hidden */
  body.ac-home .ac-step:not(:last-child)::after {
    display: none;
  }
}

/* ---------- Mobile ≤ 768px ---------- */
@media (max-width: 768px) {
  /* Hero heading smaller */
  body.ac-home .ac-hero h1 {
    font-size: clamp(1.8rem, 6vw, 2.5rem);
  }

  /* Hero content padding */
  body.ac-home .ac-hero__content {
    padding: 3.5rem 1.25rem 5rem;
  }

  /* Hero decorative blob — smaller */
  body.ac-home .ac-hero__content::before {
    width: 250px;
    height: 250px;
    top: -60px;
    right: -100px;
  }

  /* Stats → 1 column */
  body.ac-home .ac-stats-grid {
    grid-template-columns: 1fr;
  }

  /* Steps → 1 column */
  body.ac-home .ac-steps-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  /* Locations → 1 column */
  body.ac-home .ac-locations-grid {
    grid-template-columns: 1fr;
  }

  /* Services → 1 column */
  body.ac-home .ac-services-grid {
    grid-template-columns: 1fr;
  }

  /* Grid 2-col → 1 column */
  body.ac-home .ac-grid--2 {
    grid-template-columns: 1fr;
  }

  /* Product H2 — center on mobile */
  body.ac-home .ac-product h2 {
    border-left: none;
    padding-left: 0;
    text-align: center;
    border-bottom: 4px solid var(--c-accent);
    padding-bottom: 1rem;
  }

  /* CTA buttons — full width on mobile */
  body.ac-home .ac-product .ac-btn--primary,
  body.ac-home .ac-product .ac-btn--outline {
    width: 100%;
    text-align: center;
    justify-content: center;
  }

  body.ac-home .ac-flex {
    flex-direction: column;
    align-items: stretch;
  }

  /* Trust bar — smaller text */
  body.ac-home .ac-trust-bar__item {
    font-size: 13px;
  }

  /* Map smaller */
  body.ac-home .ac-map iframe {
    height: 300px;
  }

  /* Sedi table → scroll hint */
  body.ac-home .ac-sedi-table-wrap {
    border-radius: var(--radius-sm);
  }

  /* Form — card less padding */
  body.ac-home .ac-form-section .ac-preventivo-form {
    padding: 1.5rem;
  }

  /* FAQ items — tighter */
  body.ac-home .ac-faq-item summary {
    padding: 1rem 1.25rem;
  }

  body.ac-home .ac-faq-item h3 {
    font-size: 0.95rem;
  }

  /* Section padding tighter */
  body.ac-home .ac-section,
  body.ac-home .ac-product,
  body.ac-home .ac-reviews,
  body.ac-home .ac-form-section {
    padding: var(--space-lg) 0;
  }

  /* Stat cards — less padding */
  body.ac-home .ac-stat {
    padding: 28px 20px;
  }

  /* Step cards — less padding */
  body.ac-home .ac-step {
    padding: 28px 20px;
  }

  /* Location cards — less padding */
  body.ac-home .ac-location-card {
    padding: 24px;
  }
}

/* ---------- Small Mobile ≤ 390px ---------- */
@media (max-width: 390px) {
  /* Font scaling */
  :root {
    --text-base: 15px;
  }

  body.ac-home .ac-hero h1 {
    font-size: 1.6rem;
  }

  body.ac-home .ac-hero p:first-of-type {
    font-size: 1rem;
  }

  /* Tighter padding */
  body.ac-home .ac-container {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  /* Steps CTA — smaller */
  body.ac-home .ac-section:has(.ac-steps-grid) > .ac-container > .ac-text-center .ac-btn--primary {
    padding: 14px 28px;
    font-size: 16px;
  }

  /* Trust bar item — smaller */
  body.ac-home .ac-trust-bar__item {
    font-size: 12px;
  }

  /* Stat number — smaller */
  body.ac-home .ac-stat__number {
    font-size: 2.2rem;
  }

  /* Card padding reduced */
  body.ac-home .ac-grid--2 .ac-card,
  body.ac-home .ac-services-grid .ac-card {
    padding: 24px 20px;
  }
}