/* ================================================================
   PattiOnLine — pol-numeri.css  (pagina Numeri Utili)
   Hero + Emergenze in evidenza + sezioni per categoria (tel: cliccabili).
   Scopato .pnu. Piena larghezza. Squadrato.
   ================================================================ */
.pnu{
  --navy:#0C2E7A;--blu:#16408f;--sea:#0E9E8E;--sea-d:#0a7d70;--sand:#F4EAD6;
  --gold:#DDA65A;--ink:#14202B;--muted:#5b6674;--line:#E7E1D4;--mist:#F7F5F0;--paper:#fff;
  --sos:#C1392B;--sos-d:#9c2b20;
  font-family:"Poppins",system-ui,sans-serif;color:var(--ink);line-height:1.45;
  width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);overflow-x:clip;
  padding:0 0 56px;background:var(--mist)}
.pnu,.pnu *,.pnu *::before,.pnu *::after{box-sizing:border-box;border-radius:0}
.pnu-pad{padding:0 clamp(18px,4.5vw,90px)}

/* ===== HERO ===== */
.pnu-hero{position:relative;overflow:hidden;color:#fff;padding:44px clamp(18px,4.5vw,90px) 48px;
  background:linear-gradient(118deg,#0b2a5e 0%,var(--navy) 44%,var(--sea) 128%)}
.pnu-hero::after{content:"";position:absolute;right:-40px;top:-40px;width:260px;height:260px;background:rgba(255,255,255,.06)}
.pnu-hero-ic{position:absolute;right:clamp(-20px,3vw,60px);top:50%;transform:translateY(-50%);width:min(28vw,220px);color:rgba(255,255,255,.12);z-index:0}
.pnu-hero-ic svg{width:100%;height:auto;display:block}
.pnu-hero-tx{position:relative;z-index:1;max-width:680px}
.pnu-kicker{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.pnu-hero h1{color:#fff;font-family:"Fraunces",serif;font-weight:700;font-size:clamp(32px,4.4vw,54px);line-height:1;margin:.35rem 0 .5rem;letter-spacing:-.01em}
.pnu-hero p{color:#e6ecfb;font-size:1.05rem;margin:0;max-width:52ch}

/* ===== EMERGENZE (in evidenza) ===== */
.pnu-emerg{margin:-26px clamp(18px,4.5vw,90px) 0;position:relative;z-index:2}
.pnu-emerg-h{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  font-size:.9rem;background:var(--sos);padding:12px 18px}
.pnu-emerg-h svg{width:20px;height:20px}
.pnu-egrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-top:0}
.pnu-ecard{background:#fff;padding:18px 18px 20px;display:flex;flex-direction:column;gap:8px;text-decoration:none;color:inherit;transition:.16s;position:relative}
.pnu-ecard:hover{background:#fff5f3}
.pnu-ecard .ic{width:40px;height:40px;display:grid;place-items:center;background:var(--sos);color:#fff}
.pnu-ecard .ic svg{width:22px;height:22px}
.pnu-ecard .nm{font-size:.86rem;font-weight:600;color:var(--muted);line-height:1.25;min-height:2.2em}
.pnu-ecard .nr{font-family:"Fraunces",serif;font-weight:800;font-size:2rem;color:var(--sos-d);line-height:1;letter-spacing:-.01em}
.pnu-ecard .call{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--sos)}

/* ===== SEZIONI per categoria ===== */
.pnu-sec{margin:2.2rem clamp(18px,4.5vw,90px) 1rem;font-family:"Fraunces",serif;font-size:1.5rem;color:var(--navy);position:relative;padding-bottom:10px;display:flex;align-items:center;gap:.6rem}
.pnu-sec::after{content:"";position:absolute;left:0;bottom:0;width:52px;height:3px;background:var(--gold)}
.pnu-sec .sic{width:26px;height:26px;color:var(--sea-d)}
.pnu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin:0 clamp(18px,4.5vw,90px)}
.pnu-card{display:flex;align-items:center;gap:14px;background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--sea);
  padding:14px 16px;text-decoration:none;color:inherit;transition:.16s;box-shadow:0 6px 16px rgba(12,46,122,.06)}
.pnu-card:hover{transform:translateY(-3px);box-shadow:0 16px 30px rgba(12,46,122,.14);border-left-color:var(--gold)}
.pnu-card .ic{flex:none;width:44px;height:44px;display:grid;place-items:center;background:var(--mist);color:var(--navy);border:1px solid var(--line)}
.pnu-card .ic svg{width:23px;height:23px}
.pnu-card .bd{min-width:0;flex:1}
.pnu-card .nm{font-size:.92rem;font-weight:600;color:var(--ink);line-height:1.2}
.pnu-card .nr{margin-top:3px;display:flex;flex-wrap:wrap;gap:.4rem .8rem}
.pnu-card .nr a{font-weight:800;color:var(--sea-d);font-size:1.02rem;text-decoration:none;font-variant-numeric:tabular-nums}
.pnu-card .nr a:hover{text-decoration:underline}
.pnu-card .go{flex:none;color:var(--sea);opacity:.5;transition:.16s}
.pnu-card:hover .go{opacity:1;transform:translateX(2px)}
.pnu-card .go svg{width:20px;height:20px}

/* card "link" (es. Farmacie di turno) */
.pnu-card.link .ic{background:var(--sea);color:#fff;border-color:var(--sea)}

/* ===== NOTA (elegante) ===== */
.pnu-note{margin:32px clamp(18px,4.5vw,90px) 0;display:flex;align-items:center;gap:18px;padding:20px 24px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(100deg,var(--navy),var(--blu));border-left:4px solid var(--gold);box-shadow:0 12px 28px rgba(12,46,122,.16)}
.pnu-note::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;background:rgba(255,255,255,.06);pointer-events:none}
.pnu-note-ic{flex:none;width:52px;height:52px;display:grid;place-items:center;position:relative;z-index:1;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22)}
.pnu-note-ic svg{width:26px;height:26px;color:var(--gold)}
.pnu-note-tx{position:relative;z-index:1}
.pnu-note-tx b{font-family:"Fraunces",serif;font-weight:700;font-size:1.14rem;color:#fff;display:block}
.pnu-note-tx span{font-size:.93rem;color:#dbe3f2}

@media(max-width:560px){.pnu-egrid{grid-template-columns:repeat(2,1fr)}.pnu-grid{grid-template-columns:1fr}}