:root{
  --color-primary:#1E3A5F;
  --color-secondary:#2D5080;
  --color-accent:#00D9FF;
}

html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{font-family:'Outfit',system-ui,sans-serif}

/* Button fixes */
button,.btn,[class*="btn-"],a[href="#order_form"]{
  white-space:nowrap;
  min-width:fit-content;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem
}
form button[type="submit"]{white-space:normal;width:100%}

/* Header behavior (transparent -> solid) */
#site-header{
  background:linear-gradient(180deg, rgba(14, 22, 34, .55), rgba(14, 22, 34, .0));
  border-bottom:1px solid rgba(255,255,255,.10);
  backdrop-filter:saturate(140%) blur(8px);
}
#site-header.is-solid{
  background:rgba(255,255,255,.92);
  border-bottom:1px solid rgba(17,24,39,.08);
  backdrop-filter:saturate(140%) blur(10px);
}
#site-header.is-solid .header-text{color:#111827}
#site-header.is-solid .header-subtext{color:rgba(17,24,39,.60)}
#site-header.is-solid .header-link{color:rgba(17,24,39,.72)}
#site-header.is-solid .header-link:hover{color:#111827}
#site-header.is-solid .header-icon{color:#111827}

/* Animations (slide left) */
[data-animate]{
  opacity:0;
  transform:translateX(2rem);
  transition:opacity .6s ease-out, transform .6s ease-out
}
[data-animate].is-visible{
  opacity:1;
  transform:translateX(0)
}

/* Utility */
.rotate-180{transform:rotate(180deg)}
.no-scroll{overflow:hidden}

/* Premium focus ring */
:focus-visible{outline:2px solid var(--color-accent); outline-offset:2px}

/* Decorative elements */
.decor-grid-dots{
  background-image:radial-gradient(rgba(0,0,0,.14) 1px, transparent 1px);
  background-size:18px 18px;
}
.decor-grid-lines{
  background-image:
    linear-gradient(to right, rgba(0,0,0,.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(0,0,0,.08) 1px, transparent 1px);
  background-size:28px 28px;
}
.decor-diagonal{
  background-image:repeating-linear-gradient(
    135deg,
    rgba(0,0,0,.06) 0px,
    rgba(0,0,0,.06) 1px,
    transparent 1px,
    transparent 12px
  );
}
.decor-mesh{
  background-image:
    radial-gradient(800px 400px at 15% 10%, rgba(0,217,255,.14), transparent 60%),
    radial-gradient(700px 380px at 80% 20%, rgba(45,80,128,.18), transparent 58%),
    radial-gradient(700px 420px at 55% 85%, rgba(30,58,95,.20), transparent 60%);
}
.decor-gradient-blur::before,
.decor-gradient-blur::after{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  border-radius:9999px;
  filter:blur(40px);
  opacity:.35;
  pointer-events:none;
}
.decor-gradient-blur::before{
  top:-120px; left:-120px;
  background:radial-gradient(circle at 30% 30%, rgba(0,217,255,.9), transparent 60%);
}
.decor-gradient-blur::after{
  bottom:-140px; right:-140px;
  background:radial-gradient(circle at 30% 30%, rgba(45,80,128,.9), transparent 60%);
}

.decor-corner-tr{position:relative}
.decor-corner-tr::after{
  content:"";
  position:absolute;
  top:-1px; right:-1px;
  width:100px; height:100px;
  background:linear-gradient(135deg, rgba(0,217,255,.35), transparent 55%);
  border-top-right-radius:24px;
  pointer-events:none;
}
.decor-corner-bl{position:relative}
.decor-corner-bl::after{
  content:"";
  position:absolute;
  bottom:-1px; left:-1px;
  width:110px; height:110px;
  background:linear-gradient(315deg, rgba(0,217,255,.28), transparent 55%);
  border-bottom-left-radius:24px;
  pointer-events:none;
}

.decor-glow-element{position:relative}
.decor-glow-element::before{
  content:"";
  position:absolute;
  inset:-30px;
  background:radial-gradient(circle at 40% 35%, rgba(0,217,255,.18), transparent 55%);
  filter:blur(18px);
  pointer-events:none;
  z-index:-1;
}

.decor-rings-svg{
  background-image:
    radial-gradient(circle at center, transparent 0 48%, rgba(0,0,0,.08) 49% 49.5%, transparent 50%),
    radial-gradient(circle at center, transparent 0 62%, rgba(0,0,0,.06) 63% 63.5%, transparent 64%),
    radial-gradient(circle at center, transparent 0 76%, rgba(0,0,0,.05) 77% 77.5%, transparent 78%);
}

/* Intensity modifiers */
.decor-subtle{opacity:.06}
.decor-moderate{opacity:.10}
.decor-bold{opacity:.18}

/* Cookie banner subtle motion */
#cookie-consent{animation:cookieUp .28s ease-out}
@keyframes cookieUp{
  from{transform:translateY(14px); opacity:0}
  to{transform:translateY(0); opacity:1}
}