/* ============================================================
   EIRSTUDIO — brand layer
   Identità: mark ∃ (KH Teka "E" specchiata) + EIR Cyan #00D9FF
   ============================================================ */

:root {
  --eir--accent: #00d9ff;
  --eir--accent-soft: #66e9ff;
  --eir--black: #080807;
  --eir--ink: #e8e8e3;
  --eir--ink-dim: #938f8a;
}

/* Selection firmata */
::selection { background: var(--eir--accent); color: var(--eir--black); }
::-moz-selection { background: var(--eir--accent); color: var(--eir--black); }

/* Wordmark EIRSTUDIO (9 lettere): compenso le max-width */
.navbar_home_svg { max-width: 8.25rem; }
@media (max-width: 767px) { .navbar_home_svg { max-width: 6.5rem; } }

/* Il mark ∃ nella hero: l'unico elemento cyan sopra la piega */
.hero_home_content_svg { color: var(--eir--accent); max-width: 2.6em; }

/* Scia cyan sullo schermo di transizione tra pagine */
.transition_screen::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--eir--accent) 35%, var(--eir--accent-soft) 65%, transparent);
  opacity: .9;
}

/* ============================================================
   PRELOADER — "∃ boot sequence"
   Visibile via CSS prima ancora che il JS parta (niente FOUC).
   ============================================================ */

.eir_preloader {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow: hidden;
  color: var(--eir--ink);
  font-family: "Suisse Mono", Arial, monospace;
  pointer-events: all;
}
.eir_preloader[data-eir-done="true"] { display: none; }

/* Le due ante dello shutter */
.eir_preloader_panel {
  position: absolute;
  left: 0; right: 0;
  height: 50.5%;
  background: var(--eir--black);
}
.eir_preloader_panel.is-top { top: 0; }
.eir_preloader_panel.is-bottom { bottom: 0; }

/* Filo cyan al centro: la "lama" che si accende prima dell'apertura */
.eir_preloader_blade {
  position: absolute;
  left: 0; top: 50%;
  width: 100%;
  height: 2px;
  transform: translateY(-50%) scaleX(0);
  transform-origin: 50% 50%;
  background: linear-gradient(90deg, transparent, var(--eir--accent) 20%, var(--eir--accent) 80%, transparent);
  box-shadow: 0 0 24px 2px rgba(0, 217, 255, .55);
  opacity: 0;
}

/* Contenuto centrale: mark ∃ costruito a lame + wordmark */
.eir_preloader_core {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(1.4rem, 3.2vh, 2.4rem);
}
.eir_preloader_mark {
  position: relative;
  width: clamp(84px, 13vw, 148px);
  aspect-ratio: 1;
}
.eir_preloader_mark svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.eir_preloader_mark .eir_slice_1 { clip-path: inset(0 0 66.7% 0); }
.eir_preloader_mark .eir_slice_2 { clip-path: inset(33.3% 0 33.4% 0); }
.eir_preloader_mark .eir_slice_3 { clip-path: inset(66.6% 0 0 0); }
.eir_preloader_mark svg { color: var(--eir--accent); opacity: 0; }

.eir_preloader_word {
  width: clamp(210px, 34vw, 360px);
  overflow: hidden;
}
.eir_preloader_word svg { display: block; width: 100%; color: var(--eir--ink); }
.eir_preloader_word svg path { opacity: 0; }

.eir_preloader_tag {
  font-size: .65rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
  opacity: 0;
}
.eir_preloader_tag em { font-style: normal; color: var(--eir--accent); }

/* Boot log — alto sinistra */
.eir_preloader_log {
  position: absolute;
  top: clamp(1rem, 3vh, 2rem);
  left: clamp(1rem, 3vw, 2rem);
  display: flex;
  flex-direction: column;
  gap: .35em;
  font-size: .62rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
}
.eir_preloader_log .eir_log_line { opacity: 0; white-space: nowrap; }
.eir_preloader_log .eir_log_line b { font-weight: 400; color: var(--eir--accent); }

/* Contatore — basso destra */
.eir_preloader_counter {
  position: absolute;
  right: clamp(1rem, 3vw, 2.2rem);
  bottom: clamp(.8rem, 2.6vh, 1.8rem);
  font-family: Khteka, Arial, sans-serif;
  font-weight: 500;
  font-size: clamp(3.2rem, 9vw, 6.5rem);
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--eir--ink);
  opacity: 0;
  font-variant-numeric: tabular-nums;
}
.eir_preloader_counter sup {
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .22em;
  letter-spacing: .1em;
  color: var(--eir--ink-dim);
  vertical-align: super;
  margin-left: .18em;
}

/* Coordinate — basso sinistra, puro set dressing cinematografico */
.eir_preloader_meta {
  position: absolute;
  left: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1rem, 2.8vh, 1.9rem);
  font-size: .6rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
  opacity: 0;
}

/* Scanline: passa una volta sola durante il "signal lock" */
.eir_preloader_scan {
  position: absolute;
  left: 0;
  top: -12%;
  width: 100%;
  height: 10%;
  background: linear-gradient(180deg, transparent, rgba(0, 217, 255, .07) 45%, rgba(0, 217, 255, .16) 50%, rgba(0, 217, 255, .07) 55%, transparent);
  opacity: 0;
  pointer-events: none;
}

/* Grana da pellicola, quasi impercettibile */
.eir_preloader_noise {
  position: absolute;
  inset: 0;
  opacity: .05;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: reduce) {
  .eir_preloader_scan, .eir_preloader_noise, .eir_preloader_blade { display: none; }
}

/* ============================================================
   FASE 2 — layer cinematico sito-wide (originale EIRSTUDIO)
   ============================================================ */

/* Scrollbar firmata */
html { scrollbar-width: thin; scrollbar-color: #4a4944 transparent; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #4a4944; }
::-webkit-scrollbar-thumb:hover { background: var(--eir--accent); }

/* Focus accessibile firmato */
:focus-visible { outline: 2px solid var(--eir--accent); outline-offset: 3px; }

/* Pallino "segnale" dei label di sezione: cyan, pulsa piano */
.g_eyebrow_circle {
  background-color: var(--eir--accent) !important;
  animation: eir-pulse 2.8s ease-in-out infinite;
}
@keyframes eir-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0, 217, 255, .4); }
  55% { box-shadow: 0 0 0 6px rgba(0, 217, 255, 0); }
}

/* Grana pellicola su tutto il sito (iniettata da eir-motion.js) */
.eir_grain {
  position: fixed;
  inset: -80px;
  z-index: 9980;
  pointer-events: none;
  opacity: .04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
  animation: eir-grain .9s steps(1) infinite;
}
@keyframes eir-grain {
  0% { transform: translate(0, 0); }
  14% { transform: translate(-34px, 18px); }
  28% { transform: translate(22px, -28px); }
  42% { transform: translate(-18px, -30px); }
  56% { transform: translate(30px, 24px); }
  70% { transform: translate(-28px, 6px); }
  84% { transform: translate(12px, 32px); }
  100% { transform: translate(0, 0); }
}

/* HUD hero — riga di stato verticale sul bordo destro */
.hero_home_wrap { position: relative; }
.eir_hud {
  position: absolute;
  right: clamp(.9rem, 1.8vw, 1.6rem);
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  writing-mode: vertical-rl;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .58rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
  opacity: 0;
  transition: opacity 1.4s ease;
  pointer-events: none;
  white-space: nowrap;
}
.eir_hud b { font-weight: 400; color: var(--eir--accent); }
.eir_hud_dot {
  display: inline-block;
  width: .5em;
  height: .5em;
  margin-block-end: .9em;
  background: var(--eir--accent);
  border-radius: 50%;
  animation: eir-blink 1.3s steps(2, start) infinite;
}
@keyframes eir-blink { 50% { opacity: .12; } }
@media (max-width: 991px) { .eir_hud { display: none; } }

/* Campo di segnale nella hero (canvas generativo originale) */
.eir_signal {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none;
  mix-blend-mode: screen;
}

/* Card lavori: velo di segnale cyan all'hover */
.works_home_cover { position: relative; }
.works_home_cover::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  background: linear-gradient(180deg, rgba(0, 217, 255, 0), rgba(0, 217, 255, .14) 50%, rgba(0, 217, 255, 0));
  opacity: 0;
  transition: opacity .45s ease;
  pointer-events: none;
  mix-blend-mode: screen;
}
.works_home_link:hover .works_home_cover::after { opacity: 1; }

/* Freccia dei link footer in cyan all'hover */
.footer_nav_span.is-arrow { transition: color .3s ease; }
.footer_nav_text:hover .footer_nav_span.is-arrow { color: var(--eir--accent); }

/* Glitch del mark ∃ in hero all'hover */
.hero_home_content_svg:hover { animation: eir-glitch .42s steps(2, jump-none) both; }
@keyframes eir-glitch {
  0% { transform: none; filter: none; }
  25% { transform: translate(-3px, 1px) skewX(3deg); filter: drop-shadow(4px 0 0 rgba(0, 217, 255, .75)); }
  50% { transform: translate(3px, -1px); filter: drop-shadow(-4px 0 0 rgba(0, 217, 255, .55)); }
  75% { transform: translate(-1px, 0); filter: drop-shadow(2px 0 0 rgba(0, 217, 255, .35)); }
  100% { transform: none; filter: none; }
}

/* Velo di grana sulla transizione tra pagine */
.transition_screen::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .07;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: reduce) {
  .eir_grain { display: none; }
  .g_eyebrow_circle, .eir_hud_dot, .hero_home_content_svg { animation: none !important; }
}

/* ============================================================
   FASE 4 — corpo della homepage: "dossier di segnale"
   Tutto scopato a [data-barba-namespace="home"]: work e progetti
   condividono classi (works_home_, cta_home_, accordion_css_,
   gap_home_) e NON devono cambiare.
   ============================================================ */

:root { --eir--accent-deep: #0090b4; } /* cyan leggibile su beige (sezione chiara) */

/* --- Tag di sezione (iniettati da eir-motion.js) --- */
[data-barba-namespace="home"] .problems_home_wrap,
[data-barba-namespace="home"] .gap_home_wrap,
[data-barba-namespace="home"] .works_home_wrap,
[data-barba-namespace="home"] .services_home_wrap,
[data-barba-namespace="home"] .process_home_wrap,
[data-barba-namespace="home"] .faq_home_wrap,
[data-barba-namespace="home"] .cta_home_wrap { position: relative; }

.eir_sec_tag {
  position: absolute;
  top: clamp(4.5rem, 6.5vh, 5.6rem); /* sotto la navbar fissa */
  right: var(--site--margin, 2rem);
  z-index: 8;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .58rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity .9s ease;
}
.eir_sec_tag.is-on { opacity: 1; }
.eir_sec_tag b { font-weight: 400; color: var(--eir--accent); }
.eir_sec_tag::before {
  content: "";
  display: inline-block;
  width: .5em;
  height: .5em;
  margin-right: .7em;
  background: var(--eir--accent);
  animation: eir-blink 1.6s steps(2, start) infinite;
}
[data-barba-namespace="home"] .works_home_wrap .eir_sec_tag { color: var(--swatch--black-100, #6b645c); }
[data-barba-namespace="home"] .works_home_wrap .eir_sec_tag b { color: var(--eir--accent-deep); }
@media (max-width: 767px) { .eir_sec_tag { display: none; } }

/* --- TX/02 · manifesto + prova ------------------------------- */

/* progress dello slider statistiche: il filo diventa segnale */
[data-barba-namespace="home"] .problem_stats_progress-start { background-color: var(--eir--accent); }
[data-barba-namespace="home"] .problem_stats_progress-end { background-color: rgba(0, 217, 255, .22); }
[data-barba-namespace="home"] .problem_stats_button { transition: color .3s ease, border-color .3s ease; }
[data-barba-namespace="home"] .problem_stats_button:hover { color: var(--eir--accent); border-color: var(--eir--accent); }

/* barretta cyan sotto i numeri delle statistiche */
[data-barba-namespace="home"] .problem_home_stat-num::after {
  content: "";
  display: block;
  width: 1.6ch;
  height: 2px;
  margin-top: .18em;
  background: var(--eir--accent);
}

/* griglia clienti = celle di segnale: indice mono, tick, hover a pannello */
[data-barba-namespace="home"] .problems_home_list { counter-reset: eir-client; }
[data-barba-namespace="home"] .problems_home_item {
  counter-increment: eir-client;
  transition: background-color .45s ease;
}
[data-barba-namespace="home"] .problems_home_item::before {
  content: "C/" counter(eir-client, decimal-leading-zero);
  position: absolute;
  top: .55em;
  left: .7em;
  z-index: 2;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .56rem;
  letter-spacing: .14em;
  color: var(--swatch--black-200, #524d47);
  transition: color .35s ease;
}
[data-barba-namespace="home"] .problems_home_item::after {
  content: "";
  position: absolute;
  inset: .45em;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  transition: opacity .35s ease;
  background:
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 0 / 10px 1px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 0 / 1px 10px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 0 / 10px 1px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 0 / 1px 10px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 100% / 10px 1px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 100% / 1px 10px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 100% / 10px 1px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 100% / 1px 10px;
  background-repeat: no-repeat;
}
[data-barba-namespace="home"] .problems_home_label { transition: color .35s ease; }
@media (hover: hover) and (pointer: fine) {
  [data-barba-namespace="home"] .problems_home_item:hover { background-color: var(--swatch--card-bg, #181715); }
  [data-barba-namespace="home"] .problems_home_item:hover::after { opacity: 1; }
  [data-barba-namespace="home"] .problems_home_item:hover::before { color: var(--eir--accent); }
  [data-barba-namespace="home"] .problems_home_item:hover .problems_home_label { color: var(--eir--ink); }
}

/* --- TX/03 · il divario -------------------------------------- */

/* i quadratini della griglia blueprint diventano cyan */
[data-barba-namespace="home"] .gap_home_line_square { background-color: var(--eir--accent); }

/* mirino "viewfinder" sull'immagine sticky */
[data-barba-namespace="home"] .gap_home_cover::after {
  content: "";
  position: absolute;
  inset: 10px;
  z-index: 6;
  pointer-events: none;
  opacity: .85;
  background:
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 0 / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 0 / 1.5px 16px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 0 / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 0 / 1.5px 16px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 100% / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 100% / 1.5px 16px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 100% / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 100% / 1.5px 16px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 50% 50% / 11px 1px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 50% 50% / 1px 11px;
  background-repeat: no-repeat;
}
[data-barba-namespace="home"] .gap_home_cover::before {
  content: "∃ rec — fig. 01";
  position: absolute;
  left: 14px;
  bottom: 12px;
  z-index: 6;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .55rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--eir--ink);
  text-shadow: 0 1px 6px rgba(8, 8, 7, .8);
  pointer-events: none;
}

/* "Quel divario" in outline: il divario è letteralmente vuoto */
@supports (-webkit-text-stroke: 1px #000) {
  [data-barba-namespace="home"] .gap_home_inner_heading.is-right {
    -webkit-text-stroke: 1.5px var(--eir--ink);
    color: transparent;
  }
}

/* --- TX/04 · archivio casi (sezione chiara) ------------------ */

/* fase 6: i bordi dither della sezione chiara non hanno convinto e sono
   stati sostituiti dai separatori "timecode" (.eir_edge) della nuova
   sezione Servizi — vedi il blocco FASE 6 in fondo al file */

/* numeri fantasma 01–05 dietro le card (riusa il counter del template) */
@media (min-width: 992px) {
  [data-barba-namespace="home"] .works_home_item::before {
    content: counter(item-counter, decimal-leading-zero);
    position: absolute;
    top: -.08em;
    right: 0;
    z-index: 0;
    font-family: Khteka, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(6rem, 11vw, 12rem);
    line-height: 1;
    letter-spacing: -.04em;
    color: transparent;
    -webkit-text-stroke: 1px rgba(57, 54, 50, .28);
    pointer-events: none;
    transition: -webkit-text-stroke-color .45s ease, transform .45s ease;
  }
  [data-barba-namespace="home"] .works_home_item:hover::before {
    -webkit-text-stroke-color: var(--eir--accent-deep);
    transform: translateY(-.04em);
  }
}

/* il risultato ($2M+, 58%…) marcato come "selezione" cyan */
[data-barba-namespace="home"] .works_home_result_value:not(.w-dyn-bind-empty) {
  display: inline-block;
  padding: .02em .22em;
  background: var(--eir--accent);
  color: var(--swatch--black-400, #080807);
}

/* micro-grafica indice in cyan profondo */
[data-barba-namespace="home"] .works_micrographic_circle { background-color: var(--eir--accent-deep); }

/* il titolone display era nascosto dal template: lo riattiviamo
   come apertura monumentale della sezione chiara */
[data-barba-namespace="home"] .works_home_header {
  display: block;
  padding-bottom: var(--_spacing---space--4, 2rem);
}
[data-barba-namespace="home"] .works_home_heading.u-text-style-display {
  white-space: normal;
  line-height: .92;
  letter-spacing: -.02em;
}

/* annotazione d'archivio sotto il titolone */
[data-barba-namespace="home"] .works_home_header::after {
  content: "( archivio — 05 casi, risultati reali )";
  display: block;
  margin-top: .9em;
  text-align: right;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--swatch--black-100, #6b645c);
}

/* CTA "Vedi tutte le storie" */
[data-barba-namespace="home"] .works_home_cta_link { transition: border-color .4s ease; }
[data-barba-namespace="home"] .works_home_cta_link:hover { border-top-color: var(--eir--accent-deep); }
[data-barba-namespace="home"] .works_home_cta_text.is-duplicate-2 { transition: color .3s ease, transform .3s ease; }
[data-barba-namespace="home"] .works_home_cta_link:hover .works_home_cta_text.is-duplicate-2 {
  color: var(--eir--accent-deep);
  transform: translateX(.25em);
}

/* --- TX/05 · servizi + voci ---------------------------------- */

/* indice mono sopra ogni servizio */
[data-barba-namespace="home"] .services_home_service-list { counter-reset: eir-serv; }
[data-barba-namespace="home"] .services_home_service_item { counter-increment: eir-serv; }
[data-barba-namespace="home"] .services_home_service_item::before {
  content: "S/" counter(eir-serv, decimal-leading-zero) " —";
  display: block;
  margin-bottom: .5em;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .16em;
  /* .services_home_services ha mix-blend-mode:difference: la resa reale a schermo
     e' |sfondo - color|. Su beige (#e8e8e3) uso l'inverso di blend perche' il
     numeretto appaia nel ciano del brand (#0090b4). */
  color: #e8582f;
  transition: color .35s ease;
}
[data-barba-namespace="home"] .services_home_heading.u-text-style-h2 {
  transition: opacity .4s ease, transform .5s var(--animation-expo-out, ease);
}
/* fase 30 — attivazione ESCLUSIVAMENTE da scroll, identica su desktop e mobile.
   Rimosso ogni effetto :hover (niente dimming/moto al passaggio del puntatore).
   La classe .eir-serv-active segue lo scroll (progressiva e REVERSIBILE: voci
   0..cur attive, in risalita regrediscono) e la gestisce eir-motion.js su
   TUTTI i dispositivi. */
[data-barba-namespace="home"] .services_home_service_item.eir-serv-active .services_home_heading { transform: translateX(.28em); }
[data-barba-namespace="home"] .services_home_service_item.eir-serv-active::before { color: #e8340f; }
/* il passaggio del mouse non deve attivare nulla: neutralizzo l'interazione
   hover del bundle Webflow disabilitando i puntatori sulle voci (lo scroll
   della pagina resta libero). */
[data-barba-namespace="home"] .services_home_service_item[data-content-trigger] { pointer-events: none; }
/* Chi siamo: social conclusivi nello stesso ritmo editoriale dei principi. */
.eir_about_socials {
  width: 50%;
  margin-left: auto;
  padding-top: var(--_spacing---space--4, 1.5rem);
  padding-bottom: var(--_spacing---space--6, 3rem);
  border-top: 1px solid var(--swatch--card-bg);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--_spacing---space--4, 1.5rem);
}
.eir_about_socials_label {
  grid-column: 1 / -1;
  color: var(--swatch--black-50);
  font-size: .62rem;
  text-transform: uppercase;
}
.eir_about_social_link {
  width: 100%;
  padding-bottom: .45em;
  border-bottom: 1px solid var(--swatch--card-bg);
  color: inherit;
  transition: color .3s ease, border-color .3s ease;
}
.eir_about_social_link:hover {
  color: var(--eir--accent);
  border-color: var(--eir--accent);
}

/* Footer: email e WhatsApp restano un unico blocco di contatto. */
.eir_footer_contacts {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  gap: .15rem;
}
.eir_footer_contacts .footer_middle_email {
  display: inline-block;
}

.eir_mobile_menu_socials {
  display: none;
}

@media (max-width: 767px) {
  .navbar_menu_span-wrap {
    display: grid;
    overflow: hidden;
  }
  .navbar_menu_span-wrap .navbar_menu_span {
    grid-area: 1 / 1;
    display: block;
    line-height: 1.3;
  }
  .navbar_menu_span-wrap .navbar_menu_span.is-close {
    position: relative;
    inset: auto;
  }
  .menu_wrap.eir-mobile-menu-ready {
    inset: 0;
    display: flex;
    overflow: hidden;
    pointer-events: none;
  }
  .menu_wrap.eir-mobile-menu-ready .menu_contain {
    z-index: 2;
    width: 100%;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }
  .menu_wrap.eir-mobile-menu-ready .menu_overlay_close {
    z-index: 1;
    pointer-events: auto;
  }
  .eir_mobile_menu_socials {
    width: 100%;
    margin-top: var(--_spacing---space--5, 2rem);
    padding-top: var(--_spacing---space--3, 1rem);
    border-top: 1px solid var(--swatch--card-bg);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: var(--_spacing---space--4, 1.5rem);
  }
  .eir_mobile_menu_social_link {
    color: var(--swatch--beige-100);
    transition: color .3s ease;
  }
  .eir_mobile_menu_social_link:active,
  .eir_mobile_menu_social_link:focus-visible {
    color: var(--eir--accent);
  }
  .eir_about_socials {
    width: 100%;
    margin-left: 0;
    grid-template-columns: 1fr;
  }
}

/* testimonianze: ritratti B/N editoriali + segnaposto cyan sul nome */
[data-barba-namespace="home"] .services_home_headshot { filter: grayscale(1) contrast(1.06); }
[data-barba-namespace="home"] .services_home_testimonee.is-name { position: relative; padding-left: .9em; }
[data-barba-namespace="home"] .services_home_testimonee.is-name::before {
  content: "";
  position: absolute;
  left: 0;
  top: .48em;
  width: .42em;
  height: .42em;
  background: var(--eir--accent);
}

/* --- TX/06 · processo ----------------------------------------- */

[data-barba-namespace="home"] .process_micrographic_circle {
  background-color: var(--eir--accent);
  animation: eir-pulse 2.8s ease-in-out infinite;
}
[data-barba-namespace="home"] .process_home_content_span { color: var(--eir--accent); }

/* mirino sui video di fase + CTA cyan all'hover */
[data-barba-namespace="home"] .process_home_video { position: relative; }
[data-barba-namespace="home"] .process_home_video::after {
  content: "";
  position: absolute;
  inset: 10px;
  z-index: 3;
  pointer-events: none;
  opacity: 0;
  transition: opacity .4s ease;
  background:
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 0 / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 0 / 1.5px 16px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 0 / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 0 / 1.5px 16px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 100% / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 0 100% / 1.5px 16px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 100% / 16px 1.5px,
    linear-gradient(var(--eir--accent), var(--eir--accent)) 100% 100% / 1.5px 16px;
  background-repeat: no-repeat;
}
[data-barba-namespace="home"] .process_home_video:hover::after { opacity: 1; }
[data-barba-namespace="home"] .process_home_cta { transition: color .3s ease; }
[data-barba-namespace="home"] .process_home_video:hover .process_home_cta { color: var(--eir--accent); }

/* --- TX/07 · domande ------------------------------------------ */

/* numerazione mono delle domande */
[data-barba-namespace="home"] .g_faq_list { counter-reset: eir-faq; }
[data-barba-namespace="home"] .g_faq_item { counter-increment: eir-faq; }
[data-barba-namespace="home"] .accordion_css_item_heading::before {
  content: counter(eir-faq, decimal-leading-zero);
  display: inline-block;
  margin-right: 1.1em;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .58em;
  letter-spacing: .12em;
  color: var(--eir--ink-dim);
  transform: translateY(-.15em);
}

/* stato attivo = "selezione" cyan (stessa logica della ::selection) */
[data-barba-namespace="home"] [data-accordion-status="active"] .accordion_css_item_bg { background-color: var(--eir--accent) !important; }
[data-barba-namespace="home"] [data-accordion-status="active"] .accordion_css_item_heading { color: var(--swatch--black-400, #080807) !important; }
[data-barba-namespace="home"] [data-accordion-status="active"] .accordion_css_item_heading::before { color: var(--swatch--black-400, #080807); }
[data-barba-namespace="home"] [data-accordion-status="active"] .accordion_css_square { background-color: var(--swatch--black-400, #080807) !important; }

/* --- TX/08 · contatto ----------------------------------------- */

/* la freccia display diventa il segnale */
[data-barba-namespace="home"] .cta_home_heading.u-text-style-display.is-4.is-arrow { color: var(--eir--accent); }

/* "un'esperienza" in outline: la costruiamo insieme */
@supports (-webkit-text-stroke: 1px #000) {
  [data-barba-namespace="home"] .cta_home_heading.u-text-style-display.is-2 {
    -webkit-text-stroke: 1.5px var(--eir--ink);
    color: transparent;
  }
}

/* allori premi: quieti di default, si accendono al passaggio */
[data-barba-namespace="home"] .cta_home_svgs { opacity: .55; transition: opacity .45s ease, color .45s ease; }
[data-barba-namespace="home"] .cta_home_svgs:hover { opacity: 1; color: var(--eir--accent); }

/* recensioni Google: sostituisce gli allori con un sigillo editoriale compatto */
[data-barba-namespace="home"] .cta_home_proof {
  grid-row-gap: clamp(1.25rem, 2vw, 2rem);
}
[data-barba-namespace="home"] .eir_google_reviews {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  max-width: 100%;
  padding: .65rem .8rem;
  border-top: 1px solid rgba(232, 232, 227, .28);
  border-bottom: 1px solid rgba(232, 232, 227, .28);
  color: var(--eir--ink);
  text-decoration: none;
  transition: border-color .3s ease, background-color .3s ease;
}
[data-barba-namespace="home"] .eir_google_reviews[href] {
  cursor: pointer;
}
[data-barba-namespace="home"] .eir_google_reviews[href]:hover {
  border-color: var(--eir--accent);
  background-color: rgba(8, 8, 7, .24);
}
[data-barba-namespace="home"] .eir_google_mark {
  width: 2.5rem;
  height: 2.5rem;
  flex: none;
}
[data-barba-namespace="home"] .eir_google_review_copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .25rem;
  min-width: 0;
}
[data-barba-namespace="home"] .eir_google_review_label {
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .58rem;
  line-height: 1;
  letter-spacing: 0;
  color: rgba(232, 232, 227, .76);
}
[data-barba-namespace="home"] .eir_google_stars {
  display: inline-flex;
  align-items: center;
  gap: .18rem;
  color: #fbbc05;
}
[data-barba-namespace="home"] .eir_google_star {
  width: .96rem;
  height: .96rem;
  flex: none;
  fill: currentColor;
}

/* citazione con filo di segnale */
[data-barba-namespace="home"] .cta_home_testimonial_message {
  border-left: 2px solid var(--eir--accent);
  padding-left: 1em;
}

/* foto finale: scanline + didascalia da studio */
[data-barba-namespace="home"] .cta_home_cover { position: relative; }
[data-barba-namespace="home"] .cta_home_cover::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: repeating-linear-gradient(180deg, rgba(8, 8, 7, .14) 0 1px, transparent 1px 4px);
  mix-blend-mode: multiply;
}
[data-barba-namespace="home"] .cta_home_cover::before {
  content: "∃ studio — segnale in uscita";
  position: absolute;
  left: 16px;
  bottom: 14px;
  z-index: 4;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .55rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--eir--ink);
  text-shadow: 0 1px 6px rgba(8, 8, 7, .8);
  pointer-events: none;
}

/* bottone principale: quadratino cyan all'hover */
[data-barba-namespace="home"] .g_btn_aside_bg { transition: background-color .35s ease; }
[data-barba-namespace="home"] .g_btn_svg { transition: color .35s ease; }
[data-barba-namespace="home"] .g_btn_main:hover .g_btn_aside_bg { background-color: var(--eir--accent); }
[data-barba-namespace="home"] .g_btn_main:hover .g_btn_svg { color: var(--swatch--black-400, #080807); }

@media (prefers-reduced-motion: reduce) {
  .eir_sec_tag::before,
  [data-barba-namespace="home"] .process_micrographic_circle { animation: none !important; }
}

/* ============================================================
   FASE 5 — beacon ∃ (simbolo identificativo), bicromia EIR/STUDIO,
   micro-segno ®-beacon, orbiter cosmico, transizione preloader→sito
   ============================================================ */

/* --- Beacon nel preloader: parti animabili --- */
/* l'svg è sempre visibile (le parti partono spente); annulla il vecchio
   opacity:0 pensato per le lame ∃ di fase 1 */
.eir_preloader_mark .eir_mark_svg { opacity: 1; }
/* fase 13: l'icona e' ora le tre lineette in cyan (niente piu' anello/satellite) */
.eir_mark_svg { width: 100%; height: 100%; display: block; color: var(--eir--accent); overflow: visible; }
.eir_mark_bar { opacity: 0; }
/* riduzione movimento / fallback statico: le tre barre visibili */
.eir_preloader.eir-static .eir_mark_bar { opacity: 1; }

/* --- micro-segno ®-beacon (orbita + satellite in corpo "trademark") --- */
.eir_wm_reg { display: block; }
.eir_preloader_wordwrap { position: relative; width: clamp(210px, 34vw, 360px); }
.eir_preloader_wordwrap .eir_preloader_word { width: 100%; }
.eir_wm_reg.is-boot {
  position: absolute;
  top: -.55em;
  right: -1.25em;
  width: .78em;
  color: var(--eir--ink-dim);
  opacity: 0;
}
.eir_wm_reg.is-boot rect { fill: var(--eir--accent); }

/* --- bicromia: nel preloader EIR è cyan, STUDIO resta ink --- */
.eir_preloader_word svg path:nth-child(-n+3) { fill: var(--eir--accent); }

/* --- navbar: gerarchia silenziosa (STUDIO attenuato), EIR cyan all'hover --- */
.navbar_home_svg path { transition: fill .35s ease, opacity .35s ease; }
.navbar_home_svg path:nth-child(n+4) { opacity: .68; }
.navbar_home:hover .navbar_home_svg path:nth-child(-n+3) { fill: var(--eir--accent); }
.eir_wm_reg.is-nav {
  position: absolute;
  top: calc(50% - 1.02em);
  right: -.85rem;
  width: .55rem;
  opacity: .55;
  transition: opacity .35s ease, color .35s ease;
}
.navbar_home:hover .eir_wm_reg.is-nav { opacity: 1; color: var(--eir--accent); }
@media (max-width: 767px) { .eir_wm_reg.is-nav { right: -.7rem; width: .48rem; } }

/* --- fase 14: oltre la hero il logo resta nello stato "hover" (icona brand cyan permanente) ---
   Stessa identica resa dell'hover qui sopra: riusa --eir--accent e le transizioni gia' definite
   (nessun nuovo stile/colore). La classe .is-past-hero e' aggiunta/rimossa da eir-motion.js con un
   IntersectionObserver sulla hero; l'hover normale resta intatto quando si e' dentro la hero. */
.navbar_home.is-past-hero .navbar_home_svg path:nth-child(-n+3) { fill: var(--eir--accent); }
.navbar_home.is-past-hero .eir_wm_reg.is-nav { opacity: 1; color: var(--eir--accent); }

/* --- footer: EIR cyan sul wordmark-timbro + micro-segno --- */
.footer_canvas_content { justify-content: flex-start; }
.footer_canvas_svg path { transition: fill .35s ease; }
.footer_canvas_svg path:nth-child(-n+3) { fill: var(--eir--accent); }
.eir_wm_reg.is-footer {
  width: .8rem;
  align-self: flex-start;
  margin: -.35rem 0 0 .3rem;
  opacity: .75;
  flex: none;
}

/* --- pagine progetti: bicromia anche sul wordmark gigante del footer --- */
.footer_bottom .hero_home_bottom svg path:nth-child(-n+3) { fill: var(--eir--accent); }

/* --- hero: il beacon sostituisce la ∃ (stessa classe, stesso intro) --- */
.hero_home_content_svg { max-width: 3.1em; overflow: visible; }
.hero_home_content_svg .eir_hero_sat { animation: eir-blink 2.2s steps(2, start) infinite; }

/* fase 6: l'orbiter in costellazione è stato rimosso su richiesta —
   la hero resta pulita, il simbolo vive nel preloader/wordmark/cursore */

/* --- transizione preloader→sito: bordi dissolti + filo cyan sulle ante --- */
.eir_panel_edge {
  --eir-edge: 0;
  position: absolute;
  left: 0; right: 0;
  height: 60px;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='60'%3E%3Cpath d='M0 0h3v3h-3ZM3 0h3v3h-3ZM6 0h3v3h-3ZM9 0h3v3h-3ZM0 3h3v3h-3ZM3 3h3v3h-3ZM6 3h3v3h-3ZM9 3h3v3h-3ZM0 6h3v3h-3ZM3 6h3v3h-3ZM6 6h3v3h-3ZM9 6h3v3h-3ZM3 9h3v3h-3ZM9 9h3v3h-3ZM0 12h3v3h-3ZM3 12h3v3h-3ZM6 12h3v3h-3ZM9 12h3v3h-3ZM3 15h3v3h-3ZM9 15h3v3h-3ZM0 18h3v3h-3ZM6 18h3v3h-3ZM9 18h3v3h-3ZM3 21h3v3h-3ZM9 21h3v3h-3ZM0 24h3v3h-3ZM3 24h3v3h-3ZM6 24h3v3h-3ZM3 27h3v3h-3ZM9 27h3v3h-3ZM0 30h3v3h-3ZM6 30h3v3h-3ZM9 33h3v3h-3ZM0 36h3v3h-3ZM6 36h3v3h-3ZM3 39h3v3h-3ZM0 42h3v3h-3ZM6 42h3v3h-3ZM0 48h3v3h-3ZM6 48h3v3h-3Z' fill='%23080807'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
}
.eir_preloader_panel.is-top .eir_panel_edge { top: 100%; }
.eir_preloader_panel.is-bottom .eir_panel_edge { bottom: 100%; transform: scaleY(-1); }
.eir_panel_edge::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -1px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--eir--accent) 16%, var(--eir--accent-soft) 50%, var(--eir--accent) 84%, transparent);
  box-shadow: 0 0 18px 1px rgba(0, 217, 255, .5);
  opacity: var(--eir-edge);
}

/* assestamento della hero dopo il boot (solo il canvas, che è nostro) */
.hero_canvas_item { transform: scale(1.06); transition: transform 2.8s cubic-bezier(.16, 1, .3, 1); }
html.eir-booted .hero_canvas_item { transform: scale(1); }

@media (prefers-reduced-motion: reduce) {
  .hero_home_content_svg .eir_hero_sat { animation: none !important; }
  .eir_panel_edge { display: none; }
  .hero_canvas_item { transform: none; transition: none; }
  .eir_mark_ring { stroke-dashoffset: 0; }
  .eir_mark_sat rect, .eir_mark_bar { opacity: 1; }
}

/* ============================================================
   FASE 6 — menu/audio cyan, voce Lavori in stand-by, sezione
   Servizi (al posto di "Storie di successo"), separatori
   "timecode", scheda Contatti, cursore beacon, tipografia
   display allineata al logo (KH Teka)
   ============================================================ */

/* --- tipografia display = font del logo (KH Teka) --------------- */
/* "LET'S BRIDGE THE GAP" e "COSTRUIAMO UN'ESPERIENZA" parlano ora
   la stessa lingua del wordmark ∃IRSTUDIO */
[data-barba-namespace="home"] .gap_home_inner_heading.u-text-style-display,
[data-barba-namespace="home"] .cta_home_heading.u-text-style-display {
  font-family: Khteka, Arial, sans-serif;
  font-weight: 500;
  letter-spacing: -.02em;
  text-transform: uppercase;
}

/* Il bundle spezza il testo lettera per lettera per l'animazione di
   reveal (ogni carattere diventa un inline-block): senza nowrap il
   wrap naturale può cadere in mezzo a una parola invece che tra le
   parole. Riga singola, il contenitore ammette overflow visibile. */
[data-barba-namespace="home"] .gap_home_inner_heading.u-text-style-display {
  white-space: nowrap;
}
.eir_gap_word { display: inline; }

/* TX/03 - MOBILE: WE e PUT chiudono ai lati della cover; il desktop
   conserva integralmente composizione e animazione originali. */
@media (max-width: 767px) {
  [data-barba-namespace="home"] .gap_home_inner_content {
    inset: 0;
    width: 100%;
    transform: none;
    display: block;
    pointer-events: none;
  }
  [data-barba-namespace="home"] .gap_home_inner_heading-contain.is-left {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    overflow: visible;
    transform: translateY(-50%) !important;
  }
  [data-barba-namespace="home"] .eir_gap_mobile_split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(8.75rem, 40vw, 12rem) minmax(0, 1fr);
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding-inline: var(--site--margin);
    font-size: clamp(2.85rem, 14.2vw, 5.5rem);
    line-height: .84;
  }
  [data-barba-namespace="home"] .eir_gap_word {
    display: inline-block;
  }
  [data-barba-namespace="home"] .eir_gap_word.is-we {
    grid-column: 1;
    justify-self: end;
  }
  [data-barba-namespace="home"] .eir_gap_word.is-put {
    grid-column: 3;
    justify-self: start;
  }
  [data-barba-namespace="home"] .gap_home_cover {
    width: min(38vw, 11.25rem);
  }
  [data-barba-namespace="home"] .gap_home_inner_heading-contain.is-right {
    position: absolute;
    top: calc(50% + clamp(8.7rem, 27vw, 10.5rem));
    left: 50%;
    width: 100%;
    overflow: visible;
    transform: translate(-50%, -50%) !important;
    display: flex;
    justify-content: center;
  }
  [data-barba-namespace="home"] .gap_home_inner_heading.u-text-style-display.is-right {
    max-width: calc(100vw - (2 * var(--site--margin)));
    font-size: clamp(2.45rem, 12.6vw, 4.4rem);
    line-height: .9;
    text-align: center;
  }
}

/* --- menu header: le voci si accendono di cyan all'hover --------- */
.navbar_link .footer_nav_span.u-text-style-main { transition: color .3s ease; }
.navbar_link:hover .footer_nav_span.u-text-style-main { color: var(--eir--accent); }
[data-theme-nav="light"] .navbar_link:hover .footer_nav_span.u-text-style-main { color: var(--eir--accent-deep); }

.menu_contain_nav .footer_nav_text .footer_nav_span { transition: color .3s ease; }
.menu_contain_nav .footer_nav_text:hover .footer_nav_span { color: var(--eir--accent-deep); }

/* --- voce "Lavori" in stand-by ----------------------------------
   Fase 7: ora è in stand-by a livello di markup (PHP `if (false)` nel
   menu desktop di home.php/work.php, e omessa dal menu mobile). Per
   riesumarla: `if (false)` -> `if (true)` e rimettere la voce nel menu
   mobile. Niente più regola CSS :has() (era ridondante). */

/* --- bottone volume: icona cyan all'hover ------------------------ */
.navbar_left_sound_btn { transition: color .3s ease; }
.navbar_left_sound_btn:hover { color: var(--eir--accent); }
[data-theme-nav="light"] .navbar_left_sound_btn:hover { color: var(--eir--accent-deep); }

/* Nota fase 6: "Storie di successo" (works_home_wrap) è in stand-by via
   PHP; la sezione services_home_wrap — che contiene GIÀ sia le voci dei
   clienti sia l'elenco servizi — risale naturalmente in quello slot.
   Nessuna sezione custom: si riusa quella originale del template. */

/* ============================================================
   FASE 6 — scheda CONTATTI (stessa coreografia di "Chi siamo")
   ============================================================ */

.eir_contact_wrap {
  z-index: 1001;
  pointer-events: none;
  width: 100%;
  height: 100dvh;
  position: fixed;
  inset: 0 auto auto 0;
}
.eir_contact_overlay_close {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  background-color: rgba(8, 8, 7, .65);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
body[data-eir-contact-status="is-open"] .eir_contact_overlay_close { pointer-events: auto; }
.eir_contact_modal {
  position: absolute;
  inset: 0 0 auto auto;
  width: 100%;
  max-width: 45rem;
  height: 100%;
  display: flex;
  flex-flow: column;
  padding: var(--site--margin, 2rem);
  background-color: var(--swatch--black-400, #0d0c0b);
  border-left: 1px solid var(--swatch--card-bg, #181715);
  pointer-events: auto;
  overflow: auto;
  overscroll-behavior: contain;
  opacity: 0;
  visibility: hidden;
}
.eir_contact_modal .g_eyebrow { visibility: visible !important; opacity: 1 !important; }
.eir_contact_head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}
/* il bottone Chiudi del template è sticky/flex-end: nella testata
   della scheda deve stare in alto a destra */
.eir_contact_head .g_btn_wrapper { position: relative; top: auto; align-self: flex-start; }
.eir_contact_content {
  display: flex;
  flex-direction: column;
  gap: clamp(1.8rem, 4.5vh, 2.6rem);
  margin-top: clamp(2.2rem, 6vh, 3.6rem);
}
.eir_contact_p {
  margin: 0;
  max-width: 36ch;
  color: var(--eir--ink);
}
.eir_contact_channels { list-style: none; margin: 0; padding: 0; }
.eir_contact_channel {
  display: flex;
  align-items: baseline;
  gap: 1.4rem;
  padding: 1.15rem 0;
  border-bottom: 1px dotted var(--swatch--card-bg, #242220);
}
.eir_contact_channel:first-child { border-top: 1px dotted var(--swatch--card-bg, #242220); }
.eir_contact_label {
  min-width: 4.5em;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
}
.eir_contact_value {
  font-family: Khteka, Arial, sans-serif;
  font-weight: 500;
  font-size: clamp(1.35rem, 2.6vw, 1.9rem);
  line-height: 1.1;
  color: var(--eir--ink);
  text-decoration: none;
  transition: color .3s ease;
  overflow-wrap: anywhere;
}
.eir_contact_value:hover { color: var(--eir--accent); }
.eir_contact_note {
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
}
.eir_contact_note b { font-weight: 400; color: var(--eir--accent); }
.eir_contact_socials {
  margin-top: auto;
  padding-top: clamp(1.6rem, 4vh, 2.4rem);
  display: flex;
  align-items: center;
  gap: .8rem;
  border-top: 1px solid var(--swatch--card-bg, #1a1917);
}
.eir_social_icon_row {
  display: flex;
  align-items: center;
  gap: .8rem;
}
.eir_about_socials .eir_social_icon_row { grid-column: 1 / -1; }
.footer_socials_ul.eir_social_icon_row {
  flex-direction: row;
  align-items: center;
  gap: .8rem;
}
.eir_social_icon_item,
.eir_social_tag_item { list-style: none; }
.eir_contact_social {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.9rem;
  height: 2.9rem;
  border: 1px solid var(--swatch--card-bg, #2a2825);
  color: var(--eir--ink-dim);
  transition: color .3s ease, border-color .3s ease, transform .3s ease;
}
.eir_social_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.9rem;
  height: 2.9rem;
  flex: 0 0 2.9rem;
  border: 1px solid var(--swatch--card-bg, #2a2825);
  color: var(--eir--ink-dim);
  transition: color .3s ease, border-color .3s ease, transform .3s ease;
}
.eir_contact_social svg,
.eir_social_icon svg { width: 1.15rem; height: 1.15rem; display: block; }
.eir_contact_social:hover {
  color: var(--eir--accent);
  border-color: var(--eir--accent);
  transform: translateY(-2px);
}
.eir_social_icon:hover,
.eir_social_icon:focus-visible {
  color: var(--eir--accent);
  border-color: var(--eir--accent);
  transform: translateY(-2px);
  outline: none;
}
.eir_contact_social_tag {
  margin-left: .5rem;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
}
.eir_social_tag {
  margin-left: .5rem;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--eir--ink-dim);
  white-space: nowrap;
}

/* FASE 8 - cursore beacon rimosso: mouse nativo, nessuna animazione custom */

/* ============================================================
   FASE 6b — sezione Servizi in tema chiaro
   Il template la disegnava scura (era pensata per stare in fondo,
   dopo "Storie di successo"); ora che occupa quello slot le serve
   la stessa veste chiara. I nomi dei servizi (.services_home_heading)
   restano senza override: sono dentro un blend-mode:difference che
   si auto-inverte in nero sopra il nuovo sfondo chiaro.
   ============================================================ */

#services.services_home_wrap {
  background-color: var(--swatch--beige-100);
}

#services.services_home_wrap .services_home_message,
#services.services_home_wrap .services_home_heading-inner,
#services.services_home_wrap .g_eyebrow_text {
  color: var(--swatch--black-400);
}

#services.services_home_wrap .services_home_testimonee {
  color: var(--swatch--black-200);
}

#services.services_home_wrap .services_home_testimonee.is-name {
  color: var(--swatch--black-400);
}

#services.services_home_wrap .g_eyebrow_circle {
  background-color: var(--swatch--black-400);
}

#services.services_home_wrap .problem_stats_index_text,
#services.services_home_wrap .problem_stats_button {
  color: var(--swatch--black-300);
}

/* ============================================================
   FASE 8 - foto reali: Contatto (prefooter) + Chi siamo (ritratto)
   ============================================================ */

/* Contatto (CTA pre-footer): la cover ora ospita la foto prefooter.
   object-fit cover con margine per la parallasse; il mobile arriva via <picture>. */
.cta_home_wrap .cta_home_cover {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transform: none !important;
  z-index: 0;
}
.cta_home_wrap .cta_home_overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1;
}
.cta_home_wrap .cta_home_visual {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: 62% 45%;
  transform: none !important;
  z-index: 0;
}

/* overlay a gradiente: titolo leggibile in alto, stacco pulito verso il footer */
.cta_home_wrap .cta_home_overlay {
  opacity: 1;
  background: linear-gradient(180deg,
    rgba(8, 8, 7, 0.46) 0%,
    rgba(8, 8, 7, 0.26) 44%,
    rgba(8, 8, 7, 0.62) 100%);
}

/* Chi siamo (about modal): ritratto del fondatore, card editoriale */
.about_modal_portrait {
  position: relative;
  width: 100%;
  max-width: 30rem;
  margin: 0 0 var(--_spacing---space--4, 1.5rem);
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border: 1px solid rgba(250, 250, 249, 0.14);
  border-radius: 0.4rem;
  background: var(--swatch--black-300, #181715);
}
.about_modal_portrait_img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 20%;
  display: block;
}

@media (max-width: 767px) {
  .about_modal_portrait { max-width: 22rem; }
  .cta_home_wrap .cta_home_visual { object-position: 50% 30%; }
}
/* ---------- fase 9: footer - tagline a destra + disponibilita con luce verde ---------- */
.footer_canvas_text.u-text-style-main { margin-left: auto; text-align: right; }
.eir-avail { display: inline-flex; align-items: center; gap: 0.5em; }
.eir-avail-dot { width: 0.55em; height: 0.55em; flex: none; border-radius: 50%; background: #35e08a; box-shadow: 0 0 0 0 rgba(53, 224, 138, 0.55); animation: eir-avail-pulse 2.4s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
@keyframes eir-avail-pulse { 0% { box-shadow: 0 0 0 0 rgba(53, 224, 138, 0.55); } 70% { box-shadow: 0 0 0 0.5em rgba(53, 224, 138, 0); } 100% { box-shadow: 0 0 0 0 rgba(53, 224, 138, 0); } }
@media (prefers-reduced-motion: reduce) { .eir-avail-dot { animation: none; } }
/* ---------- fase 10: Chi siamo - foto inferiore = ritratto Vasyl (riusa la foto in alto, taglio/proporzioni/mood del video di riferimento) ---------- */
.about_modal_video_img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 3; object-fit: cover; object-position: 50% 32%; }
@media (max-width: 767px) { .about_modal_video_img { object-position: 50% 28%; } }

/* ==== FASE 11 ============================================================ */

/* TX/06 · processo: reveal cinematografico del titolo (scroll) */
[data-barba-namespace="home"] .process_heading_svg {
  clip-path: inset(0 100% 0 0);
  opacity: 0;
  transform: translateY(14px);
  transition:
    clip-path 1.15s cubic-bezier(.16, 1, .3, 1),
    opacity .7s ease .05s,
    transform 1.1s cubic-bezier(.16, 1, .3, 1);
  will-change: clip-path, opacity, transform;
}
[data-barba-namespace="home"] .process_heading_svg.eir-proc-in {
  clip-path: inset(0 0 0 0);
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  [data-barba-namespace="home"] .process_heading_svg {
    clip-path: none; opacity: 1; transform: none; transition: none;
  }
}

/* brand wall: nuovi loghi ufficiali monocromatici, resa coerente */
[data-barba-namespace="home"] .problems_home_item .problems_home_image {
  opacity: .74;
  transition: opacity .35s ease;
}
[data-barba-namespace="home"] .problems_home_item:hover .problems_home_image {
  opacity: 1;
}

/* ==== FASE 12 ============================================================ */

/* Contatto: headline, pulsante e prova sociale formano un'unica composizione
   centrata. Il ritmo resta ampio, ma senza il vuoto artificiale degli allori. */
[data-barba-namespace="home"] .cta_home_contain {
  justify-content: center;
  row-gap: clamp(3rem, 6vh, 5rem);
}
[data-barba-namespace="home"] .cta_home_inner {
  margin-top: 0;
  margin-bottom: 0;
  flex: none;
}
[data-barba-namespace="home"] .cta_home_header { margin-top: 0; }
[data-barba-namespace="home"] .cta_home_bottom .u-section-spacer { display: none; }
[data-barba-namespace="home"] .cta_home_bottom {
  display: flex;
  justify-content: center;
}
[data-barba-namespace="home"] .cta_home_proof {
  width: min(100%, 52rem);
  margin-bottom: 0;
  padding: clamp(.95rem, 1.6vw, 1.35rem) clamp(1rem, 2vw, 1.55rem);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: clamp(1.4rem, 2.8vw, 3rem);
  row-gap: 1rem;
  border-top: 1px solid rgba(232, 232, 227, .28);
  border-bottom: 1px solid rgba(232, 232, 227, .28);
  background: rgba(8, 8, 7, .34);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}
[data-barba-namespace="home"] .cta_home_awards {
  justify-content: center;
}
[data-barba-namespace="home"] .eir_google_reviews {
  width: auto;
  padding: 0;
  border: 0;
  gap: .9rem;
}
[data-barba-namespace="home"] .eir_google_mark {
  width: 3rem;
  height: 3rem;
}
[data-barba-namespace="home"] .cta_home_testimonial_message.u-text-style-h5 {
  max-width: 32ch;
  margin: 0;
  text-align: left;
}

/* ==== FASE 13 ============================================================ */

/* Contatto - MOBILE: gerarchia piu netta, CTA compatta e prova sociale
   raccolta in un solo blocco sulla foto verticale. */
@media (max-width: 767px) {
  [data-barba-namespace="home"] .cta_home_contain {
    min-height: 150svh;
    padding: clamp(4.5rem, 10svh, 6rem) var(--site--margin) clamp(2rem, 6svh, 3.5rem);
    justify-content: space-between;
    row-gap: clamp(4rem, 10svh, 7rem);
  }
  [data-barba-namespace="home"] .cta_home_inner,
  [data-barba-namespace="home"] .cta_home_bottom {
    width: 100%;
    padding-inline: 0;
  }
  [data-barba-namespace="home"] .cta_home_header {
    width: 100%;
    padding-inline: 0;
    row-gap: clamp(1.5rem, 5vh, 2.4rem);
  }
  [data-barba-namespace="home"] .cta_home_heading_contain {
    width: 100%;
    align-items: center;
    row-gap: .18rem;
  }
  [data-barba-namespace="home"] .cta_home_heading.u-text-style-display {
    font-size: clamp(2.25rem, 11.6vw, 3.25rem);
    line-height: .9;
  }
  [data-barba-namespace="home"] .cta_home_heading.u-text-style-display.is-2 {
    transform: translate(3%);
  }
  [data-barba-namespace="home"] .cta_home_heading.u-text-style-display.is-3 {
    transform: translate(-1%);
  }
  [data-barba-namespace="home"] .cta_heading_inner {
    column-gap: .55rem;
  }
  [data-barba-namespace="home"] .cta_home_header > .g_btn_main {
    min-height: 3rem;
    max-width: 100%;
    padding: .68rem .68rem .68rem 1rem;
    column-gap: .8rem;
  }
  [data-barba-namespace="home"] .cta_home_header > .g_btn_main .g_btn_text {
    font-size: clamp(.92rem, 4.2vw, 1.08rem);
    line-height: 1;
    white-space: nowrap;
  }
  [data-barba-namespace="home"] .cta_home_header > .g_btn_main .g_btn_aside_wrap {
    width: 2.25rem;
    height: 2.25rem;
    flex: none;
  }
  [data-barba-namespace="home"] .cta_home_proof {
    width: min(100%, 22rem);
    padding: 1rem;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    row-gap: 1rem;
    background: rgba(8, 8, 7, .48);
  }
  [data-barba-namespace="home"] .eir_google_reviews {
    width: 100%;
    justify-content: center;
  }
  [data-barba-namespace="home"] .eir_google_mark {
    width: 3.2rem;
    height: 3.2rem;
  }
  [data-barba-namespace="home"] .eir_google_review_label {
    font-size: .62rem;
  }
  [data-barba-namespace="home"] .eir_google_star {
    width: 1.05rem;
    height: 1.05rem;
  }
  [data-barba-namespace="home"] .cta_home_testimonial_message.u-text-style-h5 {
    width: 100%;
    max-width: 28ch;
    padding: 1rem .15rem 0;
    border-top: 2px solid var(--eir--accent);
    border-left: 0;
    text-align: center;
    font-size: clamp(.98rem, 4.5vw, 1.15rem);
    line-height: 1.22;
  }
}

/* ==== FASE 14 ============================================================ */

/* Manifesto: tre blocchi di lettura progressivi, senza sacrificare il
   contrasto del testo che non e' ancora attivo. */
[data-barba-namespace="home"] [data-eir-manifesto] {
  overflow: visible;
}
[data-barba-namespace="home"] .eir_manifesto_block {
  --eir-manifesto-rail: 0;
  display: block;
  position: relative;
  text-wrap: pretty;
}
[data-barba-namespace="home"] .eir_manifesto_block + .eir_manifesto_block {
  margin-top: 0.58em;
}
[data-barba-namespace="home"] .eir_manifesto_block::before {
  content: "";
  position: absolute;
  top: 0.12em;
  bottom: 0.1em;
  left: -0.42em;
  width: 2px;
  background: var(--eir--accent);
  box-shadow: 0 0 14px rgba(0, 217, 255, 0.42);
  opacity: var(--eir-manifesto-rail);
  transform: scaleY(var(--eir-manifesto-rail));
  transform-origin: 50% 0%;
  pointer-events: none;
}
[data-barba-namespace="home"] [data-eir-manifesto].eir-manifesto-ready .eir_manifesto_block {
  will-change: opacity, transform;
}

@media (prefers-reduced-motion: reduce) {
  [data-barba-namespace="home"] .eir_manifesto_block {
    opacity: 1 !important;
    transform: none !important;
  }
  [data-barba-namespace="home"] .eir_manifesto_block::before {
    display: none;
  }
}

/* ============================================================
   fase 15 (v2): strumenti di processo — display scuro
   Al posto dei video demo: tre visual SVG vivi, costruiti e
   animati da eir-motion.js (initProcessPanels), leggibili
   all'istante. Fondo SCURO "display": lift tonale radiale +
   cornice hairline per staccarsi dalla sezione senza diventare
   una card bianca estranea al linguaggio cosmico del sito; la
   grafica cyan (#00d9ff) emette luce come hero/preloader.
   Spigoli vivi, niente border-radius (regola del brand).
   ============================================================ */
.eir_proc_panel {
  aspect-ratio: 16 / 9;
  background: radial-gradient(120% 135% at 50% 36%, #101316 0%, #0a0b0b 58%, #080807 100%);
  border: 1px solid rgba(232, 232, 227, 0.09);
  display: flex;
  position: relative;
  overflow: clip;
}
.eir_proc_svg {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .9s ease, transform 1.1s cubic-bezier(.16, 1, .3, 1);
}
.eir_proc_svg.is-on { opacity: 1; transform: none; }
.eir_proc_svg text {
  font-family: var(--_typography---font--tertiary-family, "Suisse Mono", monospace);
  letter-spacing: .07em;
}
.eir_proc_svg .epx_blink { animation: eir-proc-blink 2.2s ease-in-out infinite; }
@keyframes eir-proc-blink {
  0%, 100% { opacity: .15; }
  50% { opacity: .9; }
}
/* crosshair d'ispezione: segue il cursore, visibile solo in hover */
.eir_proc_svg .epx_cross { opacity: 0; transition: opacity .3s ease; }
@media (hover: hover) and (pointer: fine) {
  .eir_proc_panel:hover .epx_cross { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .eir_proc_svg { opacity: 1; transform: none; transition: none; }
  .eir_proc_svg .epx_blink { animation: none; opacity: .7; }
}

/* ==== FASE 18 ============================================================ */

/* Contatto ("segnale in uscita") - solo MOBILE, solo home.

   VINCOLO GEOMETRICO (il motivo di tutto): la scena vera (Vasyl che tiene il
   laptop col sito acceso) e' quasi quadrata - soggetto e computer occupano
   insieme tutta la larghezza, ~0.90. Un box a tutto schermo su telefono vale
   invece ~0.42 (390x928). Con object-fit:cover un box cosi stretto mostra solo
   il ~43% della larghezza della scena: o sparisce il computer, o si taglia il
   busto. "Foto a tutto schermo" e "si vede il computer" sono incompatibili qui.

   Scelta (Vasyl, 17/07/2026): vince la scena intera. Su mobile la foto NON e'
   piu' uno sfondo full-bleed ma una FASCIA in colonna con la scena completa;
   titolo + pulsante sopra, recensioni sotto, tutto raggruppato e centrato,
   senza vuoti. Desktop, tablet e /work restano full-bleed e intatti. */
@media (max-width: 767px) {
  /* la sezione diventa la colonna: header -> foto -> recensioni.
     display:contents scioglie .cta_home_contain, cosi i suoi due figli e la
     cover diventano fratelli ordinabili senza toccare l'HTML. */
  [data-barba-namespace="home"] .cta_home_wrap {
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-block: clamp(2.5rem, 6svh, 3.5rem);
    row-gap: clamp(1.5rem, 3.5svh, 2.25rem);
  }
  [data-barba-namespace="home"] .cta_home_contain {
    display: contents;
  }
  [data-barba-namespace="home"] .cta_home_inner  { order: 1; }
  [data-barba-namespace="home"] .cta_home_cover  { order: 2; }
  [data-barba-namespace="home"] .cta_home_bottom { order: 3; }

  /* i margini laterali tornano sui testi: la fascia va da bordo a bordo */
  [data-barba-namespace="home"] .cta_home_inner,
  [data-barba-namespace="home"] .cta_home_bottom {
    padding-inline: var(--site--margin);
    flex: none;
  }

  /* la cover esce dal fondo e prende le proporzioni esatte del ritaglio
     (vasyl-kun-...-scena-mobile.jpg, 1024x1135): cosi cover non taglia nulla. */
  [data-barba-namespace="home"] .cta_home_wrap .cta_home_cover {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    /* a tutta larghezza sul telefono; oltre i ~480px la fascia si fermerebbe
       (la sua altezza segue la larghezza) e la sezione esploderebbe: a 767px
       senza tetto la fascia vale 850px e la sezione 1467px. */
    max-width: 30rem;
    height: auto !important;
    aspect-ratio: 1024 / 1135;
    flex: none;
  }
  [data-barba-namespace="home"] .cta_home_wrap .cta_home_visual {
    object-position: 50% 50%;
    /* i bordi alto/basso si sciolgono nel nero della sezione: niente stacco
       netto da "immagine incollata", la fascia resta nel linguaggio cosmico */
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 5%, #000 92%, transparent 100%);
            mask-image: linear-gradient(180deg, transparent 0, #000 5%, #000 92%, transparent 100%);
  }
  /* il velo serviva a leggere il titolo SOPRA la foto: ora il titolo e' fuori */
  [data-barba-namespace="home"] .cta_home_wrap .cta_home_overlay {
    display: none;
  }

  /* titolo e pulsante = un blocco solo, appoggiato sopra la foto */
  [data-barba-namespace="home"] .cta_home_header {
    row-gap: clamp(1rem, 2.2svh, 1.35rem);
  }
  /* headline: riempie la larghezza utile. 12.2vw tiene la riga piu lunga
     ("una presenza") entro i margini fino a 767px, con ~6% di margine di
     sicurezza se il font display non carica. */
  [data-barba-namespace="home"] .cta_home_heading.u-text-style-display {
    font-size: clamp(2.35rem, 12.2vw, 3.5rem);
    line-height: .88;
  }
  [data-barba-namespace="home"] .cta_home_heading_contain {
    row-gap: .12rem;
  }
}


/* =====================================================================
   fase 21 — banner consenso cookie (eir-consent.js)
   Dark brutalist coerente col sito: card su nero, bordo sottile,
   etichette mono, bottoni squadrati con invert su hover. Mobile:
   bottom sheet a tutta larghezza; desktop: card in basso a sinistra.
   ===================================================================== */
.eir-consent {
  position: fixed;
  z-index: 4000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 4vw, 2rem);
  padding-bottom: calc(clamp(1rem, 4vw, 2rem) + env(safe-area-inset-bottom, 0px));
  pointer-events: none;
  opacity: 0;
  transition: opacity .5s var(--animation-secondary, ease);
}
.eir-consent.is-open {
  pointer-events: auto;
  opacity: 1;
}
.eir-consent_card {
  width: 100%;
  max-width: 30rem;
  background: rgba(12, 12, 11, .92);
  border: 1px solid rgba(232, 232, 227, .16);
  color: var(--eir--ink);
  padding: clamp(1.5rem, 4.5vw, 2.1rem);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .5);
  max-height: calc(100svh - 2rem);
  overflow-y: auto;
  opacity: 0;
  transform: translateY(18px) scale(.98);
  transition: opacity .55s var(--animation-secondary, ease), transform .55s var(--animation-expo-out, ease);
}
.eir-consent.is-open .eir-consent_card {
  opacity: 1;
  transform: translateY(0) scale(1);
}
@media (prefers-reduced-motion: reduce) {
  .eir-consent { transition: none; }
  .eir-consent_card { transition: none; transform: none; }
}
.eir-consent_title {
  font-size: 1.16rem;
  font-weight: 500;
  line-height: 1.16;
  margin: 0 0 .5rem;
  color: var(--eir--ink);
}
.eir-consent_eyebrow {
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .16em;
  color: var(--eir--accent);
  margin-bottom: .65rem;
}
.eir-consent_text {
  font-size: .82rem;
  line-height: 1.5;
  color: rgba(232, 232, 227, .82);
  margin: 0 0 1rem;
}
.eir-consent_note {
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .62rem;
  letter-spacing: .06em;
  color: var(--eir--ink-dim);
  margin: 0 0 .85rem;
}
.eir-consent_prefs { margin: 0 0 .9rem; border-top: 1px solid rgba(232,232,227,.12); }
.eir-consent_row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .8rem;
  padding: .6rem 0;
  border-bottom: 1px solid rgba(232,232,227,.12);
  cursor: pointer;
}
.eir-consent_row.is-locked { cursor: default; }
.eir-consent_row_main { display: block; }
.eir-consent_row_title {
  display: block;
  font-size: .78rem;
  margin-bottom: .15rem;
}
.eir-consent_row_desc {
  display: block;
  font-size: .66rem;
  line-height: 1.4;
  color: var(--eir--ink-dim);
}
.eir-consent_row input {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  width: 1.05rem;
  height: 1.05rem;
  margin-top: .1rem;
  border: 1px solid rgba(232,232,227,.5);
  background: transparent;
  cursor: inherit;
  position: relative;
}
.eir-consent_row input:checked { background: var(--eir--accent); border-color: var(--eir--accent); }
.eir-consent_row input:checked::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(45deg, transparent 42%, var(--eir--black) 42%, var(--eir--black) 58%, transparent 58%),
    linear-gradient(-45deg, transparent 42%, var(--eir--black) 42%, var(--eir--black) 58%, transparent 58%);
}
.eir-consent_row input:disabled { opacity: .55; }
.eir-consent_actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0;
}
.eir-consent_btn {
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .62rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--eir--ink);
  background: transparent;
  border: 1px solid rgba(232,232,227,.45);
  padding: .55rem .8rem;
  cursor: pointer;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.eir-consent_btn:hover { background: var(--eir--ink); color: var(--eir--black); border-color: var(--eir--ink); }
.eir-consent_btn.is-primary { background: var(--eir--ink); color: var(--eir--black); border-color: var(--eir--ink); }
.eir-consent_btn.is-primary:hover { background: var(--eir--accent); border-color: var(--eir--accent); }
.eir-consent_btn.is-ghost { border-color: transparent; text-decoration: underline; text-underline-offset: .25em; padding-left: .2rem; padding-right: .2rem; }
.eir-consent_btn.is-ghost:hover { background: transparent; color: var(--eir--accent); border-color: transparent; }
@media (max-width: 767px) {
  .eir-consent_actions .eir-consent_btn { flex: 1 1 auto; text-align: center; }
}

/* riga legale nel footer (privacy / cookie / preferenze) */
.eir-footer-legal {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .55rem;
  margin-top: .4rem;
  font-family: "Suisse Mono", Arial, monospace;
  font-size: .6rem;
  letter-spacing: .12em;
  color: var(--eir--ink-dim);
}
.eir-footer-legal a,
.eir-footer-legal button {
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: .25em;
  transition: color .25s ease;
}
.eir-footer-legal a:hover,
.eir-footer-legal button:hover { color: var(--eir--accent); }

/* =====================================================================
   fase 21 — "Il divario" (#eir-gap): no overlap immagine/testo su viewport bassi
   Bug: la cover immagine e' assoluta e centrata (top:50%), il paragrafo e'
   ancorato in basso da justify-content:space-between. Su desktop a viewport
   basso (scaling Windows 125/150%, o finestre corte) l'immagine centrata e il
   paragrafo si toccano e l'immagine (assoluta, dopo nel DOM) copre il testo.
   Fix: su schermi desktop bassi limito l'altezza della cover in funzione dello
   spazio verticale disponibile, cosi' il suo bordo inferiore resta sopra il
   paragrafo. Su viewport alti la clausola e' inerte -> desktop invariato.
   Gate (pointer:fine) => solo mouse/trackpad, non tocca telefoni landscape.
   ===================================================================== */
@media (pointer: fine) and (max-height: 760px) {
  #eir-gap .gap_home_cover {
    /* 24rem di margine = 2x(paragrafo+padding ~165px) + respiro; sotto ~704px
       di altezza la cover si rimpicciolisce quel tanto che basta a non toccare
       il testo (gap minimo ~25px). min() con 20rem tiene l'altezza naturale
       (320px) sui viewport alti -> desktop invariato per vh >= 704px. */
    max-height: min(20rem, calc(100vh - 24rem));
  }
  /* la cover, accorciata, resta riempita senza bande laterali */
  #eir-gap .gap_home_image { object-fit: cover; width: 100%; }
}
/* rete di sicurezza: se un residuo dovesse ancora sfiorare, il testo resta
   leggibile sopra l'immagine (non nasconde nulla sui viewport normali) */
#eir-gap .gap_home_bottom { position: relative; z-index: 2; }
/* Icona contatti footer — sostituisce la freccia Unicode (glifo incoerente tra font/OS) */
.eir-contact-ico {
  display: inline-flex;
  align-items: center;
  margin-right: .35em;
  color: var(--eir--accent);
  vertical-align: -0.1em;
}
.eir-contact-ico svg {
  display: block;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

/* Puntatore del mouse - freccia pixel-art in blu di brand, coerente con lo stile pixelato del sito */
html, body {
  cursor: url('../images/eir-cursor-pixel.png') 1 1, auto;
}

/* --- Manina (cursor:pointer) su TUTTE le CTA cliccabili -----------------
   La freccia pixel sopra e' su html/body ed essendo `cursor` una proprieta'
   EREDITATA, ogni link/bottone senza una regola propria eredita la freccia
   e perde la manina nativa del browser. Qui la ripristiniamo in modo
   coerente su tutti gli elementi interattivi (CTA, link, bottoni, toggle). */
a[href],
button,
label[for],
select,
summary,
[role="button"],
[role="link"],
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="checkbox"],
input[type="radio"],
.g_btn_main,
[data-btn-default],
[data-eir-project],
[data-eir-contact],
[data-open-modal],
[data-hover-highlight],
.eir-consent-open,
.eir-legal_esc,
.eir_google_reviews {
  cursor: pointer;
}
/* elementi disabilitati / non interattivi: niente manina */
button:disabled,
input:disabled,
[aria-disabled="true"],
.eir-consent_row.is-locked {
  cursor: default;
}

/* =====================================================================
   fase 27 — cookie banner: fascia desktop a tutta larghezza + overlay hero
   ===================================================================== */
/* scroll del sito bloccato mentre il banner e' visibile */
body.eir-consent-lock { overflow: hidden; }

/* overlay a tutta pagina: VETRO OPACIZZATO (fase 29). Il canvas riusa lo shader
   "materia cosmica" della hero come texture; sotto, backdrop-filter sfoca e
   scurisce il sito -> il contenuto non e' piu' chiaramente riconoscibile.
   Fallback senza backdrop-filter: overlay pieno opaco (vedi @supports). */
.eir-consent-overlay {
  position: fixed;
  inset: 0;
  z-index: 3990;
  background: rgba(8, 8, 7, .5);
  backdrop-filter: blur(24px) saturate(.85);
  -webkit-backdrop-filter: blur(24px) saturate(.85);
  opacity: 0;
  transition: opacity .5s var(--animation-secondary, ease);
  pointer-events: auto;
}
.eir-consent-overlay.is-open { opacity: 1; }
.eir-consent-overlay_canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  opacity: .55;
}
/* browser senza backdrop-filter: senza sfocatura rendo l'overlay pieno,
   cosi' il sito resta comunque non riconoscibile */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .eir-consent-overlay { background: var(--eir--black); }
  .eir-consent-overlay_canvas { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .eir-consent-overlay { transition: none; }
}

/* fase 29 — la card e' ora centrale e identica su desktop e mobile:
   la vecchia fascia inferiore desktop (fase 27) e' stata rimossa. */