/* ================================================================
   CoreBIM Landing — Brand: Blue #0080C0 + Red #BE1E2D
   Dual theme: dark (original template) + light
   ================================================================ */

/* --- Theme Variables --- */
[data-theme="dark"] {
    --cb-land-bg: #080B14;
    --cb-land-sf: #0D1120;
    --cb-land-bd: #1C2235;
    --cb-land-bdh: #252B40;
    --cb-land-t1: #FFFFFF;
    --cb-land-t2: #B4BDCC;
    --cb-land-t3: #6B7590;
    --cb-land-t4: #3E4560;
    --cb-land-footer: #060810;
    --cb-land-card-bg: rgba(255,255,255,.06);
    --cb-land-card-hover: rgba(255,255,255,.10);
    --cb-land-overlay: rgba(8,11,20,.85);
    --cb-land-grid-opacity: .08;
}
[data-theme="light"] {
    --cb-land-bg: #F5F7FA;
    --cb-land-sf: #FFFFFF;
    --cb-land-bd: #E2E8F0;
    --cb-land-bdh: #CBD5E1;
    --cb-land-t1: #1A202C;
    --cb-land-t2: #4A5568;
    --cb-land-t3: #718096;
    --cb-land-t4: #A0AEC0;
    --cb-land-footer: #EDF2F7;
    --cb-land-card-bg: rgba(0,0,0,.02);
    --cb-land-card-hover: rgba(0,0,0,.04);
    --cb-land-overlay: rgba(255,255,255,.80);
    --cb-land-grid-opacity: .04;
}

/* Brand colors — same in both modes */
:root {
    --blue: #0080C0;
    --blue-lt: #00A3F5;
    --red: #BE1E2D;
    --red-lt: #E14B59;
    --purple: #8B5CF6;
    --cyan: #06B6D4;
    --green: #10B981;
    --yellow: #EAB308;
    --pink: #EC4899;
    --grad-blue: linear-gradient(135deg, #0080C0, #00A3F5);
    --grad-red: linear-gradient(135deg, #BE1E2D, #E14B59);
    --grad-brand: linear-gradient(135deg, #0080C0, #BE1E2D);
    --f-h: 'Be Vietnam Pro', -apple-system, 'SF Pro Display', BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --f-b: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* --- Base --- */
html { scroll-padding-top: 80px; }
@media (hover: hover) { html { scroll-behavior: smooth; } }
body { background: var(--cb-land-bg) !important; font-family: var(--f-b); overflow-x: hidden; margin: 0; }
.cb-app { background: var(--cb-land-bg); min-height: 100vh; }
.cb-land-text { color: var(--cb-land-t1) !important; }
.cb-app *:focus { outline: none; }
.cb-app section:target { outline: none; }
.cb-hero__h1, .cb-hero__h1 * { outline: none !important; border: none !important; }
.cb-muted { color: var(--cb-land-t2) !important; }
.cb-muted-light { color: var(--cb-land-t2) !important; opacity: .75; }

/* --- Animations --- */
@keyframes shimmer { to { background-position: 200% center; } }
@keyframes pulse { 50% { opacity: .4; } }
@keyframes fadeUp { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }
.cb-fade-up { animation: fadeUp .8s cubic-bezier(.22,1,.36,1) both; animation-delay: var(--d, 0s); }
.cb-shimmer { animation: shimmer 3s linear infinite; }
.cb-reveal { opacity:0; transform:translateY(36px); transition:opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1); transition-delay:var(--rd,0s); }
.cb-reveal.is-visible { opacity:1; transform:translateY(0); }

/* --- Logo --- */
.cb-logo-sub { font-size:11px;color:var(--cb-land-t3);margin-left:6px;font-weight:500;letter-spacing:1px; }

/* --- Navbar --- */
.cb-navbar { box-shadow:none !important;border:none !important;z-index:1100 !important;left:0 !important;right:0 !important;top:0 !important;margin:0 !important;padding:0 !important;width:100% !important; }
.cb-navbar:not(.cb-navbar--scrolled) { background:transparent !important; }
.cb-navbar.cb-navbar--scrolled { background:var(--cb-land-overlay) !important;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);box-shadow:none !important;border-bottom:1px solid var(--cb-land-bd) !important; }
.cb-navbar .mud-appbar { border:none !important;box-shadow:none !important;margin:0 !important;padding:0 !important; }
.cb-navbar .mud-toolbar { min-height:0 !important;padding:0 !important; }
.cb-navbar .mud-appbar { color:var(--cb-land-t1) !important; }
.cb-navbar .mud-icon-button { color:var(--cb-land-t1) !important; }
/* Landing appbar overrides Web.UI defaults */
.cb-navbar.mud-appbar { height:auto !important;min-height:0 !important; }
.cb-navbar .mud-container { padding-top:12px !important;padding-bottom:12px !important; }
.cb-nav-link { color:var(--cb-land-t2) !important;font:500 14px/1 var(--f-b) !important;transition:color .2s !important; }
.cb-nav-link:hover { color:var(--blue) !important; }
.cb-nav-link--active { color:var(--blue) !important; }
/* Mobile menu panel (custom div + MudOverlay — avoids MudDrawer position bugs) */
.cb-mobile-menu { position:fixed;top:0;right:0;width:280px;max-width:85vw;height:100vh;height:100dvh;background:var(--cb-land-sf);z-index:1300;transform:translateX(100%);transition:transform .3s cubic-bezier(.22,1,.36,1);box-shadow:-4px 0 24px rgba(0,0,0,.15);overflow-y:auto;display:flex;flex-direction:column; }
.cb-mobile-menu--open { transform:translateX(0); }
.cb-drawer-header { display:flex;justify-content:space-between;align-items:center;padding:10px 12px 6px 16px; }
.cb-mobile-menu .mud-navmenu { padding:0 16px 4px !important; }
.cb-mobile-menu .mud-nav-link { color:var(--cb-land-t1) !important;border-radius:6px;min-height:0 !important;padding:10px 16px !important;margin:2px 0 !important; }
.cb-mobile-menu .mud-nav-link .mud-nav-link-text { font:500 14px/1.2 'Be Vietnam Pro',sans-serif !important; }
.cb-mobile-menu .mud-nav-link:hover { color:var(--blue) !important; background:var(--cb-land-card-hover) !important; }
.cb-mobile-menu .cb-drawer-cta { padding:8px 16px 12px !important; }

/* --- Buttons --- */
.cb-btn-cta { background:var(--grad-blue) !important;color:#fff !important;box-shadow:0 4px 20px rgba(0,128,192,.25) !important;border-radius:50px !important;font-weight:700 !important;text-transform:none !important;transition:transform .25s,box-shadow .25s !important; }
.cb-btn-cta:hover { transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,128,192,.35) !important; }
.cb-user-wrap { position:relative;display:flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border-radius:50px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s,border-color .2s;border:1.5px solid var(--cb-land-bdh); }
.cb-user-wrap:hover { background:var(--cb-land-card-bg);border-color:var(--cb-land-bdh); }
.cb-mobile-avatar { display:flex;align-items:center; }
.cb-user-name { font:600 13px/1 var(--f-b);color:var(--cb-land-t1);white-space:nowrap; }
.cb-user-menu .mud-menu-activator { cursor:pointer; }
.cb-user-menu .mud-popover { background:var(--cb-land-sf) !important;border:1px solid var(--cb-land-bd) !important;border-radius:10px !important;box-shadow:0 4px 16px rgba(0,0,0,.08) !important;min-width:200px;padding:4px 0 !important; }
.cb-user-menu .mud-menu-item { font:500 13px/1.4 var(--f-b) !important;color:var(--cb-land-t2) !important;padding:8px 14px !important;transition:background .15s,color .15s !important; }
.cb-user-menu .mud-menu-item:hover { background:var(--cb-land-card-bg) !important;color:var(--cb-land-t1) !important; }
.cb-user-menu .mud-menu-item .mud-icon-root { font-size:18px !important;color:var(--cb-land-t3) !important; }
.cb-user-menu .mud-menu-item:hover .mud-icon-root { color:var(--cb-land-t2) !important; }
.cb-user-menu .mud-divider { margin:4px 10px !important;border-color:var(--cb-land-bd) !important; }
.cb-sec--account { padding-top:120px;padding-bottom:80px; }
.cb-account-card { background:var(--cb-land-card-bg);border:1px solid var(--cb-land-bd);border-radius:12px; }
.cb-plan-active { border-color:var(--blue) !important;background:color-mix(in srgb,var(--blue) 4%,var(--cb-land-card-bg)) !important; }
.cb-plan-card { transition:border-color .2s,transform .2s; }
.cb-plan-card:hover { border-color:var(--cb-land-bdh);transform:translateY(-2px); }
.cb-plan-icon { width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--blue) 10%,transparent); }

/* Account tabs — flat underline style */
.cb-account-tabs { background:transparent !important; }
.cb-account-tabs .mud-tabs-toolbar { background:transparent !important;border-bottom:1px solid var(--cb-land-bd) !important;border-radius:0 !important;padding:0 !important; }
.cb-account-tabs .mud-tab { color:var(--cb-land-t3) !important;text-transform:none !important;font-weight:600 !important;font-family:var(--f-b) !important;padding-bottom:12px !important; }
.cb-account-tabs .mud-tab.mud-tab-active { color:var(--cb-land-t1) !important; }
.cb-account-tabs .mud-tab-slider { background:var(--blue) !important;height:2px !important; }
.cb-account-tabs .mud-tabs-panels { padding-top:24px !important; }

/* Account 2-column grid */
.cb-account-grid { display:grid;grid-template-columns:1fr;gap:24px; }
@media(min-width:768px) { .cb-account-grid { grid-template-columns:7fr 5fr; } }
.cb-plan-grid { display:grid;grid-template-columns:1fr;gap:16px; }
@media(min-width:600px) { .cb-plan-grid { grid-template-columns:1fr 1fr; } }

/* Profile fields — table layout */
.cb-profile-fields { display:flex;flex-direction:column;gap:0; }
.cb-field-row { display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid rgba(128,128,128,.15); }
.cb-field-row:last-child { border-bottom:none; }

/* Password form */
.cb-pw-form { background:color-mix(in srgb,var(--cb-land-bd) 20%,var(--cb-land-card-bg));border-radius:10px;border:1px solid var(--cb-land-bd); }

/* Avatar */
.cb-avatar-wrapper { position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer; }
.cb-avatar-wrapper .mud-avatar-large { width:80px !important;height:80px !important;font-size:28px !important; }
.cb-avatar-upload-btn { position:absolute !important;bottom:0;right:0;background:var(--blue) !important;color:#fff !important;width:28px !important;height:28px !important;min-width:28px !important;border-radius:50% !important;border:2px solid var(--cb-land-bg) !important;padding:0 !important;opacity:0;transition:opacity .2s ease; }
.cb-avatar-delete-btn { position:absolute !important;top:0;right:0;background:var(--red) !important;color:#fff !important;width:22px !important;height:22px !important;min-width:22px !important;border-radius:50% !important;border:2px solid var(--cb-land-bg) !important;padding:0 !important;opacity:0;transition:opacity .2s ease; }
.cb-avatar-wrapper:hover .cb-avatar-upload-btn,
.cb-avatar-wrapper:hover .cb-avatar-delete-btn { opacity:.7; }
.cb-avatar-wrapper .cb-avatar-upload-btn:hover,
.cb-avatar-wrapper .cb-avatar-delete-btn:hover { opacity:1; }
.cb-avatar-upload-btn .mud-icon-root,.cb-avatar-delete-btn .mud-icon-root { font-size:14px !important; }

/* Crop dialog */
.cb-crop-dialog { background:var(--cb-land-sf);border-radius:16px;border:1px solid var(--cb-land-bd);max-width:400px;width:90vw;margin:auto; }
.cb-crop-container { max-height:300px;overflow:hidden;border-radius:8px; }
.cb-crop-container img { display:block;max-width:100%; }
.cb-btn-outline { background:var(--cb-land-card-bg) !important;color:var(--cb-land-t1) !important;border:1px solid var(--cb-land-bd) !important;border-radius:14px !important;text-transform:none !important;transition:all .3s !important; }
.cb-btn-outline:hover { background:var(--cb-land-card-hover) !important;border-color:var(--cb-land-bdh) !important; }
.cb-btn-lg { padding:14px 34px !important;font-size:15px !important; }

/* --- Pills --- */
.cb-pill { display:inline-flex;align-items:center;gap:8px;padding:8px 20px;border-radius:50px;font:700 15px/1 var(--f-b);margin-bottom:20px; }
.cb-pill--blue   { background:rgba(0,128,192,.12);border:1px solid rgba(0,128,192,.3);color:var(--blue); }
.cb-pill--red    { background:rgba(190,30,45,.12);border:1px solid rgba(190,30,45,.3);color:var(--red); }
.cb-pill--purple { background:rgba(139,92,246,.12);border:1px solid rgba(139,92,246,.3);color:var(--purple); }
.cb-pill--green  { background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.3);color:var(--green); }
.cb-pill--yellow { background:rgba(234,179,8,.12);border:1px solid rgba(234,179,8,.3);color:var(--yellow); }
.cb-pill--pink   { background:rgba(236,72,153,.12);border:1px solid rgba(236,72,153,.3);color:var(--pink); }
.cb-pill--cyan   { background:rgba(6,182,212,.12);border:1px solid rgba(6,182,212,.3);color:var(--cyan); }
.cb-pill__dot { width:7px;height:7px;border-radius:50%;background:var(--blue);animation:pulse 2s infinite; }
.cb-tag { font:600 11px/1 var(--f-b);padding:4px 10px;border-radius:6px;background:var(--cb-land-card-bg);border:1px solid var(--cb-land-bd);color:var(--cb-land-t3); }
.cb-check { width:22px;height:22px;min-width:22px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--accent,var(--blue));background:color-mix(in srgb,var(--accent,var(--blue)) 10%,transparent);margin-top:1px; }

/* --- Sections --- */
.cb-sec { padding:110px 32px;background:var(--cb-land-bg);position:relative; }
.cb-sec--glow-b { background:radial-gradient(ellipse 50% 40% at 50% 100%,rgba(0,128,192,.04),transparent),var(--cb-land-bg); }
.cb-sec--glow-t { background:radial-gradient(ellipse 50% 50% at 50% 0%,rgba(0,128,192,.04),transparent),var(--cb-land-bg); }
.cb-sec__line { position:absolute;top:0;left:50%;transform:translateX(-50%);width:70%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,128,192,.2),transparent); }
.cb-sec__head { text-align:center;margin-bottom:64px;display:flex;flex-direction:column;align-items:center; }

/* --- Hero --- */
.cb-hero { min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;background:radial-gradient(ellipse 80% 50% at 50% -10%,rgba(0,128,192,.1),transparent),radial-gradient(ellipse 50% 40% at 85% 60%,rgba(190,30,45,.06),transparent),var(--cb-land-bg); }
.cb-hero__grid { position:absolute;inset:0;opacity:var(--cb-land-grid-opacity);background-image:linear-gradient(var(--cb-land-t3) 1px,transparent 1px),linear-gradient(90deg,var(--cb-land-t3) 1px,transparent 1px);background-size:64px 64px; }

.cb-hero__inner { max-width:1280px;margin:0 auto;padding:150px 32px 100px;text-align:center;position:relative;z-index:2; }
.cb-hero__h1 { font:900 clamp(36px,5.5vw,72px)/1.08 var(--f-h);color:var(--cb-land-t1);letter-spacing:-2px;margin:0 auto 24px;max-width:920px; }
.cb-grad-text { background:linear-gradient(135deg,var(--blue),var(--red),var(--blue));background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.cb-hero__sub { font:400 clamp(15px,1.8vw,19px)/1.75 var(--f-b);color:var(--cb-land-t2);max-width:660px;margin:0 auto 44px; }
.cb-hero__versions { margin-top:44px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap; }
.cb-hero__ver-label { font-size:12px;color:var(--cb-land-t3);margin-right:4px; }
.cb-stat-num { font:900 40px/1 var(--f-h);background:var(--grad-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }

/* --- Feature Cards --- */
.cb-card { padding:32px !important;border-radius:18px !important;background:var(--cb-land-card-bg) !important;border:1px solid var(--cb-land-bd) !important;transition:all .4s cubic-bezier(.22,1,.36,1) !important;cursor:default;height:100%; }
.cb-card:hover { background:var(--cb-land-card-hover) !important;border-color:var(--cb-land-bdh) !important;transform:translateY(-3px); }
.cb-card__ico { width:52px;height:52px;border-radius:13px;background:color-mix(in srgb,var(--accent) 10%,transparent);display:flex;align-items:center;justify-content:center;margin-bottom:18px; }

/* --- Products --- */
.cb-prod-tabs { display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:40px; }
.cb-prod-tab { border-radius:12px !important;font-weight:600 !important;padding:10px 24px !important;text-transform:none !important;white-space:nowrap !important;min-width:0 !important; }
.cb-prod-tab--on { color:#fff !important; }
.cb-prod-video { border-radius:18px;overflow:hidden;border:2px solid var(--cb-land-bd);background:#000;box-shadow:0 8px 32px color-mix(in srgb,var(--clr) 18%,transparent);width:100%;position:relative;padding-top:56.25%; }
.cb-prod-video iframe { position:absolute;top:0;left:0;width:100%;height:100%;display:block;border:none; }

/* --- Pricing --- */
.cb-toggle { display:inline-flex;padding:5px 6px;border-radius:50px;background:var(--cb-land-card-bg);border:1px solid var(--cb-land-bd); }
.cb-toggle__btn { padding:8px 20px;border-radius:50px;border:none;cursor:pointer;font:600 13px/1 var(--f-b);background:transparent;color:var(--cb-land-t2);transition:all .3s; }
.cb-toggle__btn--on { background:var(--cb-land-card-hover);color:var(--cb-land-t1); }
.cb-toggle__btn--blue { background:rgba(0,128,192,.15) !important;color:var(--blue) !important; }
.cb-price { border-radius:22px;height:100%; }
.cb-price--pop { padding:2.5px;background:var(--grad-blue); }
.cb-price__in { border-radius:20px;padding:36px 24px;background:var(--cb-land-sf);border:1px solid var(--cb-land-bd);height:100%;display:flex;flex-direction:column; }
.cb-price--pop .cb-price__in { border:none; }
.cb-price__badge { display:inline-block;padding:3px 10px;border-radius:50px;font:700 11px/1.5 var(--f-b);margin-bottom:14px;align-self:flex-start;background:rgba(139,92,246,.1);color:var(--purple); }
.cb-price__badge--pop { background:rgba(0,128,192,.12) !important;color:var(--blue) !important; }
.cb-price__amount { display:flex;align-items:baseline;gap:3px;margin-bottom:28px;flex-wrap:wrap; }
.cb-price__num { font:900 clamp(24px,4vw,36px)/1 var(--f-h);color:var(--cb-land-t1); }
.cb-price__per { font-size:14px;color:var(--cb-land-t3); }
.cb-price__chk { width:18px;height:18px;min-width:18px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);margin-top:2px; }

/* --- Testimonials --- */
.cb-testi { padding:28px !important;border-radius:18px !important;background:var(--cb-land-card-bg) !important;border:1px solid var(--cb-land-bd) !important;height:100%;display:flex;flex-direction:column; }
.cb-testi__stars { color:var(--yellow);font-size:15px;letter-spacing:3px;margin-bottom:14px; }
.cb-testi__txt { color:var(--cb-land-t2) !important;line-height:1.75 !important;font-style:italic;flex:1;margin-bottom:22px !important; }
.cb-testi__author { display:flex;align-items:center;gap:11px; }
.cb-testi__av { background:var(--grad-brand) !important;color:#fff !important;font:700 13px/1 var(--f-h) !important;border-radius:11px !important; }

/* --- FAQ --- */
.cb-faq { display:flex;flex-direction:column;gap:10px; }
.cb-faq__item { border-radius:14px !important;background:var(--cb-land-card-bg) !important;border:1px solid var(--cb-land-bd) !important;box-shadow:none !important;transition:all .3s !important; }
.cb-faq__item .mud-expand-panel-header { padding:18px 22px !important;font:600 15px/1.4 var(--f-b) !important;color:var(--cb-land-t1) !important; }
.cb-faq__item .mud-expand-panel-content { padding:0 22px 18px !important; }
.cb-faq__item.mud-panel-expanded { background:var(--cb-land-card-hover) !important;border-color:rgba(0,128,192,.15) !important; }
.cb-faq__item .mud-expand-panel-header .mud-icon-root { color:var(--cb-land-t3) !important; }
.cb-faq__item.mud-panel-expanded .mud-expand-panel-header .mud-icon-root { color:var(--blue) !important; }

/* --- Contact --- */
.cb-contact { padding:24px !important;border-radius:14px !important;background:var(--cb-land-card-bg) !important;border:1px solid var(--cb-land-bd) !important;text-align:center; }
.cb-social { border-radius:50px !important;font:600 12px/1 var(--f-b) !important;text-transform:none !important;border-color:color-mix(in srgb,var(--sc) 20%,transparent) !important;color:var(--sc) !important;background:color-mix(in srgb,var(--sc) 8%,transparent) !important; }
.cb-social:hover { background:color-mix(in srgb,var(--sc) 15%,transparent) !important; }

/* --- Footer --- */
.cb-footer { padding:16px 32px 12px;background:var(--cb-land-footer);border-top:1px solid var(--cb-land-bd); }
.cb-footer__top { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px; }
.cb-footer__link { font:400 12px/1 var(--f-b) !important;color:var(--cb-land-t3) !important; }
.cb-footer__link:hover { color:var(--cb-land-t2) !important; }

/* --- Legal pages (Terms, Privacy) --- */
.cb-legal-layout { display:grid;grid-template-columns:1fr 220px;gap:48px;align-items:start; }
.cb-legal-content { min-width:0; }
.cb-legal { margin-bottom:40px; }
.cb-legal__anchor { scroll-margin-top:100px; }
.cb-legal__list { padding-left:20px;color:var(--cb-land-t2);line-height:1.8;list-style:disc; }
.cb-legal__list li { margin-bottom:4px; }
.cb-legal-toc { position:sticky;top:100px;padding:16px 0;border-left:1px solid var(--cb-land-bd);display:flex;flex-direction:column;gap:2px; }
.cb-legal-toc__title { padding:0 0 8px 16px;color:var(--cb-land-t3) !important;font-weight:600 !important;letter-spacing:1px; }
.cb-legal-toc__link { padding:6px 16px;font:400 13px/1.4 var(--f-b);color:var(--cb-land-t3);text-decoration:none;border-left:2px solid transparent;margin-left:-1px;transition:color .2s,border-color .2s;cursor:pointer; }
.cb-legal-toc__link:hover { color:var(--cb-land-t1);border-left-color:#0080C0; }
@media(max-width:860px){
    .cb-legal-layout { grid-template-columns:1fr;gap:0; }
    .cb-legal-toc { display:none; }
}

/* --- MudBlazor Overrides (landing-specific) --- */
.cb-app .mud-paper { background-color:transparent !important; }
.cb-app .mud-typography-h2,.cb-app .mud-typography-h3,.cb-app .mud-typography-h4 { font-family:var(--f-h) !important; }
.cb-app .mud-expand-panel { background:transparent !important;box-shadow:none !important; }
.cb-app .mud-chip { font-family:var(--f-b) !important; }

/* --- Responsive --- */

/* Large desktop: comfortable padding */
@media (min-width:1440px) {
    .cb-sec { padding:120px 48px; }
    .cb-hero__inner { padding:160px 48px 110px; }
    .cb-navbar .mud-container { padding-left:48px !important;padding-right:48px !important; }
}

/* Extra-large / ultrawide: keep content centered, increase vertical rhythm */
@media (min-width:1920px) {
    .cb-sec { padding:140px 64px; }
    .cb-hero__inner { padding:180px 64px 120px; }
}

/* Tablet */
@media (max-width:960px) {
    .cb-hero__inner { padding:120px 20px 60px; }
    .cb-sec { padding:80px 20px; }
    .cb-sec--account { padding-top:100px;padding-bottom:60px; }
    .cb-hero__h1 { font-size:clamp(30px,7vw,48px) !important;letter-spacing:-1px; }
    .cb-sec__head { margin-bottom:48px; }
    .cb-navbar .mud-container { padding-top:10px !important;padding-bottom:10px !important; }
    .cb-navbar .cb-logo-icon { height:22px; }
    .cb-navbar .cb-logo-text { height:12px; }
    .cb-logo-sub { font-size:9px; }
}

/* Mobile */
@media (max-width:600px) {
    .cb-hero__versions { display:none; }
    .cb-stat-num { font-size:30px; }
    .cb-price__num { font-size:28px; }
    .cb-sec { padding:60px 16px; }
    .cb-sec--account { padding:72px 0 32px; }
    .cb-sec__head { margin-bottom:36px; }
    .cb-footer__top { flex-direction:column;align-items:flex-start; }
    .cb-card { padding:24px !important; }
    .cb-testi { padding:20px !important; }
    .cb-prod-tabs { gap:8px;display:grid;grid-template-columns:1fr 1fr; }
    .cb-prod-tab { padding:8px 16px !important;font-size:13px !important;width:100% !important; }
    .cb-prod-video { border-radius:14px; }
    .cb-navbar .mud-container { padding-top:8px !important;padding-bottom:8px !important; }
    .cb-navbar .cb-logo-icon { height:20px; }
    .cb-navbar .cb-logo-text { height:10px; }
    .cb-logo-sub { font-size:8px;margin-left:4px; }
}

/* ================================================================
   Reconnect Overlay — Blazor Server connection lost
   ================================================================ */
.cb-reconnect {
    display:none;
    position:fixed;inset:0;z-index:99999;
    align-items:center;justify-content:center;
}
.cb-reconnect.components-reconnect-show,
.cb-reconnect.components-reconnect-failed,
.cb-reconnect.components-reconnect-rejected { display:flex; }

.cb-reconnect__backdrop {
    position:absolute;inset:0;
    background:var(--cb-land-bg, #F5F7FA);
    opacity:.45;
    -webkit-backdrop-filter:blur(16px);
    backdrop-filter:blur(16px);
}
.cb-reconnect__content {
    position:relative;
    display:flex;flex-direction:column;align-items:center;gap:16px;
    padding:40px;
}
.cb-reconnect__logo {
    width:56px;height:56px;
    animation:cb-reconnect-pulse 2s ease-in-out infinite;
}
@keyframes cb-reconnect-pulse {
    0%,100% { opacity:1;transform:scale(1); }
    50% { opacity:.6;transform:scale(.95); }
}

/* Text: hidden initially, fade in after 5s */
.cb-reconnect__text {
    display:flex;align-items:center;gap:10px;
    opacity:0;
    animation:cb-reconnect-fade-in .4s ease forwards;
    animation-delay:5s;
    color:var(--cb-land-t2, #4A5568);
    font-family:'Be Vietnam Pro',sans-serif;
    font-size:14px;font-weight:500;
}
.cb-reconnect__spinner {
    width:16px;height:16px;
    border:2px solid var(--cb-land-bd, #E2E8F0);
    border-top-color:var(--blue, #0080C0);
    border-radius:50%;
    animation:cb-reconnect-spin .8s linear infinite;
}
@keyframes cb-reconnect-spin { to { transform:rotate(360deg); } }
@keyframes cb-reconnect-fade-in { to { opacity:1; } }

/* Failed / Rejected state */
.cb-reconnect__failed {
    display:none;
    flex-direction:column;align-items:center;gap:12px;
    color:var(--cb-land-t2, #4A5568);
    font-family:'Be Vietnam Pro',sans-serif;
    font-size:14px;font-weight:500;
}
.cb-reconnect.components-reconnect-failed .cb-reconnect__text,
.cb-reconnect.components-reconnect-rejected .cb-reconnect__text { display:none; }
.cb-reconnect.components-reconnect-failed .cb-reconnect__failed,
.cb-reconnect.components-reconnect-rejected .cb-reconnect__failed { display:flex; }
.cb-reconnect.components-reconnect-failed .cb-reconnect__logo,
.cb-reconnect.components-reconnect-rejected .cb-reconnect__logo { animation:none;opacity:.5; }

.cb-reconnect__btn {
    padding:8px 24px;
    border:1px solid var(--cb-land-bd, #E2E8F0);
    border-radius:8px;
    background:var(--cb-land-sf, #fff);
    color:var(--cb-land-t1, #1A202C);
    font-family:'Be Vietnam Pro',sans-serif;
    font-size:13px;font-weight:600;
    cursor:pointer;
    transition:all .2s ease;
}
.cb-reconnect__btn:hover {
    background:var(--blue, #0080C0);
    color:#fff;border-color:var(--blue, #0080C0);
}
