:root{
  --bg:#fff; --text:#111; --muted:#666; --accent:#0a66c2;
  --border:#e5e7eb; --radius:14px; --maxw:1240px; --shadow:0 4px 16px rgba(0,0,0,.06);
   --nav-bg:#ffffff;     /* default, sovrascritto da JS */
  --nav-text:#111111;   /* default, sovrascritto da JS */
}
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial;color:var(--text);background:var(--bg);line-height:1.6}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
.wrap{max-width:var(--maxw);margin-inline:auto;padding:0 16px}
.header{position:sticky;top:0; background: var(--nav-bg, #ffffff);border-bottom:1px solid var(--border);z-index:10}
.brand{display:flex;gap:10px;align-items:center;padding:10px 0} .brand strong{font-size: 1.5rem;
   color: var(--nav-text, #111111);
  text-transform: capitalize;
  letter-spacing: -1px;}
  .headWrap{
    display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
  }
.nav ul{display:flex;gap:12px;list-style:none;padding:0;margin:0} .nav a[data-current="true"]{background:rgba(10,102,194,.08);padding:.4rem .6rem;border-radius:8px}


.nav a {
  color: var(--nav-text, #111111);
}

.nav a:hover {
  opacity: 0.85;
}


.hero{padding:20px 0;border-bottom:1px solid var(--border)} .hero-img{width:100%;height:auto;border-radius:var(--radius);margin-top:10px}
.cards .grid, .related .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:16px}
.card{border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;background:#fff}
.card-img{width:100%;height:160px;object-fit:cover}
.card-body{padding:14px} .card-title{margin:.2rem 0 .4rem} .card-excerpt{color:var(--muted)}
.card-meta{color:var(--muted);font-size:.9rem}
.btn{display:inline-block;padding:.6rem .9rem;border-radius:10px;background:var(--accent);color:#fff;font-weight:600}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.footer{border-top:1px solid var(--border);padding:14px 0;margin-top:24px;color:var(--muted);font-size:.92rem}
.disclaimer{margin-top:12px;color:var(--muted);font-size:.9rem}
.center{text-align:center;margin:18px 0}
.small{font-size:.9rem} .muted{color:var(--muted)}
.breadcrumbs{font-size:.95rem;color:var(--muted);margin:12px 0}
.article{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.article-head .lead{font-size:1.05rem;color:var(--muted)}
.prose h2{margin-top:1.2rem}
.ad{display:grid;grid-template-columns:96px 1fr;gap:14px;align-items:center;border:1px solid var(--border);border-radius:12px;background:#f9fafb;padding:12px;margin:16px 0}
.badge{display:inline-block;padding:2px 8px;border-radius:999px;background:#222;color:#fff;font-size:.75rem;margin-right:6px}
.price{font-weight:700}
.table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid var(--border);border-radius:12px}
.table th,.table td{padding:10px;border-bottom:1px solid var(--border);vertical-align:top}
.table thead th{background:#f7f7f8}
.thumb{width:72px;height:72px;object-fit:cover;border-radius:10px;margin-right:8px}
.rank-card{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center;border:1px solid var(--border);border-radius:12px;background:#fff;padding:10px}
.timeline{list-style:none;padding:0;margin:0;border-left:3px solid var(--border)}
.timeline li{position:relative;padding:8px 12px 8px 14px;margin-left:10px}
.timeline li::before{content:"";position:absolute;left:-9px;top:14px;width:14px;height:14px;background:#fff;border:3px solid var(--accent);border-radius:50%}
@media(max-width:720px){ .card-img{height:140px} .ad{grid-template-columns:1fr} .rank-card{grid-template-columns:1fr} }
/* ───────────── Homepage nuova struttura ───────────── */

/* Hero con testo affiancato */
.hero.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: center;
  padding: 40px 0;
}
.hero.split .hero-text h1 {
  font-size: 1.8rem;
  margin: 0 0 .6rem;
}
.hero.split .hero-text p {
  color: var(--muted);
  font-size: 1.05rem;
}
.hero-img-wrap{
      max-height: 380px;
    overflow: hidden;
    border-radius: 25px;
}
.hero.split .hero-img-wrap img {
  width: 100%;
  height: auto;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

/* Sezioni della homepage */
.cards {
  margin-top: 40px;
}
.cards h2 {
  font-size: 1.4rem;
  margin-bottom: 16px;
  border-bottom: 2px solid var(--border);
  padding-bottom: 6px;
}

/* Sezione best sellers (prodotti Amazon) */
.best-sellers .stack {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.bestseller-item {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 16px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: #fff;
  padding: 12px;
  box-shadow: var(--shadow);
}
.bestseller-item img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 10px;
}
.bestseller-body h3 {
  margin: 0 0 6px;
  font-size: 1rem;
}
.bestseller-body .btn {
  padding: .5rem .8rem;
  font-size: .9rem;
}

/* Responsività */
@media (max-width: 820px) {
  .hero.split {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .hero.split .hero-img-wrap img {
    margin-top: 16px;
  }
  .bestseller-item {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .bestseller-item img {
    margin-inline: auto;
  }
}