:root {
    --cream: #F7F4ED;
    --cream-light: #FDFBF7;
    --cream-dark: #EDE8DC;
    --ink: #0F0F0F;
    --ink-soft: #1A1A1A;
    --gray: #6B6B6B;
    --gray-light: #9B9B9B;
    --border: #E5E0D7;
    --red: #C8102E;
    --red-dark: #A60E13;
    --red-soft: #FBE9EC;
    --serif: 'Inter', -apple-system, sans-serif; /* un seul font sur tout le site — décision client */
    --sans: 'Inter', -apple-system, sans-serif;
  }

  /* Red pill tags retired — do not reintroduce */
  .card-tag,
  .bubble-tag {
    display: none !important;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }

  html {
    scroll-behavior: smooth;
    /* Scroll natural — fara snap, ca pe un site normal. */
    scroll-padding-top: 88px;
  }
  /* Sectiunile pastreaza min-height 100vh ca sa aiba respiratie vizuala
     dar NU mai sunt anchorate scroll-snap. */
  .hero,
  .stats-section,
  .system-section,
  .bundle-section,
  .pentru-section,
  .reach-section,
  .sistem-section,
  .montaj-section,
  .testimonial-section,
  .proces-section,
  .why-section,
  .comparison-section,
  footer {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  /* Trust-bar is too short to be its own page — let it flow with the previous one */
  .trust-bar { scroll-snap-align: none; }

  /* === SUPERPOWERS — cele 3 carduri PLUTESC peste partea de jos a caruselului === */
  .superpowers {
    scroll-snap-align: none;
    min-height: 0;
    display: block;
    padding: 0 0 28px;
    margin-top: -86px;          /* jumătate peste fotografie */
    position: relative;
    z-index: 5;
    background: transparent;    /* fotografia se vede în spatele cardurilor */
    border: none;
  }
  /* Umbră fină ca să se desprindă de fotografie (aspectul cardului neschimbat) */
  .superpowers .superpower {
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.14);
  }
  .superpowers-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  .superpower {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 14px;
    color: var(--ink);
    text-decoration: none;
    transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  }
  .superpower:hover {
    border-color: var(--red);
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(200, 16, 46, 0.10);
  }
  .superpower-icon {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--red-soft);
    color: var(--red);
    border-radius: 12px;
  }
  .superpower-icon svg { width: 22px; height: 22px; }
  .superpower-text { flex: 1; min-width: 0; }
  .superpower-text strong {
    display: block;
    font-family: var(--serif);
    font-size: 19px;
    font-weight: 500;
    color: var(--ink);
    letter-spacing: -0.01em;
    line-height: 1.1;
    margin-bottom: 4px;
  }
  .superpower-text span {
    display: block;
    font-size: 12.5px;
    color: var(--gray);
    line-height: 1.4;
  }
  .superpower-arrow {
    flex-shrink: 0;
    color: var(--red);
    font-size: 18px;
    opacity: 0;
    transition: opacity 0.2s ease, transform 0.2s ease;
  }
  .superpower:hover .superpower-arrow { opacity: 1; transform: translateX(3px); }
  @media (max-width: 968px) {
    .superpowers-grid { grid-template-columns: 1fr; }
  }
  /* Footer can be shorter than a full page */
  footer { min-height: auto; padding: 80px 0 40px; }
  /* On small viewports, drop snap completely + free-flow like a newspaper */
  @media (max-width: 768px) {
    html {
      scroll-snap-type: none;
      scroll-padding-top: 0;
      scroll-behavior: auto;
      /* clip (nu hidden) — hidden strică position:sticky pe iOS Safari */
      overflow-x: clip;
    }
    .hero:not(.hero--photo), .stats-section, .system-section, .bundle-section, .pentru-section,
    .reach-section, .sistem-section, .montaj-section, .testimonial-section,
    .proces-section, .why-section, .comparison-section, .cta-section {
      min-height: auto;
      display: block;
      scroll-snap-align: none;
      scroll-snap-stop: normal;
    }
  }

  body {
    font-family: var(--sans);
    background: var(--cream);
    color: var(--ink-soft);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5;
    overflow-x: clip;
  }

  .container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
  }

  /* === NAVIGATION === */
  nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: rgba(247, 244, 237, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid transparent;
    transition: border-color 0.3s ease;
  }
  nav.scrolled { border-bottom-color: transparent; }

  /* === NAV: mereu transparent cu fum negru sub text (ca pe hero), pe toata aplicatia === */
  nav { transition: border-color 0.3s ease; background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border-bottom-color: transparent !important; }
  nav::before {
    content: ''; position: absolute; left: 0; right: 0; top: 0; height: 200%;
    background: linear-gradient(180deg, rgba(8,7,6,0.72) 0%, rgba(8,7,6,0.42) 38%, rgba(8,7,6,0.14) 70%, rgba(8,7,6,0) 100%);
    pointer-events: none; z-index: -1;
  }
  nav:not(.scrolled) {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  nav:not(.scrolled) .logo-img {
    /* logo ROȘU brand (#C8102E) peste video */
    filter: brightness(0) saturate(100%) invert(13%) sepia(96%) saturate(5630%)
            hue-rotate(347deg) brightness(84%) contrast(98%)
            drop-shadow(0 1px 10px rgba(0, 0, 0, 0.30));
  }
  nav:not(.scrolled) .nav-menu-link {
    color: #FFFFFF;
    text-shadow: 0 1px 3px rgba(0,0,0,0.55), 0 2px 18px rgba(0, 0, 0, 0.55);
  }
  nav:not(.scrolled) .nav-menu-link:hover { color: rgba(255, 255, 255, 0.85); }
  nav:not(.scrolled) .country-switcher-trigger {
    color: #FFFFFF;
    background: transparent;
    border: none;
  }
  nav:not(.scrolled) .nav-cta .btn-ghost {
    color: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.55);
    background: rgba(255, 255, 255, 0.10);
  }
  nav:not(.scrolled) .nav-cta .btn-primary {
    background: rgba(255, 255, 255, 0.14);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.38);
  }
  nav:not(.scrolled) .nav-cta .btn-primary:hover {
    background: rgba(255, 255, 255, 0.24);
    border-color: rgba(255, 255, 255, 0.60);
    color: #FFFFFF;
  }
  nav:not(.scrolled) .nav-burger span { background: #FFFFFF; }
  nav:not(.scrolled) .nav-burger {
    border-color: rgba(255, 255, 255, 0.40);
    background: rgba(255, 255, 255, 0.10);
  }
  .nav-inner {
    max-width: none;
    margin: 0;
    padding: 18px clamp(16px, 3vw, 56px); /* ~15mm de la margine, full-width comme ZURU */
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 12px;
  }
  .logo {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    flex-shrink: 0;
    margin-right: auto;
    font-family: var(--sans);
    font-weight: 700;
    font-size: 19px;
    color: var(--ink);
    text-decoration: none;
    letter-spacing: -0.02em;
  }
  .logo-mark {
    width: 32px; height: 32px;
    background: var(--red);
    display: flex; align-items: center; justify-content: center;
    border-radius: 6px;
  }
  .logo-mark svg { width: 22px; height: 22px; }
  .logo-img {
    height: 30px;
    width: auto;
    display: block;
    object-fit: contain;
  }
  @media (max-width: 640px) {
    .logo-img { height: 26px; }
  }
  @media (max-width: 768px) {
    .nav-inner {
      padding: 12px 12px;
      gap: 10px;
    }
    .logo-img {
      height: 26px;
      width: auto;
      object-fit: contain;
      object-position: left center;
    }
    .nav-cta {
      flex: 0 0 auto;
      gap: 6px;
      flex-wrap: nowrap;
      align-items: center;
    }
    .nav-cta .btn-primary.nav-cta-devis {
      padding: 0 14px;
      font-size: 12px;
      white-space: nowrap;
      line-height: 1.2;
    }
    .country-switcher-trigger {
      padding: 0 10px;
    }
    .nav-burger {
      flex-shrink: 0;
    }
    .country-switcher-caret { display: none; }
  }
  @media (max-width: 380px) {
    .nav-inner { padding: 10px; gap: 6px; }
    .logo-img { height: 24px; }
    .nav-cta { gap: 5px; }
    .nav-cta .btn-primary.nav-cta-devis { padding: 0 12px; font-size: 11.5px; }
    .country-switcher-trigger { padding: 0 8px; }
  }
  .nav-links {
    display: flex;
    gap: 36px;
    list-style: none;
  }
  .nav-links a {
    color: var(--ink-soft);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.2s;
  }
  .nav-links a:hover { color: var(--red); }

  /* === SECTION NAV — outlined pill buttons on right edge === */
  .section-nav {
    position: fixed;
    top: 50%;
    right: 18px;
    transform: translateY(-50%);
    z-index: 90;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .section-nav-dot {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 108px;
    padding: 10px 14px;
    background: transparent;
    border: 1px solid rgba(60, 200, 255, 0.45);
    border-radius: 100px;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
  .section-nav-dot:hover {
    border-color: rgba(120, 230, 255, 0.95);
    background: rgba(60, 200, 255, 0.08);
    box-shadow: 0 0 14px rgba(60, 200, 255, 0.35);
    transform: translateX(-2px);
  }
  .section-nav-dot.is-active {
    border-color: rgba(60, 200, 255, 1);
    background: rgba(60, 200, 255, 0.14);
    box-shadow: 0 0 18px rgba(60, 200, 255, 0.55), 0 0 36px rgba(60, 200, 255, 0.25);
    /* premium = calm: no infinite pulse */
  }
  @keyframes navPulse {
    0%, 100% {
      box-shadow: 0 0 18px rgba(60, 200, 255, 0.55), 0 0 36px rgba(60, 200, 255, 0.25);
    }
    50% {
      box-shadow: 0 0 26px rgba(60, 200, 255, 0.85), 0 0 52px rgba(60, 200, 255, 0.4);
    }
  }
  .section-nav-label {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-soft);
    white-space: nowrap;
    transition: color 0.3s ease;
  }
  .section-nav-dot:hover .section-nav-label {
    color: var(--ink);
  }
  .section-nav-dot.is-active .section-nav-label {
    color: rgba(15, 90, 130, 1);
  }
  @media (max-width: 968px) {
    .section-nav { display: none; }
  }
  .nav-cta {
    display: flex;
    gap: 10px;
    align-items: center;
    flex: 0 0 auto;
    flex-wrap: nowrap;
  }
  .btn.nav-cta-devis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: auto;
    min-height: 36px;
    background: transparent;
    color: #0F0F0F;
    border: none;
    border-radius: 0;
    padding: 0 8px;
    font-weight: 600;
    box-shadow: none;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    text-decoration-color: currentColor;
    transition: opacity .15s ease, color .15s ease;
  }
  .btn.nav-cta-devis:hover {
    background: transparent;
    border: none;
    opacity: 0.72;
    transform: none;
    box-shadow: none;
    text-decoration: underline;
  }
  nav:not(.scrolled) .nav-cta-devis,
  nav:not(.scrolled) .nav-cta .btn-primary.nav-cta-devis {
    background: transparent;
    border: none;
    color: #FFFFFF;
  }
  nav:not(.scrolled) .nav-cta-devis:hover,
  nav:not(.scrolled) .nav-cta .btn-primary.nav-cta-devis:hover {
    background: transparent;
    border: none;
    color: #FFFFFF;
    opacity: 0.72;
  }

  /* === MENU (added in nav between logo and CTA) === */
  .nav-menu {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: 36px;
    flex: 1;
  }
  .nav-menu-item { position: relative; }
  .nav-menu-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 500;
    color: var(--ink-soft);
    text-decoration: none;
    letter-spacing: 0.01em;
    border-radius: 100px;
    transition: background 0.2s ease, color 0.2s ease;
    cursor: pointer;
  }
  .nav-menu-link:hover { background: rgba(15, 15, 15, 0.05); color: var(--ink); }
  .nav-menu-caret { font-size: 10px; opacity: 0.6; }
  .nav-menu-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 220px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 24px 50px rgba(0,0,0,0.10);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
  }
  .nav-menu-dropdown a {
    display: block;
    padding: 9px 14px;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--ink-soft);
    text-decoration: none;
    transition: background 0.15s ease;
  }
  .nav-menu-dropdown a:hover { background: var(--cream); color: var(--ink); }
  .nav-menu-item:hover .nav-menu-dropdown,
  .nav-menu-item:focus-within .nav-menu-dropdown {
    opacity: 1; visibility: visible; transform: translateY(0);
  }
  @media (max-width: 1100px) {
    .nav-menu { display: none; }
  }

  /* === HAMBURGER + MOBILE DRAWER (≤1100px) === */
  .nav-burger {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 40px; height: 36px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
    padding: 0;
    margin-left: 10px;
    transition: background 0.2s ease, border-color 0.2s ease;
  }
  .nav-burger:hover { background: var(--cream); border-color: var(--ink-soft); }
  .nav-burger span {
    display: block;
    width: 20px; height: 2px;
    background: var(--ink);
    border-radius: 2px;
    transition: transform 0.25s ease, opacity 0.2s ease;
    transform-origin: center;
  }
  .nav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-burger.open span:nth-child(2) { opacity: 0; }
  .nav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .nav-drawer {
    position: fixed;
    top: 0; right: 0;
    width: min(360px, 86vw);
    height: 100vh;
    background: var(--cream-light);
    border-left: 1px solid var(--border);
    box-shadow: -20px 0 60px rgba(0,0,0,0.15);
    z-index: 1000;
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    overflow-y: auto;
    padding: 64px 24px 24px;
    visibility: hidden;
  }
  .nav-drawer-close {
    position: absolute;
    top: 16px; right: 16px;
    width: 36px; height: 36px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
    transition: background 0.2s ease, color 0.2s ease;
    padding: 0;
  }
  .nav-drawer-close:hover { background: var(--red-soft); color: var(--red); }
  .nav-drawer-close svg { width: 16px; height: 16px; }
  .nav-drawer.open { transform: translateX(0); visibility: visible; }
  .nav-drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15,15,15,0.4);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }
  .nav-drawer-overlay.open { opacity: 1; visibility: visible; }
  .nav-drawer-group { margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
  .nav-drawer-group:last-child { border-bottom: none; }
  .nav-drawer-group > .nav-drawer-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gray);
    margin-bottom: 8px;
  }
  .nav-drawer a {
    display: block;
    padding: 9px 4px;
    color: var(--ink);
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    transition: color 0.15s ease, padding-left 0.2s ease;
  }
  .nav-drawer a:hover, .nav-drawer a:focus {
    color: var(--red);
    padding-left: 8px;
  }
  .nav-drawer a.partner-link { color: var(--red); font-weight: 600; }
  .nav-drawer-cta {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .nav-drawer-cta .btn {
    width: 100%;
    justify-content: center;
    padding: 11px 18px !important;
    font-size: 13.5px !important;
  }
  .nav-drawer-cta .btn-ghost {
    background: white;
    color: var(--ink) !important;
    border: 1px solid var(--border);
  }
  .nav-drawer-cta .btn-ghost:hover { background: var(--cream); border-color: var(--ink-soft); }
  .nav-drawer-cta .btn-primary {
    background: var(--red) !important;
    color: white !important;
  }
  .nav-drawer-cta .btn-primary:hover { background: var(--red-dark) !important; }
  body.nav-open { overflow: hidden; }

  @media (max-width: 1100px) {
    .nav-burger { display: inline-flex; }
  }
  @media (max-width: 640px) {
    /* Ascunde butonul Contact din nav-cta — ramane doar Cere oferta + hamburger */
    .nav-cta .btn-ghost { display: none; }
  }
  .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
    border: none;
    cursor: pointer;
    font-family: var(--sans);
  }
  .btn-ghost {
    color: var(--ink-soft);
    background: transparent;
  }
  .btn-ghost:hover { background: var(--cream-dark); }
  .btn-primary {
    background: var(--ink);
    color: var(--cream);
  }
  .btn-primary:hover { background: var(--red); transform: translateY(-1px); }
  .btn-red {
    background: var(--red);
    color: white;
  }
  .btn-red:hover { background: var(--red-dark); transform: translateY(-1px); }
  .btn-large { padding: 14px 24px; font-size: 15px; }

  /* === HERO === */
  .hero {
    padding: 110px 0 40px;
    position: relative;
    overflow: hidden;
  }
  /* Hero: 2-column layout — text LEFT, robot image RIGHT. Stacks on mobile. */
  .hero .container {
    margin: 0 auto;
    max-width: 1480px;
    padding: 0 clamp(32px, 5vw, 64px);
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 48px;
    align-items: center;
  }
  .hero .container > .hero-text-col {
    max-width: 640px;
  }
  .hero .hero-image-col {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .hero .hero-image-col .mobile-product {
    max-width: 520px;
    margin: 0;
  }
  @media (max-width: 968px) {
    .hero .container { grid-template-columns: 1fr; gap: 24px; }
    .hero .container > .hero-text-col { max-width: 100%; }
    .hero .hero-image-col .mobile-product { max-width: 340px; }
  }
  .hero h1 { max-width: 680px; }
  .hero .hero-eyebrow { max-width: max-content; }
  .hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--red-soft);
    color: var(--red);
    padding: 6px 14px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 32px;
  }
  .hero-eyebrow::before {
    content: '';
    width: 6px; height: 6px;
    background: var(--red);
    border-radius: 50%;
  }
  @keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
  }
  .hero h1 {
    font-family: var(--serif);
    font-size: clamp(48px, 7vw, 96px);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: -0.04em;
    color: var(--ink);
    max-width: 1000px;
    margin-bottom: 28px;
  }
  .hero h1 em {
    font-style: italic;
    color: var(--red);
    font-weight: 300;
  }
  .hero-sub {
    font-size: 20px;
    color: var(--gray);
    max-width: 580px;
    margin-bottom: 40px;
    line-height: 1.5;
  }
  .hero-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 80px;
  }
  .hero-visual {
    position: relative;
    margin-top: 60px;
    height: clamp(640px, 95vh, 1200px);
    overflow: visible;
  }
  .hero-visual::before { display: none; }
  /* === REAL WALL VISUAL — full-screen, scroll-scrubbed video === */
  .wall-visual {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 100%;
    transform: translateX(-50%);
    overflow: hidden;
    background: transparent;
  }
  .wall-visual video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    pointer-events: none;
  }
  .wall-hint {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(15, 15, 15, 0.78);
    color: var(--cream);
    padding: 7px 14px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 500;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    letter-spacing: 0.02em;
    pointer-events: none;
    opacity: 0.85;
    transition: opacity 0.4s ease;
  }
  .wall-hint::before {
    content: '↕';
    margin-right: 6px;
    display: inline-block;
  }
  @keyframes hintBob {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-3px); }
  }
  .wall-visual.scrolled .wall-hint { opacity: 0; }
  .stat-floating {
    position: absolute;
    background: white;
    padding: 14px 20px;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0,0,0,0.08);
    border: 1px solid var(--border);
    font-size: 13px;
    color: var(--gray);
  }
  .stat-floating strong {
    display: block;
    color: var(--ink);
    font-size: 22px;
    font-family: var(--serif);
    font-weight: 500;
    margin-bottom: 2px;
  }
  .stat-floating.s1 { top: 30px; left: 60px; }
  .stat-floating.s2 { bottom: 40px; right: 60px; }
  .stat-floating.s3 { top: 50%; right: 30px; }
  @keyframes floatStat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
  }

  /* === TRUST BAR === */
  .trust-bar {
    padding: 60px 0;
    margin-top: 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: var(--cream-light);
  }
  .trust-label {
    text-align: center;
    font-size: 13px;
    color: var(--gray);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 32px;
    font-weight: 500;
  }
  .trust-items {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    flex-wrap: nowrap;
  }
  .trust-item {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--gray);
    font-size: 14px;
    font-weight: 500;
    opacity: 0.85;
    transition: opacity 0.2s;
    white-space: nowrap;
    flex-shrink: 0;
  }
  @media (max-width: 1080px) {
    .trust-items {
      flex-wrap: wrap;
      justify-content: center;
      gap: 24px 32px;
    }
  }
  .trust-item:hover { opacity: 1; color: var(--ink); }
  .trust-icon {
    width: 28px; height: 28px;
    background: var(--ink);
    color: var(--cream);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--serif);
    font-size: 11px;
    font-weight: 600;
  }

  /* === STATS SECTION === */
  /* Stats section — compressed to fit in a single 100vh page */
  .stats-section {
    padding: 30px 0;
    justify-content: flex-start; /* prevents centered overflow */
  }
  /* Stats section uses full container width (floating product removed) */
  .stats-section .container {
    margin: 0 auto;
    max-width: 1480px;
    padding-left: clamp(32px, 5vw, 64px);
    padding-right: clamp(32px, 5vw, 64px);
  }
  .stats-section .section-eyebrow { margin-bottom: 6px; font-size: 12px; }
  .stats-section .section-title { font-size: clamp(24px, 3vw, 40px); line-height: 1.05; margin-bottom: 10px; }
  .stats-section .section-sub { font-size: 13.5px; line-height: 1.5; margin-bottom: 16px; max-width: 560px; }
  /* Passive showcase — very compact */
  .stats-section .passive-showcase {
    margin: 0 0 14px;
    padding: 18px 24px;
    grid-template-columns: 1fr;
    gap: 14px;
    border-radius: 18px;
  }
  .stats-section .energy-scale { display: flex; flex-direction: row; gap: 3px; align-items: center; }
  .stats-section .energy-bar { width: auto; padding: 4px 10px; font-size: 11px; border-radius: 100px; box-shadow: none; }
  .stats-section .energy-bar.active { width: auto; font-size: 15px; padding: 5px 12px; box-shadow: 0 0 14px rgba(0,166,81,0.4); }
  .stats-section .energy-bar.active .arrow { display: none; }
  .stats-section .energy-bar.dim { font-size: 10.5px; padding: 4px 10px; opacity: 0.4; }
  .stats-section .passive-tag { padding: 3px 9px; font-size: 9.5px; margin-bottom: 6px; }
  .stats-section .passive-info h3 { font-size: 19px; line-height: 1.15; margin-bottom: 6px; }
  .stats-section .passive-info p { font-size: 12.5px; line-height: 1.45; margin-bottom: 10px; }
  .stats-section .passive-bullets { gap: 5px; }
  .stats-section .passive-bullet { font-size: 12px; gap: 10px; line-height: 1.4; }
  .stats-section .passive-bullet-icon { width: 24px; height: 24px; border-radius: 6px; }
  .stats-section .passive-bullet-icon svg { width: 13px; height: 13px; }
  /* Stats grid — small but readable */
  .stats-section .stats-grid { grid-template-columns: repeat(4, 1fr); border-radius: 12px; }
  .stats-section .stat-card { padding: 14px 14px; }
  .stats-section .stat-icon { width: 28px; height: 28px; margin-bottom: 8px; border-radius: 6px; }
  .stats-section .stat-icon svg { width: 14px; height: 14px; }
  .stats-section .stat-num { font-size: 24px; line-height: 1; margin-bottom: 2px; }
  .stats-section .stat-num span[style*="32px"] { font-size: 16px !important; }
  .stats-section .stat-label { font-size: 11.5px; line-height: 1.35; }
  @media (max-width: 968px) {
    .stats-section .container { padding-left: 32px; padding-right: 32px; }
    .stats-section .stats-grid { grid-template-columns: 1fr 1fr; }
  }
  .section-eyebrow {
    font-size: 13px;
    color: var(--red);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 600;
    margin-bottom: 16px;
    display: block;
  }
  .section-title {
    font-family: var(--serif);
    font-size: clamp(36px, 4.5vw, 56px);
    font-weight: 400;
    line-height: 1.05;
    letter-spacing: -0.03em;
    margin-bottom: 24px;
    color: var(--ink);
    max-width: 720px;
  }
  .section-sub {
    font-size: 18px;
    color: var(--gray);
    max-width: 560px;
    margin-bottom: 64px;
  }
  .stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: var(--border);
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
  }
  .stat-card {
    padding: 40px 32px;
    background: var(--cream-light);
    transition: background 0.2s;
  }
  .stat-card:hover { background: white; }
  .stat-num {
    font-family: var(--serif);
    font-size: 56px;
    font-weight: 400;
    color: var(--ink);
    line-height: 1;
    letter-spacing: -0.03em;
    margin-bottom: 10px;
  }
  .stat-num span { color: var(--red); }
  .stat-label {
    font-size: 14px;
    color: var(--gray);
    line-height: 1.5;
  }
  .stat-icon {
    width: 56px; height: 56px;
    background: transparent;
    color: var(--red);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    overflow: hidden;
  }
  .stat-icon svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .stat-icon img { width: 100%; height: 100%; object-fit: contain; display: block; }

  /* === STATS SECTION watermark wrapper (matches other pages) === */
  .stats-stage-wrap {
    position: relative;
    margin: 70px auto 0;
    max-width: 1480px;
  }
  .stats-watermark {
    position: absolute; top: 0; left: 50%; width: 100vw; margin-left: -50vw;
    pointer-events: none; user-select: none; transform: translateY(-38%);
    height: 1em; line-height: 1; text-align: center; text-transform: uppercase;
    font-family: var(--serif); font-size: clamp(64px, 11vw, 180px);
    font-weight: 500; letter-spacing: -0.06em; z-index: 2;
  }
  .stats-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .stats-watermark .wm-top { color: transparent; -webkit-text-stroke: 1.4px rgba(15,15,15,0.30); clip-path: inset(0 0 62% 0); }
  .stats-watermark .wm-bottom { color: var(--cream-dark); opacity: 0.65; clip-path: inset(38% 0 0 0); }
  .stats-stage {
    position: relative;
    background: var(--cream-light);
    border: 1px solid var(--border);
    border-radius: 32px;
    padding: 56px 48px 48px;
  }
  .stats-intro {
    max-width: 760px; margin: 0 auto 40px; text-align: center;
  }
  .stats-intro .bubble-tag {
    display: inline-block; background: var(--red-soft); color: var(--red);
    padding: 4px 12px; border-radius: 4px; font-size: 11px; font-weight: 600;
    letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 14px;
  }
  .stats-intro h2 {
    font-family: var(--serif); font-size: clamp(28px, 3.2vw, 44px); font-weight: 500;
    color: var(--ink); letter-spacing: -0.02em; line-height: 1.05; margin-bottom: 12px;
  }
  .stats-intro h2 em { font-style: italic; color: var(--red); font-weight: 400; }
  .stats-intro p { font-size: 15px; color: var(--gray); line-height: 1.6; margin: 0; }

  /* Two cards INSIDE stage: photo LEFT + showcase RIGHT, 50/50, equal taller height */
  .passive-showcase-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: stretch;
    margin-bottom: 32px;
    min-height: 500px; /* both cards equal height */
  }
  .passive-showcase-wrap > .passive-photo-card,
  .passive-showcase-wrap > .passive-showcase {
    height: 100%;
    min-height: 500px;
  }

  @media (max-width: 1100px) {
    .passive-showcase-wrap { grid-template-columns: 1fr; gap: 20px; min-height: 0; }
    .passive-showcase-wrap > .passive-photo-card { min-height: 340px; }
    .passive-showcase-wrap > .passive-showcase { min-height: 0; }
    .stats-stage { padding: 44px 28px 32px; }
  }

  /* LEFT: photo card with alternating images (construction ↔ finished, 1s each) */
  .passive-photo-card {
    position: relative;
    border-radius: 28px;
    overflow: hidden;
    background: var(--ink);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-md);
  }
  .passive-photo-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    opacity: 0;
  }
  /* Static premium: o singură fotografie, fără ciclu (pozele 1-3 sunt 404) */
  .passive-photo-img:nth-child(1),
  .passive-photo-img:nth-child(2),
  .passive-photo-img:nth-child(3) { display: none; }
  .passive-photo-img:nth-child(4) { opacity: 1; }
  .passive-photo-label {
    position: absolute;
    bottom: 18px; left: 18px;
    background: rgba(15,15,15,0.88);
    color: var(--cream);
    padding: 8px 16px;
    border-radius: 100px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
    z-index: 2;
  }

  /* RIGHT: original passive-showcase (back to its old 2-col internal layout) */
  .passive-showcase {
    margin: 0;
    display: grid;
    grid-template-columns: 0.9fr 1fr;
    gap: 56px;
    align-items: center;
    background: linear-gradient(135deg, var(--cream-light) 0%, var(--cream) 100%);
    color: var(--ink);
    border: 1px solid var(--border);
    border-radius: 28px;
    padding: 48px;
    position: relative;
    overflow: hidden;
    box-shadow: var(--shadow-md);
  }

  @media (max-width: 1100px) {
    .passive-showcase-wrap { grid-template-columns: 1fr; gap: 20px; }
  }
  @media (max-width: 968px) {
    .passive-showcase { grid-template-columns: 1fr; gap: 28px; padding: 32px; }
  }
  .passive-showcase::before {
    content: '';
    position: absolute;
    top: -40%; right: -20%;
    width: 700px; height: 700px;
    background: radial-gradient(circle, rgba(200,16,46,0.06) 0%, transparent 60%);
    pointer-events: none;
  }
  .passive-showcase::after {
    content: '';
    position: absolute;
    bottom: -30%; left: -20%;
    width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(0,166,81,0.05) 0%, transparent 60%);
    pointer-events: none;
  }

  /* Energy class scale (EU-style) */
  .energy-scale {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .energy-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: white;
    font-family: var(--serif);
    font-weight: 600;
    letter-spacing: -0.01em;
    border-radius: 0 100px 100px 0;
    padding: 7px 18px 7px 22px;
    transition: all 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: 0 4px 14px rgba(0,0,0,0.2);
  }
  .energy-bar.active {
    font-size: 36px;
    padding: 16px 32px 16px 32px;
    background: linear-gradient(90deg, #00a651 0%, #00d957 100%);
    box-shadow: 0 0 40px rgba(0,166,81,0.45), 0 8px 24px rgba(0,0,0,0.25);
    width: 78%;
    position: relative;
  }
  .energy-bar.active .arrow {
    font-size: 14px;
    font-family: var(--sans);
    font-weight: 500;
    letter-spacing: 0.05em;
    opacity: 0.95;
    margin-left: 16px;
    white-space: nowrap;
  }
  @keyframes glowPass {
    0%, 100% { box-shadow: 0 0 40px rgba(0,166,81,0.45), 0 8px 24px rgba(0,0,0,0.25); }
    50%      { box-shadow: 0 0 60px rgba(0,166,81,0.7),  0 8px 24px rgba(0,0,0,0.25); }
  }
  .energy-bar.dim {
    font-size: 16px;
    padding: 7px 22px;
    opacity: 0.32;
  }
  .energy-bar.b { width: 70%; background: #50b748; }
  .energy-bar.c { width: 64%; background: #c5d028; color: #1a1a1a; }
  .energy-bar.d { width: 58%; background: #fff200; color: #1a1a1a; }
  .energy-bar.e { width: 52%; background: #fbb040; }
  .energy-bar.f { width: 46%; background: #f15a29; }
  .energy-bar.g { width: 40%; background: #ed1c24; }

  /* Passive info block */
  .passive-info {
    position: relative;
    z-index: 1;
  }
  .passive-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--red-soft);
    color: var(--red);
    padding: 7px 14px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 22px;
  }
  .passive-tag::before {
    content: '';
    width: 6px; height: 6px;
    background: var(--red);
    border-radius: 50%;
  }
  .passive-info h3 {
    font-family: var(--serif);
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin-bottom: 18px;
    color: var(--ink);
  }
  .passive-info h3 em {
    font-style: italic;
    color: var(--red);
    font-weight: 300;
  }
  .passive-info p {
    color: var(--gray);
    line-height: 1.6;
    font-size: 16px;
    margin-bottom: 24px;
  }
  .passive-bullets {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .passive-bullet {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 14.5px;
    color: var(--ink-soft);
  }
  .passive-bullet-icon {
    width: 36px; height: 36px;
    background: var(--red-soft);
    border: 1px solid rgba(200,16,46,0.15);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--red);
  }
  .passive-bullet-icon svg {
    width: 18px; height: 18px;
    stroke: currentColor; fill: none;
    stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  }

  @media (max-width: 968px) {
    .passive-showcase {
      grid-template-columns: 1fr;
      padding: 40px 28px;
      gap: 32px;
    }
    .energy-bar.active { font-size: 26px; padding: 14px 24px; width: 95%; }
    .energy-bar.active .arrow { display: none; }
  }

  /* === STRUCTURAL ADVANTAGES === */
  .structural-showcase {
    margin: 0 0 36px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
  .structural-card {
    background: var(--cream-light);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 36px 30px;
    position: relative;
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    overflow: hidden;
  }
  .structural-card:hover {
    border-color: var(--ink);
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(0,0,0,0.06);
  }
  .structural-card .only-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--ink);
    color: var(--red);
    padding: 5px 12px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 20px;
  }
  .structural-card .only-badge::before {
    content: '★';
    color: var(--red);
  }
  .structural-card .icon-wrap {
    width: 52px; height: 52px;
    background: var(--ink);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
  }
  .structural-card .icon-wrap svg {
    width: 26px; height: 26px;
    stroke: var(--red); fill: none;
    stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  }
  .structural-card h4 {
    font-family: var(--serif);
    font-size: 24px;
    font-weight: 500;
    color: var(--ink);
    letter-spacing: -0.02em;
    margin-bottom: 12px;
    line-height: 1.18;
  }
  .structural-card p {
    color: var(--gray);
    font-size: 15px;
    line-height: 1.6;
  }
  .structural-card p strong {
    color: var(--ink);
    font-weight: 600;
  }

  /* Trust line under stats */
  .stats-trust-line {
    margin-top: 36px;
    text-align: center;
  }
  .stats-trust-intro {
    font-size: 13px;
    color: var(--gray-light);
    line-height: 1.5;
    max-width: 760px;
    margin: 0 auto 22px;
  }
  .stats-trust-intro strong { color: var(--gray); font-weight: 500; }
  .stats-trust-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    max-width: 1180px;
    margin: 0 auto;
  }
  .stats-trust-cell {
    background: var(--cream-light);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 18px 22px;
    text-align: left;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 18px;
    row-gap: 4px;
    align-items: baseline;
  }
  .stats-trust-label {
    grid-column: 1;
    grid-row: 1 / 3;
    font-family: var(--serif);
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
    align-self: center;
    padding-right: 18px;
    border-right: 1px solid var(--border);
    letter-spacing: -0.01em;
  }
  .stats-trust-values {
    grid-column: 2;
    grid-row: 1;
    font-size: 13.5px;
    color: var(--ink-soft);
    font-variant-numeric: tabular-nums;
    line-height: 1.4;
  }
  .stats-trust-values strong { color: var(--red); font-weight: 600; }
  .stats-trust-note {
    grid-column: 2;
    grid-row: 2;
    font-size: 12px;
    color: var(--gray);
    letter-spacing: 0.01em;
  }
  @media (max-width: 968px) {
    .stats-trust-grid { grid-template-columns: 1fr; }
  }

  @media (max-width: 968px) {
    .structural-showcase { grid-template-columns: 1fr 1fr; }
  }
  @media (max-width: 640px) {
    .structural-showcase { grid-template-columns: 1fr; }
  }

  /* === SISTEMUL — 4 PAȘI (dark card hugs the content; section page is cream) === */
  .system-section {
    padding: 36px 0;
    background: transparent;
    color: var(--ink);
    border-radius: 0;
    margin: 0;
    justify-content: center; /* center the dark card vertically */
  }
  /* Container becomes the dark card itself — only as tall as its content */
  .system-section .container {
    margin: 0;
    margin-left: clamp(32px, 6vw, 96px);
    max-width: clamp(420px, 56vw, 780px);
    padding: 36px 40px 32px;
    background: var(--ink);
    color: var(--cream);
    border-radius: 28px;
  }
  .system-section .section-eyebrow { margin-bottom: 6px; font-size: 12px; }
  .system-section .section-title { font-size: clamp(28px, 3.4vw, 48px); margin-bottom: 8px; }
  .system-section .reveal:first-child .section-sub { margin-bottom: 18px; font-size: 13.5px; }
  .system-section .steps-grid {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 16px;
  }
  .system-section .step-card { padding: 16px 16px; }
  .system-section .step-num { margin-bottom: 8px; font-size: 11px; }
  .system-section .step-title { font-size: 17px; margin-bottom: 4px; line-height: 1.15; }
  .system-section .step-desc { font-size: 12.5px; line-height: 1.45; }
  @media (max-width: 968px) {
    .system-section .container { padding-left: 32px; padding-right: 32px; }
    .system-section .steps-grid { grid-template-columns: 1fr 1fr; }
  }
  .system-section .section-eyebrow { color: var(--red); }
  .system-section .section-title { color: var(--cream); }
  .system-section .section-sub { color: var(--gray-light); }
  .steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-top: 60px;
  }
  .step-card {
    padding: 32px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 16px;
    transition: all 0.3s ease;
  }
  .step-card:hover {
    background: rgba(255,255,255,0.06);
    transform: translateY(-4px);
  }
  .step-num {
    font-family: var(--serif);
    font-size: 14px;
    color: var(--red);
    font-weight: 500;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .step-num::before {
    content: '';
    width: 24px;
    height: 1px;
    background: var(--red);
  }
  .step-title {
    font-family: var(--serif);
    font-size: 24px;
    font-weight: 400;
    margin-bottom: 12px;
    line-height: 1.2;
    letter-spacing: -0.02em;
  }
  .step-desc {
    font-size: 15px;
    color: var(--gray-light);
    line-height: 1.6;
  }

  /* === REACH — Production hubs + market presence === */
  .reach-section {
    padding: 32px 0;
    background: var(--cream-light);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    justify-content: flex-start;
  }
  .reach-section .container { max-width: 1480px; }
  .reach-header {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 14px;
  }
  .reach-header .section-eyebrow { margin-bottom: 4px; font-size: 11px; }
  .reach-header .section-title {
    font-size: clamp(24px, 3vw, 40px);
    margin-bottom: 6px;
    line-height: 1.05;
  }
  .reach-header .section-sub {
    font-size: 13.5px;
    margin: 0 auto;
    max-width: 620px;
    color: var(--gray);
  }
  .reach-header .section-sub strong {
    color: var(--ink);
    font-weight: 600;
  }

  /* Cardul (cream rounded) ocupă cea mai mare parte a paginii */
  .fabrici-stage-wrap {
    position: relative;
    margin: 60px auto 0;
    max-width: 1480px;
  }
  /* PRÉSENCE: cardul hărții este centrat și NU se mișcă niciodată.
     Reveal-ul lui e doar opacity (fade) — zero transform, în orice stare. */
  .fabrici-stage-wrap.reveal,
  .fabrici-stage-wrap.reveal.visible,
  .fabrici-stage-wrap,
  .fabrici-stage-wrap:hover {
    transform: none !important;
  }
  .fabrici-stage {
    /* Override produse-stage translateX(-30mm) — keep card centered, no shift */
    transform: none !important;
    padding: 56px 56px 48px;
    min-height: 70vh;
    display: flex;
    align-items: center;
  }
  .fabrici-stage:hover {
    transform: none !important;
  }
  .fabrici-watermark {
    /* Inherits produse-watermark base, but tighter font for shorter word */
    font-size: clamp(64px, 11vw, 180px);
  }

  /* 2-column layout INSIDE the card: text-left + map-right */
  .fabrici-content {
    display: grid;
    grid-template-columns: 0.85fr 1.3fr;
    gap: 48px;
    width: 100%;
    align-items: center;
  }
  .fabrici-text {
    max-width: 460px;
  }
  .fabrici-text .bubble-tag {
    display: inline-block;
    background: var(--red-soft);
    color: var(--red);
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 14px;
  }
  .fabrici-text h3 {
    font-family: var(--serif);
    font-size: clamp(28px, 2.8vw, 38px);
    font-weight: 500;
    color: var(--ink);
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin-bottom: 16px;
  }
  .fabrici-text h3 em {
    font-style: italic;
    color: var(--red);
    font-weight: 400;
  }
  .fabrici-text p {
    color: var(--gray);
    font-size: 15px;
    line-height: 1.65;
    margin-bottom: 14px;
  }
  .fabrici-text p strong {
    color: var(--ink);
    font-weight: 600;
  }
  .fabrici-text .fabrici-detail {
    font-size: 13.5px;
    color: var(--gray);
    margin-bottom: 22px;
  }

  /* Two-stat row beneath the CTA: 2 🏭 Usines · 9 🌍 Pays de présence */
  .fabrici-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
    font-size: 14px;
    color: var(--gray);
  }
  .fabrici-stat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .fabrici-stat strong {
    font-family: var(--serif);
    font-size: 22px;
    font-weight: 500;
    color: var(--ink);
    letter-spacing: -0.02em;
    line-height: 1;
  }
  .fabrici-stat-emoji {
    font-size: 18px;
    line-height: 1;
    display: inline-block;
  }

  .reach-map {
    position: relative;
    width: 100%;
  }
  .reach-svg {
    width: 100%;
    height: auto;
    max-height: 60vh;
    display: block;
    color: var(--ink);
  }

  @media (max-width: 968px) {
    .fabrici-stage { padding: 40px 24px; min-height: auto; }
    .fabrici-content {
      grid-template-columns: 1fr;
      gap: 32px;
    }
    .fabrici-text { max-width: 100%; }
  }

  /* STATIC map paths */
  .europe-countries path {
    fill: rgba(15, 15, 15, 0.06);
    stroke: rgba(15, 15, 15, 0.30);
    stroke-width: 1;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
  }
  .europe-countries path.eu-active {
    fill: rgba(200, 16, 46, 0.16);
    stroke: rgba(200, 16, 46, 0.65);
    stroke-width: 1.4;
  }
  .m-dot {
    fill: var(--ink);
    opacity: 0.85;
    pointer-events: none;
  }
  .m-label {
    fill: var(--ink);
    font-family: var(--sans);
    font-size: 18px;
    font-weight: 600;
    text-anchor: middle;
    letter-spacing: 0.02em;
    paint-order: stroke;
    stroke: var(--cream-light);
    stroke-width: 4;
  }
  .m-label--tiny {
    font-size: 11px;
    font-weight: 600;
  }
  .m-dot--solo {
    fill: var(--ink);
    opacity: 0.85;
    stroke: var(--cream-light);
    stroke-width: 2;
  }

  /* Factory markers */
  .f-dot {
    fill: var(--red);
    filter: drop-shadow(0 3px 6px rgba(200,16,46,0.45));
  }
  .f-pulse {
    /* Harta rămâne perfect nemișcată — fără pulse pe markerii de fabrică */
    display: none;
  }
  .f-pulse--delay { display: none; }
  @keyframes factoryPulse {
    0%   { transform: scale(0.3); opacity: 0.55; }
    80%  { opacity: 0; }
    100% { transform: scale(2.6); opacity: 0; }
  }
  .f-label {
    fill: var(--red);
    font-family: var(--sans);
    font-size: 22px;
    font-weight: 800;
    text-anchor: middle;
    letter-spacing: 0.10em;
    paint-order: stroke;
    stroke: var(--cream-light);
    stroke-width: 5;
  }
  .f-sub {
    fill: var(--gray);
    font-family: var(--sans);
    font-size: 14px;
    font-weight: 500;
    text-anchor: middle;
    letter-spacing: 0.04em;
    paint-order: stroke;
    stroke: var(--cream-light);
    stroke-width: 4;
  }

  /* Legend below map */
  .reach-legend {
    display: flex;
    justify-content: center;
    gap: 32px;
    margin-top: 14px;
    font-size: 12px;
    color: var(--gray);
    letter-spacing: 0.04em;
  }
  .legend-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
  }
  .legend-dot--factory { background: #fff; box-shadow: 0 0 0 2px #111; }
  .legend-dot--country { background: var(--red); opacity: 1; }

  @media (max-width: 968px) {
    .reach-section { padding: 24px 16px; }
    .m-label { font-size: 14px; }
    .f-label { font-size: 14px; }
    .f-sub { font-size: 11px; }
  }

  /* === PRODUSE — One product per scroll-snap page === */
  .product-page {
    padding: 60px 0 30px;
    position: relative;
  }
  /* Push content to the LEFT so the floating product sits on the right half */
  .product-page .container {
    margin: 0;
    max-width: 100%;
    padding-left: clamp(32px, 6vw, 96px);
    padding-right: clamp(32px, 44vw, 720px);
  }
  .produse-stage-wrap {
    position: relative;
  }
  .produse-stage {
    position: relative;
    background: var(--cream-light);
    border: 1px solid var(--border);
    border-radius: 32px;
    padding: 80px 80px 56px;
    overflow: visible;
    min-height: 360px;
    display: flex;
    align-items: center;
    transform: translateX(-30mm);
  }
  /* Watermark — half above the stage (outline on cream bg),
     half below (filled on cream-light bg).
     Spans full viewport width so longer words like ACOPERIȘ aren't clipped
     by the narrow container, while staying vertically anchored to the stage. */
  .produse-watermark {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    pointer-events: none;
    user-select: none;
    transform: translateY(-38%);
    height: 1em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--serif);
    font-size: clamp(80px, 13vw, 220px);
    font-weight: 500;
    letter-spacing: -0.06em;
    z-index: 2;
  }
  .produse-watermark .wm-half {
    position: absolute;
    inset: 0;
    width: 100%;
    display: block;
  }
  .produse-watermark .wm-top {
    color: transparent;
    -webkit-text-stroke: 1.6px rgba(15, 15, 15, 0.40);
    text-stroke: 1.4px rgba(15, 15, 15, 0.30);
    clip-path: inset(0 0 62% 0);
  }
  .produse-watermark .wm-bottom {
    color: var(--cream-dark);
    opacity: 0.65;
    clip-path: inset(38% 0 0 0);
  }

  .product-bubble {
    position: relative;
    background: white;
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 32px 36px 30px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.06);
    width: 100%;
    max-width: 540px;
  }
  .product-bubble h3 {
    font-family: var(--serif);
    font-size: 32px;
    font-weight: 500;
    color: var(--ink);
    letter-spacing: -0.02em;
    margin-bottom: 12px;
  }
  .product-bubble .bubble-tag {
    display: inline-block;
    background: var(--red-soft);
    color: var(--red);
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 14px;
  }
  .product-bubble p {
    color: var(--gray);
    font-size: 15px;
    line-height: 1.65;
    margin-bottom: 20px;
  }
  .product-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--red);
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    transition: gap 0.2s ease;
  }
  .product-cta:hover { gap: 14px; }
  .product-cta::after {
    content: '→';
    font-size: 16px;
    transition: transform 0.2s ease;
  }
  .product-cta:hover::after { transform: translateX(2px); }

  @media (max-width: 968px) {
    .product-page .container {
      padding-left: 24px;
      padding-right: 24px;
    }
    /* Override the -30mm left shift — center the card on narrow screens */
    .produse-stage { padding: 50px 24px 36px; transform: none !important; }
    .product-bubble { max-width: 100%; }
  }
  .product-visual {
    height: 260px;
    background: linear-gradient(180deg, #0a0a0a 0%, #1f1f1f 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
  }
  .product-visual::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(200,16,46,0.16) 0%, transparent 55%);
    top: -50%; left: -50%;
    pointer-events: none;
  }
  .product-image {
    width: 88%;
    height: 88%;
    object-fit: contain;
    position: relative;
    z-index: 1;
    transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    filter: drop-shadow(0 14px 30px rgba(0,0,0,0.5));
  }
  .product-card:hover .product-image {
    transform: scale(1.06) rotate(-1.5deg);
  }
  .product-content { padding: 32px; }
  .product-tag {
    display: inline-block;
    background: var(--red-soft);
    color: var(--red);
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 16px;
  }
  .product-name {
    font-family: var(--serif);
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin-bottom: 8px;
  }
  .product-desc {
    color: var(--gray);
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 24px;
  }
  .product-specs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
  }
  .spec-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .spec-label {
    font-size: 11px;
    color: var(--gray-light);
    text-transform: uppercase;
    letter-spacing: 0.05em;
  }
  .spec-value {
    font-family: var(--serif);
    font-size: 18px;
    color: var(--ink);
    font-weight: 500;
  }

  /* === DE CE — minimalist single-column premium layout === */
  .why-section { padding: 70px 0; justify-content: flex-start; }
  .why-section .container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    flex: 1;
    width: 100%;
    min-height: calc(100vh - 220px);
  }
  .why-page-top { width: 100%; }
  .why-section .section-eyebrow { margin-bottom: 14px; }
  .why-section .section-title {
    font-size: clamp(40px, 6vw, 80px);
    line-height: 1.02;
    letter-spacing: -0.04em;
    max-width: 100%;
    margin: 0 auto;
  }
  .why-section .section-title em {
    font-style: italic;
    color: var(--red);
    font-weight: 300;
  }
  /* Keywords strip — minimalist, serif, separated by red middots */
  .why-keywords {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 14px 22px;
    font-family: var(--serif);
    font-size: clamp(15px, 1.6vw, 22px);
    color: var(--ink-soft);
    font-weight: 400;
    letter-spacing: -0.01em;
    line-height: 1;
    width: 100%;
    margin-top: 0;
  }
  .why-keywords .kw {
    white-space: nowrap;
  }
  .why-keywords .kw em {
    color: var(--red);
    font-style: italic;
    font-weight: 400;
  }
  .why-keywords .kw-sep {
    color: var(--red);
    opacity: 0.6;
    font-size: 1.4em;
    line-height: 1;
    user-select: none;
  }
  /* Hide the legacy 6-card grid on this layout */
  .why-section .why-grid { display: none; }
  @media (max-width: 968px) {
    .why-keywords { font-size: 15px; gap: 10px 18px; }
  }
  .why-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 60px;
  }
  .why-card {
    padding: 36px 32px;
    border: 1px solid var(--border);
    border-radius: 20px;
    background: var(--cream-light);
    transition: all 0.3s ease;
  }
  .why-card:hover {
    border-color: var(--ink);
    transform: translateY(-4px);
  }
  .why-icon {
    width: 48px; height: 48px;
    background: var(--ink);
    color: var(--red);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    font-family: var(--serif);
    font-size: 22px;
    font-weight: 500;
  }
  .why-title {
    font-family: var(--serif);
    font-size: 22px;
    font-weight: 500;
    color: var(--ink);
    margin-bottom: 10px;
    letter-spacing: -0.02em;
  }
  .why-desc {
    color: var(--gray);
    font-size: 15px;
    line-height: 1.6;
  }

  /* === COMPARISON — 4 systems, materials + teams + time === */
  .comparison-section {
    padding: 24px 0;
    background: var(--cream);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    justify-content: flex-start;
  }
  .comparison-section .container {
    max-width: 1640px;
  }
  /* INSIDE the card: text on left + 3-column comparison on right */
  .compare-inner-grid {
    display: grid;
    grid-template-columns: minmax(260px, 340px) 1fr;
    gap: 36px;
    align-items: center;
  }
  .compare-side-text {
    text-align: left;
    padding-right: 8px;
  }
  .compare-side-text .section-eyebrow { margin-bottom: 8px; font-size: 12px; }
  .compare-side-text .section-title {
    font-size: clamp(26px, 2.4vw, 36px);
    margin-bottom: 14px;
    line-height: 1.05;
  }
  .compare-side-text .section-sub {
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--gray);
    margin-bottom: 10px;
  }
  .compare-side-text .section-sub strong {
    color: var(--ink);
    font-weight: 600;
  }
  .compare-side-text .compare-punch-inline {
    font-family: var(--serif);
    font-size: 16px;
    color: var(--ink);
    line-height: 1.35;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
  }
  .compare-side-text .compare-punch-inline strong {
    color: var(--red);
    font-weight: 500;
  }
  .compare-side-text .compare-mission {
    font-style: italic;
    color: var(--ink);
    font-size: 13px;
    margin-top: 6px;
  }
  @media (max-width: 1100px) {
    .compare-inner-grid { grid-template-columns: 1fr; gap: 24px; }
    .compare-side-text { text-align: center; max-width: 720px; margin: 0 auto; }
  }

  /* Card wrap — same pattern as Usines */
  .compare-stage-wrap {
    position: relative;
    margin: 60px 0 0;
    max-width: none;
  }
  .compare-stage {
    transform: none;
    padding: 36px 36px 28px;
    min-height: auto;
    display: block;
  }
  .compare-watermark {
    font-size: clamp(64px, 12vw, 200px);
  }

  /* Header inside the card */
  .compare-stage .compare-header {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 16px;
  }
  .compare-stage .section-eyebrow { margin-bottom: 4px; font-size: 11px; }
  .compare-stage .section-title { font-size: clamp(24px, 2.8vw, 36px); margin-bottom: 6px; line-height: 1.05; }
  .compare-stage .section-sub { font-size: 13.5px; margin: 0 auto; max-width: 640px; line-height: 1.5; }

  /* Punchline — the dramatic takeaway */
  .compare-punchline {
    margin-top: 18px;
    background: linear-gradient(135deg, #2A2520 0%, #393229 100%);
    color: var(--cream);
    border-radius: 18px;
    padding: 22px 32px;
    display: flex;
    align-items: center;
    gap: 32px;
    box-shadow: 0 14px 40px rgba(0,0,0,0.10);
  }
  .punchline-big {
    flex-shrink: 0;
    text-align: center;
    border-right: 1px solid rgba(255,255,255,0.15);
    padding-right: 32px;
  }
  .punchline-big strong {
    font-family: var(--serif);
    font-size: clamp(48px, 6vw, 84px);
    font-weight: 500;
    color: var(--red);
    line-height: 1;
    letter-spacing: -0.04em;
    display: block;
  }
  .punchline-big strong small {
    font-size: 0.5em;
    color: rgba(255,255,255,0.6);
    margin-left: 2px;
    font-weight: 400;
  }
  .punchline-big span {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--cream);
    opacity: 0.7;
    font-weight: 600;
  }
  .punchline-text { flex: 1; }
  .punchline-text h3 {
    font-family: var(--serif);
    font-size: clamp(20px, 2.2vw, 30px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--cream);
    margin-bottom: 6px;
  }
  .punchline-text h3 em {
    font-style: italic;
    color: var(--red);
    font-weight: 400;
  }
  .punchline-text p {
    font-size: 14px;
    color: var(--cream);
    opacity: 0.85;
    line-height: 1.5;
    margin-bottom: 4px;
  }
  .punchline-text .cc-foot {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    color: var(--cream);
    opacity: 0.55;
    letter-spacing: 0.02em;
  }
  @media (max-width: 768px) {
    .compare-punchline { flex-direction: column; gap: 16px; padding: 24px; text-align: center; }
    .punchline-big { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.15); padding-right: 0; padding-bottom: 16px; }
  }

  /* === COMPARISON: reference (left) vs 2 passive options (right) === */
  .compare-layout {
    display: grid;
    grid-template-columns: 1fr 2.1fr;
    gap: 24px;
    margin-top: 4px;
    align-items: stretch;
  }
  .ct-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
  }
  .ct-group > .ct-col { flex: 1; }
  .ct-group--passive {
    border-left: 1px dashed var(--border);
    padding-left: 24px;
  }
  .ct-group-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--gray);
    font-weight: 700;
    text-align: center;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--border);
  }
  .ct-group-label--passive {
    color: var(--red);
  }
  .ct-passive-cols {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    align-items: stretch;
  }
  .ct-col--ref {
    border-style: dashed;
    background: transparent;
  }
  @media (max-width: 968px) {
    .compare-layout {
      grid-template-columns: 1fr;
      gap: 16px;
    }
    .ct-group--passive {
      border-left: none;
      border-top: 1px dashed var(--border);
      padding-left: 0;
      padding-top: 16px;
    }
    .ct-passive-cols { grid-template-columns: 1fr; }
  }
  .ct-col {
    background: white;
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 14px 14px 12px;
    display: flex;
    flex-direction: column;
    position: relative;
  }
  .ct-col--winner {
    border-color: var(--red);
    box-shadow: 0 22px 50px rgba(200,16,46,0.10);
  }

  /* HEAD: badge + name + class */
  .ct-top {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--border);
  }
  .ct-badge {
    display: inline-block;
    background: var(--red);
    color: white;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 100px;
    margin-bottom: 6px;
  }
  .ct-badge--neutral {
    background: transparent;
    color: var(--gray);
    border: 1px solid var(--border);
  }
  .ct-badge--alt {
    background: rgba(0,0,0,0.06);
    color: var(--ink-soft);
  }
  .ct-name {
    font-family: var(--serif);
    font-size: 19px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--ink);
    margin: 2px 0 4px;
    line-height: 1.05;
  }
  .ct-class {
    font-size: 11px;
    color: var(--gray);
    letter-spacing: 0.02em;
  }
  .ct-class em {
    font-style: normal;
    color: var(--red);
    font-weight: 600;
  }
  .ct-class--bad em {
    color: var(--gray);
    text-decoration: line-through;
    text-decoration-color: rgba(150,150,150,0.5);
  }

  /* MATERIALS list — visual length is the message */
  .ct-mats {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
  }
  .mat {
    background: var(--cream-light);
    border: 1px solid var(--border);
    padding: 3px 9px;
    border-radius: 6px;
    font-size: 10.5px;
    font-weight: 500;
    text-align: center;
    color: var(--ink-soft);
    line-height: 1.25;
  }
  .mat--insul {
    background: var(--red-soft);
    border-color: rgba(200,16,46,0.20);
    color: var(--red-dark);
  }
  .mat--extra {
    background: rgba(200,16,46,0.10);
    border-color: rgba(200,16,46,0.30);
    color: var(--red-dark);
    font-weight: 600;
  }

  /* STATS row — compact metrics under materials */
  .ct-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    padding: 8px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    margin-bottom: 10px;
  }
  .ct-stat {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
    gap: 2px;
  }
  .ct-label {
    font-size: 8.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--gray);
    font-weight: 600;
  }
  .ct-stat strong {
    font-family: var(--serif);
    font-size: 16px;
    font-weight: 500;
    color: var(--ink);
    margin-top: 2px;
  }
  .ct-col--winner .ct-stat strong { color: var(--red); }
  .ct-sub {
    font-size: 8.5px;
    color: var(--gray);
    letter-spacing: 0.02em;
  }

  /* PRICE — the punchline of each card */
  .ct-price {
    margin-top: auto;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--cream-light);
    border: 1px solid var(--border);
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
  }
  .ct-price-label {
    font-size: 10px;
    color: var(--gray);
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-align: left;
    flex: 1;
  }
  .ct-price-value {
    font-family: var(--serif);
    font-size: 28px;
    font-weight: 500;
    line-height: 1;
    color: var(--ink);
    letter-spacing: -0.02em;
    white-space: nowrap;
  }
  .ct-price-value small {
    font-size: 0.55em;
    color: var(--gray);
    margin-left: 1px;
  }
  .ct-price--good .ct-price-value { color: #1a7d3a; }
  .ct-price--bad .ct-price-value { color: var(--red); }
  .ct-price-value--ref {
    color: var(--gray) !important;
    font-style: italic;
  }

  /* Final positioning statement */
  .compare-conclusion {
    margin: 14px auto 0;
    max-width: 920px;
    text-align: center;
    font-family: var(--serif);
    font-size: clamp(15px, 1.6vw, 21px);
    line-height: 1.35;
    letter-spacing: -0.01em;
    color: var(--ink);
  }
  .compare-conclusion em {
    font-style: italic;
    color: var(--red);
    font-weight: 500;
  }
  .cc-foot {
    display: block;
    margin-top: 6px;
    font-family: var(--sans);
    font-style: normal;
    font-size: 11px;
    color: var(--gray);
    letter-spacing: 0.02em;
  }

  /* === CTA SECTION === */
  .cta-section {
    position: relative;
    z-index: 11;   /* au-dessus de conf-wrap (z10) pour que la moitié haute du watermark CONTACT soit visible */
    padding: clamp(150px, 17vh, 220px) 0 60px;
    background: #0F0E0C;
  }
  .cta-info { list-style: none; margin: 0 0 26px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
  .cta-info li { display: flex; align-items: center; gap: 10px; font-size: 15px; color: rgba(255,255,255,0.82); }
  .cta-info .cti-ic { width: 20px; text-align: center; opacity: 0.9; }
  .cta-social { display: flex; gap: 12px; margin-top: 24px; }
  .cta-social a { width: 42px; height: 42px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.22); color: #fff; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
  .cta-social a:hover { background: var(--red); border-color: var(--red); transform: translateY(-2px); }
  .cta-social a[href=""] { display: none; }
  .cta-social svg { width: 18px; height: 18px; fill: currentColor; }
  .cta-watermark {
    position: absolute;
    top: 0; left: 50%; width: 100vw; margin-left: -50vw;
    transform: translateY(-38%);
    height: 1em; line-height: 1; text-align: center; text-transform: uppercase;
    font-family: var(--serif); font-size: clamp(72px, 13vw, 240px);
    font-weight: 500; letter-spacing: -0.06em; z-index: 1;
    pointer-events: none; user-select: none; white-space: nowrap;
  }
  .cta-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .cta-watermark .wm-top { color: transparent; -webkit-text-stroke: 1.5px rgba(15,15,15,0.25); clip-path: inset(0 0 62% 0); }
  .cta-watermark .wm-bottom { color: rgba(255,255,255,0.15); clip-path: inset(38% 0 0 0); }
  /* 2-column layout — CTA box LEFT, robot image RIGHT. Stacks on ≤968px. */
  .cta-section .container {
    margin: 0 auto;
    max-width: 1480px;
    padding: 0 clamp(32px, 5vw, 64px);
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 48px;
    align-items: center;
    position: relative;
    z-index: 2;
  }
  .cta-section .cta-box {
    max-width: 100%;
    padding: 60px 56px;
    text-align: left;
  }
  .cta-section .cta-box p { margin: 0 0 28px; }
  .cta-section .cta-actions { justify-content: flex-start; }
  .cta-section .cta-image-col {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .cta-section .cta-image-col .mobile-product {
    max-width: 520px;
    margin: 0;
  }
  @media (max-width: 968px) {
    .cta-section .container { grid-template-columns: 1fr; gap: 24px; padding: 0 32px; }
    .cta-section .cta-box { text-align: center; padding: 48px 36px; }
    .cta-section .cta-actions { justify-content: center; }
    .cta-section .cta-image-col .mobile-product { max-width: 340px; }
  }
  .cta-box {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(20px);
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.5);
    color: var(--cream);
    border-radius: 32px;
    padding: 80px 60px;
    text-align: center;
    position: relative;
    overflow: hidden;
  }
  .cta-box::before {
    content: '';
    position: absolute;
    top: -50%; left: -50%;
    width: 200%; height: 200%;
    background: radial-gradient(circle, rgba(200,16,46,0.25) 0%, transparent 60%);
    opacity: 0.65;
  }
  .cta-box-eyebrow {
    color: var(--red);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 600;
    margin-bottom: 24px;
    position: relative;
  }
  .cta-box h2 {
    font-family: var(--serif);
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 400;
    line-height: 1.05;
    letter-spacing: -0.03em;
    margin-bottom: 24px;
    position: relative;
  }
  .cta-box h2 em {
    font-style: italic;
    color: var(--red);
  }
  .cta-box p {
    font-size: 18px;
    color: var(--gray-light);
    max-width: 560px;
    margin: 0 auto 40px;
    position: relative;
  }
  .cta-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    position: relative;
  }
  .btn-on-dark {
    background: var(--cream);
    color: var(--ink);
  }
  .btn-on-dark:hover { background: white; transform: translateY(-1px); }
  .btn-on-dark-ghost {
    background: transparent;
    color: var(--cream);
    border: 1px solid rgba(255,255,255,0.2);
  }
  .btn-on-dark-ghost:hover { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.4); }

  /* === FOOTER === */
  footer {
    background: #0A0A09;
    padding: 50px 0 32px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.7);
  }
  /* Certifications strip — compact, sits above the footer grid */
  .footer-certs {
    padding-bottom: 28px;
    margin-bottom: 36px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    gap: 14px;
    align-items: center;
    text-align: center;
  }
  .footer-certs-label {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.4);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 500;
  }
  .footer-certs-items {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px 28px;
  }
  .footer-certs .trust-item {
    color: rgba(255, 255, 255, 0.65);
  }
  .footer-certs .trust-item:hover {
    color: #FFFFFF;
  }
  .footer-certs .trust-icon {
    background: rgba(255, 255, 255, 0.1);
    color: #FFFFFF;
  }
  .footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 60px;
    margin-bottom: 60px;
  }
  .footer-brand .logo { margin-bottom: 16px; }
  .footer-tagline {
    color: rgba(255, 255, 255, 0.5);
    font-size: 14px;
    line-height: 1.6;
    max-width: 280px;
  }
  .footer-col h4 {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #FFFFFF;
    margin-bottom: 18px;
    font-weight: 600;
  }
  .footer-col ul { list-style: none; }
  .footer-col li { margin-bottom: 10px; }
  .footer-col a {
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
  }
  .footer-col a:hover { color: var(--red); }
  .footer-bottom {
    padding-top: 32px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    justify-content: space-between;
    color: rgba(255, 255, 255, 0.4);
    font-size: 13px;
    flex-wrap: wrap;
    gap: 16px;
  }

  /* ===========================================================
     PREMIUM REVEALS — discret, elegant, o singură dată.
     Reguli de aur (învățate pe pielea noastră):
     - NICIODATĂ scale pe secțiuni (a cauzat "2 poziții" la hartă)
     - NICIODATĂ animații infinite (au cauzat pâlpâieli)
     - NICIODATĂ will-change permanent (layere GPU = flicker)
     - distanță mică (22px), easing luxos, reveal-once
     =========================================================== */
  .reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .reveal.visible {
    opacity: 1;
    transform: none;
  }

  /* Hero entrance — intrare eșalonată la încărcare (robot → titlu → CTA) */
  .hero .hero-robot.reveal  { transition-delay: 0s; }
  .hero h1.reveal           { transition-delay: 0.14s; }
  .hero .hero-actions.reveal{ transition-delay: 0.28s; }

  /* Stagger pe carduri în interiorul secțiunilor — DOAR opacity
     (fără transform pe copii → zero conflict cu hover-urile lor) */
  .stats-grid.reveal .stat-card,
  .pentru-stage-wrap.reveal .pentru-card,
  .sistem-stage-wrap.reveal .sistem-card,
  .montaj-stage-wrap.reveal .montaj-card,
  .proces-stage-wrap.reveal .proces-step {
    opacity: 0;
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .stats-grid.reveal.visible .stat-card,
  .pentru-stage-wrap.reveal.visible .pentru-card,
  .sistem-stage-wrap.reveal.visible .sistem-card,
  .montaj-stage-wrap.reveal.visible .montaj-card,
  .proces-stage-wrap.reveal.visible .proces-step {
    opacity: 1;
  }
  .stats-grid.reveal.visible .stat-card:nth-child(2),
  .pentru-stage-wrap.reveal.visible .pentru-card:nth-child(2),
  .sistem-stage-wrap.reveal.visible .sistem-card:nth-child(2),
  .montaj-stage-wrap.reveal.visible .montaj-card:nth-child(2),
  .proces-stage-wrap.reveal.visible .proces-step:nth-child(2) { transition-delay: 0.10s; }
  .stats-grid.reveal.visible .stat-card:nth-child(3),
  .pentru-stage-wrap.reveal.visible .pentru-card:nth-child(3),
  .sistem-stage-wrap.reveal.visible .sistem-card:nth-child(3),
  .montaj-stage-wrap.reveal.visible .montaj-card:nth-child(3),
  .proces-stage-wrap.reveal.visible .proces-step:nth-child(3) { transition-delay: 0.20s; }
  .stats-grid.reveal.visible .stat-card:nth-child(4),
  .pentru-stage-wrap.reveal.visible .pentru-card:nth-child(4),
  .montaj-stage-wrap.reveal.visible .montaj-card:nth-child(4),
  .proces-stage-wrap.reveal.visible .proces-step:nth-child(4) { transition-delay: 0.30s; }

  /* Cardurile cu reveal individual prin JS (stagger i*90ms) — doar fade */
  .steps-grid .step-card,
  .products-grid .product-card,
  .why-grid .why-card {
    opacity: 0;
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.35s ease, border-color 0.3s ease, background 0.3s ease;
  }
  .steps-grid .step-card.visible,
  .products-grid .product-card.visible,
  .why-grid .why-card.visible {
    opacity: 1;
  }

  /* Accesibilitate: utilizatorii care preferă fără mișcare primesc totul static */
  @media (prefers-reduced-motion: reduce) {
    .reveal, .reveal.visible,
    .stats-grid.reveal .stat-card,
    .pentru-stage-wrap.reveal .pentru-card,
    .sistem-stage-wrap.reveal .sistem-card,
    .montaj-stage-wrap.reveal .montaj-card,
    .proces-stage-wrap.reveal .proces-step,
    .steps-grid .step-card,
    .products-grid .product-card,
    .why-grid .why-card {
      transition: none !important;
      animation: none !important;
      transform: none !important;
      opacity: 1 !important;
    }
  }

  /* === FLOATING PRODUCT — persistent showcase that moves with scroll ===
     Fixed-positioned at viewport center; JS swaps the transform between
     section anchors (center → right → left → right …) so the same product
     stays on screen as the user scrolls through the page, like a beauty-jar
     site or an Apple product page. */
  .floating-product {
    position: fixed;
    top: 50%;
    left: 50%;
    width: clamp(220px, 28vw, 380px);
    z-index: 50;
    pointer-events: none;
    will-change: transform, opacity;
    transform: translate(-50%, -50%) perspective(1400px) rotateY(-10deg) rotateZ(-2deg) scale(1);
    /* JS now drives transform/opacity directly via per-frame lerp — no CSS transition */
    opacity: 1;
  }
  .product-img-stack {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
  }
  .floating-product .pi {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0;
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    filter: drop-shadow(0 40px 60px rgba(0, 0, 0, 0.28))
            drop-shadow(0 14px 24px rgba(0, 0, 0, 0.10));
  }
  .floating-product .pi.is-active { opacity: 1; }
  /* When the page hits CTA, swap in the construction-stage loop */
  .floating-product .pi-build { opacity: 0; }
  .floating-product.shows-build .pi:not(.pi-build) { opacity: 0; }
  .floating-product.shows-build .pi-build { opacity: 1; }
  /* Build-stage loop — 4 PNGs (product → 3 construction stages) crossfading every 4 s */
  .pi-build .build-stage {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0;
    /* match the same drop-shadow other floating images use */
    filter: drop-shadow(0 40px 60px rgba(0, 0, 0, 0.28))
            drop-shadow(0 14px 24px rgba(0, 0, 0, 0.10));
  }
  .pi-build .build-stage:nth-child(1) { animation-delay: 0s; }
  .pi-build .build-stage:nth-child(2) { animation-delay: 1s; }
  .pi-build .build-stage:nth-child(3) { animation-delay: 2s; }
  .pi-build .build-stage:nth-child(4) { animation-delay: 3s; }
  @keyframes stageLoop {
    0%   { opacity: 0; }
     6%  { opacity: 1; }   /* fade in over 0.24 s */
    20%  { opacity: 1; }   /* stays visible until 0.80 s */
    30%  { opacity: 0; }   /* faded out by 1.20 s */
    100% { opacity: 0; }
  }
  @keyframes productBob {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-12px); }
  }
  .floating-product.is-hidden {
    opacity: 0;
    pointer-events: none;
  }
  /* Inline product image — appears INSIDE each section, contextual to content.
     Scrolls naturally with the page. */
  .mobile-product {
    display: block;
    width: 100%;
    max-width: 420px;
    aspect-ratio: 1;
    margin: 32px auto 16px;
    object-fit: contain;
    filter: drop-shadow(0 22px 36px rgba(0,0,0,0.18));
  }
  @media (max-width: 768px) {
    .mobile-product { max-width: 340px; margin: 28px auto 8px; }
  }
  @media (max-width: 480px) {
    .mobile-product { max-width: 260px; margin: 20px auto 0; }
  }

  /* === RESPONSIVE === */
  @media (max-width: 968px) {
    .nav-links { display: none; }
    .stats-grid, .steps-grid, .products-grid, .why-grid, .footer-grid {
      grid-template-columns: 1fr 1fr;
    }
    .hero:not(.hero--photo) { padding: 120px 0 60px; }
    .hero-visual { height: clamp(360px, 65vh, 600px); }
    .stat-floating.s1 { top: 16px; left: 24px; }
    .stat-floating.s2 { bottom: 16px; right: 24px; }
    .stat-floating.s3 { top: 50%; right: 16px; }
    .compare-row { grid-template-columns: 1fr 1fr; }
    .compare-row > div:nth-child(3),
    .compare-row > div:nth-child(4) { display: none; }
    .cta-box { padding: 60px 24px; }
    .system-section { border-radius: 20px; }
  }
  @media (max-width: 640px) {
    .container { padding: 0 20px; }
    .stats-grid, .steps-grid, .products-grid, .why-grid, .footer-grid {
      grid-template-columns: 1fr;
    }
    .stat-floating { display: none; }
    .nav-cta .btn-ghost { display: none; }
  }

  /* === MOBILE TEXT SCALE-DOWN (~45%) ===
     Override per-element font sizes to fit content better on phones.
     Only applies to ≤768px — desktop unaffected. */
  @media (max-width: 768px) {
    .hero:not(.hero--photo) h1,
    .hero-full-content h1 { font-size: clamp(22px, 5.5vw, 34px); line-height: 1.08; }
    .hero-sub { font-size: 12.5px; line-height: 1.5; }
    .hero-eyebrow { font-size: 9.5px; }
    .hero-actions .btn { font-size: 12px; padding: 10px 16px; }

    .section-title { font-size: clamp(19px, 4.5vw, 28px); line-height: 1.1; }
    .section-eyebrow { font-size: 9px; letter-spacing: 0.12em; }
    .section-sub { font-size: 12px; line-height: 1.5; }

    .stat-num { font-size: 17px; }
    .stat-num span { font-size: inherit; }
    .stat-label { font-size: 10px; line-height: 1.4; }
    .stat-icon { width: 36px; height: 36px; margin-bottom: 10px; }

    .superpower-text strong { font-size: 11.5px; }
    .superpower-text span { font-size: 10px; }

    .passive-info h3 { font-size: 18px; line-height: 1.15; margin-bottom: 10px; }
    .passive-info p { font-size: 12px; line-height: 1.5; margin-bottom: 14px; }
    .passive-bullet { font-size: 11px; }
    .passive-tag { font-size: 9px; padding: 4px 8px; }

    .product-bubble h3, .produse-stage h3 { font-size: 18px; line-height: 1.15; }
    .product-bubble p, .produse-stage p { font-size: 11.5px; line-height: 1.55; }
    .bubble-tag { font-size: 9px; letter-spacing: 0.06em; }
    .product-cta { font-size: 11.5px; padding: 9px 16px; }

    .fabrici-text h3 { font-size: 18px; line-height: 1.15; }
    .fabrici-text p { font-size: 11.5px; line-height: 1.5; }
    .fabrici-stat { font-size: 10.5px; }
    .fabrici-stat strong { font-size: 14px; }

    .montaj-intro h2 { font-size: 18px; line-height: 1.15; }
    .montaj-intro p { font-size: 11.5px; line-height: 1.5; }
    .montaj-card h3 { font-size: 13px; }
    .montaj-card p { font-size: 10.5px; line-height: 1.45; }
    .montaj-cta p { font-size: 11.5px; line-height: 1.4; }
    .montaj-num { width: 22px; height: 22px; font-size: 10px; top: 8px; left: 8px; }

    .cta-box h2 { font-size: clamp(20px, 5vw, 30px); line-height: 1.1; }
    .cta-box p { font-size: 12px; line-height: 1.5; }
    .cta-box-eyebrow { font-size: 9px; }
    .cta-actions .btn { font-size: 12px; padding: 10px 16px; }

    .footer-certs-label { font-size: 9px; margin-bottom: 18px; }
    .footer-certs .trust-item { font-size: 9px; gap: 4px; opacity: 0.9; }
    .footer-certs .trust-icon { width: 18px; height: 18px; font-size: 7.5px; }
    .footer-certs-items { gap: 8px 12px; }

    h2 { font-size: 18px; line-height: 1.15; }
    h3 { font-size: 14px; }
    h4 { font-size: 13px; }
    p { font-size: 12px; line-height: 1.55; }
    .btn, .btn-large { font-size: 12px; padding: 10px 16px; }

    /* Watermark mai mic ca sa nu se rupa pe ecrane inguste */
    .produse-watermark, .fabrici-watermark, .compare-watermark, .montaj-watermark {
      font-size: clamp(56px, 16vw, 110px);
    }

    /* SVG harta Europei sa fie clar constranjat in viewport */
    .reach-map { max-width: 100%; overflow: hidden; }
    .reach-svg { width: 100%; max-height: 320px; }

    /* Inline mobile-product image — nu trebuie sa depaseasca latimea sectiunii */
    .mobile-product { max-width: 100%; }

    /* Reveal pe mobil: mai scurt și mai rapid (ține pasul cu scroll-ul) */
    .reveal {
      transform: translateY(14px);
      transition: opacity 0.55s ease-out, transform 0.55s ease-out;
    }
    .reveal.visible { transform: none; }
  }

  /* ===================================================
     COUNTRY SWITCHER — identic cu shared/css/site.css
     =================================================== */
  .country-switcher {
    position: relative;
    display: inline-block;
    margin-right: 8px;
  }
  .country-switcher-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: auto;
    min-height: 36px;
    background: transparent;
    border: none;
    color: #0F0F0F;
    padding: 0 8px;
    border-radius: 0;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity .15s ease, color .15s ease;
    font-family: inherit;
  }
  .country-switcher-trigger:hover {
    background: transparent;
    border: none;
    opacity: 0.72;
  }
  .country-switcher-trigger[aria-expanded="true"] {
    background: transparent;
    border: none;
    opacity: 1;
  }
  .country-switcher-flag { font-size: 16px; line-height: 1; }
  .country-switcher-code { letter-spacing: 0.04em; }
  .country-switcher-caret {
    transition: transform .2s ease;
    opacity: 0.7;
  }
  .country-switcher-trigger[aria-expanded="true"] .country-switcher-caret {
    transform: rotate(180deg);
  }
  .country-switcher-panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 204px;
    background: rgba(255, 255, 255, 0.20);
    -webkit-backdrop-filter: blur(24px) saturate(1.4);
    backdrop-filter: blur(24px) saturate(1.4);
    border: 1px solid rgba(255, 255, 255, 0.40);
    border-radius: 14px;
    padding: 8px;
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.28);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px) scale(0.97);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 1000;
  }
  .country-switcher-panel.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
  }
  .country-switcher-header {
    color: #6B6B6B;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
    padding: 8px 12px 6px;
  }
  .country-switcher-item {
    display: grid;
    grid-template-columns: 24px 1fr;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    text-decoration: none;
    color: #0F0F0F;
    font-size: 14px;
    transition: background .15s ease;
  }
  .country-switcher-item:hover {
    background: rgba(255, 255, 255, 0.45);
  }
  .country-switcher-item.active {
    background: rgba(200, 16, 46, 0.08);
    color: #C8102E;
  }
  .country-switcher-item.active .domain { color: rgba(200, 16, 46, 0.85); }
  .country-switcher-item .flag { font-size: 20px; line-height: 1; }
  .country-switcher-item .name { font-weight: 600; }
  .country-switcher-item .domain { display: none; }
  /* ===================================================
     COUNTRY BANNER — auto-detection suggestion
     =================================================== */
  .country-banner {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: linear-gradient(180deg, rgba(196,0,31,0.97) 0%, rgba(160,0,25,0.97) 100%);
    backdrop-filter: blur(10px);
    color: #fff;
    padding: 12px 24px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.25);
    transform: translateY(-100%);
    transition: transform .4s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .country-banner.show {
    transform: translateY(0);
  }
  .country-banner-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
  }
  .country-banner-flag { font-size: 28px; line-height: 1; flex-shrink: 0; }
  .country-banner-text { flex: 1; font-size: 14.5px; min-width: 240px; }
  .country-banner-text strong { font-weight: 700; }
  .country-banner-actions { display: flex; gap: 8px; flex-shrink: 0; }
  .country-banner-btn {
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background .15s ease, border-color .15s ease;
    font-family: inherit;
  }
  .country-banner-btn.primary {
    background: #fff;
    color: var(--red, #c4001f);
  }
  .country-banner-btn.primary:hover { background: rgba(255,255,255,0.92); }
  .country-banner-btn.ghost {
    background: transparent;
    color: #fff;
    border-color: rgba(255,255,255,0.4);
  }
  .country-banner-btn.ghost:hover { background: rgba(255,255,255,0.12); }

  /* Push the nav down when banner is visible */
  body.has-country-banner #nav { top: 60px; }
  body.has-country-banner { padding-top: 0; }

  /* Mobile */
  @media (max-width: 768px) {
    .country-switcher-trigger { padding: 6px 10px; font-size: 12px; }
    .country-switcher-code { display: none; }
    .country-switcher-panel { min-width: 260px; right: -8px; }
    .country-banner { padding: 10px 16px; }
    .country-banner-text { font-size: 13px; }
    .country-banner-actions { width: 100%; justify-content: flex-end; }
    body.has-country-banner #nav { top: 92px; }
  }

/* --- section --- */

/* ===========================================================
   PREMIUM POLISH — rafinament final, prioritate maximă.
   Mișcarea e permisă DOAR acolo unde e elegantă și sigură:
   - reveal-uri discrete (definite mai sus)
   - hover fin pe carduri mici (definit în CSS-ul de bază)
   Mai jos: garanții anti-regresie + finisaje vizuale.
   =========================================================== */

/* GARANȚIE 1: stage-urile mari nu au NICIO regulă de hover — transformul
   lor de bază (ex. produse-stage -30mm) rămâne identic în orice stare,
   deci nu pot "sări". Nu adăugăm reguli aici tocmai ca să nu creăm conflict. */

/* GARANȚIE 2: harta PRÉSENCE rămâne pixel-perfect nemișcată, mereu.
   (.produse-stage are translateX(-30mm) prin design pentru secțiunea
   produse — fabrici o anulează; aici blindăm tot lanțul hărții.) */
.reach-section .fabrici-stage,
.reach-section .fabrici-stage:hover,
.reach-section .fabrici-stage-wrap,
.reach-section .fabrici-stage-wrap:hover,
.reach-section .reach-map,
.reach-section .reach-svg {
  transform: none !important;
}
.reach-section .fabrici-stage-wrap {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* GARANȚIE 3: niciun layer GPU permanent (sursa pâlpâielilor de demult) */
section, .reveal, .stat-card, .pentru-card, .sistem-card,
.montaj-card, .step-card, .product-card, .why-card {
  will-change: auto;
}

/* FINISAJ: tranziții catifelate pe butoane și linkuri (culoare + umbră) */
.btn, .btn-primary, .btn-red, .btn-ghost, .btn-on-dark, .btn-on-dark-ghost, .product-cta {
  transition: background-color 0.3s ease, color 0.3s ease,
              border-color 0.3s ease, box-shadow 0.3s ease,
              transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}
.btn-red:hover, .btn-primary:hover {
  box-shadow: 0 10px 28px rgba(200, 16, 46, 0.22);
}

/* FINISAJ: cardurile mici răspund elegant — umbră stratificată la hover */
.pentru-card, .sistem-card, .montaj-card, .superpower,
.structural-card, .step-card, .why-card, .product-card, .stat-card {
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.35s ease, border-color 0.3s ease, background 0.3s ease;
}

/* FINISAJ: selecție de text în culoarea brandului */
::selection { background: rgba(200, 16, 46, 0.14); color: var(--ink); }

/* FINISAJ: navigația devine mai prezentă la scroll (umbră fină) */
nav.scrolled { box-shadow: 0 1px 0 var(--border), 0 8px 24px rgba(15, 15, 15, 0.05); }

/* --- section --- */

/* ZURU-style: poster instant, video fade-in when playing */
  .media-poster {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
  }
  .media-poster img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .morph-media { position: relative; }
  /* FIX stivuire: posterul .media-poster e absolut (z-index 0) și picta PESTE
     video-ul nepoziționat — video-ul rula perfect, dar ASCUNS SUB poster.
     Îi dăm videoului propriul strat (relative, z-index 1) + fade-in la
     evenimentul « playing » (posterul rămâne vizibil până pornesc cadrele). */
  .morph-media .morph-video { position: relative; z-index: 1; opacity: 0; transition: opacity 0.45s ease; }
  .morph-media .morph-video.is-playing { opacity: 1; }
  .presence-section { position: relative; }
  .presence-poster { z-index: 0; }
  /* Video visible via native poster; slight fade-in when frames play */
  .presence-bg.is-playing { opacity: 1; }
  /* cinq: mix-blend on video element — no opacity trap */

/* --- section --- */

.nav-menu { display: none !important; }       /* on cache le menu horizontal — tout passe dans le ☰ */
  .nav-burger { display: flex !important; }      /* ☰ visible sur toutes les tailles */
  .nav-cta > .btn-ghost { display: none; }       /* Contact -> dans le panneau */

  /* Panneau déroulant (style ZURU) — descend depuis le coin haut-droit */
  .nav-drawer {
    top: 72px; right: 16px; left: auto; bottom: auto;
    width: min(calc(209px + 4mm), calc(100vw - 24px));
    height: auto; max-height: calc(100vh - 96px);
    background: rgba(255, 255, 255, 0.97);
    -webkit-backdrop-filter: blur(24px) saturate(1.4);
    backdrop-filter: blur(24px) saturate(1.4);
    border: 1px solid rgba(255, 255, 255, 0.40); border-radius: 18px;
    box-shadow: 0 26px 64px rgba(15,14,12,0.28);
    transform: translateY(-10px) scale(0.98);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
    padding: 12px;
  }
  .nav-drawer.open { transform: translateY(0) scale(1); opacity: 1; visibility: visible; pointer-events: auto; }
  .nav-drawer-overlay { background: rgba(15,14,12,0.18); }
  .nav-drawer-close { display: none; } /* X redondant — le ☰ de la barre devient déjà un X */

  /* Accordéon : section -> sous-menu */
  .nav-drawer-group { margin: 0; padding: 0 0 0 0; border-bottom: 1px solid var(--border); }
  .nav-drawer-group:last-of-type { border-bottom: none; margin-bottom: 4px; }
  #navDrawer .nav-drawer-title {
    width: 100%; display: flex; align-items: center; justify-content: space-between;
    background: transparent; border: 0; cursor: pointer;
    font-family: var(--sans); font-size: 15px; font-weight: 700; color: #000000;
    letter-spacing: 0; text-transform: none; padding: 13px 12px; border-radius: 10px;
    margin-bottom: 0; transition: background .15s ease;
  }
  #navDrawer .nav-drawer-title:hover { background: rgba(255,255,255,0.45); }
  .nd-caret { font-size: 11px; opacity: .5; transition: transform .25s ease; }
  .nav-drawer-group.open .nd-caret { transform: rotate(180deg); }
  .nav-acc { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
  .nav-drawer-group.open .nav-acc { max-height: 440px; }
  .nav-acc a {
    display: block; padding: 9px 12px 9px 24px; font-size: 14px;
    color: #111111; text-decoration: none; border-radius: 8px;
  }
  .nav-acc a:hover { background: var(--cream); color: var(--ink); }
  .nav-acc a.partner-link { color: var(--red); font-weight: 600; }
  .nav-drawer-cta { margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--border); display: grid; gap: 8px; }

/* --- section --- */

/* === HERO PHOTO — fundal full-bleed cu case, crossfade lent === */
  .hero--photo {
    background: #14120F; /* sub imagini — niciodată crem între fade-uri */
  }
  .hero-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 0;
  }
  .hero-bg video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hero-bg-poster {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  .hero-bg-poster img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }
  .hero-bg video.hero-bg-video {
    z-index: 1;
    opacity: 0;
    transition: opacity 0.45s ease;
    background: #14120F;
  }
  .hero-bg video.hero-bg-video.is-playing {
    opacity: 1;
  }
  .hero-bg.is-video-playing .hero-bg-poster {
    opacity: 0;
    transition: opacity 0.45s ease;
  }
  /* Scrim — întunecat progresiv la scroll (JS: --hero-progress 0→1) */
  .hero-bg-scrim {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg,
      rgba(8, 7, 6, 0.38) 0%,
      rgba(8, 7, 6, 0.65) 45%,
      rgba(8, 7, 6, 0.92) 100%);
    opacity: var(--hero-progress, 0);
  }
  .hero--photo .container { position: relative; z-index: 2; }

  /* === ZURU-style scroll hero: video gol → scroll → mesaje + robot === */
  .hero-scroll-track {
    position: relative;
    /* Piste raccourcie : la bascule est instantanée, pas besoin d'un écran entier de scroll */
    height: 135vh;
    min-height: 135vh;
    height: 135dvh;
    min-height: 135dvh;
  }
  @media (max-width: 768px) {
    .hero-scroll-track {
      height: 180vh;
      min-height: 180vh;
      height: max(180dvh, calc(100dvh + 320px));
      min-height: max(180dvh, calc(100dvh + 320px));
    }
  }
  /* ZURU Tech hero type — Manrope 600, preset z2aqgr (măsurat de pe zuru.tech) */
  .hero-teaser.text-stilizat,
  .hero-teaser {
    position: absolute;
    bottom: 48px;
    left: 48px;
    z-index: 3;
    margin: 0;
    max-width: none;
    font-family: 'Manrope', 'Manrope Placeholder', sans-serif;
    font-size: 60px;
    font-weight: 600;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: -0.04em;
    /* Texte creux : intérieur transparent, seul le contour rouge (demande client) */
    color: transparent;
    -webkit-text-stroke: 2.5px var(--red);
    text-stroke: 2.5px var(--red);
    text-align: left;
    text-shadow: none;
    opacity: calc(1 - min(var(--hero-progress, 0) * 2.2, 1));
    transform: translateY(calc(var(--hero-progress, 0) * -18px));
    transition: opacity 0.35s ease, transform 0.35s ease;
    pointer-events: none;
  }
  .hero-teaser-line {
    display: block;
    white-space: nowrap;
  }
  @media (min-width: 810px) and (max-width: 1199px) {
    .hero-teaser.text-stilizat,
    .hero-teaser {
      font-size: 48px;
      letter-spacing: -0.04em;
    }
  }
  @media (max-width: 809px) {
    .hero-teaser.text-stilizat,
    .hero-teaser {
      font-size: 40px;
      letter-spacing: -0.03em;
      bottom: 26px;
      left: 26px;
      max-width: none;
    }
  }
  .hero-scroll-cue {
    position: absolute;
    right: clamp(20px, 4vw, 48px);
    bottom: 28px;
    z-index: 3;
    width: 22px;
    height: 34px;
    border: 2px solid rgba(255, 255, 255, 0.62);
    border-radius: 11px;
    opacity: calc(1 - min(var(--hero-progress, 0) * 3, 1));
    pointer-events: none;
  }
  .hero-scroll-cue::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 7px;
    width: 3px;
    height: 7px;
    margin-left: -1.5px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.88);
    animation: scrollCueBob 1.85s ease-in-out infinite;
  }
  @keyframes scrollCueBob {
    0%, 100% { transform: translateY(0); opacity: 0.55; }
    50% { transform: translateY(7px); opacity: 1; }
  }
  .hero-full-content {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: clamp(72px, 11vh, 108px) clamp(16px, 4vw, 32px) clamp(28px, 5vh, 48px);
    opacity: 1;
    visibility: hidden;
    transform: translateY(36px);
    pointer-events: none;
    will-change: transform;
  }
  .hero-full-content .container {
    width: 100%;
    max-width: 100%;
    padding: 0 clamp(16px, 4vw, 32px);
    padding-bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .hero-full-content .hero-text-col {
    width: 100%;
    max-width: min(92vw, 820px);
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .hero-full-content picture,
  .hero-full-content .hero-robot-wrap {
    display: block;
    margin: 0 auto 18px;
  }
  .hero-full-content h1 {
    width: 100%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .hero-full-content .hero-sub {
    width: 100%;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }
  .hero-full-content .hero-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 0;
  }
  .hero-full-content .hero-actions,
  .hero-full-content a { pointer-events: auto; }
  .hero.hero--photo:not(.hero-expanded) .hero-full-content {
    visibility: hidden;
    pointer-events: none;
  }
  .hero-full-content .hero-eyebrow { display: none !important; }
  .hero.hero--photo.hero-expanded .hero-teaser,
  .hero.hero--photo.hero-expanded .hero-scroll-cue {
    opacity: 0 !important;
    visibility: hidden;
  }
  @media (prefers-reduced-motion: reduce) {
    .hero-scroll-track { height: auto; }
    .hero-scroll-cue { display: none; }
    .hero-teaser { display: none; }
    .hero-full-content {
      position: relative;
      opacity: 1 !important;
      transform: none !important;
      pointer-events: auto;
    }
    .hero-bg-scrim { opacity: 0.82 !important; }
  }

  /* Fascicul de "fum negru" sub meniu — gradient discret doar în partea
     de sus a hero-ului, pentru lizibilitatea textului alb din nav.
     Se citește ca o vinietă naturală, nu ca un filtru. */
  .hero--photo::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: clamp(120px, 18vh, 190px);
    background: linear-gradient(180deg,
      rgba(8, 7, 6, 0.52) 0%,
      rgba(8, 7, 6, 0.30) 45%,
      rgba(8, 7, 6, 0.10) 78%,
      rgba(8, 7, 6, 0) 100%);
    z-index: 1;
    pointer-events: none;
  }

  /* Fum negru JOS — sub titlu + butoane, ca textul alb să iasă în evidență
     pe fotografia luminoasă a fabricii. Vinietă naturală care urcă din jos. */
  .hero--photo::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: clamp(360px, 58vh, 640px);
    background: linear-gradient(0deg,
      rgba(8, 7, 6, 0.84) 0%,
      rgba(8, 7, 6, 0.62) 30%,
      rgba(8, 7, 6, 0.38) 58%,
      rgba(8, 7, 6, 0.18) 82%,
      rgba(8, 7, 6, 0) 100%);
    z-index: 1;
    pointer-events: none;
    opacity: var(--hero-progress, 0);
  }

  /* Sticky full-viewport — scroll-ul din .hero-scroll-track animează conținutul */
  section.hero.hero--photo {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh;
    height: 100dvh;
    min-height: 100dvh;
    max-height: 100dvh;
    justify-content: flex-end;
    padding: 0;
    --hero-progress: 0;
    overflow: hidden;
  }
  .hero--photo .container {
    display: block;
    width: 100%;
    padding-bottom: calc(64px + 20mm);
  }
  .hero--photo .container > .hero-text-col {
    max-width: min(74%, 900px);
  }
  .hero-full-content h1 {
    color: #FFFFFF;
    /* titlu pe 3 rânduri: 2 albe + 1 roșu jos (ca secțiunea morph) */
    font-size: clamp(40px, 5vw, 72px);
    max-width: 1120px;
    margin-bottom: 26px;
    text-shadow: 0 2px 36px rgba(0, 0, 0, 0.55), 0 1px 6px rgba(0, 0, 0, 0.40);
  }
  .hero-full-content h1 em { color: #FFD9DE; } /* italic alb-rozat cald — accent subtil */
  /* Rândul 2 decalat — "Un système." începe sub "maison" */
  .hero-full-content h1 .h1-l2 {
    display: block;
    color: var(--red);
    font-style: italic;
  }
  .hero-full-content h1 .h1-l3 {
    display: inline-block;
    padding-left: 3.56em; /* a doua treaptă a cascadei */
  }
  .hero--photo .hero-actions { margin-bottom: 0; }
  .hero--photo .btn-ghost {
    color: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.55);
    background: rgba(255, 255, 255, 0.08);
  }
  .hero--photo .btn-ghost:hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: #FFFFFF;
  }
  .hero-full-content .hero-robot-wrap {
    max-width: clamp(180px, 22vw, 280px);
  }
  .hero-full-content .hero-robot {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
    filter: drop-shadow(0 24px 44px rgba(0, 0, 0, 0.45));
  }
  /* Reduced motion / fallback: doar prima imagine, fixă */
  /* Reduced motion: JS oprește videoul; posterul rămâne. */
  /* Eyebrow pe fundal foto — pastila translucidă, lizibilă peste video */
  .hero--photo .hero-eyebrow {
    color: rgba(255,255,255,0.95);
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.30);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    text-shadow: 0 1px 8px rgba(0,0,0,0.45);
    margin-bottom: 18px;
  }
  .hero--photo .hero-eyebrow::before { background: var(--red); }
  /* Subtitlu — explică „5 corps de métier en 1" */
  .hero--photo .hero-sub {
    color: rgba(255,255,255,0.95);
    max-width: 640px;
    font-size: clamp(14px, 1.25vw, 17px);
    line-height: 1.62;
    margin: 0 0 22px;
    text-shadow: 0 1px 14px rgba(0,0,0,0.55);
  }
  /* Rândul cu cele 3 cifre-cap */
  .hero-stats-row {
    list-style: none; margin: 0 0 28px; padding: 0;
    display: flex; flex-wrap: wrap; gap: 12px 30px; align-items: baseline;
  }
  .hero-stats-row li {
    color: rgba(255,255,255,0.92);
    font-size: clamp(13px, 1.05vw, 15px);
    letter-spacing: .01em;
    text-shadow: 0 1px 10px rgba(0,0,0,0.5);
    position: relative; padding-left: 18px;
  }
  .hero-stats-row li::before {
    content: ''; position: absolute; left: 0; top: 0.5em;
    width: 6px; height: 6px; border-radius: 50%; background: var(--red);
  }
  .hero-stats-row li strong { color: #fff; font-weight: 800; font-size: 1.2em; margin-right: 5px; }
  @media (max-width: 968px) {
    .hero-full-content { padding-top: 68px; }
    .hero--photo .container { padding-bottom: 0; }
    .hero--photo .container > .hero-text-col { max-width: 100%; transform: none; }
    .hero-full-content h1 { font-size: clamp(22px, 6.8vw, 30px); }
    .hero--photo .hero-robot { max-width: clamp(120px, 34vw, 168px); margin-bottom: 12px; }
    .hero--photo .hero-sub { font-size: 13px; line-height: 1.5; margin-bottom: 14px; }
    .hero-stats-row { gap: 6px 18px; margin-bottom: 18px; }
    .hero-stats-row li { font-size: 12px; }
  }

/* --- section --- */

.morph-section {
    position: relative;
    background: #F7F4ED; /* exact culoarea de fundal a videoului — secțiune fără margini vizibile */
    overflow: hidden;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding-top: 20mm; /* +20mm înălțime */
  }
  .morph-media {
    position: relative;
    max-width: 1760px;
    margin: 0 auto;
  }
  .morph-video {
    display: block;
    width: 100%;
    height: auto;
  }
  /* SCRIM — gradient crem peste partea de sus a videoului: textul suprapus
     rămâne lizibil chiar și când clădirea crește în zona lui. Aceeași
     culoare ca fundalul (#F7F4ED) → tranziția e invizibilă, clădirea pare
     că se retrage în lumină. */
  .morph-media::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 48%;
    background: linear-gradient(180deg,
      rgba(247, 244, 237, 0.97) 0%,
      rgba(247, 244, 237, 0.88) 34%,
      rgba(247, 244, 237, 0.45) 68%,
      rgba(247, 244, 237, 0) 100%);
    pointer-events: none;
    z-index: 1;
  }
  /* Aceeași gramatică ca hero/carusel: text JOS-STÂNGA, registrul deschis
     (ink pe cremul studioului), overline cu litere spațiate */
  /* Watermark "UN SEUL SYSTÈME" tăiat pe muchia hero→morph (inversul POUR) */
  .morph-watermark {
    position: absolute;
    top: 0; left: 0; right: 0;
    transform: translateY(-38%);
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--serif);
    font-size: clamp(64px, 11vw, 180px); /* identic cu POUR */
    font-weight: 500;
    letter-spacing: -0.06em;          /* identic cu POUR */
    word-spacing: 0.16em;
    z-index: 4;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
  }
  .morph-watermark .mw-line1 { position: relative; height: 1em; }
  .morph-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .morph-watermark .wm-top {
    color: transparent;
    -webkit-text-stroke: 1.6px rgba(255, 255, 255, 0.6);
    paint-order: stroke fill;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.35);
    clip-path: inset(0 0 62% 0);
  }
  .morph-watermark .wm-bottom {
    color: #463d30; /* warm dark — peste cremul secțiunii morph */
    -webkit-text-stroke: 0;
    clip-path: inset(38% 0 0 0);
  }
  .morph-watermark .mw-line2 {
    color: var(--red);
    -webkit-text-stroke: 0;
    line-height: 1;
    margin-top: calc(-0.55em - 2mm); /* urcat — trece puțin peste literele UN SEUL (+2mm la cerere) */
    position: relative;
    z-index: 1;
    font-size: 0.42em;
    letter-spacing: 0.30em;
    text-indent: 0.30em; /* compensează spațierea de după ultima literă (centrare) */
  }
  @media (max-width: 640px) {
    .morph-watermark { font-size: clamp(56px, 16vw, 110px); } /* identic cu POUR mobil */
  }
  .morph-overlay {
    position: absolute;
    left: 0;
    bottom: calc(6vw + clamp(150px, 19vh, 185px)); /* 150-185px de la marginea VIZIBILĂ a imaginii (fâșia suprapusă de carusel = 6vw) — identic cu caruselul */
    z-index: 2;
    text-align: left;
    padding: 0 clamp(32px, 5vw, 64px); /* identic cu .persona-content */
    max-width: min(96vw, 1280px);
    pointer-events: none; /* doar butonul primește click */
  }
  .morph-overlay .morph-eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink-soft);
    margin-bottom: 14px;
  }
  .morph-overlay h2 {
    font-family: var(--serif);
    font-size: clamp(30px, 4vw, 58px); /* identic cu titlul caruselului */
    font-weight: 500;
    color: var(--ink);
    letter-spacing: -0.02em;
    line-height: 1.12;
    margin: 0 0 24px;
    max-width: none;
    white-space: nowrap;
  }
  .morph-overlay h2 em {
    font-style: italic;
    color: var(--red);
    font-weight: 400;
  }
  .morph-overlay .morph-sub {
    font-size: clamp(15px, 1.25vw, 18px);
    line-height: 1.55;
    color: var(--ink-soft);
    max-width: 600px;
    margin: 0 0 20px;
  }
  .morph-overlay .morph-metric {
    font-size: clamp(14px, 1.4vw, 17px);
    font-weight: 600;
    color: var(--ink-soft);
    margin: 0 0 24px;
  }
  .morph-overlay .morph-metric .sep { margin: 0 10px; opacity: 0.45; font-weight: 400; }
  .morph-overlay .morph-cta {
    pointer-events: auto;
  }
  @media (max-width: 1080px) {
    /* Full-bleed ca pe desktop: video cover pe tot, text ink suprapus jos pe scrim crem */
    .morph-section { min-height: calc(86svh + 30mm); padding-top: 0; }
    .morph-media { position: absolute; inset: 0; max-width: none; height: 100%; margin: 0; }
    .morph-video { width: 100%; height: 100%; object-fit: cover; }
    .morph-media::after { top: auto; bottom: 0; height: 60%;
      background: linear-gradient(0deg, rgba(247,244,237,0.95) 0%, rgba(247,244,237,0.62) 42%, rgba(247,244,237,0) 100%); }
    .morph-overlay { position: absolute; left: 0; right: 0; bottom: 0; max-width: 100%; padding: 0 22px 80px; }
    .morph-overlay h2 { font-size: clamp(30px, 8.5vw, 44px); white-space: normal; }
  }

/* --- section --- */

.differences-wrap {
    position: relative;
    z-index: 3;
    margin-top: clamp(-130px, -6vw, -40px);
  }
  .differences-watermark {
    position: absolute;
    top: 0; left: 0; right: 0;
    transform: translateY(-38%);
    height: 1em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--serif);
    font-size: clamp(64px, 11vw, 180px);
    font-weight: 500;
    letter-spacing: -0.06em;
    z-index: 4;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
  }
  .differences-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .differences-watermark .wm-top {
    color: transparent;
    -webkit-text-stroke: 1.4px rgba(90, 80, 66, 0.62);
    clip-path: inset(0 0 62% 0);
  }
  .differences-watermark .wm-bottom {
    color: #FFFFFF;
    text-shadow: 0 3px 34px rgba(0, 0, 0, 0.55), 0 1px 8px rgba(0, 0, 0, 0.40);
    clip-path: inset(38% 0 0 0);
  }
  @media (max-width: 640px) {
    .differences-watermark { font-size: clamp(56px, 16vw, 110px); }
  }

  .differences-section {
    position: relative;
    background:
      linear-gradient(rgba(13, 12, 10, 0.55), rgba(13, 12, 10, 0.65)),
      url('../../images/presence/presence-factory.jpg') center/cover no-repeat;
    color: #FFFFFF;
    padding: clamp(100px, 12vh, 150px) clamp(24px, 5vw, 64px) clamp(100px, 12vh, 150px);
    overflow: hidden;
  }
  /* diagrame „explodate" — spații între straturi */
  .differences-section .wall-diagram-container { background: transparent; border: 0; box-shadow: none; }
  .differences-section .wall-diagram-grid { gap: 5px; }
  .differences-section .wall-layer { border-radius: 6px; }
  /* listă produse + rezumat echipe */
  .diff-products { list-style: none; margin: 24px 0 20px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
  .differences-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, 
      rgba(15, 14, 12, 0.75) 0%, 
      rgba(15, 14, 12, 0.45) 40%, 
      rgba(15, 14, 12, 0.75) 100%);
    z-index: 1;
    pointer-events: none;
  }
  .differences-container {
    position: relative;
    z-index: 2;
    max-width: 1480px;
    margin: 0 auto;
  }
  .differences-header {
    text-align: center;
    margin-bottom: clamp(40px, 6vh, 80px);
  }
  .differences-eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #FF1A3B;
    margin-bottom: 14px;
  }
  .differences-header h2 {
    font-family: var(--serif);
    font-size: clamp(30px, 4vw, 58px);
    font-weight: 500;
    line-height: 1.1;
    margin: 0 0 24px;
    letter-spacing: -0.02em;
  }
  .differences-header h2 em {
    font-style: italic;
    color: #FFFFFF;
    font-weight: 400;
  }
  .differences-sub {
    font-size: clamp(15px, 1.25vw, 18px);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.75);
    max-width: 800px;
    margin: 0 auto;
  }

  .comparison-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(24px, 4vw, 64px);
    align-items: start;
  }
  .comparison-card {
    background: rgba(15, 14, 12, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: clamp(24px, 3.5vw, 48px);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
  }
  .comparison-card:hover {
    transform: translateY(-4px);
  }
  .comparison-card.card-polistibrick:hover {
    border-color: rgba(200, 16, 46, 0.45);
    box-shadow: 0 20px 48px rgba(200, 16, 46, 0.15);
  }
  .comparison-card.card-classic:hover {
    border-color: rgba(255, 255, 255, 0.15);
    box-shadow: 0 20px 48px rgba(255, 255, 255, 0.04);
  }

  .comparison-card h3 {
    font-family: var(--serif);
    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 500;
    margin: 0 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }
  .card-stats {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .card-stats .sep {
    opacity: 0.3;
  }
  .card-badge {
    font-family: var(--font-sans);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 4px;
  }
  .card-polistibrick .card-badge {
    background: var(--red);
    color: #FFFFFF;
  }
  .card-classic .card-badge {
    background: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.85);
  }

  /* Exploded Wall Diagram */
  .wall-exploded-view {
    position: relative;
    height: 220px;
    margin: 32px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
  }
  .wall-layer {
    position: relative;
    height: 90%;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(0,0,0,0.5);
  }
  .wall-layer:hover {
    height: 100%;
    filter: brightness(1.25);
  }

  /* Polistibrick Exploded Layers (5 layers) */
  .wl-pb {
    width: 17%;
    border: 1px solid rgba(255, 255, 255, 0.08);
  }
  /* Outer formwork 8mm */
  .wl-pb-ext {
    background: linear-gradient(135deg, #44403c, #1c1917);
  }
  /* Steel armature 1 */
  .wl-pb-steel1 {
    background: repeating-linear-gradient(45deg, #1c1917, #1c1917 6px, #ef4444 6px, #ef4444 8px, #1c1917 8px, #1c1917 14px);
    border-color: rgba(239, 68, 68, 0.3);
  }
  /* Concrete core */
  .wl-pb-concrete {
    background: linear-gradient(135deg, #6b7280, #374151);
  }
  /* Steel armature 2 */
  .wl-pb-steel2 {
    background: repeating-linear-gradient(45deg, #1c1917, #1c1917 6px, #ef4444 6px, #ef4444 8px, #1c1917 8px, #1c1917 14px);
    border-color: rgba(239, 68, 68, 0.3);
  }
  /* Inner formwork 12mm */
  .wl-pb-int {
    background: linear-gradient(135deg, #292524, #57534e);
  }

  /* Classic Exploded Layers (6 layers) */
  .wl-cl {
    width: 14%;
    border: 1px solid rgba(255, 255, 255, 0.05);
  }
  /* Plâtre */
  .wl-cl-interior {
    background: linear-gradient(135deg, #d1d5db, #9ca3af);
  }
  /* Parpaing */
  .wl-cl-brick {
    background: linear-gradient(135deg, #4b5563, #1f2937);
  }
  /* Mortier colle */
  .wl-cl-mortar {
    background: linear-gradient(135deg, #4b5563, #374151);
  }
  /* Isolant classique */
  .wl-cl-insul {
    background: linear-gradient(135deg, #fef08a, #ca8a04);
  }
  /* Dowels (chevilles) */
  .wl-cl-dowel {
    background: repeating-linear-gradient(90deg, #9ca3af, #9ca3af 4px, #4b5563 4px, #4b5563 8px);
  }
  /* Crépi finition */
  .wl-cl-finish {
    background: linear-gradient(135deg, #f3f4f6, #d1d5db);
  }

  .layer-vertical-text {
    color: #FFFFFF;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
    opacity: 0.8;
    user-select: none;
  }
  .wall-layer:hover .layer-vertical-text {
    opacity: 1;
    scale: 1.05;
  }

  /* Active states for exploded view compilation */
  .wall-layer.active {
    filter: brightness(1.3) !important;
    box-shadow: 0 0 32px rgba(255,255,255,0.3) !important;
    border-color: rgba(255, 255, 255, 0.3);
  }
  .wall-layer.active-pb {
    border-color: rgba(200, 16, 46, 0.6) !important;
    box-shadow: 0 0 32px rgba(200, 16, 46, 0.4) !important;
  }

  .legend-items {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .legend-title-group {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.4);
    margin-top: 10px;
    margin-bottom: 2px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    padding-bottom: 6px;
  }
  .legend-item {
    display: flex;
    gap: 16px;
    padding: 14px;
    border-radius: 10px;
    background: rgba(255,255,255,0.01);
    border: 1px solid transparent;
    transition: all 0.3s ease;
    cursor: pointer;
  }
  .legend-item:hover {
    background: rgba(255,255,255,0.03);
    border-color: rgba(255,255,255,0.06);
  }
  .card-polistibrick .legend-item:hover {
    border-color: rgba(200, 16, 46, 0.25);
    background: rgba(200, 16, 46, 0.02);
  }
  .card-classic .legend-item:hover {
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.02);
  }

  .legend-badge {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    color: #FFFFFF;
    flex-shrink: 0;
  }
  .card-polistibrick .legend-item:hover .legend-badge {
    background: var(--red);
  }
  .card-classic .legend-item:hover .legend-badge {
    background: rgba(255, 255, 255, 0.3);
  }

  .legend-desc h4 {
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 4px;
    color: #FFFFFF;
    transition: color 0.3s ease;
  }
  .legend-desc p {
    font-size: 13px;
    line-height: 1.4;
    color: rgba(255,255,255,0.55);
    margin: 0;
  }
  .legend-item:hover .legend-desc h4 {
    color: #FFFFFF;
  }
  .card-polistibrick .legend-item:hover .legend-desc h4 {
    color: #FFD9DE;
  }

  .legend-item.active {
    background: rgba(255,255,255,0.04) !important;
    border-color: rgba(255,255,255,0.1) !important;
  }
  .card-polistibrick .legend-item.active {
    background: rgba(200, 16, 46, 0.04) !important;
    border-color: rgba(200, 16, 46, 0.3) !important;
  }
  .card-polistibrick .legend-item.active .legend-badge {
    background: var(--red);
  }

  @media (max-width: 1024px) {
    .comparison-grid {
      grid-template-columns: 1fr;
      gap: 40px;
    }
  }

/* --- section --- */

/* Slider Widget Container */
    .slider-widget {
      position: relative;
      margin: 0 auto;
      max-width: 1480px;
      border-radius: 24px;
      overflow: hidden;
      box-shadow: 0 30px 80px rgba(0,0,0,0.45);
      border: 1px solid rgba(255,255,255,0.1);
      background: #000;
    }

    /* Slider Wrapper holding both states */
    .slider-wrapper {
      position: relative;
      width: 100%;
      height: calc(clamp(400px, 60vh, 650px) + 40mm);
      --value: 50%;
      user-select: none;
    }

    /* === MOBILE : section compacte + slider pleine largeur (bord à bord) === */
    @media (max-width: 768px) {
      .differences-section { padding: 44px 0 52px; }   /* moins d'espace haut/bas */
      .differences-container { max-width: 100%; }
      .differences-header { margin-bottom: 20px; padding: 0 20px; }  /* texte rouge près du slider */
      .slider-widget { max-width: 100%; border-radius: 0; box-shadow: none; }  /* pleine largeur écran */
    }

    /* Shared style for background panes */
    .slider-pane {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
    }
    .pane-img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      background-size: cover;
      background-position: center;
    }

    /* Overlay wrapping elements inside panes */
    .pane-overlay {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 5;
    }

    /* Clipping for the two states */
    .pane-polistibrick {
      z-index: 10;
      clip-path: inset(0 calc(100% - var(--value)) 0 0);
      -webkit-clip-path: inset(0 calc(100% - var(--value)) 0 0);
    }
    .pane-classic {
      z-index: 8;
      clip-path: inset(0 0 0 var(--value));
      -webkit-clip-path: inset(0 0 0 var(--value));
    }

    /* Unified Info Cards */
    .info-card {
      position: absolute;
      bottom: clamp(8px, 3vw, 28px);
      background: transparent;
      border: 1.5px solid #FFFFFF;
      border-radius: 20px;
      padding: 1mm;
      width: clamp(280px, 28vw, 410px);
      max-width: 90%;
      box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
      color: #fff;
      z-index: 20;
      transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
      display: flex;
      flex-direction: column;
    }
    .info-card-inner {
      background: rgba(0, 0, 0, 0.30);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      border-radius: 16px;
      padding: clamp(16px, 2.5vw, 24px);
      text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
      display: flex;
      flex-direction: column;
      flex: 1;
      height: 100%;
    }
    .info-pb {
      left: clamp(12px, 2vw, 20px);
    }
    .info-cl {
      right: clamp(12px, 2vw, 20px);
    }
    .info-card:hover {
      border-color: #FFFFFF;
      transform: translateY(-4px);
      box-shadow: 0 40px 100px rgba(255, 255, 255, 0.12);
    }
    .info-card h4 {
      font-family: var(--serif);
      font-size: clamp(17px, 2vw, 22px);
      font-weight: 500;
      margin: 0;
    }
    .info-pb h4 {
      color: #FFFFFF;
    }
    .info-cl h4 {
      color: #FFFFFF;
    }
    .card-header-pb, .card-header-cl {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 14px;
    }
    .card-icon {
      font-size: 20px;
    }
    .card-team, .card-materials {
      font-size: clamp(12px, 1.4vw, 13.5px);
      line-height: 1.5;
      margin: 0 0 8px;
      color: #FFFFFF;
    }
    .card-materials {
      margin-bottom: 0;
      color: #FFFFFF;
    }
    .card-materials strong {
      color: #FFFFFF;
    }

    /* Slider drag bar handle */
    .slider-handle {
      position: absolute;
      top: 0;
      bottom: 0;
      left: var(--value);
      width: 4px;
      background: #FFFFFF;
      z-index: 25;
      transform: translateX(-50%);
      cursor: ew-resize;
      box-shadow: 0 0 15px rgba(0,0,0,0.5);
    }
    .handle-button {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: #FFFFFF;
      color: #FF1A3B;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
      border: 3px solid #FF1A3B;
      transition: transform 0.2s;
    }
    .slider-handle:hover .handle-button,
    .slider-handle:active .handle-button {
      transform: translate(-50%, -50%) scale(1.08);
      background: #FF1A3B;
      color: #FFFFFF;
    }

    /* Text watermark indicators */
    .pane-tag {
      position: absolute;
      top: 10px;
      font-family: var(--serif);
      font-size: clamp(18px, 2.8vw, 32px);
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      opacity: 0.98;
      pointer-events: none;
      z-index: 10;
      text-shadow: 
        0 2px 12px rgba(0, 0, 0, 0.95),
        0 0 20px rgba(0, 0, 0, 0.85);
      background: radial-gradient(ellipse, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0) 80%);
      padding: 14px 30px;
      margin: -14px -30px;
    }
    .pane-polistibrick .pane-tag {
      left: 20px;
      color: #FFFFFF;
    }
    .pane-classic .pane-tag {
      right: 20px;
      color: #FFFFFF;
    }

    /* Responsive adjustments */
    @media (max-width: 768px) {
      .info-card {
        bottom: 6px;
        padding: 1mm;
        border-radius: 16px;
        width: auto;
        max-width: calc(100% - 24px);
      }
      .info-card-inner {
        border-radius: 12px;
        padding: 12px 16px;
      }
      .info-pb { left: 12px; right: auto; }
      .info-cl { right: 12px; left: auto; }
      .card-header-pb, .card-header-cl { margin-bottom: 8px; gap: 8px; }
      .info-card h4 { font-size: 15px; }
      .card-team, .card-materials { font-size: 11px; margin-bottom: 4px; }
      .pane-tag { top: 6px; }
      .pane-polistibrick .pane-tag { left: 10px; }
      .pane-classic .pane-tag { right: 10px; }
    }

/* --- section --- */

/* Spațiu crem deasupra (nu interferează cu video-ul morph) + watermark POUR
     tăiat jumătate-jumătate pe muchie — pattern-ul Présence/Comparaison */
  .personas-wrap {
    position: relative;
    z-index: 4;
    margin-top: clamp(-40px, -3vw, -20px);
  }
  .personas-watermark {
    position: absolute;
    top: 0; left: 0; right: 0;
    transform: translateY(-38%);
    height: 1em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--serif);
    font-size: clamp(64px, 11vw, 180px);
    font-weight: 500;
    letter-spacing: -0.06em;
    word-spacing: 0.16em;
    z-index: 2;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
  }
  .personas-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .personas-watermark .wm-top {
    color: transparent;
    -webkit-text-stroke: 1.4px rgba(255, 255, 255, 0.55);
    clip-path: inset(0 0 62% 0);
  }
  .personas-watermark .wm-bottom {
    color: #FFFFFF;
    text-shadow: 0 3px 34px rgba(0, 0, 0, 0.55), 0 1px 8px rgba(0, 0, 0, 0.40);
    clip-path: inset(38% 0 0 0);
  }
  @media (max-width: 640px) {
    .personas-watermark { font-size: clamp(56px, 16vw, 110px); }
  }
  .personas-section {
    position: relative;
    height: calc(min(100vh, 1100px) + 20mm); /* +20mm înălțime */
    background: #14120F;
    overflow: hidden;
  }
  .persona-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.1s ease;
    pointer-events: none;
    z-index: 1;
  }
  .persona-slide.active {
    opacity: 1;
    pointer-events: auto;
  }
  .persona-slide img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  /* Scrim discret jos-stânga pentru text — aceeași rețetă ca hero */
  .persona-scrim {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(0deg, rgba(8, 7, 6, 0.52) 0%, rgba(8, 7, 6, 0.18) 30%, rgba(8, 7, 6, 0) 52%),
      linear-gradient(180deg, rgba(8, 7, 6, 0.42) 0%, rgba(8, 7, 6, 0.16) 14%, rgba(8, 7, 6, 0) 26%);
    pointer-events: none;
  }
  .persona-content {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    padding: 0 clamp(32px, 5vw, 64px) clamp(150px, 19vh, 185px);
    max-width: 1480px;
    margin: 0 auto;
    color: #fff;
    z-index: 3;
  }
  .persona-overline {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 14px;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
  }
  .persona-content h2 {
    font-family: var(--serif);
    font-size: clamp(30px, 4vw, 58px);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.05;
    margin: 0 0 14px;
    max-width: 760px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.5), 0 1px 5px rgba(0, 0, 0, 0.35);
  }
  .persona-content h2 em { font-style: italic; color: var(--red); }
  .persona-metric {
    font-size: clamp(14px, 1.4vw, 17px);
    font-weight: 600;
    color: #FFFFFF;
    margin-bottom: 24px;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
  }
  .persona-metric::before {
    content: '';
    display: inline-block;
    width: 26px; height: 2px;
    background: var(--red);
    vertical-align: middle;
    margin-right: 10px;
  }
  .persona-cta {
    display: inline-block;
    background: var(--red);
    color: #fff;
    padding: 13px 22px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
  }
  .persona-cta:hover {
    background: var(--red-dark, #a50d26);
    box-shadow: 0 10px 28px rgba(200, 16, 46, 0.30);
  }

  /* Navigare: puncte jos-centru + săgeți jos-dreapta */
  /* Tab-uri cu numele rolurilor + bară de progres pe tab-ul activ */
  .persona-dots {
    position: absolute;
    top: clamp(120px, 16vh, 175px);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: clamp(18px, 3vw, 44px);
    z-index: 3;
  }
  .persona-dot {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
  }
  .pd-label {
    color: #FFFFFF;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    white-space: nowrap;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.65), 0 1px 4px rgba(0, 0, 0, 0.45);
    transition: color 0.3s ease;
  }
  .persona-dot:hover .pd-label { color: #FFFFFF; }
  .persona-dot.active .pd-label { color: #FFFFFF; }
  .pd-bar {
    width: 100%;
    min-width: 64px;
    height: 3px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.38);
    overflow: hidden;
  }
  .pd-fill {
    display: block;
    height: 100%;
    width: 0;
    background: var(--red);
  }
  .persona-dot.active .pd-fill { animation: pdFill 3s linear forwards; }
  @keyframes pdFill { from { width: 0; } to { width: 100%; } }
  @media (prefers-reduced-motion: reduce) {
    .persona-dot.active .pd-fill { animation: none; width: 100%; }
  }

  @media (max-width: 768px) {
    .personas-section { height: calc(min(92vh, 760px) + 20mm); }
    .persona-content { padding-bottom: 158px; }
    .persona-dots { top: clamp(96px, 13vh, 132px); gap: 14px; }
    .pd-label { font-size: 9.5px; letter-spacing: 0.08em; }
    .pd-bar { min-width: 44px; }
    .persona-content h2 { font-size: clamp(26px, 7.5vw, 38px); }
    .persona-scrim {
      background:
        linear-gradient(0deg, rgba(8, 7, 6, 0.62) 0%, rgba(8, 7, 6, 0.28) 42%, rgba(8, 7, 6, 0) 64%),
        linear-gradient(180deg, rgba(8, 7, 6, 0.45) 0%, rgba(8, 7, 6, 0.18) 14%, rgba(8, 7, 6, 0) 26%);
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .persona-slide { transition: none; }
  }

/* --- section --- */

.passif-wrap {
    position: relative;
    z-index: 5; /* peste personas-wrap (z4) — jumătatea de sus a PASSIF se vede peste carusel */
  }
  /* Watermark "PASSIF" tăiat pe muchia carusel→video (pagini lipite) — alb, tăietura POUR */
  .passif-watermark {
    position: absolute;
    top: 0; left: 0; right: 0;
    transform: translateY(-38%);
    height: 1em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--serif);
    font-size: clamp(64px, 11vw, 180px); /* identic cu POUR */
    font-weight: 500;
    letter-spacing: -0.06em;
    z-index: 4;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
  }
  .passif-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .passif-watermark .wm-top {
    color: transparent;
    -webkit-text-stroke: 1.4px rgba(255, 255, 255, 0.55);
    clip-path: inset(0 0 62% 0);
  }
  .passif-watermark .wm-bottom {
    color: #FFFFFF; /* alb peste video — identic cu POUR */
    text-shadow: 0 3px 34px rgba(0, 0, 0, 0.55), 0 1px 8px rgba(0, 0, 0, 0.40);
    clip-path: inset(38% 0 0 0);
  }
  /* === Degrade GLOBAL pentru toate watermark-urile: jumătatea plină de jos
     pornește solid de jos și se estompează spre muchia dintre secțiuni (ca PASSIF). === */
  .wm-bottom {
    -webkit-mask-image: linear-gradient(to top, #000 0%, #000 calc(26% - 2mm), rgba(0,0,0,0) calc(60% - 2mm));
            mask-image: linear-gradient(to top, #000 0%, #000 calc(26% - 2mm), rgba(0,0,0,0) calc(60% - 2mm));
  }
  @media (max-width: 640px) {
    .passif-watermark { font-size: clamp(56px, 16vw, 110px); } /* identic cu POUR mobil */
  }
  .passif-section {
    position: relative;
    background: #F7F4ED; /* crem doar ca fundal tehnic (mobil); pe desktop videoul e lipit de carusel */
    overflow: hidden;
  }
  .passif-media { position: relative; }
  .passif-video { display: block; width: 100%; height: auto; }
  /* Iarnă statică — fără slideshow, fără video */
  .passif-slides { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; }
  .passif-slides .passif-photo {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; object-position: center;
  }
  /* Scrim — aceeași gramatică precum caruselul: gradient închis jos pentru lizibilitate */
  .passif-scrim {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(0deg, rgba(8, 7, 6, 0.55) 0%, rgba(8, 7, 6, 0.26) 20%, rgba(8, 7, 6, 0.05) 40%, rgba(8, 7, 6, 0) 56%);
    pointer-events: none;
    z-index: 6; /* peste prim-planul fix, doar pentru lizibilitatea textului jos */
  }
  /* Aceeași poliță de text ca la carusel: jos-stânga, aceleași fonturi și înălțimi */
  .passif-content {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    padding: 0 clamp(32px, 5vw, 64px) clamp(150px, 19vh, 185px); /* identic cu .persona-content */
    max-width: 1480px;
    margin: 0 auto;
    color: #fff;
    z-index: 7; /* deasupra scrim-ului (z6) — textul rămâne lizibil */
  }
  .passif-overline {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 14px;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
  }
  .passif-content h2 {
    font-family: var(--serif);
    font-size: clamp(30px, 4vw, 58px); /* identic cu titlul caruselului */
    font-weight: 500;
    color: #fff;
    letter-spacing: -0.02em;
    line-height: 1.05;
    margin: 0 0 18px;
    max-width: 820px;
    text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
  }
  .passif-content h2 em {
    font-style: italic;
    color: var(--red);
    font-weight: 400;
  }
  .passif-metric {
    font-size: clamp(14px, 1.4vw, 17px); /* identic cu .persona-metric */
    font-weight: 600;
    color: #FFFFFF;
    margin-bottom: 24px;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
  }
  .passif-metric .sep { margin: 0 10px; opacity: 0.45; font-weight: 400; }
  .passif-cta { pointer-events: auto; }
  @media (max-width: 1080px) {
    /* Mobil PASSIF: video dedicat mobil (fereastra cu anotimpurile + copilul în centru),
       full-bleed cover centrat. Text alb suprapus jos. */
    .passif-section { min-height: calc(78svh + 30mm); }
    .passif-media { position: absolute; inset: 0; height: 100%; }
    .passif-video { width: 100%; height: 100%; object-fit: cover; object-position: center; }
    .passif-slides { height: 100%; aspect-ratio: auto; }
    .passif-scrim { display: block; background: linear-gradient(0deg, rgba(8,7,6,0.92) 0%, rgba(8,7,6,0.70) 26%, rgba(8,7,6,0.42) 50%, rgba(8,7,6,0.14) 72%, rgba(8,7,6,0) 90%); }
    .passif-content { position: absolute; left: 0; right: 0; bottom: 0; max-width: 100%; padding: 0 22px 80px; color: #fff; }
    .passif-content h2 { color: #fff; text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45); font-size: clamp(30px, 8.5vw, 44px); }
    .passif-overline { color: rgba(255, 255, 255, 0.85); text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45); }
    .passif-metric { color: #fff; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45); }
  }

/* --- section --- */

.cinq-wrap {
    position: relative;
    z-index: 6; /* peste passif-wrap (z5) — jumătatea de sus a 5-EN-1 se vede peste videoul pasiv */
  }
  /* Watermark "5-EN-1" tăiat pe muchia pasiv→cinq — registrul deschis (stroke + crem), ca STATS/BUNDLE */
  .cinq-watermark {
    position: absolute;
    top: 0; left: 0; right: 0;
    transform: translateY(-38%);
    height: 1em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--serif);
    font-size: clamp(64px, 11vw, 180px); /* identic cu POUR / PASSIF */
    font-weight: 500;
    letter-spacing: -0.06em;
    z-index: 4;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
  }
  .cinq-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .cinq-watermark .wm-top {
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.6);
    text-shadow: 0 3px 34px rgba(0, 0, 0, 0.55), 0 1px 8px rgba(0, 0, 0, 0.40);
    clip-path: inset(0 0 62% 0);
  }
  .cinq-watermark .wm-bottom {
    color: var(--ink); /* negru pe albul secțiunii */
    clip-path: inset(38% 0 0 0);
  }
  @media (max-width: 640px) {
    .cinq-watermark { font-size: clamp(56px, 16vw, 110px); }
  }
  .cinq-section {
    position: relative;
    background: 
      linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0) 65%, #FFFFFF 85%),
      linear-gradient(90deg, rgba(255, 255, 255, 0.65) 0%, rgba(255, 255, 255, 0.80) 30%, rgba(255, 255, 255, 0.90) 50%, #FFFFFF 100%),
      url('../../images/bundle/bundle-bg.png') -12% center/cover no-repeat;
    background-attachment: scroll, scroll, fixed;
    overflow: hidden;
  }
  .cinq-media {
    position: relative;
    max-width: 1760px;
    margin: 0 auto;
  }
  .cinq-video { display: block; width: 100%; height: auto; transform: translateX(45mm); mix-blend-mode: multiply; clip-path: inset(0 0 15% 35%); }

  /* Legenda tehnică a panoului — bandă de specificații sub video, pe crem */
  .cinq-legend {
    position: relative;
    z-index: 5; /* PESTE cinq-media::after (gradientul alb z:1 spala textul -> il ridicam) */
    max-width: 1560px;
    margin: 0 auto;
    padding: 26px 40px 44px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 24px;
    transform: translateY(-15mm); /* ridicat 15mm la cererea userului (desktop) */
  }
  .cinq-item {
    max-width: 250px;
    opacity: 1 !important;
    transform: none !important;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 12px 16px;
    background: transparent;
    transition: border-color 0.25s, background-color 0.25s;
  }
  .cinq-item:hover {
    border-color: var(--red);
    background-color: rgba(255, 26, 59, 0.02);
  }
  .cinq-item .ci-name {
    display: flex;
    align-items: center;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--ink); /* negru la cererea userului */
  }
  .cinq-item .ci-val {
    margin: 4px 0 0 0;
    font-size: 11px;
    line-height: 1.45;
    color: var(--gray);
    white-space: nowrap;
  }
  /* Aceeași poliță ca morph: text JOS-STÂNGA, registrul deschis */
  .cinq-overlay {
    position: absolute;
    left: 0;
    bottom: clamp(150px, 19vh, 185px); /* aceeași înălțime de la marginea vizibilă ca la carusel/morph */
    z-index: 2;
    text-align: left;
    padding: 0 clamp(32px, 5vw, 64px);
    max-width: 860px;
    pointer-events: none;
  }
  .cinq-overlay .cinq-eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink-soft);
    margin-bottom: 14px;
  }
  .cinq-overlay h2 {
    font-family: var(--serif);
    font-size: clamp(30px, 4vw, 58px); /* identic cu titlul caruselului */
    font-weight: 500;
    color: var(--ink);
    letter-spacing: -0.02em;
    line-height: 1.05;
    margin: 0 0 18px;
    max-width: 760px;
  }
  .cinq-overlay h2 em {
    font-style: italic;
    color: var(--red);
    font-weight: 400;
  }
  .cinq-metric {
    font-size: clamp(14px, 1.4vw, 16px);
    font-weight: 500;
    line-height: 1.5;
    color: var(--ink-soft);
    margin-bottom: 24px;
    max-width: 680px;
  }
  .cinq-metric .sep { margin: 0 10px; opacity: 0.45; font-weight: 400; }
  .cinq-overlay .cinq-cta { pointer-events: auto; }
  @media (max-width: 1080px) {
    /* Full-bleed ca pe desktop: video cover pe tot, legendă sus-stânga, text suprapus jos */
    .cinq-section { min-height: 86svh; }
    .cinq-media { position: absolute; inset: 0; max-width: none; height: 100%; margin: 0; }
    .cinq-video { width: 100%; height: 100%; object-fit: contain; object-position: center; transform: scale(2.34) translate(-8%, 0%); transform-origin: center; }
    .cinq-legend { display: none; }   /* etichetele tehnice rămân doar pe desktop */
    .cinq-overlay { position: absolute; left: 0; right: 0; bottom: 0; max-width: 100%; padding: 0 22px 76px; }
    .cinq-overlay h2 { font-size: clamp(28px, 8vw, 42px); }
  }

/* --- section --- */

.presence-wrap { position: relative; z-index: 7; } /* peste cinq-wrap (z6) — jumatatea de sus a PRÉSENCE se vede peste sectiunea 5-EN-1 */
  .presence-watermark { position:absolute; top:0; left:0; right:0; transform:translateY(-38%); height:1em; line-height:1; text-align:center; text-transform:uppercase; font-family:var(--serif); font-size:clamp(64px,11vw,180px); font-weight:500; letter-spacing:-0.06em; z-index:4; pointer-events:none; user-select:none; white-space:nowrap; }
  .presence-watermark .wm-half { position:absolute; inset:0; width:100%; display:block; }
  .presence-watermark .wm-top { color:transparent; -webkit-text-stroke:1.5px rgba(90,80,66,0.62); clip-path:inset(0 0 62% 0); } /* crem închis cald — vizibil pe fundal alb */
  .presence-watermark .wm-bottom { color:#FFFFFF; text-shadow:0 3px 34px rgba(0,0,0,0.55),0 1px 8px rgba(0,0,0,0.40); clip-path:inset(38% 0 0 0); } /* alb peste foto */
  @media (max-width:640px){ .presence-watermark{ font-size:clamp(56px,16vw,110px);} }

  .reach-section.presence-section {
    position:relative; padding:0; border:0; background:#0F0E0C;
    min-height:clamp(620px,90vh,1000px); overflow:hidden; display:block;
  }
  .presence-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
  /* Ken Burns — montaj din mișcări de cameră pe ACEEAȘI poză (fără AI): large → tir/muncitori → stivuitor → retragere */
  .presence-kb { will-change: transform; transform-origin: 50% 56%; animation: kbPresence 30s ease-in-out infinite; }
  @keyframes kbPresence {
    0%, 12%   { transform: scale(1.06); transform-origin: 50% 56%; }   /* plan larg */
    30%, 44%  { transform: scale(1.9);  transform-origin: 47% 62%; }   /* zoom pe tir + muncitori */
    60%, 74%  { transform: scale(1.9);  transform-origin: 68% 60%; }   /* panoramare spre stivuitor */
    100%      { transform: scale(1.06); transform-origin: 50% 56%; }   /* retragere */
  }
  @media (prefers-reduced-motion: reduce) { .presence-kb { animation: none; transform: scale(1.04); } }
  .presence-scrim { position:absolute; inset:0; z-index:1; pointer-events:none;
    background:
      linear-gradient(0deg, rgba(8,7,6,0.66) 0%, rgba(8,7,6,0.18) 34%, rgba(8,7,6,0) 56%),
      linear-gradient(90deg, rgba(8,7,6,0.45) 0%, rgba(8,7,6,0) 44%); }
  .presence-content { position:absolute; left:0; bottom:clamp(48px,9vh,96px); z-index:3; padding:0 clamp(32px,5vw,64px); max-width:760px; color:#fff; }
  .presence-overline { display:inline-block; font-size:12px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:rgba(255,255,255,0.85); margin-bottom:14px; text-shadow:0 1px 10px rgba(0,0,0,0.45); }
  .presence-content h2 { font-family:var(--serif); font-size:clamp(30px,4vw,58px); font-weight:500; color:#fff; letter-spacing:-0.02em; line-height:1.05; margin:0 0 18px; text-shadow:0 2px 24px rgba(0,0,0,0.45); }
  .presence-content h2 em { font-style:italic; color:var(--red); font-weight:400; }
  .presence-metric { font-size:clamp(14px,1.4vw,17px); font-weight:600; color:#fff; margin-bottom:24px; text-shadow:0 1px 10px rgba(0,0,0,0.45); }
  .presence-metric .sep { margin:0 10px; opacity:0.45; font-weight:400; }
  .presence-cta { pointer-events:auto; }
  .presence-mapcard { position:absolute; z-index:3; top:50%; right:-2cm; transform:translateY(-50%);
    width:clamp(414px,50.6vw,690px); background:transparent;
    border:1.5px solid #FFFFFF; border-right:0; border-radius:20px 0 0 20px; padding:5mm; box-shadow:0 30px 80px rgba(0,0,0,0.28); overflow:hidden; }
  .presence-mapcard .mapcard-inner { background:rgba(247,244,237,0.46); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border-radius:12px 0 0 12px; padding:14px 14px 10px; overflow:hidden; }
  .presence-mapcard .mapcard-tag { display:inline-block; background:var(--red-soft); color:var(--red); padding:3px 10px; border-radius:4px; font-size:11px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; margin-bottom:8px; }
  .presence-mapcard .reach-svg { max-height:50.6vh; transform:scale(1.1); transform-origin:center; }
  .presence-legend { display:flex; justify-content:center; gap:28px; margin-top:6px; font-size:12px; color:#fff; text-shadow:0 1px 4px rgba(0,0,0,0.6); letter-spacing:0.04em; }
  @media (max-width:1024px) {
    /* Full-bleed ca pe desktop: video cover pe tot, hartă suprapusă sus, text alb jos */
    .reach-section.presence-section { min-height: 100svh; }
    .presence-bg { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
    .presence-scrim { display: block; }
    .presence-mapcard { position: absolute; top: clamp(76px, 11vh, 110px); left: 50%; right: auto; transform: translateX(-50%);
      width: min(92%, 470px); border: 1.5px solid #FFFFFF; border-radius: 16px; padding: 4mm; margin: 0; }
    .presence-mapcard .mapcard-inner { border-radius: 10px; }
    .presence-mapcard .reach-svg { max-height: 32vh; transform: scale(1.03); }
    .presence-content { position: absolute; left: 0; right: 0; bottom: 0; color: #fff; padding: 0 22px 72px; max-width: 100%; }
    .presence-content h2 { color: #fff; text-shadow: 0 2px 24px rgba(0,0,0,0.45); font-size: clamp(28px, 8vw, 42px); }
    .presence-overline { color: rgba(255,255,255,0.85); text-shadow: 0 1px 10px rgba(0,0,0,0.45); }
    .presence-metric { color: #fff; text-shadow: 0 1px 10px rgba(0,0,0,0.45); }
  }

/* --- section --- */

.pm-cc{fill:#d3ccbc;stroke:#a89e8b;stroke-width:0.5;vector-effect:non-scaling-stroke;pointer-events:none}.pm-cc.pm-on{fill:#c8102e;stroke:#8d0a20;stroke-width:0.6}.pm-lbl{fill:#1a1714;font-family:Helvetica,Arial,sans-serif;font-size:12.5px;font-weight:700;text-anchor:middle;paint-order:stroke;stroke:#f7f4ed;stroke-width:3;stroke-linejoin:round;pointer-events:none}.pm-fdot{fill:#ffffff;stroke:#111111;stroke-width:2}.pm-flbl{fill:#c8102e;font-family:Helvetica,Arial,sans-serif;font-size:14px;font-weight:800;text-anchor:middle;paint-order:stroke;stroke:#f7f4ed;stroke-width:3.2}.pm-fsub{fill:#6b6256;font-family:Helvetica,Arial,sans-serif;font-size:8.5px;text-anchor:middle;paint-order:stroke;stroke:#f7f4ed;stroke-width:2.4}

/* --- section --- */

.sistem-section {
    position: relative;
    background: 
      linear-gradient(180deg, #0F0E0C 0%, rgba(15, 14, 12, 0.68) 30%, rgba(15, 14, 12, 0.78) 75%, #0F0E0C 100%),
      url('../../images/systeme/systeme-bg.png') center/cover no-repeat;
    background-attachment: scroll, fixed;
    padding: 80px 0;
    overflow-x: clip;
  }
  .sistem-section > .container {
    max-width: 1480px;
    padding-left: clamp(20px, 2.5vw, 40px);
    padding-right: clamp(20px, 2.5vw, 40px);
  }
  .sistem-stage-wrap {
    position: relative;
    margin: 0 auto 0;
    max-width: 1480px;
  }
  .sistem-stage {
    position: relative;
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 6px 24px 40px;
    overflow: visible;
  }
  .sistem-wrap { position: relative; z-index: 8; }
  .sistem-watermark {
    position: absolute; top: 0; left: 50%; width: 100vw; margin-left: -50vw;
    pointer-events: none; user-select: none; transform: translateY(-38%);
    height: 1em; line-height: 1; text-align: center; text-transform: uppercase;
    font-family: var(--serif); font-size: clamp(64px, 11vw, 180px);
    font-weight: 500; letter-spacing: -0.06em; z-index: 2;
  }
  .sistem-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .sistem-watermark .wm-top { color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,0.22); clip-path: inset(0 0 62% 0); }
  .sistem-watermark .wm-bottom { color: #FFFFFF; -webkit-text-stroke: 0; clip-path: inset(38% 0 0 0); }
  .sistem-intro {
    max-width: min(1100px, 100%); margin: 0 auto 48px; text-align: center;
  }
  .sistem-intro .bubble-tag {
    display: inline-block; background: var(--red-soft); color: var(--red);
    padding: 4px 12px; border-radius: 4px; font-size: 11px; font-weight: 600;
    letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 14px;
  }
  .sistem-intro h2 {
    font-family: var(--serif); font-size: clamp(28px, 3.2vw, 44px); font-weight: 500;
    color: #FFFFFF; letter-spacing: -0.02em; line-height: 1.05; margin-bottom: 14px;
  }
  .sistem-intro h2 em { font-style: italic; color: var(--red); font-weight: 400; }
  .sistem-intro p {
    font-size: 15px; color: rgba(255, 255, 255, 0.7); line-height: 1.45; margin: 0;
    white-space: nowrap;
  }
  @media (max-width: 1100px) {
    .sistem-intro p { white-space: normal; }
  }

  .sistem-grid--families {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(16px, 1.6vw, 24px);
    max-width: min(1480px, calc(100vw - 48px));
    width: 100%;
    margin: 0 auto;
  }
  .sistem-card--family {
    position: relative;
    background: rgba(255, 255, 255, 0.04);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    padding: clamp(32px, 3.2vw, 44px) clamp(28px, 2.8vw, 40px) clamp(28px, 2.8vw, 36px);
    transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease, border-color 0.3s ease, background-color 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    text-decoration: none;
    color: #FFFFFF;
    min-height: 100%;
  }
  .sistem-eco {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    pointer-events: none;
  }
  .sistem-eco svg {
    width: 18px;
    height: 18px;
    display: block;
    /* coadă ~ora 10, vârf în jos */
    transform: rotate(210deg);
  }
  .sistem-card--family:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 50px rgba(0,0,0,0.35);
    border-color: #3E9B5A;
    background-color: rgba(62, 155, 90, 0.10);
  }
  .sistem-card--family:hover .sistem-card-cta {
    color: #3E9B5A;
  }
  .sistem-card-label {
    display: inline-block;
    font-size: 11px; font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase;
    color: rgba(255,255,255,0.55); margin-bottom: 14px;
  }
  .sistem-card--family h3 {
    font-family: var(--serif); font-size: clamp(30px, 2.8vw, 38px); font-weight: 500;
    color: #FFFFFF; margin: 0 0 16px; letter-spacing: -0.02em; line-height: 1.08;
  }
  .sistem-card--family h3 em { font-style: italic; color: var(--red); font-weight: 400; }
  .sistem-card--family p {
    font-size: clamp(15px, 1.15vw, 17px); color: rgba(255, 255, 255, 0.72); line-height: 1.5;
    margin: 0 0 26px; flex: 1;
  }
  .sistem-card--family p strong { color: #fff; font-weight: 600; }
  .sistem-card-cta {
    font-size: 13px; font-weight: 600; color: var(--red);
    letter-spacing: 0.02em;
  }
  .sistem-foot {
    text-align: center; margin: 28px 0 0;
    font-size: 14px;
  }
  .sistem-foot a {
    color: rgba(255,255,255,0.7); font-weight: 600; text-decoration: none;
  }
  .sistem-foot a:hover { color: var(--red); }

  @media (max-width: 900px) {
    .sistem-section { padding: 40px 0 48px; }
    .sistem-stage { padding: 10px 18px 16px; }
    .sistem-intro { margin: 0 auto 24px; }
    .sistem-intro h2 { font-size: 26px; margin-bottom: 9px; }
    .sistem-intro p { font-size: 13.5px; line-height: 1.5; }
    .sistem-grid--families { grid-template-columns: 1fr; gap: 12px; }
    .sistem-card--family { padding: 22px 20px 20px; }
    .sistem-card--family h3 { font-size: 24px; margin-bottom: 10px; }
    .sistem-card--family p { font-size: 14px; margin-bottom: 16px; }
    .sistem-foot { margin-top: 20px; }
  }

  /* Legacy layout (alte țări): carduri stânga + casă 3D */
  .sistem-layout { display: flex; gap: clamp(28px, 4vw, 56px); align-items: stretch; }
  .sistem-layout > .sistem-grid { flex: 0 0 clamp(420px, calc(48% + 38px), 640px); }
  .sistem-layout .sistem-grid {
    display: flex; flex-direction: column; gap: 16px;
  }
  .sistem-layout .sistem-card {
    background: rgba(255, 255, 255, 0.03);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 12px;
    padding: 16px 18px;
    transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease, border-color 0.3s ease, background-color 0.3s ease;
    display: flex; flex-direction: row; align-items: center; gap: 16px;
    text-decoration: none; color: #FFFFFF;
  }
  .sistem-layout .sistem-card-text { display: flex; flex-direction: column; min-width: 0; }
  .sistem-layout .sistem-card h3 { font-family: var(--serif); font-size: 17px; line-height: 1.15; margin: 0 0 4px; color: #FFFFFF; font-weight: 500; }
  .sistem-layout .sistem-card h3 em { font-style: italic; color: var(--red); font-weight: 400; }
  .sistem-layout .sistem-card p { font-size: 12.5px; line-height: 1.42; margin: 0 0 8px; color: rgba(255, 255, 255, 0.7); }
  .sistem-layout .sistem-card-spec { font-size: 11.5px; margin-bottom: 0; color: rgba(255, 255, 255, 0.85); padding-top: 10px; border-top: 1px solid rgba(255,255,255,0.12); }
  .sistem-layout .sistem-card-spec strong { color: var(--red); font-family: var(--serif); font-size: 15px; }
  .sistem-layout .sistem-card:hover {
    transform: translateY(-6px); box-shadow: 0 24px 50px rgba(0,0,0,0.35);
    border-color: var(--red); background-color: rgba(255, 26, 59, 0.04);
  }
  .sistem-layout .sistem-card-img {
    flex: 0 0 92px; width: 92px; aspect-ratio: 1; margin-bottom: 0;
    display: flex; align-items: center; justify-content: center; overflow: hidden;
  }
  .sistem-layout .sistem-card-img img { max-width: 90%; max-height: 90%; object-fit: contain; display: block; }
  .sistem-hero {
    flex: 1; min-width: 0; margin: 0; position: relative;
    background: radial-gradient(circle at center, rgba(255, 26, 59, 0.08) 0%, rgba(15, 14, 12, 0) 70%), rgba(255, 255, 255, 0.03);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 12px;
    padding: 24px 24px 48px; display: flex; align-items: center; justify-content: center;
    box-sizing: border-box; overflow: visible;
  }
  .sistem-hero img { display: inline-block; width: auto; max-width: 667px; height: auto; transform: translateX(-4mm); filter: drop-shadow(0 20px 32px rgba(0,0,0,0.35)); }
  .sistem-hero-inner { position: relative; width: 100%; max-width: 580px; display: block; }
  .sistem-hero .sh-layer {
    display: block; width: 100%; height: auto;
    transition: transform .4s cubic-bezier(.22,1,.36,1), filter .35s ease;
  }
  .sistem-hero .sh-sizer { position: relative; z-index: 1; top: 4mm; left: 1mm; }
  .sistem-hero .sh-layer[data-layer="plancher"] { position: absolute; top: 0; left: 0; z-index: 2; transform-origin: 50% 50%; }
  .sistem-hero .sh-layer[data-layer="toit"] { position: absolute; top: 0; left: 0; z-index: 3; transform-origin: 50% 22%; }
  .sistem-hero .sh-layer[data-layer="murs"] { transform-origin: 50% 80%; }
  .sistem-hero.hl-on .sh-layer { filter: brightness(.4) saturate(.75); }
  .sistem-hero.hl-toit .sh-layer[data-layer="toit"] { filter: none; transform: translateY(-25px) scale(1.06); z-index: 5; }
  .sistem-hero.hl-plancher .sh-layer[data-layer="plancher"] { filter: none; transform: scale(1.06); z-index: 5; }
  .sistem-hero.hl-murs .sh-layer[data-layer="murs"] { filter: none; transform: translateY(25px) scale(1.06); z-index: 5; }
  .sistem-layout .sistem-card.is-active { border-color: var(--red); }
  @media (max-width: 968px) {
    .sistem-layout { flex-direction: column; align-items: stretch; }
    .sistem-layout > .sistem-grid { flex: none; }
    .sistem-layout .sistem-grid { gap: 11px; }
    .sistem-layout .sistem-card { padding: 13px 15px; gap: 13px; }
    .sistem-layout .sistem-card-img { flex: 0 0 64px; width: 64px; }
    .sistem-layout .sistem-card h3 { font-size: 14px; }
    .sistem-layout .sistem-card p { font-size: 11px; }
    .sistem-hero { display: none; }
  }

/* --- section --- */

.montaj-section {
    position: relative;
    z-index: 9;
    background: #0F0E0C;
    padding: clamp(120px, 14vh, 170px) 0 clamp(72px, 9vh, 110px);
  }
  .montaj-scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(10,9,8,0.74) 0%, rgba(10,9,8,0.82) 50%, rgba(10,9,8,0.90) 100%);
  }
  .montaj-stage-wrap {
    position: relative;
    z-index: 3;
    margin: 0 auto;
    width: 100%;
  }
  .montaj-stage {
    position: relative;
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    gap: 40px;
  }
  .montaj-watermark {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    pointer-events: none;
    user-select: none;
    transform: translateY(-38%);
    height: 1em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--serif);
    font-size: clamp(80px, 13vw, 220px);
    font-weight: 500;
    letter-spacing: -0.06em;
    z-index: 7;
  }
  .montaj-watermark .wm-half {
    position: absolute; inset: 0; width: 100%; display: block;
  }
  .montaj-watermark .wm-top {
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.24); /* alb semi-transparent — vizibil pe fundal întunecat */
    clip-path: inset(0 0 62% 0);
  }
  .montaj-watermark .wm-bottom {
    color: #FFFFFF;
    opacity: 1;
    text-shadow: 0 2px 26px rgba(0,0,0,0.45);
    clip-path: inset(38% 0 0 0);
  }
  .montaj-intro {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
  }
  .montaj-intro .bubble-tag {
    display: inline-block;
    background: var(--red-soft);
    color: var(--red);
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 12px;
  }
  .montaj-intro h2 {
    font-family: var(--serif);
    font-size: clamp(26px, 2.8vw, 40px);
    font-weight: 500;
    color: #FFFFFF;
    letter-spacing: -0.02em;
    line-height: 1.05;
    margin-bottom: 10px;
  }
  .montaj-intro h2 em { font-style: italic; color: var(--red); font-weight: 400; }
  .montaj-intro p { font-size: 14.5px; color: rgba(255,255,255,0.72); line-height: 1.55; margin: 0; }

  .montaj-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
  }
  .montaj-card {
    background: rgba(255,255,255,0.055);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 16px;
    overflow: hidden;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s ease;
    position: relative;
  }
  .montaj-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.08);
  }
  .montaj-img {
    aspect-ratio: 4/3;
    overflow: hidden;
    background: var(--cream);
  }
  .montaj-img img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    transition: transform 0.6s cubic-bezier(0.22,1,0.36,1);
  }
  .montaj-card:hover .montaj-img img { transform: scale(1.04); }
  .montaj-num {
    position: absolute;
    top: 12px; left: 12px;
    background: var(--red);
    color: #FFFFFF;
    width: 32px; height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--serif);
    font-weight: 500;
    font-size: 14px;
    z-index: 2;
    letter-spacing: 0;
  }
  .montaj-card-body { padding: 16px 18px 18px; }
  .montaj-card h3 {
    font-family: var(--serif);
    font-size: 18px;
    font-weight: 500;
    color: #FFFFFF;
    margin-bottom: 6px;
    letter-spacing: -0.01em;
  }
  .montaj-card p {
    font-size: 12.5px;
    color: rgba(255,255,255,0.66);
    line-height: 1.5;
    margin: 0;
  }

  .montaj-cta {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.14);
    color: #FFFFFF;
    border-radius: 14px;
    padding: 20px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
  .montaj-cta p {
    font-family: var(--serif);
    font-size: clamp(15px, 1.3vw, 19px);
    line-height: 1.35;
    margin: 0;
    flex: 1;
  }
  .montaj-cta p strong { color: var(--red); font-weight: 500; }
  .montaj-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; flex-shrink: 0; }
  .montaj-cta--systems {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 18px;
  }
  .montaj-cta--systems p {
    flex: none;
    font-size: clamp(16px, 1.4vw, 20px);
  }
  .montaj-cta--systems .montaj-cta-actions {
    justify-content: center;
  }

  @media (max-width: 1100px) {
    .montaj-grid { grid-template-columns: repeat(2, 1fr); }
    .montaj-stage { padding: 60px 32px 40px; }
  }
  @media (max-width: 700px) {
    .montaj-grid { grid-template-columns: 1fr; }
    .montaj-stage { padding: 50px 20px 32px; }
    .montaj-cta { flex-direction: column; align-items: stretch; text-align: center; padding: 28px; }
    /* Boutons : centrés + même largeur sur mobile */
    .montaj-cta-actions { flex-direction: column; align-items: center; width: 100%; gap: 12px; }
    .montaj-cta-actions .btn { width: 100%; max-width: 300px; justify-content: center; }
  }

/* --- section --- */

.histoire-section {
    position: relative;
    background: var(--cream);
    min-height: 100vh;
    display: flex; flex-direction: column; justify-content: center;
    padding: clamp(230px, 30vh, 340px) 0 clamp(80px, 10vh, 120px);
    overflow: hidden;
  }
  /* Bande sombre propre à HISTOIRES (indépendante du montage/vidéo au-dessus)
     — la moitié haute blanche du titre se pose dessus, la moitié basse sur le crème */
  .histoire-band {
    position: absolute; top: 0; left: 50%; width: 100vw; margin-left: -50vw;
    font-size: clamp(72px, 13vw, 240px);
    height: 0.38em;
    background: #14110E;
    z-index: 0; pointer-events: none;
  }
  /* Titre coupé "HISTOIRES" — haut blanc (sur bande sombre), bas encre (sur crème) */
  .histoire-watermark {
    position: absolute; top: 0; left: 50%; width: 100vw; margin-left: -50vw;
    transform: translateY(0);
    height: 1em; line-height: 1; text-align: center; text-transform: uppercase;
    font-family: var(--serif); font-size: clamp(72px, 13vw, 240px);
    font-weight: 500; letter-spacing: -0.06em; z-index: 8;
    pointer-events: none; user-select: none; white-space: nowrap;
  }
  .histoire-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .histoire-watermark .wm-top { color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,0.6); clip-path: inset(0 0 62% 0); }
  .histoire-watermark .wm-bottom { color: var(--ink); clip-path: inset(38% 0 0 0); }

  .histoire-wrap {
    position: relative; z-index: 2;
    display: grid; grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 5vw, 80px);
    align-items: center;
    max-width: 1400px; margin: 0 auto; width: 100%;
  }
  /* PHOTO à gauche */
  .histoire-photo {
    position: relative; margin: 0;
    border-radius: 28px; overflow: hidden;
    box-shadow: 0 30px 80px rgba(20,18,15,0.22);
    aspect-ratio: 4 / 4.47;
  }
  .histoire-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .histoire-photo-scrim { 
    position: absolute; inset: 0;
    background: linear-gradient(180deg, transparent 42%, rgba(15,14,12,0.80) 100%);
  }
  .histoire-photo-badge {
    position: absolute; left: 24px; right: 24px; bottom: 24px;
    display: flex; align-items: center; gap: 14px; color: #fff;
  }
  .histoire-photo-badge > img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(255,255,255,0.85); flex-shrink: 0; }
  .histoire-photo-badge strong { display: block; font-size: 16px; font-weight: 600; line-height: 1.2; }
  .histoire-photo-badge .hp-loc { display: block; font-size: 12.5px; opacity: 0.85; margin-top: 2px; }
  .histoire-verified { display: inline-flex; align-items: center; gap: 5px; margin-top: 5px; font-size: 11px; font-weight: 600; letter-spacing: 0.04em; color: #7BE0A3; text-transform: uppercase; }

  /* DÉTAILS à droite */
  .histoire-detail { max-width: 600px; }
  .histoire-detail .testimonial-tag { margin-bottom: 18px; background: var(--red-soft); color: var(--red); }
  .histoire-stars { color: var(--red); font-size: 18px; letter-spacing: 3px; margin-bottom: 16px; line-height: 1; display: flex; align-items: baseline; gap: 10px; }
  .histoire-date { font-family: var(--sans); font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--gray); text-transform: none; }
  .histoire-quote {
    font-family: var(--serif); font-size: clamp(18px, 1.8vw, 23px);
    line-height: 1.5; color: var(--ink); font-weight: 400; letter-spacing: -0.005em;
    margin-bottom: 22px;
  }
  .histoire-quote em { font-style: italic; color: var(--red); font-weight: 400; }
  /* Galerie de photos « ajoutées par le client » — look avis authentique */
  .histoire-gallery-label { font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--gray); margin-bottom: 10px; }
  .histoire-gallery { display: flex; gap: 10px; margin-bottom: 30px; flex-wrap: wrap; }
  .histoire-gallery img { width: 92px; height: 92px; object-fit: cover; border-radius: 12px; border: 1px solid var(--border); cursor: pointer; transition: transform .2s ease; }
  .histoire-gallery img:hover { transform: translateY(-2px); }
  .histoire-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 32px; }
  .histoire-stat { text-align: center; padding: 16px 8px; background: #fff; border: 1px solid var(--border); border-radius: 14px; }
  .histoire-stat strong { display: block; font-family: var(--serif); font-size: 26px; color: var(--red); font-weight: 500; line-height: 1; letter-spacing: -0.02em; }
  .histoire-stat span { display: block; font-size: 10px; color: var(--gray); letter-spacing: 0.06em; text-transform: uppercase; margin-top: 6px; font-weight: 600; }
  .histoire-actions { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
  .histoire-review-btn {
    display: inline-flex; align-items: center; gap: 10px;
    background: var(--red); color: #fff; border: 0; cursor: pointer;
    font-family: var(--sans); font-size: 16px; font-weight: 600;
    padding: 16px 32px; border-radius: 100px;
    box-shadow: 0 12px 30px rgba(200,16,46,0.30);
    transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
  }
  .histoire-review-btn:hover { background: var(--red-dark); transform: translateY(-2px); box-shadow: 0 16px 38px rgba(200,16,46,0.42); }
  .histoire-link { font-size: 13px; font-weight: 600; color: var(--ink); text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: gap .2s ease, color .2s ease; }
  .histoire-link:hover { gap: 12px; color: var(--red); }
  .histoire-cta-note { display: block; width: 100%; margin-top: 14px; font-size: 12px; color: var(--gray); }

  @media (max-width: 968px) {
    .histoire-wrap { grid-template-columns: 1fr; gap: 36px; }
    .histoire-photo { aspect-ratio: 4 / 3; }
    .histoire-watermark { font-size: clamp(56px, 16vw, 120px); }
  }
  @media (max-width: 560px) {
    .histoire-stats { grid-template-columns: repeat(2, 1fr); }
  }

  /* Carusel testimoniale */
  .histoire-carousel { position: relative; }
  .histoire-slide { display: none; }
  .histoire-slide.is-active { display: grid; animation: histFade .5s ease both; }
  @keyframes histFade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
  .histoire-nav { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 40px; }
  .histoire-arrow {
    width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--border);
    background: #fff; color: var(--ink); font-size: 22px; line-height: 1; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .2s ease, color .2s ease, transform .2s ease, border-color .2s ease;
  }
  .histoire-arrow:hover { background: var(--red); color: #fff; border-color: var(--red); transform: translateY(-2px); }
  .histoire-dots { display: flex; align-items: center; gap: 9px; }
  .histoire-dot {
    width: 9px; height: 9px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
    background: var(--border); transition: width .25s ease, background .25s ease, border-radius .25s ease;
  }
  .histoire-dot.is-active { width: 26px; border-radius: 5px; background: var(--red); }
  .histoire-carousel .histoire-actions { justify-content: center; margin-top: 30px; }

  /* === Refonte CONFIANCE : photo plein écran + carte glass à droite (style Présence) === */
  .histoire-section { position: relative; padding: 0; border: 0; background: #0F0E0C; min-height: clamp(620px, 90vh, 1000px); overflow: hidden; display: block; }
  .histoire-band { display: none; }
  .histoire-watermark { top: 0; transform: translateY(0); z-index: 6; }
  .histoire-watermark .wm-top { color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,0.5); clip-path: inset(0 0 50% 0); }
  .histoire-watermark .wm-bottom { color: rgba(255,255,255,0.13); clip-path: inset(50% 0 0 0); }

  .histoire-carousel { position: static; }
  .histoire-track { position: absolute; inset: 0; z-index: 0; }
  .histoire-slide { position: absolute; inset: 0; display: none; }
  .histoire-slide.is-active { display: block; animation: histFade .6s ease both; }
  .histoire-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: 0; }
  .histoire-scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(90deg, rgba(8,7,6,0.10) 0%, rgba(8,7,6,0) 42%),
                linear-gradient(0deg, rgba(8,7,6,0.55) 0%, rgba(8,7,6,0) 46%); }

  .histoire-card { position: absolute; z-index: 3; top: 50%; right: clamp(20px, 4vw, 72px); transform: translateY(-50%);
    width: clamp(340px, 38vw, 540px); max-width: calc(100% - 40px);
    border: 1.5px solid #FFFFFF; border-radius: 18px; padding: 5mm;
    box-shadow: 0 30px 80px rgba(0,0,0,0.34); overflow: hidden; }
  .histoire-card-inner { background: rgba(247,244,237,0.86); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    border-radius: 12px; padding: 26px 26px 22px; }
  .histoire-card .testimonial-tag { display: inline-block; margin-bottom: 14px; background: var(--red-soft); color: var(--red); padding: 4px 12px; border-radius: 6px; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
  .histoire-card .histoire-stars { color: var(--red); font-size: 18px; letter-spacing: 3px; margin-bottom: 16px; line-height: 1; display: flex; align-items: baseline; gap: 10px; }
  .histoire-card .histoire-date { font-family: var(--sans); font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--gray); }
  .histoire-card .histoire-quote { font-family: var(--serif); font-size: clamp(19px, 1.85vw, 26px); line-height: 1.34; color: var(--ink); font-weight: 500; letter-spacing: -0.01em; margin: 0 0 22px; }
  .histoire-card .histoire-quote em { font-style: italic; color: var(--red); font-weight: 400; }
  .histoire-author { display: flex; align-items: center; gap: 14px; padding-top: 18px; border-top: 1px solid rgba(26,23,20,0.14); }
  .histoire-author > img { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; border: 2px solid #fff; flex-shrink: 0; }
  .histoire-author strong { display: block; font-size: 16px; font-weight: 600; color: var(--ink); line-height: 1.2; }
  .histoire-author .hp-loc { display: block; font-size: 13px; color: var(--gray); margin-top: 2px; }
  .histoire-author .histoire-verified { display: inline-flex; align-items: center; gap: 5px; margin-top: 5px; font-size: 11px; font-weight: 600; letter-spacing: 0.04em; color: #2e9c5a; text-transform: uppercase; }

  .histoire-nav { position: absolute; z-index: 4; left: clamp(22px, 5vw, 64px); bottom: clamp(118px, 17vh, 152px); display: flex; align-items: center; gap: 18px; margin: 0; }
  .histoire-arrow { background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.55); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
  .histoire-arrow:hover { background: var(--red); border-color: var(--red); color: #fff; }
  .histoire-dot { background: rgba(255,255,255,0.45); }
  .histoire-dot.is-active { background: #fff; }
  .histoire-carousel .histoire-actions { position: absolute; z-index: 4; left: clamp(22px, 5vw, 64px); bottom: clamp(44px, 8vh, 78px); margin: 0; justify-content: flex-start; max-width: min(620px, 90%); }
  .histoire-carousel .histoire-link { color: #fff; }
  .histoire-carousel .histoire-link:hover { color: #fff; opacity: .85; }
  .histoire-carousel .histoire-cta-note { color: rgba(255,255,255,0.82); }

  @media (max-width: 968px) {
    .histoire-section { min-height: 100svh; }
    .histoire-card { top: auto; bottom: clamp(150px, 24vh, 220px); right: 50%; transform: translateX(50%); width: min(92%, 480px); }
    .histoire-card-inner { padding: 20px 20px 18px; }
    .histoire-nav { left: 50%; transform: translateX(-50%); bottom: clamp(96px, 16vh, 130px); }
    .histoire-carousel .histoire-actions { left: 50%; transform: translateX(-50%); bottom: clamp(28px, 6vh, 56px); justify-content: center; text-align: center; }
  }

/* --- section --- */

.conf-wrap { position: relative; z-index: 10; }   /* au-dessus de montaj-section (z9) pour que la moitié haute du watermark soit visible */
  .conf-section { position: relative; background: var(--cream); padding: clamp(88px,9vw,130px) 0 clamp(64px,7vw,96px); }
  .conf-watermark { position: absolute; top: 0; left: 0; right: 0; transform: translateY(-38%); height: 1em; line-height: 1; text-align: center; text-transform: uppercase;
    font-family: var(--serif); font-weight: 500; font-size: clamp(64px,12vw,200px); letter-spacing: -0.05em; z-index: 4; pointer-events: none; user-select: none; white-space: nowrap; }
  .conf-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .conf-watermark .wm-top { color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,0.55); clip-path: inset(0 0 62% 0); }     /* sur la section sombre au-dessus */
  .conf-watermark .wm-bottom { color: transparent; -webkit-text-stroke: 1.5px rgba(26,23,20,0.12); clip-path: inset(38% 0 0 0); }  /* ghost encre sur le crème */
  .conf-inner { position: relative; z-index: 2; }
  .conf-head { text-align: center; margin-bottom: clamp(36px,5vw,60px); }
  .conf-overline { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--red); margin-bottom: 12px; }
  .conf-sub { font-family: var(--serif); font-size: clamp(22px,2.4vw,34px); font-weight: 500; color: var(--ink); letter-spacing: -0.02em; margin: 0; }
  .conf-sub em { font-style: italic; color: var(--red); font-weight: 400; }

  /* Vidéo en vedette */
  .conf-feature { position: relative; border-radius: 24px; overflow: hidden; aspect-ratio: 16/9; max-height: 620px; margin: 0 auto clamp(28px,3.5vw,44px); box-shadow: 0 30px 80px rgba(0,0,0,0.20); cursor: pointer; background:#0F0E0C; }
  .conf-feature video, .conf-feature > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  /* Vidéo verticale (téléphone) : affichée entière + fond flou de la même vidéo (style Reels) */
  .conf-feature.is-portrait > video:not(.conf-vbg), .conf-feature.is-portrait > img:not(.conf-vbg) { object-fit: contain; }
  .conf-feature .conf-vbg { object-fit: cover; filter: blur(26px) brightness(0.62); transform: scale(1.2); }
  .conf-feature-scrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,7,6,0.78) 0%, rgba(8,7,6,0.12) 46%, rgba(8,7,6,0) 70%); z-index: 1; }
  .conf-vbadge { position: absolute; top: 18px; left: 18px; z-index: 3; display: inline-flex; align-items: center; gap: 7px; background: rgba(0,0,0,0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color:#fff; padding: 6px 12px; border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
  .conf-vbadge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 3px rgba(200,16,46,0.3); }
  .conf-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 3; width: clamp(64px,7vw,88px); height: clamp(64px,7vw,88px); border-radius: 50%; border: 0; cursor: pointer;
    background: rgba(255,255,255,0.92); color: var(--red); display: flex; align-items: center; justify-content: center; transition: transform .2s ease, background .2s ease; box-shadow: 0 12px 40px rgba(0,0,0,0.35); }
  .conf-play svg { width: 38%; height: 38%; margin-left: 8%; }
  .conf-feature:hover .conf-play { transform: translate(-50%,-50%) scale(1.08); }
  .conf-fcaption { position: absolute; left: 0; bottom: 0; z-index: 3; padding: clamp(22px,3vw,40px); color: #fff; max-width: 760px; }
  .conf-fcaption .conf-stars { color: #ffd34d; font-size: 17px; letter-spacing: 3px; margin-bottom: 12px; }
  .conf-fcaption .conf-fquote { font-family: var(--serif); font-size: clamp(20px,2.3vw,32px); line-height: 1.28; font-weight: 500; letter-spacing: -0.01em; margin: 0 0 16px; text-shadow: 0 2px 20px rgba(0,0,0,0.4); }
  .conf-fcaption .conf-fquote em { font-style: italic; color: #fff; font-weight: 400; }
  .conf-author { display: flex; align-items: center; gap: 13px; }
  .conf-author img { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(255,255,255,0.85); flex-shrink: 0; }
  .conf-author .ca-name { display: block; font-size: 15px; font-weight: 600; line-height: 1.2; }
  .conf-author .ca-loc { display: block; font-size: 12.5px; opacity: 0.85; margin-top: 2px; }
  .conf-author .ca-verif { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.04em; color: #7BE0A3; text-transform: uppercase; }

  /* Mur de cartes (scroll horizontal) */
  .conf-wall { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 4px 18px; margin: 0 -4px; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
  .conf-card { flex: 0 0 clamp(280px,30vw,360px); scroll-snap-align: start; border-radius: 18px; overflow: hidden; background: var(--cream-light); border: 1px solid var(--border); display: flex; flex-direction: column; }
  .conf-card--text { padding: 26px 24px; }
  .conf-card--text .conf-stars { color: var(--red); font-size: 16px; letter-spacing: 2px; margin-bottom: 12px; }
  .conf-card--text .conf-cquote { font-family: var(--serif); font-size: 19px; line-height: 1.4; color: var(--ink); font-weight: 500; margin: 0 0 18px; flex: 1; }
  .conf-card--text .conf-cquote em { font-style: italic; color: var(--red); font-weight: 400; }
  .conf-card .conf-cauthor { display: flex; align-items: center; gap: 12px; margin-top: auto; }
  .conf-card .conf-cauthor img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
  .conf-card .conf-cauthor .ca-name { display: block; font-size: 14.5px; font-weight: 600; color: var(--ink); line-height: 1.2; }
  .conf-card .conf-cauthor .ca-loc { display: block; font-size: 12px; color: var(--gray); margin-top: 2px; }
  .conf-card .conf-cauthor .ca-verif { display: inline-flex; gap: 4px; margin-top: 3px; font-size: 10px; font-weight: 600; letter-spacing: 0.04em; color: #2e9c5a; text-transform: uppercase; }
  .conf-card--video { position: relative; aspect-ratio: 9/16; cursor: pointer; background:#0F0E0C; }
  .conf-card--video video, .conf-card--video > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .conf-card--video .conf-feature-scrim { z-index: 1; }
  .conf-card--video .conf-vbadge { top: 12px; left: 12px; padding: 4px 9px; font-size: 10.5px; }
  .conf-card--video .conf-play { width: 56px; height: 56px; }
  .conf-card--video .conf-ccap { position: absolute; left: 0; bottom: 0; z-index: 3; padding: 16px; color: #fff; }
  .conf-card--video .conf-ccap .conf-stars { color: #ffd34d; font-size: 14px; letter-spacing: 2px; margin-bottom: 6px; }
  .conf-card--video .conf-ccap .ca-name { display: block; font-size: 14px; font-weight: 600; }
  .conf-card--video .conf-ccap .ca-loc { display: block; font-size: 12px; opacity: 0.88; }

  .conf-actions { display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; margin-top: clamp(34px,4vw,52px); }
  .conf-note { width: 100%; text-align: center; margin-top: 12px; font-size: 12.5px; color: var(--gray); }

  /* Lightbox */
  .conf-lightbox { position: fixed; inset: 0; z-index: 10000; background: rgba(8,7,6,0.92); display: none; align-items: center; justify-content: center; padding: 24px; }
  .conf-lightbox.is-open { display: flex; }
  .conf-lightbox video { max-width: min(92vw, 1100px); max-height: 86vh; border-radius: 14px; box-shadow: 0 30px 90px rgba(0,0,0,0.6); background:#000; }
  .conf-lightbox-close { position: absolute; top: 22px; right: 26px; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.5); background: rgba(255,255,255,0.12); color: #fff; font-size: 22px; cursor: pointer; }

  /* Carusel : un seul avis à la fois, même grand cadre (vidéo ou texte) */
  .conf-track { position: relative; }
  .conf-slide { display: none; }
  .conf-slide.is-active { display: block; animation: confFade .55s ease both; }
  @keyframes confFade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
  .conf-slide .conf-feature { margin: 0 auto; }
  .conf-feature--text .conf-vbadge::before { display: none; }

  .conf-nav { display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 30px; }
  .conf-arrow { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--border); background: #fff; color: var(--ink);
    font-size: 22px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
    transition: background .2s ease, color .2s ease, transform .2s ease, border-color .2s ease; }
  .conf-arrow:hover { background: var(--red); color: #fff; border-color: var(--red); transform: translateY(-2px); }
  .conf-dots { display: flex; align-items: center; gap: 9px; }
  .conf-dot { width: 9px; height: 9px; border-radius: 50%; border: 0; padding: 0; cursor: pointer; background: var(--border); transition: width .25s ease, background .25s ease, border-radius .25s ease; }
  .conf-dot.is-active { width: 26px; border-radius: 5px; background: var(--red); }

  /* Barre de navigation superposée sur la vidéo, centrée en bas : flèche · points · flèche */
  .conf-feature-nav { position: absolute; z-index: 5; bottom: 15mm; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 14px;
    background: rgba(0,0,0,0.32); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); padding: 8px 14px; border-radius: 999px; }
  .conf-feature-nav .conf-arrow { width: 38px; height: 38px; font-size: 20px; background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.5); color: #fff; }
  .conf-feature-nav .conf-arrow:hover { background: var(--red); border-color: var(--red); color: #fff; }
  .conf-feature-nav .conf-dots { display: flex; align-items: center; gap: 8px; }
  .conf-feature-nav .conf-dot { width: 8px; height: 8px; border-radius: 50%; border: 0; padding: 0; cursor: pointer; background: rgba(255,255,255,0.5); transition: width .25s ease, background .25s ease, border-radius .25s ease; }
  .conf-feature-nav .conf-dot.is-active { width: 22px; border-radius: 5px; background: #fff; }

  @media (max-width: 760px) {
    .conf-feature { aspect-ratio: 4/3; }
    .conf-feature-nav { bottom: 12px; }
  }

/* --- section --- */

.proces-section {
    background: var(--cream);
    padding: 80px 0;
  }
  .proces-stage-wrap {
    position: relative;
    margin: 60px auto 0;
    max-width: 1480px;
  }
  .proces-stage {
    position: relative;
    background: var(--cream-light);
    border: 1px solid var(--border);
    border-radius: 32px;
    padding: 64px 48px 56px;
    overflow: visible;
  }
  .proces-watermark {
    position: absolute; top: 0; left: 50%; width: 100vw; margin-left: -50vw;
    pointer-events: none; user-select: none; transform: translateY(-38%);
    height: 1em; line-height: 1; text-align: center; text-transform: uppercase;
    font-family: var(--serif); font-size: clamp(64px, 11vw, 180px);
    font-weight: 500; letter-spacing: -0.06em; z-index: 2;
  }
  .proces-watermark .wm-half { position: absolute; inset: 0; width: 100%; display: block; }
  .proces-watermark .wm-top { color: transparent; -webkit-text-stroke: 1.4px rgba(15,15,15,0.30); clip-path: inset(0 0 62% 0); }
  .proces-watermark .wm-bottom { color: var(--cream-dark); opacity: 0.65; clip-path: inset(38% 0 0 0); }
  .proces-intro {
    max-width: 760px; margin: 0 auto 48px; text-align: center;
  }
  .proces-intro .bubble-tag {
    display: inline-block; background: var(--red-soft); color: var(--red);
    padding: 4px 12px; border-radius: 4px; font-size: 11px; font-weight: 600;
    letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 14px;
  }
  .proces-intro h2 {
    font-family: var(--serif); font-size: clamp(28px, 3.2vw, 44px); font-weight: 500;
    color: var(--ink); letter-spacing: -0.02em; line-height: 1.05; margin-bottom: 14px;
  }
  .proces-intro h2 em { font-style: italic; color: var(--red); font-weight: 400; }
  .proces-intro p { font-size: 15px; color: var(--gray); line-height: 1.6; margin: 0; }

  .proces-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    position: relative;
  }
  .proces-step {
    background: white;
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 28px 22px;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  .proces-step:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0,0,0,0.06);
  }
  .proces-step-num {
    width: 38px; height: 38px;
    background: var(--ink);
    color: var(--cream);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--serif);
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 18px;
  }
  .proces-step h4 {
    font-family: var(--serif);
    font-size: 19px;
    font-weight: 500;
    color: var(--ink);
    margin-bottom: 8px;
    letter-spacing: -0.01em;
    line-height: 1.2;
  }
  .proces-step h4 em { font-style: italic; color: var(--red); font-weight: 400; }
  .proces-step p {
    font-size: 13px;
    color: var(--gray);
    line-height: 1.5;
    margin: 0 0 12px;
  }
  .proces-step-time {
    font-size: 11px;
    font-weight: 600;
    color: var(--red);
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  @media (max-width: 1100px) {
    .proces-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 700px) {
    .proces-grid { grid-template-columns: 1fr; }
    .proces-stage { padding: 48px 24px 36px; }
  }

/* --- section --- */

.avis-overlay {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(15,14,12,0.55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
    display: none; align-items: flex-start; justify-content: center;
    padding: clamp(16px,5vh,64px) 16px; overflow-y: auto;
  }
  .avis-overlay.open { display: flex; }
  .avis-modal {
    background: var(--cream-light, #FDFBF7); color: var(--ink, #0F0F0F);
    width: 100%; max-width: 560px; border-radius: 22px;
    box-shadow: 0 40px 100px rgba(0,0,0,0.4); position: relative;
    padding: clamp(24px,4vw,40px); font-family: var(--sans);
    animation: avisIn .28s cubic-bezier(.22,1,.36,1);
  }
  @keyframes avisIn { from { opacity:0; transform: translateY(16px); } to { opacity:1; transform:none; } }
  .avis-close { position: absolute; top: 16px; right: 16px; width: 38px; height: 38px; border-radius: 50%;
    border: 1px solid var(--border); background: #fff; font-size: 20px; line-height: 1; cursor: pointer; color: var(--ink); }
  .avis-close:hover { background: var(--cream-dark, #EDE8DC); }
  .avis-modal h3 { font-family: var(--serif); font-size: clamp(24px,3vw,32px); font-weight: 600; margin: 0 0 4px; }
  .avis-modal .avis-sub { font-size: 13.5px; color: var(--muted,#6b6457); margin-bottom: 22px; }
  .avis-field { margin-bottom: 16px; }
  .avis-field label { display: block; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--muted,#6b6457); margin-bottom: 7px; }
  .avis-field input[type=text], .avis-field select, .avis-field textarea {
    width: 100%; font-family: var(--sans); font-size: 15px; color: var(--ink);
    padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: #fff; outline: none;
  }
  .avis-field input:focus, .avis-field select:focus, .avis-field textarea:focus { border-color: var(--red); }
  .avis-field textarea { resize: vertical; min-height: 96px; }
  .avis-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  /* étoiles */
  .avis-stars { display: inline-flex; gap: 6px; }
  .avis-stars button { background: none; border: 0; cursor: pointer; font-size: 30px; line-height: 1; color: #d9d2c4; padding: 0; transition: color .12s, transform .12s; }
  .avis-stars button:hover { transform: scale(1.12); }
  .avis-stars button.on { color: var(--red); }
  /* upload */
  .avis-drop { border: 1.5px dashed var(--border); border-radius: 12px; padding: 16px; text-align: center;
    font-size: 13px; color: var(--muted,#6b6457); cursor: pointer; background: #fff; }
  .avis-drop:hover { border-color: var(--red); color: var(--red); }
  .avis-drop input { display: none; }
  .avis-toggle { display: inline-flex; background: var(--cream-dark,#EDE8DC); border-radius: 100px; padding: 4px; gap: 4px; }
  .at-opt { border: 0; background: none; padding: 9px 18px; border-radius: 100px; font-size: 13px; font-weight: 600; color: var(--muted,#6b6457); cursor: pointer; transition: background .18s, color .18s, box-shadow .18s; }
  .at-opt.is-on { background: #fff; color: var(--ink); box-shadow: 0 1px 5px rgba(0,0,0,0.12); }
  .avis-drop--video { border-color: var(--red); color: var(--red); background: var(--red-soft, #FBE9EC); font-weight: 600; }
  .avis-drop--video:hover { background: #f8dde2; }
  .avis-video-preview { margin-top: 10px; display: none; }
  .avis-video-preview.has { display: block; }
  .avis-video-preview video { width: 100%; max-height: 200px; border-radius: 12px; background: #000; display: block; }
  .avis-video-remove { margin-top: 8px; background: none; border: 0; color: var(--red); font-size: 12.5px; font-weight: 600; cursor: pointer; padding: 0; }
  .avis-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
  .avis-thumb { position: relative; width: 70px; height: 70px; border-radius: 10px; overflow: hidden; border: 1px solid var(--border); }
  .avis-thumb img { width: 100%; height: 100%; object-fit: cover; }
  .avis-thumb button { position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; border-radius: 50%; border: 0;
    background: rgba(0,0,0,.6); color: #fff; font-size: 13px; line-height: 1; cursor: pointer; }
  .avis-profile-row { display: flex; align-items: center; gap: 14px; }
  .avis-profile-pic { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 1px solid var(--border); background: var(--cream-dark,#EDE8DC); flex-shrink: 0; }
  .avis-submit { width: 100%; margin-top: 8px; background: var(--red); color: #fff; border: 0; border-radius: 100px;
    font-family: var(--sans); font-size: 15px; font-weight: 600; padding: 15px; cursor: pointer; box-shadow: 0 12px 30px rgba(200,16,46,.3); }
  .avis-submit:hover { background: var(--red-dark, #A60E13); }
  .avis-note { font-size: 11.5px; color: var(--muted,#6b6457); text-align: center; margin-top: 12px; }
  .pb-form-consent { margin-top: 10px; }
  .pb-consent-label { display: flex; align-items: flex-start; gap: 10px; font-size: 12px; line-height: 1.5; color: var(--muted,#6b6457); cursor: pointer; }
  .pb-consent-label input { flex-shrink: 0; width: 16px; height: 16px; margin-top: 2px; accent-color: var(--red); }
  .pb-consent-label a { color: var(--red); }
  .avis-err { color: var(--red); font-size: 12.5px; margin-top: 6px; display: none; }
  /* état merci */
  .avis-thanks { display: none; text-align: center; padding: 20px 0; }
  .avis-thanks .at-check { width: 64px; height: 64px; border-radius: 50%; background: var(--red-soft,#FBE9EC); color: var(--red);
    display: flex; align-items: center; justify-content: center; font-size: 32px; margin: 0 auto 18px; }
  .avis-thanks h3 { margin-bottom: 8px; }
  .avis-thanks p { font-size: 14px; color: var(--muted,#6b6457); }
  .avis-modal.sent .avis-form { display: none; }
  .avis-modal.sent .avis-thanks { display: block; }

/* --- section --- */

.mobile-contact-bar { display: none; }
  @media (max-width: 768px) {
    .mobile-contact-bar {
      position: fixed; left: 0; right: 0; bottom: 0; z-index: 1000;
      display: flex;
      box-shadow: 0 -4px 20px rgba(0,0,0,0.18);
      padding-bottom: env(safe-area-inset-bottom, 0px);
    }
    .mobile-contact-bar .mcb-btn {
      flex: 1 1 0;
      display: flex; align-items: center; justify-content: center; gap: 9px;
      padding: 15px 8px;
      font-family: 'Inter', system-ui, -apple-system, sans-serif;
      font-size: 15px; font-weight: 600; letter-spacing: 0.01em;
      text-decoration: none; color: #fff;
    }
    .mobile-contact-bar .mcb-btn svg { width: 19px; height: 19px; flex-shrink: 0; }
    .mobile-contact-bar .mcb-call { background: #C8102E; }
    .mobile-contact-bar .mcb-call:active { background: #a60d26; }
    .mobile-contact-bar .mcb-email { background: #1a1a1a; }
    .mobile-contact-bar .mcb-email:active { background: #000; }
    body { padding-bottom: calc(54px + env(safe-area-inset-bottom, 0px)); }
  }

/* ===========================================================================
   TYPOGRAPHIE UNIFIÉE — un seul font (Inter), titres sans-serif bold uppercase,
   tailles réduites (décision client, 30 juil). Les watermarks géants (classes
   dédiées, pas des h1-h4) gardent leurs tailles.
   =========================================================================== */
h1, h2, h3, h4 {
  font-family: var(--sans) !important;
  font-weight: 800 !important;
  font-style: normal !important;
  text-transform: uppercase;
  letter-spacing: -0.015em;
  line-height: 1.12;
}
h1 { font-size: clamp(28px, 4.2vw, 56px) !important; }
h2 { font-size: clamp(22px, 3vw, 40px) !important; }
h3 { font-size: clamp(15px, 1.6vw, 21px) !important; }
h1 em, h2 em, h3 em, h4 em {
  font-family: var(--sans) !important;
  font-style: normal !important;
  font-weight: 800 !important;
  color: inherit !important;
}

/* Teaser héros : 1re ligne en contour creux, 2e ligne pleine en rouge (demande client) */
.hero-teaser .hero-teaser-line:last-child {
  -webkit-text-stroke: 0;
  text-stroke: 0;
  color: var(--red);
}

/* Titre héros (état 2) plus petit — tient sur deux lignes exactement (demande client) */
.hero-full-content h1 {
  font-size: clamp(22px, 2.9vw, 38px) !important;
  line-height: 1.15;
}

/* Section UN SEUL SYSTÈME : seul le titre gras reste — ligne 1 noire, ligne 2 rouge (demande client) */
.morph-overlay h2 { color: var(--ink) !important; }
.morph-overlay h2 em { color: var(--red) !important; }

/* Cartes du slider POLISTIBRICK vs CLASSIQUE : titre sur UNE ligne — texte plus petit,
   cartes un peu plus larges (demande client) */
.info-card { width: clamp(320px, 34vw, 500px); max-width: 94%; }
.info-card h4 { font-size: 14px !important; white-space: nowrap; letter-spacing: 0; }
.card-team, .card-materials { font-size: 12.5px; }

/* Punte de la grila de sisteme spre pagina de preţuri */
.sistem-pret-punte {
  text-align: center;
  margin: 26px auto 0;
  max-width: 620px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--gray, #6b6b6b);
}
.sistem-pret-punte a {
  color: var(--red, #e2211c);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}
.sistem-pret-punte a:hover { opacity: .78; }

/* Link direct în meniul ☰ — la acelaşi nivel cu titlurile de grup, fără acordeon */
.nav-drawer-direct {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 15px; font-weight: 700; color: #000; text-decoration: none;
  padding: 13px 12px; border-radius: 10px; transition: background .15s ease;
}
.nav-drawer-direct:hover { background: rgba(255,255,255,0.55); }
