/* Font ospitati in locale (cartella fonts/) - nessuna richiesta a Google */
@font-face{font-family:Lobster;font-style:normal;font-weight:400;font-display:swap;src:url("fonts/lobster-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:Montserrat;font-style:normal;font-weight:300;font-display:swap;src:url("fonts/montserrat-latin-300-normal.woff2") format("woff2")}
@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;src:url("fonts/montserrat-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:Montserrat;font-style:normal;font-weight:600;font-display:swap;src:url("fonts/montserrat-latin-600-normal.woff2") format("woff2")}

:root{
  --dark:#1c1c1c; --light:#f9f9f9; --sand:#f1e1dd; --red:#cc4331; --brown:#734332; --bordeaux:#990000; --grey:#666; --cover:url("/images/sfinge-piramidi-giza-osiride.jpg");
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Montserrat,Arial,sans-serif;background:var(--light);color:var(--dark);line-height:1.7}
a{color:var(--bordeaux);text-decoration:none}
a:hover{text-decoration:underline}

/* Header / nav */
header{position:sticky;top:0;z-index:10;background:rgba(28,28,28,.95);backdrop-filter:blur(6px)}
.nav{max-width:1100px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.brand{font-family:Lobster,Arial,sans-serif;font-size:1.6rem;color:var(--light)}
.brand:hover{text-decoration:none;color:var(--sand)}
.brand{display:flex;align-items:center;gap:12px}
.logo{display:block;height:44px;width:auto}
nav ul{list-style:none;display:flex;gap:22px;flex-wrap:wrap}
nav a{color:var(--light);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;padding-bottom:3px;border-bottom:2px solid transparent}
nav a:hover,nav a.active{border-color:var(--bordeaux);text-decoration:none}

/* Hero */
.hero{position:relative;min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--light);
  background:linear-gradient(rgba(28,28,28,.55),rgba(28,28,28,.75)),
  var(--cover) center/cover no-repeat;
  background-color:var(--dark)}
.hero-inner{max-width:820px;padding:60px 24px}
.hero h1{font-family:Lobster,Arial,sans-serif;font-weight:400;font-size:clamp(2.6rem,7vw,4.5rem);margin-bottom:18px}
.hero p{font-weight:300;font-size:1.05rem}
.hero .tagline{margin-top:26px;font-weight:600;font-size:1.2rem;color:var(--sand)}
.btn{display:inline-block;margin-top:22px;padding:10px 26px;border:2px solid var(--bordeaux);color:var(--light);background:var(--bordeaux);
  font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;border-radius:2px;transition:.2s}
.btn:hover{background:transparent;color:var(--bordeaux);text-decoration:none}
.hero .btn:hover,.page-hero .btn:hover{color:var(--light)}
.btn+.btn{margin-left:12px}

/* Cards */
.cards{max-width:1100px;margin:-60px auto 0;padding:0 20px;display:grid;grid-template-columns:1fr;gap:24px;position:relative}
.card{background:var(--sand);padding:32px 28px;border-top:4px solid var(--bordeaux);box-shadow:0 6px 20px rgba(0,0,0,.12);display:grid;grid-template-columns:minmax(200px,300px) 1fr;grid-template-rows:auto 1fr auto;column-gap:32px;align-items:start}
.card h2{font-family:Lobster,Arial,sans-serif;font-weight:400;font-size:1.9rem;color:var(--bordeaux);margin-bottom:12px}
.card p{font-size:.95rem;flex:1}
.card .btn{justify-self:start;color:var(--light)}
.card .btn:hover{color:var(--bordeaux)}
.card-img{display:block;width:100%;height:auto;grid-column:1;grid-row:1/4}
.card h2,.card p,.card .btn{grid-column:2}
@media(max-width:800px){.card{grid-template-columns:1fr}.card-img{grid-row:auto;margin-bottom:1rem}.card h2,.card p,.card .btn{grid-column:1}}

/* Thot */
.thot{max-width:1100px;margin:70px auto;padding:0 20px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.thot h2{font-family:Lobster,Arial,sans-serif;font-weight:400;font-size:2.4rem;color:var(--bordeaux);margin-bottom:14px}
.thot p{margin-bottom:16px}
.thot img{width:100%;height:auto;display:block;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.thot .lead{font-weight:600}
@media(max-width:800px){.thot{grid-template-columns:1fr}.cards{margin-top:-30px}}
.thot-full{grid-template-columns:1fr;gap:24px;align-items:start}
.thot-full .btn{margin-top:0}

footer{background:var(--dark);color:var(--light);text-align:center;padding:28px 20px;font-size:.8rem;font-weight:300}
footer .footer-links{margin-top:8px}
footer a{color:var(--sand);text-decoration:underline}
footer a:hover{color:var(--light)}
footer .license{margin-top:10px;font-size:.9em;line-height:1.5;color:var(--sand);opacity:.85}
footer .license-badge{display:inline-block;margin-top:5px}
footer .license img{border:0;vertical-align:middle}

/* ---------- Pagine interne ---------- */
.page-hero{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--light);min-height:34vh;
  background:linear-gradient(rgba(28,28,28,.55),rgba(28,28,28,.75)),var(--cover) center/cover no-repeat;background-color:var(--dark)}
.page-hero h1{font-family:Lobster,Arial,sans-serif;font-weight:400;font-size:clamp(2.4rem,6vw,4rem);padding:50px 24px}
/* Per usare una copertina diversa in una pagina, aggiungi in fondo a questo file, ad esempio:
   .page-ipotesi .page-hero{--cover:url("/images/sfinge-piramidi-giza-osiride.jpg")} */

.content{max-width:820px;margin:60px auto;padding:0 20px}
.content.wide{max-width:1100px}
.content h2{font-family:Lobster,Arial,sans-serif;font-weight:400;font-size:2rem;color:var(--bordeaux);margin:38px 0 12px}
.content h2:first-child{margin-top:0}
.content p{margin-bottom:16px}
.content ul,.content ol{margin:0 0 18px 1.3em}
.content ol{margin-left:1.9em}
.content h3{font-size:1.2rem;font-weight:600;color:var(--brown);margin:28px 0 10px}
.content li{margin-bottom:6px}
.content strong{font-weight:600}
.lead{font-weight:600;font-size:1.1rem}
.center{text-align:center}
figure{margin:32px 0;text-align:center}
figure img{max-width:100%;height:auto;box-shadow:0 8px 24px rgba(0,0,0,.25)}
figcaption{margin-top:12px;font-size:.9rem;color:var(--grey)}
figcaption small{display:block;font-size:.8rem;margin-top:2px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.split img{width:100%;height:auto;display:block;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.price{font-size:1.4rem;color:var(--bordeaux)}
.note{font-size:.85rem;color:var(--grey);margin-top:6px}
.copyright{font-size:.85rem;color:var(--grey);border-top:1px solid var(--sand);padding-top:16px;margin-top:40px}
@media(max-width:800px){.split{grid-template-columns:1fr}}

.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-bottom:32px}
.gallery img{width:100%;height:auto;display:block;box-shadow:0 8px 24px rgba(0,0,0,.25)}

.intro{margin-bottom:48px}
.intro p{margin-bottom:0}
.intro .lead{margin-top:20px;margin-bottom:20px}
.intro .lead:first-child{margin-top:0}

/* Archivio articoli (pagina Thot) */
.archivio{display:grid;gap:24px;margin-bottom:56px}
.archivio-item{background:var(--sand);padding:28px;border-top:4px solid var(--bordeaux);box-shadow:0 6px 20px rgba(0,0,0,.12)}
.archivio-item h2{font-family:Lobster,Arial,sans-serif;font-weight:400;font-size:1.9rem;color:var(--bordeaux);margin:0 0 12px}
.archivio-item p{margin-bottom:12px}
.archivio-item .btn{margin-top:6px}
.archivio-testo{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;line-clamp:5;overflow:hidden}

/* Pulsante "Torna su" - stessi colori dei .btn (bordeaux su chiaro, hover trasparente) */
.to-top{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:20;width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--bordeaux);border-radius:2px;background:var(--bordeaux);color:var(--light);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .25s,transform .25s,visibility .25s,background .2s,color .2s}
.to-top svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--light);color:var(--bordeaux);text-decoration:none}
.to-top:focus-visible{outline:3px solid var(--brown);outline-offset:3px}
@media(max-width:600px){.to-top{right:14px;width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.to-top{transition:none}}
