/* ============================================================
   Stare Bene Italia — shared site stylesheet
   Theme tokens estratti dall'advertorial, estesi con i componenti
   di homepage, liste e pagine editoriali.
   ============================================================ */
:root{
  --bg:#FBFAF6; --surface:#FFFFFF; --surface-soft:#F4F2EA;
  --ink:#16211C; --ink-2:#2D3A33; --muted:#67706A; --subtle:#98A09A;
  --border:#E7E3DA; --border-strong:#D2CCBF;
  --brand:#1F7A6B; --brand-2:#155C50; --brand-soft:#E0F0EB;
  --warm:#C2683A; --warm-soft:#F6E7DB;
  --shadow-sm:0 1px 2px rgba(20,32,26,.05);
  --shadow-md:0 8px 22px -10px rgba(20,32,26,.16),0 2px 6px rgba(20,32,26,.05);
  --shadow-lg:0 30px 60px -22px rgba(20,32,26,.26);
  --maxw:1120px; --read:720px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink-2);font-family:'Inter',system-ui,-apple-system,sans-serif;font-size:18px;line-height:1.74;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
img{max-width:100%;}
.fraunces{font-family:'Fraunces',Georgia,serif;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;}
.read{max-width:var(--read);margin-left:auto;margin-right:auto;}

/* ── top utility bar ── */
.topbar{background:var(--ink);color:#C9D2CD;font-size:12px;}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:36px;}
.topbar .date{letter-spacing:.02em;}
.topbar .links a{color:#C9D2CD;text-decoration:none;margin-left:18px;opacity:.9;}
.topbar .links a:hover{opacity:1;color:#fff;}

/* ── masthead ── */
.masthead{background:var(--surface);border-bottom:1px solid var(--border);text-align:center;padding:26px 0 0;}
.logo{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:clamp(28px,6vw,46px);letter-spacing:-.02em;color:var(--ink);line-height:1;text-decoration:none;display:inline-block;}
.logo b{color:var(--brand);font-weight:600;}
.tagline{font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:8px;}
nav.sections{margin-top:18px;border-top:1px solid var(--border);}
nav.sections ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 26px;margin:0;padding:12px 16px;}
nav.sections a{text-decoration:none;font-size:14px;font-weight:500;color:var(--ink-2);letter-spacing:.01em;padding:4px 0;}
nav.sections a:hover{color:var(--brand);}
nav.sections a.active{color:var(--brand);}

/* ── homepage: lead / hero ── */
.lead{padding:34px 0 8px;}
.lead-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:34px;align-items:start;}
.lead-main .kicker,.kicker{font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--brand);}
.lead-main h1{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:clamp(30px,4.6vw,46px);line-height:1.08;letter-spacing:-.018em;color:var(--ink);margin:12px 0 14px;}
.lead-main h1 a{text-decoration:none;}
.lead-main h1 a:hover{color:var(--brand);}
.lead-main .dek{font-size:clamp(17px,2.2vw,20px);line-height:1.5;color:var(--ink-2);margin:0 0 16px;}
.lead-main .imgwrap{margin-top:18px;}
.lead-main img{width:100%;height:auto;border-radius:14px;display:block;box-shadow:var(--shadow-md);background:var(--surface-soft);}
.byline-sm{font-size:13px;color:var(--muted);}
.byline-sm b{color:var(--ink);font-weight:600;}

/* secondary list beside hero */
.lead-side{border-left:1px solid var(--border);padding-left:30px;}
.lead-side h3.rail{font-family:'Fraunces',serif;font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 0 16px;}
.mini{display:block;text-decoration:none;color:inherit;padding:14px 0;border-top:1px solid var(--border);}
.mini:first-of-type{border-top:none;padding-top:0;}
.mini .cat{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);}
.mini .t{font-family:'Fraunces',serif;font-size:17px;line-height:1.25;color:var(--ink);margin-top:5px;font-weight:600;}
.mini:hover .t{color:var(--brand);}

/* ── section blocks + card grid ── */
.section-block{margin:46px 0 0;}
.section-head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:22px;}
.section-head h2{font-family:'Fraunces',serif;font-weight:600;font-size:22px;letter-spacing:-.01em;color:var(--ink);margin:0;}
.section-head a{font-size:13px;text-decoration:none;color:var(--brand);font-weight:600;}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.card{text-decoration:none;color:inherit;display:block;}
.card .thumb{aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:var(--surface-soft);border:1px solid var(--border);margin-bottom:13px;}
.card .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.card .cover{width:100%;height:100%;display:flex;align-items:flex-end;padding:16px;color:#fff;background:linear-gradient(145deg,var(--brand),var(--brand-2));}
.card .cover.warm{background:linear-gradient(145deg,var(--warm),#9C4F28);}
.card .cover.ink{background:linear-gradient(145deg,#27332C,var(--ink));}
.card .cover span{font-family:'Fraunces',serif;font-weight:600;font-size:19px;line-height:1.18;}
.card .cat{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);}
.card .t{font-family:'Fraunces',serif;font-size:19px;line-height:1.24;color:var(--ink);margin-top:6px;font-weight:600;}
.card .ex{font-size:14.5px;line-height:1.5;color:var(--muted);margin-top:7px;}
.card:hover .t{color:var(--brand);}

/* river (text-led list) + most read sidebar */
.river-grid{display:grid;grid-template-columns:1fr 320px;gap:40px;margin-top:46px;}
.river .item{display:grid;grid-template-columns:1fr 200px;gap:20px;padding:22px 0;border-top:1px solid var(--border);}
.river .item:first-child{border-top:none;padding-top:0;}
.river .item .thumb{aspect-ratio:16/11;border-radius:10px;overflow:hidden;background:var(--surface-soft);border:1px solid var(--border);}
.river .item .thumb img{width:100%;height:100%;object-fit:cover;}
.river .item .cover{width:100%;height:100%;display:flex;align-items:flex-end;padding:12px;color:#fff;background:linear-gradient(145deg,var(--brand),var(--brand-2));}
.river .item .cover span{font-family:'Fraunces',serif;font-size:15px;line-height:1.2;}
.river .item .t{font-family:'Fraunces',serif;font-size:21px;line-height:1.22;color:var(--ink);font-weight:600;margin:6px 0 6px;text-decoration:none;display:block;}
.river .item .t:hover{color:var(--brand);}
.river .item .ex{font-size:15px;color:var(--muted);line-height:1.55;margin:0;}
.river .item a.t,.river .item{text-decoration:none;color:inherit;}
.aside h3.rail{font-family:'Fraunces',serif;font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);border-bottom:2px solid var(--ink);padding-bottom:10px;margin:0 0 8px;}
.ranklist{list-style:none;margin:0;padding:0;counter-reset:rk;}
.ranklist a{display:flex;gap:14px;text-decoration:none;color:inherit;padding:15px 0;border-top:1px solid var(--border);}
.ranklist a:first-child{border-top:none;}
.ranklist a::before{counter-increment:rk;content:counter(rk);font-family:'Fraunces',serif;font-size:26px;font-weight:600;color:var(--border-strong);line-height:1;flex:none;width:26px;}
.ranklist .t{font-family:'Fraunces',serif;font-size:16px;line-height:1.25;color:var(--ink);font-weight:600;}
.ranklist a:hover .t{color:var(--brand);}

/* newsletter band */
.nlband{background:var(--brand);color:#EAF6F2;margin-top:54px;}
.nlband .wrap{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;padding:34px 22px;}
.nlband h3{font-family:'Fraunces',serif;font-weight:600;font-size:26px;color:#fff;margin:0 0 6px;}
.nlband p{margin:0;font-size:15px;color:#CBE7E0;max-width:46ch;}
.nlform{display:flex;gap:10px;flex-wrap:wrap;}
.nlform input{border:none;border-radius:999px;padding:13px 18px;font-size:15px;min-width:240px;font-family:inherit;}
.nlform button{border:none;border-radius:999px;padding:13px 24px;font-size:15px;font-weight:600;background:var(--ink);color:#fff;cursor:pointer;}
.nlform button:hover{background:#0c130f;}

/* ── article page ── */
article{padding:36px 0 10px;}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--brand);margin-bottom:14px;}
h1.headline{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:clamp(30px,5.6vw,50px);line-height:1.08;letter-spacing:-.018em;color:var(--ink);margin:0 0 18px;}
.dek{font-size:clamp(18px,2.6vw,22px);line-height:1.5;color:var(--ink-2);font-weight:400;margin:0 0 26px;}
.dek .q{color:var(--brand);font-style:italic;}
.byline{display:flex;align-items:center;gap:14px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:14px 0;margin-bottom:8px;flex-wrap:wrap;}
.avatar{width:42px;height:42px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:15px;flex:none;}
.byline .who{font-size:14px;line-height:1.35;}
.byline .who b{color:var(--ink);font-weight:600;}
.byline .meta{color:var(--subtle);}
.byline .spacer{flex:1;}
.byline .share a{display:inline-flex;width:34px;height:34px;border:1px solid var(--border);border-radius:50%;align-items:center;justify-content:center;margin-left:6px;color:var(--muted);text-decoration:none;font-size:13px;font-weight:600;}
.byline .share a:hover{border-color:var(--brand);color:var(--brand);}
figure{margin:0 0 28px;}
figure.hero img{width:100%;height:auto;border-radius:14px;display:block;box-shadow:var(--shadow-md);background:var(--surface-soft);}
figure.hero .cover-hero{width:100%;aspect-ratio:16/9;border-radius:14px;display:flex;align-items:flex-end;padding:30px;color:#fff;background:linear-gradient(145deg,var(--brand),var(--brand-2));box-shadow:var(--shadow-md);}
figure.hero .cover-hero.warm{background:linear-gradient(145deg,var(--warm),#9C4F28);}
figure.hero .cover-hero.ink{background:linear-gradient(150deg,#27332C,var(--ink));}
figure.hero .cover-hero span{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(20px,3vw,30px);line-height:1.16;max-width:18ch;}
figcaption{font-size:12.5px;color:var(--subtle);margin-top:9px;line-height:1.4;}
figcaption b{color:var(--muted);font-weight:600;}
article p{margin:0 0 22px;}
.read p.lede{font-family:'Fraunces',Georgia,serif;font-size:clamp(21px,3vw,25px);line-height:1.42;color:var(--ink);font-weight:500;margin-bottom:22px;}
p.first::first-letter{font-family:'Fraunces',Georgia,serif;float:left;font-size:62px;line-height:.82;font-weight:600;color:var(--brand);padding:6px 10px 0 0;}
article h2{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:clamp(23px,3.6vw,31px);line-height:1.16;letter-spacing:-.01em;color:var(--ink);margin:44px 0 16px;}
article h3{font-family:'Fraunces',serif;font-weight:600;font-size:20px;color:var(--ink);margin:30px 0 10px;}
article strong{font-weight:600;color:var(--ink);}
article em{font-style:italic;}
article ul,article ol{margin:0 0 22px;padding-left:24px;}
article li{margin-bottom:9px;}
.pull{margin:32px 0;padding:4px 0 4px 26px;border-left:4px solid var(--brand);}
.pull p{font-family:'Fraunces',Georgia,serif;font-size:clamp(23px,4vw,30px);line-height:1.28;color:var(--ink);font-weight:500;margin:0;}
.pull .who{display:block;margin-top:12px;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-family:'Inter',sans-serif;}
.note{background:var(--surface-soft);border-left:3px solid var(--border-strong);border-radius:0 8px 8px 0;padding:14px 18px;margin:24px 0;font-size:15px;color:var(--muted);font-style:italic;line-height:1.55;}
figure.inline img{width:100%;height:auto;border-radius:12px;display:block;box-shadow:var(--shadow-sm);}
figure.inline{margin:30px 0;}
.keytakeaway{background:var(--brand-soft);border:1px solid #CFE6DF;border-radius:14px;padding:18px 22px;margin:28px 0;}
.keytakeaway h4{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--brand-2);margin:0 0 10px;}
.keytakeaway ul{margin:0;padding-left:20px;}
.keytakeaway li{font-size:15.5px;color:var(--ink-2);margin-bottom:7px;}

/* related */
.related{border-top:1px solid var(--border);margin-top:50px;padding-top:30px;}
.related h3{font-family:'Fraunces',serif;font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 20px;}

/* static / editorial pages */
.page-hero{padding:40px 0 6px;border-bottom:1px solid var(--border);margin-bottom:8px;}
.page-hero h1{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(30px,5vw,44px);color:var(--ink);margin:8px 0 12px;line-height:1.08;}
.page-hero p{font-size:19px;color:var(--ink-2);margin:0 0 26px;max-width:60ch;}
.prose{padding:24px 0 10px;}
.prose p{margin:0 0 20px;}
.prose h2{font-family:'Fraunces',serif;font-weight:600;font-size:26px;color:var(--ink);margin:38px 0 14px;}
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:26px 0;}
.member{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:var(--shadow-sm);}
.member img{width:64px;height:64px;border-radius:50%;object-fit:cover;background:var(--surface-soft);}
.member .nm{font-weight:600;color:var(--ink);margin-top:12px;}
.member .role{font-size:13px;color:var(--brand);font-weight:600;}
.member p{font-size:14px;color:var(--muted);margin:8px 0 0;line-height:1.55;}

/* footer */
footer.site{background:var(--ink);color:#B9C2BD;margin-top:60px;padding:46px 0 30px;}
footer.site .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;}
footer.site .flogo{font-family:'Fraunces',serif;font-weight:600;font-size:24px;color:#fff;text-decoration:none;display:inline-block;}
footer.site .flogo b{color:#5CB8A6;}
footer.site p.tag{font-size:13px;margin-top:10px;color:#93A09A;max-width:34ch;}
footer.site h4{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#7E8C86;margin:0 0 14px;}
footer.site ul{list-style:none;margin:0;padding:0;}
footer.site li{margin-bottom:9px;}
footer.site a{color:#C5CEC9;text-decoration:none;font-size:14px;}
footer.site a:hover{color:#fff;}
.legal{border-top:1px solid #2A352F;margin-top:34px;padding-top:22px;}
.legal p{font-size:12px;line-height:1.65;color:#8A938D;margin:0 0 10px;}
.legal .disc{font-weight:600;color:#B9C2BD;}

@media(max-width:880px){
  .lead-grid{grid-template-columns:1fr;}
  .lead-side{border-left:none;padding-left:0;border-top:1px solid var(--border);padding-top:20px;}
  .river-grid{grid-template-columns:1fr;}
  .cards{grid-template-columns:repeat(2,1fr);}
  .team{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){
  body{font-size:17px;}
  .cards{grid-template-columns:1fr;}
  .river .item{grid-template-columns:1fr;}
  .river .item .thumb{order:-1;}
  .nlband .wrap{grid-template-columns:1fr;}
  .team{grid-template-columns:1fr;}
  footer.site .grid{grid-template-columns:1fr 1fr;gap:26px;}
  .topbar .links a:first-child{display:none;}
}
