/* ==========================================================================================
   servizi-isole.css — gli oggetti dimostrativi delle pagine servizi (agente servizi).
   vt = vetrina siti · sb = calcolatore surebet · tg = Telegram AUTO WP · si = sistema visivo ·
   serp = simulazione SERP · pl = pipeline AI · gd = gestione digitale · vd = video · seo = Search Console.
   Qui solo le parti comuni agli oggetti; ogni oggetto ha il suo file (servizi-<oggetto>.css).
   Per usare un'isola fuori da /servizi/: $pagina['css'] = [..., 'servizi-isole', 'servizi-surebet'].
   ========================================================================================== */

.sv-pannello, .sb, .tg__pannello, .si, .serp, .pl {
  position: relative;
  background: linear-gradient(180deg, rgba(21, 17, 42, .55), rgba(13, 10, 26, .9)), var(--nero-2);
  box-shadow: inset 0 0 0 1px var(--linea), 0 50px 140px -70px rgba(105, 49, 170, .75);
}
.sv-btn-mini {
  display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 14px; border-radius: 999px;
  box-shadow: inset 0 0 0 1px var(--linea-forte); color: var(--carta-2);
  font: 500 11px/1 var(--font-mono); letter-spacing: .04em; text-transform: uppercase; white-space: nowrap;
  transition: background-color .4s var(--curva-expo), color .4s, box-shadow .4s;
}
.sv-btn-mini:hover { color: var(--carta); box-shadow: inset 0 0 0 1px var(--carta-2); }
.sv-btn-mini[aria-pressed="true"], .sv-btn-mini[aria-selected="true"] { background: var(--carta); color: var(--nero); box-shadow: none; }
.sv-btn-mini:disabled { color: var(--carta-3); box-shadow: inset 0 0 0 1px var(--linea); cursor: not-allowed; }

/* ---------------------------------------------------------------- spazio riservato ------------ */
/* Le isole si montano pigramente: il contenitore ha già l'altezza dell'oggetto montato (misurata a
   1440 e 390 px), così il passaggio ripiego → React non sposta la pagina (CLS). */
.sv-oggetto[data-isola="surebet"] { min-height: 960px; }
.sv-oggetto[data-isola="telegram"] { min-height: 1330px; }
.sv-mini[data-isola="surebet"] { min-height: 520px; }
.sv-mini[data-isola="pipeline-ai"] { min-height: 360px; }
.isola[data-isola="serp"] { min-height: 1460px; }
.sv-oggetto[data-isola="pipeline-ai"] { min-height: 1060px; }
@media (min-width: 820px) {
  .sv-oggetto[data-isola="surebet"] { min-height: 707px; }
  .sv-mini[data-isola="surebet"] { min-height: 476px; }
  .isola[data-isola="serp"] { min-height: 897px; }
}
@media (min-width: 900px) {
  .sv-oggetto[data-isola="pipeline-ai"] { min-height: 600px; }
  .sv-mini[data-isola="pipeline-ai"] { min-height: 300px; }
}
@media (min-width: 1000px) { .sv-oggetto[data-isola="telegram"] { min-height: 470px; } }