/* =========================================================
   FLAUTEA 178-B
   Digitaciones · rutinas, partituras y práctica guiada
   ========================================================= */


/* ---------------------------------------------------------
   RUTINAS DE ESTUDIO
   --------------------------------------------------------- */

#ftm-ejercicios-progresivos{
    margin:2.4rem 0;
    padding:1.6rem;
    border:1px solid rgba(83,145,151,.24);
    border-radius:18px;
    background:#f8fbfa;
}

#ftm-ejercicios-progresivos .ftm-progressive__intro{
    margin-bottom:1.35rem;
}

#ftm-ejercicios-progresivos .ftm-eyebrow,
#ftm-partituras-ejercicios .ftm-eyebrow,
#ftm-plan-estudio .ftm-eyebrow{
    display:block;
    margin-bottom:.45rem;
    color:#007f79;
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}

#ftm-ejercicios-progresivos h3,
#ftm-plan-estudio h3{
    margin:.1rem 0 .65rem;
    color:#123c45;
    font-size:1.45rem;
    line-height:1.3;
}

#ftm-ejercicios-progresivos .ftm-progressive__intro p,
#ftm-plan-estudio .ftm-study-plan__head p{
    max-width:850px;
    margin:.4rem 0 0;
    line-height:1.7;
}

#ftm-ejercicios-progresivos .ftm-progressive__grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1rem;
    margin-top:1.35rem;
}

#ftm-ejercicios-progresivos .ftm-progressive__card{
    min-width:0;
    padding:1.15rem;
    border:1px solid rgba(83,145,151,.22);
    border-radius:14px;
    background:#fff;
    box-shadow:0 5px 18px rgba(26,64,72,.035);
}

#ftm-ejercicios-progresivos .ftm-progressive__top{
    display:flex;
    justify-content:space-between;
    gap:.7rem;
    align-items:center;
    margin-bottom:.75rem;
    color:#557078;
    font-size:.82rem;
}

#ftm-ejercicios-progresivos .ftm-progressive__level{
    display:inline-flex;
    align-items:center;
    padding:.25rem .55rem;
    border-radius:999px;
    background:#e7f4f1;
    color:#087970;
    font-weight:800;
}

#ftm-ejercicios-progresivos h4{
    margin:.15rem 0 .75rem;
    color:#143c45;
    font-size:1.02rem;
}

#ftm-ejercicios-progresivos ol{
    margin:.55rem 0 0;
    padding-left:1.25rem;
}

#ftm-ejercicios-progresivos li{
    margin:.48rem 0;
    line-height:1.55;
}


/* ---------------------------------------------------------
   PARTITURAS
   --------------------------------------------------------- */

#ftm-partituras-ejercicios{
    margin:2.2rem 0;
    padding:1.5rem;
    border:1px solid rgba(83,145,151,.24);
    border-radius:18px;
    background:#fff;
}

#ftm-partituras-ejercicios .ftm-sheet-head{
    margin-bottom:1.25rem;
}

#ftm-partituras-ejercicios .ftm-sheet-head h4{
    margin:.1rem 0 .45rem;
    color:#123c45;
    font-size:1.35rem;
}

#ftm-partituras-ejercicios .ftm-sheet-head p{
    margin:0;
    line-height:1.65;
}

#ftm-partituras-ejercicios .ftm-sheet-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1rem;
    align-items:start;
}

#ftm-partituras-ejercicios .ftm-sheet-card{
    min-width:0;
    padding:1rem;
    border:1px solid #d6e4e3;
    border-radius:14px;
    background:#f9fbfb;
}

#ftm-partituras-ejercicios .ftm-sheet-card h5{
    margin:0 0 .25rem;
    color:#153e47;
    font-size:.98rem;
}

#ftm-partituras-ejercicios .ftm-sheet-card > p{
    margin:.15rem 0 .85rem;
    color:#52676e;
    font-size:.9rem;
}

/*
 * Las partituras antes ocupaban prácticamente todo el ancho.
 * Aquí quedan contenidas dentro de tarjetas y con tamaño máximo.
 */
#ftm-partituras-ejercicios .ftm-sheet-card > a:first-of-type{
    display:block;
    width:100%;
    max-width:390px;
    margin:0 auto;
}

#ftm-partituras-ejercicios .ftm-sheet-card img{
    display:block;
    width:100%;
    max-width:390px;
    height:auto;
    margin:0 auto;
    border:1px solid #dde7e6;
    border-radius:8px;
    background:#fff;
}

#ftm-partituras-ejercicios .ftm-sheet-download{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:.85rem;
    padding:.55rem .85rem;
    border:1px solid #9bc9c4;
    border-radius:999px;
    color:#08756f;
    background:#fff;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

#ftm-partituras-ejercicios .ftm-sheet-download:hover{
    background:#edf8f6;
}


/* ---------------------------------------------------------
   PRACTICA GUIADA
   --------------------------------------------------------- */

#ftm-plan-estudio{
    margin:2.4rem 0;
    padding:1.6rem;
    border:1px solid rgba(83,145,151,.24);
    border-radius:18px;
    background:#f7fbfa;
}

#ftm-plan-estudio .ftm-study-plan__head{
    margin-bottom:1.3rem;
}

#ftm-plan-estudio .ftm-study-plan__grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1rem;
}

#ftm-plan-estudio .ftm-study-plan__card{
    min-width:0;
    padding:1.15rem;
    border:1px solid rgba(83,145,151,.22);
    border-radius:14px;
    background:#fff;
}

#ftm-plan-estudio .ftm-study-plan__label{
    display:inline-flex;
    margin-bottom:.65rem;
    padding:.25rem .6rem;
    border-radius:999px;
    background:#e5f4f1;
    color:#08776f;
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.04em;
}

#ftm-plan-estudio h4{
    margin:.1rem 0 .7rem;
    color:#143c45;
    font-size:1.03rem;
}

#ftm-plan-estudio ol{
    padding-left:1.25rem;
    margin:.45rem 0 .8rem;
}

#ftm-plan-estudio li{
    margin:.5rem 0;
    line-height:1.55;
}

#ftm-plan-estudio .ftm-study-plan__goal{
    margin:.8rem 0 0;
    padding:.65rem .75rem;
    border-left:3px solid #58a098;
    background:#f2f8f7;
}

#ftm-plan-estudio .ftm-study-plan__routine{
    margin-top:1.25rem;
    padding:1.15rem;
    border-radius:14px;
    background:#eaf5f3;
}

#ftm-plan-estudio .ftm-study-plan__routine h4{
    margin-top:0;
}

#ftm-plan-estudio .ftm-study-plan__schedule{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:.65rem;
    margin:1rem 0;
}

#ftm-plan-estudio .ftm-study-plan__schedule > div{
    padding:.75rem;
    border-radius:10px;
    background:#fff;
    text-align:center;
}

#ftm-plan-estudio .ftm-study-plan__schedule strong{
    display:block;
    color:#08776f;
    font-size:1rem;
}

#ftm-plan-estudio .ftm-study-plan__schedule span{
    display:block;
    margin-top:.25rem;
    color:#445e65;
    font-size:.82rem;
    line-height:1.35;
}

#ftm-ejercicios-progresivos .ftm-progressive__tip{
    margin-top:1.2rem;
    padding:.9rem 1rem;
    border-left:3px solid #579f97;
    background:#edf7f5;
    line-height:1.6;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media(max-width:950px){

    #ftm-ejercicios-progresivos .ftm-progressive__grid,
    #ftm-partituras-ejercicios .ftm-sheet-grid,
    #ftm-plan-estudio .ftm-study-plan__grid{
        grid-template-columns:1fr 1fr;
    }

    #ftm-plan-estudio .ftm-study-plan__schedule{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:650px){

    #ftm-ejercicios-progresivos,
    #ftm-partituras-ejercicios,
    #ftm-plan-estudio{
        padding:1rem;
        border-radius:14px;
    }

    #ftm-ejercicios-progresivos .ftm-progressive__grid,
    #ftm-partituras-ejercicios .ftm-sheet-grid,
    #ftm-plan-estudio .ftm-study-plan__grid{
        grid-template-columns:1fr;
    }

    #ftm-partituras-ejercicios .ftm-sheet-card > a:first-of-type,
    #ftm-partituras-ejercicios .ftm-sheet-card img{
        max-width:330px;
    }

    #ftm-plan-estudio .ftm-study-plan__schedule{
        grid-template-columns:1fr;
    }
}
