/* =============================================================================
   ZAPPIAMO LANDING — landing.css
   Pixel-perfect migration from Flutter landing_page.dart
   ============================================================================= */

/* -- Reset & Base ---------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Roboto',sans-serif;color:#0F172A;background:#E8F5E9;overflow-x:hidden;line-height:1.5}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button{cursor:pointer;border:none;background:none;font-family:inherit}

/* -- CSS Variables --------------------------------------------------------- */
:root{
  --emerald:#2E7D32;--emerald-light:#66BB6A;--emerald-dark:#1B5E20;
  --orange:#EA580C;--amber:#D97706;
  --terra:#795548;--terra-light:#A1887F;--terra-mid:#8D6E63;--terra-dark:#3E2C1E;--terra-bg:#F5E6D3;
  --slate900:#0F172A;--slate700:#334155;--slate500:#64748B;--slate400:#94A3B8;--slate200:#E2E8F0;--slate50:#F8FAFC;
  --gold:#FBBF24;--red:#D32F2F;
}

/* -- Utility --------------------------------------------------------------- */
.wrap{max-width:1100px;margin:0 auto;width:100%}
.wrap-wide{max-width:1200px;margin:0 auto;width:100%}
.wrap-narrow{max-width:960px;margin:0 auto;width:100%}
.text-center{text-align:center}

/* -- Section Reveal (JS adds .revealed) ------------------------------------ */
.section-reveal{
  opacity:0;
  transform:perspective(1200px) rotateX(0.02rad) scale(0.92) translateY(60px);
  transition:opacity .9s cubic-bezier(.33,1,.68,1),transform .9s cubic-bezier(.33,1,.68,1);
  will-change:opacity,transform;
}
.section-reveal.revealed{
  opacity:1;
  transform:perspective(1200px) rotateX(0) scale(1) translateY(0);
}

/* =============================================================================
   NAVBAR
   ============================================================================= */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;height:64px;display:flex;align-items:center;
  transition:background .3s,box-shadow .3s;
  padding:0 16px;
  background:transparent;
}
.nav.scrolled{
  background:#fff;
  box-shadow:0 2px 12px rgba(0,0,0,.06);
}
.nav .nav-inner{display:flex;align-items:center;width:100%}
.nav .spacer{flex:1}
.nav .nav-logo{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;flex-shrink:1}
.nav .nav-logo .logo-box{
  width:26px;height:26px;background:var(--red);border-radius:7px;display:flex;align-items:center;justify-content:center;
  font-size:15px;
}
.nav .nav-logo .logo-box .logo-emoji{filter:grayscale(1) brightness(10)}
/* Logo text: Z📱appi❤️amo — JS handles sequential animation */
.nav .logo-text{display:none;align-items:center;font-weight:900;line-height:1;opacity:0}
.nav .logo-text .lz,.nav .logo-text .li{font-size:22px;color:#9E9E9E}
.nav .logo-text .lgroup{display:inline-flex;flex-direction:column;align-items:center;margin:0 -1px}
.nav .logo-text .lphone{font-size:14px;color:#2E7D32;line-height:1}
.nav .logo-text .lapp{font-size:16px;font-weight:900;color:#2E7D32;line-height:1}
.nav .logo-text .lheart{font-size:14px;color:#D32F2F;line-height:1}
.nav .logo-text .lamo{font-size:16px;font-weight:900;color:#D32F2F;line-height:1}

.nav .nav-register{font-weight:600;font-size:12px;transition:color .3s;cursor:pointer}
.nav:not(.scrolled) .nav-register{color:rgba(255,255,255,.8)}
.nav.scrolled .nav-register{color:rgba(51,65,85,.8)}

.nav .nav-login{
  display:inline-block;flex-shrink:0;
  background:linear-gradient(135deg,#FBBF24,#D97706);
  border-radius:10px;padding:6px 10px;
  font-size:11px;font-weight:700;color:#451A03;white-space:nowrap;
}
.nav .nav-register{margin-left:6px;white-space:nowrap;font-size:11px;flex-shrink:0}
.lang-select{position:relative;margin-right:8px;flex-shrink:0}
.lang-current{
  display:flex;align-items:center;gap:2px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  border-radius:10px;padding:6px 6px;cursor:pointer;transition:background .2s;
}
.lang-current:hover{background:rgba(255,255,255,.22)}
.nav.scrolled .lang-current{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.1)}
.nav.scrolled .lang-current:hover{background:rgba(0,0,0,.1)}
.lang-flag{width:24px;height:18px;border-radius:3px;flex-shrink:0;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.lang-chevron{font-size:16px;color:rgba(255,255,255,.6);transition:transform .2s,color .2s}
.nav.scrolled .lang-chevron{color:var(--slate400)}
.lang-select.open .lang-chevron{transform:rotate(180deg)}
.lang-dropdown{
  display:none;position:absolute;top:calc(100% + 6px);right:0;
  background:#fff;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.15);
  overflow:hidden;min-width:140px;z-index:200;
}
.lang-select.open .lang-dropdown{display:block}
.lang-option{
  display:flex;align-items:center;gap:8px;width:100%;
  padding:10px 14px;border:none;background:none;cursor:pointer;
  font-family:inherit;font-size:13px;font-weight:500;color:var(--slate700);
  transition:background .15s;
}
.lang-option:hover{background:rgba(46,125,50,.06)}
.lang-option.active{background:rgba(46,125,50,.1);font-weight:700;color:var(--emerald)}

/* =============================================================================
   HERO
   ============================================================================= */
.hero{
  position:relative;width:100%;overflow:hidden;
  background:linear-gradient(to bottom,
    #0A1F0C 0%,#0D220F 6%,#102612 12%,#132A15 18%,#172E18 24%,#1C331C 30%,
    #223820 36%,#2A4228 42%,#365034 50%,#476346 58%,#5E7A5C 65%,#7A9578 72%,
    #9DB49B 78%,#C2D4C1 84%,#E0ECE0 90%,#F2F7F2 95%,#FFFFFF 100%);
}

/* Blob background — filled soft orbs (Flutter _BlobPainter + MaskFilter.blur(100)) */
.hero-blobs{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero-blob{
  position:absolute;border-radius:50%;
  animation:blobFloat 12s ease-in-out infinite;will-change:transform;
}
.hero-blob.b1{width:140%;padding-bottom:140%;left:-40%;top:-10%;animation-delay:0s;
  background:radial-gradient(circle,rgba(46,125,50,.30) 0%,rgba(46,125,50,.18) 15%,rgba(46,125,50,.10) 30%,rgba(46,125,50,.05) 45%,rgba(46,125,50,.02) 60%,rgba(46,125,50,.005) 80%,transparent 100%);
}
.hero-blob.b2{width:130%;padding-bottom:130%;right:-50%;top:-15%;animation-delay:-3s;
  background:radial-gradient(circle,rgba(217,119,6,.25) 0%,rgba(217,119,6,.14) 15%,rgba(217,119,6,.07) 30%,rgba(217,119,6,.03) 45%,rgba(217,119,6,.01) 60%,rgba(217,119,6,.003) 80%,transparent 100%);
}
.hero-blob.b3{width:80%;padding-bottom:80%;right:-15%;top:30%;animation-delay:-6s;
  background:radial-gradient(circle,rgba(234,88,12,.18) 0%,rgba(234,88,12,.09) 15%,rgba(234,88,12,.04) 30%,rgba(234,88,12,.015) 50%,rgba(234,88,12,.005) 70%,transparent 90%);
}
.hero-blob.b4{width:120%;padding-bottom:120%;left:-10%;top:-20%;animation-delay:-2s;
  background:radial-gradient(circle,rgba(217,119,6,.22) 0%,rgba(217,119,6,.12) 15%,rgba(217,119,6,.06) 30%,rgba(217,119,6,.025) 45%,rgba(217,119,6,.008) 60%,rgba(217,119,6,.002) 80%,transparent 100%);
}
.hero-blob.b5{width:70%;padding-bottom:70%;left:-15%;top:50%;animation-delay:-8s;
  background:radial-gradient(circle,rgba(121,85,72,.14) 0%,rgba(121,85,72,.07) 15%,rgba(121,85,72,.03) 30%,rgba(121,85,72,.01) 50%,rgba(121,85,72,.003) 70%,transparent 90%);
}
.hero-blob.b6{width:110%;padding-bottom:110%;right:-30%;top:40%;animation-delay:-4s;
  background:radial-gradient(circle,rgba(102,187,106,.18) 0%,rgba(102,187,106,.10) 15%,rgba(102,187,106,.05) 30%,rgba(102,187,106,.02) 45%,rgba(102,187,106,.006) 60%,rgba(102,187,106,.002) 80%,transparent 100%);
}

@keyframes blobFloat{
  0%,100%{transform:translate(0,0)}
  25%{transform:translate(60px,-40px)}
  50%{transform:translate(-30px,50px)}
  75%{transform:translate(40px,20px)}
}

/* Glow rings — thin borders + box-shadow glow, orbital motion, pulsing opacity */
.hero-rings{position:absolute;inset:0;pointer-events:none}
.glow-ring{
  position:absolute;border-radius:50%;
  will-change:transform,opacity;
}
/* Ring 1: Large emerald, left side — filled uniform, wide outer glow */
.glow-ring.r1{
  width:200px;height:200px;
  background:radial-gradient(circle,rgba(46,125,50,.20) 0%,rgba(46,125,50,.20) 50%,rgba(46,125,50,.12) 70%,rgba(46,125,50,.04) 85%,transparent 100%);
  box-shadow:0 0 120px 40px rgba(46,125,50,.18);
  left:-3%;top:10%;
  animation:orbit1 12s linear infinite,glowPulse 3s ease-in-out infinite alternate;
}
/* Ring 2: Amber→red, right side */
.glow-ring.r2{
  width:160px;height:160px;
  background:radial-gradient(circle,rgba(180,60,10,.22) 0%,rgba(180,60,10,.22) 45%,rgba(200,80,15,.14) 65%,rgba(217,119,6,.06) 80%,transparent 100%);
  box-shadow:0 0 120px 40px rgba(180,60,10,.20);
  right:-5%;top:5%;
  animation:orbit2 12s linear infinite,glowPulse 3s ease-in-out infinite alternate;
}
/* Ring 3: Orange→red accent, center */
.glow-ring.r3{
  width:80px;height:80px;
  background:radial-gradient(circle,rgba(190,50,10,.18) 0%,rgba(190,50,10,.18) 45%,rgba(220,80,12,.10) 65%,rgba(234,88,12,.04) 80%,transparent 100%);
  box-shadow:0 0 100px 35px rgba(190,50,10,.15);
  left:35%;top:30%;
  animation:orbit3 12s linear infinite,glowPulse3 3s ease-in-out infinite alternate;
}
/* Ring 4: Light green, bottom-left */
.glow-ring.r4{
  width:110px;height:110px;
  background:radial-gradient(circle,rgba(102,187,106,.18) 0%,rgba(102,187,106,.18) 50%,rgba(102,187,106,.10) 70%,rgba(102,187,106,.03) 85%,transparent 100%);
  box-shadow:0 0 110px 35px rgba(102,187,106,.16);
  left:5%;top:60%;
  animation:orbit4 12s linear infinite,glowPulse 3s ease-in-out infinite alternate;
}
/* Ring 5: Amber→red, bottom-right */
.glow-ring.r5{
  width:55px;height:55px;
  background:radial-gradient(circle,rgba(185,55,10,.20) 0%,rgba(185,55,10,.20) 40%,rgba(210,90,20,.10) 60%,rgba(251,191,36,.04) 80%,transparent 100%);
  box-shadow:0 0 90px 30px rgba(185,55,10,.15);
  right:5%;top:55%;
  animation:orbit5 12s linear infinite,glowPulse5 3s ease-in-out infinite alternate;
}

/* Orbital keyframes — wider paths so rings drift visibly at the sides */
@keyframes orbit1{
  0%{transform:translate(0,0) rotate(0deg)}
  25%{transform:translate(100px,-70px) rotate(13.5deg)}
  50%{transform:translate(0,-140px) rotate(27deg)}
  75%{transform:translate(-100px,-70px) rotate(40.5deg)}
  100%{transform:translate(0,0) rotate(54deg)}
}
@keyframes orbit2{
  0%{transform:translate(0,0) rotate(0deg)}
  25%{transform:translate(-90px,60px) rotate(-18deg)}
  50%{transform:translate(0,120px) rotate(-36deg)}
  75%{transform:translate(90px,60px) rotate(-54deg)}
  100%{transform:translate(0,0) rotate(-72deg)}
}
@keyframes orbit3{
  0%{transform:translate(0,0) rotate(0deg) scale(0.9)}
  25%{transform:translate(60px,-50px) rotate(36deg) scale(1.15)}
  50%{transform:translate(0,-100px) rotate(72deg) scale(0.9)}
  75%{transform:translate(-60px,-50px) rotate(108deg) scale(1.15)}
  100%{transform:translate(0,0) rotate(144deg) scale(0.9)}
}
@keyframes orbit4{
  0%{transform:translate(0,0) rotate(0deg)}
  25%{transform:translate(80px,-55px) rotate(22.5deg)}
  50%{transform:translate(0,-110px) rotate(45deg)}
  75%{transform:translate(-80px,-55px) rotate(67.5deg)}
  100%{transform:translate(0,0) rotate(90deg)}
}
@keyframes orbit5{
  0%{transform:translate(0,0) scale(0.8)}
  25%{transform:translate(-70px,45px) scale(1.2)}
  50%{transform:translate(0,90px) scale(0.8)}
  75%{transform:translate(55px,35px) scale(1.2)}
  100%{transform:translate(0,0) scale(0.8)}
}

/* Glow pulse — opacity breathing 3s */
@keyframes glowPulse{
  0%{opacity:.55}
  100%{opacity:.85}
}
@keyframes glowPulse3{
  0%{opacity:.45}
  100%{opacity:.75}
}
@keyframes glowPulse5{
  0%{opacity:.50}
  100%{opacity:.80}
}

/* Vignette */
.hero-vignette{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at center 30%,transparent 0%,transparent 60%,rgba(0,0,0,.15) 100%);
}

/* Emoji strip */
.hero-emoji-strip{
  position:absolute;top:110px;left:0;right:0;height:44px;overflow:hidden;opacity:.04;pointer-events:none;
}
.hero-emoji-strip .strip-inner{
  display:flex;white-space:nowrap;font-size:32px;letter-spacing:8px;
  animation:emojiScroll 20s linear infinite;
}
@keyframes emojiScroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-33.333%)}
}

/* Grain overlay */
.hero-grain{position:absolute;inset:0;opacity:.03;pointer-events:none;background: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='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");background-repeat:repeat;background-size:200px}

/* Hero content */
.hero-content{
  position:relative;z-index:2;
  padding:78px 24px 48px;
  display:flex;flex-direction:column;align-items:center;
}

/* Badge pill */
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 18px;border-radius:100px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(102,187,106,.3);
  box-shadow:0 0 30px 2px rgba(46,125,50,.2),0 0 20px rgba(217,119,6,.1);
  animation:badgeGlow 3s ease-in-out infinite alternate;
}
@keyframes badgeGlow{
  0%{box-shadow:0 0 30px 2px rgba(46,125,50,.15),0 0 20px rgba(217,119,6,.08)}
  100%{box-shadow:0 0 44px 4px rgba(46,125,50,.25),0 0 24px rgba(217,119,6,.13)}
}
.hero-badge .badge-text{color:var(--emerald-light);font-size:13px;font-weight:700;letter-spacing:.5px}
.hero-badge .badge-emoji{font-size:15px}

/* Split title — JS handles animation (colors, gap, icons, opacity) */
.hero-split-title{
  margin-top:32px;text-align:center;opacity:0;
}
.hero-split-title .title-row{
  display:inline-flex;align-items:flex-end;gap:0;
  font-size:54px;font-weight:900;line-height:1;letter-spacing:-3px;
  color:#fff;
}
.hero-split-title .letter-group{display:flex;flex-direction:column;align-items:center;position:relative;top:5px}
.hero-split-title .icon-drop{height:0;overflow:hidden}
.hero-split-title .icon-drop .material-icons{font-size:30px}
.hero-split-title .t-app{font-size:calc(54px * .75)}
.hero-split-title .t-amo{font-size:calc(54px * .75)}

/* "nutre chi amo" subtitle */
.hero-split-title .nca{
  opacity:0;
  font-size:32px;font-weight:900;line-height:1;letter-spacing:-2px;
  background:linear-gradient(90deg,#66BB6A,#FBBF24,#EA580C);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;margin-top:8px;
}

/* Hero subtitle rich text */
.hero-subtitle{
  max-width:620px;text-align:center;margin-top:22px;
  font-size:16px;line-height:1.7;color:rgba(255,255,255,.6);
  opacity:0;transform:translateY(15px);
  transition:opacity .6s .4s,transform .6s .4s;
}
.hero-subtitle.visible{opacity:1;transform:translateY(0)}
.hero-subtitle .hl-green{font-weight:700;color:var(--emerald-light)}
.hero-subtitle .hl-gold{font-weight:700;color:var(--gold)}

/* Hero chips */
.hero-chips{
  margin-top:28px;
  padding:16px 24px;border-radius:20px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 8px 24px rgba(0,0,0,.1);
  display:flex;flex-wrap:wrap;gap:10px 10px;align-items:center;justify-content:center;
  opacity:0;transform:translateY(15px);
  transition:opacity .6s .6s,transform .6s .6s;
}
.hero-chips.visible{opacity:1;transform:translateY(0)}
.hero-chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 12px;border-radius:12px;font-size:13px;font-weight:800;
}
.hero-chip.green{background:rgba(46,125,50,.15);border:1px solid rgba(102,187,106,.4);color:var(--emerald-light)}
.hero-chip.gold{background:rgba(217,119,6,.15);border:1px solid rgba(251,191,36,.4);color:var(--gold)}
.hero-chip.orange{background:rgba(234,88,12,.15);border:1px solid rgba(251,146,60,.4);color:#FB923C}
.hero-chip-arrow{font-size:16px;color:rgba(255,255,255,.25)}
.hero-chip .chip-emoji{font-size:14px}

/* Hero CTA */
.hero-cta-wrap{
  margin-top:48px;
  opacity:0;transform:translateY(20px);
  transition:opacity .6s .7s,transform .6s .7s;
}
.hero-cta-wrap.visible{opacity:1;transform:translateY(0)}
.hero-cta{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--emerald);color:#fff;
  padding:22px 36px;border-radius:16px;
  font-size:16px;font-weight:800;letter-spacing:.3px;
  box-shadow:0 0 28px 1px rgba(46,125,50,.3);
  transition:box-shadow .3s,transform .15s;
  cursor:pointer;border:none;
}
.hero-cta:hover{box-shadow:0 0 42px 2px rgba(46,125,50,.45);transform:scale(1.02)}
.hero-cta .material-icons{font-size:20px}

/* Hero stats */
.hero-stats{
  margin-top:52px;display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .6s .9s;
}
.hero-stats.visible{opacity:1}
.hero-stat{text-align:center}
.hero-stat .stat-val{font-size:22px;font-weight:900;color:var(--gold);letter-spacing:-1px}
.hero-stat .stat-label{font-size:12px;color:var(--gold);font-weight:500;margin-top:2px}
.hero-stat-sep{width:1px;height:32px;background:var(--slate200);margin:0 12px}

/* Hero mock (terrain + floating cards) */
.hero-mocks{
  margin-top:44px;position:relative;width:100%;max-width:1210px;
  padding:0 24px 36px;
  opacity:0;transform:translateY(30px);
  transition:opacity .8s .5s,transform .8s .5s;
}
.hero-mocks.visible{opacity:1;transform:translateY(0)}

.terrain-mock{
  border-radius:16px;border:2px solid rgba(46,125,50,.12);overflow:hidden;
  box-shadow:0 16px 40px rgba(0,0,0,.1),0 8px 24px rgba(46,125,50,.06);
}
.terrain-mock img{width:100%;display:block}

/* Floating product cards */
.float-card{
  position:absolute;
  background:#fff;border-radius:10px;padding:6px;text-align:center;
  border:1px solid;
  box-shadow:0 4px 10px rgba(0,0,0,.08);
  animation:floatY 5s ease-in-out infinite alternate;
  display:block;width:70px;
}
.float-card .fc-emoji{font-size:16px}
.float-card .fc-name{font-size:8px;font-weight:800;margin-top:2px}
.float-card .fc-detail{display:none}
.float-card.fc-passata{border-color:rgba(211,47,47,.2);left:-8px;top:105px;animation-delay:0s}
.float-card.fc-passata .fc-name{color:#D32F2F}
.float-card.fc-conserva{border-color:rgba(255,143,0,.2);right:-8px;top:55px;animation-delay:-2.5s}
.float-card.fc-conserva .fc-name{color:#FF8F00}
.float-card.fc-sottolio{border-color:rgba(230,81,0,.2);left:-8px;bottom:10px;animation-delay:-1.25s}
.float-card.fc-sottolio .fc-name{color:#E65100}
.float-card.fc-verdure{border-color:rgba(46,125,50,.2);right:-8px;bottom:10px;animation-delay:-3.75s}
.float-card.fc-verdure .fc-name{color:#2E7D32}
.float-card.fc-sottaceti,.float-card.fc-pesto{display:none}

@keyframes floatY{
  0%{transform:translateY(0)}
  100%{transform:translateY(-10px)}
}

/* =============================================================================
   TRUST STRIP
   ============================================================================= */
.trust-strip{
  width:100%;border-top:1px solid var(--slate200);border-bottom:1px solid var(--slate200);
  padding:22px 16px;
}
.trust-strip .ts-inner{
  display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:center;
}
.trust-item{
  display:inline-flex;align-items:center;gap:8px;
  opacity:0;transform:translate(var(--tx,0),var(--ty,0));
  transition:opacity .8s cubic-bezier(.33,1,.68,1),transform .8s cubic-bezier(.33,1,.68,1);
}
.trust-item.visible{opacity:1;transform:translate(0,0)}
.trust-item .material-icons{font-size:20px;color:var(--emerald)}
.trust-item span{font-size:15px;font-weight:600;color:var(--slate500)}

/* =============================================================================
   TAG (shared)
   ============================================================================= */
.tag{
  display:inline-block;padding:5px 12px;border-radius:100px;
  background:rgba(46,125,50,.06);
  font-size:11px;font-weight:700;color:var(--emerald);letter-spacing:1.5px;
}
.tag-amber{
  display:inline-block;
  background:var(--amber);color:#fff;
  padding:6px 14px;font-size:11px;font-weight:800;letter-spacing:1.2px;border-radius:100px;
}

/* =============================================================================
   SECTION TITLE (shared pattern)
   ============================================================================= */
.section-title{
  font-size:34px;font-weight:900;letter-spacing:-1.5px;line-height:1.15;color:var(--slate900);
}
/* WhyZappiamo: w800, 26/38 */
.section-title.why-title-size{font-size:26px;font-weight:800}
/* Pricing & Reviews: 30/42 */
.section-title.pricing-title-size{font-size:30px}
.section-title .gradient-text{
  background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.section-desc{font-size:16px;line-height:1.7;color:var(--slate500);max-width:620px;margin:0 auto}

/* =============================================================================
   WHY ZAPPIAMO
   ============================================================================= */
.why-section{
  width:100%;padding:48px 24px;
  background:linear-gradient(to bottom,#fff,rgba(245,230,211,.3),#fff);
}
.why-section .why-inner{max-width:1100px;margin:0 auto}

/* WhyZappiamo animation targets */
.why-title-wrap{opacity:0;transform:translateY(-40px);transition:opacity .8s,transform .8s cubic-bezier(.33,1,.68,1)}
.why-title-wrap.visible{opacity:1;transform:translateY(0)}
.why-card-left{opacity:0;transform:translateX(-60px);transition:opacity .8s .2s,transform .8s .2s cubic-bezier(.33,1,.68,1)}
.why-card-left.visible{opacity:1;transform:translateX(0)}
.why-card-center{opacity:0;transform:translateY(60px);transition:opacity .8s .3s,transform .8s .3s cubic-bezier(.33,1,.68,1)}
.why-card-center.visible{opacity:1;transform:translateY(0)}
.why-card-right{opacity:0;transform:translateX(60px);transition:opacity .8s .4s,transform .8s .4s cubic-bezier(.33,1,.68,1)}
.why-card-right.visible{opacity:1;transform:translateX(0)}

.why-subtitle{font-size:16px;line-height:1.7;color:var(--slate500);max-width:620px;margin:0 auto}
.why-subtitle .hl-green{font-weight:600;font-style:italic;color:var(--emerald-dark)}

.why-cards{display:flex;flex-direction:column;gap:16px;margin-top:36px}

/* Problem / Solution / Result cards */
.why-card{
  padding:24px;border-radius:20px;background:#fff;
  border:1px solid;
  box-shadow:0 4px 16px rgba(0,0,0,.03);
}
.why-card.problem{border-color:rgba(255,138,101,.4)}
.why-card.solution{border-color:rgba(46,125,50,.35);box-shadow:0 6px 20px rgba(46,125,50,.06)}
.why-card.result{border-color:rgba(255,202,40,.5)}

.why-card .card-header{display:flex;align-items:center;gap:12px}
.why-card .card-icon{
  padding:10px;border-radius:12px;font-size:22px;display:flex;align-items:center;justify-content:center;
}
.why-card.problem .card-icon{background:rgba(230,81,0,.08)}
.why-card.solution .card-icon{background:rgba(46,125,50,.08)}
.why-card.result .card-icon{background:rgba(255,143,0,.08)}

.why-card .card-title{font-size:16px;font-weight:800;color:var(--slate900);line-height:1.3;flex:1}
.why-card .card-body{font-size:14px;line-height:1.65;color:var(--slate500);margin-top:16px}
.why-card .card-body .hl{font-weight:700;color:var(--emerald-dark)}

/* Mini chips */
.mini-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.mini-chip{
  display:inline-block;padding:5px 10px;border-radius:8px;
  font-size:11px;font-weight:700;
}
.mini-chip.orange{background:rgba(230,81,0,.06);border:1px solid rgba(230,81,0,.15);color:#E65100}
.mini-chip.green{background:rgba(46,125,50,.06);border:1px solid rgba(46,125,50,.15);color:var(--emerald)}
.mini-chip.gold{background:rgba(255,143,0,.06);border:1px solid rgba(255,143,0,.15);color:#FF8F00}

/* =============================================================================
   DIY ORTO — I Conti in Tasca
   ============================================================================= */
.diy-section{
  width:100%;background:#FFF8F0;
  padding:56px 24px;
}
.diy-section .diy-inner{max-width:1100px;margin:0 auto}

.cost-cards{display:flex;flex-direction:column;gap:16px;margin-top:32px}
.cost-card{
  padding:18px;border-radius:20px;background:#fff;
  border:1px solid;
  box-shadow:0 4px 16px rgba(0,0,0,.03);
}
.cost-card.hl{border-width:1.5px}
.cost-card .cc-header{display:flex;align-items:center;gap:8px}
.cost-card .cc-emoji{font-size:20px}
.cost-card .cc-tag{
  display:inline-block;padding:3px 10px;border-radius:6px;
  font-size:12px;font-weight:700;letter-spacing:.3px;
}
.cost-card .cc-body{font-size:12px;line-height:1.55;color:var(--slate500);margin-top:10px}

/* Emotional closer */
.diy-closer{
  max-width:700px;margin:28px auto 0;padding:20px;border-radius:20px;
  background:rgba(46,125,50,.05);border:1px solid rgba(46,125,50,.25);text-align:center;
}
.diy-closer .closer-emoji{font-size:28px}
.diy-closer .closer-title{font-size:17px;font-weight:800;color:var(--slate900);margin-top:12px}
.diy-closer .closer-body{font-size:15px;line-height:1.7;color:var(--slate500);margin-top:10px}
.diy-closer .closer-cta{font-size:16px;font-weight:700;line-height:1.5;margin-top:16px}
.diy-closer .closer-cta .cta-green{color:var(--emerald)}
.diy-closer .closer-cta .cta-dark{color:var(--slate900)}

/* =============================================================================
   ESCLUSIVO — Il Metodo Esclusivo
   ============================================================================= */
.esclusivo-section{
  width:100%;padding:56px 24px;
  background:linear-gradient(to bottom,#fff,rgba(232,245,233,.35),#fff);
}
.esclusivo-section .esc-inner{max-width:1100px;margin:0 auto}

.price-badge{
  display:inline-block;padding:8px 16px;border-radius:100px;
  background:rgba(46,125,50,.08);border:1px solid rgba(46,125,50,.15);
  font-size:14px;font-weight:800;color:var(--emerald);margin-top:12px;
}

.num-cards{display:flex;flex-direction:column;gap:14px;margin-top:32px}
.num-card{
  padding:18px;border-radius:20px;background:#fff;
  border:1px solid;
  box-shadow:0 4px 14px rgba(0,0,0,.03);
}
.num-card .nc-header{display:flex;align-items:center;gap:8px}
.num-card .nc-num{
  width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:900;
}
.num-card .nc-emoji{font-size:20px}
.num-card .nc-title{font-size:14px;font-weight:800;margin-top:12px}
.num-card .nc-body{font-size:12px;line-height:1.55;color:var(--slate500);margin-top:8px}

/* "Tutto incluso" box */
.included-box{
  max-width:800px;margin:28px auto 0;padding:20px;border-radius:20px;text-align:center;
}
.included-box.green-box{background:rgba(46,125,50,.04);border:1px solid rgba(46,125,50,.2)}
.included-box .ib-title{font-size:17px;font-weight:800;color:var(--slate900)}
.included-chips{display:flex;flex-wrap:wrap;gap:10px 12px;justify-content:center;margin-top:16px}
.included-chip{
  display:inline-block;padding:7px 12px;border-radius:10px;
  background:rgba(46,125,50,.06);border:1px solid rgba(46,125,50,.12);
  font-size:12px;font-weight:600;color:var(--emerald);
}

/* =============================================================================
   CONDIVISO — Metodo Condiviso
   ============================================================================= */
.condiviso-section{
  width:100%;padding:56px 24px;
  background:linear-gradient(to bottom,#FFF8E1,#FFF3E0,#FFF8E1);
}
.condiviso-section .cond-inner{max-width:1100px;margin:0 auto}

.amber-badge{
  display:inline-block;padding:10px 20px;border-radius:100px;
  background:linear-gradient(135deg,#FBBF24,#D97706);
  box-shadow:0 4px 16px rgba(217,119,6,.3);
  font-size:16px;font-weight:900;color:#fff;margin-top:16px;
}

/* Esclusivo vs Condiviso mini compare */
.vs-box{
  max-width:700px;margin:32px auto 0;padding:18px;border-radius:16px;
  background:rgba(255,255,255,.7);border:1px solid rgba(217,119,6,.2);
  display:flex;align-items:center;
}
.vs-box .vs-col{flex:1;text-align:center}
.vs-box .vs-col .vs-label{font-size:13px;font-weight:700}
.vs-box .vs-col .vs-price{font-size:14px;font-weight:600;margin-top:4px}
.vs-box .vs-col .vs-desc{font-size:11px;line-height:1.4;margin-top:6px}
.vs-box .vs-col.dim .vs-label,.vs-box .vs-col.dim .vs-price,.vs-box .vs-col.dim .vs-desc{color:var(--slate400)}
.vs-box .vs-col.hl .vs-label,.vs-box .vs-col.hl .vs-price{color:var(--amber)}
.vs-box .vs-col.hl .vs-desc{color:var(--slate700);font-weight:600}
.vs-badge{
  padding:6px 12px;border-radius:8px;background:var(--amber);
  font-size:12px;font-weight:900;color:#fff;margin:0 8px;flex-shrink:0;
}

/* Condiviso "Tutto incluso" */
.cond-included{
  max-width:800px;margin:28px auto 0;padding:20px;border-radius:20px;
  background:#fff;border:1px solid rgba(217,119,6,.25);
  box-shadow:0 6px 20px rgba(217,119,6,.08);
}
.cond-included .ci-title{font-size:17px;font-weight:800;color:var(--slate900);text-align:center}
.cond-included .ci-grid{display:flex;gap:16px;margin-top:16px}
.ci-col{flex:1}
.pro-con-item{display:flex;align-items:flex-start;gap:6px;margin-bottom:6px;font-size:12px;line-height:1.4;color:var(--slate700)}
.pro-con-item .material-icons{font-size:15px;flex-shrink:0}
.pro-con-item.pro .material-icons{color:var(--emerald)}
.pro-con-item.con .material-icons{color:#E65100}

/* =============================================================================
   HOW IT WORKS
   ============================================================================= */
.how-section{
  width:100%;background:#fff;padding:56px 24px;
}
.how-section .how-inner{max-width:1100px;margin:0 auto}

/* CTA box (used in HowItWorks and Catalog) */
.cta-box{
  max-width:700px;margin:32px auto 0;padding:22px 24px;border-radius:20px;text-align:center;
}
.cta-box.green{background:linear-gradient(135deg,#F0FDF4,#DCFCE7);border:1px solid rgba(46,125,50,.2)}
.cta-box.amber{background:linear-gradient(135deg,#FFF8E1,#FFF3E0);border:1px solid rgba(217,119,6,.2)}
.cta-box .cta-title{font-size:18px;font-weight:800;color:var(--slate900)}
.cta-box .cta-desc{font-size:14px;line-height:1.5;color:var(--slate500);margin-top:8px}
.cta-box .cta-btn{
  display:inline-block;margin-top:18px;padding:14px 24px;border-radius:12px;
  font-size:15px;font-weight:800;letter-spacing:.3px;cursor:pointer;
}
.cta-btn.green-btn{
  background:linear-gradient(135deg,#43A047,#2E7D32);color:#fff;
  box-shadow:0 4px 16px rgba(46,125,50,.25);
}
.cta-btn.amber-btn{
  background:linear-gradient(135deg,#FBBF24,#D97706);color:#451A03;
  box-shadow:0 4px 16px rgba(217,119,6,.3);
}

/* =============================================================================
   CATALOG
   ============================================================================= */
.catalog-section{
  width:100%;padding:56px 0;
  background:linear-gradient(to bottom,#F0FDF4,#FAFAF9,#F0FDF4);
}
.catalog-section .cat-header{padding:0 24px}
.catalog-section .cat-inner{max-width:1100px;margin:0 auto}

.prod-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:12px;
  padding:0 24px;margin-top:32px;
}
.prod-card{
  padding:14px;border-radius:18px;background:#fff;
  border:1px solid var(--slate200);
  box-shadow:0 3px 10px rgba(0,0,0,.03);
  transition:transform .18s,border-color .18s,box-shadow .18s;
}
.prod-card:hover{
  transform:scale(1.03);
  border-color:rgba(46,125,50,.3);
  box-shadow:0 6px 20px rgba(46,125,50,.1);
}
.prod-card .pc-top{display:flex;align-items:center;justify-content:space-between}
.prod-card .pc-emoji{font-size:28px}
.prod-card .pc-badge{
  display:inline-block;padding:2px 6px;border-radius:5px;
  background:rgba(46,125,50,.07);
  font-size:9px;font-weight:800;color:var(--emerald);
}
.prod-card .pc-name{font-size:13px;font-weight:800;color:var(--slate900);line-height:1.2;margin-top:8px}
.prod-card .pc-desc{font-size:11px;line-height:1.45;color:var(--slate500);margin-top:6px}

/* =============================================================================
   FEATURES
   ============================================================================= */
.features-section{
  width:100%;background:#FEF3C7;padding:56px 24px;
}
.features-section .feat-inner{max-width:1100px;margin:0 auto}

.feat-cards{display:flex;flex-direction:column;gap:12px;margin-top:36px}
.feat-card{
  padding:18px;border-radius:20px;background:#fff;
  border:1px solid;
  box-shadow:0 4px 14px rgba(0,0,0,.03);
}
.feat-card .fc-icon{
  width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;
}
.feat-card .fc-title{font-size:14px;font-weight:800;margin-top:12px}
.feat-card .fc-body{font-size:12px;line-height:1.55;color:var(--slate500);margin-top:6px}

/* =============================================================================
   PRICING
   ============================================================================= */
.pricing-section{
  width:100%;background:#fff;padding:64px 24px;
}
.pricing-section .price-inner{max-width:960px;margin:0 auto}

.price-cards{display:flex;flex-direction:column;gap:20px;margin-top:48px}
.price-card{
  padding:32px;border-radius:24px;
  transition:transform .22s,box-shadow .22s;
}
.price-card:hover{transform:scale(1.02)}
.price-card.standard{background:#fff;border:1px solid #E7E5E4}
.price-card.standard:hover{box-shadow:0 8px 20px rgba(0,0,0,.06)}
.price-card.highlighted{
  background:linear-gradient(135deg,#1B5E20,#2E7D32,#388E3C);color:#fff;
  box-shadow:0 12px 24px rgba(46,125,50,.18);
}
.price-card.highlighted:hover{box-shadow:0 12px 48px rgba(46,125,50,.35)}

.price-card .pc-badges{display:flex;flex-wrap:wrap;gap:6px 8px;margin-bottom:16px}
.pc-popular{
  display:inline-block;padding:5px 12px;border-radius:100px;
  background:linear-gradient(135deg,#FBBF24,#D97706);
  font-size:11px;font-weight:700;color:#fff;
}

.price-card .pc-head{display:flex;align-items:center;gap:8px}
.price-card .pc-head .pc-emoji{font-size:24px}
.price-card .pc-head .pc-name{font-size:20px;font-weight:700}
.price-card.standard .pc-head .pc-name{color:#1C1917}
.price-card .pc-sub{font-size:13px;margin-top:4px;display:inline}
.price-card.standard .pc-sub{color:#78716C}
.price-card.highlighted .pc-sub{color:rgba(255,255,255,.65)}

.price-card .pc-price{display:flex;align-items:flex-end;gap:3px;margin-top:24px}
.price-card .pc-amount{font-size:48px;font-weight:900;line-height:1;letter-spacing:-2px}
.price-card.standard .pc-amount{color:#1C1917}
.price-card .pc-period{font-size:15px;padding-bottom:8px}
.price-card.standard .pc-period{color:#78716C}
.price-card.highlighted .pc-period{color:rgba(255,255,255,.5)}

.price-card .pc-divider{height:1px;margin:24px 0 16px}
.price-card.standard .pc-divider{background:#E7E5E4}
.price-card.highlighted .pc-divider{background:rgba(255,255,255,.12)}

.price-card .pc-feat{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}
.price-card .pc-feat .material-icons{font-size:18px;flex-shrink:0}
.price-card.standard .pc-feat .material-icons{color:var(--emerald)}
.price-card.highlighted .pc-feat .material-icons{color:#A5D6A7}
.price-card .pc-feat span{font-size:14px;line-height:1.4}
.price-card.standard .pc-feat span{color:#44403C}
.price-card.highlighted .pc-feat span{color:rgba(255,255,255,.9)}

.price-card .pc-btn{
  display:block;width:100%;height:52px;border-radius:14px;margin-top:24px;
  font-size:15px;font-weight:700;text-align:center;line-height:52px;cursor:pointer;
}
.price-card.standard .pc-btn{border:1px solid #D6D3D1;color:#1C1917;background:#fff}
.price-card.highlighted .pc-btn{
  background:linear-gradient(135deg,#FBBF24,#D97706);color:#fff;border:none;
  box-shadow:0 4px 12px rgba(217,119,6,.3);
}

/* =============================================================================
   REVIEWS
   ============================================================================= */
.reviews-section{
  width:100%;background:#FAFAF9;padding:64px 24px;
}
.reviews-section .rev-inner{max-width:1100px;margin:0 auto}

.review-cards{display:flex;flex-direction:column;gap:14px;margin-top:48px}
.review-card{
  padding:24px;border-radius:20px;background:#fff;border:1px solid #E7E5E4;
}
.review-card .rc-top{display:flex;align-items:center;justify-content:space-between}
.review-card .rc-stars{display:flex;gap:1px}
.review-card .rc-stars .material-icons{font-size:16px;color:var(--gold)}
.review-card .rc-emoji{font-size:22px}
.review-card .rc-text{font-size:14px;font-style:italic;line-height:1.7;color:#44403C;margin-top:16px}
.review-card .rc-author{display:flex;align-items:center;gap:10px;margin-top:20px}
.review-card .rc-avatar{
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,#2E7D32,#43A047);
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:700;color:#fff;flex-shrink:0;
}
.review-card .rc-name{font-size:13px;font-weight:700;color:#1C1917}
.review-card .rc-city{font-size:11px;color:#78716C}

/* =============================================================================
   FAQ
   ============================================================================= */
.faq-section{padding:64px 16px 48px}
.faq-inner{max-width:760px;margin:0 auto}
.faq-list{margin-top:36px;text-align:left}
.faq-item{
  border-bottom:1px solid var(--slate200);
}
.faq-item:first-child{border-top:1px solid var(--slate200)}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  padding:18px 4px;font-size:15px;font-weight:600;color:var(--slate900);
  cursor:pointer;background:none;border:none;font-family:inherit;text-align:left;
  transition:color .2s;
}
.faq-q:hover{color:var(--emerald)}
.faq-arrow{
  font-size:22px;color:var(--slate400);transition:transform .3s ease,color .3s;flex-shrink:0;margin-left:12px;
}
.faq-item.open .faq-arrow{transform:rotate(180deg);color:var(--emerald)}
.faq-a{
  max-height:0;overflow:hidden;transition:max-height .35s ease,padding .35s ease;
  padding:0 4px;
}
.faq-item.open .faq-a{
  max-height:300px;padding:0 4px 18px;
}
.faq-a p{
  font-size:14px;line-height:1.7;color:var(--slate500);
}

/* =============================================================================
   FINAL CTA
   ============================================================================= */
.final-cta-section{
  margin:20px 16px;border-radius:28px;
  background:linear-gradient(135deg,var(--emerald-dark),var(--emerald),#10B981);
  box-shadow:0 16px 40px rgba(46,125,50,.2);
  padding:48px 28px;text-align:center;
}
.final-cta-section .fc-emoji{font-size:44px}
.final-cta-section .fc-title{font-size:28px;font-weight:900;color:#fff;letter-spacing:-1.5px;margin-top:20px}
.final-cta-section .fc-desc{font-size:16px;color:rgba(255,255,255,.85);line-height:1.6;max-width:400px;margin:14px auto 0}
.final-cta-section .fc-btn{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:32px;padding:18px 36px;border-radius:14px;
  background:#fff;color:var(--emerald-dark);
  font-size:16px;font-weight:700;cursor:pointer;
}
.final-cta-section .fc-btn .material-icons{font-size:18px}

/* =============================================================================
   FOOTER
   ============================================================================= */
.footer{
  background:linear-gradient(135deg,#1A1410,#0F172A);
  padding:36px 24px;
}
.footer .footer-inner{max-width:1100px;margin:0 auto}
.footer .footer-inner.mob{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.footer .f-logo{display:flex;align-items:center;gap:8px}
.footer .f-logo .f-logo-box{
  width:26px;height:26px;border-radius:7px;background:var(--red);
  display:flex;align-items:center;justify-content:center;font-size:15px;
}
.footer .f-logo-text{font-size:17px;font-weight:700}
.footer .f-logo-box .logo-emoji{filter:grayscale(1) brightness(10)}
.footer .f-links{display:flex;flex-wrap:wrap;gap:6px 22px;justify-content:center}
.footer .f-links a{font-size:13px;color:rgba(255,255,255,.35)}
.footer .f-copy{font-size:12px;color:rgba(255,255,255,.2)}

/* =============================================================================
   PARTICLES CANVAS
   ============================================================================= */
#particles-canvas{
  position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;
}

/* =============================================================================
   DESKTOP OVERRIDES (>= 768px)
   ============================================================================= */
@media(min-width:768px){
  .nav{padding:0 40px}
  .nav .logo-text{display:inline-flex}
  .nav .nav-register{font-size:14px;margin-left:12px}
  .nav .nav-login{padding:10px 20px;font-size:14px}
  .lang-select{margin-right:12px}
  .lang-current{padding:8px 8px}
  /* nav-login-text::after content managed by i18n JS */

  .hero-content{padding:110px 56px 80px}
  .hero-emoji-strip{top:160px;height:64px}
  .hero-emoji-strip .strip-inner{font-size:48px}
  .hero-badge{margin-top:0}

  .hero-split-title .title-row{font-size:96px}
  .hero-split-title .letter-group{top:0}
  .hero-split-title .t-app{font-size:calc(96px * .75)}
  .hero-split-title .t-amo{font-size:calc(96px * .75)}
  .hero-split-title .icon-drop .material-icons{font-size:60px}
  .hero-split-title .nca{font-size:76px}

  .hero-subtitle{font-size:19px;margin-top:32px}
  .hero-stat .stat-val{font-size:28px}
  .hero-stats .hero-stat-sep{margin:0 20px}
  .hero-cta-wrap{margin-top:48px}
  .hero-mocks{padding:0 60px 60px}
  .terrain-mock{border-radius:24px}
  .hero-mocks .terrain-mock{border-radius:22px}

  /* Float cards visible on desktop */
  .float-card{width:110px;padding:10px;border-radius:14px}
  .float-card .fc-emoji{font-size:28px}
  .float-card .fc-name{font-size:12px;font-weight:800}
  .float-card .fc-detail{display:block;font-size:9px;color:var(--slate400);line-height:1.3;margin-top:2px}
  .float-card.fc-passata{left:-30px;top:70px}
  .float-card.fc-sottolio{left:-25px;bottom:120px}
  .float-card.fc-sottaceti{display:block;right:-30px;top:10px}
  .float-card.fc-conserva{right:-25px;top:auto;bottom:250px}
  .float-card.fc-pesto{display:block;right:80px;bottom:-20px}
  .float-card.fc-verdure{left:60px;right:auto;bottom:-20px}

  .trust-strip{padding:22px 64px}
  .trust-strip .ts-inner{gap:10px 44px}

  .section-title{font-size:52px}
  .section-title.why-title-size{font-size:38px;font-weight:800}
  .section-title.pricing-title-size{font-size:42px}

  .why-section{padding:80px 64px}
  .why-cards{flex-direction:row;gap:20px}
  .why-cards .why-card{flex:1}

  .diy-section{padding:96px 64px}
  .cost-cards{flex-direction:row;align-items:flex-start;gap:8px}
  .cost-cards .cost-card{flex:1;min-height:190px}
  .cost-cards .desk-arrow{display:flex;align-items:center;padding-top:40px}

  .esclusivo-section{padding:96px 64px}
  .num-cards{flex-direction:row;align-items:flex-start;gap:8px}
  .num-cards .num-card{flex:1;min-height:190px}
  .num-cards .desk-arrow{display:flex;align-items:center;padding-top:40px}

  .condiviso-section{padding:96px 64px}

  .how-section{padding:96px 64px}

  .catalog-section{padding:96px 0}
  .catalog-section .cat-header{padding:0 64px}
  .prod-grid{grid-template-columns:repeat(5,1fr);gap:14px;padding:0 64px}

  .features-section{padding:96px 64px}
  .feat-cards{flex-direction:row;flex-wrap:wrap;gap:14px}
  .feat-card{flex:1 1 calc(33.333% - 10px);min-width:280px}

  .pricing-section{padding:96px 64px}
  .price-cards{flex-direction:row}
  .price-card{flex:1}

  .reviews-section{padding:96px 64px}
  .review-cards{flex-direction:row;flex-wrap:wrap;gap:16px;justify-content:center}
  .review-card{width:340px;flex-shrink:0}

  .faq-section{padding:96px 64px}
  .faq-q{font-size:16px;padding:22px 4px}
  .faq-a p{font-size:15px}

  .final-cta-section{margin:32px 48px;padding:72px 64px}
  .final-cta-section .fc-title{font-size:38px}

  .footer{padding:36px 64px}
  .footer .footer-inner.desk{display:flex;align-items:center;justify-content:space-between}

  .glow-ring.r1{width:320px;height:320px;border-width:1.5px}
  .glow-ring.r2{width:260px;height:260px;border-width:1.2px}
  .glow-ring.r3{width:120px;height:120px;border-width:0.8px}
  .glow-ring.r4{width:180px;height:180px;border-width:1px}
  .glow-ring.r5{width:90px;height:90px;border-width:0.8px}

  .cta-box .cta-title{font-size:22px}
  .cta-box .cta-btn{padding:14px 32px}
  .diy-closer{padding:28px}
  .diy-closer .closer-title{font-size:20px}
  .included-box{padding:28px}
  .included-box .ib-title{font-size:20px}
  .cond-included{padding:24px}
  .cond-included .ci-title{font-size:20px}
}

/* -- Desktop desk arrow (hidden on mobile) -- */
.desk-arrow{display:none}
@media(min-width:768px){.desk-arrow{display:flex}}
.desk-arrow .material-icons{font-size:20px;color:var(--slate400)}

/* =============================================================================
   DESKTOP OVERRIDES (>= 1100px)
   ============================================================================= */
@media(min-width:1100px){
  .hero-emoji-strip{top:160px}
}

/* -- Smooth link hover -- */
a:hover{opacity:.85}
.hero-cta:active,.cta-btn:active,.price-card .pc-btn:active,.final-cta-section .fc-btn:active{transform:scale(.97)}