/* ============================================================
   EFFICIENZA CASA — design tokens
   Palette: white + warm light grey, deep emerald (action),
   warm orange (single attention accent), dark grey text.
   ============================================================ */
:root{
  --bg:#ffffff;
  --bg-soft:#f3f6f2;
  --bg-soft-2:#eaf0e9;
  --ink:#15231c;
  --text:#4e5c54;
  --muted:#869189;
  --green:#0e7a4d;
  --green-deep:#0a5c3a;
  --green-tint:#e7f3ec;
  --green-line:#cfe6d8;
  --orange:#f0871e;
  --orange-deep:#df6f0a;
  --orange-tint:#fdf0e0;
  --line:#e3e9e1;
  --radius:24px;
  --radius-sm:16px;
  --radius-lg:32px;
  --shadow-sm:0 2px 10px rgba(18,40,28,.05);
  --shadow-md:0 16px 40px rgba(18,40,28,.08);
  --shadow-lg:0 36px 80px rgba(18,40,28,.13);
  --shadow-green:0 20px 45px rgba(14,122,77,.28);
  --maxw:1180px;
  --ease:cubic-bezier(.16,.84,.44,1);
  --font-display:'Plus Jakarta Sans',sans-serif;
  --font-body:'Inter',sans-serif;
  --font-mono:'Inter',monospace;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  color:var(--text);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink);line-height:1.12;font-weight:800;letter-spacing:-.02em}
p{font-size:clamp(1rem,1.4vw,1.12rem)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--green);color:#fff}

/* grain overlay for premium texture */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.04;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@media (max-width: 767px) {
  .founder {
    flex-direction: column;
  }

  .founder-portrait {
    width: 100% !important;
    max-width: 100% !important;
  }

  .founder-photo {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block;
  }
}
/* ---------- layout helpers ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;width:100%}
.section{padding:clamp(72px,11vw,140px) 0;position:relative}
.section--soft{background:var(--bg-soft)}
.eyebrow{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--green);font-weight:700;display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--green);opacity:.6}
.eyebrow.center{justify-content:center}
.eyebrow.center::before{display:none}
.eyebrow.light{color:#7fe0b0}
.eyebrow.light::before{background:#7fe0b0}
.section-title{font-size:clamp(1.85rem,4.4vw,3rem);max-width:18ch}
.section-title.center{margin:0 auto;text-align:center;max-width:22ch}
.lead{font-size:clamp(1.05rem,1.6vw,1.22rem);color:var(--text);max-width:62ch}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:700;
  font-size:1.02rem;padding:18px 30px;border-radius:60px;cursor:pointer;border:none;position:relative;
  overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease);white-space:nowrap;
  isolation:isolate;letter-spacing:-.01em;
}
.btn svg{width:20px;height:20px;transition:transform .35s var(--ease)}
.btn-primary{background:var(--green);color:#fff;box-shadow:var(--shadow-green)}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 26px 55px rgba(14,122,77,.36)}
.btn-primary:hover svg{transform:translateX(5px)}
/* shine sweep */
.btn-primary::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.32) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--ease);
}
.btn-primary:hover::after{transform:translateX(120%)}
.btn-orange{background:var(--orange);color:#fff;box-shadow:0 18px 40px rgba(240,135,30,.32)}
.btn-orange:hover{transform:translateY(-3px);box-shadow:0 26px 55px rgba(240,135,30,.4)}
.btn-orange:hover svg{transform:translateX(5px)}
.btn-ghost{background:transparent;color:var(--ink);padding:18px 8px}
.btn-ghost:hover svg{transform:translateX(5px)}
.btn-block{width:100%;justify-content:center}
.btn-lg{padding:22px 40px;font-size:1.12rem}

.link-underline{position:relative;font-weight:600;color:var(--ink);display:inline-flex;align-items:center;gap:8px}
.link-underline::after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:100%;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.link-underline:hover::after{transform:scaleX(1)}
.link-underline svg{width:18px;height:18px;transition:transform .35s var(--ease)}
.link-underline:hover svg{transform:translateX(4px)}

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;padding:18px 0;
  transition:background .4s var(--ease),box-shadow .4s var(--ease),padding .4s var(--ease),backdrop-filter .4s;
}
.site-header.scrolled{
  background:rgba(255,255,255,.82);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  box-shadow:0 1px 0 var(--line),0 10px 30px rgba(18,40,28,.06);padding:12px 0;
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:800;color:var(--ink);font-size:1.18rem;letter-spacing:-.02em}
.brand .mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,var(--green),var(--green-deep));display:grid;place-items:center;box-shadow:var(--shadow-green);flex:none}
.brand .mark svg{width:23px;height:23px;color:#fff}
.brand b{color:var(--green)}
.nav-links{display:flex;align-items:center;gap:34px;list-style:none}
.nav-links a{font-weight:600;font-size:.96rem;color:var(--ink);position:relative;padding:4px 0;opacity:.78;transition:opacity .25s}
.nav-links a:hover{opacity:1}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:100%;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{display:flex;align-items:center;gap:14px}
.nav .btn{padding:13px 24px;font-size:.96rem}
.burger{display:none;background:none;border:none;cursor:pointer;width:44px;height:44px;border-radius:12px;flex:none}
.burger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px auto;transition:.3s var(--ease);border-radius:2px}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;padding:clamp(130px,17vw,180px) 0 clamp(50px,7vw,80px);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:-2;pointer-events:none}
.orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5}
.orb-1{width:520px;height:520px;background:radial-gradient(circle,rgba(14,122,77,.22),transparent 70%);top:-160px;right:-120px}
.orb-2{width:420px;height:420px;background:radial-gradient(circle,rgba(240,135,30,.13),transparent 70%);bottom:-120px;left:-100px}
.hero-grid-lines{position:absolute;inset:0;z-index:-1;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000,transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000,transparent 75%);
}
.hero-inner{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(30px,5vw,72px);align-items:center}
.hero-copy{max-width:620px}
.hero h1{font-size:clamp(2.3rem,5.2vw,4rem);margin-bottom:26px}
.hero h1 .q{display:block;font-size:.52em;font-weight:600;color:var(--green);letter-spacing:0;margin-bottom:14px}
.hero h1 .hl{position:relative;white-space:nowrap}
.hero h1 .hl::after{content:"";position:absolute;left:0;right:0;bottom:.08em;height:.16em;background:var(--orange-tint);border-radius:4px;z-index:-1}
.hero .sub{font-size:clamp(1.05rem,1.65vw,1.2rem);color:var(--text);max-width:54ch;margin-bottom:36px}
.hero .sub b{color:var(--ink);font-weight:700}
.hero .sub .pct{color:var(--orange-deep)}
.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}

/* trust micro-strip */
.trust-strip{margin-top:clamp(36px,5vw,56px);border-top:1px solid var(--line);padding-top:30px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.trust-item{display:flex;align-items:center;gap:12px}
.trust-item .ti-ic{width:38px;height:38px;border-radius:11px;background:var(--green-tint);color:var(--green);display:grid;place-items:center;flex:none}
.trust-item .ti-ic svg{width:19px;height:19px}
.trust-item span{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);font-weight:700;line-height:1.35}

/* ---------- the SDI scanner (signature element) ---------- */
.scanner-wrap{position:relative;display:grid;place-items:center}
.scanner-card{
  position:relative;width:100%;max-width:480px;aspect-ratio:1/1;border-radius:var(--radius-lg);
  background:radial-gradient(circle at 50% 42%,#fbfdfb,#eef4ee 70%,#e6efe6);
  border:1px solid var(--green-line);box-shadow:var(--shadow-lg);overflow:hidden;
}
.scanner-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,rgba(14,122,77,.08),transparent 60%)}
.scanner-readout{position:absolute;top:18px;left:20px;right:20px;display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;color:var(--green);text-transform:uppercase;z-index:3}
.scanner-readout .dotlive{display:inline-flex;align-items:center;gap:7px}
.scanner-readout .dotlive::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 0 rgba(240,135,30,.5);animation:livePulse 1.8s infinite}
.scanner-svg{width:100%;height:100%;display:block}
.scanner-foot{position:absolute;left:20px;right:20px;bottom:16px;display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;z-index:3}
.scanner-foot b{color:var(--green)}
/* floating finding chip */
.finding-chip{
  position:absolute;z-index:4;background:#fff;border:1px solid var(--orange);color:var(--orange-deep);
  font-family:var(--font-mono);font-weight:700;font-size:.62rem;letter-spacing:.04em;padding:7px 11px;border-radius:30px;
  box-shadow:0 10px 26px rgba(240,135,30,.22);display:flex;align-items:center;gap:7px;top:26%;right:-6%;
  animation:floatChip 4s ease-in-out infinite;
}
.finding-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange)}
.chip-2{top:auto;bottom:20%;right:auto;left:-6%;border-color:var(--green);color:var(--green);box-shadow:0 10px 26px rgba(14,122,77,.2);animation-delay:1.2s}
.chip-2::before{background:var(--green)}

@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(240,135,30,.5)}70%{box-shadow:0 0 0 8px rgba(240,135,30,0)}100%{box-shadow:0 0 0 0 rgba(240,135,30,0)}}
@keyframes floatChip{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* SVG scanner animations */
.sc-ring{fill:none;stroke:var(--green);opacity:.16;stroke-width:1}
.sc-ping{fill:none;stroke:var(--green);stroke-width:1.4;transform-box:fill-box;transform-origin:center;opacity:0}
.sc-ticks{transform-box:fill-box;transform-origin:center;animation:scRotate 26s linear infinite}
.sc-ticks line{stroke:var(--green);opacity:.3;stroke-width:1.4}
.sc-house{fill:none;stroke:var(--green-deep);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.sc-house-fill{fill:rgba(14,122,77,.05)}
.sc-beam{transform-box:fill-box;transform-origin:center;animation:scScan 3.6s var(--ease) infinite}
.sc-node{transform-box:fill-box;transform-origin:center}
.sc-node-dot{fill:var(--green)}
.sc-node-dot.warn{fill:var(--orange)}
.sc-node-halo{fill:none;stroke:var(--green);stroke-width:1.6;transform-box:fill-box;transform-origin:center;animation:scHalo 2.4s ease-out infinite}
.sc-node-halo.warn{stroke:var(--orange)}
.sc-conn{stroke:var(--green);opacity:.35;stroke-width:1;stroke-dasharray:3 3}
.sc-conn.warn{stroke:var(--orange);opacity:.6}
.sc-label{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.12em;fill:var(--green-deep);font-weight:700}
.sc-label.warn{fill:var(--orange-deep)}

@keyframes scRotate{to{transform:rotate(360deg)}}
@keyframes scScan{0%{transform:translateY(-120px);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateY(120px);opacity:0}}
@keyframes scHalo{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.6);opacity:0}}
@keyframes scPing{0%{transform:scale(.25);opacity:.7}100%{transform:scale(1);opacity:0}}

/* ============================================================
   SECTION 2 — PROBLEM
   ============================================================ */
.problem-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(40px,6vw,80px);align-items:center}
.problem-visual{position:relative}
.surprise-stack{display:flex;flex-direction:column;gap:16px}
.surprise{
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:var(--radius-sm);
  padding:20px 22px;box-shadow:var(--shadow-sm);display:flex;align-items:flex-start;gap:14px;position:relative;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
}
.surprise:hover{transform:translateX(6px);box-shadow:var(--shadow-md)}
.surprise .s-ic{width:34px;height:34px;border-radius:10px;background:var(--orange-tint);color:var(--orange-deep);display:grid;place-items:center;flex:none}
.surprise .s-ic svg{width:18px;height:18px}
.surprise p{font-size:.98rem;color:var(--ink);font-style:italic;font-weight:500;margin:0}
.surprise .cost{font-family:var(--font-mono);font-size:.66rem;color:var(--orange-deep);font-weight:700;letter-spacing:.06em;margin-top:6px;display:block;text-transform:uppercase}
.problem-copy p{margin-bottom:22px}
.problem-copy p:last-child{margin-bottom:0}
.problem-copy .emph{background:var(--ink); margin-bottom: 13px; color:#fff;border-radius:var(--radius-sm);padding:24px 26px;font-weight:600;font-size:1.08rem;box-shadow:var(--shadow-md)}
.problem-copy .emph b{color:var(--orange)}
.problem-copy .closing{font-size:1.06rem;color:var(--ink);font-weight:500}



/* ============================================================
   Il documento che cambia tutto SECTION animation
   ============================================================ */
/* =========================================
   1. Card Hover Effects (Lift & Shadow)
   ========================================= */
   /* Contenitore per allineare a sinistra e destra */
.footer-bottom {
  display: flex;
  justify-content: space-between; 
  align-items: center;
  flex-wrap: wrap; /* Evita sovrapposizioni su schermi piccoli */
  gap: 16px;
  margin-top: 20px;
}

/* Reset del margine del testo per un allineamento perfetto */
.footer-meta {
  margin: 0 !important;
}

/* Stile del tuo brand credit */
.footer-credit {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #a2b4a9;
}

.footer-credit img {
  height: 18px; /* Ridotto leggermente per abbinarsi all'altezza del testo */
  width: auto;
  object-fit: contain;
}

.footer-credit a {
  color: #4fe3a1;
  text-decoration: none;
  transition: color 0.2s ease;
}

.footer-credit a:hover {
  color: #ffffff;
}

/* Versione Mobile: se lo schermo è piccolo, si impilano elegantemente */
@media (max-width: 768px) {
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start; /* Rimangono a sinistra su mobile per ordine visivo */
    gap: 12px;
  }
}
   
   
/* =========================================
   1. Grid Layout (Senza Sfondo)
   ========================================= */
.price-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 64px;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 24px;
  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* =========================================
   2. Typography & Elementi Statici Left Column
   ========================================= */
.price-copy .eyebrow {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #4fe3a1;
  margin-bottom: 16px;
}

.price-copy .eyebrow::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 2px;
  background-color: #4fe3a1;
  margin-right: 10px;
}

.price-copy .section-title {
  font-size: 42px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 24px 0;
}

.price-copy p {
  font-size: 16px;
  line-height: 1.6;
  color: #a2b4a9;
  margin: 0 0 16px 0;
}


/* =========================================
   1. Alignment For The Top Inner Row
   ========================================= */
.footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 24px;
  padding-bottom: 24px;
}

/* =========================================
   2. Inline Social Links & Micro-Animations
   ========================================= */
.footer-social {
  display: inline-flex;
  align-items: center;
  gap: 12px; /* Clean scannable separation gap */
}

.footer-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #a2b4a9; /* Matches your muted text color */
  
  /* Super smooth custom transition curve */
  transition: 
    transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),
    background-color 0.3s ease,
    border-color 0.3s ease,
    color 0.3s ease,
    box-shadow 0.4s ease;
}

.footer-social a svg {
  width: 18px;
  height: 18px;
  transition: transform 0.3s ease;
}

/* --- HOVER STATE --- */
.footer-social a:hover {
  color: #ffffff;
  background-color: rgba(79, 227, 161, 0.08); /* Gives a soft modern brand-green tint */
  border-color: #4fe3a1; /* Pops out with bright brand accent green */
  transform: translateY(-4px); /* Clean magnetic lift feel */
  box-shadow: 0 10px 20px rgba(79, 227, 161, 0.15);
}

/* Extra icon bounce inside the moving circle */
.footer-social a:hover svg {
  transform: scale(1.1);
}

/* =========================================
   3. Mobile Safety Guardrails
   ========================================= */
@media (max-width: 768px) {
  .footer-inner {
    flex-direction: column;
    align-items: flex-start; /* Neatly stacks everything cleanly to the left on mobile screens */
    gap: 20px;
  }
  
  .footer-social {
    order: 2; /* Keeps structural visual flow standard across devices */
  }
}

/* =========================================
   3. Card: Movimento Fluido & Micro-Elementi
   ========================================= */
.price-figure {
  /* Sfondo semi-trasparente che si adatta al tuo background */
  background: rgba(255, 255, 255, 0.02); 
  border: 1px solid rgba(255, 255, 255, 0.08); 
  border-radius: 24px;
  padding: 48px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
  
  /* Transizione ultra-fluida (Cubic Bezier) per l'effetto "lift" */
  transition: 
    transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), 
    border-color 0.4s ease, 
    box-shadow 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

/* --- ANIMAZIONE HOVER DELLA CARD --- */
.price-figure:hover {
  transform: translateY(-12px) scale(1.01); /* Movimento verso l'alto controllato */
  border-color: rgba(79, 227, 161, 0.3); /* Il bordo si colora leggermente del verde brand */
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4);
}

/* --- MICRO ELEMENTO 1: Tag superiore --- */
.pf-tag {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #4fe3a1;
  margin-bottom: 16px;
  transition: letter-spacing 0.4s ease;
}
/* Espande leggermente lo spazio tra le lettere al passaggio del mouse */
.price-figure:hover .pf-tag {
  letter-spacing: 0.13em;
}

/* --- MICRO ELEMENTO 2: Cifra Investimento --- */
.pf-cost {
  font-size: 56px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #ffffff;
  line-height: 1;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.pf-cost small {
  display: block;
  font-size: 14px;
  color: #a2b4a9;
  text-transform: lowercase;
  margin-bottom: 6px;
  letter-spacing: 0.02em;
}
/* Sposta impercettibilmente il prezzo principale in avanti */
.price-figure:hover .pf-cost {
  transform: translateX(4px);
}

/* --- MICRO ELEMENTO 3: Linea di Divisione --- */
.vs-row {
  margin-top: 36px;
  padding-top: 36px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  transition: border-color 0.4s ease;
}
.price-figure:hover .vs-row {
  border-top-color: rgba(255, 159, 67, 0.2); /* La linea vira verso l'arancione di avviso */
}

/* --- MICRO ELEMENTO 4: Cifra Sorpresa (Pericolo) --- */
.vs-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #ff9f43; /* Colore ambra/arancione originale */
  margin-bottom: 12px;
}

.vs-amount {
  font-size: 38px;
  font-weight: 700;
  color: #ff9f43;
  letter-spacing: -0.02em;
  margin-bottom: 10px;
  line-height: 1;
  display: inline-block;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), text-shadow 0.4s ease;
}
/* Fa risaltare il costo del rischio illuminandolo e scalandolo leggermente */
.price-figure:hover .vs-amount {
  transform: scale(1.03);
  text-shadow: 0 0 15px rgba(255, 159, 67, 0.25);
}

.vs-desc {
  font-size: 14px;
  line-height: 1.5;
  color: #a2b4a9;
}

/* =========================================
   4. Responsive Grid (Mobile standard)
   ========================================= */
@media (max-width: 992px) {
  .price-grid {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 20px;
  }
  .price-copy .section-title { font-size: 34px; }
  .price-figure { padding: 36px; }
}   
   
   
.ccard {
  /* Smooth transition for the lift effect */
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
  will-change: transform; /* Optimizes performance */
}

.ccard:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.1);
}

/* =========================================
   2. List Items (Slight Right Shift)
   ========================================= */
.ccard ul li {
  transition: transform 0.2s ease-out, color 0.2s ease;
}

.ccard ul li:hover {
  transform: translateX(6px);
}

/* =========================================
   3. Icon Micro-Interactions (Crosses vs. Ticks)
   ========================================= */
.li-ic svg {
  transition: transform 0.3s ease, color 0.3s ease;
}

/* Old Way (Crosses): Rotate slightly on hover */
.ccard--old ul li:hover .li-ic svg {
  transform: rotate(90deg) scale(1.1);
  color: #e63946; /* Optional: Highlights red */
}

/* New Way (Ticks): Pop and scale on hover */
.ccard--new ul li:hover .li-ic svg {
  transform: scale(1.25) rotate(-5deg);
  color: #2a9d8f; /* Optional: Highlights green */
}

/* =========================================
   4. Badge Attention Grabber
   ========================================= */
.badge-best {
  transition: transform 0.3s ease;
}

/* Slightly enlarges the badge when hovering the new card */
.ccard--new:hover .badge-best {
  transform: scale(1.05) translateY(-2px);
}

/* =========================================
   5. The Lock Line (Wiggle Animation)
   ========================================= */
.lock-line {
  transition: color 0.3s ease;
  cursor: default;
}

.lock-line svg {
  transition: transform 0.3s ease;
}

/* Trigger the wiggle animation when hovering over the lock text */
.lock-line:hover svg {
  animation: lock-wiggle 0.5s ease-in-out;
  color: #2a9d8f; /* Optional: Match the brand color */
}

@keyframes lock-wiggle {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-12deg) scale(1.1); }
  75% { transform: rotate(12deg) scale(1.1); }
}






/* ============================================================
   SECTION 3 — SOLUTION
   ============================================================ */
.solution-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:start;margin-bottom:clamp(48px,6vw,76px)}
.solution-head .copy p{margin-bottom:20px}
.solution-head .copy p:last-child{margin-bottom:0}
.mri-callout{
  background:linear-gradient(150deg,var(--green-tint),#fff);border:1px solid var(--green-line);border-radius:var(--radius);
  padding:30px;box-shadow:var(--shadow-md);position:relative;overflow:hidden;
}
.mri-callout::before{content:"";position:absolute;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(14,122,77,.12),transparent 70%);top:-60px;right:-50px}
.mri-callout .tag{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--green);font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:9px}
.mri-callout .tag svg{width:18px;height:18px}
.mri-callout h3{font-size:1.5rem;margin-bottom:10px}
.mri-callout p{font-size:1rem;margin:0;color:var(--text)}
.mri-callout .result{margin-top:20px;display:flex;flex-wrap:wrap;gap:10px}
.result-pill{font-family:var(--font-mono);font-size:.7rem;font-weight:700;letter-spacing:.04em;background:#fff;border:1px solid var(--green-line);color:var(--green-deep);padding:8px 14px;border-radius:30px;display:flex;align-items:center;gap:7px}
.result-pill svg{width:14px;height:14px}

.benefit-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.bcard{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px;
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease);
}
.bcard::after{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:linear-gradient(90deg,var(--green),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.bcard:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:var(--green-line)}
.bcard:hover::after{transform:scaleX(1)}
.bcard .b-ic{width:58px;height:58px;border-radius:16px;background:var(--green-tint);color:var(--green);display:grid;place-items:center;margin-bottom:22px;transition:transform .45s var(--ease),background .45s}
.bcard:hover .b-ic{transform:rotate(-8deg) scale(1.06);background:var(--green);color:#fff}
.bcard .b-ic svg{width:27px;height:27px}
.bcard .b-num{position:absolute;top:24px;right:28px;font-family:var(--font-mono);font-size:.8rem;color:var(--green-line);font-weight:700}
.bcard h3{font-size:1.18rem;line-height:1.35}

/* ============================================================
   SECTION 4 — FINANCIAL PLAN (comparison)
   ============================================================ */
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch;margin-top:clamp(40px,5vw,64px)}
.compare-copy{max-width:60ch;margin-top:24px}
.compare-copy p{margin-bottom:18px}
.compare-copy p:last-child{margin-bottom:0}
.compare-copy .seal{font-size:1.3rem;font-weight:800;color:var(--green-deep);font-family:var(--font-display);letter-spacing:-.02em}
.ccard{border-radius:var(--radius);padding:34px 32px;position:relative;display:flex;flex-direction:column}
.ccard .c-tag{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;margin-bottom:8px}
.ccard h3{font-size:1.45rem;margin-bottom:24px}
.ccard ul{list-style:none;display:flex;flex-direction:column;gap:16px;flex:1}
.ccard li{display:flex;align-items:flex-start;gap:13px;font-size:1rem;line-height:1.45}
.ccard li .li-ic{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;flex:none;margin-top:1px}
.ccard li .li-ic svg{width:14px;height:14px}
.ccard--old{background:#fff;border:1px solid var(--line);color:var(--muted)}
.ccard--old .c-tag{color:var(--muted)}
.ccard--old h3{color:#7a857d}
.ccard--old li .li-ic{background:#f0f1ef;color:#b6beb6}
.ccard--new{background:linear-gradient(160deg,var(--green-deep),var(--green));color:#fff;box-shadow:var(--shadow-green);overflow:hidden}
.ccard--new::before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 70%);top:-90px;right:-70px;pointer-events:none}
.ccard--new::after{content:"";position:absolute;inset:0;border-radius:var(--radius);border:1px solid rgba(255,255,255,.18);pointer-events:none}
.ccard--new .c-tag{color:#9ff0c5}
.ccard--new h3{color:#fff}
.ccard--new li{color:rgba(255,255,255,.94)}
.ccard--new li .li-ic{background:rgba(255,255,255,.18);color:#fff}
.ccard .badge-best{position:absolute;top:22px;right:22px;background:var(--orange);color:#fff;font-family:var(--font-mono);font-size:.62rem;font-weight:700;letter-spacing:.08em;padding:6px 12px;border-radius:30px;text-transform:uppercase}
.ccard--new .lock-line{margin-top:24px;padding-top:22px;border-top:1px solid rgba(255,255,255,.2);display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:700;font-size:1.05rem}
.ccard--new .lock-line svg{width:22px;height:22px;flex:none}

/* ============================================================
   SECTION 5 — HOW IT WORKS
   ============================================================ */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:clamp(44px,5vw,70px);position:relative}
.step-line{position:absolute;top:46px;left:14%;right:14%;height:2px;z-index:0;overflow:hidden}
.step-line::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,var(--green-line) 0 8px,transparent 8px 16px)}
.step-line .runner{position:absolute;top:50%;left:0;width:9px;height:9px;border-radius:50%;background:var(--green);transform:translateY(-50%);box-shadow:0 0 0 4px var(--green-tint);animation:runner 6s linear infinite}
@keyframes runner{0%{left:0%}100%{left:100%}}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px;position:relative;z-index:1;box-shadow:var(--shadow-sm);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.step:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}
.step-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.step .s-num{width:48px;height:48px;border-radius:14px;background:var(--green);color:#fff;display:grid;place-items:center;font-family:var(--font-mono);font-weight:700;font-size:1.05rem;box-shadow:var(--shadow-green)}
.step .s-ic{width:46px;height:46px;border-radius:13px;background:var(--green-tint);color:var(--green);display:grid;place-items:center}
.step .s-ic svg{width:23px;height:23px}
.step h3{font-size:1.22rem;margin-bottom:12px}
.step p{font-size:.99rem;color:var(--text);margin:0}

/* ============================================================
   SECTION 6 — FOUNDER
   ============================================================ */
.founder{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,5vw,72px);align-items:center}
.founder-portrait{position:relative;aspect-ratio:4/5;border-radius:var(--radius-lg);overflow:hidden;
  background:linear-gradient(160deg,var(--green-deep),var(--green));box-shadow:var(--shadow-lg);display:grid;place-items:center}
.founder-portrait::before{content:"";position:absolute;inset:0;background:
   radial-gradient(circle at 30% 20%,rgba(255,255,255,.16),transparent 55%),
   repeating-linear-gradient(45deg,rgba(255,255,255,.04) 0 2px,transparent 2px 22px)}
.founder-portrait .monogram{font-family:var(--font-display);font-weight:800;font-size:7rem;color:rgba(255,255,255,.92);line-height:1;text-shadow:0 10px 40px rgba(0,0,0,.25)}
.founder-portrait .photo-note{position:absolute;bottom:18px;left:0;right:0;text-align:center;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.founder-portrait .ring-deco{position:absolute;width:120px;height:120px;border:1px solid rgba(255,255,255,.25);border-radius:50%;top:-40px;right:-40px}
.founder-portrait .ring-deco.two{width:80px;height:80px;bottom:30px;left:-30px;top:auto;right:auto}
.founder-copy .quote-mark{font-family:var(--font-display);font-size:4rem;color:var(--green-line);line-height:.5;height:30px;display:block}
.founder-copy p{font-size:clamp(1.08rem,1.6vw,1.25rem);color:var(--ink);margin-bottom:22px;line-height:1.65}
.founder-copy p:last-of-type{margin-bottom:30px}
.signature{display:flex;align-items:center;gap:16px;padding-top:26px;border-top:1px solid var(--line)}
.signature .sig-name{font-family:var(--font-display);font-weight:800;font-size:1.3rem;color:var(--ink);letter-spacing:-.02em}
.signature .sig-role{font-size:.92rem;color:var(--green);font-weight:600}
.signature .sig-mark{width:50px;height:50px;border-radius:14px;background:var(--green-tint);color:var(--green);display:grid;place-items:center;flex:none}
.signature .sig-mark svg{width:24px;height:24px}

/* ============================================================
   SECTION 7 — PRICE OBJECTION (dark contrast)
   ============================================================ */
.price{background:linear-gradient(160deg,#0c1f17,#15231c 60%,#0e2a1d);color:#cdd8d0;position:relative;overflow:hidden}
.price .orb-p{position:absolute;width:480px;height:480px;border-radius:50%;filter:blur(90px);pointer-events:none}
.price .orb-p.a{background:radial-gradient(circle,rgba(14,122,77,.35),transparent 70%);top:-160px;left:-120px}
.price .orb-p.b{background:radial-gradient(circle,rgba(240,135,30,.16),transparent 70%);bottom:-160px;right:-120px}
.price .price-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,80px);align-items:center;position:relative;z-index:1}
.price .section-title{color:#fff}
.price-copy p{color:#bfcabf;margin-bottom:20px}
.price-copy p b{color:#fff}
.price-copy .num-orange{color:var(--orange);font-weight:700}
.price-figure{
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);
  padding:40px;backdrop-filter:blur(6px);position:relative;overflow:hidden;
}
.price-figure .pf-tag{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#7fe0b0;font-weight:700;margin-bottom:14px}
.price-figure .pf-cost{font-family:var(--font-display);font-weight:800;font-size:clamp(2.4rem,5vw,3.4rem);color:#fff;letter-spacing:-.03em;line-height:1}
.price-figure .pf-cost small{font-size:.42em;color:#9fb0a4;font-weight:600;display:block;margin-bottom:6px;letter-spacing:0}
.price-figure .vs-row{margin-top:30px;padding-top:28px;border-top:1px solid rgba(255,255,255,.12)}
.price-figure .vs-label{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);font-weight:700;margin-bottom:10px}
.price-figure .vs-amount{font-family:var(--font-display);font-weight:800;font-size:clamp(1.9rem,4vw,2.6rem);color:var(--orange);letter-spacing:-.02em}
.price-figure .vs-desc{font-size:.92rem;color:#a9b6ac;margin-top:8px}
.insurance-highlight{
  margin-top:clamp(40px,5vw,60px);background:linear-gradient(120deg,var(--orange),var(--orange-deep));
  border-radius:var(--radius);padding:clamp(30px,4vw,44px);position:relative;z-index:1;overflow:hidden;
  box-shadow:0 30px 70px rgba(240,135,30,.3);display:flex;align-items:center;gap:24px;
}
.insurance-highlight::before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%);top:-120px;right:-60px}
.insurance-highlight .ins-ic{width:70px;height:70px;border-radius:18px;background:rgba(255,255,255,.18);display:grid;place-items:center;flex:none}
.insurance-highlight .ins-ic svg{width:34px;height:34px;color:#fff}
.insurance-highlight p{font-family:var(--font-display);font-weight:800;font-size:clamp(1.3rem,2.6vw,1.9rem);color:#fff;line-height:1.25;letter-spacing:-.02em;margin:0}

/* ============================================================
   SECTION 8 — CONTACT FORM
   ============================================================ */
.contact{background:var(--bg-soft);position:relative;overflow:hidden}
.contact .orb-c{position:absolute;width:460px;height:460px;border-radius:50%;filter:blur(80px);background:radial-gradient(circle,rgba(14,122,77,.14),transparent 70%);top:-150px;right:-100px;pointer-events:none}
.contact-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(40px,5vw,72px);align-items:center;position:relative;z-index:1}
.contact-copy h2{margin-bottom:20px}
.contact-copy .sub{font-size:1.12rem;color:var(--text);margin-bottom:30px;max-width:46ch}
.contact-assure{display:flex;flex-direction:column;gap:16px}
.assure-item{display:flex;align-items:center;gap:14px;font-weight:600;color:var(--ink);font-size:1rem}
.assure-item .a-ic{width:42px;height:42px;border-radius:12px;background:#fff;border:1px solid var(--green-line);color:var(--green);display:grid;place-items:center;flex:none;box-shadow:var(--shadow-sm)}
.assure-item .a-ic svg{width:20px;height:20px}
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(30px,4vw,46px);box-shadow:var(--shadow-lg)}
.form-card h3{font-size:1.35rem;margin-bottom:6px}
.form-card .fc-sub{font-size:.94rem;color:var(--muted);margin-bottom:28px}
.field{margin-bottom:22px}
.field label{display:block;font-family:var(--font-display);font-weight:600;font-size:.92rem;color:var(--ink);margin-bottom:9px}
.field label .req{color:var(--orange)}
.field input{width:100%;padding:16px 18px;border:1.5px solid var(--line);border-radius:14px;font-family:var(--font-body);font-size:1rem;color:var(--ink);background:#fcfdfc;transition:border-color .3s,box-shadow .3s,background .3s}
.field input::placeholder{color:#b3bdb4}
.field input:focus{outline:none;border-color:var(--green);background:#fff;box-shadow:0 0 0 4px var(--green-tint)}
.choice-group{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.choice{position:relative}
.choice input{position:absolute;opacity:0;width:0;height:0}
.choice label{
  display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 10px;border:1.5px solid var(--line);
  border-radius:14px;cursor:pointer;text-align:center;font-size:.92rem;font-weight:600;color:var(--text);
  transition:all .3s var(--ease);margin:0;background:#fcfdfc;
}
.choice label svg{width:24px;height:24px;color:var(--muted);transition:color .3s}
.choice input:checked + label{border-color:var(--green);background:var(--green-tint);color:var(--green-deep);box-shadow:0 0 0 3px rgba(14,122,77,.08)}
.choice input:checked + label svg{color:var(--green)}
.choice label:hover{border-color:var(--green-line)}
.choice input:focus-visible + label{box-shadow:0 0 0 3px var(--green-tint)}
.form-card .btn{margin-top:8px}
.form-reassure{margin-top:18px;font-size:.84rem;color:var(--muted);text-align:center;display:flex;align-items:center;justify-content:center;gap:8px;line-height:1.5}
.form-reassure svg{width:16px;height:16px;color:var(--green);flex:none}
.form-success{display:none;text-align:center;padding:20px 0}
.form-success.show{display:block;animation:fadeUp .6s var(--ease)}
.form-success .fs-ic{width:72px;height:72px;border-radius:50%;background:var(--green-tint);color:var(--green);display:grid;place-items:center;margin:0 auto 22px}
.form-success .fs-ic svg{width:36px;height:36px}
.form-success h3{font-size:1.4rem;margin-bottom:10px}
.form-success p{color:var(--text)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ============================================================
   FINAL CTA
   ============================================================ */
.final-cta{background:linear-gradient(150deg,var(--green-deep),var(--green));color:#fff;text-align:center;position:relative;overflow:hidden}
.final-cta::before{content:"";position:absolute;inset:0;background:
   radial-gradient(circle at 20% 20%,rgba(255,255,255,.12),transparent 50%),
   radial-gradient(circle at 80% 90%,rgba(240,135,30,.18),transparent 55%)}
.final-cta .fc-inner{position:relative;z-index:1;max-width:760px;margin:0 auto}
.final-cta .eyebrow{color:#9ff0c5;justify-content:center}
.final-cta .eyebrow::before{background:#9ff0c5}
.final-cta h2{color:#fff;font-size:clamp(2rem,4.6vw,3.1rem);margin-bottom:18px;max-width:18ch;margin-inline:auto}
.final-cta p{color:rgba(255,255,255,.9);font-size:1.12rem;margin-bottom:36px;max-width:50ch;margin-inline:auto}
.final-cta .btn-orange{box-shadow:0 24px 55px rgba(0,0,0,.25)}

/* ============================================================
   FOOTER
   ============================================================ */
.tagline-band{background:var(--ink);color:#fff;text-align:center;padding:clamp(40px,6vw,64px) 0}
.tagline-band p{font-family:var(--font-display);font-weight:700;font-size:clamp(1.25rem,2.6vw,1.8rem);letter-spacing:-.02em;max-width:24ch;margin:0 auto;line-height:1.3}
.tagline-band p b{color:var(--orange)}
.site-footer{background:#10201a;color:#8ca092;padding:48px 0 36px}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer-brand{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:800;color:#fff;font-size:1.1rem}
.footer-brand .mark{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.08);display:grid;place-items:center}
.footer-brand .mark svg{width:20px;height:20px;color:#7fe0b0}
.footer-meta{font-size:.86rem;color:#6e8278}
.footer-divider{border:none;border-top:1px solid rgba(255,255,255,.08);margin:32px 0 24px}

/* ============================================================
   FLOATING CTA
   ============================================================ */
.float-cta{
  position:fixed;right:24px;bottom:24px;z-index:900;opacity:0;transform:translateY(20px) scale(.95);
  pointer-events:none;transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.float-cta.show{opacity:1;transform:none;pointer-events:auto}
.float-cta .btn{box-shadow:0 16px 45px rgba(14,122,77,.4)}

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal-l{opacity:0;transform:translateX(-40px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.reveal-l.in{opacity:1;transform:none}
.reveal-r{opacity:0;transform:translateX(40px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.reveal-r.in{opacity:1;transform:none}
.reveal-s{opacity:0;transform:scale(.94);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal-s.in{opacity:1;transform:none}

/* hero load sequence */
.hero .ld{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
body.loaded .hero .ld{opacity:1;transform:none}
.scanner-card.ld-s{opacity:0;transform:scale(.9);transition:opacity 1s var(--ease),transform 1s var(--ease)}
body.loaded .scanner-card.ld-s{opacity:1;transform:none;transition-delay:.35s}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1024px){
  .hero-inner,.problem-grid,.solution-head,.founder,.price .price-grid,.contact-grid{grid-template-columns:1fr}
  .compare-grid{grid-template-columns:1fr}
  .hero-copy{max-width:none;text-align:left}
  .scanner-wrap{margin-top:10px;order:-1}
  .scanner-card{max-width:400px;margin:0 auto}
  .founder-portrait{max-width:380px;margin:0 auto}
  .price-figure{order:-1}
}
@media(max-width:760px){
  .nav-links{display:none}
  .nav-links.mob-open{
    display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
    background:#fff;box-shadow:var(--shadow-lg);border-radius:0 0 20px 20px;padding:14px 0;margin-top:8px;
  }
  .nav-links.mob-open a{padding:14px 24px;width:100%}
  .nav-links.mob-open a::after{display:none}
  .burger{display:block}
  .nav .nav-cta .btn-txt{display:none}
  .benefit-cards,.steps,.choice-group{grid-template-columns:1fr}
  .step-line{display:none}
  .trust-strip{grid-template-columns:1fr 1fr;gap:18px}
  .insurance-highlight{flex-direction:column;text-align:center;gap:18px}
  .hero h1 .hl{white-space:normal}
  .hero h1 .hl::after{display:none}
  .section-title{max-width:none}
  .footer-inner{flex-direction:column;text-align:center;align-items:center}
  .float-cta{right:16px;bottom:16px;left:16px}
  .float-cta .btn{width:100%;justify-content:center}
}
@media(max-width:460px){
  .trust-strip{grid-template-columns:1fr}
  .nav .btn{padding:11px 18px}
  .btn{padding:16px 24px}
}

/* reduced motion */
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.001s!important}
  .reveal,.reveal-l,.reveal-r,.reveal-s,.hero .ld,.scanner-card.ld-s{opacity:1!important;transform:none!important}
}

/* =====================================================================
   PHP BUILD — additional components (top bar, full-width trust band,
   photo+scan hero, section media, founder photo, final-cta bg, forms)
   ===================================================================== */

/* ---- top contact bar (above fixed header) ---- */
.topbar{position:fixed;top:0;left:0;right:0;z-index:1001;background:var(--green-deep);color:#dbf0e4;
  padding:8px 0;font-size:.8rem;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:24px;white-space:nowrap}
.tb-tag{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:#9ff0c5;overflow:hidden;text-overflow:ellipsis}
.tb-links{display:flex;align-items:center;gap:20px}
.tb-links a{display:inline-flex;align-items:center;gap:6px;color:#e7f3ec;font-weight:600;font-size:.82rem}
.tb-links a:hover{color:#fff}
.tb-links svg{width:14px;height:14px;flex:none}
body:has(.topbar) .site-header{top:40px}
body:has(.topbar) .hero{padding-top:clamp(160px,19vw,210px)}

/* ---- brand logo images (header + footer) ---- */
.brand-logo{height:120px;width:auto;display:block}
.site-header.scrolled .brand-logo{height:70px;transition:height .3s var(--ease)}
.footer-logo{height:120px;width:auto;display:block}

/* ---- hero: real photo inside the SDI scanner card ---- */
.scan-photo{position:absolute;inset:0;z-index:1;border-radius:inherit;overflow:hidden}
.scan-photo img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.03) contrast(1.02)}
.scan-photo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(244,248,244,.94),rgba(244,248,244,0) 20%,rgba(244,248,244,0) 80%,rgba(244,248,244,.94))}
.scan-grid{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.55;
  background-image:linear-gradient(rgba(14,122,77,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(14,122,77,.1) 1px,transparent 1px);
  background-size:36px 36px}
.scan-vignette{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(circle at 50% 46%,transparent 54%,rgba(10,40,26,.22))}
.scan-beam-h{position:absolute;left:0;right:0;top:0;height:2px;z-index:2;
  background:linear-gradient(90deg,transparent,var(--green),transparent);
  box-shadow:0 0 18px 3px rgba(14,122,77,.35);animation:scanSweep 3.6s var(--ease) infinite}
.scan-node{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-mono);font-weight:700;font-size:.56rem;letter-spacing:.07em;color:var(--green-deep);
  background:rgba(255,255,255,.84);border:1px solid var(--green-line);padding:5px 9px;border-radius:30px;
  box-shadow:0 6px 16px rgba(18,40,28,.12);backdrop-filter:blur(2px)}
.scan-node i{width:7px;height:7px;border-radius:50%;background:var(--green);flex:none;animation:nodePulse 2.4s infinite}
.scan-node.warn{color:var(--orange-deep);border-color:var(--orange)}
.scan-node.warn i{background:var(--orange);animation:nodePulseW 2.4s infinite}
.scan-node.n1{top:21%;left:9%}
.scan-node.n2{top:17%;right:9%}
.scan-node.n3{bottom:25%;left:11%}
.scan-node.n4{bottom:20%;right:11%}
@keyframes scanSweep{0%{top:7%;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:93%;opacity:0}}
@keyframes nodePulse{0%{box-shadow:0 0 0 0 rgba(14,122,77,.5)}70%{box-shadow:0 0 0 7px rgba(14,122,77,0)}100%{box-shadow:0 0 0 0 rgba(14,122,77,0)}}
@keyframes nodePulseW{0%{box-shadow:0 0 0 0 rgba(240,135,30,.5)}70%{box-shadow:0 0 0 7px rgba(240,135,30,0)}100%{box-shadow:0 0 0 0 rgba(240,135,30,0)}}

/* ---- FULL-WIDTH trust band ---- */
.trust-band{background:var(--bg-soft);border-block:1px solid var(--line);padding:clamp(26px,3.6vw,40px) 0}
.trust-band .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,3vw,40px);align-items:center}
.trust-band .trust-item{display:flex;align-items:center;gap:14px}
.trust-band .trust-item + .trust-item{border-left:1px solid var(--line);padding-left:clamp(16px,2.6vw,36px)}
.trust-band .ti-ic{width:46px;height:46px;border-radius:13px;background:var(--green-tint);color:var(--green);display:grid;place-items:center;flex:none}
.trust-band .ti-ic svg{width:22px;height:22px}
.trust-band .ti-tx{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);font-weight:700;line-height:1.35}

/* ---- problema: media + copy head, surprises row ---- */
.problem-head{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(34px,5vw,68px);align-items:center;margin-bottom:clamp(40px,5vw,64px)}
.problem-media{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:4/3}
.problem-media img{width:100%;height:100%;object-fit:cover;display:block}
.pm-chip{position:absolute;bottom:16px;left:16px;background:#fff;border:1px solid var(--orange);color:var(--orange-deep);
  font-family:var(--font-mono);font-weight:700;font-size:.64rem;letter-spacing:.04em;text-transform:uppercase;
  padding:8px 12px;border-radius:30px;display:flex;align-items:center;gap:7px;box-shadow:var(--shadow-sm)}
.pm-chip svg{width:15px;height:15px}
.surprise-row{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,24px)}

/* ---- metodo: photo on top of the MRI callout ---- */
.mri-photo{display:block;width:calc(100% + 60px);margin:-30px -30px 24px;height:210px;object-fit:cover;position:relative;z-index:1}
.mri-body{position:relative;z-index:1}

/* ---- piano: foot media + copy ---- */
.piano-foot{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(30px,4vw,56px);align-items:center;margin-top:clamp(34px,5vw,56px)}
.piano-media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:4/3}
.piano-media img{width:100%;height:100%;object-fit:cover;display:block}
.piano-foot .compare-copy{margin-top:0}

/* ---- percorso: optional banner ---- */
.percorso-banner{margin:clamp(28px,4vw,44px) auto clamp(6px,1.6vw,16px);max-width:900px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:21/9}
.percorso-banner img{width:100%;height:100%;object-fit:cover;display:block}

/* ---- founder: real photo fills portrait frame ---- */
.founder-portrait .founder-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.founder-portrait:has(.founder-photo)::before{background:linear-gradient(160deg,rgba(10,92,58,.28),transparent 55%);z-index:2}
.founder-portrait:has(.founder-photo) .ring-deco{z-index:3}

/* ---- final CTA with background photo ---- */
.final-cta.has-bg{background:var(--final-bg) center/cover no-repeat}
.final-cta.has-bg::before{background:linear-gradient(150deg,rgba(10,92,58,.92),rgba(13,110,69,.8));z-index:1}
.final-cta.has-bg .fc-inner{position:relative;z-index:2}

/* ---- footer contact links ---- */
.footer-contact{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.footer-contact a{color:#cfe6d8;font-weight:600;font-size:.95rem}
.footer-contact a:hover{color:#fff}

/* ---- form: honeypot + error message ---- */
.hp-field{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
.form-error{display:none;margin-top:14px;background:#fdecec;border:1px solid #f3c2c2;color:#b3261e;border-radius:var(--radius-sm);padding:12px 15px;font-size:.92rem;font-weight:500}
.form-error.show{display:block}

/* ---- responsive for the new components ---- */
@media(max-width:1024px){
  .problem-head,.piano-foot{grid-template-columns:1fr;gap:32px}
  .problem-media,.piano-media{max-width:560px;margin:0 auto;width:100%}
  .mri-photo{height:200px}
}
@media(max-width:860px){
  .trust-band .wrap{grid-template-columns:1fr 1fr;gap:24px 30px}
  .trust-band .trust-item + .trust-item{border-left:none;padding-left:0}
  .surprise-row{grid-template-columns:1fr}
  .percorso-banner{aspect-ratio:16/9}
}
@media(max-width:560px){
  .tb-tag{display:none}
  .tb-links{width:100%;justify-content:space-between;gap:12px}
  .tb-links a span,.tb-links a{font-size:.78rem}
}
@media(max-width:460px){
  .trust-band .wrap{grid-template-columns:1fr;gap:18px}
  .mri-photo{height:180px;margin-bottom:20px}
}
@media(prefers-reduced-motion:reduce){
  .scan-beam-h,.scan-node i{animation:none!important}
  .scan-beam-h{top:50%;opacity:.6}
}