:root {
    --ink: #20332b;
    --ink-soft: #53635c;
    --evergreen: #315d4c;
    --evergreen-dark: #24483b;
    --sage: #78917b;
    --mint: #edf3ed;
    --cream: #fbf8f1;
    --paper: #ffffff;
    --coral: #c96f69;
    --coral-dark: #a95652;
    --line: #d8ded7;
    --warning: #8a5b18;
    --warning-bg: #fff7e6;
    --danger: #a64040;
    --danger-bg: #fff0ef;
    --success: #2d6a4f;
    --success-bg: #edf8f1;
    --shadow-sm: 0 8px 24px rgba(32, 51, 43, 0.08);
    --shadow-lg: 0 24px 60px rgba(32, 51, 43, 0.14);
    --radius-sm: 10px;
    --radius-md: 18px;
    --radius-lg: 30px;
    --content: 1180px;
}

html { scroll-behavior: smooth; }

body {
    color: var(--ink);
    background: var(--cream);
    font-family: 'Roboto', sans-serif;
    font-size: 17px;
    line-height: 1.6;
}

body *, body *::before, body *::after { box-sizing: border-box; }

body a { color: var(--evergreen); }

body button, body input, body select, body textarea { font: inherit; }

body button, body a { -webkit-tap-highlight-color: transparent; }

body :focus-visible {
    outline: 3px solid var(--coral);
    outline-offset: 3px;
}

.skip-link {
    position: fixed;
    left: 16px;
    top: 10px;
    z-index: 5000;
    transform: translateY(-160%);
    padding: 10px 16px;
    border-radius: 8px;
    background: var(--ink);
    color: white;
    text-decoration: none;
    font-weight: 700;
}

.skip-link:focus { transform: translateY(0); }

.eyebrow {
    color: var(--coral-dark);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.btn-primary, .btn-secondary, .btn-soft, .btn-danger, .btn-link,
.btn-ingresar, .btn-confirmar, .btn-guardar, .btn-cancelar, .btn-alerta {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 13px 22px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

.btn-primary, .btn-ingresar, .btn-confirmar, .btn-guardar {
    background: var(--evergreen);
    color: white;
}

.btn-primary:hover, .btn-ingresar:hover, .btn-confirmar:hover, .btn-guardar:hover {
    background: var(--evergreen-dark);
    transform: translateY(-1px);
}

.btn-secondary, .btn-cancelar {
    background: transparent;
    color: var(--evergreen);
    border-color: var(--evergreen);
}

.btn-secondary:hover, .btn-cancelar:hover { background: var(--mint); }

.btn-soft { background: var(--mint); color: var(--evergreen-dark); }
.btn-danger { background: var(--danger-bg); color: var(--danger); border-color: #efc1bf; }
.btn-link { min-height: 44px; padding: 8px 4px; color: var(--evergreen); }

.app-live {
    min-height: 24px;
    margin-top: 14px;
    color: var(--ink-soft);
    font-size: .95rem;
}

.app-live[data-state="error"] { color: var(--danger); }
.app-live[data-state="success"] { color: var(--success); }

/* Public navigation */
body.page-home, body.page-fichas { display: block; min-height: 100vh; overflow-x: hidden; background: var(--cream); color: var(--ink); }
body.page-home { font-size: 18px; }

body.page-home #btn-menu-movil, body.page-fichas #btn-menu-movil {
    display: none;
    position: fixed;
    top: 14px;
    right: 16px;
    left: auto;
    z-index: 2200;
    width: 48px;
    height: 48px;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: var(--paper);
    color: var(--evergreen-dark);
    box-shadow: var(--shadow-sm);
    font-size: 0;
}

body.page-home #btn-menu-movil::before, body.page-fichas #btn-menu-movil::before {
    content: "Menú";
    font-size: 0.82rem;
    font-weight: 700;
}

body.page-home #sidebar, body.page-fichas #sidebar {
    position: sticky;
    top: 0;
    z-index: 2000;
    width: 100%;
    height: auto;
    min-height: 82px;
    padding: 10px max(24px, calc((100vw - var(--content)) / 2));
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 28px;
    color: var(--ink);
    background: rgba(251, 248, 241, .97);
    border: none;
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(14px);
    transform: none;
}

body.page-home .sidebar-header, body.page-fichas .sidebar-header {
    display: flex;
    align-items: center;
    min-width: 275px;
    gap: 12px;
    margin: 0;
    text-align: left;
}

body.page-home .sidebar-logo, body.page-fichas .sidebar-logo {
    width: 62px;
    height: 62px;
    margin: 0;
    padding: 0;
    border-radius: 50%;
    object-fit: cover;
    background: white;
}

body.page-home .sidebar-titulo, body.page-fichas .sidebar-titulo {
    color: var(--ink);
    font-family: 'Playfair Display', serif;
    font-size: 1.05rem;
    line-height: 1.15;
}

body.page-home .sidebar-header, body.page-fichas .sidebar-header { color: inherit; text-decoration: none; }

body.page-home .sidebar-titulo small, body.page-fichas .sidebar-titulo small {
    display: block;
    margin-top: 4px;
    color: var(--ink-soft);
    font-family: 'Roboto', sans-serif;
    font-size: .72rem;
    font-weight: 400;
}

body.page-home #mensaje-bienvenida, body.page-fichas #mensaje-bienvenida { display: none; }

body.page-home .menu-lista, body.page-fichas .menu-lista {
    display: flex;
    flex: 1;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    margin: 0;
    list-style: none;
}

body.page-home .menu-item, body.page-fichas .menu-item {
    width: auto;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 13px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--ink);
    font-size: .92rem;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    transform: none;
}

body.page-home .menu-item:hover, body.page-home .menu-item.activo,
body.page-fichas .menu-item:hover, body.page-fichas .menu-item.activo {
    color: var(--evergreen-dark);
    background: var(--mint);
    transform: none;
}

body.page-home #enlaces-auth, body.page-home #enlaces-perfil {
    display: flex;
    align-items: center;
    gap: 4px;
}

body.page-home #enlaces-auth li, body.page-home #enlaces-perfil li { display: inline-flex; }

body.page-home .indicador-ws, body.page-fichas .indicador-ws,
body.page-home .wp-burbuja-maps, body.page-fichas .wp-burbuja-maps { display: none; }

body.page-home .wp-burbuja, body.page-fichas .wp-burbuja {
    background: var(--evergreen);
    color: white;
    justify-content: center;
    min-width: 128px;
}

body.page-home #contenido-principal, body.page-fichas #contenido-principal {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Home */
.hero-section {
    min-height: 620px;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr);
    align-items: stretch;
    gap: 0;
    padding: 0;
    border-bottom: 1px solid var(--line);
    background: var(--cream);
}

.hero-visual {
    min-width: 0;
    min-height: 620px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 22px;
    margin: 0;
    padding: 54px 34px 38px;
    background: linear-gradient(145deg, #dce7db, #b8cbb9);
}
.hero-visual img {
    width: min(100%, 430px);
    aspect-ratio: 1;
    object-fit: cover;
    object-position: center 15%;
    display: block;
    border: 8px solid rgba(255,255,255,.78);
    border-radius: 48% 48% 20px 20px;
    box-shadow: 0 20px 46px rgba(35, 67, 52, .17);
}
.hero-visual figcaption { display: flex; flex-direction: column; align-items: center; color: var(--evergreen-dark); text-align: center; line-height: 1.35; }
.hero-visual figcaption strong { font-family: 'Playfair Display', serif; font-size: 1.55rem; }
.hero-visual figcaption span { font-size: 1rem; }

.hero-content {
    max-width: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: clamp(44px, 6vw, 88px) clamp(30px, 6vw, 100px);
    background: var(--cream);
    position: relative;
    z-index: 1;
}

.hero-content h1 {
    max-width: 660px;
    margin: 14px 0 20px;
    color: var(--ink);
    font-family: 'Playfair Display', serif;
    font-size: clamp(2.8rem, 5vw, 5rem);
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p {
    max-width: 610px;
    margin: 0 0 28px;
    color: var(--ink);
    font-size: 1.12rem;
    line-height: 1.6;
}

.hero-botones { width: 100%; max-width: 420px; display: flex; flex-direction: column; gap: 12px; }
.hero-botones a { width: 100%; min-height: 58px; font-size: 1.02rem; }
.hero-botones .btn-primary { background: var(--evergreen); }
.hero-botones .btn-primary:hover { background: var(--evergreen-dark); }
.hero-access { margin: 20px 0 0 !important; font-size: 1rem !important; color: var(--ink-soft) !important; }
.hero-access a { font-weight: 700; text-underline-offset: 3px; }

.trust-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
}

.trust-item { min-height: 106px; padding: 24px; text-align: center; border-right: 1px solid var(--line); }
.trust-item:last-child { border-right: 0; }
.trust-item strong { display: block; color: var(--ink); }
.trust-item span { color: var(--ink-soft); font-size: .9rem; }

.section-shell { max-width: var(--content); margin: 0 auto; padding: 84px 24px; }
.section-heading { max-width: 700px; margin-bottom: 42px; }
.section-heading h2, .titulo-seccion {
    margin: 8px 0 12px;
    color: var(--ink);
    font-family: 'Playfair Display', serif;
    font-size: clamp(2.25rem, 4vw, 3.8rem);
    line-height: 1.05;
}
.section-heading p { color: var(--ink-soft); }

.profesional-section { background: var(--paper); }
.profesional-grid { max-width: var(--content); margin: 0 auto; padding: 90px 24px; display: grid; grid-template-columns: minmax(320px, .85fr) minmax(0, 1.15fr); gap: clamp(40px, 8vw, 100px); align-items: center; }
.profesional-intro { min-height: 350px; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(30px, 5vw, 54px); border-radius: var(--radius-lg); background: var(--mint); border: 1px solid var(--line); }
.profesional-intro p { max-width: 410px; margin: 16px 0 0; color: var(--evergreen-dark); font-family: 'Playfair Display', serif; font-size: clamp(2rem, 3.5vw, 3.5rem); line-height: 1.16; }
.profesional-copy h2 { margin: 12px 0 8px; font-family: 'Playfair Display', serif; font-size: clamp(2.3rem, 4vw, 4rem); line-height: 1.05; color: var(--ink); }
.profesional-copy h3 { margin-bottom: 24px; color: var(--coral-dark); font-size: 1.15rem; }
.profesional-copy p { max-width: 650px; margin-bottom: 18px; color: var(--ink-soft); font-size: 1.05rem; }
.profesional-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

body.page-home .contenedor { max-width: none; margin: 0; padding: 0; scroll-margin-top: 90px; background: var(--cream); }
body.page-home .cabecera-filtros { max-width: var(--content); margin: 0 auto; padding: 86px 24px 32px; border: 0; align-items: end; }
body.page-home #filtro-orden { min-height: 50px; padding: 10px 40px 10px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); color: var(--ink); }
body.page-home #lista-productos { max-width: var(--content); margin: 0 auto; padding: 0 24px 88px; display: flex; flex-direction: column; gap: 0; }

.tarjeta-servicio {
    min-height: 220px;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr) 220px;
    align-items: stretch;
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    cursor: default;
    overflow: visible;
    transition: background-color .2s ease;
}
.tarjeta-servicio:last-child { border-bottom: 1px solid var(--line); }
.tarjeta-servicio:hover { transform: none; border-color: var(--line); box-shadow: none; background: rgba(255,255,255,.45); }
.imagen-servicio { width: 100%; height: 220px; object-fit: cover; background: var(--mint); }
.imagen-servicio--logo { padding: 22px; object-fit: contain; }
.cuerpo-tarjeta { padding: 30px 34px; display: flex; justify-content: center; }
.nombre-servicio { color: var(--ink); font-family: 'Playfair Display', serif; font-size: 1.65rem; line-height: 1.15; }
.descripcion-servicio { margin-top: 9px; color: var(--ink-soft); }
.servicio-accion { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 30px 20px 30px 0; }
.precio-servicio { margin: 0 0 16px; color: var(--coral-dark); font-family: 'Playfair Display', serif; font-size: 1.7rem; }
.btn-reservar-falso { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 10px 18px; border-radius: 999px; border: 1px solid var(--evergreen); background: var(--evergreen); color: white; font-weight: 700; }
.tarjeta-servicio:hover .btn-reservar-falso { background: var(--evergreen-dark); color: white; border-color: var(--evergreen-dark); }
.badge-promo { top: 16px; left: 16px; right: auto; border-radius: 6px; background: var(--coral); color: white; animation: none; box-shadow: none; letter-spacing: .06em; }

.booking-guide { background: var(--evergreen-dark); color: white; }
.booking-guide .section-shell { display: grid; grid-template-columns: .85fr 1.4fr; gap: 80px; align-items: center; }
.booking-guide h2 { margin: 12px 0 18px; color: white; font-family: 'Playfair Display', serif; font-size: clamp(2.3rem, 4vw, 4rem); line-height: 1.05; }
.booking-guide p { color: #dbe6df; }
.booking-steps { display: flex; flex-direction: column; }
.booking-step { display: grid; grid-template-columns: 48px 1fr; gap: 18px; padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.booking-step:last-child { border-bottom: 0; }
.booking-step-number { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; font-weight: 700; }
.booking-step strong { display: block; margin-bottom: 4px; font-size: 1.08rem; }
.booking-step span { color: #cddbd2; }

.gallery-section { background: #f3efe7; }
.gallery-shell { max-width: var(--content); margin: 0 auto; padding: 78px 24px; }
.gallery-shell .hero-carrusel { position: relative; max-width: none; width: 100%; height: 560px; margin-top: 30px; overflow: hidden; border: 0; border-radius: var(--radius-lg); background: #e7e1d6; box-shadow: none; }
.gallery-shell .slide { background-size: contain; background-color: #e7e1d6; }

.modal-alerta { background: rgba(24, 38, 32, .72); }
.modal-cuerpo { width: min(460px, calc(100% - 32px)); padding: 34px; border: 0; border-top: 0; border-radius: var(--radius-md); background: var(--paper); color: var(--ink); box-shadow: var(--shadow-lg); transform: translateY(14px); }
.modal-alerta.activa .modal-cuerpo { transform: translateY(0); }
.modal-cuerpo h2 { margin-bottom: 10px; color: var(--ink); font-family: 'Playfair Display', serif; }
.modal-cuerpo p { color: var(--ink-soft); }
.modal-actions { display: grid; gap: 10px; margin-top: 24px; }

/* Authentication */
body.page-auth { min-height: 100vh; display: grid; place-items: center; padding: 34px; background: var(--cream); color: var(--ink); }
.auth-shell { width: min(1060px, 100%); min-height: 660px; display: grid; grid-template-columns: .9fr 1.1fr; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--paper); box-shadow: var(--shadow-lg); }
.auth-brand { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 44px; color: white; background: var(--evergreen-dark); overflow: hidden; }
.auth-brand-logo { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; background: white; }
.auth-brand h1 { max-width: 420px; margin: 28px 0 14px; color: white; font-family: 'Playfair Display', serif; font-size: clamp(2.5rem, 4vw, 4rem); line-height: 1.02; }
.auth-brand p { max-width: 430px; color: #d8e4dc; }
.auth-help { margin-top: 30px; color: white; font-weight: 700; }
.auth-form-panel { padding: clamp(34px, 6vw, 70px); align-self: center; }
.auth-form-panel h2 { margin: 8px 0 10px; color: var(--ink); font-family: 'Playfair Display', serif; font-size: 2.4rem; }
.auth-form-panel > p { margin-bottom: 28px; color: var(--ink-soft); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.field-full { grid-column: 1 / -1; }
body.page-auth label, body.page-booking label {
    display: block;
    margin: 18px 0 7px;
    color: var(--ink);
    font-weight: 700;
}
body.page-auth input, body.page-booking input {
    width: 100%;
    min-height: 52px;
    padding: 12px 14px;
    border: 1px solid #bfc9c1;
    border-radius: var(--radius-sm);
    background: white;
    color: var(--ink);
}
.form-note { margin-top: 8px; color: var(--ink-soft); font-size: .9rem; }
.grupo-check { min-height: 52px; display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--mint); }
.grupo-check label { margin: 0 !important; color: var(--ink) !important; }
.grupo-check input { width: 22px !important; min-height: 22px !important; height: 22px; }
body.page-auth .btn-ingresar { width: 100%; margin-top: 26px; }
.auth-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 20px; }
.auth-links .enlace { margin: 0; color: var(--evergreen); text-align: left; }

/* Booking */
body.page-booking { min-height: 100vh; display: block; padding: 0; background: var(--cream); color: var(--ink); }
.simple-header { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 10px max(24px, calc((100vw - var(--content)) / 2)); border-bottom: 1px solid var(--line); background: var(--paper); }
.simple-brand { display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.simple-brand img { width: 62px; height: 62px; border-radius: 50%; object-fit: cover; }
.simple-brand strong { font-family: 'Playfair Display', serif; }
.simple-header > a:last-child { min-height: 46px; }
.booking-layout { max-width: 1040px; margin: 0 auto; padding: 64px 24px 90px; display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 44px; align-items: start; }
.booking-summary { position: sticky; top: 108px; padding: 28px; border-radius: var(--radius-md); background: var(--evergreen-dark); color: white; }
.booking-summary h1 { margin: 8px 0 18px; color: white; font-family: 'Playfair Display', serif; font-size: 2.3rem; line-height: 1.05; }
.booking-summary p { color: #d8e4dc; }
.summary-item { margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.2); }
.summary-item span { display: block; color: #bfd0c4; font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; }
.summary-item strong { display: block; margin-top: 5px; font-size: 1.15rem; }
.caja-reserva { padding: clamp(26px, 5vw, 48px); border: 1px solid var(--line); border-top: 0; border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-sm); }
.caja-reserva h2 { margin-bottom: 4px; color: var(--ink); font-family: 'Playfair Display', serif; font-size: 2.2rem; }
.booking-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 28px; }
.progress-step { padding: 10px; border-bottom: 3px solid var(--line); color: var(--ink-soft); font-size: .88rem; font-weight: 700; }
.progress-step.activo { border-color: var(--coral); color: var(--ink); }
.aviso-importante { margin: 26px 0; padding: 18px; border: 1px solid #e8cf9d; border-radius: var(--radius-sm); background: var(--warning-bg); color: #5f461d; text-align: left; }
.grilla-horarios { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 12px 0 20px; }
.btn-hora { min-height: 50px; border: 1px solid var(--evergreen); border-radius: 10px; background: white; color: var(--evergreen); font-weight: 700; }
.btn-hora.seleccionado { background: var(--evergreen); color: white; }
.btn-hora:disabled { background: #f0f1ef; color: #838c86; border-color: #d7dcd8; text-decoration: line-through; }
body.page-booking .btn-confirmar { width: 100%; margin-top: 24px; }
.direccion-clinica { margin: 18px 0 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.2); text-align: left; }
.direccion-clinica a { color: white; }

/* Patient records */
body.page-fichas #contenido-principal { max-width: 980px; margin: 0 auto; padding: 72px 24px 90px; }
.titulo-pagina { margin: 10px 0 8px; color: var(--ink); font-family: 'Playfair Display', serif; font-size: clamp(2.6rem, 5vw, 4.4rem); line-height: 1; }
.subtitulo-pagina { margin-bottom: 44px; color: var(--ink-soft); font-size: 1.08rem; }
#contenedor-fichas { max-width: none; display: flex; flex-direction: column; gap: 16px; }
.tarjeta-ficha { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 30px; padding: 28px; border: 1px solid var(--line); border-left: 5px solid var(--sage); border-radius: var(--radius-md); background: var(--paper); box-shadow: var(--shadow-sm); color: var(--ink); }
.tarjeta-ficha:hover { transform: none; border-color: var(--sage); }
.ficha-header { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 10px; padding: 0; margin: 0; border: 0; }
.ficha-fecha { color: var(--ink); font-size: 1.05rem; }
.ficha-badge { padding: 5px 10px; border: 1px solid #a9cbb6; border-radius: 999px; background: var(--success-bg); color: var(--success); }
.ficha-servicio { color: var(--ink); font-family: 'Playfair Display', serif; font-size: 1.55rem; }
.ficha-notas-titulo { margin-top: 12px; color: var(--ink-soft); font-size: .82rem; letter-spacing: .08em; }
.ficha-notas { margin-top: 7px; padding: 16px; border: 0; border-radius: var(--radius-sm); background: var(--mint); color: var(--ink); font-style: normal; }
.verification-banner { margin: 0 0 24px; padding: 22px; border: 1px solid #b9d2c2; border-radius: var(--radius-md); background: var(--mint); }
.verification-banner h2 { margin: 0 0 8px; color: var(--ink); font-size: 1.3rem; }
.verification-banner p { margin: 0 0 16px; }
.verification-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.verification-actions button { min-height: 52px; }
.verification-banner .app-live { margin: 12px 0 0; }
.mensaje-vacio { padding: 48px 28px; border: 1px dashed #aebbb2; border-radius: var(--radius-md); background: var(--paper); color: var(--ink-soft); text-align: center; }

/* Admin */
body.page-admin { display: flex; min-height: 100vh; background: #f4f6f3; color: var(--ink); }
body.page-admin #sidebar { position: sticky; top: 0; width: 270px; height: 100vh; flex: 0 0 270px; padding: 28px 18px; border-right: 1px solid var(--line); background: var(--evergreen-dark); color: white; }
.admin-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 32px; padding: 0 8px; }
.admin-brand img { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; background: white; }
.admin-brand strong { display: block; font-family: 'Playfair Display', serif; font-size: 1.05rem; }
.admin-brand span { display: block; color: #c9d8ce; font-size: .78rem; }
.admin-nav-label { margin: 24px 12px 8px; color: #a9c1b1; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
body.page-admin .menu-item { min-height: 48px; display: flex; align-items: center; gap: 10px; margin: 4px 0; padding: 11px 13px; border: 0; border-radius: 10px; background: transparent; color: white; font-size: .92rem; text-decoration: none; }
body.page-admin .menu-item:hover, body.page-admin .menu-item.activo { background: rgba(255,255,255,.12); }
#btn-menu-admin { display: none; }
body.page-admin #contenido-principal { flex: 1; min-width: 0; max-width: 1500px; padding: 42px clamp(22px, 4vw, 56px) 80px; }
.admin-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.admin-page-header h1 { margin-top: 6px; font-family: 'Playfair Display', serif; font-size: clamp(2.2rem, 3vw, 3.4rem); line-height: 1; }
.admin-page-header p { color: var(--ink-soft); }
.admin-quick-links { display: flex; flex-wrap: wrap; gap: 10px; }
.admin-quick-links a { min-height: 46px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 15px; border: 1px solid var(--line); border-radius: 999px; background: white; color: var(--ink); text-decoration: none; font-weight: 600; }
.panel-seccion { scroll-margin-top: 24px; margin-bottom: 24px; padding: clamp(24px, 3vw, 34px); border: 1px solid var(--line); border-top: 1px solid var(--line); border-radius: var(--radius-md); background: white; box-shadow: var(--shadow-sm); }
.panel-seccion h2, .cabecera-seccion h2 { margin: 0 0 8px; padding: 0; border: 0; color: var(--ink); font-family: 'Playfair Display', serif; font-size: 1.85rem; }
.panel-intro { margin-bottom: 24px; color: var(--ink-soft); }
.cabecera-seccion { margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
body.page-admin label { display: block; margin: 16px 0 7px; color: var(--ink); font-weight: 700; }
body.page-admin input[type="text"], body.page-admin input[type="number"], body.page-admin input[type="file"], body.page-admin input[type="time"], body.page-admin input[type="date"], body.page-admin textarea {
    width: 100%; min-height: 50px; padding: 11px 13px; border: 1px solid #bcc8bf; border-radius: 9px; background: white; color: var(--ink); color-scheme: light;
}
.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.checkbox-container { min-height: 54px; display: flex; align-items: center; gap: 12px; margin: 18px 0; padding: 13px; border: 1px solid #b9d2c2; border-radius: var(--radius-sm); background: var(--mint); color: var(--ink); }
.checkbox-container label { margin: 0 !important; }
.dias-container { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 18px; }
.dia-check { min-height: 48px; display: inline-flex; align-items: center; padding: 10px 15px; border: 1px solid var(--line); border-radius: 999px; background: white; color: var(--ink); }
.dia-check:has(input:checked) { border-color: var(--evergreen); background: var(--evergreen); color: white; }
.caja-botones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.caja-botones > * { flex: 1 1 190px; }
.btn-cancelar { display: none; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-sm); }
body.page-admin table { width: 100%; margin: 0; border-collapse: collapse; }
body.page-admin th, body.page-admin td { padding: 14px; border-bottom: 1px solid var(--line); color: var(--ink); vertical-align: top; }
.professional-notes-dialog { width: min(560px, calc(100% - 32px)); max-height: 80vh; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--paper); color: var(--ink); box-shadow: var(--shadow-lg); }
.professional-notes-dialog::backdrop { background: rgba(24, 38, 32, .72); }
.professional-notes-dialog h2 { margin: 0 0 16px; font-family: 'Playfair Display', serif; }
.professional-notes-dialog p { max-height: 50vh; overflow: auto; margin: 0 0 24px; white-space: pre-wrap; overflow-wrap: anywhere; }
body.page-admin th { background: #f0f3f0; color: var(--ink-soft); font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }
.btn-accion { min-height: 38px; margin: 2px 4px 2px 0; padding: 7px 10px; border: 1px solid transparent; border-radius: 8px; font-weight: 700; }
.btn-pago { background: #fff0c7; color: #6f4c0a; border-color: #e9ce85; }
.btn-completar { background: var(--success-bg); color: var(--success); border-color: #b7d8c2; }
.btn-editar { background: #edf3f8; color: #315d7d; border-color: #bfd0dd; }
.btn-borrar { background: transparent; color: var(--danger); border-color: #dfb6b3; }
.badge-estado { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 999px; font-size: .8rem; font-weight: 700; }
.st-pendiente { background: var(--warning-bg); color: #6c4a11; }
.st-confirmado { background: var(--success-bg); color: var(--success); }
.admin-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 24px; }
.admin-stat { padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-md); background: white; }
.admin-stat span { display: block; color: var(--ink-soft); font-size: .86rem; }
.admin-stat strong { display: block; margin-top: 5px; font-family: 'Playfair Display', serif; font-size: 1.8rem; }
.producto-admin { display: flex; align-items: center; gap: 12px; min-width: 220px; }
.producto-admin img { width: 64px; height: 54px; flex: 0 0 auto; border-radius: 8px; object-fit: cover; background: var(--mint); }
.producto-admin strong { display: block; }
.promo-admin { display: inline-flex; margin-top: 5px; padding: 3px 7px; border-radius: 999px; background: #fff0ef; color: var(--danger); font-size: .72rem; font-weight: 700; }
.modal-alerta .modal-cuerpo { color: var(--ink); }
#contenido-imprimir { background: white; color: black; }

/* Carousel administration */
body.page-gallery-admin { min-height: 100vh; display: block; padding: 0; background: #f4f6f3; color: var(--ink); }
.gallery-admin-layout { max-width: 1080px; margin: 0 auto; padding: 56px 24px 90px; }
body.page-gallery-admin .contenedor { max-width: none; width: 100%; margin: 0; padding: clamp(26px, 4vw, 44px); border: 1px solid var(--line); border-radius: var(--radius-md); background: white; box-shadow: var(--shadow-sm); }
body.page-gallery-admin h1 { margin: 12px 0 8px; color: var(--ink); font-family: 'Playfair Display', serif; font-size: clamp(2.4rem, 4vw, 3.8rem); }
body.page-gallery-admin p.desc { color: var(--ink-soft); }
.caja-subida { margin: 30px 0 42px; padding: 28px; border: 1px dashed var(--sage); border-radius: var(--radius-md); background: var(--mint); text-align: left; }
body.page-gallery-admin input[type="file"] { width: 100%; min-height: 52px; margin: 0 0 14px; color: var(--ink); }
body.page-gallery-admin button { min-height: 50px; padding: 11px 20px; border-radius: 999px; background: var(--evergreen); color: white; }
.grilla-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; }
.foto-item { align-items: stretch; padding: 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: white; }
.foto-item img { width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: contain; border-radius: 8px; background: #f0eee8; }
.foto-item .btn-eliminar { background: transparent; color: var(--danger); border: 1px solid #dfb6b3; }
.btn-volver { min-height: 46px; display: inline-flex; align-items: center; padding: 10px 15px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); background: white; }

@media (max-width: 1000px) {
    .hero-section { grid-template-columns: 1.1fr .9fr; }
    .tarjeta-servicio { grid-template-columns: 220px minmax(0, 1fr) 180px; }
    .booking-guide .section-shell { grid-template-columns: 1fr; gap: 34px; }
    body.page-admin #sidebar { width: 230px; flex-basis: 230px; }
}

@media (max-width: 820px) {
    body.page-home #btn-menu-movil, body.page-fichas #btn-menu-movil { display: block; }
    body.page-home #sidebar, body.page-fichas #sidebar {
        position: fixed;
        inset: 0 0 auto 0;
        min-height: 78px;
        display: block;
        padding: 8px 76px 8px 16px;
        transform: none;
    }
    body.page-home #sidebar.abierto, body.page-fichas #sidebar.abierto { height: 100vh; overflow-y: auto; }
    body.page-home .sidebar-header, body.page-fichas .sidebar-header { min-width: 0; }
    body.page-home .sidebar-logo, body.page-fichas .sidebar-logo { width: 58px; height: 58px; }
    body.page-home .menu-lista, body.page-fichas .menu-lista {
        display: none;
        align-items: stretch;
        flex-direction: column;
        gap: 5px;
        padding: 26px 0;
    }
    body.page-home #sidebar.abierto .menu-lista, body.page-fichas #sidebar.abierto .menu-lista { display: flex; }
    body.page-home #enlaces-auth, body.page-home #enlaces-perfil { flex-direction: column; align-items: stretch; }
    body.page-home .menu-item, body.page-fichas .menu-item { width: 100%; justify-content: flex-start; min-height: 52px; padding: 12px 14px; }
    body.page-home .wp-burbuja, body.page-fichas .wp-burbuja { margin-top: 10px; }
    .hero-section { min-height: 0; grid-template-columns: 1fr; padding-top: 78px; }
    .hero-visual { min-height: 0; order: 2; padding: 36px 24px; }
    .hero-visual img { width: min(100%, 360px); }
    .hero-content { order: 1; padding: 50px 24px 48px; text-align: left; align-items: flex-start; }
    .hero-content h1 { font-size: clamp(2.8rem, 12vw, 4rem); }
    .trust-strip { grid-template-columns: 1fr; }
    .trust-item { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
    .profesional-grid { grid-template-columns: 1fr; padding: 64px 24px; }
    .profesional-intro { min-height: 250px; }
    body.page-home .cabecera-filtros { align-items: stretch; flex-direction: column; padding-top: 64px; }
    .tarjeta-servicio { grid-template-columns: 150px minmax(0, 1fr); }
    .imagen-servicio { height: 100%; min-height: 210px; }
    .servicio-accion { grid-column: 2; padding: 0 24px 24px; }
    .gallery-shell .hero-carrusel { height: 520px; }
    .auth-shell { grid-template-columns: 1fr; }
    .auth-brand { min-height: 360px; }
    .booking-layout { grid-template-columns: 1fr; padding-top: 38px; }
    .booking-summary { position: static; }
    .tarjeta-ficha { grid-template-columns: 1fr; gap: 18px; }
    .ficha-header { flex-direction: row; align-items: center; justify-content: space-between; }
    body.page-admin { display: block; }
    #btn-menu-admin { display: inline-flex; position: fixed; top: 14px; right: 14px; z-index: 2500; min-height: 48px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 999px; background: white; color: var(--ink); font-weight: 700; }
    body.page-admin #sidebar { position: fixed; inset: 0 auto 0 0; z-index: 2400; width: min(310px, 88vw); height: 100vh; transform: translateX(-105%); transition: transform .25s ease; }
    body.page-admin #sidebar.abierto { transform: translateX(0); }
    body.page-admin #contenido-principal { padding: 84px 18px 60px; }
    .admin-page-header { align-items: flex-start; flex-direction: column; }
    .admin-stat-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    body { font-size: 16px; }
    body.page-home { font-size: 18px; }
    .hero-visual { padding: 28px 20px 32px; }
    .hero-visual img { width: min(100%, 310px); }
    .hero-content { padding: 38px 20px 46px; }
    .hero-content h1 { font-size: clamp(2.55rem, 11vw, 3.25rem); }
    .section-shell, .profesional-grid, .gallery-shell { padding-left: 18px; padding-right: 18px; }
    .profesional-intro { min-height: 220px; }
    .tarjeta-servicio { display: block; padding-bottom: 22px; }
    .imagen-servicio { height: 210px; }
    .cuerpo-tarjeta { padding: 22px 18px 12px; }
    .servicio-accion { padding: 0 18px; }
    .btn-reservar-falso { width: 100%; }
    .gallery-shell .hero-carrusel { height: 460px; }
    body.page-auth { padding: 12px; }
    .auth-shell { border-radius: 18px; }
    .auth-brand { min-height: 300px; padding: 28px; }
    .auth-brand-logo { width: 76px; height: 76px; }
    .auth-brand h1 { margin: 18px 0 10px; font-size: 2.15rem; }
    .auth-brand p { font-size: .96rem; }
    .auth-help { margin-top: 18px; font-size: .92rem; }
    .auth-form-panel { padding: 30px 22px; }
    .form-grid { grid-template-columns: 1fr; }
    .field-full { grid-column: auto; }
    .simple-header { padding: 8px 16px; }
    .simple-brand span { display: none; }
    .simple-header > a:last-child { padding: 8px 12px; }
    .booking-layout { padding: 28px 16px 60px; }
    .caja-reserva { padding: 24px 18px; }
    .booking-progress { grid-template-columns: 1fr; }
    .progress-step { border-bottom-width: 1px; border-left: 3px solid var(--line); }
    .progress-step.activo { border-left-color: var(--coral); }
    .grilla-horarios { grid-template-columns: repeat(2, 1fr); }
    body.page-fichas #contenido-principal { padding: 118px 16px 60px; }
    .ficha-header { align-items: flex-start; flex-direction: column; }
    .form-row { grid-template-columns: 1fr; gap: 0; }
    .panel-seccion { padding: 22px 16px; }
    body.page-admin th, body.page-admin td { min-width: 130px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}