/*
Theme Name: Officinae
Theme URI: https://www.officinae.net/
Author: Officinae
Author URI: https://www.officinae.net/
Description: Template fedele alla struttura del sito officinae.net/static/t3/ - layout a tre colonne con menu verticale sinistro, area contenuto centrale e colonna immagini destra.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: officinae
Tags: three-columns, custom-menu, vintage, archive
*/

/* =====================================================
   RESET & BASE
   ===================================================== */

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html, body {
    height: 100%;
}

@import url("https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@400;600&display=swap");

/* Font globale per tutto il sito */

* {
  font-family: "Bodoni Moda", serif !important;
		/* color: #2c54b1 !important; */

}


* {
  font-family: "Garamond","Georgia", serif;
  font-size: 20px;
		/* color: #2c54b1 !important; */

}

body {
    background-color: #bfc0dd;
    background-color: #000000;
/*    font-family: "Times New Roman", Times, serif; */
    font-size: 13px;
    color: #000000;
    line-height: 1.5;
}

a {
    color: #006699;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    color: #004477;
}

img {
    border: 0;
    max-width: 100%;
    height: auto;
}

/* =====================================================
   WRAPPER PRINCIPALE
   ===================================================== */

#page-wrapper {
    /*width: 1180px; */
    max-width: 100%;
    margin: 0 auto;
    background-color: #ffffff;
    min-height: 100vh;
}

/* =====================================================
   TOP BAR (breadcrumb / barra superiore)
   ===================================================== */

#top-bar {
    width: 100%;
    background-color: #bfc0dd;
    padding: 2px 6px;
    font-size: 11px;
    text-align: right;
    border-bottom: 0px solid #aaaacc;
}

#top-bar a {
    color: #006699;
    margin-left: 10px;
}

/* =====================================================
   LAYOUT PRINCIPALE: tre colonne
   ===================================================== */

#main-layout {
    display: table;
    width: 100%;
    table-layout: fixed;
}

/* =====================================================
   COLONNA SINISTRA — Menu di navigazione
   ===================================================== */

#sidebar-left {
    display: table-cell;
    width: 255px;
    vertical-align: top;
    background-color: #f4f2ec;
/*    background-color: #cabc9a; */
    padding: 0;
	padding-left: 30px;
    border-right: 1px solid #ddddd0;
	padding-left: 1px;
    border-right: 1px solid #ddddd0;
	border-top: 0px solid;
}

/* Immagine/logo in cima alla sidebar sinistra — ratio originale rispettata */
#sidebar-left .sidebar-header-image {
    width: 100%;
    display: block;
    background-color: #f4f2ec;
}

#sidebar-left .sidebar-header-image img,
#sidebar-left .sidebar-header-image .custom-logo {
    width: 100%;
    height: auto;      /* altezza automatica: rispetta la ratio originale */
    display: block;
}

#sidebar-left .sidebar-header-image a {
    display: block;
    line-height: 0;
}

/* Menu verticale */
#primary-navigation {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}

#primary-navigation li {
    border-bottom: 1px solid #e0ddd5;
    position: relative;
}

#primary-navigation li a {
    display: block;
    padding: 5px 8px 5px 6px;
/*    font-family: Arial, Helvetica, sans-serif; */
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.03em;
    color: #333333;
    text-decoration: none;
    text-align: left;
    text-transform: uppercase;
    background-color: #5a8bc1;
	background-color: #cac2a3; /* beige chiaro */
	background-color: #e1dac6; /* sabbia */
	background-color: #e6dfcc; /*  */
	background-color: rgb(226,218,200); /* BEIGE BELLO */
	background-color: #000000; /* NERO */
    color: #e9e1cf;
	color: #1A4288;
	color: #5a8cc1;
	color: rgb(90,139,193);
	color: #EFEFEF;
    line-height: 1.4;
}

#primary-navigation li a::after {
    content: " ›";
    color: #888888;
    font-size: 15px;
}

/* --- HOVER: effetto tenue, solo leggera variazione --- */
#primary-navigation li a:hover {
    background-color: #6a9bd1;
    color: #ffffff;
    text-decoration: none;
}

/* --- VOCE CORRENTE e VOCE PADRE: sfondo più chiaro --- */
#primary-navigation li.current-menu-item > a,
#primary-navigation li.current-page-ancestor > a,
#primary-navigation li.current-menu-ancestor > a,
#primary-navigation li.current-menu-parent > a {
    background-color: #abc5e2;
	background-color: #e6dfcc;
	background-color: #D9D2BF ; /* leggermente + scuro */
	background-color: #222222 ; /* GRIGIO */
    color: #006699;
	color: #1A4288;
	color: #5a8cc1;
	color: rgb(90,139,193);
	color: #EFEFEF; /* BIANCO*/
}

/* =====================================================
   Sottomenu — nascosto di default, visibile solo se
   la voce padre è corrente o ancestor della pagina attiva
   ===================================================== */

#primary-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: none;
    background-color: #abc5e2;
    background-color: #000000; /* NERO */
}

/* Mostra il sottomenu SOLO quando il padre è la pagina corrente o un ancestor */
#primary-navigation li.current-menu-item > ul,
#primary-navigation li.current-menu-ancestor > ul,
#primary-navigation li.current-menu-parent > ul,
#primary-navigation li.current-page-ancestor > ul {
    display: block;
}

#primary-navigation ul li a {
    padding-left: 16px;
    font-size: 14px;
    font-weight: normal;
    background-color: #5a8bc1;
	background-color: #cac2a3; 	/* beige chiaro */
	background-color: #e1dac6; 	/* sabbia */
	background-color: #e6dfcc; 	/*  */
	background-color: rgb(226,218,200);
	background-color: #000000; /* NERO */
    color: #e9e1cf !important;
    color: #1A4288 !important;
	color: #5a8cc1 !important;
	color: rgb(90,139,193) !important;
	color: #EFEFEF !important; 
    text-transform: none;
}

#primary-navigation ul li a:hover {
    background-color: #6a9bd1;
}

/* Sottovoce corrente — sfondo chiaro come la voce padre */
#primary-navigation ul li.current-menu-item > a {
    background-color: #abc5e2;
    background-color: #D9D2BF ; /* leggermente + scuro */
    color: #006699 !important;
    color: #1A4288 !important;
	color: #5a8cc1 !important;
	color: rgb(90,139,193) !important;
	color: #EFEFEF !important;
}

/* Separatori speciali nel menu */
#primary-navigation li.menu-separator a {
    color: #aaaaaa;
    font-size: 9px;
    letter-spacing: 0.1em;
    cursor: default;
    font-style: normal;
}

#primary-navigation li.menu-separator a:hover {
    background-color: #f4f2ec;
    color: #aaaaaa;
    text-decoration: none;
}

/* =====================================================
   COLONNA CENTRALE — Contenuto
   ===================================================== */

#content-area {
    display: table-cell;
    vertical-align: top;
    background-color: #ffffff;
    padding: 20px 25px 30px 20px;
    width: auto;
}

/* Logo / intestazione pagina */
#site-header-logo {
    display: flex;
    align-items: flex-start;
    margin-bottom: 18px;
}

#site-header-logo .site-logo-img {
    width: 60px;
    height: 60px;
    margin-right: 0;
    flex-shrink: 0;
}

#site-header-logo .site-logo-img img {
    width: 60px;
    height: 60px;
}

/* Tipografia contenuto */
.entry-content h1,
.entry-content h2,
.entry-content h3 {
    font-family: "Times New Roman", Times, serif;
    color: #333333;
    margin-bottom: 12px;
    margin-top: 16px;
}

.entry-content h1 { font-size: 18px; }
.entry-content h2 { font-size: 16px; }
.entry-content h3 { font-size: 14px; }

.entry-content p {
    margin-bottom: 12px;
    text-align: justify;
    line-height: 1.6;
	font-sixe: 18pt;
}

.entry-content p:first-child::first-letter {
    /* Prima lettera grande — omessa per compatibilità con il sito originale */
}

.entry-content em,
.entry-content i {
    font-style: italic;
}

.entry-content strong,
.entry-content b {
    font-weight: bold;
}

/* Divisore ornamentale */
.ornament-divider {
    text-align: center;
    margin: 24px auto;
    max-width: 200px;
    display: block;
}

.ornament-divider img {
    width: 160px;
    opacity: 0.7;
}

/* Galleria immagini nella pagina */
.entry-content .gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0;
}

.entry-content .gallery img {
    border: 1px solid #cccccc;
    padding: 2px;
}

/* =====================================================
   COLONNA DESTRA — Immagini correlate
   ===================================================== */

#sidebar-right {
    display: table-cell;
    width: 350px;
    vertical-align: top;
    background-color: #ebe8df;
    padding: 0;
	padding-right: 30px;
	padding-left: 1px;
	padding-right: 1px;
    border-left: 1px solid #ddddd0;
}

#sidebar-right-inner {
    padding-left: 1px;
    padding-right: 1px;
    padding-bottom: 1px;
}

/* Ogni thumbnail nella colonna destra */
.right-sidebar-image {
    display: block;
    width: 100%;
    margin-bottom: 3px;
    overflow: hidden;
    background-color: #333;
    border: 1px solid #cccccc; 
}

.right-sidebar-image img {
    display: block;
    width: 100%;
    height: 120px;
    object-fit: cover;
    object-position: center;
    filter: grayscale(10%) sepia(10%);
    transition: filter 0.2s;
}

.right-sidebar-image:hover img {
    filter: none;
}

.right-sidebar-image a {
    display: block;
}

/* =====================================================
   FOOTER
   ===================================================== */

#site-footer {
    background-color: #bfc0dd;
    border-top: 1px solid #aaaacc;
    text-align: center;
    padding: 6px 10px;
    font-size: 11px;
    color: #555555;
/*    font-family: Arial, Helvetica, sans-serif; */
    clear: both;
}

#site-footer a {
    color: #006699;
}

/* =====================================================
   BREADCRUMB
   ===================================================== */

#breadcrumb {
    font-size: 11px;
/*    font-family: Arial, Helvetica, sans-serif; */
    padding: 0 0 10px 0;
    color: #777777;
}

#breadcrumb a {
    color: #006699;
}

#breadcrumb span.sep {
    margin: 0 4px;
    color: #aaaaaa;
}

/* =====================================================
   ARCHIVIO / LISTA POST
   ===================================================== */

.archive-entry {
    border-bottom: 1px solid #eeeeee;
    padding: 12px 0;
}

.archive-entry:last-child {
    border-bottom: none;
}

.archive-entry .archive-entry-title {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 4px;
}

.archive-entry .archive-entry-title a {
    color: #006699;
}

.archive-entry .archive-entry-meta {
    font-size: 11px;
    color: #888888;
/*    font-family: Arial, Helvetica, sans-serif; */
    margin-bottom: 6px;
}

.archive-entry .archive-entry-excerpt {
    font-size: 12px;
    text-align: justify;
}

.archive-entry .archive-entry-thumb {
    float: left;
    margin: 0 12px 8px 0;
    border: 1px solid #cccccc;
    padding: 2px;
}

/* =====================================================
   SINGLE POST / PAGE
   ===================================================== */

.single-post-header,
.page-header {
    margin-bottom: 16px;
    border-bottom: 1px solid #dddddd;
    padding-bottom: 10px;
}

.single-post-header h1,
.page-header h1 {
    font-size: 18px;
/*    font-family: "Times New Roman", Times, serif; */
}

.single-post-meta {
    font-size: 11px;
    color: #888888;
/*    font-family: Arial, Helvetica, sans-serif; */ 
    margin-top: 4px;
}

/* =====================================================
   SEARCH FORM
   ===================================================== */

.search-form {
    margin: 10px 0;
}

.search-form input[type="text"] {
    width: 120px;
    padding: 3px 5px;
    border: 1px solid #cccccc;
/*    font-family: Arial, Helvetica, sans-serif; */
    font-size: 11px;
    background-color: #ffffff;
}

.search-form input[type="submit"] {
    padding: 3px 8px;
    background-color: #ebe8df;
    border: 1px solid #cccccc;
/*     font-family: Arial, Helvetica, sans-serif; */
    font-size: 11px;
    cursor: pointer;
}

.search-form input[type="submit"]:hover {
    background-color: #dddad0;
}

/* =====================================================
   TABELLE NEL CONTENUTO — rimuove bordo user agent
   ===================================================== */

.entry-content table,
.entry-content table td,
.entry-content table th {
    border: none;
    border-collapse: collapse;
}

/* =====================================================
   PAGINATION
   ===================================================== */

.pagination {
    margin: 20px 0;
    text-align: center;
/*    font-family: Arial, Helvetica, sans-serif; */
    font-size: 12px;
}

.pagination a,
.pagination span {
    display: inline-block;
    padding: 3px 8px;
    margin: 0 2px;
    border: 1px solid #cccccc;
    color: #006699;
    background-color: #f4f2ec;
}

.pagination span.current {
    background-color: #bfc0dd;
    color: #333333;
    font-weight: bold;
}

.pagination a:hover {
    background-color: #e0ddd5;
    text-decoration: none;
}

/* =====================================================
   WIDGET AREA (in sidebar)
   ===================================================== */

.widget {
    margin-bottom: 0;
}

.widget-title {
/*    font-family: Arial, Helvetica, sans-serif; */
    font-size: 10px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 5px 8px;
    background-color: #e0ddd5;
    border-bottom: 1px solid #cccccc;
    color: #555555;
}

/* =====================================================
   RESPONSIVE — ridotto ma funzionale
   ===================================================== */

@media screen and (max-width: 1220px) {
    #page-wrapper {
        width: 100%;
        min-width: 320px;
    }
}

@media screen and (max-width: 900px) {
    #main-layout {
        display: block;
    }

    #sidebar-left,
    #content-area,
    #sidebar-right {
        display: block;
        width: 100%;
    }

    #sidebar-left {
        border-right: none;
        border-bottom: 1px solid #ddddd0;
    }

    #primary-navigation li {
        display: inline-block;
        border-bottom: none;
        border-right: 1px solid #ddddd0;
    }

    #sidebar-right {
        border-left: none;
        border-top: 1px solid #ddddd0;
    }

    #sidebar-right-inner {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        padding: 8px;
    }

    .right-sidebar-image {
        width: calc(33% - 4px);
    }
}




/* Splash page */
.splash-body-bg {
    background: #bfc0dd;
}

.splash-wrapper {
    width: 100%;
    max-width: 100%;
    padding: 80px 20px;
    text-align: center;
}

.splash-content {
    background: #fff;
    padding: 60px;
    max-width: 900px;
    margin: 0 auto;
    border-radius: 8px;
}

.splash-title {
    font-family: "Times New Roman", serif;
    font-size: 42px;
    margin-bottom: 25px;
}




/* Sidebar sinistra e destra */
.sidebar-left, .sidebar-right {
    display: flex;
    flex-direction: column;
}

/* Contenuto centrale */
.main-content, .content-area {
    flex: 2; /* Più largo delle sidebar */
 
}












/* Riallinea il pulsante nella splash */
.bns-hero .bns-left {
  align-items: flex-start;       /* imposta base allineamento */
}

.bns-hero .bns-cta {
  margin-top: -20px;             /* alza il pulsante */
  margin-left: 80px;             /* sposta leggermente verso il centro */
}

.bns-hero .bns-meta {
  white-space: nowrap;     /* sempre su una riga */
  line-height: 1.2;        /* leggermente più alto, più elegante */
}

.bns-hero .bns-cta {
  background: rgba(0, 0, 0, 0.4) !important;  /* nero 30% */
  color: #1C1710 !important;       /* testo scuro, più leggibile */
  backdrop-filter: blur(2px);      /* OPTIONAL: effetto vetro vintage */
}

/* Hover coerente */
.bns-hero .bns-cta:hover {
  background: rgba(200, 96, 10, 1) !important;  /* arancione trasparente */
  color: #F2EBD9 !important;
}



/* Prima riga: “Il Boxer” */
.bns-hero .bns-line1 {
  display: block;
  font-size: 82px;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 700;
  font-style: italic;
  line-height: 0.9;
  color: #1C1710;          /* colore base (nero caldo) */
  letter-spacing: -2px;
  white-space: nowrap;
}

/* Colore arancione per “Boxer” */
.bns-hero .bns-orange {
  font-size: 82px;
  color: #C8600A;          /* arancione originale */
}

/* Seconda riga: “nella storia” */
.bns-hero .bns-line2 {
  display: block;
  font-size: 50px;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 700;
  line-height: 1.0;
  color: #1C1710;
  letter-spacing: -1px;
  margin-top: 6px;
  white-space: nowrap;
}

/* Contenitore delle due righe */
.bns-hero .bns-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;    /* allinea tutto a sinistra */
}

/* Rende "Il Boxer" una riga con larghezza naturale */
.bns-hero .bns-line1 {
  display: inline-block;      /* fondamentale */
  width: fit-content;
}

/* "nella storia" idem */
.bns-hero .bns-line2 {
  display: inline-block;
  width: fit-content;
}



/* Linea decorativa sotto “Il Boxer” */
.bns-hero .bns-rule {
  height: 3px !important;
  width: auto !important;
  max-width: fit-content !important;
  display: block !important;

  background: linear-gradient(
    to right,
    #C8600A 0px,
    #C8600A 60px,
    #C8600A 60px,
    #C8600A 66px,
    #C8A870 66px,
    #C8A870 94px,
    transparent 94px
  ) !important;

  margin: 26px 0 !important;
}


.r1 { flex: 0 0 56px; height: 1.5px; background: #C8600A; }
.rd { width: 6px; height: 6px; background: #C8600A; transform: rotate(45deg); flex-shrink: 0; }
.r2 { flex: 0 0 28px; height: 0.5px; background: #C8A870; }