*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--lumi-bg); color: var(--lumi-text-primary); font-family: var(--font-body); font-size: var(--text-base); line-height: var(--leading-relaxed); -webkit-font-smoothing: antialiased; }
h1, h2, h3 { font-family: var(--font-display); font-weight: var(--weight-semibold); margin: 0; }
a { color: inherit; text-decoration: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; top: -48px; left: var(--space-4); background: var(--lumi-surface-2); color: var(--lumi-text-primary); padding: var(--space-2) var(--space-4); border-radius: var(--radius-md); z-index: var(--z-toast); transition: top var(--duration-fast) var(--ease-out); }
.skip-link:focus { top: var(--space-4); }
:focus-visible { outline: 2px solid var(--lumi-primary); outline-offset: 2px; }
.site-header { position: sticky; top: 0; z-index: var(--z-sticky); background: rgba(20, 21, 29, 0.85); backdrop-filter: blur(var(--blur-sm)); border-bottom: 1px solid var(--lumi-border); }
.site-header__inner { max-width: 1280px; margin: 0 auto; padding: var(--space-4) var(--space-6); display: flex; align-items: center; gap: var(--space-8); }
.brand { display: flex; align-items: center; gap: var(--space-2); }
.brand__mark { width: 24px; height: 24px; border-radius: var(--radius-sm); background: linear-gradient(135deg, var(--lumi-primary), var(--lumi-violet)); }
.brand__name { font-family: var(--font-display); font-weight: var(--weight-bold); font-size: var(--text-xl); letter-spacing: -0.01em; }
.main-nav { flex: 1; }
.main-nav__toggle { display: none; }
.main-nav__list { list-style: none; display: flex; gap: var(--space-6); margin: 0; padding: 0; }
.main-nav__link { font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--lumi-text-secondary); padding: var(--space-2) 0; position: relative; transition: color var(--duration-fast) var(--ease-out); }
.main-nav__link:hover { color: var(--lumi-text-primary); }
.main-nav__link.is-active { color: var(--lumi-text-primary); }
.main-nav__link.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--lumi-primary); border-radius: var(--radius-full); }
.lang-switch { position: relative; }
.lang-switch__trigger { display: flex; align-items: center; gap: var(--space-2); background: var(--lumi-surface-1); border: 1px solid var(--lumi-border); color: var(--lumi-text-primary); border-radius: var(--radius-md); padding: var(--space-2) var(--space-3); font-size: var(--text-sm); cursor: pointer; transition: background var(--duration-fast) var(--ease-out); }
.lang-switch__trigger:hover { background: var(--lumi-surface-2); }
.lang-switch__menu { position: absolute; right: 0; top: calc(100% + var(--space-2)); background: var(--lumi-surface-3); border: 1px solid var(--lumi-border); border-radius: var(--radius-md); box-shadow: var(--shadow-md); list-style: none; margin: 0; padding: var(--space-1); min-width: 160px; }
.lang-switch__menu button { display: flex; align-items: center; gap: var(--space-2); width: 100%; background: none; border: 0; color: var(--lumi-text-primary); font-size: var(--text-sm); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); cursor: pointer; text-align: left; }
.lang-switch__menu button:hover { background: var(--lumi-surface-2); }
.hero { position: relative; overflow: hidden; padding: var(--space-20) var(--space-6) var(--space-16); text-align: center; }
.hero__ambient { position: absolute; inset: -20%; background: radial-gradient(circle at 50% 30%, rgba(79,95,232,0.25), transparent 60%); background-size: 200% 200%; animation: lumi-gradient-drift var(--duration-ambient, 8s) var(--ease-in-out) infinite; z-index: 0; }
.hero__inner { position: relative; z-index: 1; max-width: 760px; margin: 0 auto; }
.hero__title { font-size: var(--text-4xl); line-height: var(--leading-tight); letter-spacing: -0.02em; margin-bottom: var(--space-6); }
.hero__subtitle { color: var(--lumi-text-secondary); font-size: var(--text-lg); margin-bottom: var(--space-8); }
.hero__actions { display: flex; gap: var(--space-4); justify-content: center; flex-wrap: wrap; }
@keyframes lumi-gradient-drift { 0%, 100% { background-position: 0% 0%; } 50% { background-position: 100% 100%; } }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); height: 40px; padding: 0 var(--space-5); border-radius: var(--radius-md); font-size: var(--text-sm); font-weight: var(--weight-semibold); border: 1px solid transparent; cursor: pointer; transition: background var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out); }
.btn--sm { height: 32px; padding: 0 var(--space-4); }
.btn--primary { background: var(--lumi-primary); color: #fff; }
.btn--primary:hover { background: var(--lumi-primary-hover); }
.btn--primary:active { background: var(--lumi-primary-active); }
.btn--ghost { background: transparent; border-color: var(--lumi-border); color: var(--lumi-text-primary); }
.btn--ghost:hover { background: var(--lumi-surface-2); }
.section-inner { max-width: 1280px; margin: 0 auto; padding: var(--space-16) var(--space-6); }
.eyebrow { font-size: var(--text-xs); font-weight: var(--weight-semibold); color: var(--lumi-text-tertiary); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: var(--space-2); }
.section-title { font-size: var(--text-3xl); margin-bottom: var(--space-10); max-width: 640px; }
.products__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
.product-card { background: var(--lumi-surface-1); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: var(--space-8); transition: transform var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out); }
.product-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.product-card__icon { width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--lumi-surface-2); color: var(--lumi-cyan); display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-5); }
.product-card__title { font-size: var(--text-xl); margin-bottom: var(--space-3); }
.product-card__desc { color: var(--lumi-text-secondary); font-size: var(--text-sm); margin-bottom: var(--space-5); }
.product-card__link { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--lumi-primary); font-size: var(--text-sm); font-weight: var(--weight-medium); }
.principles__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: var(--space-4); max-width: 640px; }
.principles__list li { color: var(--lumi-text-secondary); font-size: var(--text-sm); padding-left: var(--space-4); border-left: 2px solid var(--lumi-border); }
.principles__list strong { color: var(--lumi-text-primary); display: block; font-size: var(--text-base); margin-bottom: var(--space-1); }
.site-footer { border-top: 1px solid var(--lumi-border); margin-top: var(--space-16); }
.site-footer__inner { max-width: 1280px; margin: 0 auto; padding: var(--space-12) var(--space-6); }
.site-footer__brand { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-10); }
.site-footer__cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-8); margin-bottom: var(--space-10); }
.site-footer__col { display: flex; flex-direction: column; gap: var(--space-3); }
.site-footer__heading { font-size: var(--text-xs); color: var(--lumi-text-tertiary); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: var(--space-1); }
.site-footer__col a { font-size: var(--text-sm); color: var(--lumi-text-secondary); }
.site-footer__col a:hover { color: var(--lumi-text-primary); }
.site-footer__legal { font-size: var(--text-xs); color: var(--lumi-text-tertiary); }
.cookie-banner { position: fixed; left: var(--space-4); right: var(--space-4); bottom: var(--space-4); z-index: var(--z-toast); max-width: 640px; margin: 0 auto; background: var(--lumi-surface-2); border: 1px solid var(--lumi-border-strong); border-radius: var(--radius-lg); box-shadow: var(--shadow-elevated); padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-4); }
.cookie-banner__text { margin: 0; font-size: var(--text-sm); color: var(--lumi-text-secondary); }
.cookie-banner__actions { display: flex; gap: var(--space-3); justify-content: flex-end; }
@media (max-width: 1023px) { .products__grid { grid-template-columns: repeat(2, 1fr); } .site-footer__cols { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) {
  .main-nav__toggle { display: flex; flex-direction: column; justify-content: center; gap: 4px; width: 32px; height: 32px; background: none; border: 0; cursor: pointer; margin-left: auto; }
  .main-nav__toggle-bar { width: 100%; height: 2px; background: var(--lumi-text-primary); border-radius: var(--radius-full); }
  .main-nav__list { position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; gap: 0; background: var(--lumi-surface-1); border-bottom: 1px solid var(--lumi-border); padding: var(--space-2) var(--space-6); display: none; }
  .main-nav__list.is-open { display: flex; }
  .main-nav__link { padding: var(--space-3) 0; }
  .site-header__inner { gap: var(--space-4); }
  .hero { padding: var(--space-12) var(--space-4) var(--space-10); }
  .hero__title { font-size: var(--text-3xl); }
  .hero__subtitle { font-size: var(--text-base); }
  .section-inner { padding: var(--space-10) var(--space-4); }
  .products__grid { grid-template-columns: 1fr; }
  .principles__list { grid-template-columns: 1fr; }
  .site-footer__cols { grid-template-columns: 1fr; gap: var(--space-6); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero__ambient { animation: none; }
  .product-card, .btn, .main-nav__link, .lang-switch__trigger { transition: none; }
}
.cookie-banner[hidden] { display: none; }
.tag-soon { display: inline-block; font-size: var(--text-xs); color: var(--lumi-text-tertiary); background: var(--lumi-surface-2); border-radius: var(--radius-full); padding: 1px var(--space-2); margin-left: var(--space-1); vertical-align: middle; }
.site-footer__bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-4); }
.site-footer__social { display: flex; gap: var(--space-5); }
.site-footer__social a { font-size: var(--text-xs); color: var(--lumi-text-tertiary); display: flex; align-items: center; gap: var(--space-2); }
.site-footer__social svg { width: 16px; height: 16px; fill: currentColor; flex-shrink: 0; }
.site-footer__social a:hover { color: var(--lumi-text-primary); }
@media (max-width: 767px) {
  .site-footer__bottom { flex-direction: column; align-items: flex-start; }
}