
/* FerrolOnline v3.56.7 · Componentes fo311: lectura editorial controlada */
.fo311-wrap{width:min(1120px,calc(100% - 36px));margin:0 auto;padding:28px 0 54px;box-sizing:border-box}
.fo311-wrap .crumb{margin:0 0 22px;display:flex;gap:8px;flex-wrap:wrap;font-size:.9rem;line-height:1.5}
.fo311-wrap .fo311-hero{max-width:950px;padding:clamp(22px,4vw,42px);background:linear-gradient(135deg,#e9f3ef,#f6f8f6);border:1px solid #d1e4dc;border-radius:22px;margin-bottom:18px}
.fo311-wrap .fo311-hero span{font-size:.82rem;letter-spacing:.08em;font-weight:750;color:#08704e}
.fo311-wrap .fo311-hero h1{font-size:clamp(1.75rem,3.2vw,2.8rem);line-height:1.17;margin:14px 0 16px;max-width:22ch}
.fo311-wrap .fo311-hero p{font-size:1.07rem;line-height:1.72;max-width:72ch;margin:0}
.fo311-wrap .fo311-actions{display:flex;gap:10px;flex-wrap:wrap;margin:15px 0 23px}
.fo311-wrap .fo311-actions a{display:inline-flex;align-items:center;background:#0b7249;color:#fff;padding:11px 15px;border-radius:11px;text-decoration:none;font-weight:680;line-height:1.5}
.fo311-wrap .fo311-actions a.minor{background:#fff;color:#086b49;border:1px solid #bcd8ca}
.fo311-wrap .fo311-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:18px 0}
.fo311-wrap .fo311-box{min-width:0;padding:clamp(18px,2.4vw,27px);border:1px solid #d9e5e3;background:#fff;border-radius:17px;box-shadow:0 5px 16px rgba(19,59,69,.045);margin:0 0 16px}
.fo311-wrap .fo311-box h2{font-size:clamp(1.18rem,2vw,1.48rem);line-height:1.3;margin:0 0 12px;color:#123945}
.fo311-wrap .fo311-box p,.fo311-wrap .fo311-note{font-size:1.015rem;line-height:1.76;max-width:75ch;overflow-wrap:anywhere}
.fo311-wrap .fo311-note{padding:17px 21px;border-left:4px solid #0b7249;background:#ebf5ef;border-radius:8px}
.fo311-wrap .fo311-source{margin-top:22px}.fo311-wrap .fo311-source summary{cursor:pointer;font-weight:700;color:#09684b}
@media(max-width:720px){.fo311-wrap{width:calc(100% - 24px);padding-top:16px}.fo311-wrap .fo311-grid{grid-template-columns:1fr;gap:8px}.fo311-wrap .fo311-hero{padding:22px}.fo311-wrap .fo311-hero h1{max-width:none}.fo311-wrap .fo311-actions a{width:100%;justify-content:center}}
