@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

:root{
  --ink:#1f2e3d;
  --ink-soft:#4a5a68;
  --paper:#f3efe4;
  --paper-raised:#fbf9f3;
  --terracotta:#a85630;
  --terracotta-dark:#7d3e22;
  --verdigris:#5c7267;
  --line:#d9d0bb;
  --line-strong:#b9ad8f;
  --radius:2px;
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', system-ui, sans-serif;
  font-size:16px;
  line-height:1.6;
}

h1,h2,h3{
  font-family:'Newsreader', Georgia, serif;
  font-weight:500;
  color:var(--ink);
  line-height:1.2;
  margin:0 0 .5em;
}

h1{font-size:2.4rem; font-weight:500;}
h2{font-size:1.5rem; border-bottom:1px solid var(--line); padding-bottom:.4em; margin-bottom:.8em;}
h3{font-size:1.15rem; color:var(--terracotta-dark);}

p{margin:0 0 1em;}
a{color:var(--terracotta-dark);}
a:hover{color:var(--terracotta);}

ul{padding-left:1.2em;}
li{margin-bottom:.5em;}

/* ---------- Skip link ---------- */
.skip-link{
  position:absolute; left:-999px; top:auto;
  background:var(--ink); color:#fff; padding:.6em 1em;
  z-index:100;
}
.skip-link:focus{left:0; top:0;}

/* ---------- Top bar ---------- */
.topbar{
  background:var(--ink);
  color:#e9e4d6;
  font-size:.85rem;
}
.topbar-inner{
  max-width:1080px; margin:0 auto; padding:.5em 1.25em;
  display:flex; flex-wrap:wrap; gap:.4em 1.5em; justify-content:space-between;
}
.topbar a{color:#e9e4d6; text-decoration:none;}
.topbar a:hover{color:#fff; text-decoration:underline;}

/* ---------- Header / brand ---------- */
.site-header{
  background:var(--paper-raised);
  border-bottom:3px solid var(--terracotta);
}
.brand-row{
  max-width:1080px; margin:0 auto; padding:1.4em 1.25em 1.1em;
  display:flex; align-items:baseline; justify-content:space-between; gap:1em; flex-wrap:wrap;
}
.brand{
  font-family:'Newsreader', serif;
  font-size:1.9rem;
  color:var(--ink);
  text-decoration:none;
  letter-spacing:.01em;
}
.brand em{
  font-style:normal;
  color:var(--terracotta-dark);
}
.brand-tag{
  font-size:.8rem;
  color:var(--ink-soft);
  letter-spacing:.08em;
}

/* ---------- Nav (registry tabs) ---------- */
.site-nav{
  background:var(--paper);
  border-bottom:1px solid var(--line-strong);
}
.site-nav ul{
  max-width:1080px; margin:0 auto; padding:0 .75em;
  list-style:none;
  display:flex; flex-wrap:wrap;
}
.site-nav a{
  display:block;
  padding:.85em 1em;
  text-decoration:none;
  color:var(--ink-soft);
  font-size:.92rem;
  border-right:1px solid var(--line);
  white-space:nowrap;
}
.site-nav li:last-child a{border-right:none;}
.site-nav a:hover{background:var(--paper-raised); color:var(--terracotta-dark);}
.site-nav a[aria-current="page"]{
  color:var(--ink);
  font-weight:600;
  background:var(--paper-raised);
  box-shadow:inset 0 -3px 0 var(--terracotta);
}

/* ---------- Layout ---------- */
.page{
  max-width:1080px; margin:0 auto; padding:2.5em 1.25em 4em;
  display:grid; grid-template-columns: 200px 1fr; gap:2.5em;
  align-items:start;
}
.page.narrow{grid-template-columns:1fr;}

.side-index{
  position:sticky; top:1.5em;
  font-size:.88rem;
  border-left:2px solid var(--line);
  padding-left:1em;
}
.side-index h3{font-size:.78rem; letter-spacing:.06em; color:var(--ink-soft); margin-bottom:.6em; text-transform:none;}
.side-index ul{list-style:none; padding:0; margin:0;}
.side-index li{margin-bottom:.5em;}
.side-index a{color:var(--ink-soft); text-decoration:none;}
.side-index a:hover{color:var(--terracotta-dark);}

.content-card{
  background:var(--paper-raised);
  border:1px solid var(--line);
  padding:2em 2.2em;
  position:relative;
}
.content-card::before{
  content:"";
  position:absolute; left:0; top:0; bottom:0; width:4px;
  background:var(--terracotta);
}

/* ---------- Hero (home) ---------- */
.hero{
  max-width:1080px; margin:0 auto; padding:3em 1.25em 2em;
  display:grid; grid-template-columns: 1.3fr 1fr; gap:2.5em; align-items:start;
}
.hero-copy{animation:rise .6s ease both;}
@keyframes rise{
  from{opacity:0; transform:translateY(10px);}
  to{opacity:1; transform:translateY(0);}
}
.hero-copy h1{margin-bottom:.35em;}
.hero-lede{font-size:1.1rem; color:var(--ink-soft); max-width:38em;}
.hero-actions{display:flex; gap:.9em; flex-wrap:wrap; margin-top:1.4em;}

.btn{
  display:inline-block;
  padding:.75em 1.4em;
  text-decoration:none;
  font-size:.95rem;
  border:1px solid var(--ink);
  color:var(--ink);
}
.btn:hover{background:var(--ink); color:var(--paper-raised);}
.btn-primary{
  background:var(--terracotta);
  border-color:var(--terracotta);
  color:#fff;
}
.btn-primary:hover{background:var(--terracotta-dark); border-color:var(--terracotta-dark); color:#fff;}

.badge-plate{
  background:var(--ink);
  color:#e9e4d6;
  padding:1.6em 1.7em;
  font-size:.88rem;
  border:1px solid var(--ink);
}
.badge-plate .stamp{
  display:inline-block;
  border:1px solid var(--terracotta);
  color:var(--terracotta);
  padding:.15em .5em;
  font-size:.72rem;
  letter-spacing:.05em;
  margin-bottom:.9em;
}
.badge-plate dl{margin:0;}
.badge-plate dt{color:#a9b3ba; font-size:.78rem; margin-top:.9em;}
.badge-plate dt:first-child{margin-top:0;}
.badge-plate dd{margin:.15em 0 0; color:#f3efe4;}

/* ---------- Home sections ---------- */
.section{max-width:1080px; margin:0 auto; padding:0 1.25em 3em;}
.section-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5em;}
.tile{
  background:var(--paper-raised);
  border:1px solid var(--line);
  padding:1.4em 1.5em;
}
.tile h3{margin-bottom:.4em;}
.tile p{margin-bottom:.6em; color:var(--ink-soft); font-size:.95rem;}
.tile a{font-size:.9rem; text-decoration:none;}

/* ---------- Article text (codice civile, amministratore) ---------- */
.law-article{margin-bottom:1.6em; padding-bottom:1.4em; border-bottom:1px dashed var(--line);}
.law-article:last-child{border-bottom:none;}
.law-article p{color:var(--ink-soft); font-size:.96rem;}

/* ---------- Sentenze ---------- */
.ruling{
  border-left:3px solid var(--verdigris);
  padding:.2em 0 .2em 1em;
  margin-bottom:1.6em;
}
.ruling time{
  display:block; font-size:.8rem; color:var(--ink-soft); letter-spacing:.03em;
}
.ruling .ref{font-size:.9rem; color:var(--ink-soft); margin:.2em 0 .3em;}
.ruling h3{margin-bottom:.3em;}

/* ---------- Forms ---------- */
.form-grid{display:grid; gap:1.1em; max-width:34em;}
label{display:block; font-size:.9rem; margin-bottom:.3em; color:var(--ink-soft);}
input[type=text], input[type=email], textarea{
  width:100%;
  padding:.65em .7em;
  border:1px solid var(--line-strong);
  background:var(--paper);
  font-family:inherit; font-size:1rem; color:var(--ink);
}
input:focus, textarea:focus{outline:2px solid var(--terracotta); outline-offset:1px;}
textarea{min-height:9em; resize:vertical;}
.form-note{font-size:.85rem; color:var(--ink-soft); background:var(--paper); border:1px solid var(--line); padding:.9em 1.1em; margin-top:1.2em;}

/* ---------- Info list (dove siamo, contatti) ---------- */
.info-list{list-style:none; padding:0;}
.info-list li{display:flex; gap:.8em; margin-bottom:.7em;}
.info-list b{min-width:6em; color:var(--ink-soft); font-weight:600; font-size:.88rem;}
.map-frame{border:1px solid var(--line); margin-top:1.5em; width:100%; height:340px;}

/* ---------- Footer ---------- */
.site-footer{
  background:var(--ink);
  color:#c9cfd3;
  margin-top:3em;
}
.footer-inner{
  max-width:1080px; margin:0 auto; padding:2.4em 1.25em;
  display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:2em;
}
.footer-inner h4{color:#f3efe4; font-family:'Newsreader',serif; font-weight:500; margin:0 0 .6em; font-size:1.1rem;}
.footer-inner a{color:#c9cfd3; text-decoration:none; font-size:.9rem;}
.footer-inner a:hover{color:#fff; text-decoration:underline;}
.footer-inner ul{list-style:none; padding:0; margin:0;}
.footer-inner li{margin-bottom:.5em;}
.footer-bottom{
  border-top:1px solid #33414d;
  text-align:center;
  font-size:.8rem;
  padding:1.2em;
  color:#93a0a8;
}

/* ---------- Responsive ---------- */
@media (max-width:820px){
  .hero{grid-template-columns:1fr;}
  .page{grid-template-columns:1fr;}
  .side-index{position:static; border-left:none; padding-left:0; border-top:1px solid var(--line); padding-top:1em;}
  .section-grid{grid-template-columns:1fr;}
  .footer-inner{grid-template-columns:1fr; gap:1.6em;}
  .content-card{padding:1.5em 1.3em;}
  h1{font-size:1.9rem;}
  .info-list li{flex-direction:column; gap:.15em; margin-bottom:1em;}
  .info-list b{min-width:0;}
  .topbar-inner{flex-direction:column; gap:.2em;}
}