/* ============================================================
   F — SISTEMA · Pagine servizio
   Caricato dopo style.css, di cui riusa token e componenti.
   Qui vive solo ciò che sulla home non esiste.
   ============================================================ */

.pagina-servizio h1{ margin:0; font-weight:600; letter-spacing:-.035em; line-height:1.04; }

/* ── briciole ── */
.breadcrumb{ border-bottom:1px solid var(--line); background:var(--surface); }
.breadcrumb ol{ display:flex; flex-wrap:wrap; align-items:center; gap:.45rem;
  padding-block:.85rem; font-size:.84rem; color:var(--ink-3); }
.breadcrumb li + li::before{ content:"/"; margin-right:.45rem; color:var(--line-2); }
.breadcrumb a{ color:var(--ink-3); text-decoration:none; }
.breadcrumb a:hover{ color:var(--acc); text-decoration:underline; }
.breadcrumb [aria-current]{ color:var(--ink); font-weight:500; }

/* ── hero di servizio ── */
.svc-hero{ padding-block:clamp(2.2rem,4.5vw,3.6rem) clamp(1.8rem,3.5vw,2.8rem); }
.svc-hero-grid{ display:grid; grid-template-columns:1.02fr .98fr;
  gap:clamp(1.8rem,4vw,3.4rem); align-items:center; }
.svc-hero-grid > *{ min-width:0; }
.svc-hero .eyebrow{ display:block; margin-bottom:1rem; }
.svc-hero h1{ font-size:clamp(2.1rem,1.2rem + 3.2vw,3.5rem); max-width:16ch; margin-bottom:1.15rem; }
.svc-hero .lede{ margin-bottom:1.9rem; }
.svc-hero-note{ margin-top:1.1rem; font-size:.85rem; color:var(--ink-3); }
.svc-hero-fig{ margin:0; border-radius:20px; overflow:hidden; border:1px solid var(--line); }
.svc-hero-fig img{ width:100%; aspect-ratio:5/3; object-fit:cover; }
@media(max-width:900px){
  .svc-hero-grid{ grid-template-columns:1fr; }
  .svc-hero h1{ max-width:none; }
  .svc-hero-fig{ order:-1; }
}

.svc-hero--hub{ text-align:left; }
.svc-hero--hub h1{ font-size:clamp(2.2rem,1.2rem + 3.6vw,3.8rem); max-width:20ch; }

/* ── striscia dei fatti ── */
.facts{ border-block:1px solid var(--line); background:var(--surface); }
.facts ul{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.facts li{ min-width:0; padding:1.25rem 1.4rem; border-left:1px solid var(--line); }
.facts li:first-child{ border-left:0; padding-left:0; }
.facts .k{ display:block; font-size:.7rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-3); margin-bottom:.45rem; }
.facts b{ display:block; font-size:1.12rem; font-weight:600; letter-spacing:-.025em; }
.facts .d{ display:block; font-size:.83rem; color:var(--ink-2); margin-top:.2rem; }
@media(max-width:900px){ .facts ul{ grid-template-columns:1fr 1fr; }
  .facts li:nth-child(3){ border-left:0; padding-left:0; }
  .facts li:nth-child(-n+2){ border-bottom:1px solid var(--line); } }
@media(max-width:540px){ .facts ul{ grid-template-columns:1fr; }
  .facts li{ border-left:0; padding-left:0; border-bottom:1px solid var(--line); }
  .facts li:last-child{ border-bottom:0; } }

/* ── avviso di ambito ── */
.notice{ margin-top:clamp(1.6rem,3vw,2.4rem); background:var(--acc-bg); border-radius:14px;
  padding:1.1rem 1.3rem; font-size:.94rem; color:var(--ink-2); border-left:3px solid var(--acc); }
.notice strong{ color:var(--ink); font-weight:600; }

/* ── griglia dei guasti: l'elemento portante della pagina ── */
.faults-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.faults-grid > *{ min-width:0; }
.fault{ background:var(--surface); border:1px solid var(--line); border-radius:16px;
  padding:1.35rem 1.4rem 1.15rem; display:flex; flex-direction:column;
  transition:border-color .15s ease, transform .15s ease; }
.fault:hover{ border-color:var(--line-2); transform:translateY(-2px); }
.fault-s{ font-size:1.06rem; font-weight:600; letter-spacing:-.025em; line-height:1.25;
  margin-bottom:1rem; padding-bottom:.9rem; border-bottom:1px solid var(--line); }
.fault dl{ margin:0; flex:1; }
.fault dt{ font-size:.66rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-3); margin-bottom:.25rem; }
.fault dd{ margin:0 0 .9rem; font-size:.9rem; line-height:1.5; color:var(--ink-2); }
.fault dd:last-of-type{ margin-bottom:1.1rem; }
.fault-e{ display:flex; align-items:center; gap:.45rem; font-size:.78rem; font-weight:600;
  letter-spacing:.02em; color:var(--ink-3); padding-top:.85rem; border-top:1px solid var(--line); }
.fault-e::before{ content:""; width:7px; height:7px; border-radius:50%; flex:none;
  border:1.5px solid var(--ink-3); }
.fault-e.is-ok{ color:var(--ok); }
.fault-e.is-ok::before{ background:var(--ok); border-color:var(--ok); }
@media(max-width:1000px){ .faults-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:620px){ .faults-grid{ grid-template-columns:1fr; } }

/* ── banda immagine + passi ── */
.band{ margin:0 0 clamp(1.8rem,3vw,2.6rem); border-radius:18px; overflow:hidden;
  border:1px solid var(--line); }
.band img{ width:100%; aspect-ratio:3/1; object-fit:cover; }
.steps{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.steps li{ background:var(--surface); padding:1.4rem 1.25rem 1.6rem; min-width:0; }
.steps .n{ display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%;
  background:var(--acc); color:#fff; font-size:.82rem; font-weight:600; margin-bottom:.85rem; }
.steps b{ display:block; font-weight:600; letter-spacing:-.02em; margin-bottom:.3rem; }
.steps p{ font-size:.88rem; color:var(--ink-2); }
@media(max-width:1000px){ .steps{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .steps{ grid-template-columns:1fr; } }

/* ── quando non conviene ── */
.nope{ background:var(--surface); border:1px solid var(--line); border-radius:20px;
  padding:clamp(1.7rem,3.2vw,2.8rem); display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(1.8rem,3.5vw,3.2rem); align-items:start; }
.nope > *{ min-width:0; }
.nope .h2{ margin:.9rem 0 1rem; }
.nope-poi{ margin-top:1.1rem; color:var(--ink-2); font-size:.95rem; }
.nope-list li{ padding:1rem 0; border-top:1px solid var(--line); }
.nope-list li:first-child{ border-top:0; padding-top:0; }
.nope-list b{ display:block; font-weight:600; letter-spacing:-.02em; margin-bottom:.2rem; }
.nope-list span{ font-size:.9rem; color:var(--ink-2); }
@media(max-width:860px){ .nope{ grid-template-columns:1fr; } }

/* ── come si forma il prezzo ── */
.price{ background:var(--surface); border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.price-row{ display:grid; grid-template-columns:8.5rem 15rem 1fr; gap:1.4rem; align-items:baseline;
  padding:1.15rem clamp(1.2rem,2.5vw,1.8rem); border-top:1px solid var(--line); }
.price-row:first-child{ border-top:0; }
.price-row > *{ min-width:0; }
.price-row .k{ font-size:.7rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-3); }
.price-row b{ font-weight:600; letter-spacing:-.02em; }
.price-row .d{ font-size:.9rem; color:var(--ink-2); }
.price-note{ margin-top:1rem; font-size:.94rem; font-weight:600; color:var(--acc-2); }
@media(max-width:860px){
  .price-row{ grid-template-columns:1fr; gap:.3rem; }
  .price-row .k{ order:-1; }
}

/* ── cosa trattiamo ── */
.tagcloud{ display:flex; flex-wrap:wrap; gap:.5rem; }
.tagcloud li{ font-size:.9rem; padding:.5em .95em; border-radius:999px;
  background:var(--surface); border:1px solid var(--line); color:var(--ink-2); }
.indip{ margin-top:1.6rem; max-width:70ch; font-size:.92rem; color:var(--ink-3); }

/* ── recensione singola ── */
.quote--solo{ max-width:52ch; }

/* ── servizi correlati e griglia dell'hub ── */
.related{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.related > *{ min-width:0; }
.rel-card{ background:var(--surface); border:1px solid var(--line); border-radius:16px;
  padding:1.3rem 1.4rem 1.4rem; display:grid; grid-template-columns:46px 1fr; gap:1rem;
  align-items:start; text-decoration:none; color:inherit;
  transition:border-color .15s ease, transform .15s ease; }
.rel-card:hover{ border-color:var(--acc); transform:translateY(-2px); }
.rel-card.is-off{ cursor:default; }
.rel-card.is-off:hover{ border-color:var(--line-2); transform:none; }
.rel-card img{ width:46px; height:46px; border-radius:10px; object-fit:cover; }
.rel-card .t{ display:block; font-weight:600; font-size:1.02rem; letter-spacing:-.02em; line-height:1.25; }
.rel-card .d{ display:block; font-size:.88rem; color:var(--ink-2); margin-top:.25rem; }
.rel-card .go{ display:inline-block; margin-top:.7rem; font-size:.83rem; font-weight:600; color:var(--acc); }
.rel-card .go::after{ content:" →"; }
@media(max-width:980px){ .related{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .related{ grid-template-columns:1fr; } }

.pagina-servizio .svc-group > h2{ font-size:.72rem; font-weight:700; letter-spacing:.13em;
  text-transform:uppercase; color:var(--ink-3); padding-bottom:.8rem;
  border-bottom:1px solid var(--line-2); margin-bottom:1.2rem; }

/* ── varianti dei passi ── */
.steps--4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.steps--tall li{ padding:1.6rem 1.5rem 1.8rem; }
.steps--tall p{ font-size:.9rem; }
@media(max-width:1000px){ .steps--4{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .steps--4{ grid-template-columns:1fr; } }
.band--tall img{ aspect-ratio:3/1; }
.svc-hero-fig--tall img{ aspect-ratio:4/5; }
@media(max-width:900px){ .svc-hero-fig--tall img{ aspect-ratio:4/3; } }

/* ── indirizzo della sede nell'hero ── */
.sede-addr{ display:block; margin-top:1.6rem; font-style:normal; background:var(--surface);
  border:1px solid var(--line); border-left:3px solid var(--acc); border-radius:12px;
  padding:1rem 1.2rem; font-size:.94rem; color:var(--ink-2); max-width:34rem; }
.sede-addr b{ display:block; font-weight:600; font-size:1.02rem; color:var(--ink);
  letter-spacing:-.02em; margin-bottom:.15rem; }
.sede-addr span{ display:block; margin-top:.6rem; font-size:.85rem; color:var(--ink-3); }

/* ── elenco sedi cliccabile ── */
.sedi--link li{ padding:0; }
.sedi--link a{ display:block; padding:1.2rem 1.3rem; text-decoration:none; color:inherit;
  border-radius:14px; transition:background .15s ease; }
.sedi--link a:hover{ background:var(--bg); }
.sedi--link a:hover b{ color:var(--acc-2); }

/* ── griglia delle sedi nell'hub ── */
.sede-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.sede-grid > *{ min-width:0; }
.sede-card{ display:block; background:var(--surface); border:1px solid var(--line);
  border-radius:16px; padding:1.4rem 1.5rem 1.5rem; text-decoration:none; color:inherit;
  transition:border-color .15s ease, transform .15s ease; }
.sede-card:hover{ border-color:var(--acc); transform:translateY(-2px); }
.sede-card.is-lab{ border-color:var(--acc); background:var(--acc-bg); }
.sede-card .role{ display:inline-block; font-size:.66rem; font-weight:700; letter-spacing:.11em;
  text-transform:uppercase; color:var(--acc); margin-bottom:.6rem; }
.sede-card b{ display:block; font-size:1.24rem; font-weight:600; letter-spacing:-.03em; margin-bottom:.2rem; }
.sede-card .addr{ display:block; font-size:.88rem; color:var(--ink-2); }
.sede-card .zone{ display:block; margin-top:.8rem; padding-top:.8rem; border-top:1px solid var(--line);
  font-size:.8rem; color:var(--ink-3); }
.sede-card .go{ display:inline-block; margin-top:.9rem; font-size:.85rem; font-weight:600; color:var(--acc); }
.sede-card .go::after{ content:" →"; }
@media(max-width:980px){ .sede-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .sede-grid{ grid-template-columns:1fr; } }