
/* Layout: hero fotografico a tutta larghezza, poi fasce alterne chiaro/scuro; colori presi dal logo (rosso geologo + verde) su blu notte */
:root{
  --bg:#FFFFFF; --soft:#EEF3F4; --ink:#0F1E28; --muted:#4E5F69; --line:#D8E1E4;
  --night:#0C2230; --night-ink:#F3F7F8; --night-muted:#A9BCC6;
  --red:#E2382C; --red-ink:#FFFFFF; --green:#17A35B; --sun:#FFB627;
  --display:"Archivo", "Arial Narrow", system-ui, sans-serif;
  --body:"Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, monospace;
  --gl:max(16px, env(safe-area-inset-left, 0px)); --gr:max(16px, env(safe-area-inset-right, 0px));
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0E171D; --soft:#14212A; --ink:#EAF1F3; --muted:#9DB0BA; --line:#24343E;
  --night:#08141C; --night-ink:#F3F7F8; --night-muted:#A9BCC6;
  --red:#FF5A4B; --red-ink:#1A0806; --green:#3DD07F; --sun:#FFC24D; color-scheme:dark; } }
:root[data-theme="dark"]{
  --bg:#0E171D; --soft:#14212A; --ink:#EAF1F3; --muted:#9DB0BA; --line:#24343E;
  --night:#08141C; --night-ink:#F3F7F8; --night-muted:#A9BCC6;
  --red:#FF5A4B; --red-ink:#1A0806; --green:#3DD07F; --sun:#FFC24D; color-scheme:dark; }
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16.5px;line-height:1.6}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
img{display:block;max-width:100%}
a{color:var(--red)}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.wrap{max-width:1180px;margin:0 auto;padding-left:var(--gl);padding-right:var(--gr)}
h1,h2,h3{font-family:var(--display);margin:0;line-height:1.05;text-wrap:balance;letter-spacing:-.01em}
h2{font-size:clamp(2rem,4.4vw,3.2rem);font-weight:800}
h3{font-size:1.2rem;font-weight:700}
p{margin:0}
.kicker{font-family:var(--mono);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red);font-weight:500}
.btn{display:inline-flex;align-items:center;gap:8px;padding:.85rem 1.3rem;border-radius:999px;font-weight:700;font-size:.97rem;text-decoration:none;border:2px solid transparent;cursor:pointer;font-family:var(--body);transition:transform .15s ease, filter .15s ease}
.btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.btn.red{background:var(--red);color:var(--red-ink)}
.btn.green{background:var(--green);color:#fff}
.btn.line{border-color:currentColor;color:var(--night-ink);background:transparent}

/* Header */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:9;background:var(--bg);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:10px}
.logo{display:block;background:#fff;border-radius:8px;padding:4px 8px}
.logo img{height:44px;width:auto}
nav ul{display:flex;gap:6px 22px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
nav a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.93rem}
nav a:hover{color:var(--red)}
@media (max-width:880px){ nav{display:none} .top .btn{padding:.6rem 1rem;font-size:.88rem} }

/* Hero */
.hero{position:relative;background:var(--night);color:var(--night-ink);overflow:hidden}
.hero .photo{position:absolute;inset:0;background:url("/img/geognostiche.jpg") center/cover no-repeat}
.hero .photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg, rgba(8,20,28,.94) 0%, rgba(8,20,28,.78) 45%, rgba(8,20,28,.2) 100%)}
.hero .wrap{position:relative;padding-block:84px 72px;display:grid;gap:22px;max-width:1180px}
.hero h1{font-size:clamp(2.6rem,6.6vw,5rem);font-weight:900;max-width:15ch}
.hero h1 span{color:var(--sun)}
.hero .lead{font-size:1.15rem;max-width:52ch;color:var(--night-muted)}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.stat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:12px 18px;backdrop-filter:blur(4px)}
.stat b{display:block;font-family:var(--display);font-size:1.7rem;font-weight:900;line-height:1;color:#fff}
.stat span{font-size:.82rem;color:var(--night-muted)}
.hero .tag{position:absolute;right:var(--gr);bottom:16px;font-family:var(--mono);font-size:.72rem;color:rgba(255,255,255,.7)}

section{padding-block:80px}
.soft{background:var(--soft)}
@media (max-width:700px){ section{padding-block:56px} .hero .wrap{padding-block:56px 64px} }

/* Studio */
.studio{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px;position:relative}
.duo img{border-radius:14px;width:100%;height:100%;object-fit:cover;aspect-ratio:3/4}
.duo img:last-child{margin-top:48px}
.badge{position:absolute;left:-10px;bottom:-14px;background:var(--red);color:var(--red-ink);border-radius:12px;padding:12px 16px;font-family:var(--display);font-weight:800;line-height:1.1}
.badge small{display:block;font-family:var(--body);font-weight:500;font-size:.78rem;opacity:.9}
.studio .txt{display:grid;gap:16px}
.studio .txt p{color:var(--muted);max-width:60ch}
.checks{list-style:none;padding:0;margin:8px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
.checks li{display:flex;gap:10px;font-weight:600;font-size:.95rem}
.checks li::before{content:"";flex:0 0 10px;height:10px;margin-top:7px;border-radius:50%;background:var(--green)}
@media (max-width:900px){ .studio{grid-template-columns:1fr} .badge{left:8px} }
@media (max-width:480px){ .checks{grid-template-columns:1fr} }

/* Servizi */
.head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:36px}
.head p{color:var(--muted);max-width:52ch}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.chip{font:inherit;font-size:.88rem;font-weight:600;padding:.45rem .95rem;border-radius:999px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.card{background:var(--bg);border-radius:14px;overflow:hidden;border:1px solid var(--line);display:grid;grid-template-rows:auto 1fr;transition:transform .2s ease, box-shadow .2s ease}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(12,34,48,.5)}
.card .ph{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--night)}
.card .ph img{width:100%;height:100%;object-fit:cover}
.card .cat{position:absolute;left:10px;top:10px;font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:999px;color:#fff}
.cat.g{background:var(--red)} .cat.f{background:#0E7C9C} .cat.a{background:var(--green)} .cat.s{background:#B9741A}
.card .bd{padding:16px 16px 18px;display:grid;gap:6px;align-content:start}
.card p{font-size:.88rem;color:var(--muted)}
.card.noimg .ph{display:grid;place-items:center;background:linear-gradient(135deg,var(--night),#16455E)}
.card.noimg .ph b{font-family:var(--display);font-weight:900;font-size:2.4rem;color:var(--sun)}
@media (max-width:1000px){ .grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:720px){ .grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:440px){ .grid{grid-template-columns:1fr} }

/* Metodo */
.dark{background:var(--night);color:var(--night-ink)}
.dark h2{color:#fff}
.metodo{display:grid;grid-template-columns:1fr 1.25fr;gap:56px;align-items:center}
.metodo .core{border-radius:14px;overflow:hidden;position:relative}
.metodo .core img{width:100%;aspect-ratio:4/3;object-fit:cover}
.metodo .core figcaption{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;background:linear-gradient(transparent,rgba(0,0,0,.75));color:#fff;font-size:.82rem}
ol.steps{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:0}
.steps li{display:grid;grid-template-columns:52px 1fr;gap:14px;padding:16px 0;border-top:1px solid rgba(255,255,255,.14)}
.steps .n{font-family:var(--display);font-weight:900;font-size:1.6rem;color:var(--sun);line-height:1}
.steps h3{color:#fff}
.steps p{color:var(--night-muted);font-size:.93rem;margin-top:4px}
@media (max-width:900px){ .metodo{grid-template-columns:1fr} }

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:200px;gap:12px}
.gallery figure{margin:0;border-radius:12px;overflow:hidden;position:relative}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.gallery figure:hover img{transform:scale(1.04)}
.gallery figcaption{position:absolute;left:8px;bottom:8px;background:rgba(12,34,48,.82);color:#fff;font-size:.75rem;font-weight:600;padding:3px 9px;border-radius:999px}
.gallery .big{grid-column:span 2;grid-row:span 2}
.gallery .tall{grid-row:span 2}
@media (max-width:820px){ .gallery{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:160px} }

/* Per chi + partner */
.who{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.who div{background:var(--bg);border-radius:14px;padding:22px;border-top:5px solid var(--c);display:grid;gap:8px;align-content:start}
.who p{color:var(--muted);font-size:.92rem}
@media (max-width:900px){ .who{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:480px){ .who{grid-template-columns:1fr} }
.partners{margin-top:40px;display:grid;grid-template-columns:1fr 1.2fr;gap:28px;align-items:center;background:var(--bg);border-radius:14px;padding:28px}
.partners p{color:var(--muted);margin-top:8px}
.partners .logos{background:#fff;border-radius:10px;padding:10px}
@media (max-width:800px){ .partners{grid-template-columns:1fr} }

/* Contatti */
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:40px}
.cbox{display:grid;gap:12px;align-content:start}
.ci{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;background:var(--soft);border-radius:12px;padding:14px}
.ci .ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-family:var(--display)}
.ci small{display:block;color:var(--muted);font-size:.78rem}
.ci b{font-weight:600;overflow-wrap:anywhere}
.copy{font:inherit;font-size:.75rem;font-weight:600;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px 10px;color:var(--ink);cursor:pointer;text-decoration:none}
form{background:var(--night);color:var(--night-ink);border-radius:16px;padding:28px;display:grid;gap:14px}
form h3{color:#fff;font-size:1.5rem}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label{display:grid;gap:6px;font-size:.84rem;font-weight:600;color:var(--night-muted)}
input,select,textarea{font:inherit;font-size:.95rem;padding:.7rem .8rem;border:1px solid rgba(255,255,255,.18);border-radius:10px;background:rgba(255,255,255,.06);color:#fff;width:100%}
select option{color:#000}
input::placeholder,textarea::placeholder{color:rgba(255,255,255,.4)}
textarea{min-height:110px;resize:vertical}
.chk{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.chk input{width:auto;margin-top:4px}
#formMsg{font-size:.9rem;color:var(--sun);font-weight:600;min-height:1.2em}
@media (max-width:860px){ .contact{grid-template-columns:1fr} }
@media (max-width:480px){ .row2{grid-template-columns:1fr} }

footer{background:var(--night);color:var(--night-muted);padding-block:26px;font-size:.84rem;border-top:4px solid var(--red)}
footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
footer a{color:var(--night-ink)}
.wa{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:8;background:#25D366;color:#fff;border-radius:999px;padding:12px 18px;font-weight:700;text-decoration:none;box-shadow:0 10px 24px -10px rgba(0,0,0,.5);font-size:.92rem}

html,body{margin:0;padding:0}
.h1-pre{display:block;font-family:var(--mono);font-size:.95rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--sun);margin-bottom:14px}
.card h3 a{color:inherit;text-decoration:none}
.card h3 a::after{content:" →";color:var(--red)}
.card h3 a:hover{color:var(--red)}
.zones{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.zones span{padding:.4rem .9rem;border-radius:999px;background:var(--bg);border:1px solid var(--line);font-weight:600;font-size:.9rem}
.faq{display:grid;gap:10px;max-width:820px}
.faq details{background:var(--soft);border-radius:12px;padding:16px 20px}
.faq summary{cursor:pointer;font-weight:700;font-size:1.02rem}
.faq details p{margin-top:10px;color:var(--muted)}
.crumbs{font-size:.85rem;color:var(--night-muted)}
.crumbs a{color:var(--night-ink)}
.svc-hero .wrap{padding-block:56px 48px}
.svc-hero h1{font-size:clamp(2.2rem,5vw,3.6rem)}
.article{display:grid;grid-template-columns:1.4fr .9fr;gap:48px;align-items:start}
.article .prose{display:grid;gap:22px;min-width:0}
.article .prose p{color:var(--muted);max-width:64ch}
.article .prose h2{font-size:1.7rem}
.article ul.list{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.article ul.list li{display:block;position:relative;padding-left:19px}
.article ul.list li::before{content:"";position:absolute;left:0;top:0;width:9px;height:9px;margin-top:8px;border-radius:50%;background:var(--green)}
.aside{position:sticky;top:90px;display:grid;gap:14px}
.aside img{border-radius:14px;width:100%;aspect-ratio:4/3;object-fit:cover}
.aside .box{background:var(--night);color:var(--night-ink);border-radius:14px;padding:22px;display:grid;gap:10px}
.aside .box b{font-family:var(--display);font-size:1.3rem}
.aside .box p{color:var(--night-muted);font-size:.92rem}
.related{display:flex;flex-wrap:wrap;gap:8px}
.related a{padding:.45rem .95rem;border-radius:999px;border:1.5px solid var(--line);text-decoration:none;color:var(--ink);font-weight:600;font-size:.9rem}
.related a:hover{border-color:var(--red);color:var(--red)}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 16px;width:100%;margin-bottom:10px}
@media (max-width:900px){.article{grid-template-columns:1fr}.aside{position:static}}
