/* solutions.css - pagine "soluzione" per i saloni (gestionale parrucchieri, centri estetici,
   app prenotazioni). Stessa grafica della pagina /it/admin, ma in un foglio condiviso invece
   degli stili inline, così le pagine restano leggere e coerenti tra loro. */

body { margin:0; background:#faf8f4; font-family:'Inter',sans-serif; color:#1a1a1a; -webkit-font-smoothing:antialiased; }
a { color:#1a1a1a; text-decoration:none; }
a:hover { color:#D4AF37; }
.page { max-width:100%; overflow-x:hidden; }
.wrap { max-width:1200px; margin:0 auto; padding:0 24px; }
.narrow { max-width:820px; }

.btn { display:inline-block; padding:15px 28px; border-radius:30px; font-size:12.5px; font-weight:700; letter-spacing:1px; text-transform:uppercase; text-align:center; }
.btn-dark { background:#1a1a1a; color:#fff; transition:background .2s,color .2s,transform .2s,box-shadow .2s; }
.btn-dark:hover { background:#D4AF37; color:#1a1a1a; transform:translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,0.15); }
.btn-gold { background:#D4AF37; border:2px solid #D4AF37; color:#1a1a1a; transition:background .2s,color .2s,transform .2s,box-shadow .2s; }
.btn-gold:hover { background:transparent; color:#8a6d12; transform:translateY(-2px); box-shadow:0 10px 22px rgba(212,175,55,0.25); }
.btn-outline-dark { border:2px solid #1a1a1a; color:#1a1a1a; transition:background .2s,color .2s,transform .2s; }
.btn-outline-dark:hover { background:#1a1a1a; color:#fff; transform:translateY(-2px); }
.btn-outline-white { border:2px solid #fff; color:#fff; transition:background .2s,color .2s,transform .2s; }
.btn-outline-white:hover { background:#fff; color:#1a1a1a; transform:translateY(-2px); }

/* barra in alto + header */
.topbar { display:block; background:#1a1a1a; color:#fff; text-align:center; padding:9px 16px; font-size:12px; font-weight:600; letter-spacing:0.3px; }
.topbar span { color:#D4AF37; font-weight:700; }
.topbar:hover { color:#fff; }
.site-header { position:sticky; top:0; z-index:50; background:rgba(250,248,244,0.92); backdrop-filter:blur(12px); border-bottom:1px solid rgba(26,26,26,0.08); }
.site-header .bar { max-width:1200px; margin:0 auto; padding:14px 24px; display:flex; align-items:center; gap:28px; }
.brand { display:flex; align-items:center; gap:10px; flex:0 0 auto; font-family:'Poppins',sans-serif; font-size:19px; font-weight:700; letter-spacing:0.3px; white-space:nowrap; }
.brand img { width:38px; height:38px; object-fit:contain; display:block; }
.brand small { font-size:inherit; font-weight:400; color:#8a6d12; margin-left:5px; }
.nav-links { display:flex; flex:1 1 auto; gap:22px; font-size:12.5px; font-weight:500; letter-spacing:0.4px; text-transform:uppercase; color:#4a4740; }
.nav-cta { flex:0 0 auto; padding:11px 20px; font-size:12px; letter-spacing:0.8px; }
.hamburger-btn { display:none; margin-left:auto; background:none; border:none; font-size:21px; color:#1a1a1a; cursor:pointer; padding:6px 2px; line-height:1; }
.mobile-nav-panel { display:none; flex-direction:column; padding:6px 24px 18px; border-top:1px solid rgba(26,26,26,0.08); background:#faf8f4; }
.mobile-nav-panel.open { display:flex; }
.mobile-nav-panel a { padding:13px 0; font-size:13px; font-weight:600; letter-spacing:0.4px; text-transform:uppercase; color:#4a4740; border-bottom:1px solid rgba(26,26,26,0.06); }
.mobile-nav-panel a.btn-dark { margin-top:14px; border-radius:30px; padding:13px 0; border-bottom:none; color:#fff; text-align:center; }
@media (max-width: 860px) {
  .nav-links, .nav-cta { display:none; }
  .hamburger-btn { display:inline-flex; align-items:center; justify-content:center; margin-left:0; }
  .lang-menu { margin-left:auto; }
  .site-header .bar { gap:14px; padding:12px 18px; }
}
@media (max-width: 400px) {
  .brand { font-size:17px; gap:8px; }
  .brand img { width:32px; height:32px; }
}
@media (max-width: 340px) {
  .brand small { display:none; }
}

/* briciole di pane */
.crumbs { max-width:1200px; margin:0 auto; padding:18px 24px 0; font-size:12.5px; color:#66625a; }
.crumbs ol { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px; }
.crumbs li + li::before { content:"›"; margin-right:6px; color:#9a968c; }
.crumbs a { color:#66625a; text-decoration:underline; text-underline-offset:3px; }

/* hero */
.hero { max-width:1200px; margin:0 auto; padding:40px 24px 56px; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr)); gap:48px; align-items:center; }
.hero > div { min-width:0; }
.eyebrow { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:#8a6d12; font-weight:700; margin-bottom:14px; }
.hero h1 { font-family:'Poppins',sans-serif; font-size:clamp(32px,4vw,52px); line-height:1.08; font-weight:700; margin:0 0 20px; }
.hero h1 em { color:#8a6d12; font-style:italic; }
.lead { font-size:16.5px; line-height:1.65; color:#55524a; margin:0 0 28px; max-width:540px; }
.hero-ctas { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:22px; }
.hero-note { display:flex; align-items:center; gap:8px; font-size:13px; color:#55524a; font-weight:600; margin:0; }
.hero-note i { color:#D4AF37; }
.hero-shots { position:relative; background:linear-gradient(150deg,#1f1d19 0%,#2b2419 55%,#4a3c17 100%); border-radius:28px; padding:34px 24px; display:flex; gap:18px; justify-content:center; align-items:flex-start; overflow:hidden; }
.hero-shots::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 75% 15%,rgba(212,175,55,0.35),transparent 55%); pointer-events:none; }
.hero-shots img { position:relative; width:46%; max-width:230px; height:auto; aspect-ratio:640/853; border-radius:16px; display:block; box-shadow:0 18px 40px rgba(0,0,0,0.45); }
.hero-shots img + img { margin-top:36px; }

/* riquadro "in breve": risposta diretta, pensata anche per i motori di ricerca AI */
.summary { max-width:1200px; margin:0 auto; padding:0 24px; }
.summary > div { background:#fff; border:1px solid rgba(26,26,26,0.09); border-left:4px solid #D4AF37; border-radius:16px; padding:24px 26px; }
.summary h2 { font-family:'Poppins',sans-serif; font-size:17px; margin:0 0 10px; }
.summary p { font-size:15px; line-height:1.7; color:#3f3c35; margin:0; }
.summary dl { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr)); gap:14px 24px; margin:18px 0 0; }
.summary dt { font-size:11px; letter-spacing:1.4px; text-transform:uppercase; color:#8a6d12; font-weight:700; margin-bottom:3px; }
.summary dd { margin:0; font-size:14px; line-height:1.5; color:#1a1a1a; font-weight:600; }

/* sezioni */
.section { max-width:1200px; margin:0 auto; padding:80px 24px 24px; }
.section-kicker { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:#8a8578; font-weight:700; margin-bottom:12px; }
.section h2 { font-family:'Poppins',sans-serif; font-size:clamp(26px,3.2vw,40px); line-height:1.15; margin:0 0 12px; max-width:720px; }
.section-sub { font-size:15.5px; color:#55524a; margin:0 0 34px; max-width:640px; line-height:1.6; }

/* problema -> soluzione */
.pains { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:20px; }
.pain { background:#fff; border:1px solid rgba(26,26,26,0.09); border-radius:18px; padding:24px 24px 22px; }
.pain h3 { font-family:'Poppins',sans-serif; font-size:16.5px; line-height:1.35; margin:0 0 10px; }
.pain p { font-size:14px; line-height:1.65; color:#55524a; margin:0; }
.pain .fix { display:block; margin-top:12px; padding-top:12px; border-top:1px dashed rgba(26,26,26,0.12); font-size:13.5px; color:#1a1a1a; font-weight:600; line-height:1.55; }
.pain .fix i { color:#D4AF37; margin-right:6px; }

/* funzioni */
.features { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr)); gap:22px 28px; }
.feature { display:flex; gap:16px; align-items:flex-start; }
.feature .ic { width:44px; height:44px; border-radius:12px; background:rgba(212,175,55,0.12); color:#8a6d12; display:flex; align-items:center; justify-content:center; font-size:18px; flex:0 0 auto; }
.feature h3 { font-family:'Poppins',sans-serif; font-size:16px; font-weight:600; margin:0 0 4px; }
.feature p { font-size:13.5px; line-height:1.6; color:#55524a; margin:0; }
.tag { display:inline-block; margin-left:6px; background:#1a1a1a; color:#D4AF37; font-family:'Inter',sans-serif; font-size:10px; font-weight:700; letter-spacing:0.8px; text-transform:uppercase; padding:2px 8px; border-radius:10px; vertical-align:middle; }

/* passaggi */
.steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr)); gap:16px; counter-reset:step; }
.steps li { counter-increment:step; background:#1a1a1a; color:#fff; border-radius:18px; padding:22px 20px; }
.steps li::before { content:counter(step); display:flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; background:#D4AF37; color:#1a1a1a; font-weight:700; font-size:13px; margin-bottom:14px; }
.steps strong { display:block; font-family:'Poppins',sans-serif; font-size:15px; margin-bottom:6px; }
.steps span { display:block; font-size:13px; line-height:1.55; color:#b6b2a8; }

/* schermate */
.shots { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.shots figure { margin:0; background:#fff; border:1px solid rgba(26,26,26,0.09); border-radius:16px; padding:12px; }
.shots img { width:100%; height:auto; aspect-ratio:640/853; border-radius:10px; display:block; object-fit:cover; }
.shots figcaption { font-size:13px; font-weight:600; margin-top:10px; }
@media (max-width: 900px) { .shots { grid-template-columns:repeat(2,1fr); gap:14px; } }

/* prezzi (riassunto) */
.plans { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:22px; max-width:900px; }
.plan { background:#fff; border:1px solid rgba(26,26,26,0.1); border-radius:20px; padding:28px 26px; }
.plan.dark { background:#1a1a1a; color:#fff; border-color:#1a1a1a; }
.plan-name { font-size:11px; letter-spacing:1.6px; text-transform:uppercase; color:#8a6d12; font-weight:700; margin-bottom:8px; }
.plan.dark .plan-name { color:#D4AF37; }
.plan-price { font-family:'Poppins',sans-serif; font-size:34px; font-weight:700; }
.plan-price small { font-family:'Inter',sans-serif; font-size:13px; font-weight:400; color:#66625a; margin-left:4px; }
.plan.dark .plan-price small { color:#b6b2a8; }
.plan p { font-size:14px; line-height:1.6; color:#55524a; margin:10px 0 0; }
.plan.dark p { color:#d8d5cc; }
.plans-note { font-size:13.5px; color:#55524a; margin:22px 0 0; line-height:1.6; }
.plans-note a { color:#8a6d12; font-weight:600; text-decoration:underline; text-underline-offset:3px; }

/* FAQ (stesso markup delle altre pagine: toggleFaq in landing.js) */
.faq-list { display:flex; flex-direction:column; gap:12px; }
.faq-item { background:#fff; border:1px solid rgba(26,26,26,0.09); border-radius:14px; overflow:hidden; }
.faq-q { padding:20px 22px; display:flex; gap:16px; justify-content:space-between; align-items:center; cursor:pointer; }
.faq-q:hover { background:#fdfcf9; }
.faq-q h3 { font-family:'Inter',sans-serif; font-size:15px; font-weight:600; line-height:1.45; margin:0; }
.faq-icon { color:#8a6d12; font-size:20px; line-height:1; flex:0 0 auto; }
.faq-a { padding:0 22px 22px; font-size:14px; line-height:1.7; color:#55524a; max-width:680px; }
.faq-a a { color:#8a6d12; font-weight:600; }

/* altre soluzioni */
.related { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)); gap:14px; }
.related a { display:block; background:#fff; border:1px solid rgba(26,26,26,0.09); border-radius:14px; padding:18px 20px; transition:border-color .2s, transform .2s; }
.related a:hover { color:#1a1a1a; border-color:#D4AF37; transform:translateY(-2px); }
.related strong { display:block; font-family:'Poppins',sans-serif; font-size:15px; margin-bottom:4px; }
.related span { display:block; font-size:13px; line-height:1.5; color:#66625a; }

/* chiusura */
.cta { margin-top:80px; background:#1a1a1a; color:#fff; padding:80px 24px; text-align:center; }
.cta h2 { font-family:'Poppins',sans-serif; font-size:clamp(28px,3.6vw,44px); line-height:1.15; margin:0 0 16px; color:#fff; }
.cta p { font-size:16px; line-height:1.7; color:#b6b2a8; margin:0 auto 30px; max-width:560px; }
.cta .row { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.pill { display:inline-flex; align-items:center; gap:8px; background:rgba(212,175,55,0.12); border:1px solid rgba(212,175,55,0.4); color:#D4AF37; padding:7px 16px; border-radius:30px; font-size:11.5px; font-weight:700; letter-spacing:1px; text-transform:uppercase; margin-bottom:18px; }

/* footer */
.site-footer { background:#111; color:#fff; padding:64px 24px 24px; }
.site-footer .cols { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr)); gap:36px; padding-bottom:40px; }
.site-footer .title { font-family:'Poppins',sans-serif; font-size:19px; font-weight:700; margin-bottom:12px; }
.site-footer .head { font-size:12px; letter-spacing:1.4px; text-transform:uppercase; color:#D4AF37; font-weight:700; margin-bottom:14px; }
.site-footer .links { display:flex; flex-direction:column; gap:9px; font-size:13px; }
.site-footer .links a, .site-footer p { color:#9a968c; }
.site-footer p { font-size:13px; line-height:1.6; margin:0; }
.site-footer .legal { max-width:1200px; margin:0 auto; border-top:1px solid #333; padding-top:20px; text-align:center; font-size:11.5px; color:#666; }
.site-footer .legal a, .site-footer .legal span { color:#9a968c; text-decoration:underline; cursor:pointer; }

/* animazioni (reveal.js) */
@keyframes heroIn { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
.hero-anim > * { opacity:0; animation:heroIn .7s ease forwards; }
.hero-anim > *:nth-child(2) { animation-delay:.1s; }
.hero-anim > *:nth-child(3) { animation-delay:.2s; }
.hero-anim > *:nth-child(4) { animation-delay:.3s; }
.hero-anim > *:nth-child(5) { animation-delay:.4s; }
.hero-shots { animation:heroIn .8s ease .2s both; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.reveal.reveal-visible { opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .hero-anim > *, .hero-shots, .reveal { opacity:1 !important; transform:none !important; animation:none !important; transition:none !important; }
}

/* banner cookie */
#cookieBanner { display:none; position:fixed; left:0; right:0; bottom:0; z-index:200; background:#1a1a1a; color:#fff; padding:16px 24px; box-shadow:0 -4px 20px rgba(0,0,0,0.25); }
#cookieBanner .in { max-width:1200px; margin:0 auto; display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
#cookieBanner .txt { flex:1; min-width:220px; font-size:13px; line-height:1.6; color:#d8d5cc; }
#cookieBanner .txt a { color:#D4AF37; text-decoration:underline; }
#cookieBanner .btns { display:flex; gap:10px; flex-wrap:wrap; }
#cookieBanner .btns div { cursor:pointer; background:transparent; color:#fff; border:2px solid #fff; padding:9px 20px; border-radius:8px; font-size:12px; font-weight:700; white-space:nowrap; }
