:root {
  --bg: #090e1d;
  --bg-2: #111a33;
  --card: rgba(255,255,255,.075);
  --card-strong: rgba(255,255,255,.11);
  --border: rgba(255,255,255,.14);
  --text: #f8fbff;
  --muted: #aeb9d6;
  --accent: #6ee7b7;
  --accent-2: #60a5fa;
  --shadow: 0 24px 80px rgba(0,0,0,.32);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
.enquiry-panel { max-width:760px; margin:40px auto 0; text-align:left; }
.enquiry-panel form { display:grid; gap:20px; padding:clamp(20px,4vw,36px); border:1px solid var(--border); border-radius:20px; background:var(--card); }
.enquiry-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.enquiry-panel label { display:block; margin-bottom:8px; font-weight:600; }
.enquiry-panel input,.enquiry-panel select,.enquiry-panel textarea { width:100%; min-width:0; font:inherit; color:var(--text); background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:12px; }
.enquiry-panel textarea { resize:vertical; }
.enquiry-panel .form-note { font-size:14px; color:var(--muted); }
.enquiry-panel button:disabled { opacity:.6; cursor:wait; }
.enquiry-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@media(max-width:540px) { .enquiry-grid { grid-template-columns:1fr; } }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 10% 0%, rgba(96,165,250,.28), transparent 35%),
    radial-gradient(circle at 90% 10%, rgba(110,231,183,.20), transparent 35%),
    linear-gradient(135deg, var(--bg), #0d1326 50%, #172554);
  min-height: 100vh;
}

a { color: inherit; }

.nav {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px clamp(18px, 5vw, 64px);
  backdrop-filter: blur(18px);
  background: rgba(9, 14, 29, .72);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.brand {
  text-decoration: none;
  font-weight: 900;
  letter-spacing: -.04em;
  font-size: 20px;
}

.nav-links { display: flex; gap: 18px; color: var(--muted); font-size: 14px; }
.nav-links a { text-decoration: none; }
.nav-links a:hover { color: var(--text); }

.lang-switch { display: flex; gap: 6px; padding: 4px; border: 1px solid var(--border); border-radius: 999px; }
.lang-switch button {
  border: 0;
  background: transparent;
  color: var(--muted);
  padding: 7px 10px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 800;
}
.lang-switch button.active { background: var(--accent); color: #062015; }

.section { max-width: 1160px; margin: 0 auto; padding: 86px 22px; }
.hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: 42px; align-items: center; padding-top: 110px; }
.eyebrow { color: var(--accent); font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: 13px; margin: 0 0 14px; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(42px, 7vw, 76px); line-height: .94; letter-spacing: -.07em; margin-bottom: 24px; }
h2 { font-size: clamp(30px, 4vw, 48px); line-height: 1.04; letter-spacing: -.05em; }
h3 { font-size: 22px; letter-spacing: -.02em; }
p, li, .step span { color: var(--muted); line-height: 1.65; font-size: 17px; }
.lead { font-size: 21px; max-width: 760px; }
.actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.actions.centered { justify-content: center; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 13px 18px; border-radius: 14px; text-decoration: none; font-weight: 850; }
.btn.primary { background: var(--accent); color: #052015; }
.btn.ghost { background: rgba(255,255,255,.07); border: 1px solid var(--border); color: var(--text); }
.hero-card, .card, .offer, .contact {
  background: linear-gradient(180deg, var(--card-strong), var(--card));
  border: 1px solid var(--border);
  border-radius: 28px;
  box-shadow: var(--shadow);
}
.hero-card { padding: 30px; }
.badge { display: inline-block; background: rgba(96,165,250,.18); border: 1px solid rgba(96,165,250,.35); color: #bfdbfe; padding: 7px 11px; border-radius: 999px; font-weight: 800; margin-bottom: 20px; }
.hero-card ul, .checklist { padding-left: 20px; }
.hero-card li, .checklist li { margin: 10px 0; }
.section-head { max-width: 820px; margin-bottom: 28px; }
.cards { display: grid; gap: 18px; }
.cards.three { grid-template-columns: repeat(3, 1fr); }
.card { padding: 24px; }
.card p { font-size: 16px; }
.split { display: grid; grid-template-columns: .9fr 1.1fr; gap: 30px; align-items: center; }
.workflow { display: grid; gap: 12px; }
.workflow div, .step {
  background: rgba(255,255,255,.065);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  padding: 18px;
}
.workflow div { font-weight: 850; }
.steps { counter-reset: step; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.step { position: relative; padding-top: 54px; }
.step:before {
  counter-increment: step;
  content: counter(step);
  position: absolute;
  top: 16px;
  left: 16px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--accent-2);
  color: #08142d;
  font-weight: 900;
}
.step strong { display: block; margin-bottom: 8px; }
.offer { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding: 34px; }
.contact { text-align: center; padding: 48px 28px; }
.contact p { max-width: 760px; margin-left: auto; margin-right: auto; }
.footer { display: flex; justify-content: space-between; gap: 20px; color: var(--muted); border-top: 1px solid rgba(255,255,255,.1); padding: 28px clamp(18px, 5vw, 64px); }

@media (max-width: 900px) {
  .nav { align-items: flex-start; flex-direction: column; }
  .nav-links { flex-wrap: wrap; }
  .hero, .split, .offer { grid-template-columns: 1fr; }
  .cards.three, .steps { grid-template-columns: 1fr; }
  .hero { padding-top: 60px; }
  .footer { flex-direction: column; }
}

/* Responsive layout shared by homepage, contact, and the interactive demo. */
.payload-details{margin-top:24px}.payload-details summary{cursor:pointer;min-height:44px;padding-block:10px;color:var(--accent)}
:root{--page-gutter:clamp(20px,5vw,64px)}
html{scroll-padding-top:105px}body{background:#101e2e}h1{font-size:clamp(34px,5.4vw,66px);line-height:1.1;letter-spacing:-.045em;text-wrap:balance}h2{line-height:1.16;letter-spacing:-.03em}img{display:block;width:100%;height:auto}a,button{touch-action:manipulation}:focus-visible{outline:3px solid #91f0cf;outline-offset:5px}.skip-link{position:fixed;left:20px;top:-90px;z-index:99;background:#fff;color:#101e2e;padding:14px}.skip-link:focus{top:12px}.section{width:calc(100% - var(--page-gutter) * 2);max-width:1160px;padding:64px 0}.section>*{min-width:0}.section.contact{padding:clamp(24px,5vw,48px);margin-bottom:48px}.hero{gap:40px;padding-top:70px}.hero-card,.card,.offer,.contact{background:#192b3e;box-shadow:none}.hero-photo{margin:0}.hero-photo img{aspect-ratio:4/3;object-fit:cover;border-radius:22px}.hero-photo figcaption{font-size:11px;color:#aeb9d6;margin-top:10px}.hero-caption{padding:22px 0}.hero-caption p{font-size:15px;margin:0}.nav{padding-inline:var(--page-gutter);background:#101e2e}.nav-links{align-items:center}.nav-links a{min-height:44px;display:flex;align-items:center}.menu-toggle{display:none;background:transparent;color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px 16px;min-height:44px;font:inherit}.lead{font-size:19px}.btn{font-weight:700;max-width:100%;text-align:center;line-height:1.45}.btn:hover{filter:brightness(1.09)}.demo-hero{gap:12px;padding-top:54px}.demo-shell{gap:24px}.code-box{max-width:100%;overflow-wrap:anywhere}.ticket-field strong{overflow-wrap:anywhere}.field input,.field select,.field textarea{min-width:0;font-size:16px}.mini-card,.demo-panel,.ticket-panel{background:#192b3e;box-shadow:none}.reveal{animation:arrival .65s ease-out both}@keyframes arrival{from{opacity:.2;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:900px){.hero{grid-template-columns:1fr}.nav{flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px}.brand{font-size:18px}.js .menu-toggle{display:block}.nav-links{width:100%;gap:8px 20px;border-top:1px solid var(--border);padding-top:12px}.js .nav-links:not(.is-open){display:none}.section{padding-block:44px}.section.contact{padding:24px}.demo-shell{grid-template-columns:1fr}.demo-panel,.ticket-panel{padding:22px}.hero-photo{max-width:720px}.before-after{grid-template-columns:1fr}.footer{padding-inline:var(--page-gutter);overflow-wrap:anywhere}}
@media(max-width:420px){.actions,.demo-actions{display:grid;grid-template-columns:1fr}.actions .btn,.demo-actions .btn{width:100%}.hero-card,.card{padding:22px}.lead{font-size:17px}.demo-panel,.ticket-panel,.mini-card{padding:20px;border-radius:18px}.ticket-grid{grid-template-columns:1fr}.ticket-field{padding:12px}.hero{gap:24px}.nav .brand{font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
