/* =========================================================
   YHE BRAND SYSTEM — SPRINT 15.2
   Branding base: wellness SaaS premium + cercanía operacional
   ========================================================= */

:root {
    /* Brand palette — YoHagoEjercicio */
    --yhe-dark: #1B292B;
    --yhe-bg: #F5EFE6;
    --yhe-green: #5FA081;
    --yhe-accent: #E7FE41;
    --yhe-blue: #3D6063;

    /* Semantic states */
    --yhe-success: #5FA081;
    --yhe-success-soft: #E8F4EE;
    --yhe-warning: #E8BF63;
    --yhe-warning-soft: #FFF7DE;
    --yhe-danger: #CC6B6B;
    --yhe-danger-soft: #FCEAEA;
    --yhe-info: #3D6063;
    --yhe-info-soft: #E7F0F1;

    /* Text */
    --yhe-text: #1B292B;
    --yhe-text-soft: #a4b1b3;
    --yhe-text-light: #879394;

    /* Surfaces */
    --yhe-surface: #FFFFFF;
    --yhe-surface-soft: #FAF7F2;
    --yhe-surface-green: #EEF7F2;
    --yhe-border: #E5DED3;
    --yhe-border-strong: rgba(27, 41, 43, .16);

    /* Shape */
    --yhe-radius-sm: 10px;
    --yhe-radius-md: 16px;
    --yhe-radius-lg: 24px;
    --yhe-radius-xl: 32px;

    /* Shadows */
    --yhe-shadow-sm: 0 2px 10px rgba(27, 41, 43, .045);
    --yhe-shadow-md: 0 10px 28px rgba(27, 41, 43, .075);
    --yhe-shadow-lg: 0 22px 56px rgba(27, 41, 43, .10);

    /* Motion */
    --yhe-transition: .22s ease;

    /* Compatibility with previous layers */
    --yhe-ink: var(--yhe-dark);
    --yhe-muted: var(--yhe-text-soft);
    --yhe-soft: var(--yhe-bg);
    --yhe-accent-2: #DDE8D2;
    --yhe-radius: var(--yhe-radius-lg);
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--yhe-bg);
    color: var(--yhe-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.6;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
    color: var(--yhe-dark);
    font-weight: 750;
    letter-spacing: -.025em;
}

a {
    color: var(--yhe-blue);
    text-underline-offset: .18em;
}

a:hover {
    color: var(--yhe-dark);
}

::selection {
    background: rgba(231, 254, 65, .65);
    color: var(--yhe-dark);
}

.bg-dark {
    background-color: var(--yhe-dark) !important;
}

.bg-light {
    background-color: var(--yhe-surface-soft) !important;
}

.border,
.border-bottom,
.border-top,
.border-start,
.border-end {
    border-color: var(--yhe-border) !important;
}

.yhe-logo {
  display: inline-flex;
  align-items: center;
}

.yhe-logo img {
  height: 42px;
  width: auto;
}

.yhe-logo-sm img {
  height: 32px;
}

.yhe-logo-lg img {
  height: 64px;
}
