/*
Theme Name: Rover — Editoriale Scuro
Theme URI: https://roversrl.com
Author: Studio Rover
Description: Tema custom per Rover srl — direzione grafica "editoriale scuro", estetica tavola di disegno, palette monocromatica. Versione prototipo per ambiente locale.
Version: 0.7
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
Text Domain: rover-editoriale
*/

:root{
  --ink-0:#0c0d0f;
  --ink-1:#131518;
  --ink-2:#1b1e23;
  --line:rgba(233,229,221,.13);
  --line-2:rgba(233,229,221,.26);
  --paper:#ece7dd;
  --paper-2:#b4b1aa;
  --dim:#74757a;
  --white:#ffffff;
  --font-display:'Instrument Serif',Georgia,serif;
  --font-sans:'Archivo',system-ui,-apple-system,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  --pad:clamp(20px,5vw,88px);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--ink-0);
  color:var(--paper);
  font-family:var(--font-sans);
  font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(var(--line) 1px,transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(circle at 50% 32%,#000 0%,transparent 78%);
          mask-image:radial-gradient(circle at 50% 32%,#000 0%,transparent 78%);
  opacity:.5;
}
.sheet{position:fixed;inset:14px;z-index:40;pointer-events:none;border:1px solid var(--line-2)}
.sheet span{position:absolute;width:14px;height:14px;border:1px solid var(--paper);opacity:.55}
.sheet .tl{top:-1px;left:-1px;border-right:0;border-bottom:0}
.sheet .tr{top:-1px;right:-1px;border-left:0;border-bottom:0}
.sheet .bl{bottom:-1px;left:-1px;border-right:0;border-top:0}
.sheet .br{bottom:-1px;right:-1px;border-left:0;border-top:0}
@media(max-width:640px){.sheet{inset:8px}}

.wrap{position:relative;z-index:2;max-width:1280px;margin:0 auto;padding:0 var(--pad)}
.mono{font-family:var(--font-mono);font-weight:500;letter-spacing:.08em;text-transform:uppercase;font-size:.7rem;color:var(--dim)}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--paper);outline-offset:3px}

header{position:sticky;top:0;z-index:30;backdrop-filter:blur(9px);background:rgba(12,13,15,.72);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:inline-flex;align-items:center;padding-left:.1em}
.brand img{height:30px;width:auto;display:block}
.bar-right{display:flex;align-items:center;gap:26px}
nav ul{display:flex;gap:30px;list-style:none}
nav a{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--paper-2);transition:color .2s}
nav a:hover{color:var(--white)}
.ig{display:inline-flex;align-items:center;color:var(--paper-2);transition:color .2s,transform .2s}
.ig:hover{color:var(--white);transform:translateY(-1px)}
.wa{margin-left:-14px}
.cta{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line-2);padding:10px 16px;transition:.2s;white-space:nowrap}
.cta:hover{background:var(--paper);color:var(--ink-0);border-color:var(--paper)}
.menu-toggle{display:none;background:none;border:1px solid var(--line-2);color:var(--paper);font-family:var(--font-mono);font-size:.7rem;padding:8px 12px;letter-spacing:.1em;cursor:pointer}
@media(max-width:860px){nav,.bar .cta{display:none}.menu-toggle{display:block}}

.hero{padding:clamp(22px,3.5vh,48px) 0 clamp(34px,6vh,70px);min-height:calc(100vh - 64px);min-height:calc(100svh - 64px)}
.eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.eyebrow .rule{height:1px;flex:1;max-width:120px;background:var(--line-2)}
h1.display{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(2.9rem,7.4vw,6rem);line-height:.98;letter-spacing:-.01em;
  color:var(--paper);max-width:16ch;
}
.quote{font-family:var(--font-display);font-style:italic;font-size:clamp(1.15rem,2.4vw,1.7rem);color:var(--paper-2);margin:30px 0 26px;max-width:34ch;line-height:1.35}
.quote cite{display:block;font-family:var(--font-mono);font-style:normal;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:12px}
.lede{max-width:52ch;color:var(--paper-2);font-size:1.05rem;line-height:1.6}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:38px}
.btn{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;padding:14px 26px;border:1px solid var(--line-2);transition:.2s}
.btn.solid{background:var(--paper);color:var(--ink-0);border-color:var(--paper)}
.btn.solid:hover{background:var(--white);border-color:var(--white)}
.btn.ghost:hover{border-color:var(--paper);color:var(--white)}

.scalebar{margin-top:56px;display:flex;align-items:flex-end;gap:0;max-width:340px}
.scalebar .seg{height:9px;border:1px solid var(--line-2);border-right:0;flex:1}
.scalebar .seg:nth-child(odd){background:var(--line)}
.scalebar .seg:last-child{border-right:1px solid var(--line-2)}
.scalelabels{display:flex;justify-content:space-between;max-width:340px;margin-top:7px}
.scalelabels span{font-family:var(--font-mono);font-size:.62rem;color:var(--dim);letter-spacing:.08em}
.coords{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;color:var(--dim);margin-top:16px}

.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,60px);align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:clamp(30px,6vw,42px)}.hero-media{max-width:520px;margin:0 auto;width:100%}}
.reel-frame{position:relative;width:100%;margin:0;border:1px solid var(--line-2);background:var(--ink-1);padding:12px}
.reel-frame video{display:block;width:100%;height:auto;background:var(--ink-2)}
.reel-tag{position:absolute;top:-9px;left:16px;background:var(--ink-0);padding:0 8px}
.reel-frame .tk{position:absolute;width:12px;height:12px;border:1px solid var(--paper);opacity:.5}
.reel-frame .tk.tl{top:-1px;left:-1px;border-right:0;border-bottom:0}
.reel-frame .tk.tr{top:-1px;right:-1px;border-left:0;border-bottom:0}
.reel-frame .tk.bl{bottom:-1px;left:-1px;border-right:0;border-top:0}
.reel-frame .tk.br{bottom:-1px;right:-1px;border-left:0;border-top:0}

.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:34px var(--pad);border-left:1px solid var(--line)}
.stat:first-child{border-left:0}
.stat .num{font-family:var(--font-display);font-size:clamp(2.6rem,5vw,4rem);line-height:1;color:var(--paper)}
.stat .dim{display:flex;align-items:center;gap:6px;margin:14px 0 10px}
.stat .dim .l{height:1px;flex:1;background:var(--line-2);position:relative}
.stat .dim .l::before,.stat .dim .l::after{content:"";position:absolute;top:-3px;width:1px;height:7px;background:var(--line-2)}
.stat .dim .l::before{left:0}.stat .dim .l::after{right:0}
.stat .lab{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(3){border-left:0}.stat:nth-child(3),.stat:nth-child(4){border-top:1px solid var(--line)}}

section{position:relative;z-index:2}
.block{padding:clamp(64px,10vw,132px) 0}
.tav{display:flex;align-items:baseline;gap:16px;margin-bottom:44px}
.tav .code{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;color:var(--dim);white-space:nowrap}
.tav h2{font-family:var(--font-display);font-weight:400;font-size:clamp(2rem,4.6vw,3.4rem);line-height:1;color:var(--paper)}
.tav .rule{height:1px;flex:1;background:var(--line);align-self:center}

.mission{max-width:60ch}
.mission p{font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.5;color:var(--paper);font-weight:300}
.mission p+p{margin-top:22px;font-size:1.02rem;color:var(--paper-2);line-height:1.6}

.disc{border-top:1px solid var(--line)}
.disc-row{display:grid;grid-template-columns:120px 1fr;gap:32px;padding:36px 0;border-bottom:1px solid var(--line);align-items:start;transition:background .25s}
.disc-row:hover{background:linear-gradient(90deg,rgba(236,231,221,.03),transparent)}
.disc-row .code{font-family:var(--font-mono);font-size:.95rem;letter-spacing:.12em;color:var(--paper);padding-top:4px}
.disc-row .code small{display:block;color:var(--dim);font-size:.62rem;margin-top:8px;letter-spacing:.1em}
.disc-row h3{font-family:var(--font-display);font-weight:400;font-size:clamp(1.6rem,3vw,2.4rem);margin-bottom:16px;color:var(--paper)}
.disc-row ul{list-style:none;columns:2;column-gap:40px}
.disc-row li{color:var(--paper-2);font-size:.95rem;padding:5px 0 5px 18px;position:relative;break-inside:avoid}
.disc-row li::before{content:"—";position:absolute;left:0;color:var(--dim)}
@media(max-width:900px){.disc-row{grid-template-columns:1fr;gap:14px}.disc-row ul{columns:1}}

.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:40px}
.filters button{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--paper-2);background:none;border:1px solid var(--line);padding:9px 15px;cursor:pointer;transition:.2s}
.filters button:hover{color:var(--white);border-color:var(--line-2)}
.filters button.active{background:var(--paper);color:var(--ink-0);border-color:var(--paper)}
.grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.card{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:34px;transition:background .25s;position:relative}
.card:hover{background:var(--ink-1)}
.card .tag{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between}
.card .tag .idx{color:var(--line-2)}
.card h3{font-family:var(--font-display);font-weight:400;font-size:clamp(1.4rem,2.4vw,1.95rem);line-height:1.1;margin:20px 0 12px;color:var(--paper)}
.card p{color:var(--paper-2);font-size:.93rem;line-height:1.55;margin-bottom:22px}
.card .loc{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;color:var(--dim);display:flex;align-items:center;gap:8px}
.card .loc::before{content:"";width:14px;height:1px;background:var(--line-2)}
.card.hide{display:none}
@media(max-width:680px){.grid{grid-template-columns:1fr}}

/* mappa progetti */
.rover-map{height:clamp(420px,62vh,640px);border:1px solid var(--line-2);margin-bottom:24px;background:var(--ink-1);position:relative;z-index:2}
.rover-tiles{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.9) saturate(.72)}
.leaflet-container{background:var(--ink-1);font-family:var(--font-sans)}
.map-note{display:block;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dim);margin-top:8px}
.map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.map-stat{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--paper-2)}
.map-search{font-family:var(--font-sans);font-size:.9rem;color:var(--paper);background:var(--ink-1);border:1px solid var(--line-2);padding:10px 14px;min-width:min(280px,100%);outline:none;transition:border-color .2s}
.map-search:focus{border-color:var(--paper-2)}
.map-search::placeholder{color:var(--dim)}
.map-empty{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);margin:-12px 0 40px}
.rover-map{margin-bottom:40px}

/* Leaflet — tema scuro */
.leaflet-popup-content-wrapper{background:var(--ink-2)!important;color:var(--paper)!important;border-radius:0;border:1px solid var(--line-2);box-shadow:0 10px 40px rgba(0,0,0,.5)}
.leaflet-popup-content{font-family:var(--font-sans);font-size:.9rem;line-height:1.5;margin:13px 15px}
.leaflet-popup-content strong{font-family:var(--font-display);font-weight:400;font-size:1.15rem}
.leaflet-popup-content .pp-disc{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;display:inline-block;margin:3px 0}
.leaflet-popup-tip{background:var(--ink-2)!important;border:1px solid var(--line-2)}
.leaflet-popup-close-button{color:var(--dim)!important}
.leaflet-container a.leaflet-popup-close-button:hover{color:var(--paper)!important}
.leaflet-bar a{background:var(--ink-2);color:var(--paper);border-color:var(--line-2)}
.leaflet-bar a:hover{background:var(--ink-1);color:var(--white)}
.leaflet-control-attribution{background:rgba(12,13,15,.72)!important;color:var(--dim)!important;font-size:.62rem}
.leaflet-control-attribution a{color:var(--paper-2)!important}
/* Popup archivio */
.rover-pop .rover-pop-v{font-family:var(--font-display);font-size:1.12rem;line-height:1.2;color:var(--paper)}
.rover-pop .rover-pop-c{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:5px}
/* Cluster — tema scuro monocromo */
.marker-cluster{background:transparent}
.marker-cluster div{background:rgba(207,155,106,.16);border:1px solid rgba(207,155,106,.65);color:var(--paper);font-family:var(--font-mono);font-size:.72rem;font-weight:600;width:38px;height:38px;margin-left:1px;margin-top:1px;border-radius:50%;line-height:36px}
.marker-cluster-small div,.marker-cluster-medium div,.marker-cluster-large div{background:rgba(207,155,106,.16)}
.marker-cluster-large div{width:44px;height:44px;line-height:42px;border-color:rgba(207,155,106,.9)}
.leaflet-oldie .marker-cluster div{background:#2a2622}

.team-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.person{border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;transition:background .25s}
.person:hover{background:var(--ink-1)}
.person .photo{position:relative;aspect-ratio:3/4;background:var(--ink-2);overflow:hidden;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line)}
.person .photo img{width:100%;height:100%;object-fit:cover;object-position:top center;filter:grayscale(1) brightness(.9) contrast(1.04);transition:filter .45s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.person:hover .photo img{filter:grayscale(0) brightness(1) contrast(1);transform:scale(1.04)}
.person .ini{font-family:var(--font-mono);font-size:1rem;letter-spacing:.14em;color:var(--dim);border:1px solid var(--line-2);width:52px;height:52px;display:flex;align-items:center;justify-content:center}
.person .info{padding:18px 20px 22px}
.person .nm{font-family:var(--font-display);font-size:1.3rem;line-height:1.05;color:var(--paper)}
.person .rl{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--paper-2);margin-top:9px;line-height:1.45}
@media(max-width:640px){.team-grid{grid-template-columns:repeat(2,1fr)}}

.carti{border:1px solid var(--line-2);display:grid;grid-template-columns:1.2fr 1fr 1fr;background:var(--ink-1)}
.carti .cell{padding:30px 28px;border-left:1px solid var(--line)}
.carti .cell:first-child{border-left:0}
.carti .k{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:12px}
.carti .v{font-size:1rem;line-height:1.6;color:var(--paper)}
.carti .v a:hover{color:var(--white);text-decoration:underline}
.carti .big{font-family:var(--font-display);font-size:1.6rem;line-height:1.1}
.contact-cta{margin-top:34px;display:flex;gap:16px;flex-wrap:wrap;align-items:center}
@media(max-width:900px){.carti{grid-template-columns:1fr}.carti .cell{border-left:0;border-top:1px solid var(--line)}.carti .cell:first-child{border-top:0}}

footer{border-top:1px solid var(--line);padding:44px 0 40px;position:relative;z-index:2}
.foot{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:flex-end}
.foot .lg img{height:34px;width:auto;display:block}
.foot .meta{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.05em;color:var(--dim);line-height:1.9;text-align:right}
.foot .meta .prototipo{color:var(--paper-2)}
@media(max-width:640px){.foot .meta{text-align:left}}

img{max-width:100%}
@media(max-width:560px){
  .tav{flex-wrap:wrap;gap:10px 14px;margin-bottom:30px}
  .tav .rule{display:none}
  .hero-actions{gap:12px}
  .hero-actions .btn,.contact-cta .btn{flex:1 1 auto;text-align:center}
  .map-search{width:100%}
  .person .info{padding:14px 15px 18px}
  .person .nm{font-size:1.15rem}
}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
