/* =====================================================
   ANIOC SOCCORSO APS - FAQ
   Foglio autonomo: /css/faq.css
   ===================================================== */

body:has(.anioc-faq) .entry-title { display: none !important; }

.anioc-faq {
    --af-blue: #064879; --af-blue-dark: #082f50; --af-cyan: #159bd0;
    --af-pale: #edf6fb; --af-gold: #f2bd16; --af-text: #18334a; --af-muted: #5a7184;
    position: relative; left: 50%; transform: translateX(-50%);
    display: block; width: min(1180px, calc(100vw - 44px)); max-width: none;
    margin: 22px 0 52px; padding: 0; color: var(--af-text); font-family: inherit; box-sizing: border-box;
}
.anioc-faq *, .anioc-faq *::before, .anioc-faq *::after { box-sizing: border-box; }
.anioc-faq h1, .anioc-faq h2, .anioc-faq h3, .anioc-faq p { max-width: none; overflow-wrap: normal; word-break: normal; }
.anioc-faq p { margin: 0 0 13px; font-size: 15px; line-height: 1.68; }
.anioc-faq a { color: #087eae; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.anioc-faq a:hover { color: var(--af-blue-dark); }
.af-hero { position: relative; display: flex; align-items: center; min-height: 245px; margin: 0 0 44px; padding: 42px 55px; overflow: hidden; color: #fff; border-radius: 0 0 24px 24px; background: radial-gradient(circle at 88% 25%,rgba(28,160,207,.30),transparent 32%),linear-gradient(115deg,#062d4d 0%,#075481 65%,#087fae 100%); }
.af-hero::after { content: "?"; position: absolute; right: 52px; bottom: -75px; color: rgba(255,255,255,.07); font-size: 250px; font-weight: 200; line-height: 1; pointer-events: none; }
.af-hero-content { position: relative; z-index: 1; width: 100%; max-width: 760px; }
.af-eyebrow,.af-kicker { display: block; margin: 0 0 12px; color: var(--af-cyan); font-size: 10px; font-weight: 850; letter-spacing: 2px; line-height: 1.5; }
.af-hero .af-eyebrow { color: #a8e4ff; }
.af-hero h1 { margin: 0 0 16px; color: #fff; font-size: clamp(34px,4.5vw,55px); font-weight: 850; line-height: 1.05; letter-spacing: -1px; }
.af-line { display: block; width: 58px; height: 5px; margin: 17px 0; background: var(--af-gold); }
.af-hero p { max-width: 650px; margin: 0; color: #fff; font-size: 17px; line-height: 1.65; }
.af-hero-label { position: absolute; right: 30px; bottom: 22px; z-index: 1; color: #d9f3ff; font-size: 10px; font-weight: 800; letter-spacing: 1.7px; }
.af-intro { max-width: 900px; margin: 0 auto 30px; padding: 0 16px; }
.af-intro h2,.af-contact h2 { margin: 0 0 13px; color: var(--af-blue); font-size: clamp(25px,3vw,31px); font-weight: 850; line-height: 1.16; }
.af-list { margin: 0 0 48px; border-top: 1px solid #dce6ed; }
.af-item { border-bottom: 1px solid #dce6ed; background: #fff; }
.af-item summary { position: relative; display: block; padding: 20px 48px 20px 18px; color: var(--af-blue); font-size: 17px; font-weight: 800; line-height: 1.4; cursor: pointer; list-style: none; }
.af-item summary::-webkit-details-marker { display: none; }
.af-item summary::after { content: "+"; position: absolute; top: 50%; right: 17px; transform: translateY(-50%); color: var(--af-cyan); font-size: 25px; font-weight: 400; }
.af-item[open] summary::after { content: "−"; }
.af-answer { padding: 0 20px 20px; color: var(--af-text); }
.af-answer p { font-size: 14px; }
.af-answer p:last-child { margin-bottom: 0; }
.af-contact { margin: 0 0 25px; padding: 30px 34px; background: #f2f7fb; border: 1px solid #dce8f0; border-radius: 18px; }
.af-phone { display: inline-block; margin: 5px 0 10px; color: var(--af-blue) !important; font-size: 26px; font-weight: 900 !important; text-decoration: none !important; }
.af-small { color: var(--af-muted); font-size: 12px !important; }
@media (max-width:700px) {
 .anioc-faq { width: calc(100vw - 24px); margin: 18px 0 35px; }
 .af-hero { min-height: 230px; margin-bottom: 32px; padding: 30px 22px 45px; border-radius: 0 0 19px 19px; }
 .af-hero h1 { font-size: clamp(30px,9vw,40px); }
 .af-hero p { font-size: 15px; }
 .af-hero-label { right: 17px; bottom: 13px; font-size: 8px; }
 .af-intro { margin-bottom: 22px; padding: 0 8px; }
 .af-intro h2,.af-contact h2 { font-size: 24px; }
 .af-item summary { padding: 17px 42px 17px 12px; font-size: 15px; }
 .af-answer { padding: 0 13px 17px; }
 .af-answer p { font-size: 13px; }
 .af-contact { padding: 24px 18px; }
}