/*
Theme Name: Bacco Bandito
Theme URI: https://www.baccobandito.it
Author: Bacco Bandito
Author URI: https://www.baccobandito.it
Description: Tema editoriale in stile quotidiano (impaginato "Prima Pagina") per Bacco Bandito. Palette sobria alla Wall Street Journal con accento bordeaux di brand. Le immagini degli articoli sono prese automaticamente dall'immagine in evidenza di ogni post.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bacco-bandito
*/

/* ============================================================
   VARIABILI DI BRAND  —  cambia qui per ritoccare tutto il tema
   ============================================================ */
:root{
  --bb-ink:        #17130F;   /* nero caldo (testo) */
  --bb-ink-soft:   #3a352e;
  --bb-muted:      #4A443C;
  --bb-faint:      #6a655c;
  --bb-paper:      #F7F4ED;   /* carta calda (sfondo) */
  --bb-paper-alt:  #FBFAF5;
  --bb-rule:       #D8D2C6;   /* filetti */
  --bb-rule-soft:  #E6E0D4;
  --bb-bordeaux:   #7A1E2B;   /* accento di brand */
  --bb-bordeaux-2: #5C1520;
  --bb-serif:   'Libre Caslon Display', Georgia, 'Times New Roman', serif;
  --bb-text:    'Source Serif 4', Georgia, serif;
  --bb-sans:    'Libre Franklin', -apple-system, Segoe UI, Roboto, sans-serif;
}

/* ============================================================
   RESET / BASE
   ============================================================ */
*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:#c7c4bd;
  color:var(--bb-ink);
  font-family:var(--bb-sans);
  line-height:1.5;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--bb-bordeaux); text-decoration:none; }
a:hover{ color:var(--bb-bordeaux-2); }
.bb-skip-link{ position:absolute; left:-9999px; }
.bb-skip-link:focus{ left:8px; top:8px; background:#fff; padding:8px 14px; z-index:999; }

/* Il "foglio" centrale */
.bb-sheet{
  max-width:1200px;
  margin:0 auto;
  background:var(--bb-paper);
  min-height:100vh;
}

.bb-container{ padding-left:40px; padding-right:40px; }

/* ============================================================
   HEADER — utility bar + masthead + nav
   ============================================================ */
.bb-utility{
  display:flex; justify-content:space-between; align-items:center;
  padding:9px 40px;
  font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--bb-faint);
  border-bottom:1px solid var(--bb-ink);
}
.bb-utility__social{ display:flex; gap:18px; }
.bb-utility__social a{ color:var(--bb-faint); }
.bb-utility__social a:hover{ color:var(--bb-bordeaux); }

.bb-masthead{
  text-align:center;
  padding:30px 40px 18px;
  border-bottom:1px solid var(--bb-rule);
}
.bb-masthead__kicker{
  font-size:11px; letter-spacing:.42em; text-transform:uppercase;
  color:var(--bb-bordeaux); font-weight:700; margin-bottom:12px;
}
.bb-masthead__brand{
  font-family:var(--bb-serif);
  font-size:clamp(38px, 7.2vw, 74px);
  line-height:.9; letter-spacing:.01em; color:var(--bb-ink); margin:0;
}
.bb-masthead__brand a{ color:inherit; }
.bb-masthead__tagline{
  font-family:var(--bb-text); font-style:italic;
  font-size:17px; color:var(--bb-muted); margin-top:14px;
}

.bb-nav{
  display:flex; justify-content:center; flex-wrap:wrap; gap:30px;
  padding:13px 40px;
  border-bottom:2px solid var(--bb-ink);
}
.bb-nav a{
  color:var(--bb-ink);
  font-size:12.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
}
.bb-nav a:hover,
.bb-nav .current-menu-item > a{ color:var(--bb-bordeaux); }
.bb-nav ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:30px; }
.bb-menu-toggle{ display:none; }

/* ============================================================
   HOMEPAGE — hero
   ============================================================ */
.bb-hero{
  display:grid; grid-template-columns:1fr 340px;
  border-bottom:1px solid var(--bb-rule);
}
.bb-lead{ padding:34px 34px 34px 40px; border-right:1px solid var(--bb-rule); }
.bb-sidebar{ padding:28px 30px; }

.bb-kicker{
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--bb-bordeaux); font-weight:700; margin-bottom:14px;
}
.bb-headline{
  font-family:var(--bb-serif); line-height:1.02; color:var(--bb-ink);
  margin:0 0 16px; font-weight:400;
}
.bb-lead .bb-headline{ font-size:clamp(34px, 4vw, 52px); }
.bb-dek{
  font-family:var(--bb-text); font-size:19px; line-height:1.5;
  color:var(--bb-ink-soft); max-width:60ch; margin:0 0 18px;
}
.bb-byline{ font-size:12px; letter-spacing:.06em; color:var(--bb-faint); }
.bb-byline b{ color:var(--bb-ink); }

/* immagini */
.bb-thumb{ width:100%; object-fit:cover; display:block; border:1px solid #ddd7cb; }
.bb-thumb--lead{ aspect-ratio:16/9; margin-bottom:14px; }
.bb-thumb--card{ aspect-ratio:3/2; margin-bottom:14px; }
.bb-thumb--ph{
  display:flex; align-items:center; justify-content:center;
  background:repeating-linear-gradient(135deg,#e7e2d7 0 13px,#efeae0 13px 26px);
}
.bb-thumb--ph span{ font-size:10px; letter-spacing:.22em; color:#a09a89; text-transform:uppercase; }

/* box libro */
.bb-book{
  border:1px solid var(--bb-ink); padding:22px 20px; text-align:center;
  background:var(--bb-paper-alt);
}
.bb-book__label{
  font-size:10px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--bb-bordeaux); font-weight:700; margin-bottom:16px;
}
.bb-book__cover{ width:150px; margin:0 auto 16px; box-shadow:0 12px 26px rgba(0,0,0,.22); }
.bb-book__title{ font-family:var(--bb-serif); font-size:23px; line-height:1.08; margin-bottom:8px; }
.bb-book__sub{ font-family:var(--bb-text); font-style:italic; font-size:14px; color:var(--bb-muted); margin-bottom:16px; }
.bb-btn{
  display:inline-block; background:var(--bb-bordeaux); color:var(--bb-paper);
  font-family:var(--bb-sans); font-weight:700; font-size:13px; letter-spacing:.08em;
  text-transform:uppercase; padding:12px 22px; border-radius:2px;
}
.bb-btn:hover{ background:var(--bb-bordeaux-2); color:var(--bb-paper); }
.bb-book__cta{ display:block; }

/* più letti */
.bb-mostread{ margin-top:26px; border-top:2px solid var(--bb-ink); padding-top:14px; }
.bb-mostread__label{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; font-weight:700; margin-bottom:12px; }
.bb-mostread ol{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.bb-mostread li{ border-bottom:1px solid var(--bb-rule-soft); }
.bb-mostread li:last-child{ border-bottom:0; }
.bb-mostread a{ display:flex; gap:12px; color:var(--bb-ink); padding:11px 0; }
.bb-mostread a:hover{ color:var(--bb-bordeaux); }
.bb-mostread .num{ font-family:var(--bb-serif); font-size:26px; color:var(--bb-bordeaux); line-height:.9; }
.bb-mostread .t{ font-family:var(--bb-text); font-size:15px; line-height:1.25; }

/* etichetta sezione */
.bb-section-label{ display:flex; align-items:center; gap:16px; padding:24px 40px 6px; }
.bb-section-label .lbl{ font-size:12px; letter-spacing:.2em; text-transform:uppercase; font-weight:700; color:var(--bb-ink); }
.bb-section-label .line{ flex:1; height:1px; background:var(--bb-rule); }
.bb-section-label .more{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; }

/* griglia 3 colonne */
.bb-grid{ display:grid; grid-template-columns:repeat(3,1fr); padding:18px 40px 40px; }
.bb-grid .bb-card{ padding:0 26px; border-right:1px solid var(--bb-rule); }
.bb-grid .bb-card:first-child{ padding-left:0; }
.bb-grid .bb-card:last-child{ padding-right:0; border-right:0; }
.bb-card__kicker{ font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--bb-bordeaux); font-weight:700; margin-bottom:8px; }
.bb-card__title{ font-family:var(--bb-serif); font-size:24px; line-height:1.08; margin:0 0 9px; }
.bb-card__title a{ color:var(--bb-ink); }
.bb-card__title a:hover{ color:var(--bb-bordeaux); }
.bb-card__dek{ font-family:var(--bb-text); font-size:15px; line-height:1.45; color:var(--bb-ink-soft); margin:0; }

/* ============================================================
   ARCHIVIO / INDICE
   ============================================================ */
.bb-archive-head{ padding:40px 40px 6px; }
.bb-archive-head h1{ font-family:var(--bb-serif); font-weight:400; font-size:clamp(30px,4vw,48px); margin:0; }
.bb-archive-head p{ font-family:var(--bb-text); color:var(--bb-muted); margin:10px 0 0; }
.bb-grid--archive{ grid-template-columns:repeat(3,1fr); row-gap:36px; padding-top:28px; }
.bb-grid--archive .bb-card{ border-right:1px solid var(--bb-rule); }
.bb-grid--archive .bb-card:nth-child(3n){ border-right:0; padding-right:0; }
.bb-grid--archive .bb-card:nth-child(3n+1){ padding-left:0; }

.bb-pagination{ padding:20px 40px 60px; display:flex; gap:10px; flex-wrap:wrap; }
.bb-pagination .page-numbers{
  font-family:var(--bb-sans); font-size:13px; font-weight:600;
  padding:9px 14px; border:1px solid var(--bb-rule); color:var(--bb-ink); border-radius:2px;
}
.bb-pagination .page-numbers.current{ background:var(--bb-ink); color:var(--bb-paper); border-color:var(--bb-ink); }
.bb-pagination a.page-numbers:hover{ border-color:var(--bb-bordeaux); color:var(--bb-bordeaux); }

/* ============================================================
   ARTICOLO SINGOLO / PAGINA
   ============================================================ */
.bb-single{ padding:44px 40px 60px; }
.bb-single__inner{ max-width:720px; margin:0 auto; }
.bb-single__kicker{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--bb-bordeaux); font-weight:700; margin-bottom:16px; }
.bb-single__title{ font-family:var(--bb-serif); font-weight:400; font-size:clamp(34px,5vw,56px); line-height:1.03; margin:0 0 18px; }
.bb-single__byline{ font-size:12px; letter-spacing:.06em; color:var(--bb-faint); border-bottom:1px solid var(--bb-rule); padding-bottom:22px; margin-bottom:28px; }
.bb-single__byline b{ color:var(--bb-ink); }
.bb-single__hero{ margin:0 0 30px; }
.bb-single__hero img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.bb-content{ font-family:var(--bb-text); font-size:19px; line-height:1.68; color:var(--bb-ink-soft); }
.bb-content p{ margin:0 0 1.2em; }
.bb-content h2{ font-family:var(--bb-serif); font-weight:400; font-size:32px; line-height:1.1; color:var(--bb-ink); margin:1.6em 0 .5em; }
.bb-content h3{ font-family:var(--bb-sans); font-weight:700; font-size:20px; letter-spacing:.01em; color:var(--bb-ink); margin:1.5em 0 .4em; }
.bb-content a{ text-decoration:underline; text-underline-offset:3px; }
.bb-content blockquote{ border-left:3px solid var(--bb-bordeaux); margin:1.4em 0; padding:2px 0 2px 22px; font-style:italic; color:var(--bb-ink); }
.bb-content img{ margin:1.4em 0; }
.bb-content ul,.bb-content ol{ padding-left:1.3em; margin:0 0 1.2em; }
.bb-single__book{ max-width:720px; margin:44px auto 0; }
.bb-single__book .bb-book{ display:flex; align-items:center; gap:24px; text-align:left; }
.bb-single__book .bb-book__cover{ width:110px; margin:0; flex:0 0 auto; }
.bb-single__book .bb-book__body{ flex:1; }
.bb-back{ display:inline-block; margin-top:36px; font-family:var(--bb-sans); font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; }

/* ============================================================
   FOOTER
   ============================================================ */
.bb-footer{ border-top:2px solid var(--bb-ink); background:var(--bb-paper-alt); }
.bb-footer__inner{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px; padding:34px 40px; }
.bb-footer__brand{ font-family:var(--bb-serif); font-size:26px; }
.bb-footer__social{ display:flex; gap:22px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; }
.bb-footer__social a{ color:var(--bb-ink); }
.bb-footer__social a:hover{ color:var(--bb-bordeaux); }
.bb-footer__legal{ border-top:1px solid var(--bb-rule); padding:16px 40px; font-size:11px; letter-spacing:.06em; color:var(--bb-faint); text-align:center; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .bb-hero{ grid-template-columns:1fr; }
  .bb-lead{ border-right:0; border-bottom:1px solid var(--bb-rule); padding:28px 24px; }
  .bb-sidebar{ padding:24px; }
  .bb-container,.bb-utility,.bb-masthead,.bb-nav,.bb-section-label,.bb-grid,.bb-archive-head,.bb-pagination,.bb-single,.bb-footer__inner,.bb-footer__legal{ padding-left:24px; padding-right:24px; }
  .bb-grid,.bb-grid--archive{ grid-template-columns:1fr; }
  .bb-grid .bb-card,.bb-grid--archive .bb-card{ padding:0 0 26px !important; border-right:0 !important; border-bottom:1px solid var(--bb-rule); }
  .bb-grid .bb-card:last-child{ border-bottom:0; }
  .bb-nav{ gap:18px; }
}
@media (max-width:600px){
  .bb-utility{ font-size:10px; padding:8px 24px; }
  .bb-nav a{ font-size:11px; }
  .bb-single__book .bb-book{ flex-direction:column; text-align:center; }
}
