/* ==========================================================================
   THEME TOKENS
   ========================================================================== */
:root{
    --bg:#0f0f10;
    --fg:#f3f4f6;
    --muted:#b9bfc6;
    --bg-attachment: inherit;

    --brand:#06b6d4;
    --brand-2:#22c55e;

    --brand-height:50px;
    --brand-background:#fff;
    --brand-background-padding:3px;
    --brand-background-border:0;
    --brand-background-radius:10px;

    --accent:#101316;
    --surface:#15171a;
    --surface-2:#1a1d21;
    --card:#121416;

    --border:rgba(255,255,255,.10);
    --bw-1:1px;
    --bw-2:2px;
    --radius:18px;
    --radius-lg:28px;
    --round:999px;

    --shadow-sm:0 6px 18px rgba(0,0,0,.18);
    --shadow:0 10px 30px rgba(0,0,0,.25);
    --shadow-lg:0 18px 46px rgba(0,0,0,.48);

    --hero-h:70vh;
    --hero-h-md:82vh;
    --head-h:60px;
    --container-max:1100px;

    --ff-base:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    --ff-head:var(--ff-base);
    --fw-body:400;
    --fw-strong:600;
    --fw-head:600;
    --ls-head:.01em;
    --ls-kicker:.08em;
    --lh-base:1.6;
    --fs-base:1rem;

    --link:var(--brand);
    --link-hover-opa:.9;
    --focus-ring:color-mix(in srgb, var(--brand) 30%, transparent);

    --hero-scrim-top:rgba(0,0,0,.38);
    --hero-scrim-bottom:rgba(0,0,0,.78);

    --chip-bg:var(--surface-2);
    --ghost-bg:rgba(255,255,255,.06);
    --ghost-bg-hover:color-mix(in srgb, var(--surface-2) 70%, transparent);

    --section-a-top:color-mix(in srgb, var(--surface) 86%, #000 14%);
    --section-a-bottom:color-mix(in srgb, var(--surface) 74%, #000 26%);
    --section-b-top:color-mix(in srgb, var(--surface) 84%, #000 16%);
    --section-b-bottom:color-mix(in srgb, var(--surface) 72%, #000 28%);

    --header-bg:linear-gradient(180deg, rgba(15,15,16,.95), rgba(15,15,16,.72));
    --header-fg:var(--fg);
    --header-border:var(--border);

    --hero-panel-bg:linear-gradient(180deg,rgba(18,20,22,.75),rgba(18,20,22,.55));
    --hero-panel-border:var(--bw-1) solid var(--border);
    --hero-panel-radius:var(--radius-lg);
    --hero-panel-shadow:var(--shadow);
    --panel-fg:var(--fg);

    --card-elev-1:color-mix(in srgb, var(--card) 96%, var(--brand) 4%);
    --card-elev-2:color-mix(in srgb, var(--card) 92%, var(--brand) 8%);

    --faq-open-bg:color-mix(in srgb, var(--card) 92%, var(--brand) 8%);
    --faq-open-border:color-mix(in srgb, var(--brand) 28%, var(--border));
    --faq-open-ring:color-mix(in srgb, var(--brand) 30%, transparent);
}

/* ==========================================================================
   THEMES
   ========================================================================== */
.theme-forest{
    --bg:
            radial-gradient(1200px 520px at 50% -260px, rgba(17,121,100,.12) 0%, rgba(17,121,100,0) 65%),
            linear-gradient(180deg,#0d1b18 0%, #0a1513 100%);
    --fg:#f1fbf7;
    --muted:#c2ded5;

    --brand:#12b886;
    --brand-2:#12a6c2;

    --brand-height:56px;
    --brand-background:transparent;
    --brand-background-padding:6px;
    --brand-background-border:1px solid rgba(255,255,255,.08);
    --brand-background-radius:14px;

    --accent:#0b1f1a;
    --surface:#112821;
    --surface-2:#15372e;
    --card:#0f241e;

    --border:rgba(198,255,238,.18);
    --bw-1:1px;
    --bw-2:2px;
    --radius:20px;
    --radius-lg:32px;
    --round:999px;

    --shadow-sm:0 8px 20px rgba(0,0,0,.20);
    --shadow:0 14px 36px rgba(0,0,0,.30);
    --shadow-lg:0 22px 52px rgba(0,0,0,.46);

    --hero-h:72vh;
    --hero-h-md:86vh;
    --head-h:64px;
    --container-max:1140px;

    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:800;
    --ls-head:.02em;
    --ls-kicker:.10em;
    --lh-base:1.65;
    --fs-base:1.02rem;

    --link:color-mix(in srgb, var(--brand) 88%, white 12%);
    --link-hover-opa:.94;
    --focus-ring:color-mix(in srgb, var(--brand) 40%, transparent);

    --hero-scrim-top:rgba(0,0,0,.42);
    --hero-scrim-bottom:rgba(0,0,0,.82);

    --chip-bg:#0f2e25;
    --ghost-bg:rgba(255,255,255,.06);
    --ghost-bg-hover:#12362c;

    --section-a-top:color-mix(in srgb, var(--surface) 88%, #000 12%);
    --section-a-bottom:color-mix(in srgb, var(--surface) 72%, #000 28%);
    --section-b-top:color-mix(in srgb, var(--surface) 84%, #000 16%);
    --section-b-bottom:color-mix(in srgb, var(--surface) 66%, #000 34%);

    --header-bg:#0e1e18;
    --header-fg:#e8faf3;
    --header-border:rgba(198,255,238,.18);

    --hero-panel-bg:linear-gradient(180deg,rgba(18,64,55,.52),rgba(18,64,55,.32));
    --hero-panel-border:1px solid rgba(198,255,238,.20);
    --hero-panel-radius:28px;
    --hero-panel-shadow:0 14px 40px rgba(0,0,0,.28);
    --panel-fg:#e8faf3;

    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 88%, var(--brand) 12%);

    --faq-open-bg:color-mix(in srgb, var(--card) 88%, var(--brand) 12%);
    --faq-open-border:rgba(18,184,134,.5);
    --faq-open-ring:color-mix(in srgb, var(--brand) 38%, transparent);
}

.theme-green{
    --bg:linear-gradient(180deg,#f7fcfa 0%, #eef6f2 100%);
    --fg:#0f221b;
    --muted:#5f726c;

    --brand:#12b886;
    --brand-2:#0ea5a7;

    --brand-height:50px;
    --brand-background:transparent;
    --brand-background-padding:2px;
    --brand-background-border:0;
    --brand-background-radius:0;

    --accent:#f9fdfa;
    --surface:#f3faf6;
    --surface-2:#e6f2ed;
    --card:#ffffff;

    --border:rgba(0,0,0,.10);
    --bw-1:1px;
    --bw-2:2px;
    --radius:18px;
    --radius-lg:28px;
    --round:999px;

    --shadow-sm:0 6px 18px rgba(16,32,27,.06);
    --shadow:0 12px 28px rgba(16,32,27,.08);
    --shadow-lg:0 18px 44px rgba(16,32,27,.10);

    --hero-h:72vh;
    --hero-h-md:86vh;
    --head-h:64px;
    --container-max:1140px;

    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --fw-body:400;
    --fw-strong:600;
    --fw-head:800;
    --ls-head:.01em;
    --ls-kicker:.10em;
    --lh-base:1.65;
    --fs-base:1.02rem;

    --link:color-mix(in srgb, var(--brand) 95%, black 5%);
    --link-hover-opa:.9;
    --focus-ring:color-mix(in srgb, var(--brand) 45%, transparent);

    --hero-scrim-top:rgba(0,0,0,.28);
    --hero-scrim-bottom:rgba(0,0,0,.55);

    --chip-bg:#eaf6f2;
    --ghost-bg:rgba(16,32,27,.04);
    --ghost-bg-hover:rgba(16,32,27,.06);

    --section-a-top:#f7fcfa;
    --section-a-bottom:#eef6f2;
    --section-b-top:#f6fbf8;
    --section-b-bottom:#edf5f1;

    --header-bg:#ffffff;
    --header-fg:#0f1f1a;
    --header-border:rgba(0,0,0,.06);

    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78));
    --hero-panel-border:1px solid rgba(0,0,0,.08);
    --hero-panel-radius:28px;
    --hero-panel-shadow:0 18px 40px rgba(16,32,27,.10);
    --panel-fg:#0f1f1a;

    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 90%, var(--brand) 10%);

    --faq-open-bg:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --faq-open-border:color-mix(in srgb, var(--brand) 40%, transparent);
    --faq-open-ring:color-mix(in srgb, var(--brand) 35%, transparent);
}

.theme-ocean{
    --bg:radial-gradient(1400px 600px at 50% -300px, rgba(14,116,144,.14) 0%, rgba(14,116,144,0) 70%),linear-gradient(180deg,#0a1929 0%, #071318 100%);
    --fg:#e3f2fd;
    --muted:#90caf9;
    --brand:#0ea5e9;
    --brand-2:#06b6d4;
    --brand-height:54px;
    --brand-background:transparent;
    --brand-background-padding:5px;
    --brand-background-border:1px solid rgba(255,255,255,.10);
    --brand-background-radius:12px;
    --accent:#0d2137;
    --surface:#0f2942;
    --surface-2:#14344d;
    --card:#0c1f2f;
    --border:rgba(179,229,252,.16);
    --bw-1:1px;
    --bw-2:2px;
    --radius:20px;
    --radius-lg:30px;
    --round:999px;
    --shadow-sm:0 8px 22px rgba(0,0,0,.24);
    --shadow:0 16px 38px rgba(0,0,0,.32);
    --shadow-lg:0 24px 56px rgba(0,0,0,.48);
    --hero-h:74vh;
    --hero-h-md:88vh;
    --head-h:62px;
    --container-max:1120px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:800;
    --ls-head:.015em;
    --ls-kicker:.09em;
    --lh-base:1.62;
    --fs-base:1.01rem;
    --link:color-mix(in srgb, var(--brand) 90%, white 10%);
    --link-hover-opa:.92;
    --focus-ring:color-mix(in srgb, var(--brand) 42%, transparent);
    --hero-scrim-top:rgba(0,0,0,.40);
    --hero-scrim-bottom:rgba(0,0,0,.80);
    --chip-bg:#0f2d45;
    --ghost-bg:rgba(255,255,255,.07);
    --ghost-bg-hover:#133651;
    --section-a-top:color-mix(in srgb, var(--surface) 90%, #000 10%);
    --section-a-bottom:color-mix(in srgb, var(--surface) 74%, #000 26%);
    --section-b-top:color-mix(in srgb, var(--surface) 86%, #000 14%);
    --section-b-bottom:color-mix(in srgb, var(--surface) 68%, #000 32%);
    --header-bg:#0b1d2e;
    --header-fg:#e3f2fd;
    --header-border:rgba(179,229,252,.16);
    --hero-panel-bg:linear-gradient(180deg,rgba(15,41,66,.58),rgba(15,41,66,.38));
    --hero-panel-border:1px solid rgba(179,229,252,.22);
    --hero-panel-radius:30px;
    --hero-panel-shadow:0 16px 42px rgba(0,0,0,.30);
    --panel-fg:#e3f2fd;
    --card-elev-1:color-mix(in srgb, var(--card) 95%, var(--brand) 5%);
    --card-elev-2:color-mix(in srgb, var(--card) 90%, var(--brand) 10%);
    --faq-open-bg:color-mix(in srgb, var(--card) 90%, var(--brand) 10%);
    --faq-open-border:rgba(14,165,233,.48);
    --faq-open-ring:color-mix(in srgb, var(--brand) 40%, transparent);
}

.theme-sunset{
    --bg:radial-gradient(1300px 580px at 50% -280px, rgba(251,113,133,.10) 0%, rgba(251,113,133,0) 68%),linear-gradient(180deg,#1a0e13 0%, #130a0f 100%);
    --fg:#fce7f3;
    --muted:#f9a8d4;
    --brand:#f43f5e;
    --brand-2:#fb7185;
    --brand-height:52px;
    --brand-background:transparent;
    --brand-background-padding:4px;
    --brand-background-border:1px solid rgba(255,255,255,.12);
    --brand-background-radius:14px;
    --accent:#1f0e16;
    --surface:#2a1520;
    --surface-2:#371d2a;
    --card:#23121b;
    --border:rgba(252,231,243,.15);
    --bw-1:1px;
    --bw-2:2px;
    --radius:22px;
    --radius-lg:32px;
    --round:999px;
    --shadow-sm:0 7px 20px rgba(0,0,0,.26);
    --shadow:0 15px 40px rgba(0,0,0,.34);
    --shadow-lg:0 23px 54px rgba(0,0,0,.50);
    --hero-h:70vh;
    --hero-h-md:84vh;
    --head-h:60px;
    --container-max:1100px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:800;
    --ls-head:.02em;
    --ls-kicker:.10em;
    --lh-base:1.64;
    --fs-base:1.02rem;
    --link:color-mix(in srgb, var(--brand) 88%, white 12%);
    --link-hover-opa:.93;
    --focus-ring:color-mix(in srgb, var(--brand) 38%, transparent);
    --hero-scrim-top:rgba(0,0,0,.44);
    --hero-scrim-bottom:rgba(0,0,0,.84);
    --chip-bg:#2e1824;
    --ghost-bg:rgba(255,255,255,.06);
    --ghost-bg-hover:#331d28;
    --section-a-top:color-mix(in srgb, var(--surface) 88%, #000 12%);
    --section-a-bottom:color-mix(in srgb, var(--surface) 70%, #000 30%);
    --section-b-top:color-mix(in srgb, var(--surface) 84%, #000 16%);
    --section-b-bottom:color-mix(in srgb, var(--surface) 64%, #000 36%);
    --header-bg:#1d1016;
    --header-fg:#fce7f3;
    --header-border:rgba(252,231,243,.15);
    --hero-panel-bg:linear-gradient(180deg,rgba(42,21,32,.56),rgba(42,21,32,.36));
    --hero-panel-border:1px solid rgba(252,231,243,.20);
    --hero-panel-radius:30px;
    --hero-panel-shadow:0 15px 38px rgba(0,0,0,.32);
    --panel-fg:#fce7f3;
    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 88%, var(--brand) 12%);
    --faq-open-bg:color-mix(in srgb, var(--card) 88%, var(--brand) 12%);
    --faq-open-border:rgba(244,63,94,.50);
    --faq-open-ring:color-mix(in srgb, var(--brand) 40%, transparent);
}

.theme-lavender{
    --bg:linear-gradient(180deg,#faf8fc 0%, #f3eef8 100%);
    --fg:#2d1b3d;
    --muted:#7c5d8e;
    --brand:#9333ea;
    --brand-2:#a855f7;
    --brand-height:48px;
    --brand-background:transparent;
    --brand-background-padding:2px;
    --brand-background-border:0;
    --brand-background-radius:0;
    --accent:#fbf9fd;
    --surface:#f7f3fb;
    --surface-2:#ede7f3;
    --card:#ffffff;
    --border:rgba(0,0,0,.11);
    --bw-1:1px;
    --bw-2:2px;
    --radius:20px;
    --radius-lg:30px;
    --round:999px;
    --shadow-sm:0 6px 18px rgba(45,27,61,.07);
    --shadow:0 12px 30px rgba(45,27,61,.09);
    --shadow-lg:0 18px 46px rgba(45,27,61,.11);
    --hero-h:72vh;
    --hero-h-md:86vh;
    --head-h:64px;
    --container-max:1140px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:600;
    --fw-head:800;
    --ls-head:.01em;
    --ls-kicker:.10em;
    --lh-base:1.65;
    --fs-base:1.02rem;
    --link:color-mix(in srgb, var(--brand) 94%, black 6%);
    --link-hover-opa:.90;
    --focus-ring:color-mix(in srgb, var(--brand) 44%, transparent);
    --hero-scrim-top:rgba(0,0,0,.30);
    --hero-scrim-bottom:rgba(0,0,0,.58);
    --chip-bg:#efe9f5;
    --ghost-bg:rgba(45,27,61,.05);
    --ghost-bg-hover:rgba(45,27,61,.08);
    --section-a-top:#faf8fc;
    --section-a-bottom:#f3eef8;
    --section-b-top:#f9f7fb;
    --section-b-bottom:#f2edf7;
    --header-bg:#ffffff;
    --header-fg:#2d1b3d;
    --header-border:rgba(0,0,0,.07);
    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.93),rgba(255,255,255,.80));
    --hero-panel-border:1px solid rgba(0,0,0,.09);
    --hero-panel-radius:30px;
    --hero-panel-shadow:0 18px 42px rgba(45,27,61,.11);
    --panel-fg:#2d1b3d;
    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 90%, var(--brand) 10%);
    --faq-open-bg:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --faq-open-border:color-mix(in srgb, var(--brand) 42%, transparent);
    --faq-open-ring:color-mix(in srgb, var(--brand) 36%, transparent);
}

.theme-amber{
    --bg:radial-gradient(1350px 590px at 50% -290px, rgba(245,158,11,.12) 0%, rgba(245,158,11,0) 69%),linear-gradient(180deg,#1a1410 0%, #130f0a 100%);
    --fg:#fef3c7;
    --muted:#fcd34d;
    --brand:#f59e0b;
    --brand-2:#fbbf24;
    --brand-height:52px;
    --brand-background:transparent;
    --brand-background-padding:4px;
    --brand-background-border:1px solid rgba(255,255,255,.11);
    --brand-background-radius:13px;
    --accent:#1f1912;
    --surface:#2a1f15;
    --surface-2:#362817;
    --card:#231b11;
    --border:rgba(254,243,199,.16);
    --bw-1:1px;
    --bw-2:2px;
    --radius:21px;
    --radius-lg:31px;
    --round:999px;
    --shadow-sm:0 7px 19px rgba(0,0,0,.25);
    --shadow:0 14px 37px rgba(0,0,0,.33);
    --shadow-lg:0 22px 53px rgba(0,0,0,.49);
    --hero-h:73vh;
    --hero-h-md:87vh;
    --head-h:62px;
    --container-max:1120px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:800;
    --ls-head:.018em;
    --ls-kicker:.09em;
    --lh-base:1.63;
    --fs-base:1.01rem;
    --link:color-mix(in srgb, var(--brand) 89%, white 11%);
    --link-hover-opa:.92;
    --focus-ring:color-mix(in srgb, var(--brand) 39%, transparent);
    --hero-scrim-top:rgba(0,0,0,.42);
    --hero-scrim-bottom:rgba(0,0,0,.82);
    --chip-bg:#2c2215;
    --ghost-bg:rgba(255,255,255,.07);
    --ghost-bg-hover:#31251a;
    --section-a-top:color-mix(in srgb, var(--surface) 89%, #000 11%);
    --section-a-bottom:color-mix(in srgb, var(--surface) 73%, #000 27%);
    --section-b-top:color-mix(in srgb, var(--surface) 85%, #000 15%);
    --section-b-bottom:color-mix(in srgb, var(--surface) 67%, #000 33%);
    --header-bg:#1c1512;
    --header-fg:#fef3c7;
    --header-border:rgba(254,243,199,.16);
    --hero-panel-bg:linear-gradient(180deg,rgba(42,31,21,.57),rgba(42,31,21,.37));
    --hero-panel-border:1px solid rgba(254,243,199,.21);
    --hero-panel-radius:30px;
    --hero-panel-shadow:0 15px 39px rgba(0,0,0,.31);
    --panel-fg:#fef3c7;
    --card-elev-1:color-mix(in srgb, var(--card) 95%, var(--brand) 5%);
    --card-elev-2:color-mix(in srgb, var(--card) 89%, var(--brand) 11%);
    --faq-open-bg:color-mix(in srgb, var(--card) 89%, var(--brand) 11%);
    --faq-open-border:rgba(245,158,11,.49);
    --faq-open-ring:color-mix(in srgb, var(--brand) 39%, transparent);
}

.theme-slate{
    --bg:radial-gradient(1250px 550px at 50% -270px, rgba(100,116,139,.11) 0%, rgba(100,116,139,0) 67%),linear-gradient(180deg,#0f1419 0%, #0a0e12 100%);
    --fg:#f1f5f9;
    --muted:#cbd5e1;
    --brand:#64748b;
    --brand-2:#94a3b8;
    --brand-height:50px;
    --brand-background:transparent;
    --brand-background-padding:4px;
    --brand-background-border:1px solid rgba(255,255,255,.09);
    --brand-background-radius:12px;
    --accent:#12171d;
    --surface:#181e25;
    --surface-2:#1e252e;
    --card:#141a20;
    --border:rgba(241,245,249,.14);
    --bw-1:1px;
    --bw-2:2px;
    --radius:19px;
    --radius-lg:29px;
    --round:999px;
    --shadow-sm:0 7px 20px rgba(0,0,0,.23);
    --shadow:0 13px 36px rgba(0,0,0,.31);
    --shadow-lg:0 21px 52px rgba(0,0,0,.47);
    --hero-h:71vh;
    --hero-h-md:85vh;
    --head-h:61px;
    --container-max:1110px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:800;
    --ls-head:.016em;
    --ls-kicker:.09em;
    --lh-base:1.62;
    --fs-base:1.01rem;
    --link:color-mix(in srgb, var(--brand) 91%, white 9%);
    --link-hover-opa:.91;
    --focus-ring:color-mix(in srgb, var(--brand) 41%, transparent);
    --hero-scrim-top:rgba(0,0,0,.41);
    --hero-scrim-bottom:rgba(0,0,0,.81);
    --chip-bg:#1a2229;
    --ghost-bg:rgba(255,255,255,.06);
    --ghost-bg-hover:#1f272f;
    --section-a-top:color-mix(in srgb, var(--surface) 89%, #000 11%);
    --section-a-bottom:color-mix(in srgb, var(--surface) 73%, #000 27%);
    --section-b-top:color-mix(in srgb, var(--surface) 85%, #000 15%);
    --section-b-bottom:color-mix(in srgb, var(--surface) 67%, #000 33%);
    --header-bg:#101519;
    --header-fg:#f1f5f9;
    --header-border:rgba(241,245,249,.14);
    --hero-panel-bg:linear-gradient(180deg,rgba(24,30,37,.56),rgba(24,30,37,.36));
    --hero-panel-border:1px solid rgba(241,245,249,.19);
    --hero-panel-radius:28px;
    --hero-panel-shadow:0 14px 38px rgba(0,0,0,.30);
    --panel-fg:#f1f5f9;
    --card-elev-1:color-mix(in srgb, var(--card) 95%, var(--brand) 5%);
    --card-elev-2:color-mix(in srgb, var(--card) 89%, var(--brand) 11%);
    --faq-open-bg:color-mix(in srgb, var(--card) 89%, var(--brand) 11%);
    --faq-open-border:rgba(100,116,139,.47);
    --faq-open-ring:color-mix(in srgb, var(--brand) 39%, transparent);
}

.theme-sky{
    --bg:linear-gradient(180deg,#f0f9ff 0%, #e0f2fe 100%);
    --fg:#0c4a6e;
    --muted:#075985;
    --brand:#0284c7;
    --brand-2:#0ea5e9;
    --brand-height:48px;
    --brand-background:transparent;
    --brand-background-padding:2px;
    --brand-background-border:0;
    --brand-background-radius:0;
    --accent:#f8fcff;
    --surface:#f0f9ff;
    --surface-2:#dbeafe;
    --card:#ffffff;
    --border:rgba(0,0,0,.10);
    --bw-1:1px;
    --bw-2:2px;
    --radius:20px;
    --radius-lg:30px;
    --round:999px;
    --shadow-sm:0 6px 18px rgba(12,74,110,.06);
    --shadow:0 12px 30px rgba(12,74,110,.08);
    --shadow-lg:0 18px 46px rgba(12,74,110,.10);
    --hero-h:72vh;
    --hero-h-md:86vh;
    --head-h:64px;
    --container-max:1140px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:600;
    --fw-head:800;
    --ls-head:.01em;
    --ls-kicker:.10em;
    --lh-base:1.65;
    --fs-base:1.02rem;
    --link:color-mix(in srgb, var(--brand) 95%, black 5%);
    --link-hover-opa:.90;
    --focus-ring:color-mix(in srgb, var(--brand) 45%, transparent);
    --hero-scrim-top:rgba(0,0,0,.28);
    --hero-scrim-bottom:rgba(0,0,0,.56);
    --chip-bg:#e0f2fe;
    --ghost-bg:rgba(12,74,110,.04);
    --ghost-bg-hover:rgba(12,74,110,.07);
    --section-a-top:#f0f9ff;
    --section-a-bottom:#e0f2fe;
    --section-b-top:#eff8ff;
    --section-b-bottom:#dff1fd;
    --header-bg:#ffffff;
    --header-fg:#0c4a6e;
    --header-border:rgba(0,0,0,.06);
    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78));
    --hero-panel-border:1px solid rgba(0,0,0,.08);
    --hero-panel-radius:30px;
    --hero-panel-shadow:0 18px 42px rgba(12,74,110,.10);
    --panel-fg:#0c4a6e;
    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 90%, var(--brand) 10%);
    --faq-open-bg:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --faq-open-border:color-mix(in srgb, var(--brand) 40%, transparent);
    --faq-open-ring:color-mix(in srgb, var(--brand) 35%, transparent);
}

.theme-peach{
    --bg:linear-gradient(180deg,#fff7ed 0%, #ffedd5 100%);
    --fg:#7c2d12;
    --muted:#c2410c;
    --brand:#ea580c;
    --brand-2:#fb923c;
    --brand-height:48px;
    --brand-background:transparent;
    --brand-background-padding:2px;
    --brand-background-border:0;
    --brand-background-radius:0;
    --accent:#fffaf5;
    --surface:#fff7ed;
    --surface-2:#fed7aa;
    --card:#ffffff;
    --border:rgba(0,0,0,.09);
    --bw-1:1px;
    --bw-2:2px;
    --radius:22px;
    --radius-lg:32px;
    --round:999px;
    --shadow-sm:0 6px 18px rgba(124,45,18,.06);
    --shadow:0 12px 30px rgba(124,45,18,.08);
    --shadow-lg:0 18px 46px rgba(124,45,18,.10);
    --hero-h:72vh;
    --hero-h-md:86vh;
    --head-h:64px;
    --container-max:1140px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:600;
    --fw-head:800;
    --ls-head:.01em;
    --ls-kicker:.10em;
    --lh-base:1.65;
    --fs-base:1.02rem;
    --link:color-mix(in srgb, var(--brand) 95%, black 5%);
    --link-hover-opa:.90;
    --focus-ring:color-mix(in srgb, var(--brand) 45%, transparent);
    --hero-scrim-top:rgba(0,0,0,.30);
    --hero-scrim-bottom:rgba(0,0,0,.58);
    --chip-bg:#fed7aa;
    --ghost-bg:rgba(124,45,18,.05);
    --ghost-bg-hover:rgba(124,45,18,.08);
    --section-a-top:#fff7ed;
    --section-a-bottom:#ffedd5;
    --section-b-top:#fff6ec;
    --section-b-bottom:#ffecd4;
    --header-bg:#ffffff;
    --header-fg:#7c2d12;
    --header-border:rgba(0,0,0,.06);
    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78));
    --hero-panel-border:1px solid rgba(0,0,0,.08);
    --hero-panel-radius:32px;
    --hero-panel-shadow:0 18px 42px rgba(124,45,18,.10);
    --panel-fg:#7c2d12;
    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 90%, var(--brand) 10%);
    --faq-open-bg:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --faq-open-border:color-mix(in srgb, var(--brand) 40%, transparent);
    --faq-open-ring:color-mix(in srgb, var(--brand) 35%, transparent);
}

.theme-rainbow{
    --bg:linear-gradient(135deg,#fef3c7 0%, #fce7f3 25%, #ddd6fe 50%, #bbf7d0 75%, #bfdbfe 100%);
    --fg:#1e293b;
    --muted:#475569;
    --brand:#ec4899;
    --brand-2:#8b5cf6;
    --brand-height:56px;
    --brand-background:#fff;
    --brand-background-padding:6px;
    --brand-background-border:2px solid #fbbf24;
    --brand-background-radius:20px;
    --accent:#fef9e7;
    --surface:#ffffff;
    --surface-2:#fef3c7;
    --card:#ffffff;
    --border:rgba(0,0,0,.12);
    --bw-1:2px;
    --bw-2:3px;
    --radius:28px;
    --radius-lg:40px;
    --round:999px;
    --shadow-sm:0 8px 24px rgba(236,72,153,.12);
    --shadow:0 16px 40px rgba(139,92,246,.15);
    --shadow-lg:0 24px 60px rgba(236,72,153,.18);
    --hero-h:68vh;
    --hero-h-md:82vh;
    --head-h:70px;
    --container-max:1100px;
    --ff-base:"Comic Neue","Quicksand","Nunito", ui-sans-serif, system-ui, sans-serif;
    --ff-head:"Fredoka","Comic Neue","Quicksand", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:700;
    --ls-head:.02em;
    --ls-kicker:.12em;
    --lh-base:1.7;
    --fs-base:1.06rem;
    --link:#ec4899;
    --link-hover-opa:.85;
    --focus-ring:rgba(236,72,153,.35);
    --hero-scrim-top:rgba(0,0,0,.25);
    --hero-scrim-bottom:rgba(0,0,0,.50);
    --chip-bg:#fef3c7;
    --ghost-bg:rgba(236,72,153,.08);
    --ghost-bg-hover:rgba(139,92,246,.12);
    --section-a-top:linear-gradient(135deg,#fef3c7 0%, #fce7f3 100%);
    --section-a-bottom:linear-gradient(135deg,#fce7f3 0%, #ddd6fe 100%);
    --section-b-top:linear-gradient(135deg,#ddd6fe 0%, #bbf7d0 100%);
    --section-b-bottom:linear-gradient(135deg,#bbf7d0 0%, #bfdbfe 100%);
    --header-bg:#ffffff;
    --header-fg:#1e293b;
    --header-border:rgba(0,0,0,.08);
    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.85));
    --hero-panel-border:3px solid #fbbf24;
    --hero-panel-radius:40px;
    --hero-panel-shadow:0 20px 50px rgba(236,72,153,.15);
    --panel-fg:#1e293b;
    --card-elev-1:#fef3c7;
    --card-elev-2:#fce7f3;
    --faq-open-bg:#fef3c7;
    --faq-open-border:rgba(236,72,153,.50);
    --faq-open-ring:rgba(139,92,246,.30);
}

.theme-kids{
    --bg:   radial-gradient(520px 360px at 12% 14%,
            rgba(255,153,204,.55) 0%, rgba(255,153,204,.55) 60%, rgba(255,153,204,0) 61%),
            radial-gradient(600px 420px at 88% 20%,
            rgba(120,210,255,.45) 0%, rgba(120,210,255,.45) 60%, rgba(120,210,255,0) 61%),
            radial-gradient(560px 420px at 18% 84%,
            rgba(255,236,153,.48) 0%, rgba(255,236,153,.48) 62%, rgba(255,236,153,0) 63%),
            linear-gradient(180deg,#fffdf8 0%, #f7fbff 100%);
    --fg:#1b1a22;
    --muted:#6d6d7a;
    --bg-attachment: fixed;

    --brand:#ff6ec7;
    --brand-2:#5ac8fa;

    --brand-height:50px;
    --brand-background:transparent;
    --brand-background-padding:2px;
    --brand-background-border:0px solid color-mix(in srgb, var(--brand) 45%, #fff);
    --brand-background-radius:0;

    --accent:#ffffff;
    --surface:#ffffff;
    --surface-2:#fff6fb;
    --card:#ffffff;

    --border:rgba(0,0,0,.10);
    --bw-1:1px;
    --bw-2:2px;
    --radius:22px;
    --radius-lg:32px;
    --round:999px;

    --shadow-sm:0 6px 18px rgba(22,23,24,.08);
    --shadow:0 12px 30px rgba(22,23,24,.10);
    --shadow-lg:0 22px 52px rgba(22,23,24,.14);

    --hero-h:70vh;
    --hero-h-md:84vh;
    --head-h:64px;
    --container-max:1140px;

    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ff-head:"Fredoka","Baloo 2","Poppins","Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:800;
    --ls-head:.015em;
    --ls-kicker:.12em;
    --lh-base:1.65;
    --fs-base:1.02rem;

    --link:color-mix(in srgb, var(--brand) 92%, #000 8%);
    --link-hover-opa:.95;
    --focus-ring:color-mix(in srgb, var(--brand) 45%, transparent);

    --hero-scrim-top:rgba(0,0,0,.24);
    --hero-scrim-bottom:rgba(0,0,0,.52);

    --chip-bg:#fff0f7;
    --ghost-bg:rgba(22,23,24,.05);
    --ghost-bg-hover:rgba(22,23,24,.08);

    --section-a-top:#fffdf8;
    --section-a-bottom:#f7fbff;
    --section-b-top:#fff8fb;
    --section-b-bottom:#f2f8ff;

    --header-bg:#ffffff;
    --header-fg:#1b1a22;
    --header-border:rgba(0,0,0,.08);

    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.80));
    --hero-panel-border:1px solid rgba(0,0,0,.08);
    --hero-panel-radius:30px;
    --hero-panel-shadow:0 18px 44px rgba(22,23,24,.12);
    --panel-fg:#1b1a22;

    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 90%, var(--brand-2) 10%);

    --faq-open-bg:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --faq-open-border:color-mix(in srgb, var(--brand) 40%, transparent);
    --faq-open-ring:color-mix(in srgb, var(--brand-2) 40%, transparent);
}

/* Theme Grayscale - FORCE */
.theme-grayscale{
    --bg:linear-gradient(180deg,#fafafa 0%, #f5f5f5 100%);
    --fg:#0a0a0a;
    --muted:#525252;
    --brand:#1a1a1a;
    --brand-2:#262626;
    --brand-height:48px;
    --brand-background:transparent;
    --brand-background-padding:2px;
    --brand-background-border:0;
    --brand-background-radius:0;
    --accent:#fcfcfc;
    --surface:#f9f9f9;
    --surface-2:#ebebeb;
    --card:#ffffff;
    --border:rgba(0,0,0,.12);
    --bw-1:1px;
    --bw-2:2px;
    --radius:16px;
    --radius-lg:24px;
    --round:999px;
    --shadow-sm:0 6px 18px rgba(0,0,0,.06);
    --shadow:0 12px 30px rgba(0,0,0,.08);
    --shadow-lg:0 18px 46px rgba(0,0,0,.10);
    --hero-h:72vh;
    --hero-h-md:86vh;
    --head-h:64px;
    --container-max:1140px;
    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ff-head:"Inter", ui-sans-serif, system-ui, sans-serif;
    --fw-body:400;
    --fw-strong:600;
    --fw-head:700;
    --ls-head:.005em;
    --ls-kicker:.08em;
    --lh-base:1.65;
    --fs-base:1rem;
    --link:#262626;
    --link-hover-opa:.75;
    --focus-ring:rgba(64,64,64,.25);
    --hero-scrim-top:rgba(0,0,0,.30);
    --hero-scrim-bottom:rgba(0,0,0,.60);
    --chip-bg:#e5e5e5;
    --ghost-bg:rgba(0,0,0,.04);
    --ghost-bg-hover:rgba(0,0,0,.08);
    --section-a-top:#fafafa;
    --section-a-bottom:#f5f5f5;
    --section-b-top:#f9f9f9;
    --section-b-bottom:#f4f4f4;
    --header-bg:#ffffff;
    --header-fg:#171717;
    --header-border:rgba(0,0,0,.08);
    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78));
    --hero-panel-border:1px solid rgba(0,0,0,.10);
    --hero-panel-radius:24px;
    --hero-panel-shadow:0 18px 42px rgba(0,0,0,.10);
    --panel-fg:#171717;
    --card-elev-1:#fafafa;
    --card-elev-2:#f5f5f5;
    --faq-open-bg:#f5f5f5;
    --faq-open-border:rgba(64,64,64,.30);
    --faq-open-ring:rgba(64,64,64,.20);
    --bs-primary:#1a1a1a;
    --bs-primary-rgb:26,26,26;
    --bs-secondary:#525252;
    --bs-secondary-rgb:82,82,82;
    --bs-success:#262626;
    --bs-success-rgb:38,38,38;
    --bs-info:#404040;
    --bs-info-rgb:64,64,64;
    --bs-warning:#333333;
    --bs-warning-rgb:51,51,51;
    --bs-danger:#0a0a0a;
    --bs-danger-rgb:10,10,10;
    --bs-light:#f5f5f5;
    --bs-light-rgb:245,245,245;
    --bs-dark:#171717;
    --bs-dark-rgb:23,23,23;
    --bs-primary-text-emphasis:#000000;
    --bs-secondary-text-emphasis:#1a1a1a;
    --bs-success-text-emphasis:#0f0f0f;
    --bs-info-text-emphasis:#171717;
    --bs-warning-text-emphasis:#141414;
    --bs-danger-text-emphasis:#000000;
    --bs-light-text-emphasis:#525252;
    --bs-dark-text-emphasis:#525252;
    --bs-primary-bg-subtle:#e5e5e5;
    --bs-secondary-bg-subtle:#ebebeb;
    --bs-success-bg-subtle:#e7e7e7;
    --bs-info-bg-subtle:#e9e9e9;
    --bs-warning-bg-subtle:#e7e7e7;
    --bs-danger-bg-subtle:#e0e0e0;
    --bs-light-bg-subtle:#fcfcfc;
    --bs-dark-bg-subtle:#d4d4d4;
    --bs-primary-border-subtle:#cccccc;
    --bs-secondary-border-subtle:#d6d6d6;
    --bs-success-border-subtle:#cfcfcf;
    --bs-info-border-subtle:#d3d3d3;
    --bs-warning-border-subtle:#cfcfcf;
    --bs-danger-border-subtle:#c2c2c2;
    --bs-light-border-subtle:#f5f5f5;
    --bs-dark-border-subtle:#a8a8a8;
    --bs-body-color:#171717;
    --bs-body-color-rgb:23,23,23;
    --bs-body-bg:#ffffff;
    --bs-body-bg-rgb:255,255,255;
    --bs-emphasis-color:#000000;
    --bs-emphasis-color-rgb:0,0,0;
    --bs-secondary-color:rgba(23,23,23,.75);
    --bs-secondary-color-rgb:23,23,23;
    --bs-secondary-bg:#f5f5f5;
    --bs-secondary-bg-rgb:245,245,245;
    --bs-tertiary-color:rgba(23,23,23,.5);
    --bs-tertiary-color-rgb:23,23,23;
    --bs-tertiary-bg:#fafafa;
    --bs-tertiary-bg-rgb:250,250,250;
    --bs-heading-color:#171717;
    --bs-link-color:#0a0a0a;
    --bs-link-color-rgb:10,10,10;
    --bs-link-hover-color:#000000;
    --bs-link-hover-color-rgb:0,0,0;
    --bs-code-color:#525252;
    --bs-highlight-bg:#e5e5e5;
    --bs-border-color:#e5e5e5;
    --bs-border-color-translucent:rgba(0,0,0,.175);
    --bs-form-valid-color:#525252;
    --bs-form-valid-border-color:#525252;
    --bs-form-invalid-color:#262626;
    --bs-form-invalid-border-color:#262626;
}
.theme-grayscale .btn-primary{background-color:#1a1a1a;border-color:#1a1a1a;color:#fff}
.theme-grayscale .btn-primary:hover{background-color:#0a0a0a;border-color:#0a0a0a}
.theme-grayscale .btn-secondary{background-color:#525252;border-color:#525252;color:#fff}
.theme-grayscale .btn-secondary:hover{background-color:#404040;border-color:#404040}
.theme-grayscale .btn-success{background-color:#262626;border-color:#262626;color:#fff}
.theme-grayscale .btn-success:hover{background-color:#1a1a1a;border-color:#1a1a1a}
.theme-grayscale .btn-info{background-color:#404040;border-color:#404040;color:#fff}
.theme-grayscale .btn-info:hover{background-color:#333;border-color:#333}
.theme-grayscale .btn-warning{background-color:#333333;border-color:#333333;color:#fff}
.theme-grayscale .btn-warning:hover{background-color:#262626;border-color:#262626}
.theme-grayscale .btn-danger{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}
.theme-grayscale .btn-danger:hover{background-color:#000;border-color:#000}
.theme-grayscale .btn-light{background-color:#f5f5f5;border-color:#f5f5f5;color:#171717}
.theme-grayscale .btn-light:hover{background-color:#e8e8e8;border-color:#e8e8e8}
.theme-grayscale .btn-dark{background-color:#171717;border-color:#171717;color:#fff}
.theme-grayscale .btn-dark:hover{background-color:#0a0a0a;border-color:#0a0a0a}
.theme-grayscale .btn-brand{background-color:#1a1a1a!important;border-color:#1a1a1a!important;color:#ffffff!important}
.theme-grayscale .btn-brand:hover{background-color:#0a0a0a!important;border-color:#0a0a0a!important;color:#ffffff!important}
.theme-grayscale .btn-ghost{background-color:rgba(0,0,0,.04)!important;border-color:rgba(0,0,0,.12)!important;color:#0a0a0a!important}
.theme-grayscale .btn-ghost:hover{background-color:rgba(0,0,0,.08)!important;border-color:rgba(0,0,0,.16)!important;color:#000000!important}
.theme-grayscale .text-primary{color:#1a1a1a!important}
.theme-grayscale .text-secondary{color:#525252!important}
.theme-grayscale .text-success{color:#262626!important}
.theme-grayscale .text-info{color:#404040!important}
.theme-grayscale .text-warning{color:#333333!important}
.theme-grayscale .text-danger{color:#0a0a0a!important}
.theme-grayscale .text-light{color:#f5f5f5!important}
.theme-grayscale .text-dark{color:#171717!important}
.theme-grayscale .bg-primary{background-color:#1a1a1a!important}
.theme-grayscale .bg-secondary{background-color:#525252!important}
.theme-grayscale .bg-success{background-color:#262626!important}
.theme-grayscale .bg-info{background-color:#404040!important}
.theme-grayscale .bg-warning{background-color:#333333!important}
.theme-grayscale .bg-danger{background-color:#0a0a0a!important}
.theme-grayscale .bg-light{background-color:#f5f5f5!important}
.theme-grayscale .bg-dark{background-color:#171717!important}
.theme-grayscale .border-primary{border-color:#1a1a1a!important}
.theme-grayscale .border-secondary{border-color:#525252!important}
.theme-grayscale .border-success{border-color:#262626!important}
.theme-grayscale .border-info{border-color:#404040!important}
.theme-grayscale .border-warning{border-color:#333333!important}
.theme-grayscale .border-danger{border-color:#0a0a0a!important}
.theme-grayscale .border-light{border-color:#f5f5f5!important}
.theme-grayscale .border-dark{border-color:#171717!important}
.theme-grayscale .alert-primary{background-color:#e5e5e5;border-color:#cccccc;color:#1a1a1a}
.theme-grayscale .alert-secondary{background-color:#ebebeb;border-color:#d6d6d6;color:#2e2e2e}
.theme-grayscale .alert-success{background-color:#e7e7e7;border-color:#cfcfcf;color:#212121}
.theme-grayscale .alert-info{background-color:#e9e9e9;border-color:#d3d3d3;color:#292929}
.theme-grayscale .alert-warning{background-color:#e7e7e7;border-color:#cfcfcf;color:#212121}
.theme-grayscale .alert-danger{background-color:#e0e0e0;border-color:#c2c2c2;color:#0f0f0f}
.theme-grayscale .alert-light{background-color:#fcfcfc;border-color:#f5f5f5;color:#525252}
.theme-grayscale .alert-dark{background-color:#d4d4d4;border-color:#a8a8a8;color:#525252}
.theme-grayscale .badge.bg-primary{background-color:#1a1a1a!important}
.theme-grayscale .badge.bg-secondary{background-color:#525252!important}
.theme-grayscale .badge.bg-success{background-color:#262626!important}
.theme-grayscale .badge.bg-info{background-color:#404040!important}
.theme-grayscale .badge.bg-warning{background-color:#333333!important}
.theme-grayscale .badge.bg-danger{background-color:#0a0a0a!important}
.theme-grayscale .table-primary{background-color:#e5e5e5;border-color:#cccccc;color:#1a1a1a}
.theme-grayscale .table-secondary{background-color:#ebebeb;border-color:#d6d6d6;color:#2e2e2e}
.theme-grayscale .table-success{background-color:#e7e7e7;border-color:#cfcfcf;color:#212121}
.theme-grayscale .table-info{background-color:#e9e9e9;border-color:#d3d3d3;color:#292929}
.theme-grayscale .table-warning{background-color:#e7e7e7;border-color:#cfcfcf;color:#212121}
.theme-grayscale .table-danger{background-color:#e0e0e0;border-color:#c2c2c2;color:#0f0f0f}


/* Theme Tenda */
.theme-tenda {
    --bg: linear-gradient(180deg,#f7fcf8 0%, #eef7f1 100%);
    --fg:#0f2318;
    --muted:#5e7266;

    --brand:#2bc866;
    --brand-2:#12a65d;

    --brand-height:50px;
    --brand-background:#ffffff;
    --brand-background-padding:2px;
    --brand-background-border:0px solid rgba(16,68,40,.10);
    --brand-background-radius:0;

    --accent:#fbfefc;
    --surface:#f4faf6;
    --surface-2:#e9f6ee;
    --card:#ffffff;

    --border:rgba(0,0,0,.10);
    --bw-1:1px;
    --bw-2:2px;
    --radius:18px;
    --radius-lg:28px;
    --round:999px;

    --shadow-sm:0 6px 18px rgba(16,32,27,.06);
    --shadow:0 12px 28px rgba(16,32,27,.08);
    --shadow-lg:0 18px 44px rgba(16,32,27,.10);

    --hero-h:72vh;
    --hero-h-md:86vh;
    --head-h:64px;
    --container-max:1140px;

    --ff-base:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ff-head:"Poppins","Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --fw-body:400;
    --fw-strong:700;
    --fw-head:800;
    --ls-head:.02em;
    --ls-kicker:.10em;
    --lh-base:1.65;
    --fs-base:1.02rem;

    --link:color-mix(in srgb, var(--brand) 92%, black 8%);
    --link-hover-opa:.92;
    --focus-ring:color-mix(in srgb, var(--brand) 40%, transparent);

    --hero-scrim-top:rgba(0,0,0,.22);
    --hero-scrim-bottom:rgba(0,0,0,.55);

    --chip-bg:#ecf7f1;
    --ghost-bg:rgba(16,32,27,.05);
    --ghost-bg-hover:rgba(16,32,27,.08);

    --section-a-top:#f7fcf8;
    --section-a-bottom:#eef7f1;
    --section-b-top:#f6fbf6;
    --section-b-bottom:#eef6f0;

    --header-bg:#ffffff;
    --header-fg:#0f2318;
    --header-border:rgba(0,0,0,.06);

    --hero-panel-bg:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.80));
    --hero-panel-border:1px solid rgba(0,0,0,.08);
    --hero-panel-radius:28px;
    --hero-panel-shadow:0 18px 40px rgba(16,32,27,.10);
    --panel-fg:#0f2318;

    --card-elev-1:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --card-elev-2:color-mix(in srgb, var(--card) 90%, var(--brand) 10%);

    --faq-open-bg:color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    --faq-open-border:color-mix(in srgb, var(--brand) 40%, transparent);
    --faq-open-ring:color-mix(in srgb, var(--brand) 38%, transparent);
}


/* ==========================================================================
   BASE / UTILITÁRIOS
   ========================================================================== */
html,body{
    background:var(--bg);
    background-attachment: var(--bg-attachment);
    color:var(--fg);
    font-family:var(--ff-base), serif;
    font-size:var(--fs-base);
    line-height:var(--lh-base);
    font-weight:var(--fw-body);
}
a{color:var(--link);text-decoration:none}
a:hover{opacity:var(--link-hover-opa)}
strong,b{color:var(--fg);font-weight:var(--fw-strong)}
.badge{border-radius:var(--round)}
.container-narrow{max-width:var(--container-max)}
.shadow-soft{box-shadow:var(--shadow)}
.rounded-2xl{border-radius:var(--radius)}
.rounded-3xl{border-radius:var(--radius-lg)}
.border-soft{border:var(--bw-1) solid var(--border)}
.text-muted{color:var(--muted)!important}

/* ==========================================================================
   HEADER / NAV
   ========================================================================== */
.header{
    height:var(--head-h); position:sticky; top:0; z-index:1030;
    backdrop-filter:saturate(130%) blur(8px);
    background:var(--header-bg);
    color:var(--header-fg);
    border-bottom:var(--bw-1) solid var(--header-border);
}
.header a{color:inherit}
.brandwide{height:var(--brand-height); object-fit:contain}
.brand-background{background-color:var(--brand-background); padding:var(--brand-background-padding); border-radius:var(--brand-background-radius); border:var(--brand-background-border)}
.nav-social a,
.nav-social .icon,
.header .icon{
    display:inline-flex!important; align-items:center;
    width:auto!important; height:auto!important;
    gap:.5rem; padding:.375rem .65rem;
    border:var(--bw-1) solid var(--border);
    border-radius:var(--round);
    background:var(--chip-bg); color:var(--header-fg);
    white-space:nowrap; line-height:1; text-decoration:none;
}
.nav-social a:hover,.nav-social .icon:hover,.header .icon:hover{background:var(--ghost-bg-hover)}
.wa-link{display:inline-flex; align-items:center; gap:.5rem; padding:.375rem .65rem; border:var(--bw-1) solid var(--border); border-radius:var(--round); background:var(--chip-bg); color:var(--header-fg); white-space:nowrap; line-height:1; text-decoration:none}
.wa-link i{color:#25D366}
.wa-number{font-weight:600}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{height:var(--hero-h); position:relative; display:grid; place-items:end; overflow:hidden}
@media (min-width:992px){.hero{height:var(--hero-h-md)}}
.hero-bg{position:absolute; inset:0; background:var(--accent) center/cover no-repeat; transition:opacity .8s ease}
.hero-scrim{position:absolute; inset:0; background:linear-gradient(180deg,var(--hero-scrim-top),var(--hero-scrim-bottom))}
.hero-content{position:relative; z-index:2; width:100%}
.hero-panel{background:var(--hero-panel-bg); border:var(--hero-panel-border); border-radius:var(--hero-panel-radius); box-shadow:var(--hero-panel-shadow); color:var(--panel-fg)}
.kicker{font-size:.85rem; letter-spacing:var(--ls-kicker); text-transform:uppercase; color:var(--brand)}
.hero h1{font-family:var(--ff-head), serif; font-weight:var(--fw-head); letter-spacing:var(--ls-head); font-size:clamp(1.6rem,3.0vw,2.5rem); line-height:1.1}
.hero .bullets{display:flex; gap:.5rem; flex-wrap:wrap}
.hero .bullets .badge{background:var(--ghost-bg); border:var(--bw-1) solid var(--border); color:var(--fg)}

/* ==========================================================================
   SEÇÕES / CARDS / BADGES
   ========================================================================== */
.section{padding:56px 0; background:transparent}
.section.alt{background:var(--surface)}
.section .section-head{margin-bottom:28px}
.section .overtitle{color:var(--brand); letter-spacing:.08em; text-transform:uppercase; font-size:.9rem; font-weight:700; font-family:var(--ff-head)}
.card-lite{background:var(--card); border:var(--bw-1) solid var(--border)}
.card-hover{transition:transform .2s ease, box-shadow .2s ease}
.card-hover:hover{transform:translateY(-2px)}
.badge.text-bg-secondary{background:color-mix(in srgb, var(--fg) 8%, var(--card)); color:var(--fg); border:var(--bw-1) solid var(--border)}
.badge.text-bg-primary-subtle{background:color-mix(in srgb, var(--brand) 24%, transparent); color:var(--fg); border:var(--bw-1) solid color-mix(in srgb, var(--brand) 35%, transparent)}
.text-primary-emphasis{color:var(--fg)!important}

/* ======
   ABOUT
   ====== */
.about{position:relative;}
@media (max-width:767.98px){.about{overflow:hidden}}

.about__grid{display:grid;gap:clamp(16px,3vw,32px);align-items:center;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"media panel"}
@media (max-width:991.98px){.about__grid{grid-template-columns:1fr;grid-template-areas:"media" "panel"}}
.about__media{grid-area:media;position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);width:100%;aspect-ratio:16/10;min-height:320px;background:color-mix(in srgb,var(--surface) 70%, transparent)}
@media (max-width:767.98px){.about__media{aspect-ratio:auto;height:clamp(220px,62vw,360px)}}
.about__panel{grid-area:panel;position:relative;z-index:1;padding:1.5rem}
@media (min-width:768px){.about__panel{padding:2rem}}
.about__chips{display:flex;flex-wrap:wrap;gap:.5rem 1rem}
.about__chip{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border:var(--bw-1) solid var(--border);border-radius:var(--round);background:var(--chip-bg);color:var(--fg);font-weight:600}
.about__stats{margin-top:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border-top:var(--bw-1) solid var(--border);padding-top:14px}
.about__stats strong{display:block;font-family:var(--ff-head), serif;font-weight:800;font-size:clamp(1.3rem,2.2vw,1.6rem);color:var(--fg)}
.about__stats span{display:block;color:var(--muted);font-size:.95rem}

.about__photo{position:absolute;inset:auto;border-radius:calc(var(--radius-lg) - 6px);box-shadow:0 10px 22px rgba(0,0,0,.12);transition:transform .35s ease,box-shadow .35s ease,z-index .0s;transform-origin:center;z-index:1;pointer-events:auto}
.about__photo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.about__photo:is(:hover,:focus-visible,:active){z-index:2147483647;transform:scale(1.035);box-shadow:var(--shadow-lg)}
.about__badge{position:absolute;left:18px;bottom:18px;z-index:40;pointer-events:none;display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .75rem;border-radius:var(--round);background:var(--chip-bg);color:var(--fg);border:var(--bw-1) solid var(--border);font-weight:600}
.about__ring{position:absolute;left:6%;bottom:8%;width:min(22vmin,160px);aspect-ratio:1/1;border-radius:999px;border:var(--bw-2) dashed color-mix(in srgb,var(--brand) 65%, transparent);opacity:.55;z-index:1;animation:aboutSpin 18s linear infinite}
@media (max-width:575.98px){.about__ring{display:none}}
@keyframes aboutSpin{to{transform:rotate(360deg)}}

.about[data-variant="classic"] .about__photo:nth-child(1){position:absolute;inset:0;width:100%;height:100%}
.about[data-variant="classic"] .about__photo:nth-child(n+2),.about[data-variant="classic"] .about__ring{display:none}

.about[data-variant="alt"]{--alt-hero-right:38%;--alt-hero-bottom:28%;--alt-float-w:45%}
.about[data-variant="alt"] .about__stage{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius-lg);box-shadow:var(--shadow)}
.about[data-variant="alt"] .about__photo{margin:0}
.about[data-variant="alt"] .about__photo:nth-child(1){top:0;left:0;right:calc(var(--alt-hero-right) + 2%);bottom:calc(var(--alt-hero-bottom) + 2%);z-index:1}
.about[data-variant="alt"] .about__photo:nth-child(2){right:7%;bottom:5%;width:var(--alt-float-w);aspect-ratio:4/3;z-index:5}
.about[data-variant="alt"] .about__photo:nth-child(n+3){display:none}
.about[data-variant="alt"] .about__since{position:absolute;left:3%;bottom:6%;z-index:6;pointer-events:none;display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .85rem;border-radius:var(--round);background:var(--chip-bg);color:var(--fg);border:var(--bw-1) solid var(--border);font-weight:600}
@media (max-width:991.98px){.about[data-variant="alt"]{--alt-hero-right:28%;--alt-hero-bottom:26%;--alt-float-w:60%}.about[data-variant="alt"] .about__since{left:6%;bottom:6%}}

.about[data-variant="showcase"] .about__media{display:grid;gap:0.5rem;width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:var(--radius-lg);box-shadow:var(--shadow);background:var(--surface,#f8f9fa)}
.about[data-variant="showcase"] .about__photo{position:relative;width:100%;height:100%;overflow:hidden;border-radius:calc(var(--radius-lg) - 4px);transition:all 0.3s ease;z-index:1}
.about[data-variant="showcase"] .about__photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.3s ease}
.about[data-variant="showcase"] .about__photo:is(:hover,:focus-visible){z-index:3;transform:scale(1.02);box-shadow:var(--shadow)}
.about[data-variant="showcase"] .about__photo:hover img{transform:scale(1.05)}
.about[data-variant="showcase"][data-count="1"] .about__media{grid-template-columns:1fr;grid-template-rows:1fr;aspect-ratio:auto;min-height:400px}
.about[data-variant="showcase"][data-count="1"] .about__photo:nth-child(1){grid-column:1/-1;grid-row:1/-1}
.about[data-variant="showcase"][data-count="2"] .about__media{grid-template-columns:1.2fr 1fr;grid-template-rows:1fr;aspect-ratio:16/9}
.about[data-variant="showcase"][data-count="2"] .about__photo:nth-child(1){grid-area:1/1/2/2}
.about[data-variant="showcase"][data-count="2"] .about__photo:nth-child(2){grid-area:1/2/2/3}
.about[data-variant="showcase"][data-count="3"] .about__media{grid-template-columns:1.5fr 1fr;grid-template-rows:1fr 1fr;aspect-ratio:16/10}
.about[data-variant="showcase"][data-count="3"] .about__photo:nth-child(1){grid-column:1/2;grid-row:1/3}
.about[data-variant="showcase"][data-count="3"] .about__photo:nth-child(2){grid-column:2/3;grid-row:1/2}
.about[data-variant="showcase"][data-count="3"] .about__photo:nth-child(3){grid-column:2/3;grid-row:2/3}
.about[data-variant="showcase"][data-count="4"] .about__media{grid-template-columns:1.3fr 1fr;grid-template-rows:1.2fr 1fr;aspect-ratio:16/10}
.about[data-variant="showcase"][data-count="4"] .about__photo:nth-child(1){grid-column:1/2;grid-row:1/2}
.about[data-variant="showcase"][data-count="4"] .about__photo:nth-child(2){grid-column:2/3;grid-row:1/3}
.about[data-variant="showcase"][data-count="4"] .about__photo:nth-child(3){grid-column:1/2;grid-row:2/3}
.about[data-variant="showcase"][data-count="4"] .about__photo:nth-child(4){display:none}
@media (max-width:991.98px){
    .about[data-variant="showcase"] .about__media{aspect-ratio:4/3}
    .about[data-variant="showcase"][data-count="1"] .about__media{aspect-ratio:auto;min-height:300px}
    .about[data-variant="showcase"][data-count="2"] .about__media,.about[data-variant="showcase"][data-count="3"] .about__media{grid-template-columns:1fr;grid-template-rows:auto;aspect-ratio:1/1}
    .about[data-variant="showcase"][data-count="2"] .about__photo:nth-child(1),.about[data-variant="showcase"][data-count="2"] .about__photo:nth-child(2){grid-area:auto !important;min-height:200px}
    .about[data-variant="showcase"][data-count="3"] .about__photo,.about[data-variant="showcase"][data-count="4"] .about__photo{grid-area:auto !important;min-height:180px}
}
@media (max-width:767.98px){
    .about[data-variant="showcase"] .about__media{grid-template-columns:1fr !important;grid-auto-rows:minmax(160px,50vw);aspect-ratio:auto;gap:0.375rem}
    .about[data-variant="showcase"][data-count="1"] .about__media{min-height:250px}
    .about[data-variant="showcase"] .about__photo{grid-area:auto !important}
    .about[data-variant="showcase"][data-count="4"] .about__photo:nth-child(4){display:block}
}
.about[data-variant="collage"] .about__ring{display:none}
.about[data-variant="collage"] .about__photo{top:50%;left:50%;width:58%;transform:translate(-50%,-50%) rotate(0deg);z-index:1}
.about[data-variant="collage"] .about__photo:hover{transform:translate(-50%,-50%) rotate(0deg) scale(1.04);z-index:2147483647}
.about[data-variant="collage"][data-count="1"] .about__photo:nth-child(1){width:78%}
.about[data-variant="collage"][data-count="2"] .about__photo:nth-child(1){width:54%;left:34%;top:44%;transform:translate(-50%,-50%) rotate(-6deg)}
.about[data-variant="collage"][data-count="2"] .about__photo:nth-child(2){width:54%;left:66%;top:56%;transform:translate(-50%,-50%) rotate(6deg);z-index:2}
.about[data-variant="collage"][data-count="3"] .about__photo:nth-child(1){width:48%;left:28%;top:42%;transform:translate(-50%,-50%) rotate(-8deg)}
.about[data-variant="collage"][data-count="3"] .about__photo:nth-child(2){width:48%;left:72%;top:38%;transform:translate(-50%,-50%) rotate(8deg)}
.about[data-variant="collage"][data-count="3"] .about__photo:nth-child(3){width:58%;left:50%;top:68%;transform:translate(-50%,-50%) rotate(0deg);z-index:3}
.about[data-variant="collage"][data-count="4"] .about__photo:nth-child(1){width:46%;left:26%;top:38%;transform:translate(-50%,-50%) rotate(-8deg)}
.about[data-variant="collage"][data-count="4"] .about__photo:nth-child(2){width:46%;left:74%;top:36%;transform:translate(-50%,-50%) rotate(8deg)}
.about[data-variant="collage"][data-count="4"] .about__photo:nth-child(3){width:50%;left:32%;top:66%;transform:translate(-50%,-50%) rotate(-3deg);z-index:3}
.about[data-variant="collage"][data-count="4"] .about__photo:nth-child(4){width:50%;left:68%;top:64%;transform:translate(-50%,-50%) rotate(3deg);z-index:2}
@media (max-width:767.98px){.about[data-variant="collage"] .about__photo{width:68%}}


/* ==========================================================================
   SERVIÇOS
   ========================================================================== */
#servicos.section{background:linear-gradient(180deg,var(--section-a-top) 0%, var(--section-a-bottom) 100%); border-top:var(--bw-1) solid color-mix(in srgb, var(--border) 80%, transparent); border-bottom:var(--bw-1) solid color-mix(in srgb, var(--border) 80%, transparent)}
#servicos .card-lite{background:linear-gradient(180deg, var(--card-elev-1) 0%, var(--card) 100%); border:var(--bw-1) solid color-mix(in srgb, var(--border) 70%, var(--brand) 10%); box-shadow:var(--shadow); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
#servicos .card-lite:hover{transform:translateY(-2px); box-shadow:var(--shadow-lg); border-color:color-mix(in srgb, var(--brand) 24%, var(--border))}
#servicos .service-img{aspect-ratio:16/9; object-fit:cover; border-top-left-radius:var(--radius-lg); border-top-right-radius:var(--radius-lg); clip-path:polygon(0 0,100% 0,100% calc(100% - 28px),0% 100%); display:block; border-bottom:var(--bw-1) solid var(--border)}
@supports not (clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%)){#servicos .service-img{clip-path:none}}
#servicos .overtitle{letter-spacing:.12em}
#servicos h3.h4,#servicos .h4{color:var(--fg); font-weight:600; letter-spacing:var(--ls-head); font-family:var(--ff-head)}
#servicos p.text-muted{color:color-mix(in srgb, var(--muted) 92%, white 10%)}
#servicos .badge.text-bg-secondary{background:color-mix(in srgb, var(--fg) 10%, var(--card)); color:var(--fg); border:var(--bw-1) solid var(--border)}
#servicos .badge.text-bg-primary-subtle{background:color-mix(in srgb, var(--brand) 24%, transparent); color:var(--fg); border:var(--bw-1) solid color-mix(in srgb, var(--brand) 36%, transparent)}

/* ==========================================================================
   GALERIA / MARCAS
   ========================================================================== */
.album-thumb{aspect-ratio:16/10; object-fit:cover}
.brand-logos img{filter:grayscale(1) contrast(.9); opacity:.85; transition:all .25s ease; max-height:48px; object-fit:contain}
.brand-logos img:hover{filter:none; opacity:1}

/* ==========================================================================
   FAQ + INPUTS
   ========================================================================== */
.faq-item{background:var(--card); border:var(--bw-1) solid var(--border); border-radius:var(--radius-lg); overflow:hidden}
.faq-item .question{appearance:none; -webkit-appearance:none; -moz-appearance:none; background:transparent; color:var(--fg); border:0; width:100%; padding:14px 16px; border-bottom:var(--bw-1) solid var(--border); cursor:pointer; border-radius:0}
.faq-item .question:hover{background:color-mix(in srgb, var(--surface-2) 55%, transparent)}
.faq-item .question:focus-visible{outline:0; box-shadow:0 0 0 .2rem var(--faq-open-ring)}
.faq-item .answer{background:var(--card); color:var(--muted); padding:14px 16px}
.faq-item .question i{transition:transform .18s ease, opacity .18s ease}
.faq-item:has(.answer:not(.d-none)){background:var(--faq-open-bg); border-color:var(--faq-open-border); box-shadow:var(--shadow-sm)}
.faq-item:has(.answer:not(.d-none)) .question i{transform:rotate(180deg); opacity:.9}
.faq-search{background:var(--surface-2); border:var(--bw-1) solid var(--border)}
.faq-search .input-group-text{background:transparent; border:0; color:var(--muted)}
.faq-search .form-control{background:transparent; border:0; color:var(--fg)}
.form-control,.form-select{background:var(--surface-2); color:var(--fg); border:var(--bw-1) solid var(--border)}
.form-control::placeholder{color:color-mix(in srgb, var(--muted) 75%, transparent)}
.form-control:focus,.form-select:focus{background:var(--surface-2); color:var(--fg); border-color:color-mix(in srgb, var(--brand) 60%, transparent); box-shadow:0 0 0 .25rem var(--focus-ring)}

/* ==========================================================================
   DEPOIMENTOS
   ========================================================================== */
.testi .avatar{width:48px; height:48px; border-radius:var(--round); object-fit:cover}
#depoimentos .card-body > p:first-child{color:var(--fg)!important; opacity:1!important; font-weight:600; font-size:1.05rem; line-height:1.5; letter-spacing:.01em}
@media (min-width:768px){#depoimentos .card-body > p:first-child{font-size:1.125rem}}
#depoimentos .card.card-lite{background:color-mix(in srgb, var(--card) 92%, white 8%)}

/* ==========================================================================
   PRODUTOS
   ========================================================================== */
#produtos.section{background:radial-gradient(1400px 520px at 50% -260px, color-mix(in srgb, var(--brand) 10%, transparent) 0%, transparent 65%), linear-gradient(180deg, var(--section-b-top) 0%, var(--section-b-bottom) 100%); border-top:var(--bw-1) solid color-mix(in srgb, var(--border) 80%, transparent); border-bottom:var(--bw-1) solid color-mix(in srgb, var(--border) 80%, transparent); box-shadow:inset 0 1px 0 rgba(255,255,255,.02), inset 0 -1px 0 rgba(255,255,255,.02)}
.product.card{background:linear-gradient(180deg, var(--card-elev-1) 0%, var(--card) 100%); border:var(--bw-1) solid color-mix(in srgb, var(--border) 70%, var(--brand) 10%); box-shadow:var(--shadow); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
#produtos .product.card:hover{transform:translateY(-2px); border-color:color-mix(in srgb, var(--brand) 28%, var(--border)); box-shadow:var(--shadow-lg)}
.product img{display:block; position:relative; z-index:1; border-bottom:var(--bw-1) solid var(--border); transition:transform .4s ease}
.product.card:hover img{transform:scale(1.015)}
.product .card-body{padding:1rem 1.25rem 1.25rem}
.product .fs-5{color:var(--fg); letter-spacing:.01em; font-family:var(--ff-head); font-weight:700}
.product .text-muted{color:color-mix(in srgb, var(--muted) 92%, white 8%)}
.product .text-decoration-line-through{color:color-mix(in srgb, var(--muted) 80%, black 10%); opacity:.85}
.product .card-body .fw-bold{color:var(--brand); font-weight:700}
.product .badge.text-bg-secondary{background:color-mix(in srgb, var(--fg) 10%, var(--card)); color:var(--fg); border:var(--bw-1) solid var(--border)}
.product .badge.text-bg-primary-subtle{background:color-mix(in srgb, var(--brand) 26%, transparent); color:var(--fg); border:var(--bw-1) solid color-mix(in srgb, var(--brand) 38%, transparent)}
.product .btn-brand.btn-sm{box-shadow:0 4px 14px rgba(0,0,0,.25)}
.product .ribbon{position:absolute; top:14px; left:-8px; transform:rotate(-6deg); z-index:3; pointer-events:none; background:var(--brand-2); color:#fff; padding:.28rem .7rem; border-radius:var(--round); border:var(--bw-1) solid rgba(255,255,255,.28); box-shadow:0 6px 14px rgba(0,0,0,.25); letter-spacing:.01em}

.gallery-modal .modal-content.card-lite{background:var(--card);color:var(--fg)}
.gallery-modal .modal-header .btn{color:var(--fg)}
.gallery-modal .modal-body{display:flex;flex-direction:column}
.gallery-modal .gm-stage{position:relative;overflow:hidden;height:clamp(340px,62svh,78vh);background:color-mix(in srgb,var(--surface) 94%,#fff 6%)}
@media (min-width:992px){.gallery-modal .gm-stage{height:clamp(420px,68vh,82vh)}}
.gallery-modal #gmImage{background:var(--surface)}
.gallery-modal .gm-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:.75rem 1rem;background:var(--card);border-top:var(--bw-1) solid var(--border)}
.gallery-modal .gm-stage img#gmImage,
.gallery-modal .gm-stage img.gm-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:translateX(0)}
.gallery-modal .gm-stage img.gm-overlay{pointer-events:none}
.gallery-modal .gm-stage,
.gallery-modal .gm-stage *{-webkit-tap-highlight-color:transparent}
.gallery-modal .gm-stage{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:pan-y pinch-zoom}
.gallery-modal .gm-stage img{pointer-events:none;-webkit-user-drag:none;user-drag:none;-webkit-user-select:none;user-select:none}

.gm-stage{position:relative;overflow:hidden;touch-action:pan-y;user-select:none}
#gmImage{display:block;width:100%;transform:translateX(0);transition:transform .28s ease,opacity .28s ease}
.gm-overlay{position:absolute;inset:0;width:100%;height:auto;transform:translateX(100%);opacity:1;transition:transform .28s ease,opacity .28s ease;pointer-events:none}

/* setas */
.gallery-modal .gm-prev,
.gallery-modal .gm-next{
    position:absolute;top:50%;transform:translateY(-50%);z-index:2;
    display:grid;place-items:center;
    width:44px;height:44px;border-radius:999px;
    background:color-mix(in srgb,var(--chip-bg) 80%, var(--card) 20%);
    border:var(--bw-1) solid var(--border);
    box-shadow:var(--shadow-sm);
    color:var(--fg);
}
.gallery-modal .gm-prev i,
.gallery-modal .gm-next i{color:inherit}
.gallery-modal .gm-prev{left:12px}
.gallery-modal .gm-next{right:12px}
.gallery-modal .gm-prev:hover,
.gallery-modal .gm-next:hover{
    background:color-mix(in srgb,var(--brand) 22%, var(--chip-bg) 78%);
    box-shadow:var(--shadow);
}

@media (min-width:576px){
    .gallery-modal .modal-dialog{max-width:min(1000px,92vw)}
    .gallery-modal #gmImage{width:100%;height:auto;max-height:78vh;object-fit:contain}
}
@media (max-width:575.98px){
    .gallery-modal .modal-dialog{width:100vw;max-width:100vw;height:100dvh;margin:0}
    .gallery-modal .modal-content{height:100%;border-radius:0;display:flex;flex-direction:column}
    .gallery-modal .modal-header{position:sticky;top:0;z-index:3;border:0;background:linear-gradient(180deg,rgba(0,0,0,.65),rgba(0,0,0,.15));padding-top:calc(.75rem + env(safe-area-inset-top))}
    .gallery-modal .modal-body{display:flex;flex-direction:column;gap:0;height:100%;padding:0}
    .gallery-modal .gm-stage{flex:1 1 auto;min-height:0;display:grid;place-items:center}
    .gallery-modal #gmImage{width:100%;height:100%;max-height:none;object-fit:contain}
    .gallery-modal .gm-bar{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
    .gallery-modal .gm-prev,.gallery-modal .gm-next{width:48px;height:48px}
}
.gallery-modal .modal-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.5rem;
}
.gallery-modal .modal-header .modal-title{
    flex:1 1 auto;
    margin:0;
}
.gallery-modal .modal-header > .btn{
    margin-left:auto;
}

/* ==========================================================================
   CONTACT / LOCAL
   ========================================================================== */
.contact-section{
    background:linear-gradient(180deg,var(--section-b-top) 0%, var(--section-b-bottom) 100%);
    border-top:var(--bw-1) solid color-mix(in srgb, var(--border) 80%, transparent);
    border-bottom:var(--bw-1) solid color-mix(in srgb, var(--border) 80%, transparent);
}
.contact-section .contact-card .map-embed{position:relative;width:100%;aspect-ratio:16/10;background:var(--surface-2)}
.contact-section .contact-card .map-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.contact-section .contact-card .map-meta{padding:12px 16px;background:var(--card);border-top:var(--bw-1) solid var(--border)}

.contact-section .list-clean{list-style:none;padding:0;margin:0}
.contact-section .list-clean li{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-bottom:var(--bw-1) solid color-mix(in srgb, var(--border) 70%, transparent)}
.contact-section .list-clean li:last-child{border-bottom:0}

.contact-chip{display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .65rem;border:var(--bw-1) solid var(--border);border-radius:var(--round);background:var(--chip-bg);color:var(--fg);text-decoration:none;line-height:1}
.contact-chip i{opacity:.9}
.contact-chip:hover{background:var(--ghost-bg-hover)}

.contact-section .map-meta .small strong{color:var(--fg)}
.contact-section .map-meta .small span{color:var(--muted)}

.contact-section .list-clean li span:first-child{color:var(--fg);font-weight:600}
.contact-section .list-clean li span:last-child{color:var(--muted)}

.contact-section .badge.text-bg-secondary{background:var(--chip-bg);color:var(--fg);border:var(--bw-1) solid var(--border)}


/* ==========================================================================
   FOOTER / BOTÕES / LINKS AUX
   ========================================================================== */
.footer{padding:22px 0; border-top:var(--bw-1) solid var(--header-border); background:var(--accent)}
.btn-brand{--bs-btn-bg:var(--brand); --bs-btn-border-color:var(--brand); --bs-btn-hover-bg:color-mix(in srgb, var(--brand) 85%, black 15%); --bs-btn-hover-border-color:color-mix(in srgb, var(--brand) 85%, black 15%); --bs-btn-color:#0b1114; color:#0b1114}
.btn-ghost{background:var(--ghost-bg); border:var(--bw-1) solid var(--border); color:var(--fg)}
.btn-ghost:hover{background:var(--ghost-bg-hover)}
.hr-soft{border-color:var(--border)}
.link-light{color:var(--fg)}
.link-light:hover{opacity:.85}