:root {
  --bg: #02070d;
  --panel: #0a121a;
  --panel-2: #101a24;
  --line: rgba(148, 170, 184, 0.18);
  --text: #f6f8fb;
  --muted: #a7b1bb;
  --green: #12d487;
  --green-2: #079e6b;
  --green-deep: #063f34;
  --green-glow: rgba(18, 212, 135, 0.34);
  --green-soft: rgba(18, 212, 135, 0.105);
  --shadow: 0 22px 90px rgba(0, 0, 0, 0.56);
  --radius: 8px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--bg);
  overflow-x: hidden;
}

body {
  position: relative;
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 80% 11%, rgba(11, 132, 103, 0.26), transparent 24rem),
    radial-gradient(circle at 17% 31%, rgba(8, 83, 73, 0.18), transparent 22rem),
    radial-gradient(circle at 50% 70%, rgba(5, 59, 51, 0.16), transparent 30rem),
    linear-gradient(180deg, #03070c 0%, #02070d 48%, #050910 100%);
  line-height: 1.45;
  overflow-x: hidden;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background:
    radial-gradient(ellipse at 82% 17%, rgba(18, 212, 135, .14), transparent 34%),
    radial-gradient(ellipse at 0% 68%, rgba(5, 131, 102, .14), transparent 28%),
    linear-gradient(90deg, transparent, rgba(10, 101, 82, .09) 48%, transparent 74%);
  filter: blur(.2px);
}

body.menu-open { overflow: hidden; }

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.container {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(2, 7, 13, 0.82);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.nav-shell {
  height: 72px;
  display: grid;
  grid-template-columns: 245px 1fr auto;
  gap: 32px;
  align-items: center;
}

.brand img { width: 218px; height: auto; }

.site-nav {
  display: flex;
  justify-content: center;
  gap: clamp(22px, 4vw, 52px);
  color: #eef3f6;
  font-size: 14px;
  font-weight: 700;
}

.site-nav a,
.footer-grid a,
.footer-bottom a {
  transition: color .2s ease;
}

.site-nav a:hover,
.footer-grid a:hover,
.footer-bottom a:hover {
  color: var(--green);
}

.nav-cta,
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 44px;
  border-radius: 6px;
  font-weight: 800;
  font-size: 14px;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.nav-cta {
  padding: 0 28px;
  color: white;
  background: linear-gradient(135deg, #19c985, #078b63);
  box-shadow: 0 0 0 1px rgba(18, 212, 135, .28), 0 16px 42px rgba(6, 123, 91, .26);
}

.btn { padding: 0 25px; border: 1px solid transparent; }
.btn:hover, .nav-cta:hover { transform: translateY(-2px); }
.btn-primary { color: white; background: linear-gradient(135deg, #25d88d, #08a36f 58%, #077b5b); box-shadow: 0 0 0 1px rgba(18, 212, 135, .26), 0 20px 54px rgba(7, 139, 99, .28); }
.btn-secondary { border-color: rgba(206, 225, 236, 0.35); background: rgba(9, 15, 22, .54); }
.btn-secondary:hover { border-color: var(--green); }

.menu-toggle {
  display: none;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: rgba(255,255,255,.02);
  color: white;
}

.menu-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  margin: 5px auto;
  background: currentColor;
}

.hero {
  position: relative;
  isolation: isolate;
  min-height: 610px;
  display: grid;
  align-items: center;
  padding: 66px 0 62px;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -3;
  background:
    radial-gradient(circle at 50% 12%, rgba(18, 212, 135, .14), transparent 18rem),
    radial-gradient(circle at 78% 30%, rgba(11, 132, 103, .34), transparent 24rem),
    linear-gradient(90deg, transparent 0%, rgba(5, 78, 65, .26) 50%, transparent 100%);
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(2,7,13,.08), rgba(2,7,13,.44)),
    radial-gradient(circle at center, transparent 0%, rgba(2,7,13,.04) 42%, rgba(2,7,13,.4) 100%);
}

.ai-bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: .9;
}

.hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .96fr) minmax(430px, 1.04fr);
  gap: clamp(42px, 5vw, 76px);
  align-items: center;
}

.hero-copy {
  width: min(610px, 100%);
  display: grid;
  justify-items: start;
  text-align: left;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 20px;
  padding: 8px 13px;
  color: var(--green);
  background: rgba(18, 212, 135, .075);
  border: 1px solid rgba(18, 212, 135, .26);
  box-shadow: 0 0 28px rgba(18, 212, 135, .08);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.eyebrow span {
  width: 7px;
  height: 7px;
  border: 2px solid currentColor;
  transform: rotate(45deg);
}

h1, h2, h3, p { margin-top: 0; }

h1 {
  max-width: 540px;
  margin-bottom: 18px;
  font-size: clamp(38px, 3.85vw, 48px);
  line-height: 1.01;
  letter-spacing: 0;
}

h1 span,
.problem-strip span,
.solutions span,
.contact-band h2 span {
  color: var(--green);
  text-shadow: 0 0 26px rgba(18, 212, 135, .18);
}

.hero-text {
  max-width: 540px;
  margin-bottom: 32px;
  color: #d0d8df;
  font-size: 16px;
  line-height: 1.62;
}

.hero-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 16px;
  margin-bottom: 34px;
}

.hero-actions .btn {
  padding-inline: 20px;
  font-size: 13px;
}

.productivity-line {
  position: relative;
  max-width: 540px;
  margin: 0;
  padding: 15px 18px 15px 22px;
  color: #dbe5e9;
  background:
    linear-gradient(90deg, rgba(18, 212, 135, .105), rgba(255,255,255,.025) 48%, transparent),
    rgba(2, 8, 14, .28);
  border: 1px solid rgba(18, 212, 135, .18);
  border-left: 3px solid var(--green);
  border-radius: 8px;
  box-shadow: 0 18px 46px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.035);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.42;
}

.productivity-line::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 20px;
  width: 10px;
  height: 10px;
  background: var(--green);
  border-radius: 50%;
  box-shadow: 0 0 20px rgba(18, 212, 135, .75), 0 0 44px rgba(18, 212, 135, .26);
}

.hero-visual {
  position: relative;
  width: min(600px, calc(100% + 64px));
  justify-self: end;
  margin: 0;
  aspect-ratio: 133 / 99;
  border-radius: 8px;
  isolation: isolate;
  transform: translateX(20px);
}

.hero-visual::before,
.hero-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}

.hero-visual::before {
  display: none;
}

.hero-visual::after {
  display: none;
}

.hero-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: inherit;
  opacity: 1;
  filter: saturate(1.05) contrast(1.04) brightness(1.03);
}

.dashboard-card {
  position: relative;
  min-height: 410px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 168px;
  gap: 0;
  padding-top: 32px;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%, rgba(18, 212, 135, .14), transparent 34%),
    linear-gradient(145deg, rgba(17, 28, 38, .95), rgba(6, 10, 16, .97));
  border: 1px solid rgba(120, 169, 157, .26);
  border-radius: 8px;
  box-shadow: var(--shadow), inset 0 1px rgba(255,255,255,.04);
}

.dashboard-card::before {
  content: "";
  position: absolute;
  inset: -30% -20% auto auto;
  width: 260px;
  height: 260px;
  background: radial-gradient(circle, rgba(18, 212, 135, .24), transparent 68%);
  filter: blur(2px);
}

.window-dots {
  position: absolute;
  top: 13px;
  left: 14px;
  display: flex;
  gap: 8px;
}

.window-dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.window-dots span:nth-child(1) { background: #ff6262; }
.window-dots span:nth-child(2) { background: #ffbf45; }
.window-dots span:nth-child(3) { background: #2edb94; }

.dash-rail {
  border-right: 1px solid var(--line);
  padding-top: 30px;
}

.dash-rail span {
  display: block;
  width: 18px;
  height: 18px;
  margin: 0 auto 24px;
  border: 1px solid rgba(200, 217, 226, .65);
  border-radius: 4px;
}

.dash-main {
  min-width: 0;
  padding: 18px 18px 12px;
  position: relative;
}

.dash-main h2 { margin-bottom: 2px; font-size: 16px; }
.dash-main p, .dash-main small, .dash-main span { color: var(--muted); }

.growth-panel,
.flows,
.assistant-card,
.dash-stats article {
  background: rgba(2, 8, 14, .56);
  border: 1px solid rgba(119, 165, 152, .16);
  border-radius: 6px;
}

.growth-panel {
  position: relative;
  min-height: 112px;
  margin-top: 14px;
  padding: 16px;
}

.growth-panel span {
  display: block;
  margin-bottom: 8px;
  font-size: 11px;
  text-transform: uppercase;
}

.growth-panel strong { font-size: 28px; }
.growth-panel small { display: block; margin-top: 2px; }

.chart-line {
  position: absolute;
  right: 13px;
  bottom: 26px;
  width: 154px;
  height: 52px;
  background:
    linear-gradient(90deg, transparent, rgba(18,212,135,.15)),
    url("data:image/svg+xml,%3Csvg width='190' height='52' viewBox='0 0 190 52' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 39 C18 39 21 26 36 29 C49 31 49 43 65 37 C79 31 82 17 100 24 C117 31 119 12 138 16 C154 20 151 37 166 33 C177 30 179 17 188 14' fill='none' stroke='%2312d487' stroke-width='3'/%3E%3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 0 7px rgba(18, 212, 135, .28));
}

.dash-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin: 12px 0;
}

.dash-stats article { padding: 8px 7px; overflow: hidden; }
.dash-stats span { display: block; min-height: 24px; font-size: 8px; text-transform: uppercase; }
.dash-stats strong { display: block; font-size: 15px; }
.dash-stats small { color: var(--green); font-weight: 800; }

.flows { padding: 12px; }
.flows h3 { margin-bottom: 10px; font-size: 12px; }
.flows div {
  display: grid;
  grid-template-columns: 1fr 56px 38px;
  gap: 8px;
  align-items: center;
  min-height: 34px;
  font-size: 11px;
  border-top: 1px solid rgba(255,255,255,.04);
}

.flows i {
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg width='68' height='18' viewBox='0 0 68 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 12 C11 12 11 5 20 9 C29 13 28 3 38 8 C48 13 49 5 58 8 C63 10 65 10 67 9' fill='none' stroke='%2312d487' stroke-width='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 0 5px rgba(18, 212, 135, .28));
}

.flows em {
  color: var(--green);
  font-size: 10px;
  font-style: normal;
}

.assistant-card {
  position: relative;
  align-self: start;
  margin: 32px 10px 0 0;
  padding: 13px;
  overflow: hidden;
  font-size: 12px;
}

.assistant-card button {
  position: absolute;
  right: 9px;
  top: 8px;
  border: 0;
  background: transparent;
  color: #7d8992;
}

.assistant-card strong::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 8px;
  background: var(--green);
  border-radius: 50%;
  box-shadow: 0 0 14px rgba(18, 212, 135, .8), 0 0 30px rgba(18, 212, 135, .22);
}

.assistant-card > span {
  display: block;
  margin: 2px 0 14px 22px;
  color: var(--green);
  font-size: 11px;
}

.assistant-card p {
  padding: 12px;
  background: rgba(255,255,255,.05);
  border-radius: 5px;
  color: #dfe7eb;
}

.assistant-card ul {
  display: grid;
  gap: 8px;
  padding: 0;
  margin: 0 0 14px;
  list-style: none;
}

.assistant-card li {
  padding: 8px 10px;
  border: 1px solid rgba(18,212,135,.30);
  border-radius: 4px;
  color: #aebbc3;
}

.activity {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.activity b { display: block; margin-bottom: 8px; }
.activity small { color: var(--muted); line-height: 1.8; }

.problem-strip,
.solutions,
.cases {
  border-bottom: 1px solid var(--line);
}

.problem-strip { padding: 36px 0 34px; }
.problem-strip h2,
.solutions h2,
.cases h2 {
  margin-bottom: 24px;
  text-align: center;
  font-size: 22px;
}

.problem-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
}

.problem-grid article,
.solution-card,
.contact-panel,
.contact-form {
  background:
    radial-gradient(circle at 12% 12%, rgba(18, 212, 135, .055), transparent 38%),
    linear-gradient(145deg, rgba(17, 28, 38, .9), rgba(7, 12, 18, .82));
  border: 1px solid rgba(112, 160, 150, .23);
  border-radius: var(--radius);
}

.problem-grid article {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 82px;
  padding: 16px 14px;
}

.problem-grid svg {
  width: 42px;
  min-width: 42px;
  color: var(--green);
  padding: 10px;
  background: var(--green-soft);
  border-radius: 50%;
  box-shadow: inset 0 0 0 2px rgba(18,212,135,.34), 0 0 24px rgba(18,212,135,.13);
}

.problem-grid p { margin: 0; font-size: 13px; font-weight: 700; line-height: 1.38; }

.solutions { padding: 38px 0 34px; }

.solution-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.solution-card {
  min-height: 150px;
  display: grid;
  grid-template-columns: 62px 1fr;
  gap: 0 18px;
  padding: 22px 20px;
}

.icon-box {
  grid-row: span 3;
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  color: var(--green);
  background: var(--green-soft);
  border-radius: 50%;
}

.icon-box svg { width: 30px; }
.solution-card h3 { margin-bottom: 8px; font-size: 17px; line-height: 1.28; }
.solution-card ul { margin: 0 0 12px; padding: 0; list-style: none; color: #c5cfd6; }
.solution-card li { margin: 5px 0; font-size: 14px; }
.solution-card li::before { content: "✓"; margin-right: 9px; color: var(--green); }
.solution-card a,
.case-card a {
  color: var(--green);
  font-weight: 800;
}

.cases { padding: 36px 0 42px; }

.case-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.case-card {
  position: relative;
  min-height: 146px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding: 18px 16px;
  background: #0a1017;
  border: 1px solid rgba(143, 166, 181, .25);
  border-radius: 6px;
}

.case-card::before,
.case-card::after {
  content: "";
  position: absolute;
  inset: 0;
}

.case-card::before {
  opacity: .82;
  background: var(--case-bg);
}

.case-card::after {
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.82) 62%);
}

.restaurant { --case-bg: linear-gradient(135deg, rgba(119, 80, 32, .65), transparent), repeating-linear-gradient(90deg, rgba(255,255,255,.08) 0 1px, transparent 1px 42px), linear-gradient(160deg, #2c2118, #05080d); }
.events { --case-bg: radial-gradient(circle at 64% 16%, rgba(255, 196, 84, .42), transparent 38%), linear-gradient(160deg, #322417, #070b12); }
.camping {
  --case-bg: linear-gradient(180deg, rgba(10, 60, 90, .28), rgba(5, 8, 12, .9)), url("data:image/svg+xml,%3Csvg width='280' height='160' viewBox='0 0 280 160' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='280' height='160' fill='%23091824'/%3E%3Cpath d='M0 105 58 48 105 106 144 34 235 140 280 82 280 160 0 160Z' fill='%231a2f37'/%3E%3Cpath d='M0 88 C52 74 84 86 124 78 C173 67 213 61 280 68' stroke='%235ba7d1' stroke-width='2' opacity='.8' fill='none'/%3E%3C/svg%3E");
}
.gpt { --case-bg: repeating-linear-gradient(176deg, rgba(34, 215, 149, .2) 0 1px, transparent 1px 13px), linear-gradient(160deg, #06141b, #05080d); }

.case-card > * {
  position: relative;
  z-index: 1;
}

.case-card span {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  margin-bottom: 8px;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 50%;
  font-weight: 900;
}

.case-card h3 { margin-bottom: 5px; font-size: 16px; line-height: 1.3; }
.case-card p { margin-bottom: 14px; color: #c1ccd3; font-size: 14px; }

.contact-band {
  position: relative;
  padding: 46px 0 34px;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 2%, rgba(18, 212, 135, .16), transparent 19rem),
    radial-gradient(circle at 3% 18%, rgba(18, 212, 135, .12), transparent 16rem),
    radial-gradient(circle at 100% 6%, rgba(5, 125, 96, .14), transparent 18rem),
    linear-gradient(180deg, rgba(4, 15, 18, .97), rgba(4, 8, 14, .98));
  border-bottom: 1px solid var(--line);
}

.data-wave {
  position: absolute;
  inset: 0 0 auto;
  height: 128px;
  background:
    radial-gradient(circle at 6px 6px, rgba(18,212,135,.52) 1px, transparent 2px) 0 0 / 20px 20px,
    url("data:image/svg+xml,%3Csvg width='1200' height='150' viewBox='0 0 1200 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 90 C150 5 280 130 410 80 C560 24 700 90 850 44 C1010 -5 1080 70 1200 22' stroke='%2312d487' stroke-width='2' fill='none' opacity='.42'/%3E%3Cpath d='M0 112 C180 80 260 142 420 106 C620 60 720 128 910 80 C1060 42 1110 94 1200 72' stroke='%23079e6b' stroke-width='1' fill='none' opacity='.32'/%3E%3C/svg%3E") center top / cover no-repeat;
  opacity: .46;
}

.contact-band h2 {
  position: relative;
  margin: 0 0 30px 100px;
  font-size: clamp(30px, 3.4vw, 40px);
  line-height: 1.04;
}

.contact-grid {
  position: relative;
  display: grid;
  grid-template-columns: .93fr 1.07fr;
  gap: 56px;
}

.contact-panel {
  margin-left: 38px;
  position: relative;
  overflow: hidden;
  padding: 28px;
  align-self: end;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34), inset 0 1px rgba(255,255,255,.035);
}

.contact-panel::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, transparent, rgba(18, 212, 135, .82), transparent);
  opacity: .72;
}

.contact-panel::after {
  content: "";
  position: absolute;
  right: -95px;
  top: -115px;
  width: 220px;
  height: 220px;
  pointer-events: none;
  background: radial-gradient(circle, rgba(18, 212, 135, .16), transparent 66%);
  filter: blur(2px);
}

.contact-panel h3,
.contact-form h3 {
  margin-bottom: 10px;
  font-size: 22px;
}

.contact-kicker {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--green);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.contact-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  background: var(--green);
  border-radius: 50%;
  box-shadow: 0 0 18px rgba(18, 212, 135, .6);
}

.contact-panel h3 {
  position: relative;
  z-index: 1;
  margin-bottom: 8px;
  font-size: 22px;
  line-height: 1.1;
}

.contact-intro {
  position: relative;
  z-index: 1;
  max-width: 430px;
  margin-bottom: 18px;
  color: #c7d1d7;
  font-size: 15px;
}

.contact-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 10px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.contact-list a {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 2px 13px;
  align-items: center;
  min-height: 58px;
  padding: 10px 12px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(124, 165, 156, .18);
  border-radius: 8px;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

.contact-list a:hover {
  transform: translateY(-1px);
  background: rgba(18, 212, 135, .055);
  border-color: rgba(18, 212, 135, .35);
}

.contact-list a > span {
  grid-row: span 2;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: var(--green);
  background: rgba(18, 212, 135, .08);
  border: 1px solid rgba(18, 212, 135, .28);
  border-radius: 7px;
  box-shadow: inset 0 0 18px rgba(18, 212, 135, .035);
}

.contact-list a > span svg {
  width: 19px;
  height: 19px;
  stroke-width: 1.8;
}

.contact-list strong {
  color: #f6f8fb;
  font-size: 13px;
  line-height: 1.1;
}

.contact-list small {
  min-width: 0;
  color: #aebac2;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.faq {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
}

.faq h4 {
  margin: 0 0 2px;
  color: #ffffff;
  font-size: 14px;
}

.faq button {
  min-height: 40px;
  padding: 0 13px;
  color: #eef4f7;
  text-align: left;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(143, 166, 181, .18);
  border-radius: 7px;
  cursor: pointer;
  font-weight: 800;
  transition: border-color .2s ease, background .2s ease;
}

.faq button:hover,
.faq button.is-open {
  background: rgba(18, 212, 135, .05);
  border-color: rgba(18, 212, 135, .32);
}

.faq button::after {
  content: "⌄";
  float: right;
  color: var(--green);
}

.faq p {
  display: none;
  margin: -3px 0 3px;
  padding: 11px 13px 12px;
  color: var(--muted);
  background: rgba(2, 8, 14, .35);
  border-left: 1px solid rgba(18, 212, 135, .55);
  border-radius: 0 0 7px 7px;
  font-size: 13px;
}

.faq button.is-open + p { display: block; }

.contact-form {
  padding: 18px;
  box-shadow: 0 18px 60px rgba(0,0,0,.28);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.form-wide { grid-column: 1 / -1; }

label span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

input,
select,
textarea {
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  font: inherit;
  color: #eaf2f6;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(153, 174, 186, .22);
  border-radius: 4px;
  outline: none;
}

.form-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(18,212,135,.11), 0 0 22px rgba(18,212,135,.08);
}

textarea {
  min-height: 78px;
  padding-top: 12px;
  resize: vertical;
}

fieldset {
  display: flex;
  flex-wrap: wrap;
  gap: 15px 28px;
  margin: 12px 0;
  padding: 0;
  border: 0;
}

legend {
  width: 100%;
  margin-bottom: 2px;
  font-size: 13px;
}

fieldset label,
.privacy {
  color: #c7d1d7;
  font-size: 12px;
}

input[type="checkbox"] {
  width: 14px;
  height: 14px;
  min-height: 14px;
  margin-right: 8px;
  accent-color: var(--green);
}

.privacy {
  display: flex;
  align-items: flex-start;
  margin: 12px 0;
}

.form-submit {
  width: 100%;
  border: 0;
  cursor: pointer;
}

.form-note {
  min-height: 18px;
  margin: 10px 0 0;
  color: var(--green);
  text-align: center;
  font-size: 13px;
}

.site-footer {
  padding: 22px 0 10px;
  background: #03070d;
}

.footer-grid {
  display: grid;
  grid-template-columns: 220px 1fr 150px 190px 145px;
  gap: 30px;
  align-items: start;
}

.footer-grid img { width: 195px; }
.footer-grid p { color: #aab4bd; }
.footer-grid nav,
.footer-grid address,
.footer-action {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-style: normal;
  font-size: 13px;
}

.footer-grid strong {
  margin-bottom: 4px;
  color: white;
  font-size: 15px;
}

.footer-action .btn {
  min-height: 36px;
  padding: 0 14px;
  font-size: 12px;
}

.footer-bottom {
  display: flex;
  gap: 34px;
  align-items: center;
  justify-content: space-between;
  margin-top: 20px;
  padding-top: 16px;
  color: #8d99a2;
  border-top: 1px solid var(--line);
  font-size: 12px;
}

.status-page,
.legal-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 40px 20px;
  background:
    radial-gradient(circle at 70% 12%, rgba(18, 212, 135, .16), transparent 24rem),
    radial-gradient(circle at 8% 80%, rgba(5, 131, 102, .12), transparent 20rem),
    #02070d;
}

.status-card,
.legal-card {
  width: min(760px, 100%);
  background:
    radial-gradient(circle at 18% 12%, rgba(18, 212, 135, .07), transparent 38%),
    linear-gradient(145deg, rgba(17, 28, 38, .94), rgba(7, 12, 18, .9));
  border: 1px solid rgba(112, 160, 150, .24);
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .38);
  padding: clamp(24px, 4vw, 42px);
}

.status-card {
  text-align: center;
}

.status-card img,
.legal-card img {
  width: 220px;
  margin-bottom: 24px;
}

.status-card img {
  margin-inline: auto;
}

.status-card h1,
.legal-card h1 {
  max-width: none;
  margin-bottom: 14px;
  font-size: clamp(32px, 5vw, 46px);
  line-height: 1.05;
}

.status-card p,
.legal-card p {
  color: #c7d1d7;
}

.status-card .hero-actions {
  justify-content: center;
  margin: 24px 0 0;
}

.legal-card h2 {
  margin: 24px 0 8px;
  font-size: 20px;
}

.legal-card .btn {
  margin-top: 18px;
}

@media (max-width: 980px) {
  .nav-shell {
    grid-template-columns: 200px auto;
  }

  .brand img { width: 190px; }
  .menu-toggle { display: block; justify-self: end; }
  .nav-cta { display: none; }

  .site-nav {
    position: fixed;
    inset: 72px 0 auto;
    display: none;
    flex-direction: column;
    gap: 0;
    padding: 18px 20px 30px;
    background: rgba(2,7,13,.98);
    border-bottom: 1px solid var(--line);
  }

  .site-nav a {
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
  }

  .site-nav.is-open { display: flex; }

  .hero-grid,
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .hero-copy {
    width: min(620px, 100%);
    justify-items: center;
    text-align: center;
    margin: 0 auto;
  }

  .hero-visual {
    justify-self: center;
    width: min(500px, 92vw);
    transform: none;
  }

  .dashboard-card {
    max-width: 680px;
    margin: 0 auto;
  }

  .problem-grid,
  .case-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .problem-grid article:last-child {
    grid-column: 1 / -1;
    width: calc(50% - 7px);
    justify-self: center;
  }

  .solution-grid {
    grid-template-columns: 1fr;
  }

  .contact-band h2,
  .contact-panel {
    margin-left: 0;
  }

  .contact-band h2 {
    margin-bottom: 24px;
  }

  .contact-panel,
  .contact-form {
    width: min(680px, 100%);
    margin-inline: auto;
  }

  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-bottom {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}

@media (max-width: 680px) {
  .container { width: min(100% - 24px, 1120px); }
  .nav-shell {
    height: 64px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
  }
  .brand img { width: 176px; }
  .menu-toggle {
    width: 40px;
    height: 40px;
  }
  .site-nav {
    inset: 64px 0 auto;
    padding: 10px 18px 20px;
  }
  .site-nav a { padding: 14px 0; }
  .hero { padding: 34px 0 42px; }
  .hero-grid { gap: 30px; }
  .hero-copy { width: 100%; }
  .eyebrow {
    max-width: 100%;
    justify-content: center;
    margin-bottom: 18px;
    padding: 7px 10px;
    font-size: 10px;
    line-height: 1.3;
    text-align: center;
  }
  .hero-visual {
    width: min(360px, 94vw);
    margin-top: -4px;
  }
  .hero-actions {
    width: 100%;
    display: grid;
    gap: 12px;
    margin-bottom: 28px;
  }
  .hero-actions .btn { width: 100%; }
  .btn { min-height: 48px; padding: 0 14px; }
  .productivity-line {
    width: 100%;
    padding: 14px 14px 14px 18px;
  }
  .dashboard-card {
    grid-template-columns: 42px 1fr;
    min-height: auto;
  }
  .assistant-card {
    grid-column: 1 / -1;
    margin: 0 12px 12px;
  }
  .dash-stats { grid-template-columns: repeat(2, 1fr); }
  .chart-line { width: 130px; }
  .problem-grid,
  .case-grid,
  .form-grid,
  .footer-grid {
    grid-template-columns: 1fr;
  }
  .problem-strip { padding: 30px 0; }
  .solutions { padding: 30px 0; }
  .problem-grid {
    gap: 10px;
  }
  .problem-grid article {
    min-height: 68px;
    padding: 12px 14px;
  }
  .problem-grid article:last-child {
    grid-column: auto;
    width: auto;
    justify-self: stretch;
  }
  .solution-card {
    min-height: auto;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 0 14px;
    padding: 18px 16px;
  }
  .icon-box {
    width: 46px;
    height: 46px;
  }
  .icon-box svg { width: 26px; }
  .solution-card h3 { font-size: 16px; }
  .solution-card li { font-size: 13px; }
  .solution-card a { font-size: 14px; }
  .contact-band { padding: 34px 0 28px; }
  .data-wave { height: 104px; }
  .contact-band h2 {
    margin-bottom: 22px;
    line-height: 1.06;
  }
  .contact-grid { gap: 20px; }
  .contact-panel,
  .contact-form {
    padding: 18px;
  }
  .contact-panel h3,
  .contact-form h3 { font-size: 20px; }
  .contact-intro {
    margin-bottom: 16px;
    font-size: 14px;
  }
  .contact-list a {
    min-height: 56px;
    padding: 9px 10px;
  }
  .contact-list small {
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 12px;
  }
  .faq button {
    min-height: 44px;
    height: auto;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.35;
  }
  .faq p {
    font-size: 12px;
    line-height: 1.5;
  }
  .contact-form { box-shadow: 0 14px 42px rgba(0,0,0,.24); }
  .form-grid { gap: 10px; }
  input,
  select,
  textarea {
    min-height: 44px;
    font-size: 16px;
  }
  textarea { min-height: 104px; }
  fieldset {
    display: grid;
    gap: 9px;
    margin: 14px 0;
  }
  .privacy { line-height: 1.45; }
  .site-footer { padding: 22px 0 14px; }
  .footer-grid {
    gap: 20px;
  }
  .footer-grid > div:first-child { grid-column: 1 / -1; }
  .footer-grid img { width: 178px; }
  .footer-grid p {
    margin-bottom: 0;
    font-size: 13px;
  }
  .footer-action .btn {
    width: 100%;
    min-height: 42px;
  }
  .footer-bottom {
    display: grid;
    gap: 10px;
    margin-top: 18px;
    padding-top: 14px;
    font-size: 11px;
  }
  h1 { font-size: 36px; line-height: 1.04; }
  .hero-text { font-size: 15px; line-height: 1.58; }
  .productivity-line { font-size: 13px; }
  .problem-strip h2,
  .solutions h2,
  .cases h2 { font-size: 20px; }
  .contact-band h2 { font-size: 30px; }
}

@media (max-width: 420px) {
  h1 { font-size: 34px; }
  .hero-text { font-size: 14px; }
  .hero-visual { width: 100%; }
  .contact-band h2 { font-size: 28px; }
}