/* ==========================================================================
   ORARI AUTOBUS PER GAETA (.sgl-bus dentro .sgl-plc .sgl-orr .sgl-prt)

   L'impaginazione e' quella delle pagine di servizio sorelle (orari dei
   monumenti, Gaeta Pratica) e sta in enea-landing.css. Qui solo due cose:

   1. la tabella del widget Cotral, che arriva con un CSS di sistema suo
      (system-ui, grigi #ddd, rosso #a71d22): la si riveste con i gettoni
      delle landing — Montserrat, rosso del sito, filetti e fondi caldi;
   2. le domande frequenti, righe con il filetto come l'elenco degli orari,
      aperte con <details> (niente JavaScript).
   ========================================================================== */

/* — La testata: il titolo alla misura della pagina meteo (30–54 px), non a
   quella dell'elenco dei monumenti (fino a 70): e' una pagina da consultare. */
.sgl-bus .plc-hero h1{font-size:clamp(30px,5vw,54px);letter-spacing:-.025em}
.sgl-bus .plc-hero .plc-lede{font-size:clamp(15.5px,1.7vw,18.5px)}

/* — La scheda della tabella — */
.sgl-bus .bus-board .sg-bus-board{max-width:none;margin:0;padding:clamp(16px,2.4vw,24px);border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;color:var(--ink-2);font:inherit;font-size:15.5px;line-height:1.6;box-shadow:var(--shadow-sm)}
/* Il titolo del widget ripete quello della sezione: resta per chi usa uno
   screen reader, sparisce alla vista. */
.sgl-bus .bus-board .sg-bus-board>h2,.sgl-bus .bus-board caption{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.sgl-bus .bus-board .sg-bus-board>p:first-of-type{margin:0 0 16px;font-size:14px;line-height:1.6;color:var(--muted);max-width:none}

/* — I campi — */
.sgl-bus .bus-board .sg-bus-form{gap:12px}
.sgl-bus .bus-board .sg-bus-form label{gap:6px;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.sgl-bus .bus-board .sg-bus-form input,.sgl-bus .bus-board .sg-bus-form select{min-height:46px;padding:0 12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;color:var(--ink);font-family:inherit;font-size:15px;font-weight:500;letter-spacing:0;text-transform:none}
.sgl-bus .bus-board .sg-bus-form select{-webkit-appearance:none;appearance:none;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b71c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;background-size:16px}
.sgl-bus .bus-board .sg-bus-form input:focus,.sgl-bus .bus-board .sg-bus-form select:focus{border-color:var(--red);outline:0;box-shadow:0 0 0 3px var(--red-tint)}
.sgl-bus .bus-board .sg-bus-form button{min-height:46px;padding:0 22px;border:0;border-radius:8px;background:var(--red);color:#fff;font-family:inherit;font-size:15px;font-weight:600;box-shadow:var(--shadow-red);transition:background .2s}
.sgl-bus .bus-board .sg-bus-form button:hover{background:var(--red-deep)}
.sgl-bus .bus-board .sg-bus-board :focus-visible{outline:2px solid var(--red);outline-offset:2px}

/* — La tratta scelta e la tabella — */
.sgl-bus .bus-board .sg-bus-date{margin:20px 0 10px;font-size:16.5px;line-height:1.35;color:var(--ink)}
.sgl-bus .bus-board .sg-bus-date strong{font-weight:800}
.sgl-bus .bus-board .sg-bus-table-wrap{border:1px solid var(--line);border-radius:12px;max-height:540px}
.sgl-bus .bus-board .sg-bus-board table{font-size:14.5px;font-variant-numeric:tabular-nums}
.sgl-bus .bus-board .sg-bus-board th{padding:11px 14px;background:var(--bg-warm);border-bottom:1px solid var(--red-line);font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.sgl-bus .bus-board .sg-bus-board td{padding:11px 14px;border-bottom:1px solid var(--line);color:var(--ink-2)}
.sgl-bus .bus-board .sg-bus-board tbody tr:last-child td{border-bottom:0}
.sgl-bus .bus-board .sg-bus-board td:first-child,.sgl-bus .bus-board .sg-bus-board td:nth-child(2){font-weight:800;color:var(--ink);white-space:nowrap}
.sgl-bus .bus-board .sg-bus-board tbody tr:hover td{background:#fdf6f5}
.sgl-bus .bus-board .sg-bus-board p[role="status"]{margin:12px 0 0;padding:13px 15px;border-radius:10px;background:var(--bg-warm);color:var(--ink);font-size:15px;max-width:none}
.sgl-bus .bus-board .sg-bus-footnote{margin:12px 0 0;font-size:13px;line-height:1.55;color:var(--muted);max-width:none}
.sgl-bus .bus-board .sg-bus-board>p:last-child{margin:10px 0 0;font-size:14px}
.sgl-bus .bus-board .sg-bus-board a{color:var(--red);font-weight:700}

/* — Località per località: le voci della guida, una sotto l'altra — */
.sgl-bus .bus-prose h3{font-size:clamp(17px,1.9vw,20px);font-weight:700;letter-spacing:-.01em;line-height:1.3;color:var(--ink);margin:0;padding-top:clamp(18px,2.4vw,24px);border-top:1px solid var(--line)}
.sgl-bus .bus-prose h3 + p{margin-top:6px}
.sgl-bus .bus-prose p{font-size:clamp(15.5px,1.6vw,17px);line-height:1.75;color:var(--ink-2)}
.sgl-bus .bus-prose p + h3{margin-top:clamp(18px,2.4vw,24px)}
.sgl-bus .bus-prose a{color:var(--red);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* — Domande frequenti — */
.sgl-bus .bus-faq{border-top:1px solid var(--line)}
.sgl-bus .bus-faq details{border-bottom:1px solid var(--line)}
.sgl-bus .bus-faq summary{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:16px 0;font-size:clamp(16px,1.8vw,17.5px);font-weight:700;line-height:1.4;color:var(--ink);cursor:pointer;list-style:none}
.sgl-bus .bus-faq summary::-webkit-details-marker{display:none}
.sgl-bus .bus-faq summary::after{content:"";flex:none;width:9px;height:9px;margin:7px 4px 0 0;border-right:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(45deg);transition:transform .2s var(--ease)}
.sgl-bus .bus-faq details[open] summary::after{transform:rotate(-135deg);margin-top:11px}
.sgl-bus .bus-faq summary:hover{color:var(--red)}
.sgl-bus .bus-faq summary:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:4px}
.sgl-bus .bus-faq-a{padding:0 0 18px}
.sgl-bus .bus-faq-a p{margin:0;font-size:15.5px;line-height:1.7;color:var(--ink-2);max-width:62ch}

/* Le ancore dell'indice: l'header fisso non deve coprire il titolo. */
.sgl-bus .prt-sec{scroll-margin-top:96px}
@media (max-width:999px){.sgl-bus .prt-sec{scroll-margin-top:132px}}