/* Components — Warm editorial */

/* ── Buttons (rectangular, slight radius) ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.85rem 1.5rem;
  font-family:var(--font-sans);
  font-size:.9rem;font-weight:500;
  letter-spacing:.01em;
  border:1px solid var(--ink);
  border-radius:6px;
  background:var(--ink);color:var(--bg);
  transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease);
  cursor:pointer;white-space:nowrap;
}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--bg);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn--ghost:hover{background:transparent;color:var(--accent);border-color:var(--accent)}
.btn--secondary{background:var(--soft);color:var(--ink);border-color:var(--line)}
.btn--secondary:hover{background:var(--panel);border-color:var(--ink);color:var(--ink)}
.btn--light{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.btn--light:hover{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.btn--outline-light{background:transparent;color:var(--bg);border-color:rgba(247,245,240,.4)}
.btn--outline-light:hover{border-color:var(--bg);background:transparent;color:var(--bg)}
.btn--dark{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn--dark:hover{background:var(--accent);border-color:var(--accent)}
.btn--navy{background:var(--navy);color:var(--bg);border-color:var(--navy)}
.btn--navy:hover{background:var(--navy-hover);border-color:var(--navy-hover);color:var(--bg)}
.section--dark .btn--navy{background:var(--navy);color:var(--bg);border-color:var(--navy)}
.section--dark .btn--navy:hover{background:var(--navy-hover);border-color:var(--navy-hover)}
.btn--sm{padding:.6rem 1.1rem;font-size:.8125rem}
.btn--lg{padding:1rem 1.9rem;font-size:.95rem}
.btn--full{width:100%}
.btn svg{width:16px;height:16px;stroke-width:1.75}
.btn--arrow::after{content:"→";font-size:1em;transition:transform var(--dur-fast) var(--ease);margin-left:.15rem}
.btn--arrow:hover::after{transform:translateX(3px)}

.section--dark .btn{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.section--dark .btn:hover{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.section--dark .btn--ghost{background:transparent;color:var(--bg);border-color:rgba(247,245,240,.3)}
.section--dark .btn--ghost:hover{color:var(--accent);border-color:var(--accent);background:transparent}

/* ── Nav — thin hairline ── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:80;
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--sp-3);
  background:rgba(247,245,240,.88);
  backdrop-filter:saturate(180%) blur(16px);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid transparent;
  color:var(--ink);
  transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);
}
.nav.scrolled{border-bottom-color:var(--line)}
body.has-video-hero .nav:not(.scrolled){
  background:transparent;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  color:var(--bg);
}
body.has-video-hero .nav:not(.scrolled) .nav__brand em{opacity:.85}
.nav__brand{
  display:flex;align-items:center;gap:.6rem;
  font-family:var(--font-display);
  font-size:1.25rem;font-weight:400;
  letter-spacing:var(--tr-tight);
  color:inherit;
}
.nav__brand em{font-style:italic;font-weight:400;opacity:.85}
.nav__brand img{width:24px;height:24px;object-fit:cover;border-radius:50%}
.nav__links{display:none;gap:2.25rem;font-size:.8125rem;font-weight:500;color:inherit;letter-spacing:.02em}
.nav__links a{padding:.25rem 0;opacity:.92;transition:opacity var(--dur-fast),color var(--dur-fast);position:relative}
/* quando si scorre (barra chiara): voci ben marcate e scure, sempre leggibili */
.nav.scrolled .nav__links a{opacity:1;color:var(--ink);font-weight:600}
.nav.scrolled .nav__brand{font-weight:500}
.nav__links a::after{content:"";position:absolute;left:0;right:auto;bottom:-2px;width:0;height:1px;background:currentColor;transition:width var(--dur-fast) var(--ease)}
.nav__links a:hover{opacity:1}
.nav__links a:hover::after{width:100%}
body.has-video-hero .nav:not(.scrolled) .nav__links{color:var(--bg)}
body.has-video-hero .nav:not(.scrolled) .burger span{background:var(--bg)}
body.has-video-hero .nav:not(.scrolled) .nav__brand img{filter:brightness(0) invert(1);transition:filter var(--dur-fast) var(--ease)}
.nav__brand img{transition:filter var(--dur-fast) var(--ease)}
.nav__cta{
  display:none;
  font-size:.8125rem;font-weight:500;letter-spacing:.02em;
  color:var(--bg);background:var(--ink);
  padding:.55rem 1.1rem;border-radius:6px;
  border:1px solid var(--ink);
  transition:background var(--dur-fast),border-color var(--dur-fast),color var(--dur-fast);
}
.nav__cta:hover{background:var(--accent);border-color:var(--accent)}
body.has-video-hero .nav:not(.scrolled) .nav__cta{background:var(--accent);border-color:var(--accent);color:var(--bg)}
body.has-video-hero .nav:not(.scrolled) .nav__cta:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
@media (min-width:960px){
  .nav{padding:0 var(--sp-4)}
  .nav__links{display:flex}
  .nav__cta{display:inline-flex}
}

.burger{
  width:32px;height:32px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;
}
.burger span{display:block;width:20px;height:1px;background:var(--ink);transition:transform var(--dur-fast) var(--ease),opacity var(--dur-fast)}
.burger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@media (min-width:960px){.burger{display:none}}

/* ── Drawer ── */
.drawer-ov{position:fixed;inset:0;background:rgba(20,17,15,.4);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity var(--dur-fast);z-index:90}
.drawer-ov.open{opacity:1;pointer-events:auto}
.drawer{
  position:fixed;top:0;right:0;height:100dvh;width:min(380px,85vw);z-index:95;
  background:var(--bg);
  transform:translateX(100%);transition:transform .4s var(--ease-out);
  padding:var(--sp-4);
  display:flex;flex-direction:column;gap:var(--sp-4);
  border-left:1px solid var(--line);
}
.drawer.open{transform:none}
.drawer__top{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--sp-3);border-bottom:1px solid var(--line)}
.drawer__brand{font-family:var(--font-display);font-size:1.5rem;font-weight:400;letter-spacing:var(--tr-tight)}
.drawer__brand em{font-style:italic;color:var(--ink-soft);font-weight:400}
.drawer__close{font-size:1.75rem;line-height:1;color:var(--muted);width:36px;height:36px;display:flex;align-items:center;justify-content:center;transition:color var(--dur-fast)}
.drawer__close:hover{color:var(--ink)}
.drawer__links{display:flex;flex-direction:column;gap:0;font-family:var(--font-display);font-size:1.5rem;font-weight:400;letter-spacing:var(--tr-tight)}
.drawer__links a{padding:.85rem 0;border-bottom:1px solid var(--line-soft);transition:color var(--dur-fast),padding-left var(--dur-fast)}
.drawer__links a:hover{color:var(--accent);padding-left:.5rem}
.drawer__foot{margin-top:auto;display:flex;flex-direction:column;gap:.4rem;font-size:.8125rem;color:var(--muted);letter-spacing:.02em}
.drawer__foot a{color:var(--ink);font-weight:500}
.drawer__foot a:hover{color:var(--accent)}

/* ── Mobile bottom bar ── */
.mobar{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  display:grid;grid-template-columns:1fr 1fr;
  background:var(--ink);
  color:var(--bg);
  border-top:1px solid rgba(247,245,240,.1);
}
.mobar a{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.9rem;font-size:.8125rem;font-weight:500;letter-spacing:.03em}
.mobar a + a{border-left:1px solid rgba(247,245,240,.12)}
.mobar a:hover{color:var(--accent)}
.mobar svg{width:16px;height:16px}
@media (min-width:960px){.mobar{display:none}}
body{padding-bottom:52px}
@media (min-width:960px){body{padding-bottom:0}}

/* ── Cards — hairline border, no heavy shadow ── */
.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:var(--sp-4);
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.card:hover{border-color:var(--ink);transform:translateY(-2px)}
.card--flat{background:var(--soft);border-color:transparent}
.card--flat:hover{background:var(--panel);border-color:var(--line)}
.card--dark{background:var(--ink);color:var(--bg);border-color:transparent}
.card--dark:hover{background:#1C1916;border-color:transparent}

/* Icon wrapper */
.icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;
  border-radius:var(--radius);
  background:transparent;
  border:1px solid var(--line);
  color:var(--ink);
  margin-bottom:1.25rem;
  transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease);
}
.icon svg{width:20px;height:20px;stroke-width:1.5;fill:none;stroke:currentColor}
.card:hover .icon{border-color:var(--accent);color:var(--accent)}
.icon--lg{width:52px;height:52px}
.icon--lg svg{width:24px;height:24px}
.icon--dark{background:transparent;border-color:rgba(247,245,240,.2);color:var(--bg)}

/* ── Form controls ── */
.field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.25rem}
.field label{font-size:.75rem;color:var(--muted);font-weight:500;letter-spacing:var(--tr-eye);text-transform:uppercase}
.field input,.field select,.field textarea{
  width:100%;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--line-strong);
  border-radius:0;
  padding:.7rem 0;
  font-size:1rem;
  color:var(--ink);
  transition:border-color var(--dur-fast) var(--ease);
}
.field input:hover,.field select:hover,.field textarea:hover{border-bottom-color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;
  border-bottom-color:var(--accent);
}
.field textarea{min-height:100px;resize:vertical}
.field--row{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:1.25rem}
.field--row > .field{margin-bottom:0}
.section--dark .field label{color:#B8B0A6}
.section--dark .field input,.section--dark .field select,.section--dark .field textarea{background:transparent;color:var(--bg);border-bottom-color:rgba(247,245,240,.25)}
.section--dark .field input:hover,.section--dark .field select:hover,.section--dark .field textarea:hover{border-bottom-color:rgba(247,245,240,.55)}
.section--dark .field input:focus,.section--dark .field select:focus,.section--dark .field textarea:focus{border-bottom-color:var(--accent)}
.section--dark .field input::placeholder,.section--dark .field textarea::placeholder{color:rgba(247,245,240,.3)}

.privacy{display:flex;gap:.65rem;align-items:flex-start;font-size:.8125rem;color:var(--muted);margin-bottom:1rem;line-height:1.5}
.privacy input{margin-top:.2rem;accent-color:var(--accent)}
.privacy a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.section--dark .privacy{color:#B8B0A6}
.section--dark .privacy a{color:var(--accent)}

/* ── Tabs ── */
.tabs{display:flex;gap:0;margin-bottom:var(--sp-4);flex-wrap:wrap;border-bottom:1px solid var(--line)}
.tabs button{
  padding:.75rem 1.25rem .85rem;
  font-family:var(--font-sans);
  font-size:.8125rem;font-weight:500;
  letter-spacing:var(--tr-eye);text-transform:uppercase;
  color:var(--muted);
  border-bottom:1px solid transparent;
  margin-bottom:-1px;
  transition:color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease);
}
.tabs button:hover{color:var(--ink)}
.tabs button.active{color:var(--ink);border-bottom-color:var(--accent)}
.section--dark .tabs{border-bottom-color:rgba(247,245,240,.15)}
.section--dark .tabs button{color:#8A8178}
.section--dark .tabs button:hover{color:var(--bg)}
.section--dark .tabs button.active{color:var(--bg);border-bottom-color:var(--accent);background:transparent}

.panel{display:none}
.panel.active{display:block;animation:fadeUp .4s var(--ease-out)}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ── Footer ── */
.footer{background:var(--navy);color:rgba(247,245,240,.7);padding:var(--sp-6) 0 var(--sp-3);font-size:.8125rem;line-height:1.6;border-top:0;position:relative;overflow:hidden}
.footer::before{content:"";position:absolute;inset:auto -10% -40% auto;width:60%;aspect-ratio:1;background:radial-gradient(circle,rgba(143,179,230,.08),transparent 60%);pointer-events:none}
.footer > .container{position:relative;z-index:1}
.footer__cta{
  display:grid;grid-template-columns:1fr;gap:var(--sp-4);align-items:center;
  padding-bottom:var(--sp-5);margin-bottom:var(--sp-5);
  border-bottom:1px solid rgba(247,245,240,.15);
}
@media (min-width:768px){.footer__cta{grid-template-columns:1.4fr auto;gap:var(--sp-5)}}
.footer__cta-t{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.875rem,3.8vw,3rem);line-height:1.05;letter-spacing:var(--tr-tight);
  color:var(--bg);margin:.75rem 0 .75rem;
}
.footer__cta-t em{font-style:italic;color:rgba(143,179,230,.85)}
.footer__cta-d{font-family:var(--font-sans);color:rgba(247,245,240,.72);font-size:1rem;line-height:1.55;margin:0;max-width:44ch}
.footer__cta-btns{display:flex;flex-wrap:wrap;gap:.75rem}
.btn--navy-invert{background:var(--bg);color:var(--navy);border:1px solid var(--bg)}
.btn--navy-invert:hover{background:rgba(247,245,240,.92);color:var(--navy-hover);border-color:rgba(247,245,240,.92)}
.btn--ghost-invert{background:transparent;color:var(--bg);border:1px solid rgba(247,245,240,.3)}
.btn--ghost-invert:hover{border-color:var(--bg);background:rgba(247,245,240,.08)}
.footer__status{display:flex;flex-wrap:wrap;gap:1.25rem;align-items:center;padding-bottom:var(--sp-3);border-bottom:1px solid rgba(247,245,240,.15);margin-bottom:var(--sp-5);color:rgba(247,245,240,.85);font-size:.8125rem;letter-spacing:.02em}
.footer__status .dot{display:inline-flex;align-items:center;gap:.5rem}
.footer__status .dot i{width:6px;height:6px;border-radius:50%;background:rgba(247,245,240,.5)}
.footer__status .dot.open i{background:#7dd3a0}
.footer__status .dot.closed i{background:#ef8a85}
.footer__grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:var(--sp-4);margin-bottom:var(--sp-5)}
.footer__grid h5{font-family:var(--font-sans);font-size:.6875rem;font-weight:600;color:var(--bg);margin-bottom:1.25rem;letter-spacing:var(--tr-eye);text-transform:uppercase}
.footer__grid a{display:block;padding:.3rem 0;color:rgba(247,245,240,.72);transition:color var(--dur-fast)}
.footer__grid a:hover{color:var(--bg)}
.footer__brand{font-family:var(--font-display);font-size:1.75rem;font-weight:400;color:var(--bg);margin-bottom:.75rem;letter-spacing:var(--tr-tight)}
.footer__brand em{font-style:italic;font-weight:400;color:rgba(247,245,240,.72)}
.footer__desc{max-width:32ch;line-height:1.55;color:rgba(247,245,240,.65)}
.footer__bottom{padding-top:var(--sp-3);border-top:1px solid rgba(247,245,240,.15);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;color:rgba(247,245,240,.55);font-size:.75rem;letter-spacing:.02em}
@media (max-width:768px){.footer__grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.footer__grid{grid-template-columns:1fr}}

/* ── GDPR banner ── */
.gdpr{
  position:fixed;left:1rem;right:1rem;bottom:68px;z-index:85;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:1.25rem;
  display:none;gap:1rem;flex-direction:column;
  max-width:480px;margin-left:auto;
  box-shadow:var(--sh-3);
}
.gdpr.show{display:flex;animation:fadeUp .3s var(--ease-out)}
.gdpr p{font-size:.8125rem;line-height:1.55;color:var(--ink-soft);margin:0}
.gdpr p a{color:var(--accent);text-decoration:underline}
.gdpr__btns{display:flex;gap:.5rem}
.gdpr__btns button{padding:.6rem 1.1rem;font-size:.8125rem;font-weight:500;border-radius:6px;border:1px solid var(--ink);letter-spacing:.02em;transition:all var(--dur-fast)}
.gdpr__btns button:first-child{background:var(--ink);color:var(--bg)}
.gdpr__btns button:first-child:hover{background:var(--accent);border-color:var(--accent)}
.gdpr__btns button:last-child{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.gdpr__btns button:last-child:hover{border-color:var(--ink)}
@media (min-width:960px){.gdpr{bottom:1rem}}
/* Telefoni: banner cookie a tutta larghezza, mai spinto fuori schermo */
@media (max-width:560px){
  .gdpr{left:.75rem;right:.75rem;max-width:none;margin-left:0;padding:1rem}
}

/* ── FAQ accordion — borderless editorial ── */
.faq-item{border-bottom:1px solid var(--line);transition:border-color var(--dur) var(--ease)}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.75rem 0;cursor:pointer;font-family:var(--font-display);font-size:1.375rem;font-weight:400;color:var(--ink);transition:color var(--dur-fast);letter-spacing:var(--tr-tight);line-height:1.3}
.faq-q:hover{color:var(--accent)}
.faq-q i{font-style:normal;font-size:1.25rem;color:var(--muted);transition:transform var(--dur) var(--ease),color var(--dur-fast);width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:var(--font-sans);font-weight:300}
.faq-item.open .faq-q i{transform:rotate(45deg);color:var(--accent)}
.faq-item.open{border-color:var(--ink)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease-out)}
.faq-a-inner{padding:0 0 1.75rem;color:var(--ink-soft);font-size:1rem;line-height:1.65;max-width:62ch}
.faq-a-inner strong{color:var(--ink);font-weight:600}

/* ── Floating logo — scroll companion ── */
.floating-logo{
  position:fixed;
  bottom:2rem;right:2rem;
  width:64px;height:64px;
  z-index:60;
  pointer-events:none;
  opacity:0;
  transform:translateY(20px) scale(.85);
  transition:opacity .5s var(--ease-out),transform .5s var(--ease-out);
}
.floating-logo.visible{opacity:1;transform:translateY(0) scale(1)}
.floating-logo img{
  position:absolute;inset:12px;
  width:calc(100% - 24px);height:calc(100% - 24px);
  object-fit:contain;border-radius:50%;
  box-shadow:0 4px 16px rgba(14,42,74,.2);
  background:var(--bg);
  padding:4px;
  will-change:transform;
}
.floating-logo__ring{
  position:absolute;inset:0;width:100%;height:100%;
  transform:rotate(-90deg);
}
.floating-logo__track{
  fill:none;stroke:rgba(14,42,74,.12);stroke-width:2;
}
.floating-logo__prog{
  fill:none;stroke:var(--navy);stroke-width:2;
  stroke-linecap:round;
  stroke-dasharray:289;
  stroke-dashoffset:289;
  transition:stroke-dashoffset .1s linear;
}
@media (max-width:768px){
  /* su mobile il logo flottante copriva i testi: lo nascondiamo */
  .floating-logo{display:none}
}
@media (prefers-reduced-motion:reduce){
  .floating-logo{transition:opacity .2s}
  .floating-logo img{animation:none}
}
