/* ============================================================
   LevelUP — capa de mejoras (upgrade.css)
   Todo lo nuevo vive acá, encima de styles.css + motion.css,
   usando exactamente los mismos tokens de marca. No se toca
   ningún archivo original.
   ============================================================ */

/* ---------- 1. Fix: menú móvil que dejaba ver el hero detrás ----------
   El problema original: .nav-links es position:absolute y solo alto
   según su contenido, así que lo que hubiera debajo (el hero, o en
   páginas interiores las tarjetas blancas) quedaba visible y se
   superponía justo bajo el menú. Acá lo convertimos en un panel fijo
   y de alto completo, para que cubra el mismo tramo sin importar en
   qué página o en qué punto del scroll se abra. El fondo usa 88% de
   opacidad + blur (no 100% sólido) para mantener el mismo lenguaje
   "vidrio esmerilado" que ya usa el resto del sitio (.nav.scrolled,
   .plan-card, etc.), pero el blur es suficiente para que no se lean
   las tarjetas blancas de fondo en las páginas interiores. */
@media (max-width: 1020px) {
    .nav-links.open {
        position: fixed;
        top: var(--nav-h);
        left: 0;
        right: 0;
        bottom: 0;
        /* Sin height: al fijar top Y bottom, el navegador estira la caja
           entre los dos — declarar una altura (aunque sea "auto") pisa
           ese estiramiento y el panel vuelve a encogerse a su contenido,
           el mismo bug de origen. */
        overflow-y: auto;
        background: rgba(11, 11, 13, 0.88);
        justify-content: flex-start;
        padding-bottom: 2rem;
    }
    body.nav-open { overflow: hidden; }
}
/* La barra superior (.nav.scrolled) tiene el mismo backdrop-filter y
   el mismo problema: en páginas largas, con harto contenido y capas
   con transform detrás (parallax, tablas, imágenes), el navegador
   puede dejar de calcular el blur y la barra queda prácticamente
   transparente. Se saca el blur acá también; el 96% de opacidad que
   ya tenía alcanza de sobra sin depender de él. */
.nav.scrolled {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* ---------- 2. Footer: Instagram como link real, con ícono ---------- */
.footer-links a.footer-ig {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.footer-links a.footer-ig svg { width: 14px; height: 14px; flex: none; }

/* ---------- 3. Barra CTA fija en móvil para páginas de lectura larga ---------- */
.sticky-cta {
    position: fixed;
    left: 0.75rem;
    right: 0.75rem;
    bottom: 0.75rem;
    z-index: 95;
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.85rem;
    border-radius: 999px;
    background: rgba(11, 11, 13, 0.92);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.1);
    transform: translateY(120%);
    transition: transform 260ms var(--ease-out);
}
.sticky-cta.is-visible { transform: none; }
.sticky-cta-label {
    color: #f4f1ec;
    font-family: var(--font-display);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sticky-cta .btn { flex: none; }
@media (max-width: 760px) { .sticky-cta { display: flex; } }

/* ---------- 3b. Un único punto de asistencia (concierge) ----------
   Antes había tres burbujas flotantes compitiendo entre sí — y con
   la barra de CTA "1 clase de prueba gratis / Agendar", que es la
   acción principal del sitio. Se reemplazan por un solo botón,
   chico y en la marca de LevelUP (el mismo isotipo circular del
   header), que abre un panel tipo "concierge": primero un menú de
   3 opciones (respuestas rápidas, chat humano, WhatsApp), y cada
   opción lleva a su propia vista dentro del mismo panel — nunca
   compiten varias ventanas a la vez, y el punto de entrada es uno
   solo. En mobile vive claramente por encima de la barra de CTA,
   nunca al lado ni a su misma altura. */
:root {
    --concierge-size: 52px;
    --concierge-bottom: 1.25rem;
    --concierge-right: 1.25rem;
}
@media (max-width: 760px) {
    :root { --concierge-bottom: 5.1rem; }
}
@media (max-width: 420px) {
    :root { --concierge-size: 46px; --concierge-right: 0.85rem; }
}

.concierge-fab {
    position: fixed;
    right: var(--concierge-right);
    bottom: var(--concierge-bottom);
    z-index: 91;
    width: var(--concierge-size);
    height: var(--concierge-size);
    display: grid;
    place-items: center;
    background: #0b0b0d;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.4);
    transition: transform 160ms var(--ease-out);
    opacity: 0;
    animation: conciergeIn 500ms var(--ease-out) 500ms forwards;
}
@keyframes conciergeIn { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
    .concierge-fab { animation: none; opacity: 1; }
}
.concierge-fab:hover { transform: scale(1.06); }
.concierge-fab:active { transform: scale(0.95); }
.concierge-fab img { width: 68%; height: 68%; border-radius: 50%; object-fit: cover; }
.concierge-fab .dot {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: var(--accent);
    border: 2px solid #0b0b0d;
}

.concierge-panel {
    display: none;
    position: fixed;
    right: var(--concierge-right);
    bottom: calc(var(--concierge-bottom) + var(--concierge-size) + 0.7rem);
    z-index: 101;
    width: min(320px, calc(100vw - 2rem));
    max-height: min(480px, calc(100vh - 8rem));
    flex-direction: column;
    background: #141417;
    color: #f4f1ec;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
    overflow: hidden;
}
.concierge-panel.is-open {
    display: flex;
    animation: conciergePanelIn 200ms var(--ease-out);
}
@keyframes conciergePanelIn {
    from { opacity: 0; transform: translateY(12px) scale(0.97); }
    to { opacity: 1; transform: none; }
}
/* Vista de chat: el widget de GoHighLevel necesita bastante alto real
   (cabecera + mensajes + cuadro para escribir) — en vez de quedar
   corto y obligar a scrollear adentro, mientras esa vista está
   activa el panel se estira aparte con top+bottom entre el nav y
   un margen abajo, usando casi toda la pantalla disponible. */
.concierge-panel.is-chat {
    top: calc(var(--nav-h) + 0.75rem);
    bottom: 1.4rem;
    max-height: none;
}

.concierge-head {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1rem;
    background: #0b0b0d;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    flex: none;
}
.concierge-head img { width: 26px; height: 26px; border-radius: 50%; flex: none; }
.concierge-head-text {
    flex: 1;
    min-width: 0;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.85rem;
}
.concierge-back,
.concierge-close {
    background: none;
    border: 0;
    color: #f4f1ec;
    opacity: 0.7;
    cursor: pointer;
    padding: 0.3rem;
    line-height: 1;
    display: grid;
    place-items: center;
    flex: none;
}
.concierge-back:hover, .concierge-close:hover { opacity: 1; }
.concierge-back[hidden] { display: none; }

/* [hidden] y las reglas de abajo tienen la misma especificidad
   (una clase + un atributo cada una) — sin :not([hidden]), la que
   viene después en el archivo gana siempre, oculta o no, y la
   vista de chat (el embed de GoHighLevel) se alcanzaba a filtrar
   detrás del menú. Con :not([hidden]) cada regla de "vista visible"
   solo aplica cuando de verdad no está oculta. */
.concierge-view[hidden] { display: none; }
.concierge-view[data-view="home"]:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 0.6rem;
}
.concierge-view[data-view="faq"]:not([hidden]),
.concierge-view[data-view="chat"]:not([hidden]) {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* Vista "home": el menú de 3 opciones. */
.concierge-option {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.7rem 0.8rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: #f4f1ec;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease;
}
.concierge-option:hover { background: rgba(244, 90, 22, 0.12); border-color: rgba(244, 90, 22, 0.35); }
.concierge-option-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(244, 90, 22, 0.15);
    color: var(--accent);
    flex: none;
}
.concierge-option-icon--whatsapp { background: rgba(37, 211, 102, 0.15); color: var(--whatsapp); }
.concierge-option-text { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.concierge-option-text strong {
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-size: 0.85rem;
}
.concierge-option-text small { font-size: 0.76rem; color: #aaa49b; }

/* Vista "faq": mensajes tipo chat + chips de preguntas. */
.agent-body {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.agent-msg {
    max-width: 88%;
    padding: 0.6rem 0.85rem;
    border-radius: 14px;
    font-size: 0.88rem;
    line-height: 1.5;
}
.agent-msg.bot {
    align-self: flex-start;
    background: rgba(255, 255, 255, 0.08);
    border-bottom-left-radius: 4px;
}
.agent-msg.user {
    align-self: flex-end;
    background: var(--accent-soft);
    color: #f4f1ec;
    border: 1px solid rgba(244, 90, 22, 0.4);
    border-bottom-right-radius: 4px;
}
.agent-msg a, .agent-msg-action {
    color: var(--accent);
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
    text-decoration: underline;
}
.agent-quick {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0 1rem 1rem;
    flex: none;
}
.agent-chip {
    font-family: var(--font-body);
    font-size: 0.78rem;
    color: #f4f1ec;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0.42rem 0.8rem;
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease;
}
.agent-chip:hover { background: rgba(244, 90, 22, 0.18); border-color: rgba(244, 90, 22, 0.5); }

/* Vista "chat": el embed de GoHighLevel llena todo el alto disponible. */
.concierge-chat-embed { flex: 1; min-height: 0; overflow: auto; }
.concierge-chat-embed iframe { width: 100%; height: 100%; border: 0; }

/* ---------- 5. Transición de marca antes de BoxMagic ----------
   No agrega un clic: aparece, mantiene la marca a la vista un
   instante y continúa sola. Un link "continuar ahora" evita
   la espera a quien no la quiere. */
.bm-transition {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: grid;
    place-items: center;
    background: #0b0b0d;
    color: #f4f1ec;
    text-align: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms ease;
}
.bm-transition.is-active { opacity: 1; pointer-events: auto; }
.bm-transition-inner { display: grid; gap: 0.9rem; justify-items: center; padding: 1.5rem; }
.bm-transition img { width: 52px; height: 52px; border-radius: 50%; }
.bm-transition-plan {
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 1.3rem;
}
.bm-transition-note { color: #aaa49b; font-size: 0.9rem; max-width: 28ch; }
.bm-spinner {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 3px solid rgba(244, 90, 22, 0.25);
    border-top-color: var(--accent);
    animation: bm-spin 800ms linear infinite;
}
@keyframes bm-spin { to { transform: rotate(360deg); } }
.bm-transition-skip {
    color: var(--accent);
    font-size: 0.85rem;
    text-decoration: underline;
    background: none;
    border: 0;
    cursor: pointer;
}
@media (prefers-reduced-motion: reduce) {
    .bm-spinner { animation: none; border-top-color: rgba(244, 90, 22, 0.25); }
}

/* ---------- 6. Prueba social ----------
   Plantilla lista para reseñas reales (Google / socios). Los
   textos de ejemplo están marcados explícitamente como tales:
   reemplazar antes de publicar. */
.section-proof { background: var(--bg); }
.proof-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    margin: 0 auto 2.2rem;
    width: fit-content;
    padding: 0.55rem 1.1rem;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--surface);
    font-family: var(--font-display);
    letter-spacing: 0.03em;
}
.proof-badge .stars { color: var(--accent); letter-spacing: 0.1em; }
.proof-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.1rem;
}
.proof-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 1.5rem;
}
.proof-card .stars { color: var(--accent); letter-spacing: 0.12em; font-size: 0.9rem; }
.proof-card p {
    margin-top: 0.7rem;
    color: var(--text);
    font-size: 0.95rem;
    line-height: 1.55;
}
.proof-card cite {
    display: block;
    margin-top: 0.9rem;
    font-style: normal;
    font-family: var(--font-display);
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    color: var(--muted);
}
.proof-card .proof-placeholder-tag {
    display: inline-block;
    margin-top: 0.6rem;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--accent);
    border: 1px dashed rgba(244, 90, 22, 0.5);
    border-radius: 999px;
    padding: 0.15rem 0.55rem;
}

/* ---------- 7. Páginas de entrenamiento: romper la pila de tarjetas ---------- */

/* Intro sin tarjeta: vive directo sobre la textura oscura, como el
   hero. Reusa .statement / data-split de motion.css. */
.training-flat {
    max-width: 46rem;
    /* Simétrico arriba y abajo: .training-panel no aporta margen propio,
       así que si este bloque solo empujaba hacia abajo, quedaba pegado
       contra la tarjeta anterior cuando el orden era panel → flat. */
    margin: clamp(3rem, 6vw, 4.5rem) auto;
    text-align: center;
}
.training-flat .training-kicker { justify-content: center; }
.training-flat p {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: clamp(1.3rem, 3vw, 1.7rem);
    line-height: 1.35;
    color: #f4f1ec;
    text-wrap: balance;
}
.training-flat .accent { color: var(--accent); }

/* Bloque imagen + texto a dos columnas, con parallax real sobre
   las fotos existentes del box (no se inventan fotos nuevas). */
.training-media-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
    margin: clamp(3rem, 6vw, 4.5rem) 0;
}
.training-media-grid.is-reverse .training-media-frame { order: 2; }
.training-media-frame {
    aspect-ratio: 4 / 5;
    background-size: cover;
    background-position: center;
}
.training-media-text h2 { font-size: clamp(1.7rem, 3.6vw, 2.3rem); color: #f4f1ec; }
.training-media-text p { margin-top: 0.9rem; color: var(--muted); }
@media (max-width: 860px) {
    .training-media-grid { grid-template-columns: 1fr; }
    .training-media-grid.is-reverse .training-media-frame { order: 0; }
    .training-media-frame { aspect-ratio: 16 / 10; }
}

/* Mini marquesina de vocabulario propio de cada disciplina, bajo el hero. */
.marquee-band--mini { padding: clamp(0.9rem, 2vw, 1.3rem) 0; }
.marquee-band--mini .marquee span { font-size: clamp(1.1rem, 2.6vw, 1.7rem); }

/* Icono decorativo grande semitransparente en el hero de cada disciplina. */
.training-hero-glyph {
    position: absolute;
    right: clamp(-2rem, 4vw, 2rem);
    bottom: clamp(-3rem, -2vw, -1rem);
    width: clamp(160px, 26vw, 320px);
    height: auto;
    color: rgba(244, 90, 22, 0.16);
    pointer-events: none;
}

/* Nota al vuelo: párrafo corto directo sobre la textura oscura, sin
   tarjeta, con un borde de acento para que no se pierda en el fondo.
   Sirve para separar dos bloques que de otro modo quedarían como dos
   tarjetas blancas pegadas. */
.training-note {
    max-width: 42rem;
    margin: clamp(2.5rem, 5vw, 4rem) auto;
    padding: 0.2rem 0 0.2rem 1.4rem;
    border-left: 3px solid var(--accent);
}
.training-note h2 {
    font-size: clamp(1.4rem, 3vw, 1.8rem);
    color: #f4f1ec;
    margin-bottom: 0.6rem;
}
.training-note p, .training-note li { color: #c0bbb2; }
.training-note p + p { margin-top: 0.7rem; }
.training-note ul { margin-top: 0.4rem; padding-left: 1.2rem; }
.training-note li + li { margin-top: 0.4rem; }
.training-note a { color: var(--accent); }
.training-note .training-actions { margin-top: 1.2rem; }

/* Bloque de color solido (naranja), con el mismo corte de esquina que
   la marquesina: la tercera textura pedida además del negro plano y
   la tarjeta blanca. Para un precio, una cifra o una llamada a la
   acción que merece destacarse. */
.training-callout {
    margin: clamp(2.5rem, 5vw, 4rem) 0;
    padding: clamp(1.8rem, 4vw, 2.6rem) clamp(1.6rem, 4vw, 2.4rem);
    background: var(--accent);
    color: #16110b;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1.6rem), calc(100% - 4vw) 100%, 0 100%);
}
.training-callout h2 { color: #16110b; font-size: clamp(1.4rem, 3vw, 1.8rem); }
.training-callout p { color: rgba(22, 17, 11, 0.82); margin-top: 0.5rem; }
.training-callout strong { font-family: var(--font-display); }
.training-callout .training-actions { margin-top: 1.1rem; }
.training-callout .btn-primary { background: #16110b; color: #f4f1ec; box-shadow: none; }
.training-callout .btn-primary:hover { background: #2a2016; }
.training-callout .btn-ghost { border-color: rgba(22, 17, 11, 0.4); color: #16110b; background: rgba(255,255,255,0.18); }

/* Distintivo por disciplina: mismas fotos reales del box, distinto
   encuadre y tratamiento de color por clase, para que cada página
   se sienta propia sin inventar fotografía nueva. */
.training-media-frame--crossfit {
    background-image: linear-gradient(rgba(11,11,13,0.15), rgba(11,11,13,0.5)), url("../img/hero.webp");
    background-position: center 20%;
}
.training-media-frame--hybrid {
    background-image: linear-gradient(rgba(11,11,13,0.1), rgba(11,11,13,0.55)), url("../img/hero.webp");
    background-position: center 55%;
    filter: saturate(1.15) contrast(1.05);
}
.training-media-frame--crossgap {
    background-image: linear-gradient(rgba(11,11,13,0.1), rgba(11,11,13,0.55)), url("../img/team-bg.webp");
    background-position: center 30%;
    filter: sepia(0.18) saturate(1.3) hue-rotate(-8deg);
}
.training-media-frame--crossup {
    background-image: linear-gradient(rgba(11,11,13,0.1), rgba(11,11,13,0.55)), url("../img/team-bg.webp");
    background-position: center 70%;
    filter: saturate(1.2) hue-rotate(6deg);
}
.training-media-frame--about {
    background-image: linear-gradient(rgba(11,11,13,0.1), rgba(11,11,13,0.55)), url("../img/team-bg.webp");
    background-position: center 45%;
}

/* ---------- 8. Tablas de planes/comparación en móvil ----------
   Cada página fija su propio min-width para estas tablas chicas
   (.precio-tabla, .hyrox-tabla, .cf-tabla, .resumen) en un <style>
   propio del <head>, lo que en móvil obliga a hacer scroll horizontal
   y deja columnas enteras fuera de la pantalla (el precio, "qué
   incluye"). Acá no se scrollea: se deja que la tabla ocupe el 100%
   del contenedor, se achica un poco el texto y las etiquetas largas
   pasan a dos líneas en vez de cortarse. Selector de dos clases
   (.schedule.compact-table) para ganarle en especificidad al
   min-width de cada página sin necesitar !important.
   La grilla semanal completa de /horarios/ queda afuera a propósito:
   con 7 columnas sí conviene el scroll horizontal, y ya tiene su
   propio aviso de "desliza para ver todos los días". */
@media (max-width: 640px) {
    .schedule.compact-table {
        min-width: 0;
        width: 100%;
        font-size: 0.8rem;
    }
    .compact-table th, .compact-table td {
        padding: 0.55rem 0.4rem;
        white-space: normal;
        overflow-wrap: break-word;
        hyphens: auto;
    }
    /* Los montos ($243.000) no deben partirse a mitad: en las tablas
       de "cuánto se ahorra" (money-table) las columnas 2 y 3 son
       siempre un precio suelto, nunca texto largo, así que no
       necesitan envolver. */
    .money-table td:nth-child(2),
    .money-table td:nth-child(3) {
        white-space: nowrap;
        hyphens: none;
    }
    .compact-table thead th {
        font-size: 0.7rem;
        letter-spacing: 0.02em;
        line-height: 1.25;
    }
    .compact-table tbody th {
        font-size: 0.8rem;
        white-space: normal;
    }
    .compact-table td b { font-size: 0.85rem; }
}
@media (max-width: 420px) {
    .compact-table { font-size: 0.74rem; }
    .compact-table thead th { font-size: 0.66rem; }
}

/* ---------- 9. Prueba social en páginas interiores ----------
   En el home, .section-proof es una <section> con el mismo padding
   generoso que separa cualquier otra sección (arriba y abajo). En
   las páginas interiores, en cambio, el bloque de reseñas vivía en
   un <div class="reveal"> suelto sin margen propio, así que quedaba
   pegado contra la tarjeta de FAQ de abajo — el mismo problema de
   fondo del menú "documento" que ya se corrigió en otros bloques,
   acá en el único lugar donde faltaba. */
.training-proof {
    margin: clamp(3rem, 6vw, 4.5rem) auto;
    /* .proof-badge y .proof-card son tarjetas blancas, pero viven
       dentro de .training-main (fondo oscuro), que define --text y
       --muted en su versión clara para leerse sobre negro. Sin este
       reset, el texto de la reseña hereda esos valores claros y
       queda casi invisible sobre la tarjeta blanca — el mismo ajuste
       que .training-panel/.training-list ya hacen para su propio
       contenido. */
    --text: #171612;
    --muted: #625e55;
    color: var(--text);
}

/* ---------- 10. Dos tablas seguidas dentro de la misma tarjeta ----------
   En precios/, "Plan Full" y "Plan Full AM" son dos tablas propias,
   cada una en su .schedule-wrap con borde — pero .schedule-wrap no
   tenía margen, así que quedaban pegadas borde con borde. Separa
   cualquier .schedule-wrap que venga justo después de otro. */
.schedule-wrap + .schedule-wrap {
    margin-top: 1.75rem;
}