/* ==========================================================================
   ELITE MED PRO INC — main stylesheet
   Every class ends with the "-yogavelo" suffix (future domain name).
   ========================================================================== */

/* ---------- Design tokens ---------- */
:root {
    /* Base palette */
    --primary: #d14a55;
    --primary-rgb: 209, 74, 85;
    --primarydark: #b03842;
    --primarylight: #fbeef0;
    --secondary: #1e2433;
    --secondary-rgb: 30, 36, 51;
    --secondarydark: #141925;
    --light: #fcf6f7;
    --body-bg: #ffffff;
    --body-color: #626a7a;
    --heading-color: #1e2433;

    /* Fonts */
    --font-sub-title: "Playfair Display", Georgia, serif;
    --font-poppins: "Poppins", "sans-serif";
    --font-arizonia: "Arizonia", "cursive";
    --font-montserrat: "Montserrat";
    --font-serif-display: "DM Serif Display";
    --font-kanit: "Kanit";
    --font-Tenor-Sans: "Tenor Sans", sans-serif;

    /* Colors */
    --color-primary: var(--primary);
    --color-primary-30: rgba(var(--primary-rgb), 0.03);
    --color-primary-50: rgba(var(--primary-rgb), 0.05);
    --color-primary-70: rgba(var(--primary-rgb), 0.07);
    --color-primary-100: rgba(var(--primary-rgb), 0.1);
    --color-primary-200: rgba(var(--primary-rgb), 0.2);
    --color-primary-300: rgba(var(--primary-rgb), 0.3);
    --color-primary-400: rgba(var(--primary-rgb), 0.4);
    --color-primary-500: rgba(var(--primary-rgb), 0.5);
    --color-primary-600: rgba(var(--primary-rgb), 0.6);
    --color-primary-700: rgba(var(--primary-rgb), 0.7);
    --color-primary-800: rgba(var(--primary-rgb), 0.8);
    --color-primary-900: rgba(var(--primary-rgb), 0.9);
    --color-primarydark: var(--primarydark);
    --color-primarylight: var(--primarylight);
    --color-secondary: var(--secondary);
    --color-secondary-rgb: var(--secondary-rgb);
    --color-secondarydark: var(--secondarydark);
    --color-light-rgb: 236, 245, 251;
    --color-white-rgb: 255, 255, 255;
    --color-light: var(--light);
    --color-bodybg: var(--body-bg);
    --color-bodycolor: var(--body-color);
    --color-heading: var(--heading-color);
    --color-border: #E1EBF1;

    /* Layout */
    --container: 1240px;
    --gutter: 16px;
    --header-h: 84px;
    --radius-sm: 12px;
    --radius: 20px;
    --radius-lg: 32px;
    --shadow-sm: 0 6px 18px rgba(var(--secondary-rgb), 0.06);
    --shadow: 0 18px 50px rgba(var(--secondary-rgb), 0.10);
    --shadow-red: 0 14px 34px rgba(var(--primary-rgb), 0.32);
    --ease: cubic-bezier(.22, .61, .36, 1);
}

@media (min-width: 768px) {
    :root { --gutter: 24px; }
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-h) + 12px);
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: var(--font-poppins);
    font-size: 16px;
    line-height: 1.7;
    color: var(--color-bodycolor);
    background: var(--color-bodybg);
    overflow-x: hidden;
    overflow-x: clip;
    -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3, h4 {
    font-family: var(--font-montserrat), "Poppins", sans-serif;
    color: var(--color-heading);
    line-height: 1.2;
    letter-spacing: -0.01em;
}

:focus-visible {
    outline: 3px solid var(--color-primary);
    outline-offset: 3px;
    border-radius: 4px;
}

.sr-only-yogavelo {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}

.skip-link-yogavelo {
    position: fixed; top: 10px; left: 10px; z-index: 1000;
    padding: 10px 18px; background: var(--color-secondary); color: #fff;
    border-radius: 8px; translate: 0 -150%; transition: translate .2s;
}
.skip-link-yogavelo:focus { translate: 0 0; }

.container-yogavelo {
    width: 100%;
    max-width: calc(var(--container) + var(--gutter) * 2);
    margin-inline: auto;
    padding-inline: var(--gutter);
}

.section-yogavelo { padding-block: clamp(72px, 9vw, 120px); position: relative; }

/* Decorative circles/shadows must never widen the page on phones */
main { overflow-x: clip; }

/* ---------- White icons (from /img-icons) ---------- */
.icon-tile-yogavelo img,
.icon-badge-yogavelo img,
.icon-circle-yogavelo img,
.about-bubble-yogavelo img,
.header-call-icon-yogavelo img,
.cta-mini-icon-yogavelo img,
.hero-badge-icon-yogavelo img {
    filter: brightness(0) invert(1);
    object-fit: contain;
}

.icon-tile-yogavelo,
.icon-badge-yogavelo,
.icon-circle-yogavelo {
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    background: linear-gradient(140deg, var(--color-primary) 0%, var(--color-primarydark) 100%);
    box-shadow: var(--shadow-red);
}
.icon-tile-yogavelo { width: 64px; height: 64px; border-radius: 18px; }
.icon-tile-yogavelo img { width: 30px; height: 30px; }
.icon-tile-lg-yogavelo { width: 76px; height: 76px; border-radius: 22px; }
.icon-tile-lg-yogavelo img { width: 38px; height: 38px; }
.icon-badge-yogavelo { width: 48px; height: 48px; border-radius: 14px; }
.icon-badge-yogavelo img { width: 24px; height: 24px; }
.icon-badge-lg-yogavelo { width: 58px; height: 58px; border-radius: 50%; }
.icon-badge-lg-yogavelo img { width: 28px; height: 28px; }
.icon-circle-yogavelo { width: 62px; height: 62px; border-radius: 50%; }
.icon-circle-yogavelo img { width: 30px; height: 30px; }

/* ---------- Typography helpers ---------- */
.tag-yogavelo {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 18px;
    margin-bottom: 18px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--color-primary-200), var(--color-primary-50));
    color: var(--color-primary);
    font-weight: 500;
    font-size: 15px;
}
.tag-yogavelo::before {
    content: "";
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--color-primary);
    box-shadow: 0 0 0 4px var(--color-primary-200);
}
.tag-dark-yogavelo { background: rgba(var(--primary-rgb), .18); color: #ff8f99; }

.section-title-yogavelo {
    font-size: clamp(30px, 4.2vw, 48px);
    font-weight: 700;
    margin-bottom: 20px;
}
.accent-yogavelo {
    font-family: var(--font-sub-title);
    font-style: italic;
    font-weight: 600;
    color: var(--color-primary);
    letter-spacing: 0;
}
.section-lead-yogavelo { font-size: 17px; max-width: 640px; }

.section-head-yogavelo {
    text-align: center;
    max-width: 760px;
    margin: 0 auto clamp(40px, 6vw, 64px);
}
.section-head-yogavelo .section-lead-yogavelo { margin-inline: auto; }

/* ---------- Buttons ---------- */
.btn-yogavelo {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 12px 30px;
    border: 2px solid transparent;
    border-radius: 999px;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    cursor: pointer;
    text-align: center;
    transition: background-color .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), translate .3s var(--ease), box-shadow .3s var(--ease);
    overflow: hidden;
    isolation: isolate;
}
.btn-yogavelo:hover { translate: 0 -2px; }
.btn-lg-yogavelo { min-height: 60px; padding: 14px 38px; font-size: 17px; }

.btn-primary-yogavelo {
    background: var(--color-primary);
    color: #fff;
    box-shadow: var(--shadow-red);
}
.btn-primary-yogavelo::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.35) 50%, transparent 80%);
    translate: -120% 0;
    transition: translate .7s var(--ease);
}
.btn-primary-yogavelo:hover { background: var(--color-primarydark); }
.btn-primary-yogavelo:hover::after { translate: 120% 0; }

.btn-outline-yogavelo {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: transparent;
}
.btn-outline-yogavelo:hover { background: var(--color-primary); color: #fff; }

.btn-outline-light-yogavelo { border-color: rgba(255,255,255,.5); color: #fff; }
.btn-outline-light-yogavelo:hover { background: #fff; color: var(--color-secondary); }

.btn-ghost-yogavelo { background: var(--color-primary-70); color: var(--color-heading); }
.btn-ghost-yogavelo:hover { background: var(--color-primary-200); }

.btn-white-yogavelo { background: #fff; color: var(--color-primary); box-shadow: 0 12px 30px rgba(0,0,0,.15); }
.btn-white-yogavelo:hover { background: var(--color-secondary); color: #fff; }

.btn-arrow-yogavelo {
    position: relative;
    display: inline-block;
    width: 16px;
    height: 2px;
    background: currentColor;
    transition: translate .3s var(--ease);
}
.btn-arrow-yogavelo::after {
    content: "";
    position: absolute;
    right: 0; top: 50%;
    width: 8px; height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    translate: 0 -50%;
    rotate: 45deg;
}
.btn-yogavelo:hover .btn-arrow-yogavelo { translate: 4px 0; }

.link-btn-yogavelo {
    background: none; border: 0; padding: 0; cursor: pointer;
    color: inherit; font-size: inherit;
}
.link-btn-yogavelo:hover { color: var(--color-primary); }

/* ---------- Header ---------- */
.header-yogavelo {
    position: fixed;
    inset: 0 0 auto;
    z-index: 100;
    height: var(--header-h);
    display: flex;
    align-items: center;
    color: #fff;
    transition: background-color .35s var(--ease), box-shadow .35s var(--ease), height .35s var(--ease), color .35s;
}
.header-inner-yogavelo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.header-yogavelo.is-scrolled-yogavelo,
.page-legal-yogavelo .header-yogavelo {
    --header-h: 74px;
    background: rgba(255,255,255,.94);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: 0 8px 30px rgba(var(--secondary-rgb), .08);
    color: var(--color-heading);
}

.logo-yogavelo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}
.logo-mark-yogavelo {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    transition: rotate .4s var(--ease);
}
.logo-mark-yogavelo img { grid-area: 1 / 1; width: 100%; height: 100%; object-fit: contain; }
/* Light logo on the dark transparent header, original logo on the white header */
.logo-img-dark-yogavelo { opacity: 0; transition: opacity .3s; }
.logo-img-light-yogavelo { transition: opacity .3s; }
.header-yogavelo.is-scrolled-yogavelo .logo-img-dark-yogavelo,
.page-legal-yogavelo .header-yogavelo .logo-img-dark-yogavelo { opacity: 1; }
.header-yogavelo.is-scrolled-yogavelo .logo-img-light-yogavelo,
.page-legal-yogavelo .header-yogavelo .logo-img-light-yogavelo { opacity: 0; }
.logo-yogavelo:hover .logo-mark-yogavelo { rotate: -8deg; }
.logo-text-yogavelo { display: flex; flex-direction: column; line-height: 1.05; }
.logo-name-yogavelo {
    font-family: var(--font-montserrat), sans-serif;
    font-weight: 800;
    font-size: 21px;
    letter-spacing: -.02em;
}
.logo-name-yogavelo em {
    font-family: var(--font-sub-title);
    font-weight: 600;
    color: var(--color-primary);
}

.nav-list-yogavelo { display: flex; align-items: center; gap: 4px; }
.nav-link-yogavelo {
    position: relative;
    display: block;
    padding: 8px 14px;
    font-weight: 500;
    font-size: 15.5px;
    transition: color .25s;
}
.nav-link-yogavelo::after {
    content: "";
    position: absolute;
    left: 14px; right: 14px; bottom: 2px;
    height: 2px;
    border-radius: 2px;
    background: var(--color-primary);
    scale: 0 1;
    transform-origin: left;
    transition: scale .3s var(--ease);
}
.nav-link-yogavelo:hover,
.nav-link-yogavelo.is-active-yogavelo { color: var(--color-primary); }
.nav-link-yogavelo:hover::after,
.nav-link-yogavelo.is-active-yogavelo::after { scale: 1 1; }
.nav-mobile-extra-yogavelo { display: none; }

.header-actions-yogavelo { display: flex; align-items: center; gap: 22px; }
.header-call-yogavelo { display: flex; align-items: center; gap: 12px; }
.header-call-icon-yogavelo {
    display: grid; place-items: center;
    width: 48px; height: 48px;
    border-radius: 50%;
    background: var(--color-primary);
    box-shadow: 0 0 0 6px var(--color-primary-200);
    animation: pulse-yogavelo 2.4s infinite;
}
.header-call-icon-yogavelo img { width: 26px; height: 26px; }
.header-call-text-yogavelo { display: flex; flex-direction: column; line-height: 1.3; }
.header-call-text-yogavelo small { font-size: 12.5px; opacity: .75; }
.header-call-text-yogavelo strong { font-size: 16px; font-weight: 600; white-space: nowrap; }
.header-cta-yogavelo { min-height: 48px; padding: 10px 24px; }

@keyframes pulse-yogavelo {
    0%, 100% { box-shadow: 0 0 0 0 rgba(var(--primary-rgb), .45); }
    60% { box-shadow: 0 0 0 12px rgba(var(--primary-rgb), 0); }
}

.burger-yogavelo {
    display: none;
    position: relative;
    width: 48px; height: 48px;
    border: 0;
    border-radius: 14px;
    background: var(--color-primary);
    cursor: pointer;
    z-index: 120;
}
.burger-yogavelo span {
    position: absolute;
    left: 13px; right: 13px;
    height: 2px;
    border-radius: 2px;
    background: #fff;
    transition: translate .3s var(--ease), rotate .3s var(--ease), opacity .2s;
}
.burger-yogavelo span:nth-child(1) { top: 16px; }
.burger-yogavelo span:nth-child(2) { top: 23px; }
.burger-yogavelo span:nth-child(3) { top: 30px; }
.burger-yogavelo[aria-expanded="true"] span:nth-child(1) { translate: 0 7px; rotate: 45deg; }
.burger-yogavelo[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger-yogavelo[aria-expanded="true"] span:nth-child(3) { translate: 0 -7px; rotate: -45deg; }

.nav-backdrop-yogavelo {
    position: fixed; inset: 0; z-index: 90;
    background: rgba(var(--secondary-rgb), .55);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}

/* ---------- Config toast ---------- */
.cfg-toast-yogavelo {
    position: fixed;
    top: 16px; left: 50%;
    translate: -50% 0;
    z-index: 400;
    display: flex; align-items: center; gap: 14px;
    width: max-content;
    max-width: calc(100% - 32px);
    padding: 14px 18px 14px 22px;
    border-radius: 14px;
    color: #fff;
    font-weight: 500;
    box-shadow: var(--shadow);
    animation: toast-in-yogavelo .5s var(--ease);
}
.cfg-toast-ok-yogavelo { background: #1f8a5b; }
.cfg-toast-err-yogavelo { background: var(--color-primarydark); }
.cfg-toast-close-yogavelo {
    border: 0; background: rgba(255,255,255,.2); color: #fff;
    width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 20px; line-height: 1;
}
@keyframes toast-in-yogavelo { from { opacity: 0; translate: -50% -20px; } }

/* ---------- Hero ---------- */
.hero-yogavelo {
    position: relative;
    min-height: max(760px, 100svh);
    display: flex;
    flex-direction: column;
    padding: calc(var(--header-h) + 30px) 0 0;
    color: rgba(255,255,255,.82);
    overflow: hidden;
    isolation: isolate;
    background: var(--color-secondarydark);
}
.hero-media-yogavelo { position: absolute; inset: 0; z-index: -1; }
.hero-bg-yogavelo {
    position: absolute;
    inset: -8% 0 0;
    width: 100%;
    height: 116%;
    object-fit: cover;
    opacity: .55;
    scale: 1.05;
    animation: hero-zoom-yogavelo 18s ease-out both;
    will-change: transform;
}
@keyframes hero-zoom-yogavelo { from { scale: 1.18; } to { scale: 1.05; } }

.hero-overlay-yogavelo {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(60% 70% at 78% 45%, rgba(var(--primary-rgb), .38) 0%, transparent 70%),
        linear-gradient(100deg, rgba(20,25,37,.97) 0%, rgba(20,25,37,.9) 42%, rgba(30,36,51,.62) 100%),
        linear-gradient(0deg, rgba(20,25,37,.9) 0%, transparent 35%);
}
.hero-pattern-yogavelo {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,.14) 1px, transparent 1.4px);
    background-size: 26px 26px;
    -webkit-mask-image: linear-gradient(110deg, transparent 30%, #000 70%);
    mask-image: linear-gradient(110deg, transparent 30%, #000 70%);
    opacity: .5;
}
.hero-ecg-yogavelo {
    position: absolute;
    left: 0; right: 0;
    top: 52%;
    width: 100%;
    height: 160px;
    opacity: .55;
}
.hero-ecg-yogavelo path {
    fill: none;
    stroke: var(--color-primary);
    stroke-width: 2.5;
    stroke-linejoin: round;
    stroke-dasharray: 1600;
    stroke-dashoffset: 1600;
    filter: drop-shadow(0 0 6px rgba(var(--primary-rgb), .9));
    animation: ecg-draw-yogavelo 5s linear infinite;
}
@keyframes ecg-draw-yogavelo {
    0% { stroke-dashoffset: 1600; opacity: 1; }
    70% { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: 0; opacity: 0; }
}

.hero-grid-yogavelo {
    flex: 1;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    align-items: stretch;
    gap: 40px;
}
.hero-content-yogavelo {
    position: relative;
    z-index: 2;
    align-self: center;
    padding-bottom: clamp(90px, 9vw, 150px);
}

.hero-shape-left-yogavelo {
    position: absolute;
    left: -30px;
    bottom: 60px;
    width: clamp(200px, 24vw, 343px);
    height: auto;
    opacity: .75;
    animation: float-yogavelo 9s ease-in-out infinite;
}
.hero-wave-yogavelo {
    position: absolute;
    left: 50%;
    bottom: -1px;
    z-index: 3;
    width: 100%;
    min-width: 1100px;
    height: auto;
    translate: -50% 0;
    pointer-events: none;
}

.hero-badge-yogavelo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 6px 20px 6px 6px;
    margin-bottom: 28px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.16);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    color: #fff;
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.hero-badge-icon-yogavelo {
    display: grid; place-items: center;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--color-primary);
}
.hero-badge-icon-yogavelo img { width: 14px; height: 22px; }

.hero-title-yogavelo {
    color: #fff;
    font-size: clamp(38px, 6vw, 72px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -.025em;
    margin-bottom: 26px;
}
.hero-accent-yogavelo {
    display: block;
    font-family: var(--font-sub-title);
    font-style: italic;
    font-weight: 600;
    letter-spacing: -.01em;
    background: linear-gradient(90deg, #ff7a85 0%, var(--color-primary) 45%, #ffb3ba 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: shine-yogavelo 6s ease-in-out infinite alternate;
}
@keyframes shine-yogavelo { to { background-position: 100% 0; } }

.hero-lead-yogavelo {
    font-size: clamp(16px, 1.6vw, 19px);
    max-width: 590px;
    margin-bottom: 38px;
}
.hero-actions-yogavelo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 22px 30px;
    margin-bottom: 38px;
}
.hero-link-yogavelo {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    color: #fff;
    font-weight: 500;
    font-size: 17px;
}
.hero-link-circle-yogavelo {
    display: grid; place-items: center;
    width: 60px; height: 60px;
    border-radius: 50%;
    background: #fff;
    color: var(--color-primary);
    transition: scale .3s var(--ease), background-color .3s;
}
.hero-link-yogavelo:hover .hero-link-circle-yogavelo { scale: 1.08; background: var(--color-primary); color: #fff; }
.hero-link-yogavelo:hover .btn-arrow-yogavelo { translate: 4px 0; }

.hero-checks-yogavelo { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.hero-checks-yogavelo li,
.check-list-yogavelo li {
    position: relative;
    padding-left: 30px;
}
.hero-checks-yogavelo li { color: #fff; font-size: 15px; }
.hero-checks-yogavelo li::before,
.check-list-yogavelo li::before {
    content: "";
    position: absolute;
    left: 0; top: .32em;
    width: 19px; height: 19px;
    border-radius: 50%;
    border: 1.6px solid var(--color-primary);
}
.hero-checks-yogavelo li::after,
.check-list-yogavelo li::after {
    content: "";
    position: absolute;
    left: 6.5px; top: calc(.32em + 4.5px);
    width: 5px; height: 9px;
    border-right: 1.8px solid var(--color-primary);
    border-bottom: 1.8px solid var(--color-primary);
    rotate: 45deg;
}

/* Hero visual */
.hero-visual-yogavelo {
    position: relative;
    z-index: 1;
    align-self: end;
    justify-self: center;
    width: min(100%, 600px);
}
.hero-glow-yogavelo {
    position: absolute;
    left: 50%;
    bottom: 8%;
    width: 88%;
    aspect-ratio: 1;
    translate: -50% 0;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 40%, rgba(255,255,255,.18) 0%, transparent 45%),
        linear-gradient(160deg, #e2656f 0%, var(--color-primary) 45%, var(--color-primarydark) 100%);
    box-shadow:
        0 0 0 22px rgba(var(--primary-rgb), .14),
        0 0 0 46px rgba(var(--primary-rgb), .07),
        0 0 120px 40px rgba(var(--primary-rgb), .45);
    animation: breathe-yogavelo 7s ease-in-out infinite;
}
@keyframes breathe-yogavelo { 50% { scale: 1.04; } }
@keyframes spin-yogavelo { to { rotate: 360deg; } }

.hero-people-yogavelo {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    filter: drop-shadow(0 30px 50px rgba(0,0,0,.35));
}

.hero-card-yogavelo {
    position: absolute;
    z-index: 2;
    background: rgba(255,255,255,.96);
    color: var(--color-bodycolor);
    border-radius: 20px;
    box-shadow: 0 24px 50px rgba(0,0,0,.28);
    transition: transform .3s ease-out;
}
.hero-card-yogavelo strong { display: block; color: var(--color-heading); font-family: var(--font-montserrat), sans-serif; font-size: 16px; line-height: 1.3; }
.hero-card-yogavelo small { display: block; font-size: 13.5px; line-height: 1.5; }
.hero-card-top-yogavelo {
    top: 1%;
    left: -10%;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 20px 14px 14px;
    animation: float-yogavelo 6s ease-in-out infinite;
}
.hero-card-bottom-yogavelo {
    right: -8%;
    bottom: 30%;
    width: 250px;
    padding: 22px;
    animation: float-yogavelo 7s ease-in-out infinite reverse;
}
.hero-card-bottom-yogavelo .icon-badge-yogavelo { margin-bottom: 14px; }
.hero-card-bottom-yogavelo strong { margin-bottom: 6px; font-size: 18px; }

.hero-chip-yogavelo {
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: 19%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    border-radius: 999px;
    background: var(--color-primary);
    color: #fff;
    font-size: 13.5px;
    font-weight: 500;
    box-shadow: var(--shadow-red);
    animation: float-yogavelo 5s ease-in-out infinite;
}
.hero-chip-dot-yogavelo {
    width: 9px; height: 9px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(255,255,255,.3);
}
@keyframes float-yogavelo { 50% { translate: 0 -12px; } }

/* ---------- About / What we do ---------- */
.about-grid-yogavelo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: clamp(40px, 6vw, 90px);
}
.about-visual-yogavelo {
    position: relative;
    width: min(100%, 560px);
    aspect-ratio: 1;
    justify-self: center;
}
.about-visual-yogavelo::before,
.about-visual-yogavelo::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: var(--color-primary-50);
}
.about-visual-yogavelo::before { inset: -6%; }
.about-visual-yogavelo::after { inset: 0; background: var(--color-primary-100); }
.about-circle-yogavelo {
    position: absolute;
    inset: 7%;
    z-index: 1;
    border-radius: 50%;
    overflow: hidden;
    border: 8px solid #fff;
    box-shadow: var(--shadow);
}
.about-circle-yogavelo img { width: 100%; height: 100%; object-fit: cover; transition: scale 1.2s var(--ease); }
.about-visual-yogavelo:hover .about-circle-yogavelo img { scale: 1.06; }

.about-bubble-yogavelo {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 84px; height: 84px;
    border-radius: 50%;
    background: var(--color-primary);
    border: 6px solid #fff;
    box-shadow: var(--shadow-red);
    animation: float-yogavelo 6s ease-in-out infinite;
}
.about-bubble-yogavelo img { width: 36px; height: 36px; }
.about-bubble-1-yogavelo { top: 6%; right: 6%; }
.about-bubble-2-yogavelo { bottom: 10%; right: 2%; animation-delay: -2s; }
.about-bubble-3-yogavelo { bottom: 18%; left: -2%; animation-delay: -4s; }

.about-content-yogavelo .section-lead-yogavelo { margin-bottom: 36px; }
.about-features-yogavelo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 26px 24px;
    margin-bottom: 40px;
}
.feature-yogavelo { display: flex; align-items: center; gap: 16px; }
.feature-yogavelo h3 { font-size: 17px; font-weight: 600; margin-bottom: 2px; }
.feature-yogavelo p { font-size: 14.5px; line-height: 1.5; }
.feature-yogavelo .icon-tile-yogavelo { transition: rotate .4s var(--ease), scale .4s var(--ease); }
.feature-yogavelo:hover .icon-tile-yogavelo { rotate: -8deg; scale: 1.06; }

/* ---------- Mini CTA ---------- */
.cta-mini-yogavelo { padding-bottom: clamp(30px, 5vw, 50px); }
.cta-mini-box-yogavelo {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 28px;
    padding: 34px clamp(24px, 4vw, 50px);
    border-radius: var(--radius-lg);
    background:
        radial-gradient(120% 140% at 100% 0%, var(--color-primary-200) 0%, transparent 55%),
        var(--color-primarylight);
    overflow: hidden;
}
.cta-mini-box-yogavelo::after {
    content: "";
    position: absolute;
    right: -60px; bottom: -80px;
    width: 220px; height: 220px;
    border-radius: 50%;
    border: 30px solid var(--color-primary-100);
    pointer-events: none;
}
.cta-mini-icon-yogavelo {
    display: grid; place-items: center;
    width: 92px; height: 92px;
    border-radius: 24px;
    background: linear-gradient(140deg, var(--color-primary), var(--color-primarydark));
    box-shadow: var(--shadow-red);
}
.cta-mini-icon-yogavelo img { width: 44px; height: 44px; }
.cta-mini-text-yogavelo h2 { font-size: clamp(20px, 2.4vw, 26px); font-weight: 700; margin-bottom: 6px; }
.cta-mini-text-yogavelo p { max-width: 520px; font-size: 15.5px; }
.cta-mini-actions-yogavelo { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 14px; }

/* ---------- Services zig-zag ---------- */
.services-yogavelo { background: var(--color-light); overflow: hidden; }
.services-lines-yogavelo {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        repeating-radial-gradient(circle at 0% 0%, transparent 0 60px, rgba(var(--primary-rgb), .06) 61px 62px);
    -webkit-mask-image: linear-gradient(120deg, #000 0%, transparent 45%);
    mask-image: linear-gradient(120deg, #000 0%, transparent 45%);
}
.services-list-yogavelo { display: grid; gap: clamp(70px, 9vw, 120px); position: relative; }

.service-row-yogavelo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: clamp(40px, 6vw, 90px);
}
.service-row-reverse-yogavelo .service-media-yogavelo { order: 2; }

.service-media-yogavelo { position: relative; padding: 0 0 26px 26px; }
.service-row-reverse-yogavelo .service-media-yogavelo { padding: 0 26px 26px 0; }
.service-media-yogavelo::before {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 62%; height: 70%;
    border-radius: var(--radius-lg);
    background: linear-gradient(140deg, var(--color-primary), var(--color-primarydark));
    opacity: .9;
}
.service-row-reverse-yogavelo .service-media-yogavelo::before { left: auto; right: 0; }

.service-photo-yogavelo {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    aspect-ratio: 11 / 8.6;
    box-shadow: var(--shadow);
}
.service-photo-yogavelo img { width: 100%; height: 100%; object-fit: cover; transition: scale 1.2s var(--ease); }
.service-row-yogavelo:hover .service-photo-yogavelo img { scale: 1.06; }

.service-badge-yogavelo {
    position: absolute;
    right: -18px; top: 34px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 24px 14px 20px;
    border-radius: 999px;
    background: #fff;
    box-shadow: var(--shadow);
    animation: float-yogavelo 7s ease-in-out infinite;
}
.service-row-reverse-yogavelo .service-badge-yogavelo { right: auto; left: -18px; }
.service-badge-dot-yogavelo {
    flex-shrink: 0;
    width: 12px; height: 12px;
    border-radius: 50%;
    background: var(--color-primary);
    box-shadow: 0 0 0 5px var(--color-primary-200);
}
.service-badge-text-yogavelo {
    font-family: var(--font-montserrat), sans-serif;
    font-weight: 700;
    font-size: 14.5px;
    white-space: nowrap;
    line-height: 1.3;
    color: var(--color-heading);
}

.service-body-yogavelo .icon-tile-yogavelo { margin-bottom: 22px; }
.service-title-yogavelo { font-size: clamp(26px, 3vw, 36px); font-weight: 700; margin-bottom: 16px; }
.service-text-yogavelo { font-size: 16.5px; margin-bottom: 24px; }
.service-included-yogavelo {
    font-family: var(--font-montserrat), sans-serif;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--color-primary);
    margin-bottom: 14px;
}
.check-list-yogavelo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
    margin-bottom: 34px;
}
.check-list-yogavelo li { color: var(--color-heading); font-size: 15.5px; line-height: 1.5; }
.check-list-yogavelo li::before { top: .08em; }
.check-list-yogavelo li::after { top: calc(.08em + 4.5px); }

/* ---------- Testimonials ---------- */
.testimonials-box-yogavelo {
    position: relative;
    padding: clamp(50px, 7vw, 90px) clamp(16px, 4vw, 60px);
    border-radius: 40px;
    background:
        radial-gradient(60% 80% at 0% 0%, var(--color-primary-100), transparent 60%),
        var(--color-primarylight);
}
.slider-yogavelo { position: relative; }
.slider-viewport-yogavelo {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin: -20px -10px;
    padding: 20px 10px;
    overscroll-behavior-x: contain;
}
.slider-viewport-yogavelo::-webkit-scrollbar { display: none; }
.slider-track-yogavelo {
    --per-view: 3;
    --gap: 28px;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - var(--gap) * (var(--per-view) - 1)) / var(--per-view));
    gap: var(--gap);
}
.review-card-yogavelo {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 38px 34px 32px;
    border-radius: 26px;
    background: #fff;
    box-shadow: var(--shadow-sm);
    scroll-snap-align: start;
    transition: translate .35s var(--ease), box-shadow .35s var(--ease);
}
.review-card-yogavelo:hover { translate: 0 -6px; box-shadow: var(--shadow); }
.review-quote-yogavelo {
    display: block;
    height: 46px;
    font-family: var(--font-sub-title);
    font-size: 96px;
    line-height: .9;
    color: var(--color-primary);
}
.review-text-yogavelo { flex: 1; font-size: 16px; margin: 14px 0 26px; }
.review-footer-yogavelo {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    padding-top: 20px;
    border-top: 1px solid var(--color-primary-100);
}
.review-name-yogavelo { font-family: var(--font-montserrat), sans-serif; font-weight: 700; color: var(--color-heading); }
.review-role-yogavelo { font-size: 13.5px; line-height: 1.45; }
.review-stars-yogavelo { color: #f0a03c; letter-spacing: 2px; font-size: 17px; white-space: nowrap; }

.slider-btn-yogavelo {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 56px; height: 56px;
    margin-top: -28px;
    border: 0;
    border-radius: 50%;
    background: #fff;
    box-shadow: var(--shadow);
    cursor: pointer;
    transition: background-color .3s, scale .3s;
}
.slider-btn-yogavelo::before {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 11px; height: 11px;
    border-top: 2px solid var(--color-heading);
    border-right: 2px solid var(--color-heading);
}
.slider-prev-yogavelo { left: -28px; }
.slider-prev-yogavelo::before { translate: -30% -50%; rotate: -135deg; }
.slider-next-yogavelo { right: -28px; }
.slider-next-yogavelo::before { translate: -70% -50%; rotate: 45deg; }
.slider-btn-yogavelo:hover { background: var(--color-primary); scale: 1.06; }
.slider-btn-yogavelo:hover::before { border-color: #fff; }

.slider-dots-yogavelo { display: flex; justify-content: center; gap: 10px; margin-top: 36px; }
.slider-dot-yogavelo {
    width: 12px; height: 12px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: var(--color-primary-300);
    cursor: pointer;
    transition: width .35s var(--ease), background-color .3s;
}
.slider-dot-yogavelo[aria-current="true"] { width: 34px; background: var(--color-primary); }

/* ---------- Why us ---------- */
.why-yogavelo {
    background: var(--color-secondary);
    color: rgba(255,255,255,.78);
    overflow: hidden;
}
.why-dots-yogavelo {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,.08) 1.5px, transparent 2px);
    background-size: 22px 22px;
    -webkit-mask-image: radial-gradient(70% 60% at 10% 0%, #000, transparent);
    mask-image: radial-gradient(70% 60% at 10% 0%, #000, transparent);
}
.why-yogavelo::after {
    content: "";
    position: absolute;
    right: -15%; top: 10%;
    width: 600px; height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--primary-rgb), .35), transparent 65%);
    filter: blur(20px);
    pointer-events: none;
}
.why-grid-yogavelo {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    align-items: center;
    gap: clamp(40px, 5vw, 70px);
}
.why-yogavelo .section-title-yogavelo { color: #fff; }
.why-yogavelo .section-lead-yogavelo { margin-bottom: 42px; }
.why-cards-yogavelo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.why-card-yogavelo {
    padding: 30px 28px;
    border-radius: 24px;
    background: #fff;
    color: var(--color-bodycolor);
    transition: translate .35s var(--ease), box-shadow .35s var(--ease);
}
.why-card-yogavelo:hover { translate: 0 -6px; box-shadow: 0 24px 50px rgba(0,0,0,.3); }
.why-card-yogavelo .icon-circle-yogavelo { margin-bottom: 22px; }
.why-card-yogavelo h3 { font-size: 19px; font-weight: 700; margin-bottom: 10px; }
.why-card-yogavelo p { font-size: 15px; line-height: 1.65; }

.why-visual-yogavelo {
    position: relative;
    justify-self: center;
    width: min(100%, 540px);
}
.why-glow-yogavelo {
    position: absolute;
    left: 50%;
    top: 4%;
    width: 86%;
    aspect-ratio: 1;
    translate: -50% 0;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 40%, rgba(255,255,255,.16) 0%, transparent 45%),
        linear-gradient(160deg, #e2656f 0%, var(--color-primary) 45%, var(--color-primarydark) 100%);
    box-shadow: 0 0 0 22px rgba(var(--primary-rgb), .12), 0 0 0 46px rgba(var(--primary-rgb), .06);
    animation: breathe-yogavelo 7s ease-in-out infinite;
}
.why-person-yogavelo {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    -webkit-mask-image: linear-gradient(180deg, #000 80%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 80%, transparent 100%);
    border-radius: 50%;
}
.why-stat-yogavelo {
    position: absolute;
    padding: 22px 28px;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 24px 50px rgba(0,0,0,.3);
    animation: float-yogavelo 6s ease-in-out infinite;
}
.why-stat-yogavelo strong {
    display: block;
    font-family: var(--font-montserrat), sans-serif;
    font-size: 44px;
    font-weight: 800;
    line-height: 1.05;
    color: var(--color-primary);
}
.why-stat-yogavelo > span { display: block; max-width: 160px; font-size: 14.5px; line-height: 1.45; color: var(--color-bodycolor); margin-top: 6px; }
.why-stat-yogavelo { z-index: 1; }
.why-stat-1-yogavelo { top: 22%; left: -8%; }
.why-stat-2-yogavelo { bottom: 18%; right: -6%; animation-delay: -3s; }

.process-yogavelo {
    position: relative;
    z-index: 1;
    margin-top: clamp(60px, 8vw, 100px);
    padding: clamp(28px, 4vw, 50px);
    border-radius: 36px;
    background: #fff;
    color: var(--color-bodycolor);
    box-shadow: 0 40px 90px rgba(0,0,0,.3);
}
.process-head-yogavelo { margin-bottom: 36px; }
.process-head-yogavelo .tag-yogavelo { margin-bottom: 12px; }
.process-title-yogavelo {
    font-size: clamp(24px, 3vw, 36px);
    font-weight: 700;
}
.process-list-yogavelo {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
}
.process-step-yogavelo {
    position: relative;
    padding: 28px 24px;
    border-radius: 24px;
    background: var(--color-light);
    border: 1px solid var(--color-primary-70);
    transition: translate .35s var(--ease), box-shadow .35s var(--ease), background-color .35s, border-color .35s;
}
.process-step-yogavelo:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -20px;
    width: 10px; height: 10px;
    border-top: 2.5px solid var(--color-primary);
    border-right: 2.5px solid var(--color-primary);
    translate: 0 -50%;
    rotate: 45deg;
}
.process-step-yogavelo:hover {
    translate: 0 -6px;
    background: #fff;
    border-color: var(--color-primary-200);
    box-shadow: var(--shadow);
}
.process-top-yogavelo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 22px;
}
.process-label-yogavelo {
    padding: 6px 14px;
    border-radius: 999px;
    background: var(--color-primary-100);
    color: var(--color-primary);
    font-family: var(--font-montserrat), sans-serif;
    font-weight: 700;
    font-size: 12.5px;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.process-step-yogavelo h4 { font-size: 19px; font-weight: 700; margin-bottom: 8px; }
.process-step-yogavelo p { font-size: 15px; line-height: 1.6; }
.process-step-yogavelo .icon-tile-yogavelo { transition: rotate .4s var(--ease); }
.process-step-yogavelo:hover .icon-tile-yogavelo { rotate: -8deg; }

/* ---------- Contact ---------- */
.contact-grid-yogavelo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    gap: clamp(40px, 5vw, 70px);
}
.contact-info-yogavelo .section-lead-yogavelo { margin-bottom: 26px; }
.contact-promise-yogavelo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 22px;
    margin-bottom: 36px;
    border-radius: 999px;
    background: var(--color-primarylight);
    color: var(--color-heading);
    font-weight: 500;
}
.contact-promise-dot-yogavelo {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: #22a06b;
    box-shadow: 0 0 0 0 rgba(34,160,107,.5);
    animation: online-yogavelo 2s infinite;
}
@keyframes online-yogavelo { 70% { box-shadow: 0 0 0 10px rgba(34,160,107,0); } }

.contact-cards-yogavelo { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.contact-card-yogavelo {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 24px 22px;
    border-radius: 22px;
    background: var(--color-light);
    border: 1px solid var(--color-primary-70);
    transition: box-shadow .3s, translate .3s var(--ease);
}
.contact-card-yogavelo:hover { box-shadow: var(--shadow-sm); translate: 0 -4px; }
.contact-card-yogavelo .icon-tile-yogavelo { width: 54px; height: 54px; border-radius: 50%; }
.contact-card-yogavelo .icon-tile-yogavelo img { width: 26px; height: 26px; }
.contact-card-yogavelo h3 { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.contact-card-yogavelo p { font-size: 15px; line-height: 1.55; overflow-wrap: anywhere; }
.contact-card-yogavelo a:hover { color: var(--color-primary); }

/* Form card */
.form-card-yogavelo {
    position: relative;
    padding: clamp(32px, 5vw, 54px);
    border-radius: 36px;
    background: linear-gradient(150deg, #dc5a65 0%, var(--color-primary) 45%, var(--color-primarydark) 100%);
    color: #fff;
    box-shadow: 0 40px 80px rgba(var(--primary-rgb), .35);
    overflow: hidden;
    isolation: isolate;
}
.form-card-deco-yogavelo {
    position: absolute;
    z-index: -1;
    right: -120px; top: -120px;
    width: 320px; height: 320px;
    border-radius: 50%;
    border: 50px solid rgba(255,255,255,.07);
}
.form-title-yogavelo { color: #fff; font-size: clamp(30px, 3.6vw, 44px); font-weight: 700; margin-bottom: 6px; }
.form-subtitle-yogavelo { color: rgba(255,255,255,.88); margin-bottom: 30px; }

.form-grid-yogavelo { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 24px; }
.field-full-yogavelo { grid-column: 1 / -1; }
.field-yogavelo label {
    display: block;
    margin-bottom: 4px;
    font-size: 14px;
    font-weight: 500;
    color: rgba(255,255,255,.92);
}
.field-yogavelo input,
.field-yogavelo select,
.field-yogavelo textarea {
    width: 100%;
    min-height: 48px;
    padding: 10px 2px;
    border: 0;
    border-bottom: 2px solid rgba(255,255,255,.45);
    border-radius: 0;
    background: transparent;
    color: #fff;
    font-size: 16px;
    transition: border-color .3s, background-color .3s;
}
.field-yogavelo textarea { resize: vertical; min-height: 110px; }
.field-yogavelo select {
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%);
    background-position: calc(100% - 14px) 22px, calc(100% - 8px) 22px;
    background-size: 6px 6px;
    background-repeat: no-repeat;
    padding-right: 30px;
}
.field-yogavelo select option { color: var(--color-heading); background: #fff; }
.field-yogavelo input:focus,
.field-yogavelo select:focus,
.field-yogavelo textarea:focus {
    outline: none;
    border-bottom-color: #fff;
}
/* Keep autofilled fields transparent (Chrome/Safari/Edge paint them light blue) */
.field-yogavelo input:-webkit-autofill,
.field-yogavelo input:-webkit-autofill:hover,
.field-yogavelo input:-webkit-autofill:focus,
.field-yogavelo textarea:-webkit-autofill,
.field-yogavelo select:-webkit-autofill {
    -webkit-text-fill-color: #fff;
    caret-color: #fff;
    -webkit-box-shadow: 0 0 0 1000px transparent inset;
    transition: background-color 600000s 0s, color 600000s 0s;
}
.field-yogavelo input:focus-visible,
.field-yogavelo select:focus-visible,
.field-yogavelo textarea:focus-visible { box-shadow: 0 2px 0 0 #fff; }

.field-error-yogavelo {
    display: none;
    margin-top: 8px;
    padding: 4px 10px;
    border-radius: 8px;
    background: #fff;
    color: var(--color-primarydark);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    width: fit-content;
}
.field-error-yogavelo::before { content: "! "; font-weight: 700; }

.field-yogavelo :is(input, select, textarea):user-invalid,
.field-yogavelo .is-invalid-yogavelo { border-bottom-color: #ffd36b; }
.field-yogavelo :is(input, select, textarea):user-invalid ~ .field-error-yogavelo,
.field-yogavelo .is-invalid-yogavelo ~ .field-error-yogavelo { display: block; }
.field-yogavelo :is(input, select, textarea):user-valid { border-bottom-color: #fff; }

.field-check-yogavelo {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4px 12px;
    align-items: start;
}
.field-check-yogavelo input {
    width: 22px; height: 22px;
    min-height: 0;
    margin: 3px 0 0;
    accent-color: var(--color-secondary);
    cursor: pointer;
}
.field-check-yogavelo label { font-size: 13.5px; line-height: 1.55; margin: 0; font-weight: 400; }
.field-check-yogavelo label a { text-decoration: underline; text-underline-offset: 2px; color: #fff; }
.field-check-yogavelo .field-error-yogavelo { grid-column: 2; margin-top: 2px; }

.hp-yogavelo { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.form-status-yogavelo:not(:empty) {
    margin-top: 22px;
    padding: 12px 16px;
    border-radius: 12px;
    background: rgba(0,0,0,.18);
    font-size: 14.5px;
}
.form-submit-yogavelo { margin-top: 28px; min-width: 210px; }
.form-note-yogavelo { margin-top: 16px; font-size: 12.5px; color: rgba(255,255,255,.75); }

.spinner-yogavelo {
    display: none;
    width: 22px; height: 22px;
    border-radius: 50%;
    border: 3px solid var(--color-primary-300);
    border-top-color: var(--color-primary);
    animation: spin-yogavelo .8s linear infinite;
}
.is-loading-yogavelo { pointer-events: none; }
.is-loading-yogavelo .spinner-yogavelo { display: inline-block; }
.is-loading-yogavelo .btn-label-yogavelo { opacity: .75; }

.form-success-yogavelo {
    text-align: center;
    padding: 40px 10px;
    animation: success-in-yogavelo .6s var(--ease);
}
.form-success-yogavelo:focus { outline: none; }
.form-success-yogavelo h2 { color: #fff; font-size: clamp(26px, 3vw, 34px); margin-bottom: 12px; }
.form-success-yogavelo p { color: rgba(255,255,255,.9); max-width: 380px; margin: 0 auto 30px; }
.success-check-yogavelo {
    position: relative;
    display: block;
    width: 96px; height: 96px;
    margin: 0 auto 26px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 12px rgba(255,255,255,.18);
}
.success-check-yogavelo::after {
    content: "";
    position: absolute;
    left: 35px; top: 22px;
    width: 22px; height: 40px;
    border-right: 5px solid var(--color-primary);
    border-bottom: 5px solid var(--color-primary);
    rotate: 45deg;
    animation: check-in-yogavelo .5s .2s var(--ease) both;
}
@keyframes success-in-yogavelo { from { opacity: 0; scale: .94; } }
@keyframes check-in-yogavelo { from { opacity: 0; scale: .3; } }

/* ---------- Footer ---------- */
.footer-yogavelo {
    position: relative;
    background: var(--color-secondarydark);
    color: rgba(255,255,255,.7);
    padding-top: clamp(60px, 8vw, 90px);
    overflow: hidden;
}
.footer-glow-yogavelo {
    position: absolute;
    left: -200px; top: -200px;
    width: 500px; height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--primary-rgb), .18), transparent 65%);
    pointer-events: none;
}
.footer-grid-yogavelo {
    position: relative;
    display: grid;
    grid-template-columns: 1.3fr .8fr 1fr 1.2fr;
    gap: 40px;
    padding-bottom: 50px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.logo-light-yogavelo { color: #fff; margin-bottom: 22px; }
.footer-about-yogavelo { font-size: 15px; margin-bottom: 14px; max-width: 340px; }
.footer-legalname-yogavelo { font-size: 13px; color: rgba(255,255,255,.5); }
.footer-title-yogavelo { color: #fff; font-size: 19px; font-weight: 700; margin-bottom: 22px; }
.footer-links-yogavelo { display: grid; gap: 10px; }
.footer-links-yogavelo a { position: relative; transition: color .25s, padding .25s; }
.footer-links-yogavelo a:hover { color: #fff; padding-left: 8px; }
.footer-contacts-yogavelo { display: grid; gap: 16px; font-size: 15px; line-height: 1.55; }
.footer-contacts-yogavelo a { overflow-wrap: anywhere; transition: color .25s; }
.footer-contacts-yogavelo a:hover { color: #fff; }
.footer-label-yogavelo {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--color-primary);
    margin-bottom: 2px;
}

.footer-map-row-yogavelo {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    align-items: center;
    gap: 40px;
    padding: 50px 0;
}
.footer-map-yogavelo {
    position: relative;
    height: 340px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.08);
    overflow: hidden;
    background:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 34px 34px,
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 34px 34px,
        #1f2535;
}
.footer-map-yogavelo iframe { display: block; width: 100%; height: 100%; border: 0; filter: grayscale(.15) contrast(1.05); }
.footer-findus-title-yogavelo { color: #fff; font-size: clamp(30px, 3.4vw, 42px); margin-bottom: 10px; }
.footer-findus-yogavelo p { margin-bottom: 26px; }

.footer-disclaimer-yogavelo {
    padding: 22px 0 34px;
    font-size: 13px;
    color: rgba(255,255,255,.5);
    border-top: 1px solid rgba(255,255,255,.08);
}
.footer-bottom-yogavelo { border-top: 1px solid rgba(255,255,255,.08); padding: 22px 0; font-size: 14.5px; }
.footer-bottom-inner-yogavelo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 24px;
}
.footer-legal-yogavelo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.footer-legal-yogavelo a:hover { color: #fff; }
.footer-legal-yogavelo span { opacity: .4; }

/* ---------- Back to top ---------- */
.to-top-yogavelo {
    position: fixed;
    right: 20px; bottom: 20px;
    z-index: 80;
    display: grid;
    place-items: center;
    width: 52px; height: 52px;
    border-radius: 50%;
    background: var(--color-primary);
    box-shadow: var(--shadow-red);
    opacity: 0;
    visibility: hidden;
    translate: 0 20px;
    transition: opacity .3s, translate .3s var(--ease), visibility .3s, background-color .3s;
}
.to-top-yogavelo span {
    width: 12px; height: 12px;
    margin-top: 5px;
    border-top: 2.5px solid #fff;
    border-left: 2.5px solid #fff;
    rotate: 45deg;
}
.to-top-yogavelo.is-visible-yogavelo { opacity: 1; visibility: visible; translate: 0 0; }
.to-top-yogavelo:hover { background: var(--color-secondary); }

/* ---------- Cookie banner & modal ---------- */
.cookie-banner-yogavelo {
    position: fixed;
    left: 50%;
    bottom: 20px;
    z-index: 300;
    translate: -50% 0;
    width: min(1040px, calc(100% - 24px));
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px 32px;
    padding: 24px 28px;
    border-radius: 24px;
    background: #fff;
    border: 1px solid var(--color-primary-100);
    box-shadow: 0 30px 80px rgba(var(--secondary-rgb), .25);
    animation: cookie-in-yogavelo .6s var(--ease);
}
.cookie-banner-yogavelo[hidden] { display: none; }
@keyframes cookie-in-yogavelo { from { opacity: 0; translate: -50% 40px; } }
.cookie-title-yogavelo { font-size: 18px; margin-bottom: 6px; }
.cookie-banner-text-yogavelo p { font-size: 14px; line-height: 1.6; }
.cookie-banner-text-yogavelo a { color: var(--color-primary); text-decoration: underline; }
.cookie-banner-actions-yogavelo { display: flex; flex-wrap: wrap; gap: 10px; }
.cookie-banner-actions-yogavelo .btn-yogavelo,
.cookie-modal-actions-yogavelo .btn-yogavelo { min-height: 46px; padding: 10px 22px; font-size: 15px; }

.cookie-modal-yogavelo {
    width: min(620px, calc(100% - 24px));
    max-height: calc(100dvh - 24px);
    padding: 0;
    border: 0;
    border-radius: 26px;
    color: var(--color-bodycolor);
    box-shadow: 0 30px 90px rgba(0,0,0,.35);
}
.cookie-modal-yogavelo::backdrop { background: rgba(var(--secondary-rgb), .6); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.cookie-modal-inner-yogavelo { padding: 30px; }
.cookie-modal-head-yogavelo { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.cookie-modal-head-yogavelo h2 { font-size: 24px; }
.cookie-modal-close-yogavelo {
    width: 40px; height: 40px;
    border: 0;
    border-radius: 50%;
    background: var(--color-primary-100);
    color: var(--color-heading);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}
.cookie-modal-intro-yogavelo { font-size: 14.5px; margin-bottom: 18px; }
.cookie-option-yogavelo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 16px 0;
    border-top: 1px solid var(--color-border);
}
.cookie-option-yogavelo h3 { font-size: 16px; margin-bottom: 2px; }
.cookie-option-yogavelo p { font-size: 13.5px; line-height: 1.5; }
.cookie-modal-actions-yogavelo { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 20px; }

.switch-yogavelo { position: relative; flex-shrink: 0; width: 52px; height: 30px; cursor: pointer; }
.switch-yogavelo input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: inherit; }
.switch-track-yogavelo {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: #cfd5df;
    transition: background-color .25s;
}
.switch-track-yogavelo::after {
    content: "";
    position: absolute;
    top: 3px; left: 3px;
    width: 24px; height: 24px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,.2);
    transition: translate .25s var(--ease);
}
.switch-yogavelo input:checked + .switch-track-yogavelo { background: var(--color-primary); }
.switch-yogavelo input:checked + .switch-track-yogavelo::after { translate: 22px 0; }
.switch-yogavelo input:disabled + .switch-track-yogavelo { opacity: .55; }
.switch-yogavelo input:focus-visible + .switch-track-yogavelo { outline: 3px solid var(--color-primary-400); outline-offset: 2px; }

/* ---------- Legal pages ---------- */
.legal-hero-yogavelo {
    position: relative;
    padding: calc(var(--header-h) + 70px) 0 70px;
    background:
        radial-gradient(50% 120% at 90% 0%, rgba(var(--primary-rgb), .35), transparent 60%),
        var(--color-secondary);
    color: rgba(255,255,255,.75);
    overflow: hidden;
}
.legal-hero-yogavelo h1 { color: #fff; font-size: clamp(34px, 5vw, 56px); font-weight: 800; margin-bottom: 12px; }
.legal-breadcrumbs-yogavelo { display: flex; gap: 10px; font-size: 14.5px; margin-bottom: 16px; }
.legal-breadcrumbs-yogavelo a { color: #fff; }
.legal-breadcrumbs-yogavelo a:hover { color: var(--color-primary); }

.legal-layout-yogavelo {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 60px;
    align-items: start;
    padding-block: clamp(50px, 7vw, 90px);
}
.legal-toc-yogavelo {
    position: sticky;
    top: calc(var(--header-h) + 24px);
    padding: 26px;
    border-radius: 22px;
    background: var(--color-light);
    border: 1px solid var(--color-primary-70);
}
.legal-toc-yogavelo h2 { font-size: 16px; margin-bottom: 14px; }
.legal-toc-yogavelo ol { display: grid; gap: 8px; font-size: 14.5px; line-height: 1.45; counter-reset: toc; }
.legal-toc-yogavelo a:hover { color: var(--color-primary); }

.legal-content-yogavelo { max-width: 820px; min-width: 0; }
.legal-content-yogavelo section { padding-bottom: 34px; margin-bottom: 34px; border-bottom: 1px solid var(--color-border); }
.legal-content-yogavelo section:last-child { border-bottom: 0; }
.legal-content-yogavelo h2 { font-size: clamp(22px, 2.6vw, 28px); margin-bottom: 16px; }
.legal-content-yogavelo h3 { font-size: 18px; margin: 22px 0 10px; }
.legal-content-yogavelo p { margin-bottom: 14px; }
.legal-content-yogavelo ul { margin: 0 0 16px; display: grid; gap: 8px; }
.legal-content-yogavelo ul li { position: relative; padding-left: 22px; }
.legal-content-yogavelo ul li::before {
    content: "";
    position: absolute;
    left: 2px; top: .7em;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--color-primary);
}
.legal-content-yogavelo a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.legal-content-yogavelo strong { color: var(--color-heading); }
.legal-intro-yogavelo {
    padding: 24px 26px;
    margin-bottom: 40px;
    border-radius: 20px;
    background: var(--color-primarylight);
    border-left: 4px solid var(--color-primary);
    color: var(--color-heading);
}
.legal-table-wrap-yogavelo { overflow-x: auto; margin-bottom: 16px; }
.legal-table-yogavelo { width: 100%; border-collapse: collapse; font-size: 14.5px; min-width: 520px; }
.legal-table-yogavelo th,
.legal-table-yogavelo td { padding: 12px 14px; border: 1px solid var(--color-border); text-align: left; vertical-align: top; }
.legal-table-yogavelo th { background: var(--color-light); color: var(--color-heading); }
.legal-contact-box-yogavelo {
    padding: 24px 26px;
    border-radius: 20px;
    background: var(--color-light);
    border: 1px solid var(--color-primary-100);
}
.legal-contact-box-yogavelo p { margin-bottom: 6px; }

/* ---------- Reveal animations ---------- */
.js-yogavelo .reveal-yogavelo {
    opacity: 0;
    translate: 0 34px;
    transition: opacity .9s var(--ease), translate .9s var(--ease);
    transition-delay: var(--reveal-delay, 0s);
}
.js-yogavelo .reveal-yogavelo.is-visible-yogavelo { opacity: 1; translate: 0 0; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1280px) {
    .header-call-text-yogavelo { display: none; }
    .hero-card-top-yogavelo { left: -8%; }
    .hero-card-bottom-yogavelo { right: -6%; }
}

@media (max-width: 1100px) {
    .burger-yogavelo { display: block; }
    .nav-yogavelo {
        position: fixed;
        top: 0; right: 0;
        z-index: 110;
        width: min(86vw, 380px);
        height: 100dvh;
        padding: 100px 28px 32px;
        background: #fff;
        color: var(--color-heading);
        box-shadow: -20px 0 60px rgba(0,0,0,.2);
        overflow-y: auto;
        clip-path: inset(0 0 0 100%);
        visibility: hidden;
        transition: clip-path .45s var(--ease), visibility .45s;
    }
    .nav-yogavelo.is-open-yogavelo { clip-path: inset(0 0 0 0); visibility: visible; }
    .nav-list-yogavelo { flex-direction: column; align-items: stretch; gap: 0; }
    .nav-link-yogavelo {
        padding: 16px 4px;
        font-size: 18px;
        border-bottom: 1px solid var(--color-border);
    }
    .nav-link-yogavelo::after { display: none; }
    .nav-mobile-extra-yogavelo { display: grid; gap: 14px; margin-top: 30px; }
    .nav-mobile-phone-yogavelo { font-weight: 600; font-size: 18px; color: var(--color-heading); }
    .nav-mobile-mail-yogavelo { color: var(--color-primary); overflow-wrap: anywhere; }
    body.nav-open-yogavelo { overflow: hidden; }

    .hero-grid-yogavelo { grid-template-columns: 1fr; text-align: center; gap: 40px; }
    .hero-content-yogavelo { padding-bottom: 0; }
    .hero-content-yogavelo { display: flex; flex-direction: column; align-items: center; }
    .hero-lead-yogavelo { margin-inline: auto; }
    .hero-actions-yogavelo,
    .hero-checks-yogavelo { justify-content: center; }
    .hero-visual-yogavelo { width: min(100%, 540px); }
    .hero-shape-left-yogavelo { bottom: auto; top: 18%; opacity: .45; }

    .about-grid-yogavelo,
    .why-grid-yogavelo,
    .contact-grid-yogavelo { grid-template-columns: 1fr; }
    .about-visual-yogavelo { width: min(100%, 500px); }
    .why-visual-yogavelo { order: -1; }
    .process-list-yogavelo { grid-template-columns: repeat(2, 1fr); }
    .process-step-yogavelo:nth-child(2)::after { display: none; }

    .service-row-yogavelo { grid-template-columns: 1fr; gap: 40px; }
    .service-row-reverse-yogavelo .service-media-yogavelo { order: 0; }
    .service-media-yogavelo,
    .service-row-reverse-yogavelo .service-media-yogavelo { max-width: 680px; width: 100%; justify-self: center; }

    .slider-track-yogavelo { --per-view: 2; }

    .footer-grid-yogavelo { grid-template-columns: 1fr 1fr; }
    .footer-map-row-yogavelo { grid-template-columns: 1fr; }

    .legal-layout-yogavelo { grid-template-columns: 1fr; gap: 30px; }
    .legal-toc-yogavelo { position: static; }
}

@media (max-width: 767px) {
    :root { --header-h: 72px; }
    .header-cta-yogavelo { display: none; }
    .header-actions-yogavelo { gap: 12px; }
    .logo-mark-yogavelo { width: 42px; height: 42px; }
    .logo-name-yogavelo { font-size: 19px; }
    .header-call-icon-yogavelo { width: 44px; height: 44px; }

    .hero-yogavelo { min-height: 0; }
    .hero-badge-yogavelo { font-size: 11.5px; letter-spacing: .05em; }
    .hero-actions-yogavelo { flex-direction: column; width: 100%; }
    .hero-actions-yogavelo .btn-yogavelo { width: 100%; }
    .hero-checks-yogavelo { flex-direction: column; align-items: flex-start; gap: 10px; text-align: left; }
    .hero-visual-yogavelo { width: 100%; }
    .hero-card-top-yogavelo { left: 0; top: -5%; padding: 10px 14px 10px 10px; }
    .hero-card-top-yogavelo small { display: none; }
    .hero-card-bottom-yogavelo {
        right: 0;
        bottom: 24%;
        width: auto;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 16px 10px 10px;
        text-align: left;
    }
    .hero-card-bottom-yogavelo .icon-badge-yogavelo { margin: 0; width: 44px; height: 44px; }
    .hero-card-bottom-yogavelo strong { margin: 0; font-size: 15px; }
    .hero-card-bottom-yogavelo small { display: none; }
    .hero-card-yogavelo strong { font-size: 15px; }
    .hero-chip-yogavelo { display: none; }

    .about-features-yogavelo,
    .check-list-yogavelo,
    .contact-cards-yogavelo,
    .why-cards-yogavelo,
    .form-grid-yogavelo { grid-template-columns: 1fr; }
    .about-bubble-yogavelo { width: 64px; height: 64px; border-width: 4px; }
    .about-bubble-yogavelo img { width: 28px; height: 28px; }

    .cta-mini-box-yogavelo { grid-template-columns: 1fr; text-align: center; justify-items: center; }
    .cta-mini-actions-yogavelo { justify-content: center; width: 100%; }
    .cta-mini-actions-yogavelo .btn-yogavelo { flex: 1 1 220px; }

    .service-media-yogavelo { padding: 0 0 16px 16px; }
    .service-row-reverse-yogavelo .service-media-yogavelo { padding: 0 16px 16px 0; }
    .service-badge-yogavelo,
    .service-row-reverse-yogavelo .service-badge-yogavelo { right: 10px; left: auto; top: 14px; padding: 10px 16px 10px 12px; }
    .service-body-yogavelo .btn-yogavelo { width: 100%; }

    .slider-track-yogavelo { --per-view: 1; --gap: 16px; }
    .slider-btn-yogavelo { display: none; }
    .review-card-yogavelo { padding: 30px 24px 26px; }
    .testimonials-box-yogavelo { border-radius: 28px; }

    .why-stat-yogavelo { padding: 16px 20px; }
    .why-stat-yogavelo strong { font-size: 32px; }
    .why-stat-yogavelo > span { font-size: 13px; max-width: 130px; }
    .why-stat-1-yogavelo { top: auto; bottom: 4%; left: 0; }
    .why-stat-2-yogavelo { bottom: 4%; right: 0; }
    .process-yogavelo { border-radius: 28px; }
    .process-list-yogavelo { grid-template-columns: 1fr; gap: 16px; }
    .process-step-yogavelo::after { display: none; }

    .form-card-yogavelo { border-radius: 28px; }
    .form-submit-yogavelo { width: 100%; }

    .footer-grid-yogavelo { grid-template-columns: 1fr; gap: 34px; }
    .footer-map-yogavelo { height: 260px; }
    .footer-bottom-inner-yogavelo { flex-direction: column; text-align: center; }
    .footer-legal-yogavelo { justify-content: center; }

    .cookie-banner-yogavelo { grid-template-columns: 1fr; gap: 14px; bottom: 10px; padding: 18px; border-radius: 20px; }
    .cookie-title-yogavelo { font-size: 16px; }
    .cookie-banner-text-yogavelo p { font-size: 13px; line-height: 1.5; }
    .cookie-banner-actions-yogavelo .btn-yogavelo { flex: 1 1 140px; }
    .cookie-modal-inner-yogavelo { padding: 22px; }
    .cookie-modal-actions-yogavelo .btn-yogavelo { flex: 1 1 100%; }

    .to-top-yogavelo { right: 14px; bottom: 14px; width: 46px; height: 46px; }
}

@media (max-width: 360px) {
    .header-call-yogavelo { display: none; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .hero-bg-yogavelo,
    .hero-ecg-yogavelo path,
    .hero-glow-yogavelo,
    .why-glow-yogavelo,
    .hero-shape-left-yogavelo,
    .hero-card-yogavelo,
    .hero-chip-yogavelo,
    .hero-accent-yogavelo,
    .about-bubble-yogavelo,
    .service-badge-yogavelo,
    .why-stat-yogavelo,
    .header-call-icon-yogavelo { animation: none; }
    .hero-ecg-yogavelo path { stroke-dashoffset: 0; }
    .js-yogavelo .reveal-yogavelo { translate: none; transition: opacity .4s; }
}