/* =========================================================
   Font import
   ========================================================= */
   @import url("https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500&family=Roboto:wght@300;400;500&family=Open+Sans:wght@300;400;500&display=swap");

   /* =========================================================
      Base / Reset
      ========================================================= */
   html, body {
     margin: 0;
     padding: 0;
     background: #000;
     color: #eee;
     font-family: "Open Sans", sans-serif;
  font-weight: 300;
}
   
   body {
     max-width: 1300px;
     margin: 40px auto;
     padding: 0 60px;   /* ← questo è il punto */
     line-height: 1.6;
   }
   
   /* =========================================================
      Section titles (Raleway)
      ========================================================= */
   h1 {
     font-family: "Raleway", sans-serif;
     font-size: 70px;
     font-weight: 300;
     letter-spacing: 0.04em;
     color: #DA940E;
     margin: 0 0 12px 0;
   }
   
   .section-text {
     font-family: "Raleway", sans-serif;
     font-size: 18px;
     font-weight: 200;
     color: #fff;
     margin: 0 0 50px 0;
   }
   
   /* =========================================================
      Item layout
      ========================================================= */
  .item {
    display: flex;
    gap: 24px;
    margin-bottom: 0px;   /* o il valore che hai scelto */
    align-items: center;   /* ← QUESTO */
  }
  
  .item .text {
    position: relative;
    top: -9px;
  }

   .item img {
     width: 250px;
     height: auto;
     border: 1px solid #444;
     padding: 4px;
     background: #111;
   }
   
   /* =========================================================
      Text column inside item
      ========================================================= */
   .text {
     display: flex;
     flex-direction: column;
   }
   
   /* ---------------------------------------------------------
      Paragraph control (Pandoc-safe)
      --------------------------------------------------------- */
   
   /* azzera i margini dei paragrafi generati */
   .text p {
     margin: 0;
   }
   
   /* separazione semantica: solo tra paragrafi successivi */
   .text p + p {
     margin-top: 10px;
   }
   
   /* =========================================================
      Item title (Roboto)
      ========================================================= */
   .text h3 {
     font-family: "Roboto", sans-serif;
     font-size: 36px;
     font-weight: 400;
     letter-spacing: 0.04em;
     margin: 0 0 0px 0;
     margin-bottom: -6px;
     color: #fff;
   }
   
   /* =========================================================
      Item subtitle (Roboto)
      ========================================================= */
   .text .subtitle {
     display: block;                 /* fondamentale */
     font-family: "Roboto", sans-serif;
     font-size: 18px;
     font-weight: 300;
     letter-spacing: 0.04em;
     color: #fff;
   }
   
   /* =========================================================
      Item body text (Open Sans)
      ========================================================= */
   .text p {
     font-family: "Open Sans", sans-serif;
     font-size: 14px;
     font-weight: 300;
     letter-spacing: 0.015em;
     line-height: 1.7;
     color: #eee;
   }
   
   /* =========================================================
      Links (optional, sober)
      ========================================================= */
   a {
     color: #DA940E;
     text-decoration: none;
   }
   
   a:hover {
     text-decoration: underline;
   }

/* =========================================================
   Page header
   ========================================================= */
.page-header {
  text-align: center;
  margin-bottom: 80px;
  line-height: 1.05;
}

/* Header image */
.page-header img {
  display: block;
  margin: 0 auto 20px auto;
  width: 220px;          /* o quello che preferisci */
  height: auto;
}

/* Header title */
.page-header h1 {
  text-align: center;
}

/* Intro text */
.page-header .intro-text {
  max-width: 1300px;          /* stessa larghezza del body */
  margin: 0 auto 20px auto;  /* centrato come blocco */
  text-align: left;          /* testo NON centrato */
  font-family: "Raleway", sans-serif;
  font-size: 20px;
  font-weight: 200;
  line-height: 1.7;
  color: #fff;
}

/* =========================================================
   Reusable section header
   ========================================================= */
   .section-header {
    margin: 70px 0 60px 0;
    text-align: center;
  }
  
  /* image */
  .section-header img {
    display: block;
    margin: 0 auto 20px auto;
    width: 220px;
    height: auto;
  }
  
  /* title */
  .section-header h1 {
    line-height: 1.05;
    margin-bottom: 20px;
  }
  
  /* intro text aligned with item text column */
  .section-header p {
    max-width: 1300px;
    margin: 0 auto;
    padding-left: 0px;   /* immagine (180) + gap (24) */
    text-align: left;
    font-family: "Raleway", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: #fff;
    margin-bottom: 0;
  }
  
  .separator-band {
    max-width: 1300px;
    margin: 0 auto;          /* ZERO sopra/sotto, centrata */
    background-color: #478ac9;
    height: 36px;
  }

  .separator-band-thin {
    max-width: 1300px;
    margin: 0 auto;          /* ZERO sopra/sotto, centrata */
    background-color: #478ac9;
    height: px;
  }
  
/* =========================================================
   Image-only item (centered)
   ========================================================= */
   .item-image {
    max-width: 500px;
    margin: 0px auto;        /* spazio sopra/sotto (regolabile) */
    margin-bottom: 0px;
    text-align: center;
  }
  
  /* immagine */
  .item-image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
  }
  
  /* didascalia (se presente) */
  .item-image p {
    margin-top: 8px;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 300;
    color: #ccc;
  }
  /* =========================================================
   Reseller branding: The Great British Book Shop
   ========================================================= */
   .reseller {
    white-space: nowrap;
    font-weight: 500;
    text-decoration: none;   /* niente underline */
  }
  
  .reseller:hover {
    text-decoration: none;
    background: #f5f5f5;
  }
  

.reseller-the {
  color: #0033a0;        /* blu UK */
}

.reseller-gb {
  color: #c8102e;        /* rosso UK */
}

.reseller-bs {
  color: #000000;           /* nero */
}
/* Reseller boxed on dark background */
.reseller.reseller--boxed {
  background: #fff;
  display: inline-block;
  padding: 0.08em 0.4em;   /* striscia bassa */
  border-radius: 2px;
}

.reseller {
  line-height: 1.05;
}
/*.item-image { outline: 3px solid red; }
.section-header { outline: 3px solid lime; }*/

.section-header img {
  margin-bottom: 0;
}

.section-header h1 {
  margin-top: 0;
}
.section-header {
  padding-top: 1px;
}
.section-header--tight {
  margin-top: 0;
}

.sub-section-title {
  font-family: "Raleway", sans-serif;
  font-size: 50px;
  font-weight: 300;
  line-height: 1.2;
  text-align: left;
  margin: 24px 0 12px 0;
  letter-spacing: 0.02em;
}
/* =========================================================
   Footer
   ========================================================= */

   .site-footer {
    max-width: 1300px;
    margin: 80px auto 40px auto;
    padding-top: 0px;
    border-top: 1px solid #333;
  }
  
  .footer-inner {
    padding: 0 60px;   /* allineato al body */
  }
  
  .footer-title {
    font-family: "Raleway", sans-serif;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.08em;
    color: #DA940E;
    margin: 0 0 8px 0;
  }
  
  .footer-text {
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 300;
    line-height: 1.6;
    color: #bbb;
    margin: 0 0 6px 0;
  }
  
  .footer-links {
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 300;
  }
  
  .footer-links a {
    color: #bbb;
  }
  
  .footer-links a:hover {
    color: #DA940E;
    text-decoration: none;
  }
  /* =========================================================
   Top navigation (Roboto)
   ========================================================= */

.site-nav {
  max-width: 1300px;
  margin: 0 auto 60px auto;
  padding-top: 0px;
  border-bottom: 1px solid #333;
}

.nav-inner {
  padding: 0 60px;
}


.nav-links a {
  font-family: "Roboto", sans-serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.06em;
  margin-left: 28px;
  color: #bbb;
  text-decoration: none;
}

.nav-links a:hover {
  color: #DA940E;
}

/* =========================================================
   Download list
   ========================================================= */

.download-list {
  margin-top: 40px;
  text-align: center;          /* centro il blocco */
}

.download-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: inline-block;       /* chiave: il blocco non occupa tutta la larghezza */
  text-align: left;            /* testo leggibile */
}

.download-list li {
  font-family: "Roboto", sans-serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.8;
  margin-bottom: 12px;
  padding-left: 28px;
  position: relative;
}

/* PDF symbol */
.download-list li::before {
  content: "PDF";
  position: absolute;
  left: 0;
  top: 0;
  font-family: "Roboto", sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: #DA940E;
}

/* links */
.download-list a {
  color: #eee;
  text-decoration: none;
}

.download-list a:hover {
  color: #DA940E;
}
/* =========================================================
   Centered section header (used for Downloads)
   ========================================================= */

   .section-header--centered {
    text-align: center;
  }
  
  .section-header--centered p {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  /* =========================================================
   Home page menu spacing
   ========================================================= */

.page-home .site-nav {
  margin-bottom: 40px;
}
/* =========================================================
   Global list typography (keeps lists consistent)
   ========================================================= */
ul, ol {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

li {
  font-family: inherit;
}

/* =========================================================
   Concepts strip (home)
   ========================================================= */
.concepts{
  max-width: 1300px;
  margin: 30px auto 40px auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.concept{
  border: 1px solid #333;
  background: #0b0b0b;
  padding: 14px;
}

.concept img{
  width: 100%;
  height: auto;
  border: 1px solid #444;
  background: #111;
  padding: 4px;
  margin-bottom: 10px;
}

.concept-text{
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.6;
  text-align: left;
}

.concept-text h3{
  font-family: "Roboto", sans-serif;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0.04em;
  margin: 0 0 6px 0;
  color: #fff;
}

/* responsive */
@media (max-width: 1100px){
  .concepts{ grid-template-columns: 1fr; }
}

.concept-text ul{
  margin: 0;
  padding-left: 1.4em;     /* distanza del testo dal bordo */
}

.concept-text li{
  list-style-type: disc;
  list-style-position: outside;  /* QUESTO è il punto chiave */
  font-family: "Open Sans", sans-serif;
  color: #ddd;
}

.concept-text li::marker{
  color: #DA940E;
}


/* =========================================================
   Manifesto accordion
   ========================================================= */
details.manifesto{
  margin-top: 18px;
  border: 1px solid #333;
  background: #0b0b0b;
  padding: 12px 14px;
}

details.manifesto summary{
  cursor: pointer;
  font-family: "Roboto", sans-serif;
  letter-spacing: 0.06em;
  color: #DA940E;
  list-style: none;
}

details.manifesto summary::-webkit-details-marker{ display:none; }

details.manifesto[open] summary{
  margin-bottom: 10px;
}

details.manifesto p{
  margin: 0;
}

/* =========================================================
   Notices (Amazon / notes / disclaimer)
   ========================================================= */
.notice{
  margin-top: 16px;
  padding: 12px 14px;
  border: 1px solid #333;
  background: #070707;
  font-family: "Open Sans", sans-serif;
  font-size: 13.5px;
  line-height: 1.6;
  color: #ddd;
}

.notice ul{
  margin: 8px 0 0 18px;
}

.notice-amazon{
  border-color: #2EDE14;
}

.notice-notes{
  border-color: #DA940E;
}

.notice-disclaimer{
  border-color: #666;
  color: #bbb;
}
