/* ─────────────────────────────────────────────────────────────
   OL-IA — menu e footer del sito per le pagine demo.
   Contiene solo le regole della barra in alto, del menu mobile e
   del footer, estratte da /assets/app-*.css. Le variabili sono
   dichiarate SOLO sugli elementi del menu/footer, così non
   toccano i colori interni delle demo.
   ───────────────────────────────────────────────────────────── */

.homebar,
.olia-mm-btn,
.olia-mm-overlay,
.footer {
  --bg: #08090b;
  --platinum: #c7cdd4;
  --platinum-dim: #8b9099;
  --accent: #2f54e0;
  --accent-rgb: 47, 84, 224;
  --gold: #c9a227;
  --line: #c7cdd424;
  --white: #f3f5f7;
  --font-display: "Urbanist", system-ui, sans-serif;
  --font-body: "Manrope", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --ease: cubic-bezier(.19, 1, .22, 1);
  --pad-x: clamp(20px, 5vw, 80px);
  --maxw: 1400px;
  font-family: var(--font-body);
}
.homebar *, .olia-mm-overlay *, .footer * { box-sizing: border-box; }

/* spazio per la barra fissa */
body { padding-top: 76px; }
@media (max-width: 820px) { body { padding-top: 68px; } }

/* ── Bottone ── */
.homebar .btn, .olia-mm-overlay .btn { font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bg);background:var(--platinum);border:1px solid rgba(var(--accent-rgb),.85);box-shadow:0 6px 22px rgba(var(--accent-rgb),.2);transition:transform .4s var(--ease),background .4s var(--ease),box-shadow .4s var(--ease);border-radius:2px;align-items:center;gap:.6em;padding:.95em 1.6em;font-size:.8rem;font-weight:500;display:inline-flex;text-decoration:none;cursor:pointer }
.homebar .btn:hover, .olia-mm-overlay .btn:hover { background:var(--white);box-shadow:0 12px 32px rgba(var(--accent-rgb),.36);transform:translateY(-2px) }

/* ── Barra in alto ── */
.homebar{z-index:800;transition:background .4s var(--ease),border-color .4s var(--ease),backdrop-filter .4s var(--ease);border-bottom:1px solid #0000;position:fixed;top:0;left:0;right:0}
.homebar--solid{-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom-color:var(--line);background:#08090b8c}
.homebar--menu{z-index:3000}
.homebar__inner{max-width:var(--maxw);padding:.9rem var(--pad-x);grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;margin:0 auto;display:grid}
.homebar__brand{text-align:left;flex-direction:row;justify-self:start;align-items:center;gap:.6rem;line-height:1.1;display:flex;border:0;background:0 0;padding:0;cursor:pointer}
.homebar__logoimg{flex-shrink:0;width:auto;height:26px;display:block;max-width:none}
.homebar__nav{justify-self:center;align-items:center;gap:clamp(14px,2vw,32px);display:flex;background:#c7cdd414;-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border:1px solid rgba(199,205,212,.12);border-radius:999px;padding:.7rem clamp(20px,2.2vw,34px)}
.homebar__link{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;transition:color .3s var(--ease),opacity .3s var(--ease);font-size:.72rem;font-weight:500;text-decoration:none;white-space:nowrap;color:var(--white);opacity:.9}
.homebar__link:hover,.homebar__link--gold:hover,.homebar__link--white:hover{color:var(--white);opacity:1}
.homebar__cta{grid-column:3;justify-self:end;padding:.7em 1.2em;font-size:.72rem}

/* ── Menu mobile ── */
.olia-mm-btn{border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;background:#08090b8c;border-radius:8px;flex-direction:column;grid-column:3;justify-content:center;justify-self:end;align-items:center;gap:5px;width:44px;height:44px;padding:0;display:none}
.olia-mm-btn span{background:var(--white);width:22px;height:2px;transition:transform .25s var(--ease),opacity .2s var(--ease);border-radius:2px;display:block}
.olia-mm-btn.is-open span:first-child{transform:translateY(7px) rotate(45deg)}
.olia-mm-btn.is-open span:nth-child(2){opacity:0}
.olia-mm-btn.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.olia-mm-overlay{z-index:2900;background:var(--bg);background-image:radial-gradient(120% 90% at 50% 0%,rgba(var(--accent-rgb),.16) 0%,transparent 55%),radial-gradient(100% 100% at 50% 120%,#0d1016 0%,var(--bg) 60%);opacity:0;visibility:hidden;transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s;flex-direction:column;display:flex;position:fixed;inset:0;transform:scale(1.02)}
.olia-mm-overlay.is-open{opacity:1;visibility:visible;transform:scale(1)}
.olia-mm-nav{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:clamp(22px,4.4vh,40px);width:100%;margin:auto;padding:0 24px;display:flex}
.olia-mm-link{text-align:center;font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;opacity:.9;cursor:pointer;transition:color .25s var(--ease),opacity .25s var(--ease);background:0 0;border:none;font-size:clamp(1.5rem,7vw,2.2rem);text-decoration:none;color:var(--white)}
.olia-mm-link:hover{color:#fff;opacity:1}
.olia-mm-cta{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bg);background:var(--accent);box-shadow:0 8px 28px rgba(var(--accent-rgb),.4);border:0;border-radius:4px;margin-top:clamp(8px,2vh,18px);padding:.9em 1.8em;font-size:clamp(.95rem,4.4vw,1.15rem);text-decoration:none;cursor:pointer}
@media (max-width:820px){
  .olia-mm-btn{display:flex}
  .homebar .homebar__nav,.homebar .btn.homebar__cta{display:none}
  .homebar__inner{padding-block:.55rem}
  .homebar--solid{background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (prefers-reduced-motion:reduce){.olia-mm-overlay,.olia-mm-btn span{transition:none}}

/* ── Footer ── */
.footer{z-index:1;background:var(--bg);color:var(--platinum);border-top:1px solid var(--line);padding:clamp(48px,8vh,90px) var(--pad-x) clamp(32px,5vh,50px);position:relative;text-align:left}
.footer__inner{max-width:var(--maxw);grid-template-columns:1.5fr repeat(5,1fr);align-items:start;gap:clamp(16px,2.6vw,40px);margin:0 auto;display:grid}@media (max-width:1100px){.footer__inner{grid-template-columns:repeat(3,1fr);row-gap:28px}.footer__brand{grid-column:1/-1}}
.footer__logoimg{width:auto;height:40px;margin-bottom:.4rem;display:block;max-width:none}
.footer__col h4{font-family:var(--font-mono);letter-spacing:.18em;color:var(--accent);margin:0 0 .6rem;font-size:.72rem;font-weight:500;text-transform:uppercase}
.footer__link{color:inherit;opacity:.9;font:inherit;letter-spacing:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:none;transition:color .2s,opacity .2s}
.footer__link:hover{color:var(--white);opacity:1}
.footer__link--gold{color:var(--gold);opacity:1}
.footer__link--gold:hover{color:var(--white)}
.socials{align-items:center;gap:14px;margin-top:1rem;display:flex}
.socials__link{opacity:.9;line-height:0;transition:opacity .2s,transform .2s;display:inline-flex}
.socials__link:hover{opacity:1;transform:translateY(-2px)}
.footer__col p,.footer__contact p{color:var(--platinum-dim);font-size:.92rem;line-height:1.8;margin:0}
.footer__contact .mono{font-family:var(--font-mono);color:var(--accent)}
.footer__bottom{max-width:var(--maxw);border-top:1px solid var(--line);font-family:var(--font-mono);letter-spacing:.1em;color:var(--platinum-dim);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem 1.2rem;margin:clamp(32px,6vh,60px) auto 0;padding-top:1.4rem;font-size:.7rem;display:flex}
.footer__legal{flex-wrap:wrap;align-items:center;gap:.6rem 1.2rem;display:flex}
.footer__legal a{color:var(--platinum-dim);text-decoration:none;transition:color .2s}
.footer__legal a:hover{color:var(--accent)}
@media (max-width:820px){
  .footer__inner{grid-template-columns:1fr 1fr;row-gap:28px}
  .footer__brand{grid-column:1/-1}
}

/* ─────────────────────────────────────────────────────────────
   "Ruota il telefono" — solo su telefono e solo in verticale.
   Le demo hanno tabelle larghe (il foglio Excel, la fattura, il
   preventivo): in orizzontale si leggono davvero.
   ───────────────────────────────────────────────────────────── */
.ruota{display:none}

/* (hover:none) = solo dispositivi touch, così non compare
   restringendo la finestra sul computer */
@media (max-width:820px) and (orientation:portrait) and (hover:none){
  .ruota{
    --bg:#08090b; --white:#f3f5f7; --platinum:#c7cdd4; --platinum-dim:#8b9099;
    --accent:#2f54e0; --line:#c7cdd424;
    --font-body:"Manrope",system-ui,sans-serif;
    --font-mono:"JetBrains Mono",ui-monospace,monospace;
    position:fixed; inset:0; z-index:2500;
    display:flex; align-items:center; justify-content:center; padding:28px;
    background:rgba(8,9,11,.72);
    -webkit-backdrop-filter:blur(7px) saturate(120%);
    backdrop-filter:blur(7px) saturate(120%);
    font-family:var(--font-body); text-align:center;
  }
  .ruota.is-chiuso{display:none}
}
.ruota *{box-sizing:border-box}
.ruota__box{max-width:300px}
.ruota__icona{width:104px;height:104px;margin:0 auto 18px;display:block}
.ruota__arco{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round}
.ruota__punta{fill:var(--accent)}
.ruota__tel{
  fill:none;stroke:var(--white);stroke-width:3;stroke-linejoin:round;
  transform-box:fill-box;transform-origin:50% 50%;
  animation:olia-ruota 3.4s cubic-bezier(.65,0,.35,1) infinite;
}
.ruota__schermo{fill:rgba(199,205,212,.12);stroke:none}
.ruota__tasto{fill:var(--white);stroke:none}
@keyframes olia-ruota{
  0%,20%   {transform:rotate(0deg)}
  40%,75%  {transform:rotate(-90deg)}
  95%,100% {transform:rotate(0deg)}
}
.ruota__titolo{
  font-family:var(--font-display,"Urbanist",system-ui,sans-serif);
  font-size:1.35rem;font-weight:700;color:var(--white);margin:0 0 8px;line-height:1.2;
}
.ruota__testo{font-size:.95rem;line-height:1.5;color:var(--platinum);margin:0 0 22px}
.ruota__ok{
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--platinum-dim);background:0 0;border:1px solid var(--line);
  border-radius:999px;padding:.85em 1.6em;cursor:pointer;
}
.ruota__ok:hover,.ruota__ok:active{color:var(--white);border-color:rgba(47,84,224,.55)}
@media (prefers-reduced-motion:reduce){
  .ruota__tel{animation:none;transform:rotate(-90deg)}
}

/* ── In stampa menu, footer e avviso spariscono ── */
@media print{
  .homebar,.olia-mm-btn,.olia-mm-overlay,.footer,.ruota{display:none !important}
  body{padding-top:0 !important}
}
.footer__tagline{font-family:var(--font-mono);font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--platinum-dim);line-height:1.5;margin:.2rem 0 0;max-width:36ch}
.homebar__azioni{grid-column:3;justify-self:end;display:flex;align-items:center;gap:10px}.homebar__risorse{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-size:.72rem;font-weight:500;white-space:nowrap;color:#3ddc84;background:rgba(61,220,132,.08);border:1px solid rgba(61,220,132,.7);border-radius:2px;padding:.7em 1.2em;text-decoration:none;transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}.homebar__risorse:hover{background:rgba(61,220,132,.2);color:#7cf0ad;transform:translateY(-1px)}.olia-mm-link--verde{color:#3ddc84;opacity:1;border:1px solid rgba(61,220,132,.7);background:rgba(61,220,132,.08);border-radius:4px;padding:.45em 1em;font-size:clamp(1.1rem,5vw,1.5rem)}.olia-mm-link--verde:hover{color:#7cf0ad;background:rgba(61,220,132,.2)}.footer__link--verde{display:inline-block;color:#3ddc84;opacity:1;border:1px solid rgba(61,220,132,.7);background:rgba(61,220,132,.08);border-radius:2px;padding:.55em 1em;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;white-space:nowrap}.footer__link--verde:hover{color:#7cf0ad;background:rgba(61,220,132,.2)}.footer__col h4 .footer__link--verde{letter-spacing:.14em}
@media(max-width:820px){.homebar__azioni{display:flex;grid-column:2;justify-self:center;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s}.homebar__risorse{font-size:.6rem;letter-spacing:.1em;padding:.55em .85em}.homebar--solid .homebar__azioni,.homebar--menu .homebar__azioni{opacity:0;visibility:hidden;transform:translateY(-6px)}}@media(max-width:360px){.homebar__risorse{letter-spacing:.06em;padding:.5em .7em}}