:root { --nero:#141414; --rosso:#c8202a; --grigio:#dcdcdc; --testo:#2a2a2a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--testo); font:16px/1.5 Lato, Arial, sans-serif; }
h1,h2,h3,summary,.barra,.menu a,.bottone,.richiedi,.cerca button { font-family:Oswald, "Arial Narrow", Arial, sans-serif; font-weight:400; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; text-decoration:none; }
.largo { width:100%; max-width:1248px; margin:0 auto; }

.barra { background:var(--nero); color:#fff; font-size:17px; }
.barra-dentro { display:flex; justify-content:space-between; align-items:stretch; min-height:50px; padding:0 16px; }
.barra-gruppo { display:flex; align-items:center; gap:28px; }
.carrello { background:#fff; color:var(--nero); align-self:stretch; display:flex; align-items:center; padding:0 18px; }

.testata { display:flex; align-items:center; gap:32px; padding:16px; }
.marchio { flex:0 0 280px; }
.cerca { flex:1; display:flex; }
.cerca input { flex:1; min-width:0; padding:12px 14px; font:inherit; border:1px solid #bbb; border-right:0; }
.cerca button { padding:0 24px; border:0; background:var(--rosso); color:#fff; font-size:17px; cursor:pointer; }

.menu { display:flex; flex-wrap:wrap; align-items:stretch; font-size:17px; }
.menu > a, .menu summary { display:block; padding:12px 14px; cursor:pointer; }
.menu a:hover, .menu summary:hover { text-decoration:underline; }
.menu summary { font-family:Oswald, "Arial Narrow", Arial, sans-serif; }
.menu details { position:relative; }
.rosso { background:var(--rosso); color:#fff; }
.giallo { background:#e6ad12; color:var(--nero); }
.verde { background:#17752b; color:#fff; }
.tendina { position:absolute; z-index:2; top:100%; left:0; min-width:190px; padding:12px 14px; background:#fff; border:1px solid #ccc; }

.eroe { display:grid; grid-template-columns:1.1fr 1fr; background:var(--nero); color:#fff; }
.eroe-testo { padding:72px 40px 72px 90px; align-self:center; }
.eroe h1 { margin:0 0 14px; font-size:44px; line-height:1.1; text-transform:uppercase; }
.eroe p { margin:0 0 26px; max-width:30em; font-size:18px; }
.bottone { display:inline-block; padding:16px 44px; background:var(--rosso); color:#fff; font-size:24px; text-transform:uppercase; }
.bottone:hover { background:#a51820; }
.eroe-immagine { display:flex; align-items:center; justify-content:center; padding:20px; background:#fff; border-left:10px solid var(--rosso); }
.eroe-immagine img { max-height:360px; width:auto; }

.tre { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; padding:20px 24px; background:var(--grigio); }
.tre h2 { margin:0 0 4px; color:var(--rosso); font-size:23px; }
.tre p { margin:0; }

.blocco { padding:64px 16px 56px; }
.titolo { margin:0 0 4px; font-size:28px; }
.titolo::before { content:"\203A"; margin-right:14px; color:var(--rosso); }
.nota { margin:0 0 24px; color:#666; font-size:14px; }
.griglia { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.scheda { padding:16px; background:#fff; box-shadow:0 1px 8px rgba(0,0,0,.14); display:flex; flex-direction:column; }
.stampa { aspect-ratio:1; display:flex; align-items:center; justify-content:center; padding:18px; text-align:center; color:#fff; font:500 25px/1.25 Oswald, "Arial Narrow", Arial, sans-serif; text-transform:uppercase; }
.stampa b { color:#ff4a50; font-weight:600; }
.nero { background:#050505; }
.vino { background:#4a0a25; }
.grigio { background:#46484c; }
.scheda h3 { margin:14px 0 2px; font-size:19px; }
.voto { margin:0 0 14px; color:var(--rosso); font-weight:700; }
.richiedi { margin-top:auto; padding:9px; background:var(--nero); color:#fff; text-align:center; font-size:17px; }
.richiedi:hover { background:var(--rosso); }

.momento { background:var(--grigio); }
.momento-dentro { display:flex; align-items:center; gap:24px; padding:28px 16px; }
.momento img { width:110px; border:4px solid var(--rosso); border-radius:50%; }
.momento h2 { margin:0 0 4px; font-size:28px; }
.momento p { margin:0; }

.piede { background:var(--nero); color:#fff; padding:28px 16px; }
.piede p { margin:0 0 4px; }

@media (max-width:900px) {
  .griglia { grid-template-columns:repeat(2,1fr); }
  .eroe { grid-template-columns:1fr; }
  .eroe-testo { padding:40px 24px; }
  .eroe-immagine { border-left:0; border-top:10px solid var(--rosso); }
  .tre { grid-template-columns:1fr; }
}
@media (max-width:640px) {
  .testata { flex-direction:column; align-items:stretch; gap:14px; }
  .marchio { flex:none; max-width:280px; margin:0 auto; }
  .barra { font-size:15px; }
  .barra-gruppo { gap:14px; }
  .menu { font-size:16px; }
  .menu > a, .menu summary { padding:10px 12px; }
  .eroe h1 { font-size:34px; }
  .bottone { padding:14px 24px; font-size:20px; }
  .griglia { gap:10px; }
  .scheda { padding:10px; }
  .stampa { font-size:18px; padding:10px; }
  .momento-dentro { flex-direction:column; text-align:center; }
}

/* Aggiunte: richieste, Colombo Editrice, Negozio del momento */
[hidden] { display:none !important; }
button.carrello { border:0; font:inherit; cursor:pointer; }
.tendina a { display:block; padding:6px 0; }
.scheda.colombo { grid-column:span 2; flex-direction:row; align-items:center; gap:18px; }
.scheda.colombo img { width:46%; flex:none; border:1px solid #ddd; }
.scheda.colombo p { margin:0 0 14px; }
.scheda.colombo .richiedi { display:block; }
.scheda.colombo:hover .richiedi { background:var(--rosso); }
button.richiedi { border:0; width:100%; cursor:pointer; }
.richiedi.preso { background:var(--rosso); }
.vuoto { grid-column:1 / -1; margin:0; padding:40px 16px; background:#f3f3f3; text-align:center; }

.momento-dentro { display:block; padding:40px 16px 48px; }
.momento-dentro .titolo { margin-bottom:18px; }
.momento-scheda { display:block; background:#fff; box-shadow:0 1px 8px rgba(0,0,0,.18); }
.momento-scheda img { width:100%; }
.momento .momento-scheda img { border:0; border-radius:0; }
.momento-testo { padding:18px 22px 22px; }
.momento-testo h3 { margin:0 0 4px; font-size:26px; }
.momento-testo p { margin:0 0 14px; }
.bottone.piccolo { padding:10px 22px; font-size:18px; }
.piede a { text-decoration:underline; overflow-wrap:anywhere; }

dialog { width:min(560px, calc(100% - 32px)); padding:24px; border:0; border-top:8px solid var(--rosso); }
dialog::backdrop { background:rgba(0,0,0,.6); }
dialog h2 { margin:0 0 12px; font-size:26px; }
.chiudi { position:absolute; top:8px; right:10px; width:40px; height:40px; border:0; background:none; font-size:28px; cursor:pointer; }
#elenco { list-style:none; margin:0 0 12px; padding:0; }
#elenco li { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 0; border-bottom:1px solid #ddd; }
.togli, .copia { padding:6px 12px; border:1px solid #888; background:#fff; font:inherit; font-size:14px; cursor:pointer; }
.regola { font-size:14px; overflow-wrap:anywhere; }

@media (max-width:640px) {
  .scheda.colombo { flex-direction:column; align-items:stretch; }
  .scheda.colombo img { width:100%; }
  .momento-dentro { flex-direction:initial; text-align:left; }
}

.regola a { color:var(--rosso); text-decoration:underline; }

/* Pagine Le mie richieste e Contatti */
a.carrello { color:var(--nero); }
.pagina { padding:48px 16px 64px; min-height:45vh; overflow-wrap:anywhere; }
.pagina h1 { margin:0 0 20px; font-size:34px; }
.pagina a { color:var(--rosso); text-decoration:underline; }
.missiva { max-width:720px; padding:28px; background:#fbf7ec; border:1px solid #d8cfb8; border-top:8px solid var(--rosso); font-size:18px; }
.missiva ul { margin:18px 0; padding-left:22px; font-weight:700; }
.missiva ul:empty { display:none; }
.consegna { margin:18px 0 0; font-family:Oswald, "Arial Narrow", Arial, sans-serif; font-size:24px; line-height:1.25; color:var(--rosso); }
