/* =============================================================================
   AYXZA · site.css — Ledger bw-light + insegna cromatica di prodotto
   Revisione 2026.09. Usato dalla sola home (IT e EN); le pagine prodotto
   hanno CSS proprio inline.

   Il colore entra in un solo ruolo: identificare il prodotto nell'insegna e
   nella banda della sua scheda. Testo, tabelle, divisori restano monocromi.
   Le tinte arrivano da lib/data.php come variabile inline --hue.
   ============================================================================= */
:root{
  --paper:#ffffff; --paper-2:#f7f7f7;
  --line-weak:#e5e5e5; --line:#b8b8b8; --line-strong:#000000;
  --text-hi:#000000; --text:#1a1a1a; --text-lo:#555555; --text-xlo:#8a8a8a;
  --accent:#000000; --accent-bg:rgba(0,0,0,0.06);
  --pad-x:clamp(20px,4vw,64px); --rule-thin:1px; --rule-bold:2px;
  --font-display:"Cormorant Garamond",Georgia,serif;
  --font-sans:"Bricolage Grotesque",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
}
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html,body{background:var(--paper);color:var(--text);font-family:var(--font-sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{min-height:100vh}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--text-hi);outline-offset:2px}
::selection{background:var(--text-hi);color:var(--paper)}
.mono{font-family:var(--font-mono)}
[hidden]{display:none!important}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}

/* STICKY TOP: topbar + insegna viaggiano insieme */
.sticky-top{position:sticky;top:0;z-index:60;background:var(--paper)}

/* TOPBAR + toggle lingua */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px var(--pad-x);background:var(--paper);border-bottom:1px solid var(--line-weak);font-family:var(--font-mono);font-size:12px;color:var(--text-lo);letter-spacing:0.04em}
.topbar__brand{color:var(--text-hi);font-weight:500;letter-spacing:0.18em}
.topbar__right{display:flex;align-items:center;gap:20px}
.topbar__meta{color:var(--text-xlo)}
.lang{display:inline-flex;align-items:stretch;font-family:var(--font-mono);font-size:12px;letter-spacing:0.1em;border:1px solid var(--line);border-radius:2px;overflow:hidden}
.lang__opt{display:inline-flex;align-items:center;color:var(--text-lo);padding:4px 10px;transition:background .15s,color .15s}
.lang__opt+.lang__opt{border-left:1px solid var(--line)}
.lang__opt:hover{color:var(--text-hi)}
.lang__opt[aria-current="true"]{background:var(--text-hi);color:var(--paper)}
@media(max-width:600px){.topbar__meta{display:none}}

/* INSEGNA — una cella per prodotto, fondo pieno */
.sign{display:grid;grid-template-columns:repeat(10,1fr)}
.sign__item{background:var(--hue,#000);color:#fff;padding:13px 12px 12px;min-width:0;display:block;position:relative;transition:filter .15s}
.sign__item:hover{filter:brightness(1.22)}
.sign__item[data-on="true"]{box-shadow:inset 0 -4px 0 rgba(255,255,255,.9)}
.sign__code{display:block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:0.14em;opacity:.88;margin-bottom:5px}
.sign__name{display:block;font-size:13px;font-weight:500;letter-spacing:0.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sign__st{display:block;margin-top:6px;font-family:var(--font-mono);font-size:9px;letter-spacing:0.12em;text-transform:uppercase;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sign__st::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#fff;margin-right:6px;vertical-align:1px}
.sign__item[data-status="live"] .sign__st::before{animation:pulse 2.4s ease-in-out infinite}
.sign__item[data-status="dev"] .sign__st::before{opacity:.45}
.sign__item[data-status="forthcoming"] .sign__st::before{background:transparent;box-shadow:inset 0 0 0 1px #fff}

/* HERO — claim ridotto a una riga */
.hero{padding:clamp(40px,6vw,80px) var(--pad-x) clamp(28px,4vw,48px);border-bottom:1px solid var(--line-weak)}
.hero__claim{font-family:var(--font-display);font-weight:400;font-size:clamp(32px,4.8vw,62px);line-height:1.06;letter-spacing:-0.015em;color:var(--text-hi);max-width:19ch}
.hero__claim em{font-style:italic;color:var(--text)}
.hero__sub{margin-top:18px;font-size:16px;line-height:1.55;color:var(--text);max-width:52ch}
.hero__line{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px 22px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-lo)}
.hero__line b{color:var(--text-hi);font-weight:500}
.hero__line .live{color:var(--text-hi)}
.hero__line .live::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--text-hi);margin-right:8px;vertical-align:1px;animation:pulse 2.4s ease-in-out infinite}

/* SECTION head */
.section{padding:clamp(40px,5vw,72px) var(--pad-x);border-bottom:1px solid var(--line-weak)}
.section__head{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:24px;padding-bottom:18px;margin-bottom:24px;border-bottom:2px solid var(--line-strong);font-family:var(--font-mono);font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-lo)}
.section__head .ord{color:var(--text-hi);font-weight:500;letter-spacing:0.18em}
.section__head .title{color:var(--text-hi);font-weight:500;letter-spacing:0.2em}
.section__head .meta{color:var(--text-xlo)}
.section__head .meta b{color:var(--text-hi);font-weight:500}
@media(max-width:600px){.section__head{grid-template-columns:auto 1fr}.section__head .meta{grid-column:1/-1;margin-top:4px}}
.section--feature{padding-top:clamp(36px,4.5vw,64px)}

/* §01 · filtri per ambito (ex sezione Ambiti) */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.filter{background:transparent;border:1px solid var(--line);cursor:pointer;font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-lo);padding:7px 12px;transition:background .15s,border-color .15s,color .15s}
.filter:hover{border-color:var(--text-hi);color:var(--text-hi)}
.filter b{font-weight:400;opacity:.6;margin-left:7px}
.filter[data-on="true"]{background:var(--hue,#000);border-color:var(--hue,#000);color:#fff}
.filter[data-on="true"] b{opacity:.8}
.ambito-descs{margin-bottom:24px}
.ambito-desc{font-size:14px;line-height:1.5;color:var(--text-lo);max-width:78ch}
.ambito-desc+.ambito-desc{margin-top:4px}
.ambito-desc b{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;color:var(--text-xlo);font-weight:400;margin-right:8px}

/* §01 · schede prodotto */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line-weak);border:1px solid var(--line-weak)}
.card{background:var(--paper);display:flex;flex-direction:column;transition:background .15s;color:inherit;text-decoration:none}
.card:hover{background:var(--paper-2)}
.card__bar{height:6px;background:var(--hue,#000)}
.card__in{padding:20px 24px 22px;display:flex;flex-direction:column;gap:9px;flex:1}
.card__top{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.card__code{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;color:var(--hue,#000);font-weight:500}
.card__st{font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-lo);display:flex;align-items:center;gap:7px;white-space:nowrap}
.card__st::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--hue,#000);flex:0 0 auto}
.card[data-status="live"] .card__st::before{animation:pulse 2.4s ease-in-out infinite}
.card[data-status="dev"] .card__st::before{background:var(--text-xlo)}
.card[data-status="forthcoming"] .card__st::before{background:transparent;box-shadow:inset 0 0 0 1px var(--hue,#000)}
.card__name{font-size:22px;font-weight:600;color:var(--text-hi);letter-spacing:0.005em;line-height:1.15}
.card__desc{font-size:14px;line-height:1.5;color:var(--text-lo);text-wrap:pretty}
.card__foot{margin-top:auto;padding-top:14px;display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-xlo);border-top:1px solid var(--line-weak)}
.card__foot .go{color:var(--text-hi);font-size:14px;transition:transform .15s;display:inline-block}
.card:hover .card__foot .go{transform:translateX(4px)}
.card.is-hidden{display:none}

/* §02 · studio (manifesto compresso) */
.studio{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-weak)}
.studio__item{padding:22px 22px 22px 0;border-right:1px solid var(--line-weak)}
.studio__item:last-child{border-right:0}
.studio__item:not(:first-child){padding-left:22px}
.studio__ord{display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;color:var(--text-xlo);margin-bottom:9px}
.studio__item h3{font-family:var(--font-sans);font-size:15px;font-weight:500;letter-spacing:0.01em;color:var(--text-hi);margin-bottom:6px}
.studio__item p{font-size:13.5px;line-height:1.45;color:var(--text-lo);text-wrap:pretty}

/* §03 · contatti + footer */
.contact{display:grid;grid-template-columns:max-content 1fr;gap:16px 32px;max-width:720px;font-family:var(--font-mono);font-size:14px}
.contact dt{text-transform:uppercase;letter-spacing:0.12em;color:var(--text-lo);font-size:11px;padding-top:4px}
.contact dd{color:var(--text-hi)}
.contact a{border-bottom:1px solid currentColor}
.contact a:hover{color:var(--text-lo)}
.foot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px var(--pad-x);font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-xlo)}

/* RESPONSIVE */
@media(max-width:1280px){
  .sign{grid-template-columns:repeat(5,1fr)}
  .sign__item{border-bottom:1px solid rgba(255,255,255,.22)}
}
@media(max-width:900px){
  /* su schermi stretti l'insegna non resta appesa: sticky solo la topbar */
  .sticky-top{position:static}
  .topbar{position:sticky;top:0;z-index:50}
  .sign{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .sign::-webkit-scrollbar{display:none}
  .sign__item{flex:0 0 auto;min-width:144px;border-bottom:0}
  .grid{grid-template-columns:1fr}
  .studio{grid-template-columns:1fr 1fr}
  .studio__item{border-right:0;padding-left:0!important;padding-right:18px;border-bottom:1px solid var(--line-weak)}
  .studio__item:nth-child(odd){border-right:1px solid var(--line-weak)}
}
@media(max-width:600px){
  .studio{grid-template-columns:1fr}
  .studio__item:nth-child(odd){border-right:0}
  .card__top{flex-wrap:wrap;gap:6px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}