/* Página «Fundamentos pedagógicos» · clases .oelf */
.oelf { --oelf-brand: #005b57; --oelf-accent: #f4775c; --oelf-ink: #14343a; --oelf-muted: #46636a; --oelf-line: #d6e6e3; --oelf-soft: #eef7f5;
  box-sizing: border-box; max-width: 980px; margin: 0 auto; padding: 8px 0 30px; color: var(--oelf-ink); line-height: 1.65; font-family: inherit; font-size: 17px; }
.oelf *, .oelf *::before, .oelf *::after { box-sizing: border-box; }
.oelf-head { padding: 4px 0 18px; border-bottom: 1px solid var(--oelf-line); margin-bottom: 20px; }
.oelf-kicker { display: inline-block; margin: 0 0 10px; padding: 5px 14px; border-radius: 999px; background: var(--oelf-soft); color: var(--oelf-brand); font-weight: 700; font-size: 14px; }
.oelf-head h2 { margin: 0 0 8px; font-size: clamp(30px, 4vw, 42px); line-height: 1.1; color: var(--oelf-ink); }
.oelf-lead { margin: 0 0 8px; font-size: 19px; color: var(--oelf-muted); max-width: 800px; }
.oelf-meta { margin: 0; font-size: 14px; color: #6b8087; }
.oelf-index { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.oelf-index a { padding: 7px 14px; border-radius: 999px; border: 2px solid var(--oelf-line); font-size: 14px; font-weight: 700; color: var(--oelf-brand); text-decoration: none; background: #fff; }
.oelf-index a:hover { border-color: var(--oelf-brand); }
.oelf-box { padding: 16px 20px; border: 2px solid var(--oelf-line); border-radius: 16px; background: #fafcfb; margin: 0 0 24px; }
.oelf-legend p { margin: 0 0 8px; } .oelf-legend ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; } .oelf-legend li { font-size: 15.5px; color: var(--oelf-muted); }
.oelf-warn { background: #fff8f1; border-color: #f6d2c4; }
.oelf-sec { margin: 0 0 34px; scroll-margin-top: 90px; }
.oelf-sec h3 { margin: 0 0 12px; font-size: 26px; line-height: 1.2; color: var(--oelf-ink); }
.oelf-sec h4 { margin: 8px 0 6px; font-size: 19px; line-height: 1.25; }
.oelf-sec p { margin: 0 0 12px; }
.oelf-tag { display: inline-block; margin-right: 8px; padding: 2px 11px; border-radius: 99px; font-size: 12.5px; font-weight: 800; vertical-align: middle; white-space: nowrap; }
.t-norm { background: #e1f1ee; color: #005b57; } .t-did { background: #e6eefb; color: #2a4f8f; } .t-own { background: #fff1d6; color: #8a5a00; }
.oelf-tablewrap { overflow-x: auto; margin: 6px 0 14px; border: 2px solid var(--oelf-line); border-radius: 14px; }
.oelf-table { width: 100%; border-collapse: collapse; font-size: 15.5px; background: #fff; }
.oelf-table th, .oelf-table td { padding: 12px 14px; vertical-align: top; text-align: left; border-bottom: 1px solid var(--oelf-line); }
.oelf-table thead th { background: var(--oelf-soft); color: var(--oelf-brand); font-size: 14px; }
.oelf-table tbody th { width: 22%; background: #fafcfb; font-weight: 400; } .oelf-table tbody th span { color: var(--oelf-muted); font-size: 13.5px; }
.oelf-table tr:last-child th, .oelf-table tr:last-child td { border-bottom: 0; }
.oelf-table ul { margin: 0; padding-left: 18px; } .oelf-table li { margin: 0 0 6px; }
.oelf-note { padding: 12px 16px; border-left: 4px solid var(--oelf-accent); background: #fff8f5; border-radius: 0 12px 12px 0; font-size: 15.5px; color: #3d4f54; }
.oelf-principles { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 16px; margin: 6px 0 16px; }
.oelf-principles article { padding: 16px 18px; border: 2px solid var(--oelf-line); border-radius: 16px; background: #fff; }
.oelf-principles p { font-size: 15.5px; color: var(--oelf-muted); margin: 0; }
.oelf-list { margin: 8px 0 14px; padding-left: 22px; } .oelf-list li { margin: 0 0 8px; }
.oelf-refs { padding-left: 20px; font-size: 15px; color: var(--oelf-muted); } .oelf-refs li { margin: 0 0 8px; }
@media (max-width: 640px) { .oelf { font-size: 16px; } .oelf-table tbody th { width: auto; } }
@media print { .oelf-index { display: none; } .oelf-tablewrap { overflow: visible; } }