/* Pagine servizio — base presa da top-3-google.css (identico a google-ads.css e meta-ads.css), più i componenti del rework 10/2026 */
.service-page{overflow:hidden}
.service-hero{padding:72px 0 64px}
.service-hero__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:48px;align-items:center}
.service-eyebrow,.service-heading>span,.service-cta span{display:inline-block;color:rgba(0,0,0,.62);font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.service-hero h1{max-width:820px;margin:14px 0 20px;font-size:clamp(42px,5vw,68px);line-height:1.02;letter-spacing:-.04em}
.service-hero__lead{max-width:760px;margin:0;color:var(--muted);font-size:1.08rem;line-height:1.7}
.service-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.service-summary{padding:30px;background:rgba(255,255,255,.82);border:1px solid var(--stroke);border-radius:var(--r24);box-shadow:var(--shadow)}
.service-summary>span{color:var(--green2);font-size:.82rem;font-weight:700}
.service-summary h2{margin:12px 0 20px;font-size:clamp(30px,3.4vw,46px);line-height:1.12;letter-spacing:-.03em}
.service-summary ul{display:grid;gap:14px;margin:0;padding:0;list-style:none}
.service-summary li{position:relative;padding-left:26px;color:rgba(0,0,0,.72);line-height:1.5}
.service-summary li::before{content:"";position:absolute;left:0;top:.48em;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(45,178,74,.12)}
.service-section{padding:64px 0}
.service-section--soft{background:rgba(255,255,255,.35);border-block:1px solid rgba(0,0,0,.04)}
.service-intro{display:grid;grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr);gap:64px;align-items:start}
.service-heading h2{max-width:800px;margin:10px 0 0;font-size:clamp(30px,3.4vw,46px);line-height:1.12;letter-spacing:-.03em}
.service-heading--center{margin-bottom:28px;text-align:center}.service-heading--center h2{margin:10px auto 0}
.service-copy{color:var(--muted);line-height:1.75}.service-copy p{margin:0}.service-copy p+p{margin-top:18px}
.service-cards,.service-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.service-card,.service-links a{padding:26px;background:#fff;border:1px solid var(--stroke);border-radius:var(--r20);box-shadow:0 10px 30px rgba(0,0,0,.05)}
.service-card b{display:inline-flex;margin-bottom:32px;color:rgba(0,0,0,.42);font-size:.82rem}
.service-card h3,.service-grid h3,.service-links h3{margin:0 0 10px;font-size:1.15rem;letter-spacing:-.015em}
.service-card p,.service-grid p,.service-links p{margin:0;color:var(--muted);line-height:1.6}
.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:28px}
.service-grid article{padding:24px 26px;background:rgba(255,255,255,.65);border:1px solid var(--stroke);border-radius:var(--r20)}
.service-factors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:980px;margin:0 auto}
.service-factors p{margin:0;padding:26px;background:#fff;border:1px solid var(--stroke);border-radius:var(--r20);color:var(--muted);line-height:1.7}
.service-links a{display:flex;flex-direction:column;min-height:220px;transition:transform .18s ease,box-shadow .18s ease}
.service-links a:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(0,0,0,.09)}
.service-links a>span{margin-top:auto;padding-top:24px;font-size:.82rem;font-weight:800;text-decoration:underline;text-underline-offset:4px}
.service-links a:focus-visible{outline:3px solid rgba(0,0,0,.32);outline-offset:4px}
.service-cta{padding:28px 0}
.service-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:34px;color:#fff;background:#111;border-radius:var(--r24);box-shadow:0 18px 50px rgba(0,0,0,.16)}
.service-cta span{color:rgba(255,255,255,.58)}.service-cta h2{max-width:720px;margin:10px 0 0;font-size:clamp(30px,3.4vw,46px);line-height:1.12;letter-spacing:-.03em}
.service-cta .btn--primary{flex:0 0 auto;color:#111;background:#fff}.service-section--faq{padding-top:52px}.service-faq{max-width:none;margin:0 auto}
@media(max-width:980px){.service-hero__grid,.service-intro{grid-template-columns:1fr}.service-hero__grid,.service-intro{gap:32px}.service-cards,.service-links{grid-template-columns:1fr}.service-links a{min-height:0}.service-cta__inner{align-items:flex-start;flex-direction:column}}
@media(max-width:640px){.service-hero{padding:48px 0 42px}.service-hero h1{font-size:clamp(38px,12vw,52px)}.service-section{padding:48px 0}.service-summary,.service-card,.service-links a,.service-grid article,.service-factors p{padding:22px}.service-grid,.service-factors{grid-template-columns:1fr}.service-cta__inner{padding:26px 22px;border-radius:20px}.service-actions,.service-actions .btn{width:100%}}

/* ===== Rework 10/2026 ===== */

/* Video nella hero (V1): stesso aspetto del segnaposto video di secondary-pages.css */
.hero-video{ width: min(100%, 360px); justify-self: end; }
.hero-video__placeholder{
  display:flex; align-items:center; justify-content:center; flex-direction:column;
  aspect-ratio: 9 / 14; padding: 28px; color:#fff; text-align:center;
  background:
    radial-gradient(circle at 50% 28%, rgba(255,255,255,.08), transparent 34%),
    linear-gradient(155deg, #2a2927, #0b0b0b 72%);
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 24px;
  box-shadow: 0 24px 58px rgba(0,0,0,.2);
}
.hero-video__play{
  display:block; position:relative; width:76px; height:54px;
  border:1px solid rgba(255,255,255,.28); border-radius:14px;
  background: var(--bg); box-shadow: 0 14px 30px rgba(0,0,0,.3);
}
.hero-video__play::after{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-42%,-50%);
  border-left:16px solid #111; border-top:10px solid transparent; border-bottom:10px solid transparent;
}
.hero-video__placeholder small{ max-width: 240px; margin-top: 16px; color: rgba(255,255,255,.68); font-size: 15px; line-height: 1.5; }

/* Etichetta del territorio sopra l'H1 */
.service-hero .service-eyebrow{ margin-top: 0; }

/* Testo lungo nelle sezioni */
.service-copy h3{ margin: 26px 0 8px; color: #111; font-size: 1.15rem; letter-spacing: -.015em; }
.service-copy ul{ margin: 14px 0 0; padding-left: 18px; }
.service-copy li + li{ margin-top: 6px; }
.service-copy strong{ color: rgba(0,0,0,.86); }
.service-copy a, .service-grid a, .service-factors a{ color: #111; text-decoration: underline; text-underline-offset: 3px; }

/* Nicchie (V4): card con etichetta */
.service-grid article > span{
  display:inline-block; margin-bottom: 10px;
  color: rgba(0,0,0,.55); font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}

/* Fonte di un dato */
.source-note{ display:block; margin-top: 10px; color: rgba(0,0,0,.5); font-size: 14px; line-height: 1.5; }

/* Blocco garanzia / impegno */
.service-pledge{
  max-width: 900px; margin: 0 auto; padding: 30px;
  background: #fff; border: 1px solid var(--stroke); border-radius: var(--r24); box-shadow: var(--shadow);
}
.service-pledge h3{ margin: 0 0 10px; font-size: 1.3rem; letter-spacing: -.02em; }
.service-pledge p{ margin: 0; color: var(--muted); line-height: 1.7; }
.service-pledge p + p{ margin-top: 12px; }
.service-pledge .highlight{ margin-top: 18px; color: #111; }

/* Esempi di ricerche (AI Search, D-45) */
.query-list{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.query-list li{ padding: 18px 20px; background: #fff; border: 1px solid var(--stroke); border-radius: var(--r16); }
.query-list q{ display:block; font-weight: 600; font-size: 1.15rem; quotes: "“" "”"; }
.query-list span{ display:block; margin-top: 6px; color: var(--muted); font-size: 16px; }

/* Prima/dopo nella pagina Top 3 (K3): riusa .panel di styles.css */
.service-section .panel{ margin-top: 8px; }

/* Casi studio nella pagina servizio (V2) */
.service-cases .testimonials__chips{ display:none; }

@media (max-width: 980px){
  .hero-video{ justify-self: center; }
  .query-list{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .service-pledge{ padding: 22px; }
}
@media (prefers-reduced-motion: reduce){
  .service-links a, .service-links a:hover{ transition: none; transform: none; }
}
.service-pledge--spaced{ margin-top: 20px; }

/* ===== Telefono (revisione 11/10/2026) ===== */
@media (max-width: 640px){
  .service-hero{ padding: 36px 0 34px; }
  .service-hero h1{ margin: 10px 0 16px; font-size: clamp(30px, 8.6vw, 38px); line-height: 1.06; letter-spacing: -.035em; text-wrap: balance; }
  .service-hero__lead{ font-size: 1rem; line-height: 1.6; }
  .service-actions{ margin-top: 22px; }
  .service-eyebrow, .service-heading > span, .service-cta span{ font-size: .72rem; letter-spacing: .07em; }
  .service-heading h2, .service-summary h2, .service-cta h2{ font-size: clamp(25px, 7vw, 30px); line-height: 1.15; text-wrap: balance; }
  .service-heading--center{ margin-bottom: 20px; }
  .service-intro{ gap: 18px; }
  .service-copy{ line-height: 1.7; }
  .service-card b{ margin-bottom: 14px; }
  .hero-video{ width: min(100%, 230px); }
  .hero-video__placeholder{ padding: 20px; border-radius: 20px; }
  .query-list q{ font-size: 1.05rem; }
}

.service-copy .source-note + p{ margin-top: 18px; }
.service-copy .source-note + h3{ margin-top: 26px; }
@media (max-width: 640px){
  .difference__cta .pill{ width: 100%; justify-content: space-between; padding: 13px 18px; font-size: 17px; }
}

/* =========================
   PAGINE SERVIZIO v2 (11/10/2026): stessa grammatica visiva della home, più leggibili
========================= */

/* Etichetta a pillola con icona sopra i titoli (componente .badge della home) */
.service-heading .badge{ display: inline-flex; margin-bottom: 4px; font-size: 16px; }
.service-heading--center .badge{ margin-left: auto; margin-right: auto; }
.service-heading h2{ margin-top: 12px; }

/* Settore come postilla verde, come nelle card dei casi studio */
.service-grid article > span{
  display: inline-flex;
  margin-bottom: 12px;
  padding: 4px 10px;
  color: var(--green-text);
  background: rgba(45,178,74,.10);
  border: 1px solid rgba(45,178,74,.28);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.service-grid h3{ margin-bottom: 8px; }

/* Icona al posto dei numeri nelle card (stile .card__icon della home) */
.service-card .card__icon{ margin-bottom: 14px; }
.service-cards--four{ grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Fonte di un dato: piccola postilla grigia con icona documento */
.source-note{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin-top: 10px;
  padding: 3px 10px;
  color: rgba(0,0,0,.58);
  background: rgba(0,0,0,.04);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 999px;
  font-size: 13.5px;
  line-height: 1.4;
}
.source-note::before{
  content: "Fonte";
  flex: 0 0 auto;
  color: rgba(0,0,0,.72);
  font-weight: 700;
}

/* "In breve": la risposta prima della spiegazione */
.brief{
  margin: 0 0 16px;
  padding: 14px 16px;
  color: rgba(0,0,0,.84);
  background: #fff;
  border: 1px solid var(--stroke);
  border-radius: var(--r16);
  font-weight: 600;
  line-height: 1.55;
}
.brief::before{
  content: "In breve";
  display: block;
  margin-bottom: 4px;
  color: var(--green-text);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.service-copy .highlight{ margin: 16px 0 0; color: #111; }

/* Pulsante a metà pagina */
.service-inline-cta{ padding: 4px 0 56px; text-align: center; }
.service-inline-cta p{ max-width: 620px; margin: 0 auto 16px; font-size: 1.1rem; font-weight: 700; letter-spacing: -.01em; text-wrap: balance; }

@media (max-width: 980px){
  .service-cards--four{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  /* video meno alto finché non arrivano i video veri */
  .hero-video{ width: 100%; }
  .hero-video__placeholder{ aspect-ratio: 16 / 9; padding: 16px; }
  .hero-video__play{ width: 60px; height: 42px; }
  .service-inline-cta{ padding-bottom: 44px; }
  .service-inline-cta p{ font-size: 1rem; }
}

.service-note{ max-width: 900px; margin: 20px auto 0; text-align: center; color: #111; }
.service-aside{ max-width: 720px; margin: 22px auto 0; text-align: center; color: var(--muted); line-height: 1.6; }
.service-aside a, .service-note a{ color: #111; text-decoration: underline; text-underline-offset: 3px; }
.service-grid + .source-note{ margin-top: 14px; }

/* Sezioni introduttive (11/10/2026): il blocco di destra parte alla stessa altezza dell'H2, non dell'etichetta */
@media (min-width: 981px){
  .service-intro > .service-heading{ display: contents; }
  .service-intro > .service-heading > .badge{ grid-column: 1; grid-row: 1; justify-self: start; }
  .service-intro > .service-heading > h2{ grid-column: 1; grid-row: 2; margin-top: 0; }
  .service-intro > .service-copy{ grid-column: 2; grid-row: 2; }
  .service-intro{ row-gap: 14px; }
}

/* Sezione invertita: testo a sinistra, etichetta e titolo a destra (Consulenza, "Cosa porti a casa") */
@media (min-width: 981px){
  .service-intro--reverse{ grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); }
  .service-intro--reverse > .service-heading > .badge{ grid-column: 2; }
  .service-intro--reverse > .service-heading > h2{ grid-column: 2; }
  .service-intro--reverse > .service-copy{ grid-column: 1; }
}

/* Card dei servizi collegati: se l'ultima riga ha due card, stanno al centro con la stessa misura */
@media (min-width: 981px){
  .service-links{ grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .service-links > a{ grid-column: span 2; }
  .service-links > a:nth-child(3n+1):nth-last-child(2){ grid-column: 2 / span 2; }
}

/* Divisioni fra sezioni sfumate, senza linee nette (11/10/2026) */
.service-section--soft{
  border-block: 0;
  background: linear-gradient(to bottom,
    rgba(255,255,255,0) 0,
    rgba(255,255,255,.35) 72px,
    rgba(255,255,255,.35) calc(100% - 72px),
    rgba(255,255,255,0) 100%);
}

/* Fascia CTA fra due sezioni: spazio uguale sopra e sotto */
.service-inline-cta{ padding: 40px 0 48px; }
/* nella sezione invertita etichetta e titolo stanno allineati a destra */
@media (min-width: 981px){
  .service-intro--reverse > .service-heading > .badge{ justify-self: end; }
  .service-intro--reverse > .service-heading > h2{ text-align: right; }
}
/* La CTA intermedia sta vicina alle card sopra */
.service-section:has(+ .service-inline-cta){ padding-bottom: 20px; }
.service-inline-cta{ padding-top: 8px; }
/* Card dei servizi collegati alte quanto il loro testo: il link segue subito il testo, niente vuoto */
.service-links{ align-items: start; }
.service-links > a{ min-height: 0; }
.service-links > a > span{ margin-top: 0; padding-top: 14px; }

/* Sezioni introduttive: "In breve" accanto all'H2, il resto del testo si stende sotto, su tutta la larghezza */
@media (min-width: 981px){
  .service-intro > .service-copy{ display: contents; }
  .service-intro > .service-copy > *{ grid-column: 1 / -1; }
  .service-intro > .service-copy > .brief{ grid-column: 2; grid-row: 2; align-self: start; }
  .service-intro > .service-copy > :not(.brief){ margin-top: 0; }
  .service-intro{ row-gap: 18px; }
  .service-intro > .service-heading > .badge{ margin-bottom: -4px; }
}
@media (min-width: 981px){
  /* sezioni introduttive senza "In breve": il testo resta nella colonna di destra, accanto all'H2 */
  .service-intro:not(:has(.brief)) > .service-copy{ display: block; grid-column: 2; grid-row: 2; }
}
@media (min-width: 981px){
  /* colonna dell'H2 più larga: i titoli stanno su due righe */
  .service-intro:has(.brief){ grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); column-gap: 48px; }
}
@media (min-width: 981px){
  .service-intro:has(.brief) > .service-heading > h2{ font-size: clamp(30px, 3vw, 42px); }
}

/* Riquadri verdi dentro le sezioni: testo centrato (regola generale) */
.service-section .highlight{ text-align: center; }

/* Settore per settore (12/10/2026): nota discreta sui casi, card larga per AlbergADV */
.service-grid__case{ display: block; margin-top: 10px; color: var(--muted); font-size: 15px; }
.service-grid__wide{ grid-column: 1 / -1; }
.service-grid__wide p + p{ margin-top: 10px; }
.service-grid__link{ display: inline-block; margin-top: 14px; color: #111; font-size: .82rem; font-weight: 800; text-decoration: underline; text-underline-offset: 4px; }
/* link nel testo delle card: stesso stile dei link nei testi (sottolineato, nero) */
.service-card p a{ color: #111; text-decoration: underline; text-underline-offset: 3px; }

/* Google Ads: settori su tre colonne */
.service-grid--three{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 980px){ .service-grid--three{ grid-template-columns: 1fr; } }

/* Google Ads: sezione AlbergADV (12/10/2026), come le altre sezioni del sito.
   Di AlbergADV prende il logo nella postilla, la linea verde da 2px davanti ai testi e il pulsante */
.alberg__badge{ padding: 10px 18px; }
.alberg__badge img{ display: block; width: 110px; height: auto; }
.alberg__text{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; max-width: 900px; margin: 0 auto; }
.alberg__text p{ margin: 0; padding-left: 16px; border-left: 2px solid #187C31; color: var(--muted); line-height: 1.7; }
.alberg__text strong{ display: block; margin-bottom: 4px; color: #111; }
.alberg__foot{ display: flex; justify-content: center; margin-top: 28px; }
.alberg__cta{
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 22px; border-radius: 10px;
  background: #3D6EA3; color: #fff; font-size: 17px; font-weight: 600;
  transition: background 140ms ease-out, transform 140ms ease-out;
}
.alberg__cta::after{ content: ""; position: absolute; inset: 5px; pointer-events: none; border: 2px solid rgba(255,255,255,.45); border-radius: 5px; }
.alberg__cta:hover{ background: #4B81B8; transform: scale(1.04); }
.alberg__cta:active{ transform: scale(.99); }
.alberg__cta:focus-visible{ outline: 2px solid #187C31; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce){ .alberg__cta:hover{ transform: none; } }
@media (max-width: 780px){ .alberg__text{ grid-template-columns: 1fr; gap: 18px; } }
/* AlbergADV: postilla e H2 a sinistra, i due testi uno sotto l'altro a destra, pulsante al centro */
.service-intro .alberg__text{ display: grid; grid-template-columns: 1fr; gap: 18px; max-width: none; margin: 0; }
.service-intro .alberg__text p + p{ margin-top: 0; }
.alberg__foot{ margin-top: 32px; }
/* freccia sottile verde AlbergADV dalla card hotel alla sezione AlbergADV (solo computer) */
.service-grid__hotel{ position: relative; }
.alberg-arrow{
  position: absolute; top: calc(100% + 8px); left: 50%; width: 120px; height: 170px;
  color: #187C31; opacity: .55; pointer-events: none;
}
@media (max-width: 980px){ .alberg-arrow{ display: none; } }
/* AlbergADV: i due testi affiancati nella colonna di destra, ognuno con la sua linea verde */
.service-intro .alberg__text{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
@media (max-width: 780px){ .service-intro .alberg__text{ grid-template-columns: 1fr; gap: 18px; } }
.service-intro:not(:has(.brief)) > .service-copy.alberg__text{ display: grid; }
.service-intro > .service-copy.alberg__text > p{ grid-column: auto; }
/* AlbergADV: nella sua sezione si usano i suoi font (Source Serif 4 per i titoli, Source Sans 3 per i testi) */
.alberg h2, .alberg__text strong{ font-family: "Source Serif 4", Georgia, "Times New Roman", serif; font-weight: 600; letter-spacing: -.005em; }
.alberg__text strong{ font-size: 1.12rem; }
.alberg__text p, .alberg__cta{ font-family: "Source Sans 3", "Segoe UI", system-ui, sans-serif; }
.alberg__text p{ font-size: 19px; line-height: 1.55; color: #4A4740; }
.alberg__text strong{ color: #1A1A18; }
.alberg h2{ color: #1A1A18; }
/* "Prima di spendere" con quattro card: su computer tutte e quattro affiancate */
@media (min-width: 1100px){
  /* larghezza di ogni card proporzionale al suo testo: escono alte uguali (card a tre e a quattro) */
  .service-cards{ display: flex; }
  .service-cards > .service-card{ flex: 1 1 auto; }
  .service-cards--four{ gap: 18px; }
  .service-cards--four .service-card{ padding: 24px 22px; }
}

/* Pagine servizio: il riquadro del video in orizzontale 16:9 */
.hero-video{ width: 100%; }
.hero-video__placeholder{ aspect-ratio: 16 / 9; }
@media (min-width: 981px){
  .service-hero__grid:not(:has(.service-hero__videos)){ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

/* Computer: H1 delle pagine servizio più piccolo, al massimo tre righe */
@media (min-width: 981px){
  .service-hero h1{ font-size: clamp(36px, 3.2vw, 44px); line-height: 1.05; }
}

/* Google Ads, AlbergADV su telefono: postilla e H2 al centro; freccia verde dalla card hotel alla sezione,
   che passa a destra della CTA intermedia */
@media (max-width: 980px){
  .alberg .service-heading{ text-align: center; }
  .alberg .service-heading h2{ margin-inline: auto; }
}
.alberg-arrow--mobile{ display: none; }
@media (max-width: 640px){
  .alberg-arrow--mobile{ display: block; top: calc(100% + 10px); left: auto; right: -4px; width: 150px; height: 120px; z-index: 1; }
}


/* Testi delle card: l'Hanken a 18px, in grassetto o con spaziatura negativa, sembra compresso */
.service-card h3, .service-grid h3, .service-links h3{ letter-spacing: 0; }
.service-card p, .service-grid p, .service-links p, .service-factors p{ letter-spacing: .01em; text-wrap: pretty; }
.service-factors strong, .service-card strong{ letter-spacing: .015em; }
