/*
 * Tattà® OS — stile condiviso del sito pubblico (restyling 2026).
 * Token, intestazione, footer, pulsanti e link: usati da home, cataloghi, pagine app,
 * strumenti, programmi e registrazione. Nessuna regola sugli elementi nudi (h1, p, a…)
 * fuori da .tt-header / .tt-footer / .tt-page, per non toccare il contenuto delle pagine.
 */
/* ── Token (da 03-DESIGN-TOKENS.css, v1 08/10/2026) ── */
:root{
  --tt-canvas:#f7f8f3; --tt-surface:#fff; --tt-ink:#14291f; --tt-muted:#526158;
  --tt-action:#184a35; --tt-action-hover:#103b29; --tt-on-action:#fff;
  --tt-lime:#d7f56f; --tt-sage:#e9efdf; --tt-border:#dce3db; --tt-focus:#184a35;
  --tt-font-sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --tt-font-accent:"Instrument Serif",Georgia,"Times New Roman",serif;
  --tt-text-body:clamp(1rem,.94rem + .25vw,1.125rem);
  --tt-text-lead:clamp(1.125rem,1rem + .35vw,1.375rem);
  --tt-text-h1:clamp(2.5rem,1.1rem + 3.7vw,5.5rem);
  --tt-text-h2:clamp(1.875rem,1.35rem + 2vw,3.25rem);
  --tt-gutter:clamp(1rem,4vw,4rem); --tt-content-max:87.5rem;
  --tt-radius-control:.75rem; --tt-radius-card:1.25rem; --tt-radius-photo:2rem; --tt-radius-pill:999px;
  --tt-shadow-overlay:0 12px 32px rgb(20 41 31 / 10%);
  --tt-duration-fast:180ms; --tt-duration-panel:220ms; --tt-duration-enter:550ms; --tt-duration-stagger:80ms;
  --tt-ease-enter:cubic-bezier(.22,1,.36,1); --tt-ease-ui:cubic-bezier(.2,0,0,1);
  --tt-reveal-distance:16px; --tt-anchor-offset:6rem; --tt-header-h:76px;
}

/* ── Base delle pagine nel nuovo stile (body.tt-page) ── */
body.tt-page{margin:0;background:var(--tt-canvas);color:var(--tt-ink);font-family:var(--tt-font-sans);-webkit-font-smoothing:antialiased}
/* Intestazione e footer isolati dagli stili delle singole pagine */
.tt-header,.tt-footer{font-family:var(--tt-font-sans);line-height:1.6;color:var(--tt-ink);-webkit-font-smoothing:antialiased;text-align:left}
.tt-header *,.tt-header *::before,.tt-header *::after,.tt-footer *,.tt-footer *::before,.tt-footer *::after{box-sizing:border-box}
.tt-header img,.tt-footer img{max-width:100%;height:auto;display:block}
.tt-header a:not(.tt-btn),.tt-footer a:not(.tt-btn){color:inherit}
.tt-header .tt-nav{position:static;background:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:auto;padding:0}
.tt-footer{border:0}
.tt-footer h2{margin:0 0 .9rem;line-height:1.2}
.tt-footer p{margin:0}
.tt-container{width:min(calc(100% - var(--tt-gutter)*2),var(--tt-content-max));margin-inline:auto}
.tt-section{padding-block:clamp(4rem,3rem + 4vw,7rem)}
.tt-section-anchor,[id]{scroll-margin-top:var(--tt-anchor-offset)}
.tt-eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tt-ink)}
.tt-eyebrow::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--tt-lime);box-shadow:8px 0 0 -2px #9fd85c}
.tt-eyebrow.no-dot::before{display:none}
.tt-h2{font-size:var(--tt-text-h2)}
.tt-lead{font-size:var(--tt-text-lead);color:var(--tt-muted);line-height:1.55}
.tt-accent{font-family:var(--tt-font-accent);font-style:italic;font-weight:400;letter-spacing:-.01em}
.tt-ico{flex-shrink:0;transition:transform var(--tt-duration-fast) var(--tt-ease-ui)}
.tt-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--tt-focus);outline-offset:4px;border-radius:6px}
.tt-on-dark :focus-visible{outline-color:var(--tt-lime)}
.tt-skip{position:absolute;left:1rem;top:-4rem;z-index:300;background:var(--tt-action);color:#fff;padding:.7rem 1rem;border-radius:var(--tt-radius-control);text-decoration:none;font-weight:700}
.tt-skip:focus{top:1rem}

/* Pulsanti */
.tt-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:48px;padding:.8rem 1.6rem;border-radius:var(--tt-radius-pill);font:inherit;font-weight:700;font-size:1rem;text-decoration:none;cursor:pointer;border:1.5px solid transparent;white-space:nowrap;
  transition:background-color var(--tt-duration-fast) var(--tt-ease-ui),box-shadow var(--tt-duration-fast) var(--tt-ease-ui),border-color var(--tt-duration-fast) var(--tt-ease-ui)}
.tt-btn--primary{background:var(--tt-action);color:var(--tt-on-action)}
.tt-btn--primary:hover{background:var(--tt-action-hover);box-shadow:0 8px 22px rgb(24 74 53 / 25%)}
.tt-btn--ghost{background:transparent;color:var(--tt-ink);border-color:var(--tt-ink)}
.tt-btn--ghost:hover{background:var(--tt-surface);box-shadow:0 6px 18px rgb(20 41 31 / 10%)}
.tt-btn--light{background:var(--tt-surface);color:var(--tt-ink);border-color:var(--tt-border)}
.tt-btn--light:hover{border-color:var(--tt-ink)}
.tt-btn--sm{min-height:44px;padding:.55rem 1.15rem;font-size:.92rem}
.tt-btn:hover .tt-ico,.tt-btn:focus-visible .tt-ico,.tt-link:hover .tt-ico,.tt-link:focus-visible .tt-ico{transform:translateX(3px)}
.tt-btn:hover .tt-ico[data-dir="giu"],.tt-btn:focus-visible .tt-ico[data-dir="giu"]{transform:translateY(3px)}
.tt-link{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:var(--tt-ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}

/* ── Header ───────────────────────────────────────────────────────────────── */
.tt-preview{background:var(--tt-lime);color:var(--tt-ink);text-align:center;font-size:.85rem;font-weight:700;padding:.45rem 1rem}
.tt-header{position:sticky;top:0;z-index:100;background:rgb(255 255 255 / 96%);border-bottom:1px solid var(--tt-border)}
@supports (backdrop-filter:blur(8px)){.tt-header{background:rgb(255 255 255 / 88%);backdrop-filter:blur(12px)}}
.tt-header__row{display:flex;align-items:center;gap:1.25rem;min-height:var(--tt-header-h)}
.tt-logo-link{flex-shrink:0;display:block;padding:6px 0;border-radius:8px}
.tt-logo{display:block;width:clamp(7rem,11vw,9.4rem);height:auto}
.tt-nav{display:none;align-items:center;gap:1.35rem;margin-inline:auto;white-space:nowrap}
.tt-nav a,.tt-nav__btn{font:inherit;font-size:.93rem;font-weight:600;color:var(--tt-muted);text-decoration:none;background:none;border:0;padding:.4rem 0;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem}
.tt-nav a:hover,.tt-nav__btn:hover,.tt-nav__btn[aria-expanded="true"]{color:var(--tt-ink)}
.tt-nav__prog{color:var(--tt-action)!important}
.tt-drop{position:relative}
.tt-drop__panel{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:.7rem;z-index:120}
.tt-drop__panel[hidden]{display:none}
.tt-drop__card{width:300px;white-space:normal;background:var(--tt-surface);border:1px solid var(--tt-border);border-radius:var(--tt-radius-card);padding:.4rem;box-shadow:var(--tt-shadow-overlay)}
.tt-drop__card a{display:flex;gap:.75rem;align-items:flex-start;padding:.7rem .75rem;border-radius:.8rem;color:var(--tt-ink)}
.tt-drop__card a:hover{background:var(--tt-sage)}
.tt-drop__card small{display:block;font-size:.8rem;font-weight:500;color:var(--tt-muted);line-height:1.45;margin-top:.15rem}
.tt-header__actions{display:flex;align-items:center;gap:.7rem;margin-left:auto}
.tt-header__actions select{background:var(--tt-surface)!important;border:1px solid var(--tt-border)!important;color:var(--tt-ink)!important;min-height:40px;font-family:inherit!important}
.tt-burger{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;border:1px solid var(--tt-border);background:var(--tt-surface);color:var(--tt-ink);cursor:pointer}
.tt-mobnav{border-top:1px solid var(--tt-border);background:var(--tt-surface)}
.tt-mobnav[hidden]{display:none}
.tt-mobnav ul{list-style:none;margin:0 auto;padding:.75rem 0 1.25rem;display:grid;gap:.15rem}
.tt-mobnav a:not(.tt-btn){display:flex;align-items:center;min-height:44px;padding:.35rem .25rem;text-decoration:none;font-weight:600;color:var(--tt-ink)}
.tt-mobnav__label{font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--tt-muted);padding:.6rem .25rem 0}
/* Menu orizzontale completo quando ci sta (lo script passa al pulsante se le voci non entrano) */
@media (min-width:1280px){
  .tt-header:not(.is-stretta) .tt-nav{display:flex}
  .tt-header:not(.is-stretta) .tt-burger{display:none}
  .tt-header:not(.is-stretta) .tt-mobnav{display:none}
}
/* telefono: logo + lingua + menu; «Inizia gratis» passa dentro il menu aperto */
.tt-mobnav__cta{display:none}
@media (max-width:560px){
  :root{--tt-header-h:64px}
  .tt-header__row{gap:.6rem}
  .tt-header__actions{gap:.45rem}
  .tt-header__actions select{max-width:4.4rem;padding:.3rem .25rem!important}
  .tt-header__actions .tt-btn{display:none}
  .tt-mobnav__cta{display:block;padding-top:.6rem}
  .tt-mobnav__cta .tt-btn{width:100%}
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
.tt-footer{background:var(--tt-sage);margin-top:clamp(4rem,6vw,6rem);padding-block:clamp(3rem,5vw,4.5rem) 2rem;font-size:.95rem}
.tt-footer__grid{display:grid;gap:2rem}
@media (min-width:640px){.tt-footer__grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.tt-footer__grid{grid-template-columns:1.4fr repeat(5,1fr)}}
.tt-footer h2{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--tt-muted);margin-bottom:.9rem}
.tt-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.15rem}
.tt-footer li a{display:inline-flex;min-height:36px;align-items:center;text-decoration:none;color:var(--tt-ink)}
.tt-footer li a:hover{text-decoration:underline;text-underline-offset:4px}
.tt-footer details summary{cursor:pointer;font-weight:700;min-height:36px;display:flex;align-items:center}
.tt-footer__brand p{color:var(--tt-muted);margin-top:.9rem;max-width:30ch}
.tt-footer__social{display:flex;gap:1rem;margin-top:1rem}
.tt-footer__social a{font-weight:700;text-decoration:none;color:var(--tt-ink);min-height:44px;display:inline-flex;align-items:center}
.tt-footer__base{border-top:1px solid #cdd8c6;margin-top:2.5rem;padding-top:1.4rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;color:var(--tt-muted);font-size:.85rem}


@media (prefers-reduced-motion:reduce){
  :root{--tt-duration-fast:0ms;--tt-duration-panel:0ms;--tt-duration-enter:0ms;--tt-reveal-distance:0px}
  .tt-header *,.tt-footer *,.tt-btn,.tt-ico{transition:none!important;animation:none!important}
}

/* ── Banner cookie (gdpr/cookie-banner.php) nello stile chiaro, solo sulle pagine tt-page ── */
body.tt-page #tatta-cookie-bar{background:var(--tt-surface);border-top:1px solid var(--tt-border);box-shadow:0 -10px 30px rgb(20 41 31 / 12%);font-family:var(--tt-font-sans);padding:1rem clamp(1rem,4vw,2.5rem);padding-right:3rem}
body.tt-page #tatta-cookie-bar .cb-text{color:var(--tt-muted);font-size:.9rem}
body.tt-page #tatta-cookie-bar .cb-text strong{color:var(--tt-ink)}
body.tt-page #tatta-cookie-bar .cb-text a{color:var(--tt-action);font-weight:700}
body.tt-page .cb-btn{min-height:44px;padding:.6rem 1.25rem;border-radius:999px;font-family:inherit;font-size:.9rem;font-weight:700}
body.tt-page .cb-btn-accept{background:var(--tt-action);color:#fff;border:1.5px solid var(--tt-action)}
body.tt-page .cb-btn-accept:hover{background:var(--tt-action-hover)}
body.tt-page .cb-btn-necessary{background:var(--tt-surface);color:var(--tt-ink);border:1.5px solid var(--tt-ink)}
body.tt-page .cb-btn-necessary:hover{background:var(--tt-sage);color:var(--tt-ink)}
body.tt-page .cb-btn-close{color:var(--tt-muted);min-width:44px;min-height:44px;top:.1rem;right:.1rem}
body.tt-page .cb-btn-close:hover{color:var(--tt-ink)}
body.tt-page .cb-btn-revoke{color:var(--tt-muted)}
body.tt-page .cb-btn-revoke:hover{color:var(--tt-ink)}
