@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap");

/* =====================================================
   Bloomeor Notion-style redesign layer
   Late-loaded across every HTML page.
   ===================================================== */

:root,
[data-theme="light"],
[data-theme="dark"] {
  color-scheme: light;

  --notion-primary: #6c47ff;
  --notion-primary-pressed: #5533d9;
  --notion-primary-deep: #3f258f;
  --notion-navy: #10182f;
  --notion-navy-deep: #0a1024;
  --notion-navy-mid: #17213e;
  --notion-link: #2563eb;

  --notion-pink: #f06292;
  --notion-orange: #ef8a45;
  --notion-purple: #8b5cf6;
  --notion-teal: #16a6a3;
  --notion-green: #20a36a;
  --notion-yellow: #f7d44a;
  --notion-brown: #9c6b45;

  --notion-peach: #ffe4d1;
  --notion-rose: #ffe2ec;
  --notion-mint: #ddf7ed;
  --notion-lavender: #ece6ff;
  --notion-sky: #dff2ff;
  --notion-yellow-soft: #fff4bf;
  --notion-yellow-bold: #ffd84d;
  --notion-cream: #fff7e8;
  --notion-gray: #f5f5f2;

  --notion-canvas: #fffefa;
  --notion-panel: #ffffff;
  --notion-surface: #f7f6f2;
  --notion-surface-soft: #fbfaf6;
  --notion-header-bg: rgba(255, 254, 250, 0.94);
  --notion-modal-scrim: rgba(16, 24, 47, 0.58);
  --notion-hairline: #e6e1d8;
  --notion-hairline-soft: #efebe3;
  --notion-hairline-strong: #cec6b8;

  --notion-ink-deep: #0f0f0f;
  --notion-ink: #202020;
  --notion-charcoal: #2f2d2a;
  --notion-slate: #5f5a52;
  --notion-steel: #7b746b;
  --notion-stone: #958d82;
  --notion-muted: #aaa49a;
  --notion-on-dark: #ffffff;
  --notion-on-dark-muted: rgba(255, 255, 255, 0.72);

  --notion-radius-xs: 4px;
  --notion-radius-sm: 6px;
  --notion-radius-md: 8px;
  --notion-radius-lg: 12px;
  --notion-radius-xl: 16px;
  --notion-radius-full: 9999px;

  --notion-shadow-subtle: 0 1px 2px rgba(15, 15, 15, 0.04);
  --notion-shadow-card: 0 4px 12px rgba(15, 15, 15, 0.08);
  --notion-shadow-mockup: 0 24px 48px -8px rgba(15, 15, 15, 0.2);

  --bg: var(--notion-canvas);
  --bg-base: var(--notion-canvas);
  --bg-dark: var(--notion-navy);
  --bg-light: var(--notion-surface-soft);
  --bg-surface: var(--notion-surface);
  --bg-elevated: var(--notion-canvas);
  --surface: var(--notion-canvas);
  --surface-soft: var(--notion-surface);
  --ink: var(--notion-ink);
  --muted: var(--notion-slate);
  --subtle: var(--notion-steel);
  --line: var(--notion-hairline);
  --brand: var(--notion-primary);
  --brand-dark: var(--notion-primary-pressed);
  --brand-soft: var(--notion-lavender);
  --primary-bg: var(--notion-primary);
  --primary-hover: var(--notion-primary-pressed);

  --text-primary: var(--notion-ink);
  --text-secondary: var(--notion-slate);
  --text-muted: var(--notion-steel);
  --text-disabled: var(--notion-muted);
  --text-inverse: var(--notion-on-dark);
  --accent-primary: var(--notion-primary);
  --accent-dark: var(--notion-primary-pressed);
  --accent-soft: rgba(108, 71, 255, 0.12);
  --teal-primary: var(--notion-teal);
  --success: var(--notion-green);
  --warning: #d18b00;
  --danger: #d54848;
  --info: var(--notion-link);

  --border-subtle: var(--notion-hairline-soft);
  --border-default: var(--notion-hairline);
  --border-strong: var(--notion-hairline-strong);

  --shadow-light: rgba(255, 255, 255, 0);
  --shadow-dark: rgba(15, 15, 15, 0.08);
  --neu-raised: var(--notion-shadow-card);
  --neu-raised-sm: var(--notion-shadow-subtle);
  --neu-raised-lg: var(--notion-shadow-card);
  --neu-pressed: inset 0 0 0 1px var(--notion-hairline);
  --neu-pressed-deep: inset 0 0 0 1px var(--notion-hairline-strong);
  --neu-card: var(--notion-shadow-card);
  --neu-card-hover: 0 8px 20px rgba(15, 15, 15, 0.1);
  --neu-btn: none;
  --neu-btn-hover: none;
  --neu-btn-pressed: inset 0 0 0 1px rgba(15, 15, 15, 0.16);
  --glow-accent: none;
  --glow-accent-strong: none;

  --gradient-accent: linear-gradient(0deg, var(--notion-primary), var(--notion-primary));
  --gradient-hero: linear-gradient(180deg, var(--notion-navy), var(--notion-navy-deep));
  --gradient-section: linear-gradient(180deg, var(--notion-canvas), var(--notion-surface-soft));
  --gradient-surface: linear-gradient(180deg, var(--notion-canvas), var(--notion-surface));

  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-body: var(--font-sans);
  --font-ui: var(--font-sans);
  --font-heading: var(--font-sans);
  --font-headline: var(--font-sans);
  --font-section: var(--font-sans);
  --font-hero: var(--font-sans);
  --font-accent: var(--font-sans);
  --font-eyebrow: var(--font-sans);

  --radius-sm: var(--notion-radius-sm);
  --radius-md: var(--notion-radius-md);
  --radius-lg: var(--notion-radius-lg);
  --radius-xl: var(--notion-radius-lg);
  --radius-2xl: var(--notion-radius-xl);
  --radius-3xl: 20px;
}

[data-theme="dark"] {
  color-scheme: dark;

  --notion-primary: #8b68ff;
  --notion-primary-pressed: #7752f0;
  --notion-primary-deep: #cfc3ff;
  --notion-link: #93c5fd;

  --notion-peach: #35261f;
  --notion-rose: #382330;
  --notion-mint: #18362f;
  --notion-lavender: #2b2544;
  --notion-sky: #1d3344;
  --notion-yellow-soft: #3b321d;
  --notion-yellow-bold: #d9aa35;
  --notion-cream: #14110d;
  --notion-gray: #151821;

  --notion-canvas: #0d111c;
  --notion-panel: #111827;
  --notion-surface: #151c2b;
  --notion-surface-soft: #0a1020;
  --notion-header-bg: rgba(13, 17, 28, 0.88);
  --notion-modal-scrim: rgba(0, 0, 0, 0.68);
  --notion-hairline: rgba(255, 255, 255, 0.12);
  --notion-hairline-soft: rgba(255, 255, 255, 0.08);
  --notion-hairline-strong: rgba(255, 255, 255, 0.22);

  --notion-ink-deep: #ffffff;
  --notion-ink: #f4f1ea;
  --notion-charcoal: #e7dfd3;
  --notion-slate: #c8c0b5;
  --notion-steel: #a39a8f;
  --notion-stone: #847c73;
  --notion-muted: #69635c;
  --notion-shadow-subtle: 0 1px 2px rgba(0, 0, 0, 0.24);
  --notion-shadow-card: 0 12px 28px rgba(0, 0, 0, 0.28);
  --notion-shadow-mockup: 0 24px 48px -8px rgba(0, 0, 0, 0.48);

  --bg: var(--notion-canvas);
  --bg-base: var(--notion-canvas);
  --bg-light: var(--notion-surface-soft);
  --bg-surface: var(--notion-surface);
  --bg-elevated: var(--notion-panel);
  --surface: var(--notion-panel);
  --surface-soft: var(--notion-surface);
  --ink: var(--notion-ink);
  --muted: var(--notion-slate);
  --subtle: var(--notion-steel);
  --line: var(--notion-hairline);
  --brand: var(--notion-primary);
  --brand-dark: var(--notion-primary-pressed);
  --brand-soft: rgba(139, 104, 255, 0.16);
  --primary-bg: var(--notion-primary);
  --primary-hover: var(--notion-primary-pressed);
  --text-primary: var(--notion-ink);
  --text-secondary: var(--notion-slate);
  --text-muted: var(--notion-steel);
  --text-disabled: var(--notion-muted);
  --accent-primary: var(--notion-primary);
  --accent-dark: var(--notion-primary-pressed);
  --accent-soft: rgba(139, 104, 255, 0.16);
  --border-subtle: var(--notion-hairline-soft);
  --border-default: var(--notion-hairline);
  --border-strong: var(--notion-hairline-strong);
  --shadow-dark: rgba(0, 0, 0, 0.36);
  --neu-card: var(--notion-shadow-card);
  --neu-card-hover: 0 18px 38px rgba(0, 0, 0, 0.36);
}

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

html {
  background: var(--notion-canvas) !important;
  color: var(--notion-ink) !important;
  scroll-padding-top: 96px;
}

body {
  min-height: 100vh;
  margin: 0;
  background: var(--notion-canvas) !important;
  color: var(--notion-ink) !important;
  font-family: var(--font-sans) !important;
  font-size: 16px;
  line-height: 1.55;
  overflow-x: clip;
}

body::before,
body::after,
.blob-decoration,
.hero-aura-glow,
.mobile-nav-orb,
.card-glow,
.card-glow-effect,
.logo-glow,
.product-robot-glow,
.liquid-shimmer,
[class*="section-glow"],
[class*="glow-effect"],
[class*="-glow"] {
  display: none !important;
}

body.menu-open {
  overflow: hidden;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

a {
  color: inherit;
}

:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--notion-primary) 55%, transparent) !important;
  outline-offset: 3px !important;
}

p,
li,
span,
small,
label,
input,
textarea,
select,
button {
  letter-spacing: 0 !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.hero-headline,
.hero-title,
.section-title,
.section-header h2,
.section-header-v2 h2,
.logo-text-ultra {
  color: var(--notion-ink) !important;
  font-family: var(--font-sans) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.12 !important;
  text-transform: none !important;
}

h1,
.hero h1,
.hero-headline,
.hero-title {
  font-size: 5rem !important;
  line-height: 1.05 !important;
}

h2,
.section-header h2,
.section-header-v2 h2 {
  font-size: 3.5rem !important;
}

h3,
.card h3,
.feature-card h3,
.product-card h3 {
  font-size: 1.75rem !important;
}

h4 {
  font-size: 1.25rem !important;
}

p,
.lead,
.hero .lead,
.hero-subheadline,
.section-header p,
.section-header-v2 p,
.card p,
.feature-card p {
  color: var(--notion-slate) !important;
  font-family: var(--font-sans) !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}

.text-gradient,
.text-accent {
  background: none !important;
  color: var(--notion-primary) !important;
  -webkit-text-fill-color: currentColor !important;
}

.container,
.container-lg,
.container-sm {
  width: min(100% - 32px, 1280px) !important;
  max-width: 1280px !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

.container-sm {
  width: min(100% - 32px, 860px) !important;
  max-width: 860px !important;
}

.section,
.section-premium,
.dashboard-preview-section,
.product-showcase,
.stats-section,
.cta-section,
main > section {
  padding-block: 96px !important;
}

main > section:not(.hero):not(.service-hero):not(.blog-hero):not(.careers-hero):not(.auth-page):nth-of-type(3n + 2) {
  background: var(--notion-surface-soft) !important;
}

main > section:not(.hero):not(.service-hero):not(.blog-hero):not(.careers-hero):not(.auth-page):nth-of-type(3n) {
  background: var(--notion-cream) !important;
}

.site-header,
.header,
.header-ultra-premium,
body > header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  min-height: 64px !important;
  padding: 0 !important;
  background: var(--notion-header-bg) !important;
  border-bottom: 1px solid var(--notion-hairline) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  pointer-events: auto !important;
}

.header-ultra-premium.hide,
.header-ultra-premium.compact {
  transform: none !important;
  opacity: 1 !important;
  padding-top: 0 !important;
}

.navbar,
.header-inner,
.header-inner-island,
.header-island {
  min-height: 64px !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.brand,
.logo,
.auth-logo,
.footer-logo,
.logo-ultra-premium {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: var(--notion-ink) !important;
  font-family: var(--font-sans) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

.brand img,
.logo img,
.auth-logo img,
.footer-logo img,
.logo-ultra-premium img,
.mobile-nav-brand img {
  width: 40px !important;
  height: 40px !important;
  border-radius: var(--notion-radius-md) !important;
  border: 1px solid var(--notion-hairline) !important;
  background: var(--notion-panel) !important;
  box-shadow: none !important;
  object-fit: contain !important;
}

.nav,
.nav-links,
.nav-ultra {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px !important;
  background: transparent !important;
  border-radius: var(--notion-radius-md) !important;
  box-shadow: none !important;
}

.nav-link,
.nav-links a,
.nav-link-ultra,
.footer-link,
.footer-link-v2,
.footer-link-premium {
  color: var(--notion-steel) !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
  border-radius: var(--notion-radius-sm) !important;
}

.nav-link,
.nav-links a,
.nav-link-ultra {
  padding: 8px 11px !important;
}

.nav-link:hover,
.nav-links a:hover,
.nav-link-ultra:hover,
.footer-link:hover,
.footer-link-v2:hover,
.footer-link-premium:hover {
  background: var(--notion-surface) !important;
  color: var(--notion-ink) !important;
  transform: none !important;
}

.header-actions,
.nav-actions,
.header-actions-ultra,
.hero-actions,
.hero-cta,
.cta-actions,
.cta-buttons,
.product-actions,
.footer-actions,
.logout-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.btn,
a.btn,
button.btn,
.btn-ultra,
.btn-auth,
.btn-google,
.btn-outline,
.btn-outline-ultra,
.btn-secondary-auth,
.btn-newsletter-premium,
.mobile-cta-primary,
.mobile-cta-whatsapp,
.filter-btn {
  min-height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 10px 18px !important;
  border-radius: var(--notion-radius-md) !important;
  border: 1px solid var(--notion-hairline-strong) !important;
  background: transparent !important;
  color: var(--notion-ink) !important;
  box-shadow: none !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  text-decoration: none !important;
  white-space: normal !important;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease !important;
}

.btn:hover,
a.btn:hover,
button.btn:hover,
.btn-ultra:hover,
.btn-auth:hover,
.btn-google:hover,
.btn-outline:hover,
.btn-outline-ultra:hover,
.btn-newsletter-premium:hover,
.filter-btn:hover {
  transform: translateY(-1px) !important;
  background: var(--notion-surface) !important;
  border-color: var(--notion-hairline-strong) !important;
  box-shadow: var(--notion-shadow-subtle) !important;
}

.btn-primary,
a.btn-primary,
button.btn-primary,
.btn-primary-ultra,
.btn-auth,
.btn-book-demo,
.mobile-cta-primary,
.filter-btn.active {
  background: var(--notion-primary) !important;
  border-color: var(--notion-primary) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover,
.btn-primary-ultra:hover,
.btn-auth:hover,
.btn-book-demo:hover,
.mobile-cta-primary:hover {
  background: var(--notion-primary-pressed) !important;
  border-color: var(--notion-primary-pressed) !important;
  color: #ffffff !important;
}

.btn-secondary,
a.btn-secondary,
button.btn-secondary,
.btn-ghost,
a.btn-ghost,
.btn-outline,
.btn-outline-ultra,
.btn-secondary-auth,
.btn-google {
  background: transparent !important;
  border-color: var(--notion-hairline-strong) !important;
  color: var(--notion-ink) !important;
}

.btn-lg {
  min-height: 44px !important;
  padding: 11px 20px !important;
  border-radius: var(--notion-radius-md) !important;
  font-size: 14px !important;
}

.hero .btn-secondary,
.hero .btn-ghost,
.service-hero .btn-secondary,
.service-hero .btn-ghost,
.blog-hero .btn-secondary,
.blog-hero .btn-ghost,
.careers-hero .btn-secondary,
.careers-hero .btn-ghost,
.policy-hero .btn-secondary,
.policy-hero .btn-ghost,
.trust-hero .btn-secondary,
.trust-hero .btn-ghost {
  background: transparent !important;
  border-color: rgba(255, 255, 255, 0.34) !important;
  color: #ffffff !important;
}

.hero .btn-secondary:hover,
.hero .btn-ghost:hover,
.service-hero .btn-secondary:hover,
.service-hero .btn-ghost:hover,
.blog-hero .btn-secondary:hover,
.blog-hero .btn-ghost:hover,
.careers-hero .btn-secondary:hover,
.careers-hero .btn-ghost:hover,
.policy-hero .btn-secondary:hover,
.policy-hero .btn-ghost:hover,
.trust-hero .btn-secondary:hover,
.trust-hero .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.52) !important;
}

.hero,
.hero-section,
.section-hero,
.service-hero,
.blog-hero,
.careers-hero,
.premium-hero-layout,
.policy-hero,
.trust-hero,
.auth-insight {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  min-height: auto !important;
  padding: 112px 0 96px !important;
  background:
    linear-gradient(180deg, rgba(16, 24, 47, 0.96), rgba(10, 16, 36, 0.98)),
    var(--notion-navy) !important;
  color: var(--notion-on-dark) !important;
  text-align: center !important;
}

.hero {
  background:
    radial-gradient(ellipse at 50% 48%, rgba(10, 16, 36, 0.7), rgba(10, 16, 36, 0.48) 50%, rgba(10, 16, 36, 0.78) 100%),
    linear-gradient(180deg, rgba(10, 16, 36, 0.42), rgba(10, 16, 36, 0.84)),
    url("../../images/3D/Hero.png") center / cover no-repeat,
    var(--notion-navy) !important;
}

.hero::before,
.service-hero::before,
.blog-hero::before,
.careers-hero::before,
.policy-hero::before,
.trust-hero::before,
.auth-insight::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, transparent 14%, rgba(255, 255, 255, 0.1) 14.15%, transparent 14.3%),
    radial-gradient(circle at 16% 24%, var(--notion-yellow) 0 5px, transparent 6px),
    radial-gradient(circle at 78% 18%, var(--notion-pink) 0 5px, transparent 6px),
    radial-gradient(circle at 28% 72%, var(--notion-teal) 0 5px, transparent 6px),
    radial-gradient(circle at 88% 66%, var(--notion-orange) 0 5px, transparent 6px);
  opacity: 0.75 !important;
}

.hero::after,
.service-hero::after,
.blog-hero::after,
.careers-hero::after,
.policy-hero::after,
.trust-hero::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 28px !important;
  width: min(72vw, 920px) !important;
  height: 1px !important;
  transform: translateX(-50%) !important;
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.42), transparent) !important;
  opacity: 0.85 !important;
}

.hero > *,
.hero-section > *,
.section-hero > *,
.service-hero > *,
.blog-hero > *,
.careers-hero > *,
.policy-hero > *,
.trust-hero > *,
.auth-insight > * {
  position: relative !important;
  z-index: 1 !important;
}

.hero-content,
.hero-copy,
.hero-text,
.careers-hero .hero-content,
.service-hero .hero-content,
.blog-hero .hero-content {
  max-width: 880px !important;
  margin-inline: auto !important;
  text-align: center !important;
}

.hero-grid,
.service-hero .container,
.blog-hero .container,
.careers-hero .container {
  display: block !important;
  max-width: 980px !important;
}

.hero-actions,
.hero-cta,
.hero .trust-strip,
.service-hero .hero-cta,
.blog-hero .hero-stats {
  justify-content: center !important;
}

.hero .trust-strip,
.hero-proof,
.hero-stats {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
}

.hero .trust-item,
.hero-proof .trust-item,
.hero-stats .stat-item {
  width: auto !important;
  min-height: 34px !important;
  padding: 6px 10px !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--notion-on-dark-muted) !important;
}

.hero h1,
.hero-headline,
.hero-title,
.service-hero h1,
.blog-hero h1,
.careers-hero h1,
.auth-insight h2 {
  max-width: 920px !important;
  margin: 0 auto 20px !important;
  color: #ffffff !important;
  text-shadow: none !important;
}

.hero .lead,
.hero-subheadline,
.service-hero p,
.blog-hero p,
.careers-hero p,
.auth-insight p {
  max-width: 760px !important;
  margin: 0 auto 28px !important;
  color: var(--notion-on-dark-muted) !important;
  font-size: 18px !important;
}

.hero-badge,
.section-badge,
.eyebrow,
.section-eyebrow,
.auth-kicker,
.product-label,
.blog-category,
.pricing-badge,
.badge,
.trust-badge,
.review-pill,
.featured-badge,
.cta-kicker,
.badge-ultra-free {
  width: fit-content !important;
  min-height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 auto 18px !important;
  padding: 4px 10px !important;
  border-radius: var(--notion-radius-sm) !important;
  border: 1px solid transparent !important;
  background: var(--notion-lavender) !important;
  color: var(--notion-primary-deep) !important;
  box-shadow: none !important;
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
}

.hero .hero-badge,
.service-hero .hero-badge,
.blog-hero .hero-badge,
.careers-hero .hero-badge,
.auth-kicker {
  background: rgba(255, 255, 255, 0.11) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
}

.trust-strip,
.hero-proof,
.hero-stats,
.stats-grid,
.features-grid,
.feature-grid,
.product-grid,
.platform-grid,
.pricing-grid,
.testimonial-grid,
.blog-grid,
.medium-grid,
.footer-grid,
.footer-nav,
.footer-grid-v2,
.booking-products,
.highlight-grid,
.dashboard-grid,
.contact-grid,
.policy-grid,
.comparison-grid,
.values-grid,
.positions-grid,
.benefits-grid {
  display: grid !important;
  gap: 20px !important;
}

.features-grid,
.feature-grid,
.blog-grid,
.medium-grid,
.values-grid,
.benefits-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.product-grid,
.pricing-grid,
.footer-grid,
.footer-nav,
.footer-grid-v2,
.platform-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.product-suite .product-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.testimonial-grid,
.stats-grid,
.highlight-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.card,
.feature-card,
.feature-card-v2,
.product-card,
.platform-card,
.pricing-card,
.price-card,
.blog-card,
.medium-card,
.featured-post,
.testimonial,
.testimonial-card,
.stat-card,
.stat-item,
.highlight-card,
.service-card,
.value-card,
.position-card,
.internship-card,
.benefit-card,
.audience-card,
.why-card,
.step-card,
.dashboard-card,
.dashboard-frame,
.dashboard-showcase,
.dashboard-preview,
.product-visual,
.product-window,
.hero-price-card,
.cta-card,
.cta-box,
.cta-panel,
.newsletter-section,
.newsletter-card,
.contact-card,
.policy-content,
.policy-section,
.disclosure-card,
.contact-box,
.faq-item,
.faq-accordion-item,
.comparison-table,
.auth-card,
.auth-proof,
.trust-item,
.booking-product {
  border: 1px solid var(--notion-hairline) !important;
  border-radius: var(--notion-radius-lg) !important;
  background: var(--notion-canvas) !important;
  color: var(--notion-ink) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.card,
.feature-card,
.feature-card-v2,
.product-card,
.platform-card,
.pricing-card,
.price-card,
.blog-card,
.medium-card,
.testimonial,
.stat-card,
.highlight-card,
.service-card,
.value-card,
.position-card,
.internship-card,
.benefit-card,
.audience-card,
.why-card,
.step-card,
.dashboard-card,
.contact-card,
.policy-section,
.faq-item,
.auth-card,
.booking-product {
  padding: 28px !important;
}

.card:hover,
.feature-card:hover,
.product-card:hover,
.platform-card:hover,
.pricing-card:hover,
.price-card:hover,
.blog-card:hover,
.medium-card:hover,
.testimonial:hover,
.dashboard-card:hover,
.service-card:hover,
.position-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--notion-shadow-card) !important;
}

.feature-card:nth-child(6n + 1),
.feature-card-v2:nth-child(6n + 1),
.product-card:nth-child(6n + 1),
.blog-card:nth-child(6n + 1),
.medium-card:nth-child(6n + 1),
.value-card:nth-child(6n + 1),
.benefit-card:nth-child(6n + 1) {
  background: var(--notion-peach) !important;
}

.feature-card:nth-child(6n + 2),
.feature-card-v2:nth-child(6n + 2),
.product-card:nth-child(6n + 2),
.blog-card:nth-child(6n + 2),
.medium-card:nth-child(6n + 2),
.value-card:nth-child(6n + 2),
.benefit-card:nth-child(6n + 2) {
  background: var(--notion-rose) !important;
}

.feature-card:nth-child(6n + 3),
.feature-card-v2:nth-child(6n + 3),
.product-card:nth-child(6n + 3),
.blog-card:nth-child(6n + 3),
.medium-card:nth-child(6n + 3),
.value-card:nth-child(6n + 3),
.benefit-card:nth-child(6n + 3) {
  background: var(--notion-mint) !important;
}

.feature-card:nth-child(6n + 4),
.feature-card-v2:nth-child(6n + 4),
.product-card:nth-child(6n + 4),
.blog-card:nth-child(6n + 4),
.medium-card:nth-child(6n + 4),
.value-card:nth-child(6n + 4),
.benefit-card:nth-child(6n + 4) {
  background: var(--notion-lavender) !important;
}

.feature-card:nth-child(6n + 5),
.feature-card-v2:nth-child(6n + 5),
.product-card:nth-child(6n + 5),
.blog-card:nth-child(6n + 5),
.medium-card:nth-child(6n + 5),
.value-card:nth-child(6n + 5),
.benefit-card:nth-child(6n + 5) {
  background: var(--notion-sky) !important;
}

.feature-card:nth-child(6n),
.feature-card-v2:nth-child(6n),
.product-card:nth-child(6n),
.blog-card:nth-child(6n),
.medium-card:nth-child(6n),
.value-card:nth-child(6n),
.benefit-card:nth-child(6n) {
  background: var(--notion-yellow-soft) !important;
}

.featured-post,
.cta-card,
.cta-box,
.newsletter-section,
.highlight-section,
.medium-section,
.platform-support,
.stat-row {
  border-radius: var(--notion-radius-lg) !important;
  background: var(--notion-yellow-bold) !important;
  color: var(--notion-charcoal) !important;
  box-shadow: none !important;
}

.dashboard-frame,
.dashboard-showcase,
.dashboard-preview,
.workspace-mockup-card,
.product-visual,
.hero-price-card,
.auth-card,
.product-window,
.pos-ui-shell,
.mockup-body {
  background: var(--notion-panel) !important;
  border: 1px solid var(--notion-hairline) !important;
  border-radius: var(--notion-radius-lg) !important;
  box-shadow: var(--notion-shadow-mockup) !important;
}

.feature-icon,
.feature-icon-wrapper,
.feature-icon-premium,
.icon-neu,
.icon-illustration,
.platform-icon,
.blog-card-image,
.featured-image,
.medium-image,
.step-indicator {
  width: 56px !important;
  height: 56px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 0 18px !important;
  border-radius: var(--notion-radius-lg) !important;
  border: 1px solid var(--notion-hairline) !important;
  background: var(--notion-panel) !important;
  color: var(--notion-primary) !important;
  box-shadow: none !important;
  font-size: 24px !important;
}

.pricing,
.pricing-section {
  background: var(--notion-surface-soft) !important;
}

.pricing-card.featured,
.price-card.featured,
.pricing-card.featured:hover,
.price-card.featured:hover {
  background: var(--notion-surface) !important;
  border: 2px solid var(--notion-primary) !important;
  transform: none !important;
}

.pricing-price,
.price,
.hero-price,
.stat-number,
.dashboard-card-value {
  color: var(--notion-ink-deep) !important;
  font-family: var(--font-sans) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.comparison-table,
table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
  background: var(--notion-canvas) !important;
  border: 1px solid var(--notion-hairline) !important;
  border-radius: var(--notion-radius-md) !important;
  color: var(--notion-ink) !important;
}

th,
td {
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--notion-hairline-soft) !important;
  color: var(--notion-ink) !important;
}

th {
  background: var(--notion-surface) !important;
  font-weight: 600 !important;
}

input,
textarea,
select,
.form-input,
.text-input,
.search-pill {
  min-height: 44px !important;
  border: 1px solid var(--notion-hairline-strong) !important;
  border-radius: var(--notion-radius-md) !important;
  background: var(--notion-panel) !important;
  color: var(--notion-ink) !important;
  box-shadow: none !important;
  outline: none !important;
}

input:focus,
textarea:focus,
select:focus,
.form-input:focus {
  border-color: var(--notion-primary) !important;
  box-shadow: 0 0 0 3px rgba(108, 71, 255, 0.16) !important;
}

.auth-page {
  min-height: 100vh !important;
  padding: 40px 0 !important;
  background: var(--notion-surface-soft) !important;
}

.auth-container {
  width: min(100% - 32px, 1160px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
  margin-inline: auto !important;
  padding: 0 !important;
}

.auth-insight {
  min-height: 620px !important;
  border-radius: var(--notion-radius-lg) !important;
  border: 1px solid var(--notion-hairline) !important;
  padding: 36px !important;
  text-align: left !important;
}

.auth-insight h2,
.auth-insight p,
.auth-kicker {
  margin-inline: 0 !important;
  text-align: left !important;
}

.auth-proof-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.auth-proof {
  padding: 14px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}

.auth-proof span,
.auth-proof strong {
  color: #ffffff !important;
}

.booking-popup {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2000 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  background: var(--notion-modal-scrim) !important;
}

.booking-popup.open {
  display: flex !important;
}

.booking-popup[hidden] {
  display: none !important;
}

.booking-dialog {
  width: min(100%, 640px) !important;
  max-height: calc(100vh - 48px) !important;
  overflow: auto !important;
  margin: 0 !important;
  padding: 30px !important;
  border: 1px solid var(--notion-hairline) !important;
  border-radius: var(--notion-radius-lg) !important;
  background: var(--notion-canvas) !important;
  color: var(--notion-ink) !important;
  box-shadow: var(--notion-shadow-mockup) !important;
  transform: none !important;
}

.booking-dialog h2 {
  margin: 0 0 12px !important;
  color: var(--notion-ink) !important;
  font-size: 2rem !important;
  line-height: 1.12 !important;
}

.booking-dialog p {
  margin: 0 0 20px !important;
  color: var(--notion-slate) !important;
  font-size: 16px !important;
}

.booking-dialog .booking-products {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.mobile-menu-toggle,
.menu-toggle,
.mobile-menu-toggle-premium,
.theme-toggle,
.theme-pill,
.mobile-theme-toggle,
.back-to-top,
#backToTop {
  min-height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 8px 14px !important;
  border-radius: var(--notion-radius-md) !important;
  border: 1px solid var(--notion-hairline) !important;
  background: var(--notion-panel) !important;
  color: var(--notion-ink) !important;
  box-shadow: none !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

.theme-toggle:hover,
.theme-pill:hover,
.mobile-theme-toggle:hover,
.menu-toggle:hover,
.mobile-menu-toggle:hover,
.mobile-menu-toggle-premium:hover {
  background: var(--notion-surface) !important;
  border-color: var(--notion-hairline-strong) !important;
}

.theme-dot {
  width: 14px !important;
  height: 14px !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 65% 35%, var(--notion-panel) 0 35%, transparent 36%),
    var(--notion-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--notion-primary) 16%, transparent) !important;
}

[data-theme="dark"] .theme-dot {
  background:
    radial-gradient(circle at 35% 35%, #ffffff 0 24%, transparent 25%),
    var(--notion-primary) !important;
}

.theme-toggle-track {
  position: relative !important;
  width: 54px !important;
  height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 3px 7px !important;
  border-radius: var(--notion-radius-full) !important;
  border: 1px solid var(--notion-hairline) !important;
  background: var(--notion-surface) !important;
  color: var(--notion-steel) !important;
}

.theme-toggle-thumb {
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: var(--notion-panel) !important;
  border: 1px solid var(--notion-hairline) !important;
  box-shadow: var(--notion-shadow-subtle) !important;
  transition: transform 180ms ease, background-color 180ms ease !important;
}

[data-theme="dark"] .theme-toggle-thumb {
  transform: translateX(24px) !important;
}

.mobile-nav-overlay,
.mobile-nav-overlay-ultra {
  background: var(--notion-canvas) !important;
  background: color-mix(in srgb, var(--notion-canvas) 96%, transparent) !important;
  color: var(--notion-ink) !important;
  backdrop-filter: blur(18px) !important;
}

.mobile-nav-overlay:not(.active),
.mobile-nav-overlay-ultra:not(.active) {
  display: none !important;
}

.mobile-nav-overlay.active,
.mobile-nav-overlay-ultra.active {
  display: flex !important;
}

.mobile-nav-link,
.mobile-link-item,
.mobile-nav-logo-text {
  color: var(--notion-ink) !important;
}

.site-footer,
.footer,
.footer-v2,
.footer-pro {
  padding: 64px 0 32px !important;
  background: var(--notion-canvas) !important;
  border-top: 1px solid var(--notion-hairline) !important;
  color: var(--notion-slate) !important;
}

.footer-brand p,
.footer-column p,
.footer-bottom,
.footer-bottom p,
.footer-bottom-v2 {
  color: var(--notion-steel) !important;
}

.footer-column h3,
.footer-column h4,
.footer-column h5,
.footer-brand strong {
  margin-bottom: 14px !important;
  color: var(--notion-ink) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.footer-bottom,
.footer-bottom-v2,
.footer-bottom-inner {
  border-top: 1px solid var(--notion-hairline-soft) !important;
  padding-top: 24px !important;
}

.hero [style*="background"],
.service-hero [style*="background"],
.blog-hero [style*="background"] {
  background: transparent !important;
}

.revealed,
.animate-fadeInUp,
.stagger-1,
.stagger-2,
.stagger-3,
.stagger-4,
.stagger-5 {
  opacity: 1 !important;
  transform: none !important;
}

@media (max-width: 1023px) {
  h1,
  .hero h1,
  .hero-headline,
  .hero-title {
    font-size: 3.5rem !important;
  }

  h2,
  .section-header h2,
  .section-header-v2 h2 {
    font-size: 2.5rem !important;
  }

  .features-grid,
  .feature-grid,
  .product-grid,
  .pricing-grid,
  .testimonial-grid,
  .blog-grid,
  .medium-grid,
  .platform-grid,
  .footer-grid,
  .footer-nav,
  .footer-grid-v2,
  .stats-grid,
  .highlight-grid,
  .values-grid,
  .benefits-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .auth-container {
    grid-template-columns: 1fr !important;
  }

  .auth-insight {
    min-height: 420px !important;
  }

  .nav,
  .nav-links,
  .nav-ultra,
  .header-actions,
  .nav-actions,
  .header-actions-ultra {
    display: none !important;
  }

  .mobile-menu-toggle,
  .menu-toggle,
  .mobile-menu-toggle-premium {
    display: inline-flex !important;
  }
}

@media (max-width: 767px) {
  .container,
  .container-lg,
  .container-sm {
    width: min(100% - 24px, 1280px) !important;
  }

  .section,
  .section-premium,
  .dashboard-preview-section,
  .product-showcase,
  .stats-section,
  .cta-section,
  main > section {
    padding-block: 64px !important;
  }

  .hero,
  .hero-section,
  .section-hero,
  .service-hero,
  .blog-hero,
  .careers-hero,
  .premium-hero-layout,
  .policy-hero,
  .trust-hero {
    padding: 78px 0 64px !important;
  }

  h1,
  .hero h1,
  .hero-headline,
  .hero-title {
    font-size: 2.25rem !important;
  }

  h2,
  .section-header h2,
  .section-header-v2 h2 {
    font-size: 2rem !important;
  }

  h3,
  .card h3,
  .feature-card h3,
  .product-card h3 {
    font-size: 1.35rem !important;
  }

  .hero .lead,
  .hero-subheadline,
  .service-hero p,
  .blog-hero p,
  .careers-hero p {
    font-size: 16px !important;
  }

  .features-grid,
  .feature-grid,
  .product-grid,
  .pricing-grid,
  .testimonial-grid,
  .blog-grid,
  .medium-grid,
  .platform-grid,
  .footer-grid,
  .footer-nav,
  .footer-grid-v2,
  .stats-grid,
  .highlight-grid,
  .values-grid,
  .benefits-grid,
  .auth-proof-grid,
  .booking-products {
    grid-template-columns: 1fr !important;
  }

  .navbar,
  .header-inner,
  .header-inner-island,
  .header-island {
    padding-inline: 12px !important;
  }

  .hero-actions,
  .hero-cta,
  .cta-actions,
  .cta-buttons,
  .product-actions,
  .logout-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .hero-actions .btn,
  .hero-cta .btn,
  .cta-actions .btn,
  .cta-buttons .btn,
  .product-actions .btn,
  .logout-actions .btn {
    width: 100% !important;
  }

  .card,
  .feature-card,
  .feature-card-v2,
  .product-card,
  .platform-card,
  .pricing-card,
  .price-card,
  .blog-card,
  .medium-card,
  .testimonial,
  .stat-card,
  .highlight-card,
  .service-card,
  .value-card,
  .position-card,
  .internship-card,
  .benefit-card,
  .audience-card,
  .why-card,
  .step-card,
  .dashboard-card,
  .contact-card,
  .policy-section,
  .faq-item,
  .auth-card,
  .booking-product {
    padding: 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 1ms !important;
  }
}
