/* RG Legal – Avv. Giovanni Ruosi */
:root{
  --paper:#F6F6F3; --surface:#FFFFFF; --ink:#14213A; --muted:#5B6475; --rule:#DCDDD7;
  --primary:#14274A; --primary-ink:#FFFFFF; --gold:#A8842F; --gold-text:#8A6A1E; --gold-soft:#F5EEDF;
  --band:#0E1B33; --band-ink:#F2EEE6; --band-muted:#9AA6BC; --band-rule:#24365A;
  --l-ink:#14274A; --l-gold:#A8842F; --l-g1:#D4B06A; --l-g2:#9C7A2E;
  --serif:"Libre Caslon Display", Georgia, "Times New Roman", serif;
  --sans:"Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --brand:"Michroma", "Public Sans", system-ui, sans-serif;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --paper:#0E1B33; --surface:#152544; --ink:#F2EEE6; --muted:#9AA6BC; --rule:#24365A;
  --primary:#D2AE62; --primary-ink:#0E1B33; --gold:#D2AE62; --gold-text:#D2AE62; --gold-soft:#1E2B45;
  --band:#081224; --band-ink:#F2EEE6; --band-muted:#9AA6BC; --band-rule:#24365A;
  --l-ink:#F2EEE6; --l-gold:#D2AE62; --l-g1:#E2C27E; --l-g2:#B08A3E; color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#0E1B33; --surface:#152544; --ink:#F2EEE6; --muted:#9AA6BC; --rule:#24365A;
    --primary:#D2AE62; --primary-ink:#0E1B33; --gold:#D2AE62; --gold-text:#D2AE62; --gold-soft:#1E2B45;
    --band:#081224; --band-ink:#F2EEE6; --band-muted:#9AA6BC; --band-rule:#24365A;
    --l-ink:#F2EEE6; --l-gold:#D2AE62; --l-g1:#E2C27E; --l-g2:#B08A3E; color-scheme:dark;
  }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5.5rem}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.65 var(--sans);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--primary);color:var(--primary-ink);padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem}
.wrap{max-width:72rem;margin:0 auto;padding:0 1.5rem}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.1;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(2rem,4vw,2.75rem)}
p{margin:0}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:.6rem;font:600 .95rem/1 var(--sans);padding:.95rem 1.4rem;border-radius:4px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:filter .15s,border-color .15s}
.btn-primary{background:var(--primary);color:var(--primary-ink)}
.btn-primary:hover{filter:brightness(1.12)}
.btn-ghost{border-color:var(--rule);background:transparent;color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink)}
.btn svg{width:18px;height:18px;flex:none}

/* Barra contatti */
.topbar{background:var(--band);color:var(--band-muted);font-size:.85rem}
.topbar .wrap{display:flex;justify-content:space-between;gap:1rem;padding-top:.55rem;padding-bottom:.55rem;flex-wrap:wrap}
.topbar a{color:var(--band-ink);text-decoration:none}
.topbar a:hover{text-decoration:underline}

/* Header */
header{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:4.75rem;gap:1rem}
.brand{text-decoration:none;display:flex;align-items:center;gap:.8rem}
.brand svg{width:3rem;height:auto;flex:none}
.brand-text{display:flex;flex-direction:column;line-height:1.2}
.brand-text strong{font-family:var(--brand);font-weight:400;font-size:1.05rem;letter-spacing:.12em}
.brand-text span{font-size:.8rem;color:var(--muted)}
nav ul{list-style:none;display:flex;gap:1.75rem;margin:0;padding:0;font-size:.95rem;font-weight:500}
nav a{text-decoration:none;color:var(--muted)}
nav a:hover,nav a[aria-current]{color:var(--ink)}
.head-actions{display:flex;align-items:center;gap:.5rem}
.icon-btn{width:2.5rem;height:2.5rem;border-radius:4px;border:1px solid var(--rule);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.icon-btn svg{width:18px;height:18px}
#menu-btn{display:none}
@media (max-width:900px){
  nav{display:none;position:absolute;top:4.75rem;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--rule)}
  nav.open{display:block}
  nav ul{flex-direction:column;gap:0;padding:.5rem 1.5rem 1rem}
  nav li a{display:block;padding:.75rem 0;border-bottom:1px solid var(--rule)}
  #menu-btn{display:grid}
  .head-actions .btn{display:none}
}
@media (max-width:420px){.brand-text span{display:none}}

/* Hero */
.hero{padding:clamp(3rem,8vw,6rem) 0 clamp(3rem,7vw,5rem)}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);margin-bottom:1.5rem}
.hero .lead{font-size:1.2rem;color:var(--muted);max-width:34rem;margin-bottom:2rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:2.5rem}
.facts{display:grid;grid-template-columns:repeat(3,auto);gap:1.5rem 2.5rem;padding-top:1.5rem;border-top:1px solid var(--rule);font-size:.9rem;justify-content:start;margin:0}
.facts dt{color:var(--muted)}
.facts dd{margin:0;font-weight:600}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr}.facts{grid-template-columns:1fr 1fr}}

/* Calcolatore termini */
.termine{background:var(--surface);border:1px solid var(--rule);border-top:6px solid var(--gold);border-radius:4px;padding:1.75rem}
.termine h2{font-size:1.75rem;margin-bottom:.4rem}
.termine > p{font-size:.95rem;color:var(--muted);margin-bottom:1.5rem}
.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}
.field label{font-size:.875rem;font-weight:600}
.field select,.field input,.field textarea{font:inherit;font-size:1rem;color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:.75rem .85rem;width:100%}
.field select:focus,.field input:focus,.field textarea:focus{outline:2px solid var(--primary);outline-offset:0;border-color:var(--primary)}
.result{margin-top:1.5rem;padding:1.25rem;background:var(--gold-soft);border-radius:4px}
.result .label{font-size:.875rem;color:var(--muted)}
.result .date{font-family:var(--serif);font-size:clamp(2rem,4vw,2.6rem);line-height:1.1;margin:.25rem 0}
.result .left{font-weight:600;color:var(--gold-text)}
.result .note{font-size:.85rem;color:var(--muted);margin-top:.75rem}
.result.expired .left{color:#B42318}
:root[data-theme="dark"] .result.expired .left{color:#F97066}
.disclaimer{font-size:.8rem;color:var(--muted);margin-top:1rem;line-height:1.5}

/* Sezioni */
section{padding:clamp(3.5rem,8vw,6rem) 0}
.section-head{max-width:40rem;margin-bottom:3rem}
.section-head p{margin-top:1rem;color:var(--muted);font-size:1.1rem}

/* Ambiti */
.ambiti{border-top:1px solid var(--ink)}
.ambito{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:2rem;padding:2rem 0;border-bottom:1px solid var(--rule)}
.ambito h3{font-size:1.75rem}
.ambito p{color:var(--muted);max-width:38rem}
.ambito ul{list-style:none;padding:0;margin:1rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem}
.ambito li{font-size:.85rem;padding:.3rem .7rem;border:1px solid var(--rule);border-radius:100px}
@media (max-width:760px){.ambito{grid-template-columns:1fr;gap:.75rem}}

/* Metodo */
.band{background:var(--band);color:var(--band-ink)}
.band .section-head p{color:var(--band-muted)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;list-style:none;padding:0;margin:0;counter-reset:s}
.steps li{counter-increment:s;border-top:1px solid var(--band-rule);padding-top:1.25rem}
.steps li::before{content:counter(s);font-family:var(--serif);font-size:3rem;line-height:1;color:#D2AE62;display:block;margin-bottom:1rem}
.steps h3{font-size:1.4rem;margin-bottom:.5rem}
.steps p{color:var(--band-muted);font-size:.975rem}
@media (max-width:760px){.steps{grid-template-columns:1fr}}

/* Profilo */
.profilo{display:grid;grid-template-columns:17rem 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.ritratto{aspect-ratio:4/5;background:var(--surface);border:1px solid var(--rule);display:grid;place-items:center}
.ritratto img{width:100%;height:100%;object-fit:cover}
.ritratto svg{width:72%;height:auto}
.profilo .bio{max-width:40rem}
.profilo .bio p + p{margin-top:1rem}
.registro{margin:2rem 0 0;display:grid;grid-template-columns:auto 1fr;gap:.6rem 2rem;font-size:.95rem;padding-top:1.5rem;border-top:1px solid var(--rule)}
.registro dt{color:var(--muted)}
.registro dd{margin:0;font-weight:600;overflow-wrap:anywhere}
@media (max-width:700px){.profilo{grid-template-columns:1fr}.ritratto{max-width:15rem}}

/* Animazione del marchio, quando entra in vista */
.anima .st{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0)}
.anima .bs{transform-box:fill-box;transform-origin:0 50%;transform:scaleX(0)}
.anima .rg,.anima .pt{opacity:0}
.anima.vivo .st{animation:gy .5s cubic-bezier(.2,.8,.2,1) forwards}
.anima.vivo .bs{animation:gx .6s cubic-bezier(.2,.8,.2,1) .35s forwards}
.anima.vivo .rg{animation:fa .7s ease-out .8s forwards}
.anima.vivo .pt{animation:fa .3s ease-out 1.1s forwards}
@keyframes gy{to{transform:scaleY(1)}}@keyframes gx{to{transform:scaleX(1)}}@keyframes fa{to{opacity:1}}

/* Sedi */
.sedi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:2rem;align-items:stretch}
.sede-tabs{display:flex;flex-direction:column;gap:1rem}
.sede{text-align:left;font:inherit;color:inherit;background:var(--surface);border:1px solid var(--rule);border-radius:4px;padding:1.5rem;cursor:pointer;border-left:4px solid transparent}
.sede[aria-pressed="true"]{border-left-color:var(--gold)}
.sede h3{font-size:1.5rem;margin-bottom:.4rem}
.sede p{font-size:.95rem;color:var(--muted)}
.sede .tel{display:block;margin-top:.75rem;font-weight:600}
.mappa{min-height:22rem;border:1px solid var(--rule);border-radius:4px;overflow:hidden;background:var(--surface);display:grid;place-items:center;text-align:center;padding:1.5rem}
.mappa.caricata{padding:0}
.mappa iframe{width:100%;height:100%;min-height:22rem;border:0;display:block}
.mappa p{font-size:.9rem;color:var(--muted);max-width:26rem;margin:0 auto 1.25rem}
@media (max-width:900px){.sedi{grid-template-columns:1fr}}

/* Contatti */
.contatti{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,5vw,4rem)}
.canali{list-style:none;padding:0;margin:2rem 0 0}
.canali li{padding:1rem 0;border-bottom:1px solid var(--rule)}
.canali span{display:block;font-size:.85rem;color:var(--muted)}
.canali a{font-weight:600;text-decoration:none;font-size:1.1rem;overflow-wrap:anywhere}
.canali a:hover{text-decoration:underline}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.check{display:flex;gap:.6rem;align-items:flex-start;font-size:.875rem;color:var(--muted);margin:.5rem 0 1.25rem}
.check input{margin-top:.25rem;accent-color:var(--primary)}
.form-note{font-size:.85rem;color:var(--muted);margin-top:.75rem}
@media (max-width:900px){.contatti{grid-template-columns:1fr}}
@media (max-width:560px){form .row{grid-template-columns:1fr}}

/* Pagine legali */
.doc{max-width:46rem;padding-top:clamp(2.5rem,6vw,4.5rem);padding-bottom:4rem}
.doc h1{font-size:clamp(2.2rem,5vw,3.2rem);margin-bottom:.75rem}
.doc h2{font-size:1.6rem;margin:2.5rem 0 .75rem}
.doc p,.doc li{color:var(--ink)}
.doc p + p{margin-top:.9rem}
.doc ul{padding-left:1.2rem}
.doc li + li{margin-top:.4rem}
.doc .agg{color:var(--muted);font-size:.9rem}
.doc table{width:100%;border-collapse:collapse;font-size:.92rem;margin-top:1rem}
.doc th,.doc td{text-align:left;padding:.6rem .5rem;border-bottom:1px solid var(--rule);vertical-align:top}
.doc .tabella{overflow-x:auto}

/* Footer */
footer{border-top:1px solid var(--rule);padding:2.5rem 0;font-size:.85rem;color:var(--muted)}
footer .wrap{display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
footer strong{color:var(--ink);font-weight:600}
footer .destra{text-align:right}
@media (max-width:600px){footer .destra{text-align:left}}

.wa{position:fixed;right:1.25rem;bottom:1.25rem;z-index:30;width:3.25rem;height:3.25rem;border-radius:50%;background:#1F8A4C;color:#fff;display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.18)}
.wa svg{width:26px;height:26px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*{transition:none!important}
  .anima .st,.anima .bs{transform:none}.anima .rg,.anima .pt{opacity:1}
  .anima.vivo .st,.anima.vivo .bs,.anima.vivo .rg,.anima.vivo .pt{animation:none}
}