/* =========================================================
   Piattaforma guide — pagine pubbliche
   I colori arrivano dal config (variabili in <head>)
   ========================================================= */

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:90px; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font-body); font-size:clamp(15.5px,1.02vw,17px); font-weight:300; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; padding:0; }
h1,h2,h3{ font-family:var(--font-display); font-weight:500; line-height:1.12; color:var(--primary); margin:0 0 .5em; letter-spacing:-.005em; }
h1{ font-size:clamp(2.2rem,4.6vw,3.6rem); }
h2{ font-size:clamp(1.6rem,2.8vw,2.3rem); }
p{ margin:0 0 1em; }
strong{ font-weight:500; }

.skip{ position:absolute; left:-9999px; }
.skip:focus{ left:16px; top:16px; z-index:200; background:var(--surface); padding:8px 14px; border-radius:6px; }

.wrap{ width:min(100% - 2*clamp(16px,5vw,48px), 1120px); margin-inline:auto; }
.wrap--narrow{ width:min(100% - 2*clamp(16px,5vw,48px), 760px); }

.eyebrow{ font-size:.74rem; font-weight:400; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin-bottom:.9em; }
.lead{ font-size:clamp(1.05rem,1.4vw,1.22rem); color:var(--soft); }
.soft{ color:var(--soft); }
.small{ font-size:.86rem; }
.link{ color:var(--primary); border-bottom:1px solid var(--accent); }
.link:hover{ color:var(--accent); }

/* ---------- pulsanti ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  padding:.85em 1.7em; border-radius:999px; border:1px solid var(--primary);
  font-size:.9rem; font-weight:400; letter-spacing:.04em; line-height:1.2; text-align:center;
  transition:background .25s, color .25s, border-color .25s, transform .25s;
}
.btn--primary{ background:var(--primary); color:var(--surface); }
.btn--primary:hover{ background:var(--ink); border-color:var(--ink); }
.btn--ghost{ color:var(--primary); }
.btn--ghost:hover{ background:var(--primary); color:var(--surface); }
.btn--lg{ padding:1.05em 2.1em; font-size:1rem; }
.btn--sm{ padding:.6em 1.2em; font-size:.82rem; }
.btn:disabled{ opacity:.65; cursor:wait; }
.btn:focus-visible, a:focus-visible, button:focus-visible, summary:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }

/* ---------- testata ---------- */
.top{ position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--bg) 92%, transparent); border-bottom:1px solid var(--line); }
@supports not (background:color-mix(in srgb, red 50%, blue)){ .top{ background:var(--bg); } }
.top__inner{ display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:72px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand img{ width:44px; height:44px; }
.brand__name{ display:block; font-family:var(--font-display); font-size:1.25rem; font-weight:500; color:var(--primary); line-height:1.1; }
.brand__role{ display:block; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--soft); }
.top__nav{ display:flex; gap:22px; font-size:.86rem; }
.top__nav a:hover{ color:var(--accent); }
@media (max-width:560px){ .brand__role{ display:none; } .top__nav{ gap:14px; font-size:.8rem; } }

/* ---------- sezioni ---------- */
.section{ padding-block:clamp(56px,8vw,104px); }
.section--tight{ padding-block:clamp(36px,5vw,64px) clamp(56px,8vw,104px); }
.section--alt{ background:var(--surface); border-block:1px solid var(--line); }
.pagehead{ padding-block:clamp(56px,8vw,100px) clamp(8px,2vw,20px); }
.pagehead--center{ text-align:center; padding-bottom:clamp(56px,8vw,100px); }
.prose p{ color:var(--soft); }
.prose p:first-child{ font-size:1.08em; color:var(--ink); }

/* ---------- pagina guida ---------- */
.hero{ padding-block:clamp(36px,6vw,84px); }
.hero__grid{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr); gap:clamp(28px,6vw,80px); align-items:center; }
.hero__cover img, .cover-ph{
  width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:6px 14px 14px 6px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.35), inset 4px 0 0 rgba(0,0,0,.05);
}
.hero__cover{ max-width:440px; justify-self:center; width:100%; }
.cover-ph{ display:grid; place-items:center; padding:12%; background:linear-gradient(160deg, var(--muted), var(--primary)); }
.cover-ph span{ font-family:var(--font-display); font-size:clamp(1.4rem,2.6vw,2rem); color:var(--surface); text-align:center; line-height:1.15; }
.buy{ margin-top:28px; padding:clamp(22px,3vw,30px); background:var(--surface); border:1px solid var(--line); border-radius:16px; }
.price{ font-family:var(--font-display); font-size:clamp(2rem,3.4vw,2.6rem); font-weight:500; color:var(--primary); line-height:1; margin:0; }
.price-note{ font-size:.78rem; color:var(--soft); margin:.5em 0 0; }
.buy form{ margin-top:20px; display:grid; gap:18px; }
.buy .btn{ width:100%; }
.check{ display:flex; gap:12px; align-items:flex-start; font-size:.82rem; line-height:1.5; color:var(--soft); cursor:pointer; }
.check input{ flex:none; width:20px; height:20px; margin:1px 0 0; accent-color:var(--primary); }
.trust{ list-style:none; margin:18px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:6px 18px; font-size:.78rem; color:var(--soft); }
.trust li::before{ content:"✓ "; color:var(--accent); }
.alert{ margin:16px 0 0; padding:12px 14px; border-radius:10px; background:#FBEDEA; color:#8A2E22; font-size:.88rem; }
@media (max-width:820px){
  .hero__grid{ grid-template-columns:1fr; }
  .hero__cover{ max-width:220px; }
  .hero__text{ text-align:center; }
  .buy{ text-align:left; }
}

.ticks{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.ticks li{ position:relative; padding-left:34px; font-size:1.05rem; }
.ticks li::before{
  content:""; position:absolute; left:0; top:.32em; width:20px; height:20px; border-radius:50%;
  background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat;
}

.author{ display:grid; grid-template-columns:200px 1fr; gap:clamp(24px,5vw,56px); align-items:center; max-width:880px; }
.author__photo{ width:200px; aspect-ratio:4/5; object-fit:cover; object-position:top; border-radius:120px 120px 12px 12px; }
@media (max-width:640px){ .author{ grid-template-columns:1fr; text-align:center; } .author__photo{ margin-inline:auto; width:170px; } }

.faq{ display:grid; gap:10px; }
.faq details{ background:var(--bg); border:1px solid var(--line); border-radius:12px; padding:0 20px; }
.section--alt .faq details{ background:var(--bg); }
.faq summary{ cursor:pointer; list-style:none; padding:18px 28px 18px 0; position:relative; font-weight:400; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; position:absolute; right:0; top:50%; transform:translateY(-50%); font-size:1.4rem; color:var(--accent); }
.faq details[open] summary::after{ content:"–"; }
.faq details p{ color:var(--soft); padding-bottom:18px; margin:0; }

.final{ text-align:center; }
.final .price{ margin:.2em 0 .8em; }

.sticky-buy{
  position:fixed; left:12px; right:12px; bottom:12px; z-index:60;
  display:none; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 10px 10px 18px; background:var(--surface); border:1px solid var(--line); border-radius:999px;
  box-shadow:0 14px 40px -14px rgba(0,0,0,.3); font-size:.84rem;
  transform:translateY(140%); transition:transform .3s ease;
}
.sticky-buy span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sticky-buy.is-on{ transform:none; }
@media (max-width:820px){ .sticky-buy{ display:flex; } }

/* ---------- catalogo ---------- */
.cards{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px,1fr)); gap:clamp(20px,3vw,36px); }
.card{ display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:16px; overflow:hidden; transition:transform .3s, box-shadow .3s; }
.card:hover{ transform:translateY(-4px); box-shadow:0 24px 50px -28px rgba(0,0,0,.3); }
.card img, .card .cover-ph{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:0; box-shadow:none; }
.card__body{ padding:20px 22px 24px; display:flex; flex-direction:column; flex:1; }
.card h2{ font-size:1.45rem; margin-bottom:.3em; }
.card p{ font-size:.9rem; color:var(--soft); }
.card__price{ margin-top:auto; font-family:var(--font-display); font-size:1.5rem; color:var(--primary); }
.empty{ text-align:center; color:var(--soft); }

/* ---------- grazie / download ---------- */
.download-form{ margin:28px 0 18px; }
.note{ margin:24px auto 0; max-width:560px; padding:18px 22px; background:var(--surface); border:1px solid var(--line); border-radius:12px; font-size:.9rem; color:var(--soft); }
.back{ margin-top:32px; }

/* ---------- testi legali ---------- */
.legal h2{ font-size:1.45rem; margin-top:1.8em; }
.legal h2:first-child{ margin-top:0; }
.legal ul{ padding-left:1.2em; color:var(--soft); }
.legal li{ margin-bottom:.6em; }
.legal a{ color:var(--primary); border-bottom:1px solid var(--accent); }

/* ---------- piede ---------- */
.foot{ border-top:1px solid var(--line); padding-block:28px 96px; font-size:.78rem; color:var(--soft); }
.foot__inner{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 28px; }
.foot p{ margin:0; }
.foot__links{ display:flex; flex-wrap:wrap; gap:6px 20px; }
.foot__links a:hover, .foot__links button:hover{ color:var(--primary); }
@media (min-width:821px){ .foot{ padding-bottom:28px; } }

/* ---------- consenso cookie ---------- */
.consent{
  position:fixed; z-index:120; left:12px; right:12px; bottom:12px; margin-inline:auto; max-width:620px;
  display:flex; flex-wrap:wrap; align-items:center; gap:14px 20px;
  padding:18px 22px; background:var(--surface); border:1px solid var(--line); border-radius:16px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.4); font-size:.84rem;
}
.consent[hidden]{ display:none; }
.consent p{ margin:0; flex:1 1 300px; color:var(--soft); }
.consent a{ color:var(--primary); border-bottom:1px solid var(--accent); }
.consent__btns{ display:flex; gap:10px; }