/* Tema "caldo" (crema / inchiostro / arancio) allineato a Studio Foto AI */
:root{--bg:#f6f1ea;--sand:#ece4d8;--card:#fff;--ink:#14120f;--muted:#5d574e;--line:rgba(20,18,15,.12);--accent:#ff5b2e;--accent-dark:#e24a1f;--serif:"Instrument Serif",Georgia,serif}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%}
.min-h-screen.bg-white,.min-h-screen{background:var(--bg)}

/* ---------- header ---------- */
.nav{position:sticky;top:0;z-index:60;background:rgba(246,241,234,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;gap:20px;max-width:1320px;margin:0 auto;padding:0 20px;height:68px}
.brand{display:flex;align-items:center;margin-right:auto}
.brand img{height:38px;width:auto}
.nav-links{display:none;gap:26px;font-size:14px;font-weight:500;margin-right:12px}
.nav-links a{color:var(--muted);text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--ink)}
.nav-cta{display:none;align-items:center;min-height:42px;padding:0 20px;border-radius:999px;background:var(--accent);color:#fff;font-size:14px;font-weight:600;text-decoration:none;transition:background .2s,transform .2s}
.nav-cta:hover{background:var(--accent-dark);transform:translateY(-1px)}
.nav-burger{display:grid;place-items:center;width:44px;height:44px;border:1.5px solid var(--line);border-radius:50%;background:#fff;color:var(--ink);cursor:pointer}
.mnav{display:flex;flex-direction:column;padding:8px 20px 20px;border-top:1px solid var(--line);background:var(--bg)}
.mnav[hidden]{display:none}
.mnav a{padding:14px 0;border-bottom:1px solid var(--line);color:var(--ink);font-weight:600;text-decoration:none}
.mnav .mnav-cta{margin-top:16px;border:0;border-radius:999px;background:var(--accent);color:#fff;text-align:center}
@media(min-width:1020px){.nav-links{display:flex}.nav-cta{display:inline-flex}.nav-burger{display:none}.mnav{display:none!important}}
@media(min-width:760px){.nav-in{padding:0 32px}}

/* ---------- tipografia ---------- */
h1,h2{font-family:var(--serif);font-weight:400!important;letter-spacing:-.01em;line-height:1.05!important}
h1{font-size:clamp(2.4rem,6vw,4.4rem)!important}
h2{font-size:clamp(2rem,4.5vw,3.4rem)!important}
h1 span[class*="95BF47"],h2 span[class*="95BF47"]{font-style:italic}
#carousel-title{font-size:clamp(2.3rem,6.2vw,5rem)!important}
h3{letter-spacing:-.01em}
span.uppercase[class*="95BF47"],span.tracking-wide{letter-spacing:.06em}
.text-slate-900{color:var(--ink)}
.text-slate-800,.text-slate-700{color:#2b2823}
.text-slate-600,.text-slate-500{color:var(--muted)}

/* ---------- accento: verde Shopify -> arancio ---------- */
[class*="text-[#95BF47]"]{color:var(--accent)}
[class*="bg-[#95BF47]"]:not([class*="/"]){background-color:var(--accent)!important}
[class*="bg-[#95BF47]/10"]{background-color:rgba(255,91,46,.1)}
[class*="bg-[#95BF47]/20"]{background-color:rgba(255,91,46,.18)}
[class*="bg-[#82a83e]"]{background-color:var(--accent-dark)}
[class*="border-[#95BF47]"]{border-color:var(--accent)}
[class*="from-[#95BF47]"]{--tw-gradient-from:rgba(255,91,46,.18) var(--tw-gradient-from-position);--tw-gradient-to:rgba(255,91,46,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
[class*="focus:ring-[#95BF47]"]:focus{--tw-ring-color:rgba(255,91,46,.25)}
[class*="focus:border-[#95BF47]"]:focus{border-color:var(--accent)}

/* ---------- sfondi sezione ---------- */
section.bg-white,div.bg-white.relative.border-b{background:var(--bg)!important}
section.bg-slate-50,section[class*="from-slate-50"],section[class*="from-purple-50"]{background:var(--sand)!important;background-image:none!important}
section.min-h-screen{background:var(--bg)!important;background-image:none!important;min-height:0}
section.min-h-screen .blur-3xl{opacity:.55}
section[class*="from-slate-900"],section.bg-slate-900,div[class*="from-slate-900"],footer.bg-slate-900{background:var(--ink)!important;background-image:none!important}
.border-slate-200,.border-slate-100,.border-b.border-slate-200{border-color:var(--line)}
.bg-slate-50:not(section),.bg-slate-100:not(section){background-color:#fff}

/* ---------- bottoni ---------- */
button[class*="bg-slate-900"],a[class*="bg-slate-900"]{background:var(--accent)!important;color:#fff!important;border-radius:999px!important;font-weight:600;transition:background .2s,transform .2s}
button[class*="bg-slate-900"]:hover,a[class*="bg-slate-900"]:hover{background:var(--accent-dark)!important;transform:translateY(-2px)}
button[class*="rounded"],a.inline-flex[class*="rounded"]{border-radius:999px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.nav-btn{border-radius:999px!important}
input,select,textarea{border-radius:14px!important;border-color:var(--line)!important;background:#fff!important}

/* ---------- card ---------- */
.rounded-2xl{border-radius:22px}
.rounded-3xl{border-radius:28px}
.group.relative.bg-slate-50{background:#fff;border:1px solid transparent;box-shadow:0 1px 0 var(--line)}
.group.relative.bg-slate-50:hover{box-shadow:0 22px 44px -22px rgba(20,18,15,.3);transform:translateY(-3px)}
section[class*="from-slate-900"] .bg-white\/5,section[class*="from-slate-900"] [class*="bg-white/5"]{border-radius:22px}

/* ---------- hero: il blocco a slide ---------- */
div[class*="from-slate-900"].min-h-\[650px\]{min-height:0}
div.h-64{height:auto;min-height:22rem}
@media(min-width:768px){div.h-64{min-height:19rem}}
div.h-32{height:auto;min-height:7rem}

/* ---------- mobile ---------- */
@media(max-width:759px){
  .py-24{padding-top:60px!important;padding-bottom:60px!important}
  .py-20{padding-top:44px!important;padding-bottom:44px!important}
  .py-16{padding-top:40px!important;padding-bottom:40px!important}
  .px-6{padding-left:20px;padding-right:20px}
  .mb-16{margin-bottom:2.25rem}
  .gap-16,.gap-12{gap:2rem}
  .p-12{padding:1.5rem}
  .p-8{padding:1.25rem}
  .whitespace-nowrap{white-space:normal!important}
  button[class*="h-14"],button[class*="h-10"],button[class*="h-11"]{height:auto!important;min-height:52px;padding:14px 22px!important;line-height:1.25;text-align:center}
  .px-10{padding-left:22px!important;padding-right:22px!important}
  .text-xl.md\:text-2xl,.text-lg.md\:text-2xl{font-size:1.05rem}
  #carousel-icon-box{width:72px;height:72px}
  div.h-64{min-height:27rem}
  div.h-32{min-height:6rem}
  .inline-flex.rounded-full{max-width:100%;text-align:left}
  table{display:block;overflow-x:auto}
  .grid-cols-3.gap-8{gap:.75rem}
  .text-3xl{font-size:1.6rem}
  footer .grid{gap:2rem}
}
@media(max-width:380px){h1{font-size:2.1rem!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
[class*="bg-[#95BF47]/9"]{background-color:rgba(255,91,46,.92)!important}

/* ---------- hero (blocchi custom) ---------- */
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.hero-cta.center{justify-content:center}
.hero-btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:14px 28px;border-radius:999px;background:var(--accent);color:#fff;font-weight:600;font-size:16px;line-height:1.2;text-align:center;text-decoration:none;transition:background .2s,transform .2s}
.hero-btn:hover{background:var(--accent-dark);transform:translateY(-2px)}
.hero-btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.hero-btn.ghost:hover{background:var(--ink);color:#fff}
.hero-link{font-size:15px;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:40px;padding-top:28px;border-top:1px solid var(--line);max-width:36rem}
.pillar{display:block;padding:14px 16px;border-radius:16px;background:#fff;box-shadow:0 1px 0 var(--line);font-size:14px;font-weight:600;line-height:1.35;color:var(--ink);text-decoration:none;transition:transform .2s,box-shadow .2s}
.pillar:hover{transform:translateY(-3px);box-shadow:0 14px 30px -16px rgba(20,18,15,.35)}
.hero-note{margin:18px 0 0;font-size:13px;color:var(--muted)}
.ba-title{margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ba-fig{position:relative;margin:0;overflow:hidden;border-radius:14px;background:var(--sand);aspect-ratio:3/4}
.ba-fig img{width:100%;height:100%;object-fit:cover;display:block}
.ba-fig figcaption{position:absolute;left:8px;top:8px;padding:3px 10px;border-radius:999px;background:rgba(20,18,15,.78);color:#fff;font-size:11px;font-weight:600}
.ba-fig figcaption.on{background:var(--accent)}
.ba-link{display:block;margin-top:16px;text-align:center;font-size:14px;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:4px}
@media(max-width:759px){.hero-btn{width:100%}.pillars{grid-template-columns:1fr}.hero-cta{gap:14px}.hero-link{display:block;text-align:center;width:100%}}
#carousel-icon-box{background:var(--accent)!important;background-image:none!important;border-radius:26px}
div.h-64 a.inline-block{margin-top:1.75rem}
@media(min-width:768px){div.h-64{min-height:25rem}}
@media(max-width:759px){div.h-64{min-height:31rem}}
@media(max-width:759px){div.h-64{min-height:26rem}}
div.bg-slate-900,div.bg-slate-800{background-color:var(--ink)}
.w-14.h-14[class*="bg-gradient"],.w-12.h-12[class*="bg-gradient"]{background-image:none!important;background-color:var(--ink)!important}
@media(max-width:759px){.-right-6,.-right-8,.-right-4{right:10px!important}.-left-8,.-left-6,.-left-4{left:10px!important}.-bottom-6,.-bottom-8{bottom:-18px!important}}

/* ---------- hero2 ---------- */
.hero2{position:relative;overflow:hidden;padding:56px 0 0;background:var(--bg)}
.hero2-bg i{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;pointer-events:none}
.hero2-bg i:first-child{width:420px;height:420px;right:-120px;top:-100px;background:rgba(255,91,46,.28)}
.hero2-bg i:last-child{width:360px;height:360px;left:-140px;bottom:40px;background:rgba(236,228,216,.9)}
.hero2-in{position:relative;display:grid;gap:56px;align-items:center;max-width:1320px;margin:0 auto;padding:0 20px 72px}
.hero2-pill{display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;padding:9px 18px;border-radius:999px;background:#fff;box-shadow:0 1px 0 var(--line);font-size:14px;font-weight:600}
.hero2-pill .dot{width:8px;height:8px;border-radius:50%;background:#1f8a4c;box-shadow:0 0 0 0 rgba(31,138,76,.5);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(31,138,76,0)}100%{box-shadow:0 0 0 0 rgba(31,138,76,0)}}
.hero2 h1{font-size:clamp(2.5rem,6vw,4.6rem)!important}
.rot-wrap{display:block;min-height:2.2em}
.rot{display:inline-block;color:var(--accent);font-style:italic;transition:opacity .35s,transform .35s}
.rot.out{opacity:0;transform:translateY(10px)}
.hero2-sub{margin:22px 0 0;max-width:34rem;font-size:18px;line-height:1.6;color:var(--muted)}
.hero2 .hero-cta{margin-top:30px}
.hero2-proof{display:flex;flex-wrap:wrap;gap:8px 22px;margin:24px 0 0;padding:0;list-style:none;font-size:14px;font-weight:500;color:var(--muted)}
.hero2-proof li::before{content:"✓";margin-right:8px;color:#1f8a4c;font-weight:700}
.hero2-visual{position:relative;max-width:520px;width:100%;margin:0 auto}
.h2-card{padding:14px;border-radius:28px;background:#fff;box-shadow:0 30px 70px -30px rgba(20,18,15,.45);animation:h2float 7s ease-in-out infinite}
@keyframes h2float{50%{transform:translateY(-6px) rotate(.3deg)}}
.h2-tabs{display:flex;gap:6px;margin-bottom:12px}
.h2-tabs button{padding:8px 16px;border:0;border-radius:999px;background:var(--sand);color:var(--ink);font:600 13px Inter,sans-serif;cursor:pointer;transition:all .2s}
.h2-tabs button.on{background:var(--ink);color:#fff}
.h2-ba{position:relative;overflow:hidden;border-radius:18px;background:var(--sand);aspect-ratio:4/5;user-select:none}
.h2-ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.h2-ba .before{clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.h2-ba .bar{position:absolute;top:0;bottom:0;left:var(--p);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.15);pointer-events:none}
.h2-ba .bar::after{content:"↔";position:absolute;top:50%;left:50%;width:44px;height:44px;margin:-22px 0 0 -22px;display:grid;place-items:center;border-radius:50%;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.25);font-size:18px}
.h2-ba input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.tg{position:absolute;top:12px;padding:4px 12px;border-radius:999px;background:rgba(20,18,15,.78);color:#fff;font-size:12px;font-weight:600;pointer-events:none}
.tg.l{left:12px}.tg.r{right:12px;background:var(--accent)}
.h2-cap{margin:12px 4px 2px;font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
.h2-cap a{margin-left:auto;font-weight:600;color:var(--ink)}
.h2-chip{position:absolute;z-index:3;padding:10px 16px;border-radius:999px;background:#fff;box-shadow:0 14px 34px -14px rgba(20,18,15,.4);font-size:13px;font-weight:600;white-space:nowrap;animation:chipf 5s ease-in-out infinite}
.h2-chip.c1{left:-26px;top:22%}.h2-chip.c2{right:-18px;top:52%;animation-delay:-1.6s}.h2-chip.c3{left:-14px;bottom:12%;animation-delay:-3.2s}
@keyframes chipf{50%{transform:translateY(-8px)}}
.marq{position:relative;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--ink);color:#fff}
.marq-t{display:flex;width:max-content;animation:marq 32s linear infinite}
.marq-t span{padding:18px 34px;font:italic 24px/1 "Instrument Serif",serif;white-space:nowrap;opacity:.85}
.marq-t span::after{content:"✦";margin-left:68px;color:var(--accent);font-style:normal;font-size:14px}
@keyframes marq{to{transform:translateX(-50%)}}
@media(min-width:980px){.hero2{padding-top:72px}.hero2-in{grid-template-columns:1.1fr .9fr;gap:80px;padding:0 32px 88px}}
@media(max-width:979px){.h2-chip.c1{left:-6px}.h2-chip.c2{right:-4px}.h2-chip.c3{left:-4px}}
@media(max-width:759px){.h2-chip{font-size:12px;padding:8px 12px}.h2-chip.c3{display:none}.rot-wrap{min-height:2.4em}}
@media(prefers-reduced-motion:reduce){.h2-card,.h2-chip,.marq-t,.hero2-pill .dot{animation:none}}
.h2-tabs{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-right:-4px}
.h2-tabs::-webkit-scrollbar{display:none}
.h2-tabs button{flex:none;white-space:nowrap}
.h2-ba img{transition:opacity .3s}
.cat-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:24px}
.cat-tabs .nav-btn{border:0;cursor:pointer;color:#fff}
.cat-tabs .nav-btn.bg-white\/10,.cat-tabs .nav-btn[class*="bg-white/10"]{background:rgba(255,255,255,.12);color:rgba(255,255,255,.8)}
#before-after-container img{object-fit:cover}
