/* Base */
:root{
  --bg:#0b0b0f;
  --bg2:#0f0f16;
  --panel:rgba(255,255,255,.06);
  --panel2:rgba(255,255,255,.09);
  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.68);
  --muted2:rgba(255,255,255,.55);
  --border:rgba(255,255,255,.12);
  --shadow:0 18px 60px rgba(0,0,0,.55);
  --shadow2:0 12px 30px rgba(0,0,0,.35);
  --red:#ff2d3d;
  --red2:#ff4d5b;
  --good:#36d399;
  --warn:#fbbf24;

  --radius:18px;
  --radius2:26px;
  --container:1120px;

  /* Bottom dock (tabbar) — keep layout stable across breakpoints */
  --dock-h: 98px;
  --dock-gap: 12px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html.is-locked,
body.is-locked{
  overflow:hidden;
}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(1200px 800px at 80% -20%, rgba(255,45,61,.25), transparent 55%),
    radial-gradient(900px 600px at 10% 10%, rgba(255,45,61,.14), transparent 50%),
    radial-gradient(700px 500px at 50% 120%, rgba(255,45,61,.10), transparent 55%),
    linear-gradient(180deg, var(--bg), var(--bg2));
  color:var(--text);
  overflow-x:hidden;
  /* Reserve space for the fixed tabbar so content/footer never sits under it */
  padding-bottom:calc(var(--dock-h) + var(--dock-gap) + env(safe-area-inset-bottom, 0px));
}

a{ color:inherit; text-decoration:none; }
button, input, select, textarea{ font:inherit; color:inherit; }
img{ max-width:100%; display:block; }

.container{
  width:min(var(--container), 100% - 40px);
  margin-inline:auto;
}

.skip-link{
  position:absolute;
  left:-999px;
  top:10px;
  background:var(--panel2);
  border:1px solid var(--border);
  padding:10px 12px;
  border-radius:12px;
}
.skip-link:focus{ left:12px; z-index:9999; }

.muted{ color:var(--muted); }
.link{ text-decoration:underline; text-underline-offset:3px; }
.accent{ color:var(--red); }

/* Header */
.header{
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter:saturate(150%) blur(14px);
  background:linear-gradient(180deg, rgba(11,11,15,.82), rgba(11,11,15,.58));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:14px 0;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:max-content;
}
.brand__mark{
  width:56px;
  height:56px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:rgba(0,0,0,.12);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 40px rgba(0,0,0,.35);
  overflow:hidden;
}
.brand__logo{
  display:block;
  width:100%;
  height:100%;
  padding-top:3px;
  object-fit:contain;
  transform:scale(2.1);
  transform-origin:50% 50%;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.45));
}
.brand__text{ display:flex; flex-direction:column; line-height:1.1; }
.brand__name{ font-weight:900; letter-spacing:.15px; }
.brand__namePart{ display:inline; }
.brand__namePart--accent{ color:var(--red); text-shadow:0 10px 30px rgba(255,45,61,.18); }
.brand__tld{ color:rgba(255,255,255,.78); font-weight:800; }
.brand__tag{ font-size:12px; color:var(--muted2); }
.brand--footer .brand__mark{ width:64px; height:64px; border-radius:20px; }

@media (max-width: 560px){
  .brand{ gap:10px; }
  .brand__mark{ width:52px; height:52px; border-radius:18px; }
  .brand--footer .brand__mark{ width:58px; height:58px; }
}

.nav{
  display:flex;
  gap:14px;
  align-items:center;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:999px;
}
.nav__link{
  font-size:13px;
  color:var(--muted);
  padding:10px 10px;
  border-radius:999px;
  transition:background .15s ease, color .15s ease;
}
.nav__link:hover{
  color:var(--text);
  background:rgba(255,255,255,.06);
}

.header__actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.pill{
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:999px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  transition:transform .15s ease, border-color .15s ease, background .15s ease;
}
.pill:hover{ transform:translateY(-1px); border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.06); }
.pill__label{ font-weight:600; font-size:13px; }
.pill__hint{ font-size:12px; color:var(--muted2); }
.pill__arrow{ margin-left:2px; opacity:.9; }
.pill--ghost .pill__hint{ display:none; }
.pill--primary{
  border-color:rgba(255,45,61,.35);
  background:linear-gradient(135deg, rgba(255,45,61,.92), rgba(255,45,61,.52));
  box-shadow:0 18px 50px rgba(255,45,61,.18);
}
.pill--primary:hover{ border-color:rgba(255,45,61,.6); }

.burger{
  display:none;
  width:44px;
  height:44px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  padding:10px;
}
.burger__line{
  display:block;
  height:2px;
  width:100%;
  background:rgba(255,255,255,.88);
  border-radius:99px;
}
.burger__line + .burger__line{ margin-top:6px; opacity:.75; }

/* Hero */
.hero{ padding:34px 0 10px; }
.hero__inner{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:28px;
  align-items:center;
}
.hero__copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.hero__visual{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.kicker{
  margin:0 0 14px;
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--muted);
  font-size:13px;
}
.kicker__dot{
  width:10px; height:10px; border-radius:99px;
  background:var(--red);
  box-shadow:0 0 0 6px rgba(255,45,61,.15);
}
.hero__title{
  margin:0;
  font-size:46px;
  line-height:1.05;
  letter-spacing:-.6px;
}
.hero__subtitle{
  margin:16px 0 0;
  color:var(--muted);
  font-size:16px;
  line-height:1.55;
  max-width:56ch;
}
.hero__cta{ display:flex; gap:12px; margin-top:22px; flex-wrap:wrap; }

.btn{
  border-radius:16px;
  padding:12px 16px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
  color:var(--text);
  font-weight:600;
  display:inline-flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.btn:hover{ transform:translateY(-1px); background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.20); }
.btn--primary{
  border-color:rgba(255,45,61,.36);
  background:linear-gradient(135deg, rgba(255,45,61,.92), rgba(255,45,61,.50));
  box-shadow:0 18px 50px rgba(255,45,61,.18);
}
.btn--secondary{ background:rgba(255,255,255,.03); }
.btn--wide{ width:100%; }

.stats{
  margin-top:18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.stat{
  flex:1 1 140px;
  padding:14px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
}
.stat__value{ font-weight:800; letter-spacing:-.2px; }
.stat__label{ color:var(--muted2); margin-top:4px; font-size:12px; }

.hero-panel{
  position:relative;
  z-index:1;
  border-radius:26px;
  padding:18px 18px;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(380px 220px at 30% 20%, rgba(255,45,61,.22), transparent 60%),
    radial-gradient(300px 220px at 80% 60%, rgba(255,255,255,.10), transparent 60%),
    rgba(255,255,255,.04);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.hero-panel--big{
  width:100%;
  max-width:420px;
  margin-left:auto;
}
.hero-panel__title{
  margin:0;
  font-weight:900;
  font-size:22px;
  letter-spacing:-.3px;
}
.hero-panel__subtitle{
  margin-top:8px;
  color:var(--muted);
  line-height:1.45;
}
.hero-panel__grid{
  margin-top:16px;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}
.hero-mini{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  padding:12px 12px;
}
.hero-mini__k{
  width:28px;
  height:28px;
  border-radius:12px;
  display:grid;
  place-items:center;
  font-weight:900;
  border:1px solid rgba(255,45,61,.30);
  background:rgba(255,45,61,.12);
}
.hero-mini__t{
  margin-top:8px;
  font-size:12px;
  color:rgba(255,255,255,.82);
  line-height:1.35;
  font-weight:700;
}

/* Delivery strip */
.delivery-strip{
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
  align-items:center;
  padding:14px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(520px 180px at 15% 0%, rgba(255,45,61,.22), transparent 60%),
    radial-gradient(520px 200px at 90% 30%, rgba(255,255,255,.10), transparent 55%),
    rgba(255,255,255,.04);
  box-shadow:0 18px 60px rgba(0,0,0,.45);
  overflow:hidden;
  margin:0 0 16px;
  position:relative;
}
.delivery-strip__kicker{
  font-size:12px;
  font-weight:950;
  letter-spacing:.22px;
  text-transform:uppercase;
  color:rgba(255,255,255,.70);
}
.delivery-strip__title{
  margin-top:8px;
  font-size:20px;
  font-weight:950;
  letter-spacing:-.25px;
}
.delivery-strip__sub{
  margin-top:8px;
  color:var(--muted);
  line-height:1.45;
  max-width:72ch;
}
.delivery-strip::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    radial-gradient(420px 180px at 78% 45%, rgba(255,45,61,.16), transparent 62%),
    radial-gradient(420px 220px at 15% 80%, rgba(255,255,255,.08), transparent 60%);
  opacity:.9;
}
.delivery-strip__text{ position:relative; z-index:1; }

/* Sections */
.section{ padding:64px 0; }
.section--alt{
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00));
}
.section__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:24px;
}
.h2{
  margin:0;
  font-size:28px;
  letter-spacing:-.3px;
}
.section__head .muted{ max-width:68ch; }

.grid{ display:grid; gap:14px; }
.grid--cards{ grid-template-columns:repeat(3, 1fr); }
.grid--features{ grid-template-columns:repeat(4, 1fr); }

.card{
  border-radius:var(--radius);
  padding:16px 16px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  box-shadow:0 12px 28px rgba(0,0,0,.25);
  transition:transform .15s ease, border-color .15s ease, background .15s ease;
  overflow:hidden;
  position:relative;
}
.card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.05);
}
.card__icon{
  width:44px;
  height:44px;
  border-radius:16px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(20px 20px at 35% 30%, rgba(255,255,255,.16), transparent 60%),
    rgba(0,0,0,.18);
  color:rgba(255,255,255,.90);
}
.card__icon svg{
  width:22px;
  height:22px;
  transform:translate3d(0,0,0);
  transition:transform 220ms cubic-bezier(.2,.9,.2,1), filter 220ms ease;
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.25));
}
.card:hover .card__icon svg{
  transform:translate3d(0,-2px,0) scale(1.06);
  filter:drop-shadow(0 14px 26px rgba(255,45,61,.18));
}
.card__title{ margin:12px 0 0; font-size:16px; font-weight:800; letter-spacing:-.2px; }
.card__text{ margin:8px 0 0; color:var(--muted); line-height:1.5; }
.card__link{
  margin-top:12px;
  display:inline-flex;
  font-weight:700;
  color:rgba(255,255,255,.92);
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,45,61,.25);
  background:rgba(255,45,61,.10);
}
.card__link:hover{ border-color:rgba(255,45,61,.45); background:rgba(255,45,61,.14); }

.feature{
  border-radius:var(--radius);
  padding:16px 16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
}
.feature__badge{
  width:40px; height:40px;
  border-radius:16px;
  display:grid;
  place-items:center;
  font-weight:800;
  background:rgba(255,45,61,.12);
  border:1px solid rgba(255,45,61,.22);
  color:rgba(255,255,255,.90);
}
.feature__title{ margin-top:10px; font-weight:800; letter-spacing:-.2px; }
.feature__text{ margin-top:6px; color:var(--muted); line-height:1.55; font-size:14px; }

/* Steps */
.steps{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:12px;
}
.step{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:16px 16px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
}
.step__num{
  width:42px; height:42px;
  border-radius:16px;
  display:grid;
  place-items:center;
  font-weight:900;
  background:linear-gradient(135deg, rgba(255,45,61,.85), rgba(255,45,61,.28));
  border:1px solid rgba(255,45,61,.30);
}
.step__title{ font-weight:800; letter-spacing:-.15px; }
.step__text{ margin-top:6px; color:var(--muted); line-height:1.55; }

/* Split & Form */
.split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:start;
}
.info{
  margin-top:18px;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
}
.info__row{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:14px 14px;
  border-top:1px solid rgba(255,255,255,.08);
}
.info__row:first-child{ border-top:0; }
.info__key{ color:rgba(255,255,255,.78); font-weight:700; }
.info__val{ color:var(--muted); text-align:right; max-width:46ch; }

.note{
  margin-top:14px;
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:14px 14px;
  border-radius:var(--radius);
  border:1px solid rgba(255,45,61,.22);
  background:rgba(255,45,61,.10);
}
.note__dot{
  width:10px; height:10px; border-radius:99px;
  background:var(--red);
  box-shadow:0 0 0 6px rgba(255,45,61,.15);
  margin-top:5px;
  flex:0 0 auto;
}
.note__text{ color:rgba(255,255,255,.86); line-height:1.55; }

.form-card{
  border-radius:var(--radius2);
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(380px 220px at 25% 0%, rgba(255,45,61,.22), transparent 65%),
    rgba(255,255,255,.04);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.form-card__head{ padding:18px 18px 0; }
.form-card__title{ margin:0; font-size:18px; font-weight:900; letter-spacing:-.2px; }
.form-card__subtitle{ margin:8px 0 0; color:var(--muted); line-height:1.55; }
.form{ padding:16px 18px 18px; }

.field{ margin-top:12px; }
.label{ display:block; font-size:13px; color:rgba(255,255,255,.78); margin-bottom:7px; font-weight:700; }
.input{
  width:100%;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.22);
  padding:12px 12px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.input:focus{
  border-color:rgba(255,45,61,.40);
  box-shadow:0 0 0 6px rgba(255,45,61,.12);
  background:rgba(0,0,0,.26);
}
.input--area{ resize:vertical; min-height:110px; }
.field__error{
  min-height:18px;
  margin-top:6px;
  font-size:12px;
  color:rgba(255,125,134,.92);
}

.form__meta{
  margin-top:10px;
  color:var(--muted2);
  font-size:12px;
  line-height:1.45;
}
.form__result{
  margin-top:12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  padding:12px 12px;
  color:var(--muted);
  display:none;
}
.form__result.is-visible{ display:block; }
.form__result.is-good{
  border-color:rgba(54,211,153,.25);
  background:rgba(54,211,153,.08);
  color:rgba(230,255,246,.9);
}
.form__result.is-warn{
  border-color:rgba(251,191,36,.25);
  background:rgba(251,191,36,.08);
  color:rgba(255,250,231,.9);
}

.quick{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}
.quick__btn{
  width:100%;
  text-align:center;
  border-radius:16px;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);
  font-weight:800;
  cursor:pointer;
}
.quick__btn--wa{
  border-color:rgba(255,45,61,.32);
  background:rgba(255,45,61,.12);
}
.quick__btn:hover{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.18); }

@media (max-width: 560px){
  .quick{ grid-template-columns:1fr; }
}

/* Accordion */
.accordion{ display:grid; gap:10px; }
.acc{
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  overflow:hidden;
}
.acc__sum{
  cursor:pointer;
  padding:14px 14px;
  font-weight:800;
  list-style:none;
}
.acc__sum::-webkit-details-marker{ display:none; }
.acc__body{
  padding:0 14px 14px;
  color:var(--muted);
  line-height:1.55;
}
details[open] .acc__sum{
  border-bottom:1px solid rgba(255,255,255,.08);
}

/* Footer */
.footer{
  padding:46px 0 24px;
  border-top:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
}
.footer__inner{
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}
.footer__left{ max-width:52ch; }
.footer__text{ margin:14px 0 0; color:var(--muted); line-height:1.55; }
.footer__right{
  display:grid;
  grid-template-columns:repeat(3, minmax(160px, 1fr));
  gap:12px;
  align-items:start;
}
.contact{
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  padding:14px 14px;
}
.contact__label{ color:var(--muted2); font-size:12px; font-weight:800; letter-spacing:.2px; }
.contact__value{ margin-top:8px; font-weight:800; display:block; }
.footer__bottom{
  margin-top:18px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:16px;
}

/* Toast */
.toast{
  position:fixed;
  left:50%;
  bottom:calc(var(--dock-h) + 18px + env(safe-area-inset-bottom, 0px));
  z-index:120;
  transform:translateX(-50%);
  background:rgba(0,0,0,.60);
  border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.92);
  padding:12px 14px;
  border-radius:16px;
  box-shadow:var(--shadow2);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}
.toast.is-visible{
  opacity:1;
  transform:translateX(-50%) translateY(-2px);
}

@keyframes dock-in{
  0%{
    opacity:0;
    transform:translate3d(0, 18px, 0) scale(.98);
    filter:saturate(120%) blur(10px);
  }
  65%{
    opacity:1;
    transform:translate3d(0, -3px, 0) scale(1.01);
    filter:saturate(160%) blur(0);
  }
  100%{
    opacity:1;
    transform:translate3d(0, 0, 0) scale(1);
    filter:saturate(160%) blur(0);
  }
}

@keyframes tab-item-in{
  0%{
    opacity:0;
    transform:translate3d(0, 10px, 0) scale(.96);
  }
  70%{
    opacity:1;
    transform:translate3d(0, -2px, 0) scale(1.02);
  }
  100%{
    opacity:1;
    transform:translate3d(0, 0, 0) scale(1);
  }
}

@keyframes tab-icon{
  0%{ transform:translate3d(0, 0, 0); }
  45%{ transform:translate3d(0, -2px, 0); }
  100%{ transform:translate3d(0, 0, 0); }
}

@keyframes wa-glow{
  0%,100%{
    box-shadow:
      0 18px 55px rgba(255,45,61,.22),
      0 0 0 1px rgba(255,45,61,.18) inset;
  }
  50%{
    box-shadow:
      0 22px 70px rgba(255,45,61,.34),
      0 0 0 1px rgba(255,255,255,.10) inset;
  }
}

@keyframes wa-shimmer{
  0%{ transform:translate3d(-40%, 0, 0); opacity:0; }
  20%{ opacity:.55; }
  100%{ transform:translate3d(40%, 0, 0); opacity:0; }
}

/* Tabbar */
.tabbar{
  position:fixed;
  left:max(12px, env(safe-area-inset-left, 0px));
  right:max(12px, env(safe-area-inset-right, 0px));
  bottom:max(12px, env(safe-area-inset-bottom, 0px));
  z-index:60;
  display:flex;
  gap:10px;
  padding:12px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.16);
  background:
    radial-gradient(520px 120px at 20% 0%, rgba(255,45,61,.22), transparent 60%),
    radial-gradient(520px 140px at 90% 30%, rgba(255,255,255,.10), transparent 55%),
    rgba(11,11,15,.78);
  backdrop-filter:saturate(160%) blur(18px);
  box-shadow:
    0 22px 70px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,45,61,.10) inset;
  max-width:560px;
  margin-inline:auto;
  transform:translate3d(0, 0, 0);
  animation:dock-in 620ms cubic-bezier(.2,.9,.2,1) both;
}
.tabbar::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,45,61,.22), rgba(255,255,255,.06) 45%, rgba(255,255,255,0));
  opacity:.55;
}
.tabbar > *{ position:relative; z-index:1; }
.tabbar__item{
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:12px 10px;
  min-height:74px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  font-weight:900;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  transition:
    transform 180ms cubic-bezier(.2,.9,.2,1),
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
  appearance:none;
  -webkit-tap-highlight-color:transparent;
  transform:translate3d(0, 0, 0);
  animation:tab-item-in 520ms cubic-bezier(.2,.9,.2,1) both;
}
.tabbar__item:nth-child(1){ animation-delay:40ms; }
.tabbar__item:nth-child(2){ animation-delay:90ms; }
.tabbar__item:nth-child(3){ animation-delay:140ms; }
button.tabbar__item{
  color:inherit;
  font:inherit;
  margin:0;
  cursor:pointer;
}
.tabbar__item::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-40%;
  width:55%;
  height:220%;
  transform:translate3d(-30%, 0, 0) rotate(18deg);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  opacity:0;
  pointer-events:none;
  z-index:1;
}
.tabbar__item:hover{
  transform:translate3d(0, -2px, 0);
  border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);
  box-shadow:0 14px 40px rgba(0,0,0,.35);
}
.tabbar__item:active{
  transform:translate3d(0, 0, 0) scale(.985);
  transition-duration:90ms;
}
.tabbar__item:active::after{
  opacity:1;
  animation:wa-shimmer 650ms ease both;
}
.tabbar__item:focus-visible{
  outline:2px solid rgba(255,45,61,.55);
  outline-offset:3px;
}
.tabbar__item--wa{
  border-color:rgba(255,45,61,.40);
  background:linear-gradient(135deg, rgba(255,45,61,.95), rgba(255,45,61,.38));
  box-shadow:0 18px 55px rgba(255,45,61,.22);
  animation:
    tab-item-in 520ms cubic-bezier(.2,.9,.2,1) both,
    wa-glow 2.8s ease-in-out infinite;
  animation-delay:90ms, 520ms;
}
.tabbar__item--sheet{
  border-color:rgba(255,255,255,.16);
  background:rgba(255,255,255,.05);
}
.tabbar__item--wa:hover{
  border-color:rgba(255,45,61,.62);
  background:linear-gradient(135deg, rgba(255,45,61,.98), rgba(255,45,61,.44));
}
.tabbar__item--wa::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:radial-gradient(120px 70px at 30% 20%, rgba(255,255,255,.22), transparent 60%);
  opacity:.55;
  z-index:0;
}
.tabbar__item--wa > *{ position:relative; z-index:2; }
.tabbar__icon{
  width:24px;
  height:24px;
  display:inline-flex;
  transform:translate3d(0, 0, 0);
  animation:tab-icon 900ms cubic-bezier(.2,.9,.2,1) both;
}
.tabbar__item:nth-child(1) .tabbar__icon{ animation-delay:120ms; }
.tabbar__item:nth-child(2) .tabbar__icon{ animation-delay:170ms; }
.tabbar__item:nth-child(3) .tabbar__icon{ animation-delay:220ms; }
.tabbar__icon svg{ width:24px; height:24px; }
.tabbar__label{
  font-size:13px;
  letter-spacing:.15px;
  line-height:1;
  opacity:.92;
  transition:opacity 180ms ease, transform 180ms cubic-bezier(.2,.9,.2,1);
}
.tabbar__item:hover .tabbar__label{
  opacity:1;
  transform:translate3d(0, -1px, 0);
}

/* Callback sheet */
.sheet{
  position:fixed;
  inset:0;
  z-index:90;
  display:none;
}
.sheet.is-open{ display:block; }
.sheet__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(2px);
}
.sheet__panel{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:14px 14px calc(18px + env(safe-area-inset-bottom, 0px));
  border-top-left-radius:22px;
  border-top-right-radius:22px;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(520px 180px at 20% 0%, rgba(255,45,61,.18), transparent 60%),
    rgba(11,11,15,.96);
  box-shadow:0 -22px 70px rgba(0,0,0,.55);
  max-height:min(86vh, 760px);
  overflow:auto;
  overscroll-behavior:contain;
}
.sheet__handle{
  width:44px;
  height:5px;
  border-radius:99px;
  background:rgba(255,255,255,.18);
  margin:4px auto 10px;
}
.sheet__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:0 2px 10px;
}
.sheet__kicker{
  font-size:12px;
  font-weight:900;
  letter-spacing:.25px;
  color:rgba(255,255,255,.72);
  text-transform:uppercase;
}
.sheet__title{
  margin:6px 0 0;
  font-size:20px;
  font-weight:950;
  letter-spacing:-.25px;
}
.sheet__subtitle{
  margin:8px 0 0;
  color:var(--muted);
  line-height:1.45;
  max-width:60ch;
}
.sheet__close{
  width:44px;
  height:44px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
  font-size:26px;
  line-height:1;
  cursor:pointer;
}
.sheet__form{ padding:0 2px 6px; }

/* Mobile nav */
@media (max-width: 980px){
  .hero__inner{ grid-template-columns:1fr; }
  .hero__copy{ order:1; }
  .hero__visual{ order:2; }
  .hero-panel--big{ max-width:none; margin-left:0; }
  .hero-panel__grid{ grid-template-columns:1fr; }
  .delivery-strip{ grid-template-columns:1fr; }
  .grid--features{ grid-template-columns:repeat(2, 1fr); }
  .grid--cards{ grid-template-columns:repeat(2, 1fr); }
  .split{ grid-template-columns:1fr; }
  .footer__right{ grid-template-columns:1fr; }
  .pill--ghost{ display:none; }

  .burger{ display:inline-block; }
  .nav{
    position:fixed;
    left:20px;
    right:20px;
    top:72px;
    z-index:80;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    padding:10px;
    border-radius:20px;
    background:rgba(11,11,15,.94);
    border:1px solid rgba(255,255,255,.14);
    box-shadow:var(--shadow2);
  }
  .nav.is-open{ display:flex; }
  .nav__link{ padding:12px 12px; }
}

@media (max-width: 560px){
  .hero__title{ font-size:36px; }
  .container{ width:min(var(--container), 100% - 26px); }
  .section__head{ flex-direction:column; align-items:flex-start; }
  .grid--cards{ grid-template-columns:1fr; }
  .grid--features{ grid-template-columns:1fr; }
  .header__actions .pill--primary{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .btn, .pill, .card{ transition:none; }
  .card__icon svg{ transition:none !important; filter:none !important; transform:none !important; }
  .tabbar,
  .tabbar__item,
  .tabbar__icon{
    animation:none !important;
  }
  .tabbar__item::after{ animation:none !important; opacity:0 !important; }
}
