/* La cornice di tutte le pagine dello studio (10 novembre 2026): testata e
   piede nella pelle della home. La caricano base.html e base-prodotto.html,
   cosi' ConfDesk e Novita' hanno la stessa testata delle altre pagine.
   Non dipende da sito.css ne' da stile.css: porta con se' colori, caratteri e
   larghezza, e va caricata DOPO il foglio della pagina. */

.testata,.piede{
  --k-navy:#0B2540; --k-crema:#F8F1E7; --k-ocra:#A8762A; --k-ocra-navy:#C9954A;
  --k-ocra-scuro:#7A5318; --k-chiaro:#DCE3EA;
  --k-titoli:"League Gothic",Impact,"Arial Narrow",sans-serif;
}
.testata>.wrap,.piede>.wrap{width:min(1360px,calc(100vw - 80px));max-width:none;margin:0 auto;padding:0}

/* ---- testata ---- */
.testata{position:relative;z-index:10;background:var(--k-crema)}
.testata-wrap{position:relative;display:flex;align-items:center;justify-content:space-between;height:96px}
.marchio{display:flex;gap:12px;align-items:center;font:400 34px/1 var(--k-titoli);letter-spacing:.01em;color:var(--k-navy);text-decoration:none}
.marchio img{display:block;width:38px;height:38px}
.marchio span,.menu a{white-space:nowrap}
.menu{display:flex;gap:28px;align-items:center}
.menu a{padding:13px 0;font:500 13px/1.2 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--k-navy);text-decoration:none}
.menu a:not(.pill):hover{color:var(--k-ocra-scuro)}
.menu a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--k-ocra)}
.menu a.pill{padding:13px 22px;background:var(--k-navy);color:var(--k-crema)}
.menu-apri{display:none}
.burger{display:none;width:44px;height:44px;flex-direction:column;justify-content:center;align-items:center;gap:6px;cursor:pointer;color:var(--k-navy)}
.burger i{display:block;width:24px;height:2px;background:currentColor}

/* ---- piede ---- */
.piede{padding:44px 0;background:var(--k-navy);color:var(--k-chiaro);font:14px/1.55 Inter,system-ui,sans-serif}
.piede-wrap{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.piede p{margin:8px 0 0}
.piede a{color:var(--k-crema);text-decoration:none}
.piede a:hover{color:#fff}
.piede .marchio{font-size:30px;color:#fff}
.piede-destra{text-align:right}

@media (max-width:1100px){
  .menu{gap:18px}
  .menu a{font-size:12px;letter-spacing:.1em}
  .menu a.pill{padding:13px 14px}
}
@media (max-width:760px){
  .testata>.wrap,.piede>.wrap{width:calc(100vw - 32px)}
  .testata-wrap{height:68px}
  .marchio{font-size:28px}
  .marchio img{width:30px;height:30px}
  .burger{display:flex}
  .menu{display:none;position:absolute;top:68px;left:0;right:0;z-index:20;flex-direction:column;align-items:stretch;gap:0;padding:8px 16px 18px;background:var(--k-navy)}
  .menu a{padding:14px 0;color:var(--k-crema);border-bottom:1px solid rgba(255,255,255,.12)}
  .menu a.pill{background:none;padding:14px 0;color:var(--k-ocra-navy)}
  .menu-apri:checked ~ .menu{display:flex}
  .piede-destra{text-align:left}
}
@media print{.testata,.piede{display:none!important}}