/* ───────── COACHING ───────── */

/* Reset mínimo útil */
img{max-width:100%; height:auto; display:block;}
.card{border-radius:14px; box-shadow:0 8px 26px rgba(0,0,0,.08);}

/* ───────── Hero IGUAL QUE EN INICIO ───────── */
.hero-section.coach-hero{
    color:#fff;
    text-align:center;
    min-height: 100svh;
    display:flex;
    align-items: stretch;                 /* permite que el .container ocupe todo el alto */
    padding: 140px 0 0;                   /* espacio superior por la navbar; sin padding abajo */
    background:
            linear-gradient(rgba(0,0,0,.45), rgba(0,0,0,.28)),
            url('/assets/img/coaching/hero.jpg') center/cover no-repeat;
}
/* el contenedor ocupa todo y empuja el contenido hacia abajo con aire */
.hero-section.coach-hero > .container{
    display:flex;
    flex-direction: column;
    justify-content: flex-end;            /* ↓ coloca el bloque al fondo */
    min-height: calc(100svh - 140px);     /* asegura altura útil tras el padding-top */
    padding-bottom: clamp(56px, 14vh, 168px); /* aire inferior, sin quedar apretado */
}

.hero-section.coach-hero h1{
    font-size: clamp(2.4rem, 5vw, 4rem);
    font-weight: 700;
    color:#fff;                           /* blanco puro para contraste */
    text-shadow: 2px 2px 4px rgba(0,0,0,.3);
    margin-bottom: .8rem;
}
.hero-section.coach-hero .lead{
    font-size: clamp(1.05rem, 2.2vw, 1.35rem);
    color:#f3f6f8;                        /* blanco suave distinto al título */
    text-shadow: 1px 1px 2px rgba(0,0,0,.3);
    margin-bottom: 1.6rem;
}

/* Responsive como en Inicio */
@media (max-width: 991px){
    .hero-section.coach-hero{
        min-height: 65vh;
        padding: 120px 0 0;              /* navbar */
    }
    .hero-section.coach-hero > .container{
        min-height: calc(65vh - 120px);
        padding-bottom: clamp(40px, 12vh, 120px);
    }
}

/* ───────── Pizarras (mismo estilo que Qui sóc) ───────── */
.chalk-row > [class*="col-"]{ display:flex; }
.chalk-frame{
    display:flex; flex:1; border-radius:16px; padding:18px; position:relative; overflow:hidden;
    background:
            repeating-linear-gradient(12deg, #caa277 0 14px, #b4875b 14px 28px, #caa277 28px 42px, #a8764e 42px 56px),
            repeating-linear-gradient(12deg, rgba(255,255,255,.06) 0 2px, transparent 2px 6px),
            linear-gradient(to bottom, rgba(0,0,0,.05), rgba(0,0,0,0) 40%, rgba(0,0,0,.06) 100%);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.25), 0 10px 28px rgba(0,0,0,.18);
}
.chalk-frame::before{
    content:""; position:absolute; inset:0; border-radius:16px; pointer-events:none;
    background:
            radial-gradient(rgba(255,255,255,.08), transparent 60%) 0 0 / 18px 18px repeat,
            radial-gradient(rgba(0,0,0,.06), transparent 60%) 8px 6px / 22px 22px repeat;
    mix-blend-mode: overlay; opacity:.35;
}
.chalkboard{
    background:#2f3b2f; color:#fff; border-radius:10px; padding:28px 24px;
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.04);
    position:relative; overflow:hidden;
    display:flex; flex-direction:column; flex:1;
}
@media (min-width: 992px){
    .chalkboard{ min-height: 460px; }
}
.chalkboard::before{
    content:""; position:absolute; inset:0; pointer-events:none;
    background:
            radial-gradient(transparent 55%, rgba(255,255,255,.03) 56%) 0 0 / 6px 6px,
            radial-gradient(rgba(255,255,255,.02), transparent 60%) 0 0 / 10px 10px;
}
.chalk-title{
    color:#fff; margin-bottom:14px; display:flex; align-items:center; gap:.5rem;
    font-family:"Zen Antique Soft", Georgia, serif;
}
.chalk-title i{ color:#fff; opacity:.92; }
.chalk-sub{ color:#dfe8df; opacity:.9; margin-top:-4px; margin-bottom:10px; }
.chalk-list{ list-style:none; margin:0; padding:0; }
.chalk-list li{
    color:#f7f7f7; font-size:1rem; padding:6px 0 6px 26px; position:relative;
    text-shadow:0 1px 0 rgba(255,255,255,.25), 0 0 6px rgba(255,255,255,.12);
}
.chalk-list li::before{
    content:"—"; position:absolute; left:0; top:6px; color:#fff; opacity:.9;
}

/* ───────── Media “Connexió Autèntica” ───────── */
.feature-media{
    width:100%; max-width:520px; margin-inline:auto;
    border-radius:18px; overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
}
.feature-media img{
    width:100%; height:100%;
    object-fit:cover; aspect-ratio:4/3; display:block;
}

/* ───────── Tarjetas “Per què Cavalls?” ───────── */
.card-banner{ overflow:hidden; }
.banner-card-img{
    width:100%; aspect-ratio: 16/9; object-fit:cover; display:block;
    border-bottom:1px solid rgba(0,0,0,.06);
}

.icon-xl{ font-size:3rem; line-height:1; margin-bottom:16px; }
.card h5{ margin-bottom:.5rem; }

/* Bloques de color (coherentes con Home) */
.container-green{
    background: rgba(223,243,164,0.57);
    border-radius: 20px; padding:48px 28px; margin:40px 0;
}
.container-pink{
    background: rgba(252,210,232,0.58);
    border-radius: 20px; padding:48px 28px; margin:40px 0;
}