/* Source: page/educacion.php */
/* HERO */
            .hero-section {
                background: linear-gradient(135deg, #00a75d, #28a745, #007bff);
                color: #fff;
                padding: 70px 0 45px;
                text-align: center;
            }
            .hero-section h1 {
                font-size: 3.2rem;
                font-weight: 500;
            }
            .hero-section p {
                font-size: 1.3rem;
                opacity: .95;
            }
            /*  TÍTULOS  */
            .accordion-section {
                padding: 80px 0;
                background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 50%, #f8f9fa 100%);
            }
            .title-section {
                font-size: 3rem;
                font-weight: 700;
                text-align: center;
                margin-bottom: 25px;
                background: linear-gradient(45deg, #00a75d, #007bff, #28a745);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                background-clip: text;
            }
            .subtitle-section {
                font-size: 1.25rem;
                color: #6c757d;
                text-align: center;
                margin-bottom: 80px;
            }
            /*  DESPLEGABLES  */
            .accordion-item {
                background: #fff;
                border-radius: 20px;
                margin-bottom: 20px;
                box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
                border: 1px solid rgba(0,167,93,0.15);
                overflow: hidden;
                transition: all 0.3s ease;
            }
            .accordion-item:hover {
                box-shadow: 0 12px 36px rgba(0, 0, 0, 0.12);
                transform: translateY(-2px);
            }
            .accordion-button {
                background: linear-gradient(135deg, #1F9D6A, #34D399);
                color: #fff;
                padding: 25px 30px;
                border: none;
                font-size: 1.1rem;
                font-weight: 600;
                text-align: left;
                transition: all 0.3s ease;
                display: flex;
                align-items: center;
                justify-content: space-between;
                width: 100%;
            }
            .accordion-button:not(.collapsed) {
                background: linear-gradient(135deg, #28a745, #00a75d);
                color: #fff;
            }
            .accordion-button:hover {
                background: linear-gradient(135deg, #28a745, #00a75d);
                transform: scale(1.02);
                filter: brightness(1.05);
                transform: none;
            }
            .accordion-button:focus {
                box-shadow: 0 0 0 0.2rem rgba(0,167,93,0.25);
            }
            .accordion-button span {
                word-break: break-word;
            }
            .icon-badge {
            background: rgba(255,255,255,0.25);
            color: #ffffff;
            width: 50px;
            height: 50px;
            min-width: 50px;     
            min-height: 50px;
            aspect-ratio: 1 / 1; 
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            flex-shrink: 0;       
            }
            .accordion-button:hover .icon-badge {
                background: rgba(255,255,255,0.35);
                transform: rotate(6deg);
            }
            .accordion-body {
                padding: 30px;
                background: #F9FAFB;
                color: #1F2937;
                text-align: justify;
                line-height: 1.7;
                animation: fadeIn 0.4s ease-out;
            }
            .accordion-body ul { 
                padding-left: 25px; 
                margin: 15px 0; 
            }
            .accordion-body li { 
                margin-bottom: 10px; 
            }
            .accordion-body strong { 
                color: #1F9D6A;
            }
            /* ANIMACION */
            @keyframes fadeIn {
                from { opacity: 0; transform: translateY(10px); }
                to { opacity: 1; transform: translateY(0); }
            }
            /* RESPONSIVE */
            @media (max-width: 768px) {
                .hero-section h1 { font-size: 2.2rem; }
                .title-section { font-size: 2.2rem; }
                .accordion-button { padding: 20px; font-size: 1rem; }
                .accordion-body { padding: 20px; }
            .icon-badge {
                    width: 45px;
                    height: 45px;
                    min-width: 45px;
                    min-height: 45px;
                    font-size: 20px;
                }
            }
    /* ================= SECCIONES ================= */

            .section{
                padding:90px 0;
            }

            .section-light{
                background:#ffffff;
            }

            .section-gray{
                background:linear-gradient(180deg,#f7f9fc,#ffffff);
            }
            /* ================= TITULOS ================= */
            .section-title{
                font-size:2.4rem;
                font-weight:600;
                color:#0a4f6d;
                text-align:center;
            }
            .section-subtitle{
                font-size:1.1rem;
                color:#6c757d;
                margin-top:10px;
                text-align:center;
            }
            .line{
                width:70px;
                height:4px;
                background:#00a75d;
                margin:25px auto 40px;
                border-radius:10px;
            }
            /* ================= GRID ================= */
            .content-grid{
                display:grid;
                grid-template-columns:1fr 2fr;
                gap:55px;
                align-items:center;
            }
            /* ================= TARJETAS ================= */
            .content-card,
            .media-card{
                background:#ffffff;
                border-radius:22px;
                padding:45px;
                box-shadow:0 15px 45px rgba(0,0,0,.06);
                border:1px solid #eef1f5;
                transition:all .35s ease;
            }
            .content-card:hover,
            .media-card:hover{
                transform:translateY(-8px);
                box-shadow:0 25px 70px rgba(0,0,0,.12);
            }
            /* ================= TITULO CARD ================= */
            .card-title{
                font-size:1.7rem;
                font-weight:600;
                color:#0a4f6d;
                margin-bottom:18px;
            }
            /* ================= TEXTO ================= */
            .content-text{
                font-size:1.05rem;
                line-height:1.9;
                color:#5f6368;
                margin-bottom:35px;
            }
            .content-text strong{
                color:#00a75d;
            }
            /* ================= BOTONES ================= */
            .btn-custom{
                background:linear-gradient(135deg,#00a75d,#28a745);
                border:none;
                border-radius:40px;
                padding:16px 32px;
                font-weight:600;
                font-size:1.05rem;
                color:#fff;
                text-decoration:none;
                display:block;
                width:100%;
                margin-bottom:15px;
                text-align:center;
                box-shadow:0 8px 25px rgba(0,167,93,.3);
                transition:.3s;
            }
            .btn-custom:hover{
                transform:translateY(-3px);
                box-shadow:0 15px 40px rgba(0,167,93,.35);
            }
            .btn-outline-custom{
                border:2px solid #00a75d;
                color:#00a75d;
                border-radius:40px;
                padding:14px 30px;
                font-weight:600;
                text-decoration:none;
                display:block;
                width:100%;
                text-align:center;
                transition:.3s;
            }
            .btn-outline-custom:hover{
                background:#00a75d;
                color:#fff;
            }
            /* ================= MEDIA ================= */
            .media-content,
            .media-iframe{
                width:100%;
                max-width:620px;
                height:360px;
                border-radius:18px;
                object-fit:cover;
                border:none;
                display:block;
                margin:auto;
            }
            /* ================= RESPONSIVE ================= */
            @media(max-width:992px){
            .content-grid{
                grid-template-columns:1fr;
            }
            .media-content,
            .media-iframe{
                height:300px;
            }
            }
            @media(max-width:768px){
            .hero-section h1{
                font-size:2.3rem;
            }
            .section-title{
                font-size:2rem;
            }
            .content-card,
            .media-card{
                padding:30px;
            }
            .media-content,
            .media-iframe{
                height:240px;
            }

            }