:root{
  --gold:#B8860B; --gold-l:#E3B93C; --silver:#8E9196; --bronze:#8C5A32;
  --ink:#14213D; --muted:#5E5A50; --bg:#F4F2EF; --tint:#EFEBE2; --line:#DDD6C6;
  --navy:#0E1D45; --navy2:#16295F; --navy-t:#E6EAF4; --navy-m:#B7C0D8;
  --serif:'Cormorant Garamond',Georgia,serif; --sans:'Montserrat',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:1.65;font-size:16px}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:min(1160px,100% - 32px);margin-inline:auto}
.narrow{width:min(820px,100% - 32px)}

/* tricolore */
.tricolore{display:block;height:4px;background:linear-gradient(90deg,#009246 0 33.33%,#fff 33.33% 66.66%,#CE2B37 66.66%)}

/* header */
.topbar{position:sticky;top:0;z-index:50;background:rgba(244,242,239,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand img{height:44px;width:auto}
.nav{display:flex;align-items:center;gap:22px;font-size:.85rem;font-weight:500}
.nav a{text-decoration:none;color:var(--navy);transition:color .2s;white-space:nowrap}
.nav a:hover{color:var(--gold)}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:var(--navy);margin:5px 0}

/* buttons */
.btn{display:inline-block;padding:13px 26px;border-radius:2px;border:1px solid var(--gold);background:linear-gradient(135deg,var(--gold-l),var(--gold));color:#fff;font-weight:600;font-size:.88rem;letter-spacing:.04em;text-decoration:none;cursor:pointer;font-family:inherit;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px -8px rgba(184,134,11,.7)}
.btn-sm{padding:9px 18px;color:#fff!important}
.btn-ghost{background:transparent;color:var(--navy)}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}

/* tipografia */
h1,h2,h3{font-variant-numeric:lining-nums;font-family:var(--serif);line-height:1.12;margin:0;color:var(--navy)}
h1{font-size:clamp(2.4rem,5vw,4rem);font-weight:600}
h1 em{font-style:italic;color:var(--gold)}
h2{font-size:clamp(1.9rem,3.4vw,2.7rem);font-weight:600;margin-bottom:28px}
h3{font-size:1.5rem;font-weight:700;margin-bottom:8px}
.eyebrow{margin:0 0 14px;font-size:.75rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.lead{font-size:1.1rem;color:var(--muted);max-width:56ch;margin:22px 0 0}
.lead-sm{color:var(--muted);margin:0}

/* hero */
.hero{position:relative;overflow:hidden;padding:72px 0 64px;background:radial-gradient(900px 400px at 85% 10%,rgba(227,185,60,.18),transparent 70%),var(--bg)}
.track{position:absolute;inset:0;width:100%;height:100%;color:var(--gold);opacity:.22;pointer-events:none}
.hero .wrap{position:relative}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.hero-logo img{-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);mask-composite:intersect}

/* fascia blu con i quattro riferimenti */
.band{padding:0}
.pillars{display:grid;grid-template-columns:repeat(4,1fr)}
.pillars div{padding:30px 22px;border-left:1px solid rgba(255,255,255,.14);display:flex;flex-direction:column}
.pillars div:first-child{border-left:0;padding-left:0}
.pillars strong{font-variant-numeric:lining-nums;font-family:var(--serif);font-size:1.45rem;color:#fff}
.pillars span{font-size:.82rem;color:var(--navy-m)}

/* spazi foto */
.photo{position:relative;margin:0;overflow:hidden;border:1px dashed var(--gold);border-radius:4px;background:linear-gradient(135deg,rgba(14,29,69,.07),rgba(184,134,11,.12));display:flex;align-items:center;justify-content:center;text-align:center;color:var(--muted)}
.photo span{font-size:.75rem;letter-spacing:.08em;padding:12px}
.photo b{display:block;color:var(--gold);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:4px}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo:has(img){border:0}
.photo:has(img) span{display:none}
.r-21x9{aspect-ratio:21/9}
.r-4x5{aspect-ratio:4/5}
.r-3x2{aspect-ratio:3/2}
.sec-photo{padding:64px 0 0}

/* sezioni */
.sec{padding:96px 0}
.tint{background:var(--tint)}
.two{display:grid;grid-template-columns:1fr 1.2fr;gap:56px;align-items:start}
.two-photo{grid-template-columns:.9fr 1.1fr;align-items:center}
.prose p{margin:0 0 16px;color:var(--muted)}
.prose strong{color:var(--ink)}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px!important}
.tags span{border:1px solid var(--gold);color:var(--gold);padding:5px 14px;border-radius:99px;font-size:.78rem;font-weight:600;letter-spacing:.05em}

/* sezioni blu scuro */
.navy,.dark{background:var(--navy);color:var(--navy-t)}
.navy h2,.navy h3,.dark h2,.dark h3{color:#fff}
.navy .eyebrow,.dark .eyebrow{color:var(--gold-l)}
.navy .lead-sm,.dark .lead-sm{color:var(--navy-m)}
.navy .btn-ghost,.dark .btn-ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.navy .btn-ghost:hover,.dark .btn-ghost:hover{border-color:var(--gold-l)}
.dark{background:linear-gradient(135deg,#112252,#0A1634)}
.ticks{list-style:none;margin:0;padding:0}
.ticks li{position:relative;padding:14px 0 14px 34px;border-bottom:1px solid rgba(255,255,255,.12)}
.ticks li:last-child{border:0}
.ticks li::before{content:"";position:absolute;left:0;top:21px;width:16px;height:2px;background:linear-gradient(90deg,var(--gold-l),var(--bronze))}

.grid3,.grid4{display:grid;gap:22px}
.grid3{grid-template-columns:repeat(3,1fr)}
.grid4{grid-template-columns:repeat(4,1fr)}
.card{position:relative;background:#fff;border:1px solid var(--line);border-top:3px solid var(--gold);padding:30px 26px;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 30px -20px rgba(0,0,0,.4)}
.card p{margin:0;color:var(--muted);font-size:.93rem}
/* card blu su sfondo chiaro e card sulle sezioni blu */
.card.dk,.navy .card{background:var(--navy);border-color:rgba(255,255,255,.1);border-top-color:var(--gold-l)}
.navy .card{background:var(--navy2)}
.card.dk h3,.navy .card h3{color:#fff}
.card.dk p,.navy .card p{color:var(--navy-m)}
.card.has-photo{padding:0;display:flex;flex-direction:column}
.card.has-photo .photo{border-radius:0;border-left:0;border-right:0;border-top:0;border-color:rgba(227,185,60,.6)}
.navy .photo{background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(227,185,60,.14));color:var(--navy-m)}
.navy .photo b{color:var(--gold-l)}
.card.has-photo .body{padding:24px 26px 28px}
.ico{width:34px;height:34px;color:var(--gold);margin-bottom:16px}
.card.dk .ico{color:var(--gold-l)}
.card:nth-child(3n+2) .ico{color:var(--silver)}
.card:nth-child(3n) .ico{color:var(--bronze)}
.card.dk:nth-child(3n) .ico{color:#D39A6B}
.card.dk:nth-child(3n+2) .ico{color:#D6D9DE}
.card.plain:nth-child(2){border-top-color:var(--silver)}
.card.plain:nth-child(3){border-top-color:var(--bronze)}
.net{display:flex;flex-direction:column}
.net .kicker{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:10px}
.net h3 a{text-decoration:none}
.net h3 a:hover{color:var(--gold)}
.more{margin-top:auto;padding-top:16px;font-size:.82rem;font-weight:600;color:var(--gold);text-decoration:none;letter-spacing:.03em}
.more:hover{text-decoration:underline}
.note{margin:28px 0 0;color:var(--muted);font-size:.9rem}

details{background:#fff;border:1px solid var(--line);margin-bottom:10px;padding:0 22px}
summary{cursor:pointer;padding:18px 0;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px;color:var(--navy)}
summary::after{content:"+";color:var(--gold);font-size:1.4rem;line-height:1}
details[open] summary::after{content:"–"}
details p{margin:0 0 18px;color:var(--muted)}
details a{color:var(--navy);font-weight:600}

address{font-style:normal;margin-top:28px;padding-left:18px;border-left:3px solid var(--gold);color:var(--muted)}
.navy address{color:var(--navy-m)}
.navy address strong{color:#fff}
.form{display:grid;gap:16px;background:#fff;border:1px solid var(--line);padding:30px;color:var(--ink)}
.form label{display:grid;gap:6px;font-size:.82rem;font-weight:600}
.form input:not([type=checkbox]),.form textarea{font:inherit;padding:11px 12px;border:1px solid var(--line);background:var(--bg);border-radius:2px}
.form input:focus,.form textarea:focus{outline:2px solid var(--gold-l);outline-offset:0}
.form .check{display:flex;gap:10px;font-weight:400;color:var(--muted);align-items:flex-start}
.form-msg{margin:0;font-size:.9rem;color:var(--gold)}

/* footer */
.foot{position:relative;background:#091330;color:var(--navy-m);padding:56px 0 0;font-size:.9rem}
.foot-grid{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap}
.foot-logo{height:42px;width:auto;margin-bottom:14px;background:var(--bg);padding:6px 12px}
.foot p{margin:0}
.foot-links{display:flex;gap:22px;align-items:flex-start}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:var(--gold-l)}
.podium{display:flex;justify-content:center;align-items:flex-end;gap:4px;margin-top:36px}
.podium span{width:min(120px,22vw);display:block}
.podium .p1{height:52px;background:linear-gradient(180deg,var(--gold-l),var(--gold))}
.podium .p2{height:36px;background:linear-gradient(180deg,#c9ccd0,var(--silver))}
.podium .p3{height:24px;background:linear-gradient(180deg,#b9805a,var(--bronze))}
.legal{padding:20px 0;border-top:1px solid rgba(255,255,255,.1);font-size:.78rem}

@media (max-width:900px){
  .hero-grid,.two{grid-template-columns:1fr;gap:32px}
  .grid3,.grid4{grid-template-columns:1fr 1fr}
  .pillars{grid-template-columns:1fr 1fr}
  .pillars div:nth-child(3){border-left:0;padding-left:0}
  .sec{padding:64px 0}
  .burger{display:block}
  .nav{position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--bg);border-bottom:1px solid var(--line);display:none;padding:8px 16px 16px}
  .nav.open{display:flex}
  .nav a{padding:12px 0;border-bottom:1px solid var(--line)}
  .nav .btn{margin-top:12px;text-align:center}
}
@media (max-width:560px){
  .grid3,.grid4{grid-template-columns:1fr}
  .hero{padding:40px 0 48px}
  .r-21x9{aspect-ratio:16/9}
}

/* banner home a tutta larghezza */
.banner-home{background:var(--navy);line-height:0}
.banner-home img{width:100%;height:auto;max-height:540px;object-fit:cover;object-position:center 40%}

/* teaser guida */
.two-guida{align-items:center}
.topics{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.topics a{display:block;text-decoration:none;background:var(--navy);color:#fff;padding:18px 22px;border-left:4px solid var(--gold-l);transition:transform .15s}
.topics a:hover{transform:translateX(4px)}
.topics strong{display:block;font-family:var(--serif);font-size:1.3rem;font-weight:700}
.topics span{font-size:.85rem;color:var(--navy-m)}

/* menu a otto voci: tendina già sotto i 1010 px */
@media (max-width:1010px){
  .burger{display:block}
  .nav{position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--bg);border-bottom:1px solid var(--line);display:none;padding:8px 16px 16px}
  .nav.open{display:flex}
  .nav a{padding:12px 0;border-bottom:1px solid var(--line)}
  .nav .btn{margin-top:12px;text-align:center}
}
