/* Hallmark · genre: editorial · design-system: design.md
 * macrostructures: Narrative Workflow · Split Studio · Conversational FAQ
 * pre-emit critique: P4 H4 E4 S4 R4 V4
 */
html,body{overflow-x:clip}
html{scroll-behavior:smooth}
/* Le ancore devono fermarsi sotto l'header sticky (74px), non dietro. */
.pg [id]{scroll-margin-top:92px}
.pg h1,.pg h2,.pg h3{text-wrap:balance}
.pg .hero-sub,.pg .sec-head p,.pg .lead{text-wrap:pretty}
.pg ::selection{background:var(--color-navy);color:var(--color-paper)}
.pg{background:var(--color-paper);color:var(--color-ink)}
.pg .sec{padding:var(--space-2xl) 0}
.pg .sec-head{max-width:760px;margin:0 0 var(--space-xl);text-align:left}
.pg h1,.pg h2{overflow-wrap:anywhere;min-width:0}
.pg .sec-head h2{font-size:clamp(2rem,4vw,2.6rem)}
.pg .sec-head p{max-width:62ch;font-size:var(--text-lg)}
.pg .kick{margin-bottom:.65rem;letter-spacing:.09em}
.pg .sec-head .kick{display:none}
.pg .btn,.pg .nav a,.pg .drawer a{white-space:nowrap}
.pg .btn:focus-visible,.pg a:focus-visible,.pg button:focus-visible,.pg summary:focus-visible,.pg input:focus-visible,.pg textarea:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.pg .svc p,.pg .use p,.pg .step p,.pg .adv p,.pg .rev p,.pg .fbody p,.pg .eb-row span{font-size:var(--text-md);line-height:1.6}
.pg .svc,.pg .use,.pg .step,.pg .adv,.pg .rev{box-shadow:none;transition:transform var(--dur-micro) var(--ease-out),border-color var(--dur-micro) var(--ease-out)}
.pg .svc:hover,.pg .use:hover{transform:translateY(-1px);box-shadow:none}
.pg .nav{display:none}
.pg .menu-btn{display:inline-flex}
.pg .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);padding-top:4rem;padding-bottom:6rem}
.pg .about-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.pg .btn:active{transform:translateY(0)}
.pg .btn:disabled,.pg button:disabled,.pg input:disabled,.pg textarea:disabled{opacity:.55;cursor:not-allowed}
.pg input,.pg textarea{outline:2px solid transparent;outline-offset:1px}
.pg input:focus-visible,.pg textarea:focus-visible{outline:2px solid var(--color-focus);outline-offset:1px}
.pg .privacy-check{display:flex;align-items:flex-start;gap:10px;margin:0 0 18px;color:var(--color-ink-2);font-size:13px;line-height:1.45}
.pg .privacy-check input{width:18px;height:18px;flex:0 0 auto;margin:2px 0 0;accent-color:var(--color-blue)}
.pg .privacy-check a{color:var(--color-blue);font-weight:700}
.pg .ftr-bot a,.pg .ftr-bot .rc-settings-link{display:inline;color:inherit;font-size:inherit;margin:0}

/* Logo header: le due righe (nome + sottotitolo) erano inline con <br>, e il sottotitolo
   ereditava line-height:1.6 dal body — troppo distacco verticale. Passo a un blocco
   flessibile con gap fisso e ridotto. */
.pg .logo>span:last-child{display:flex;flex-direction:column;gap:2px}
.pg .logo br{display:none}
.pg .ftr a.logo{display:flex;align-items:center}
.pg .ftr .logo-mk{flex-shrink:0}
.pg .ftr .logo>span:last-child{min-width:0}
.pg .logo-t,.pg .logo-s{line-height:1.05}

/* Header: acquista un'ombra soffusa dopo i primi 120px di scroll (solo dove
   supportato; altrove resta il bordo inferiore). */
@supports(animation-timeline:scroll()){
  .pg .hdr{animation:hdr-elev linear both;animation-timeline:scroll();animation-range:0 120px}
  @keyframes hdr-elev{to{box-shadow:0 12px 32px -20px var(--color-shadow);background:rgba(255,255,255,.97)}}
}

/* Rifinitura 2026 — ombre più soffuse, radius coerente, dettagli più raffinati */
.pg .hero{background-image:radial-gradient(135% 160% at 14% -18%,oklch(58% .1 235 / .38),transparent 55%),linear-gradient(155deg,#0B2740 0%,#123B5E 55%,#154970 100%)}
.pg .hero-img,.pg .hero-card,.pg .about-slot{border-radius:var(--radius-media);box-shadow:var(--shadow-lg)}
.pg .hero-badge,.pg .cred-card{border-radius:var(--radius-card);box-shadow:var(--shadow-md)}
.pg .hero-badge{border:1px solid var(--color-rule)}
.pg .svc,.pg .use,.pg .rev,.pg .stat,.pg .fbody,.pg .def,.pg .eb{border-radius:var(--radius-card)}
.pg .fnum{border-radius:var(--radius-card);box-shadow:var(--shadow-sm)}
.pg .btn{border-radius:var(--radius-button);transition:transform var(--dur-short) var(--ease-out),box-shadow var(--dur-short) var(--ease-out)}
.pg .btn:hover{transform:translateY(-1px)}
.pg .btn-wa{box-shadow:var(--shadow-wa)}
.pg .btn-wa:hover{box-shadow:var(--shadow-wa-hover)}
.pg .btn-nv:hover{box-shadow:var(--shadow-sm)}
.pg .wa-float{box-shadow:var(--shadow-wa-hover)}
.pg .drawer{box-shadow:var(--shadow-lg)}

/* Un solo blocco di conversione finale. */
.pg #contatti{background:var(--color-navy);color:var(--color-paper)}
.pg #contatti .sec-head{margin-left:auto;margin-right:auto;text-align:center}
.pg #contatti .sec-head h2{color:var(--color-paper)}
.pg #contatti .sec-head p{color:var(--color-on-dark);margin-left:auto;margin-right:auto}
.pg #contatti .kick{color:var(--color-on-dark)}
.pg #contatti .contact-form{color:var(--color-ink);background:var(--color-paper);border:0;box-shadow:0 18px 45px var(--color-shadow)}
.pg .cf-field input:hover,.pg .cf-field textarea:hover{border-color:oklch(70% .06 245)}
.pg .cf-note{margin:16px 0 0;text-align:center;font-size:13px;color:var(--color-ink-2)}

/* CTA testuale inline (es. "Scrivimi su WhatsApp" dentro un paragrafo) */
.pg .link-cta{color:var(--color-blue);font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.pg .link-cta:hover{color:var(--color-navy)}

/* Footer ridotto a identità + contatti. */
.pg .ftr-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.landing-aste .ftr-grid>div:nth-child(2),
.landing-valutazione .ftr-grid>div:nth-child(2),
.landing-valutazione .ftr-grid>div:nth-child(3),
.landing-perizie .ftr-grid>div:nth-child(2){display:none}

/* Aste: servizi asimmetrici e processo dominante. */
.landing-aste .svc-grid{grid-template-columns:1.15fr .85fr;gap:var(--space-md)}
.landing-aste .svc:first-child{padding:var(--space-lg)}
.landing-aste #processo{padding-top:var(--space-3xl);padding-bottom:var(--space-3xl)}
.landing-aste .flow{margin-left:0;max-width:900px}
.landing-aste #perche .split{grid-template-columns:1.15fr .85fr}
.landing-aste .rev-grid{grid-template-columns:1.2fr .9fr .9fr}

/* Valutazioni: diagnosi a due colonne, non catalogo a sei tessere. */
.landing-valutazione .svc-grid{grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--color-rule)}
.landing-valutazione .svc{border:0;border-bottom:1px solid var(--color-rule);border-radius:0;padding:var(--space-lg) var(--space-md)}
.landing-valutazione .svc:nth-child(odd){border-right:1px solid var(--color-rule);padding-left:0}
.landing-valutazione .svc:nth-child(even){padding-right:0}
.landing-valutazione .hero-trust{gap:var(--space-lg)}
.landing-valutazione .steps{grid-template-columns:1.2fr .9fr .9fr}
.landing-valutazione .rev-grid{grid-template-columns:1.2fr .9fr .9fr}

/* Perizie: confronto e domande sono la struttura principale. */
.landing-perizie .use-grid{grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--color-rule)}
.landing-perizie .use{border:0;border-bottom:1px solid var(--color-rule);border-radius:0;padding:var(--space-lg) var(--space-md)}
.landing-perizie .use:nth-child(odd){border-right:1px solid var(--color-rule);padding-left:0}
.landing-perizie .use:nth-child(even){padding-right:0}
.landing-perizie #differenze{padding-top:var(--space-3xl);padding-bottom:var(--space-3xl)}
.landing-perizie .cmp{grid-template-columns:1.25fr .875fr .875fr}
.landing-perizie .rev-grid{grid-template-columns:1.2fr .9fr .9fr}
/* WhatsApp resta disponibile, ma appare dopo che l'utente inizia a scorrere. */
.pg .wa-float{opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity var(--dur-short) var(--ease-out),transform var(--dur-short) var(--ease-out)}
.pg .wa-float.is-visible{opacity:1;transform:none;pointer-events:auto}

@media(max-width:900px){
  .pg .sec{padding:3.75rem 0}
  .pg .sec-head{margin-bottom:2rem}
  .pg .sec-head p{font-size:1rem}
  .pg .hero-grid,.pg .about-grid,.pg .svc-grid,.pg .use-grid,.landing-aste #perche .split,.landing-valutazione .steps,.pg .rev-grid,.pg .ftr-grid{grid-template-columns:minmax(0,1fr)}
  .landing-valutazione .svc:nth-child(odd),.landing-perizie .use:nth-child(odd){border-right:0;padding-left:0;padding-right:0}
  .landing-valutazione .svc:nth-child(even),.landing-perizie .use:nth-child(even){padding-left:0;padding-right:0}
  .landing-perizie .cmp{grid-template-columns:1fr}
  .pg #contatti .contact-form{padding:1.5rem}
  .pg .wa-float{width:52px;height:52px;left:auto;right:14px;bottom:14px}
  .pg .wa-float svg{width:27px;height:27px}
}

@media(max-width:480px){
  .pg .logo{gap:9px}
  .pg .logo-mk{width:38px;height:38px;font-size:15px}
  .pg .logo-t{font-size:16px}
  /* Il sottotitolo andrebbe su due righe: meglio solo marchio + nome. */
  .pg .logo-s{display:none}
}

@media(max-width:420px){
  .pg .wrap{padding-left:20px;padding-right:20px}
  .pg .hero h1{font-size:2.35rem}
  .pg .hero-cta{gap:10px}
  .pg .hero-cta .btn{width:100%;justify-content:center}
  .pg .contact-form{width:100%}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .pg *,.pg *::before,.pg *::after{animation-duration:150ms!important;transition-duration:150ms!important}
}

/* Honeypot anti-spam: nascosto ai visitatori, visibile ai bot */
.pg .cf-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;opacity:0}

/* Esito invio form di contatto */
.pg .cf-status{margin-top:16px;padding:14px 16px;border-radius:12px;font-size:15px;line-height:1.45}
.pg .cf-status[hidden]{display:none}
.pg .cf-status.is-ok{background:#E7F6EC;border:1px solid #B7E1C4;color:#1B6B37}
.pg .cf-status.is-err{background:#FDECEC;border:1px solid #F3C2C2;color:#B02121}
.pg .cf-submit[disabled]{opacity:.6;cursor:progress}

/* Verifica antispam: testo scuro sul fondo chiaro del modulo. */
.pg .cf-math-help{display:block;color:#526474;font-size:13px;line-height:1.5}
.pg .cf-math-refresh{align-self:flex-start;min-height:44px;padding:9px 14px;border:1px solid #1e5f9e;border-radius:8px;background:#eef4fb;color:#0c2a43;font:700 14px/1.4 'Public Sans',sans-serif;cursor:pointer}
.pg .cf-math-refresh:hover{background:#dceafa}
