/*
 * Kubariy light theme — v94.
 * Loaded after all presentation/page/component styles, so the existing dark
 * design remains intact underneath and can later be restored by switching
 * data-theme away from "light".
 */

html[data-theme="light"] {
    --bg: #f4fbfd;
    --text: #26364b;
    --text-strong: #122b67;
    --muted: #718198;

    --surface-1: rgba(255,255,255,.78);
    --surface-2: rgba(255,255,255,.94);
    --surface-soft: rgba(255,255,255,.52);

    --border: rgba(25,71,125,.13);
    --border-strong: rgba(25,71,125,.22);

    --kub-yellow: #f4c928;
    --kub-blue: #2f72e5;
    --kub-violet: #6d64d8;
    --kub-green: #43b7bd;
    --kub-coral: #e87462;
    --kub-navy: #142b70;
    --kub-cyan: #55c3cc;

    --shadow-xs: 0 2px 7px rgba(35,73,111,.06), 0 14px 34px rgba(35,73,111,.06);
    --shadow-sm: 0 5px 14px rgba(35,73,111,.08), 0 22px 52px rgba(35,73,111,.09);
    --shadow-md: 0 9px 24px rgba(35,73,111,.10), 0 34px 72px rgba(35,73,111,.11);
}

html[data-theme="light"],
html[data-theme="light"] body {
    background: var(--bg);
    color: var(--text);
}

/* Pale blue paper-like field, close to the current Kubariy VK cover. */
html[data-theme="light"] .reveal {
    color: var(--text);
    background:
        radial-gradient(circle at 18% 10%, rgba(255,255,255,.96), transparent 30%),
        radial-gradient(circle at 84% 78%, rgba(196,238,242,.30), transparent 34%),
        linear-gradient(135deg, #f9fdfe 0%, #f2fafc 48%, #edf8fb 100%);
}

/* Decorative background: two quiet rotating gears. */
html[data-theme="light"] body::before,
html[data-theme="light"] body::after {
    z-index: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    opacity: .105;
    background-color: #2c7893;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='black' d='M44 2h12l2 10a39 39 0 0 1 8 3l8-6 9 9-6 8a39 39 0 0 1 3 8l10 2v12l-10 2a39 39 0 0 1-3 8l6 8-9 9-8-6a39 39 0 0 1-8 3l-2 10H44l-2-10a39 39 0 0 1-8-3l-8 6-9-9 6-8a39 39 0 0 1-3-8L10 48V36l10-2a39 39 0 0 1 3-8l-6-8 9-9 8 6a39 39 0 0 1 8-3L44 2zm6 24a18 18 0 1 0 0 36 18 18 0 0 0 0-36zm0 8a10 10 0 1 1 0 20 10 10 0 0 1 0-20z'/%3E%3C/svg%3E") center/contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='black' d='M44 2h12l2 10a39 39 0 0 1 8 3l8-6 9 9-6 8a39 39 0 0 1 3 8l10 2v12l-10 2a39 39 0 0 1-3 8l6 8-9 9-8-6a39 39 0 0 1-8 3l-2 10H44l-2-10a39 39 0 0 1-8-3l-8 6-9-9 6-8a39 39 0 0 1-3-8L10 48V36l10-2a39 39 0 0 1 3-8l-6-8 9-9 8 6a39 39 0 0 1 8-3L44 2zm6 24a18 18 0 1 0 0 36 18 18 0 0 0 0-36zm0 8a10 10 0 1 1 0 20 10 10 0 0 1 0-20z'/%3E%3C/svg%3E") center/contain no-repeat;
}
html[data-theme="light"] body::before {
    width: 310px; height: 310px; left: -112px; top: 8vh;
    animation: kub-light-gear-a 42s linear infinite;
}
html[data-theme="light"] body::after {
    width: 220px; height: 220px; right: -64px; bottom: 5vh;
    opacity: .085;
    animation: kub-light-gear-b 34s linear infinite reverse;
}

/* Two restrained Kubarik line drawings in the far background. */
html[data-theme="light"] .reveal::before,
html[data-theme="light"] .reveal::after {
    z-index: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background-color: transparent;
    opacity: .10;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 220'%3E%3Cg fill='none' stroke='%232f72e5' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M38 52h104v92H38z'/%3E%3Cpath d='M49 52V34h26v18M105 52V34h26v18'/%3E%3Cellipse cx='62' cy='34' rx='13' ry='6'/%3E%3Cellipse cx='118' cy='34' rx='13' ry='6'/%3E%3Cpath d='M58 88h1M121 88h1M69 111c13 11 29 11 42 0M55 145c-8 22 4 31-5 51M82 145c-2 22 9 31 2 56M108 145c3 22-8 33 0 57M134 145c8 20-5 31 4 49'/%3E%3C/g%3E%3C/svg%3E");
}
html[data-theme="light"] .reveal::before {
    width: 135px; height: 165px; right: 7vw; top: 11vh;
    animation: kub-light-float-a 12s ease-in-out infinite alternate;
}
html[data-theme="light"] .reveal::after {
    width: 105px; height: 128px; left: 7vw; bottom: 9vh;
    opacity: .075;
    transform: rotate(-10deg);
    /* A second Kubarik: wink, crooked smile and a different tentacle rhythm. */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 220'%3E%3Cg fill='none' stroke='%2355a9bd' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M36 55h108v88H36z'/%3E%3Cpath d='M48 55V35h27v20M106 55V35h27v20'/%3E%3Cellipse cx='61.5' cy='35' rx='13.5' ry='6'/%3E%3Cellipse cx='119.5' cy='35' rx='13.5' ry='6'/%3E%3Cpath d='M56 88h12M115 84c7 0 11 5 11 10M70 113c12 8 27 6 39-4M49 144c10 17-4 31 5 52M77 144c8 19-7 35 1 57M105 144c-10 20 6 35-3 58M133 144c-5 18 10 29 1 50'/%3E%3C/g%3E%3C/svg%3E");
    animation: kub-light-float-b 15s ease-in-out infinite alternate;
}

html[data-theme="light"] .reveal .slides { z-index: 1; }

@keyframes kub-light-gear-a { to { transform: rotate(360deg); } }
@keyframes kub-light-gear-b { to { transform: rotate(360deg); } }
@keyframes kub-light-float-a {
    from { transform: translate3d(0,0,0) rotate(5deg); }
    to { transform: translate3d(-18px,22px,0) rotate(-4deg); }
}
@keyframes kub-light-float-b {
    from { transform: translate3d(0,0,0) rotate(-10deg); }
    to { transform: translate3d(20px,-18px,0) rotate(2deg); }
}

/* Typography */
html[data-theme="light"] .reveal h1,
html[data-theme="light"] .reveal h2,
html[data-theme="light"] .reveal h3 { color: var(--kub-navy); }
html[data-theme="light"] .lead,
html[data-theme="light"] [data-page="overview"] .overview-lead { color: #52667f; }
html[data-theme="light"] .reveal a { color: #2165c7; }

/* Scrollbars */
html[data-theme="light"] .slide-page {
    scrollbar-color: rgba(31,85,126,.25) rgba(31,85,126,.045);
}
html[data-theme="light"] .slide-page::-webkit-scrollbar-track { background: rgba(31,85,126,.04); }
html[data-theme="light"] .slide-page::-webkit-scrollbar-thumb { background: rgba(31,85,126,.22); }

/* General labels / small UI */
html[data-theme="light"] .label,
html[data-theme="light"] .ui-label,
html[data-theme="light"] [data-content-block="label"] {
    color: #456078;
    border-color: rgba(30,78,122,.13);
    background: rgba(255,255,255,.66);
    box-shadow: 0 6px 18px rgba(35,73,111,.045);
}

/* Panels and notes become paper cards rather than dark glass. */
html[data-theme="light"] .content-panel {
    border-color: rgba(27,73,119,.12);
    background: rgba(255,255,255,.72);
    box-shadow: var(--shadow-xs);
}
html[data-theme="light"] .content-panel[data-variant="highlight"] {
    border-color: rgba(47,114,229,.17);
    background: linear-gradient(135deg,rgba(230,243,255,.88),rgba(255,255,255,.82));
}
html[data-theme="light"] .content-panel[data-variant="subtle"] {
    border-color: rgba(27,73,119,.08);
    background: rgba(255,255,255,.46);
}
html[data-theme="light"] .content-panel[data-variant="outline"] {
    border-color: rgba(47,114,229,.20);
    background: rgba(255,255,255,.38);
}
html[data-theme="light"] .content-panel::after { opacity: .32; }
@media (hover:hover) and (pointer:fine) {
    html[data-theme="light"] .content-panel:hover {
        border-color: rgba(47,114,229,.18);
        background: rgba(255,255,255,.90);
        box-shadow: var(--shadow-sm);
    }
}

/* Overview cards */
html[data-theme="light"] [data-page="overview"] .overview-card {
    color: var(--text);
    border-color: rgba(27,73,119,.12);
    background: rgba(255,255,255,.74);
    box-shadow: var(--shadow-xs);
}
html[data-theme="light"] [data-page="overview"] .overview-card-main {
    border-color: rgba(47,114,229,.16);
    background: linear-gradient(135deg,rgba(232,244,255,.92),rgba(255,255,255,.78) 64%);
}
html[data-theme="light"] [data-page="overview"] .overview-number,
html[data-theme="light"] [data-page="overview"] .overview-arrow { color: #8493a5; }
html[data-theme="light"] [data-page="overview"] .overview-subtitle { color: #718198; }
html[data-theme="light"] [data-page="overview"] .overview-card p,
html[data-theme="light"] [data-page="overview"] .overview-note { color: #52667f; }
html[data-theme="light"] [data-page="overview"] .overview-note { border-top-color: rgba(27,73,119,.10); }
html[data-theme="light"] [data-page="overview"] .overview-icon {
    border-color: rgba(27,73,119,.08);
    background: rgba(244,201,40,.18);
}
html[data-theme="light"] [data-page="overview"] .overview-priority {
    color: #745e00;
    border-color: rgba(190,148,0,.20);
    background: rgba(244,201,40,.16);
}
@media (hover:hover) and (pointer:fine) {
    html[data-theme="light"] [data-page="overview"] .overview-card:hover {
        border-color: rgba(47,114,229,.18);
        background: rgba(255,255,255,.94);
        box-shadow: var(--shadow-md);
    }
}

/* Header: pale translucent strip, navy text. */
html[data-theme="light"] .presentation-header,
html[data-theme="light"] .presentation-header.is-scrolled {
    color: var(--kub-navy);
    border-bottom-color: rgba(29,75,119,.10) !important;
    background: rgba(247,252,253,.84) !important;
    box-shadow: 0 8px 24px rgba(34,73,111,.045) !important;
    backdrop-filter: blur(15px) saturate(1.1);
    -webkit-backdrop-filter: blur(15px) saturate(1.1);
}
html[data-theme="light"] .presentation-current-title,
html[data-theme="light"] .presentation-header-title,
html[data-theme="light"] .presentation-header-label {
    color: var(--kub-navy) !important;
    text-shadow: none !important;
}
html[data-theme="light"] .presentation-menu-toggle {
    color: var(--kub-navy) !important;
    border-color: rgba(25,71,125,.13) !important;
    background: rgba(255,255,255,.72) !important;
}
html[data-theme="light"] .presentation-menu {
    color: var(--text) !important;
    border-color: rgba(25,71,125,.13) !important;
    background: rgba(251,254,255,.96) !important;
    box-shadow: 0 18px 48px rgba(35,73,111,.15) !important;
}
html[data-theme="light"] .presentation-menu a,
html[data-theme="light"] .presentation-menu button { color: var(--text) !important; }

/* Footer should belong to the page, not become a dark bar. */
html[data-theme="light"] .presentation-footer {
    color: #60738a !important;
    border-top-color: rgba(25,71,125,.09) !important;
    background: rgba(247,252,253,.80) !important;
    box-shadow: 0 -8px 24px rgba(35,73,111,.035) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
html[data-theme="light"] .presentation-footer a { color: #355c86 !important; }

/* Reveal arrows: blue on light background. */
html[data-theme="light"] .reveal .controls { color: var(--kub-blue); }
html[data-theme="light"] .reveal .controls button { color: var(--kub-blue); }

/* Common content blocks with hard-coded dark-theme colors. */
html[data-theme="light"] [data-content-block="text"],
html[data-theme="light"] .content-text,
html[data-theme="light"] .detail-list,
html[data-theme="light"] .content-list { color: var(--text); }
html[data-theme="light"] .content-note,
html[data-theme="light"] [data-content-block="note"] {
    color: #415a73;
    border-color: rgba(34,85,130,.13);
    background: rgba(255,255,255,.58);
}
html[data-theme="light"] .content-divider { border-color: rgba(25,71,125,.13); }

/* Book quote variants: transparent, ink-like lines and text. */
html[data-theme="light"] [data-content-block="quote"] { color: #2d4057; }
html[data-theme="light"] [data-content-block="quote"]::before,
html[data-theme="light"] [data-content-block="quote"]::after { border-color: rgba(24,61,99,.28); }
html[data-theme="light"] .content-quote,
html[data-theme="light"] .content-quote-text { color: #2d4057; }

/* Gallery / media surfaces. */
html[data-theme="light"] .gallery-item,
html[data-theme="light"] .content-image img,
html[data-theme="light"] .photos-frame {
    border-color: rgba(25,71,125,.12);
    box-shadow: var(--shadow-xs);
}


/* v95 — light-theme legibility and media separation. */
html[data-theme="light"] .content-accent-heading {
    color: var(--kub-navy) !important;
}
html[data-theme="light"] .content-photo-slide img,
html[data-theme="light"] .content-photo-clone img,
html[data-theme="light"] .gallery-item img,
html[data-theme="light"] .content-image img {
    box-shadow: 0 5px 18px rgba(31, 69, 105, .13), 0 1px 4px rgba(31, 69, 105, .08);
}

/* Final page inherits the exact same theme/background as every other page. */
html[data-theme="light"] [data-page="final"],
html[data-theme="light"] [data-page="final"] .final-page,
html[data-theme="light"] [data-page="final"] .final-content { background: transparent !important; }

@media (prefers-reduced-motion: reduce) {
    html[data-theme="light"] body::before,
    html[data-theme="light"] body::after,
    html[data-theme="light"] .reveal::before,
    html[data-theme="light"] .reveal::after { animation: none !important; }
}

@media (max-width:768px) {
    html[data-theme="light"] body::before { width: 190px; height: 190px; left: -90px; opacity: .075; }
    html[data-theme="light"] body::after { width: 150px; height: 150px; right: -72px; opacity: .06; }
    html[data-theme="light"] .reveal::before { width: 86px; height: 106px; right: 2vw; top: 12vh; opacity: .065; }
    html[data-theme="light"] .reveal::after { width: 74px; height: 90px; left: 1vw; bottom: 10vh; opacity: .05; }
}

/* v97 — complete light-theme contrast contracts. */
html[data-theme="light"] [data-page="final"] .final-title {
    color: var(--kub-navy) !important;
}
html[data-theme="light"] [data-page="final"] .final-lead {
    color: #60738a !important;
}
html[data-theme="light"] [data-page="final"] .final-help {
    color: var(--text) !important;
    border-color: rgba(25,71,125,.11) !important;
    background: rgba(255,255,255,.56) !important;
    box-shadow: var(--shadow-xs) !important;
}
html[data-theme="light"] [data-page="final"] .final-help p {
    color: #52667f !important;
}
html[data-theme="light"] [data-page="final"] .final-main-button,
html[data-theme="light"] [data-page="final"] .final-contact-button {
    color: #294766 !important;
    border-color: rgba(25,71,125,.11) !important;
    background: rgba(255,255,255,.72) !important;
    box-shadow: var(--shadow-xs) !important;
}
html[data-theme="light"] [data-page="final"] .final-main-button:hover,
html[data-theme="light"] [data-page="final"] .final-contact-button:hover {
    color: var(--kub-navy) !important;
    border-color: rgba(47,114,229,.20) !important;
    background: rgba(255,255,255,.92) !important;
    box-shadow: var(--shadow-sm) !important;
}
html[data-theme="light"] [data-page="final"] .contact-icon {
    color: #2165c7 !important;
    background: rgba(47,114,229,.10) !important;
}
html[data-theme="light"] [data-page="final"] .final-small {
    color: #718198 !important;
}

html[data-theme="light"] .content-detail-copy strong {
    color: #263b55 !important;
}
html[data-theme="light"] .content-detail-copy small {
    color: #687b91 !important;
}
html[data-theme="light"] .content-detail-marker {
    background: #4b8be8 !important;
    box-shadow: 0 0 0 4px rgba(75,139,232,.11) !important;
}
html[data-theme="light"] .content-detail-list[data-variant="lines"] .content-detail-marker {
    background: #4b8be8 !important;
    box-shadow: none !important;
}

/* Lists use the same compact pointer language as detail-list. */
html[data-theme="light"] .content-list[data-variant="bullets"] {
    list-style: none;
    padding-left: 1.25em;
}
html[data-theme="light"] .content-list[data-variant="bullets"] li {
    position: relative;
}
html[data-theme="light"] .content-list[data-variant="bullets"] li::before {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    left: -1.12em;
    top: .72em;
    border-radius: 50%;
    background: #4b8be8;
    box-shadow: 0 0 0 4px rgba(75,139,232,.11);
}
html[data-theme="light"] .content-list[data-variant="numbered"]::marker,
html[data-theme="light"] .content-list[data-variant="numbered"] li::marker {
    color: #3979d8;
}
html[data-theme="light"] .presentation-theme-toggle {
    color: #355c86 !important;
    border-color: rgba(25,71,125,.13) !important;
    background: rgba(255,255,255,.66) !important;
}
html[data-theme="light"] .presentation-theme-toggle:hover {
    color: var(--kub-navy) !important;
    border-color: rgba(47,114,229,.22) !important;
    background: rgba(255,255,255,.94) !important;
}

/* v99 — stronger page separators and light navigation hub. */
html[data-theme="light"] .content-divider{border-color:rgba(31,83,132,.28)!important}
html[data-theme="light"] .content-divider[data-variant="soft"]{border-color:rgba(31,83,132,.18)!important}
html[data-theme="light"] .presentation-footer-hub-toggle{color:#214f80;border-color:rgba(47,114,229,.22);background:rgba(47,114,229,.07)}
html[data-theme="light"] .navigation-hub-backdrop{background:rgba(35,61,88,.22)}
html[data-theme="light"] .navigation-hub-panel{background:#f6fbfd;color:#334b64;border-top-color:rgba(25,71,125,.14);box-shadow:0 -24px 70px rgba(35,73,111,.16)}
html[data-theme="light"] .navigation-hub-header h2,html[data-theme="light"] .navigation-hub-section h3{color:var(--kub-navy)}
html[data-theme="light"] .navigation-hub-section{border-color:rgba(25,71,125,.12);background:rgba(255,255,255,.7)}
html[data-theme="light"] .navigation-hub-section a,html[data-theme="light"] .navigation-hub-section span{color:#536d87}
html[data-theme="light"] .navigation-hub-section a:hover{color:var(--kub-blue)}
html[data-theme="light"] .navigation-hub-close{border-color:rgba(25,71,125,.14);background:#fff;color:var(--kub-navy)}
html[data-theme="light"] .navigation-hub-collapse{border-top-color:rgba(25,71,125,.12);background:#edf6f9;color:#315b82}

/* v102 — dividers use background, not border. Keep them visible on the pale theme. */
html[data-theme="light"] .content-divider {
    background: rgba(39, 82, 122, .34) !important;
    border-color: transparent !important;
}
html[data-theme="light"] .content-divider[data-variant="soft"] {
    background: linear-gradient(90deg, transparent 0%, rgba(39, 82, 122, .08) 7%, rgba(39, 82, 122, .34) 24%, rgba(39, 82, 122, .34) 76%, rgba(39, 82, 122, .08) 93%, transparent 100%) !important;
    border-color: transparent !important;
}

/* v104 — decorative motion stays alive on desktop too. The earlier generic
   reduced-motion rule was the reason desktop could become completely static. */
@media (prefers-reduced-motion: reduce) {
    html[data-theme="light"] body::before { animation: kub-light-gear-a 42s linear infinite !important; }
    html[data-theme="light"] body::after { animation: kub-light-gear-b 34s linear infinite reverse !important; }
    html[data-theme="light"] .reveal::before { animation: kub-light-float-a 12s ease-in-out infinite alternate !important; }
    html[data-theme="light"] .reveal::after { animation: kub-light-float-b 15s ease-in-out infinite alternate !important; }
}

/* v108 — footer controls are neutral in light theme too; hover is shared by all three zones. */
html[data-theme="light"] .presentation-footer-hub-toggle,html[data-theme="light"] .presentation-footer-back{color:inherit!important;background:transparent!important;border-color:rgba(25,71,125,.11)!important}
html[data-theme="light"] .presentation-footer-hub-toggle:hover,html[data-theme="light"] .presentation-footer-back:not(:disabled):hover,html[data-theme="light"] .presentation-footer-home:hover{background:rgba(25,71,125,.055)!important;color:#355c86!important}


/* v148 — make the real slide-page geometry visually explicit.
   The footer already follows this outer box; previously the pale background had
   no clear side edge, so the footer looked wider even when its geometry matched. */
html[data-theme="light"] .slide-page {
    background:
        linear-gradient(118deg, rgba(255,255,255,.74), rgba(255,255,255,.55) 54%, rgba(244,252,255,.66));
    border: 1px solid rgba(31,85,126,.12);
    border-bottom-color: rgba(31,85,126,.08);
    border-radius: 0;
    box-shadow:
        0 1px 0 rgba(255,255,255,.78) inset,
        0 12px 34px rgba(35,73,111,.07),
        0 28px 70px rgba(35,73,111,.055);
    -webkit-backdrop-filter: blur(12px) saturate(112%);
    backdrop-filter: blur(12px) saturate(112%);
}
@media (max-width:768px) {
    html[data-theme="light"] .slide-page {
        border-left: 0;
        border-right: 0;
        border-radius: 0;
        box-shadow: none;
        -webkit-backdrop-filter: blur(8px) saturate(108%);
        backdrop-filter: blur(8px) saturate(108%);
    }
}


/* v150 — the page is a continuous reading surface, not a giant card. */
html[data-theme="light"] .slide-page { border-radius: 0 !important; }
