:root {
  --bg: #f7f9fc;
  --bg-2: #fbfcfe;
  --surface: #ffffff;
  --surface-soft: #f4f7fb;
  --text: #0b1324;
  --muted: #607086;
  --muted-2: #8d9aab;
  --line: #e3e9f2;
  --line-strong: #d4dce8;
  --blue: #2563eb;
  --blue-dark: #1d4ed8;
  --blue-soft: #eaf2ff;
  --cyan: #06b6d4;
  --violet: #7c3aed;
  --emerald: #059669;
  --orange: #ea580c;
  --red: #dc2626;
  --shadow-sm: 0 8px 30px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 18px 50px rgba(15, 23, 42, 0.10);
  --shadow-lg: 0 34px 90px rgba(30, 64, 175, 0.16);
  --radius: 22px;
  --radius-lg: 32px;
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 70% -10%, rgba(37, 99, 235, .07), transparent 34rem),
    linear-gradient(180deg, #fbfdff 0, var(--bg) 54rem, #fff 100%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

button, input, textarea, select { font: inherit; }
a { color: inherit; text-decoration: none; }
svg { display: block; }
::selection { background: rgba(37, 99, 235, .18); }

.skip-link {
  position: fixed; left: 16px; top: -80px; z-index: 9999;
  background: #fff; color: var(--text); border: 1px solid var(--line);
  border-radius: 12px; padding: 10px 14px; box-shadow: var(--shadow-md);
  transition: top .2s ease;
}
.skip-link:focus { top: 16px; }

.page-noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 1000; opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.section-pad { padding: 116px 0; }

.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(250, 252, 255, .82);
  border-bottom: 1px solid rgba(221, 229, 240, .82);
  backdrop-filter: blur(18px) saturate(1.25);
  -webkit-backdrop-filter: blur(18px) saturate(1.25);
}
.nav-wrap { min-height: 74px; display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-family: Manrope, Inter, sans-serif; flex-shrink: 0; }
.brand-mark {
  width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px;
  color: var(--blue); background: linear-gradient(145deg, #fff, #edf4ff); border: 1px solid #d9e6fb;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 7px 20px rgba(37,99,235,.08);
}
.brand-mark svg { width: 28px; height: 28px; }
.brand-name { font-size: 18px; font-weight: 600; letter-spacing: -.025em; }
.brand-name b { font-weight: 800; }
.desktop-nav { margin-left: auto; display: flex; align-items: center; gap: 28px; }
.desktop-nav a, .nav-ghost { font-size: 14px; font-weight: 600; color: #526177; transition: color .2s ease; }
.desktop-nav a:hover, .nav-ghost:hover { color: var(--blue); }
.nav-actions { display: flex; align-items: center; gap: 16px; }
.mobile-menu-button { display: none; margin-left: auto; width: 40px; height: 40px; border: 0; background: transparent; cursor: pointer; }
.mobile-menu-button span { display: block; width: 20px; height: 2px; margin: 4px auto; background: var(--text); border-radius: 2px; transition: .2s ease; }
.mobile-menu { padding: 0 0 18px; display: grid; gap: 2px; }
.mobile-menu[hidden] { display: none !important; }
.mobile-menu a { padding: 11px 2px; border-bottom: 1px solid var(--line); font-weight: 600; color: var(--muted); }

.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  min-height: 48px; padding: 0 20px; border-radius: 14px; border: 1px solid transparent;
  font-size: 14px; font-weight: 700; letter-spacing: -.01em; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  cursor: pointer;
}
.button svg { width: 18px; height: 18px; }
.button:hover { transform: translateY(-1px); }
.button-small { min-height: 42px; padding: 0 16px; border-radius: 12px; }
.button-large { min-height: 54px; padding: 0 22px; border-radius: 15px; font-size: 15px; }
.button-primary {
  color: #fff; background: linear-gradient(135deg, #2f6ff0, #2357d6);
  border-color: #2a5ed8; box-shadow: 0 10px 24px rgba(37, 99, 235, .22), inset 0 1px 0 rgba(255,255,255,.23);
}
.button-primary:hover { box-shadow: 0 14px 30px rgba(37, 99, 235, .28), inset 0 1px 0 rgba(255,255,255,.23); }
.button-secondary { color: #172033; background: rgba(255,255,255,.78); border-color: var(--line-strong); box-shadow: 0 8px 24px rgba(15,23,42,.04); }
.button-secondary:hover { background: #fff; border-color: #c2cedd; box-shadow: 0 12px 30px rgba(15,23,42,.08); }
.button-white { background: #fff; color: #173b93; box-shadow: 0 15px 30px rgba(5, 20, 60, .18); }
.button-glass { color: #fff; border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.button-glass:hover { background: rgba(255,255,255,.16); }
.button-block { width: 100%; }

.hero { position: relative; padding-top: 92px; padding-bottom: 86px; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 60px; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 9px; min-height: 34px; padding: 0 12px 0 10px;
  border: 1px solid #dbe5f3; border-radius: 999px; background: rgba(255,255,255,.78); box-shadow: 0 5px 20px rgba(15,23,42,.04);
  color: #526177; font-size: 12px; font-weight: 700;
}
.eyebrow svg { width: 14px; height: 14px; }
.eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.1); }
.hero h1 { margin: 22px 0 0; max-width: 720px; font-family: Manrope, Inter, sans-serif; font-size: clamp(48px, 5vw, 72px); line-height: 1.02; letter-spacing: -.055em; font-weight: 800; }
.gradient-text { color: transparent; background: linear-gradient(100deg, #1d4ed8 0%, #2563eb 35%, #7c3aed 78%, #2563eb 100%); background-size: 180% 100%; -webkit-background-clip: text; background-clip: text; animation: gradientShift 9s ease-in-out infinite; }
@keyframes gradientShift { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
.hero-lead { margin: 24px 0 0; max-width: 660px; color: #5c6c82; font-size: 18px; line-height: 1.75; letter-spacing: -.015em; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 30px; color: #66758a; font-size: 12px; font-weight: 600; }
.trust-row span { display: inline-flex; align-items: center; gap: 8px; }
.trust-icon { width: 8px; height: 8px; border-radius: 50%; }
.trust-green { background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.1); }
.trust-blue { background: #3b82f6; box-shadow: 0 0 0 4px rgba(59,130,246,.1); }
.trust-violet { background: #8b5cf6; box-shadow: 0 0 0 4px rgba(139,92,246,.1); }

.hero-visual { position: relative; min-height: 640px; display: flex; align-items: center; justify-content: center; perspective: 1300px; }
.hero-visual::before {
  content: ""; position: absolute; width: 480px; height: 480px; border-radius: 50%;
  background: radial-gradient(circle, rgba(64, 125, 255, .16), rgba(139, 92, 246, .06) 46%, transparent 70%);
  filter: blur(6px); transform: translate(20px, 5px);
}
.hero-visual::after {
  content: ""; position: absolute; width: 500px; height: 500px; border-radius: 40%;
  border: 1px solid rgba(59, 130, 246, .09); transform: rotate(12deg); opacity: .6;
}
.hero-glow { position: absolute; border-radius: 999px; filter: blur(55px); opacity: .25; }
.glow-a { width: 180px; height: 180px; background: #60a5fa; right: 8%; top: 12%; }
.glow-b { width: 150px; height: 150px; background: #a78bfa; left: 10%; bottom: 12%; }
.phone { position: absolute; z-index: 3; }
.phone-front { width: 300px; transform: translate(54px, 5px) rotate(4deg); animation: floatPhone 7s ease-in-out infinite; }
.phone-back { width: 254px; transform: translate(-126px, 16px) rotate(-10deg) scale(.95); opacity: .95; z-index: 2; animation: floatBack 8s ease-in-out infinite; }
@keyframes floatPhone { 0%,100%{transform:translate(54px,5px) rotate(4deg)} 50%{transform:translate(54px,-8px) rotate(3deg)} }
@keyframes floatBack { 0%,100%{transform:translate(-126px,16px) rotate(-10deg) scale(.95)} 50%{transform:translate(-126px,5px) rotate(-9deg) scale(.95)} }
.phone-frame { position: relative; padding: 9px; border-radius: 43px; background: linear-gradient(145deg, #151b27, #070a10); box-shadow: 0 35px 75px rgba(5, 13, 30, .30), 0 10px 30px rgba(37,99,235,.14), inset 0 0 0 1px rgba(255,255,255,.13); }
.phone-frame::before { content:""; position:absolute; inset:3px; border-radius:40px; border:1px solid rgba(255,255,255,.12); pointer-events:none; }
.phone-island { position:absolute; top:18px; left:50%; transform:translateX(-50%); width:84px; height:22px; background:#05080d; border-radius:999px; z-index:5; box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); }
.app-screen, .scanner-screen { position: relative; min-height: 585px; overflow: hidden; border-radius: 35px; background: #f7f9fc; }
.phone-status { height: 42px; padding: 13px 18px 0; display:flex; justify-content:space-between; color:#0f172a; font-size:9px; font-weight:800; letter-spacing:.02em; }
.app-head { display:flex; align-items:center; justify-content:space-between; padding: 10px 17px 12px; }
.app-head small { display:block; color:#8794a5; font-size:9px; margin-bottom:2px; }
.app-head strong { display:block; font-family:Manrope; font-size:14px; letter-spacing:-.03em; }
.avatar { width:31px; height:31px; display:grid; place-items:center; border-radius:10px; color:#fff; background:linear-gradient(145deg,#2563eb,#7c3aed); font-size:11px; font-weight:800; box-shadow:0 8px 16px rgba(37,99,235,.18); }
.summary-card { margin: 0 14px; padding:15px; border-radius:18px; color:#fff; background:linear-gradient(145deg,#1f5bd6,#295ee8 45%,#6859dc); box-shadow:0 16px 28px rgba(37,99,235,.20); }
.summary-row { display:flex; justify-content:space-between; align-items:center; font-size:9px; font-weight:700; opacity:.95; }
.live-dot { display:inline-flex; align-items:center; gap:5px; padding:3px 7px; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.12); border-radius:999px; font-size:8px; }
.summary-main { display:flex; align-items:flex-end; gap:9px; margin:11px 0 9px; }
.summary-main b { font-size:31px; line-height:1; font-family:Manrope; letter-spacing:-.05em; }
.summary-main span { font-size:8px; line-height:1.3; opacity:.8; padding-bottom:2px; }
.summary-bars { display:flex; gap:4px; height:25px; align-items:flex-end; }
.summary-bars i { flex:1; border-radius:4px 4px 2px 2px; background:rgba(255,255,255,.25); }
.summary-bars i:nth-child(1){height:35%}.summary-bars i:nth-child(2){height:52%}.summary-bars i:nth-child(3){height:45%}.summary-bars i:nth-child(4){height:80%}.summary-bars i:nth-child(5){height:66%}.summary-bars i:nth-child(6){height:90%}.summary-bars i:nth-child(7){height:72%}
.summary-foot { display:flex; justify-content:space-between; margin-top:8px; font-size:7.5px; opacity:.82; }
.summary-foot b { color:#fff; }
.app-section-title { display:flex; align-items:center; justify-content:space-between; padding:18px 16px 8px; font-size:9px; }
.app-section-title b { font-size:11px; }.app-section-title span{color:#2563eb;font-weight:700}
.product-row { display:flex; align-items:center; gap:9px; margin:6px 13px; padding:9px; border-radius:13px; background:#fff; border:1px solid #e8edf4; box-shadow:0 4px 13px rgba(15,23,42,.035); }
.product-thumb { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; font-size:10px; font-weight:800; }
.thumb-red{background:#fff0f0;color:#dc2626}.thumb-amber{background:#fff7e8;color:#d97706}.thumb-blue{background:#eef5ff;color:#2563eb}
.product-copy { min-width:0; flex:1; }.product-copy b{display:block;font-size:9px}.product-copy small{display:block;color:#9aa6b5;font-size:6.5px;margin-top:2px}
.days { width:31px; height:31px; display:grid; place-items:center; align-content:center; border-radius:9px; }.days b{font-size:10px;line-height:1}.days small{font-size:5.5px;margin-top:1px}.days-red{background:#fff0f0;color:#dc2626}.days-amber{background:#fff7e8;color:#d97706}.days-blue{background:#eef5ff;color:#2563eb}
.muted-row{opacity:.76}
.bottom-nav { position:absolute; left:0; right:0; bottom:0; height:58px; display:flex; align-items:flex-end; justify-content:space-around; padding:8px 8px 7px; background:rgba(255,255,255,.96); border-top:1px solid #e8edf4; }
.bottom-nav span{width:42px; display:grid; justify-items:center; gap:3px; font-size:5.5px; color:#99a4b2}.bottom-nav i{display:block;width:13px;height:13px;border:2px solid currentColor;border-radius:4px}.bottom-nav .active{color:#2563eb}.bottom-nav .scan-button{transform:translateY(-13px);width:36px;height:36px;border-radius:13px;background:linear-gradient(145deg,#2a65e5,#704bd7);box-shadow:0 8px 16px rgba(37,99,235,.25)}.bottom-nav .scan-button i{width:15px;height:15px;border-color:#fff;border-radius:4px;margin:auto}

.scanner-screen { background: linear-gradient(180deg,#111827,#0b1220); color:#fff; }
.scanner-screen .phone-status { color:#fff; opacity:.8; }
.scanner-top { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:8px 16px 16px; font-size:10px; }.mini-back{font-size:20px;opacity:.7}.scanner-top b{font-size:11px}
.scanner-window { position:relative; height:330px; margin:8px 15px; border-radius:20px; background:radial-gradient(circle at 45% 25%,#40526e,#1c2a3d 44%,#0b111c); overflow:hidden; box-shadow:inset 0 0 60px rgba(0,0,0,.4); }
.scanner-corners::before,.scanner-corners::after{content:"";position:absolute;inset:42px;border:2px solid rgba(255,255,255,.9);border-top-color:#60a5fa;border-bottom-color:#60a5fa;border-radius:18px;opacity:.75}
.scanner-corners::after{inset:52px;border-color:transparent;border-left:2px solid rgba(96,165,250,.7);border-right:2px solid rgba(96,165,250,.7);}
.scanner-line { position:absolute; left:45px; right:45px; top:48%; height:2px; background:#60a5fa; box-shadow:0 0 12px #60a5fa; animation:scanLine 2.5s ease-in-out infinite; }
@keyframes scanLine{0%,100%{top:32%;opacity:.55}50%{top:68%;opacity:1}}
.barcode-bars { position:absolute; width:92px; height:38px; left:50%; top:52%; transform:translate(-50%,-50%); background:repeating-linear-gradient(90deg,#f8fafc 0 2px,transparent 2px 4px,#f8fafc 4px 5px,transparent 5px 8px); opacity:.7; }
.scanner-hint{text-align:center;font-size:7px;color:#a5b4cc;margin-top:20px}

.floating-card { position:absolute; z-index:10; display:flex; align-items:center; gap:10px; min-width:190px; padding:10px 12px; border:1px solid rgba(219,228,241,.9); border-radius:16px; background:rgba(255,255,255,.88); backdrop-filter:blur(16px); box-shadow:0 16px 36px rgba(20,44,89,.12); }
.floating-card b{display:block;font-size:10px;letter-spacing:-.01em}.floating-card small{display:block;color:#8a98aa;font-size:7px;margin-top:2px}.float-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;flex-shrink:0}.float-icon svg{width:17px;height:17px}.float-blue{color:#2563eb;background:#eaf2ff}.float-violet{color:#7c3aed;background:#f1eaff}.float-orange{color:#ea580c;background:#fff2e8}
.sync-card{right:-3px;top:88px;animation:floatCard 5.5s ease-in-out infinite}.scan-card{left:-2px;top:210px;animation:floatCard 6.2s ease-in-out .5s infinite}.alert-card{right:-18px;bottom:84px;animation:floatCard 6s ease-in-out 1s infinite}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

.proof-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.72); }
.proof-grid { display:grid; grid-template-columns:1.45fr repeat(3,1fr); align-items:center; min-height:116px; }
.proof-copy { padding-right:30px; }.proof-copy span,.proof-copy strong{display:block}.proof-copy span{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.08em}.proof-copy strong{margin-top:4px;font-family:Manrope;font-size:19px;letter-spacing:-.03em}
.proof-item { min-height:68px; padding:0 22px; border-left:1px solid var(--line); display:flex; align-items:center; gap:12px; }.proof-item b{font-family:Manrope;color:#9aa6b5;font-size:12px}.proof-item span{font-weight:700;font-size:13px;color:#3f4d62}

.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:52px; }
.section-head.center { display:block; text-align:center; max-width:820px; margin-inline:auto; margin-bottom:54px; }
.section-kicker { display:inline-block; margin-bottom:12px; color:var(--blue); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.section-head h2,.showcase-copy h2,.faq-intro h2 { margin:0; font-family:Manrope,Inter,sans-serif; font-size:clamp(34px,4vw,50px); line-height:1.08; letter-spacing:-.045em; font-weight:800; }
.section-head h2 span,.showcase-copy h2 span,.faq-intro h2 span { color:#8390a3; }
.section-head p { max-width:470px; margin:0; color:var(--muted); font-size:15px; line-height:1.75; }
.section-head.center p { max-width:650px; margin:18px auto 0; }

.features { background:linear-gradient(180deg,#fff 0%,#f8faff 100%); }
.bento-grid { display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:minmax(270px,auto); gap:16px; }
.bento-card { position:relative; overflow:hidden; padding:28px; border:1px solid #dfe6ef; border-radius:var(--radius); background:rgba(255,255,255,.88); box-shadow:0 12px 35px rgba(15,23,42,.045); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.bento-card:hover { transform:translateY(-3px); border-color:#cbd7e8; box-shadow:0 18px 45px rgba(15,23,42,.075); }
.bento-large { grid-column:span 2; min-height:360px; display:grid; grid-template-columns:1fr .9fr; gap:28px; align-items:end; }
.bento-wide { grid-column:span 2; display:grid; grid-template-columns:1fr .95fr; gap:26px; align-items:center; }
.bento-blue { background:radial-gradient(circle at 85% 15%,rgba(72,125,255,.16),transparent 48%),linear-gradient(145deg,#fbfdff,#f4f8ff); }
.bento-card h3 { margin:8px 0 0; font-family:Manrope; font-size:22px; line-height:1.18; letter-spacing:-.035em; }
.bento-large h3 { font-size:31px; }.bento-card p{margin:12px 0 0;color:var(--muted);font-size:13px;line-height:1.7}.bento-large p{max-width:500px}
.feature-icon,.step-icon,.price-icon { width:44px;height:44px;display:grid;place-items:center;border-radius:13px;margin-bottom:18px }.feature-icon svg,.step-icon svg,.price-icon svg{width:21px;height:21px}.icon-blue{background:#e9f1ff;color:#2563eb}.icon-violet{background:#f2ebff;color:#7c3aed}.icon-emerald{background:#e9fbf5;color:#059669}.icon-orange{background:#fff0e7;color:#ea580c}.icon-slate{background:#edf1f6;color:#475569}
.mini-label { display:block;color:#8a97a9;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em }
.barcode-demo { align-self:stretch; padding:18px; border:1px solid rgba(202,215,233,.9); border-radius:18px; background:rgba(255,255,255,.86); box-shadow:0 18px 36px rgba(37,99,235,.08); transform:rotate(1.2deg); }
.barcode-top{display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:800}.success-pill{padding:5px 7px;border-radius:999px;color:#059669;background:#eafaf4;font-size:7px}.barcode-product{display:flex;align-items:center;gap:10px;margin:18px 0 16px;padding:12px;border-radius:13px;background:#f7f9fc}.barcode-thumb{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#eaf2ff}.barcode-product div:nth-child(2){flex:1}.barcode-product b{display:block;font-size:9px}.barcode-product small{display:block;margin-top:2px;font-size:6.5px;color:#95a2b3}.barcode-check{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;color:#fff;background:#10b981;font-size:10px}.barcode-code{height:48px;display:flex;align-items:stretch;gap:2px;overflow:hidden}.barcode-code i{width:3px;background:#111827}.barcode-code i:nth-child(2n){width:1px}.barcode-code i:nth-child(3n){width:5px}.barcode-code i:nth-child(5n){height:85%}
.date-read-demo{position:absolute;left:28px;right:28px;bottom:24px;display:flex;align-items:center;gap:9px;padding:13px 15px;border:1px solid #e0e6ef;border-radius:14px;background:#f8f9fc}.date-read-demo span{font-size:9px;color:#7c3aed;font-weight:800}.date-read-demo b{font-family:Manrope;font-size:18px;letter-spacing:.03em;flex:1}.date-read-demo i{width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:#e9fbf5;color:#059669;font-style:normal;font-size:11px}
.avatars{position:absolute;left:28px;bottom:28px;display:flex;align-items:center}.avatars span{width:35px;height:35px;display:grid;place-items:center;margin-right:-8px;border:3px solid #fff;border-radius:50%;background:linear-gradient(145deg,#dbe8ff,#f0eaff);color:#345; font-size:9px;font-weight:800}.avatars span:nth-child(2){background:linear-gradient(145deg,#ffe8d9,#fff4ed)}.avatars span:nth-child(3){background:linear-gradient(145deg,#dbf7ec,#f3fffb)}.avatars span:last-child{background:#111827;color:#fff}
.notifications-demo{display:grid;gap:9px}.notifications-demo>div{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid #e5eaf1;border-radius:13px;background:#fbfcfe}.notifications-demo span{flex:1}.notifications-demo b{display:block;font-size:9px}.notifications-demo small{display:block;font-size:6.5px;color:#929faf;margin-top:2px}.notifications-demo em{font-size:6.5px;color:#9aa6b4;font-style:normal}.notif-dot{width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 4px rgba(0,0,0,.03)}.notif-dot.red{background:#ef4444}.notif-dot.amber{background:#f59e0b}.notif-dot.blue{background:#3b82f6}
.offline-chip{position:absolute;left:28px;bottom:28px;display:inline-flex;align-items:center;gap:8px;padding:9px 11px;border-radius:999px;background:#f1f5f9;color:#475569;font-size:9px;font-weight:800}.offline-chip span{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.1)}

.how { background:#f7f9fc; border-top:1px solid #edf1f6; border-bottom:1px solid #edf1f6; }
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.step-card{position:relative;padding:26px 22px 24px;border:1px solid #e0e6ef;border-radius:20px;background:#fff;box-shadow:0 10px 30px rgba(15,23,42,.04)}.step-number{position:absolute;right:19px;top:17px;font-family:Manrope;font-size:11px;font-weight:800;color:#a3afbd}.step-icon{margin:0 0 28px}.step-card h3{margin:0;font-family:Manrope;font-size:17px;letter-spacing:-.03em}.step-card p{margin:10px 0 0;color:var(--muted);font-size:12px;line-height:1.65}

.showcase { background:#fff; }
.showcase-grid{display:grid;grid-template-columns:.84fr 1.16fr;align-items:center;gap:90px}.showcase-copy p{margin:22px 0 0;max-width:560px;color:var(--muted);font-size:15px;line-height:1.75}.check-list{list-style:none;padding:0;margin:28px 0;display:grid;gap:12px}.check-list li{display:flex;gap:10px;align-items:center;color:#405067;font-size:13px;font-weight:600}.check-list li span{width:22px;height:22px;display:grid;place-items:center;border-radius:7px;background:#eaf2ff;color:#2563eb;font-size:10px;font-weight:900}.text-link{display:inline-flex;gap:8px;align-items:center;color:var(--blue);font-size:13px;font-weight:800}.text-link span{transition:transform .2s ease}.text-link:hover span{transform:translateX(3px)}
.showcase-board{position:relative;min-height:570px;border:1px solid #dfe6ef;border-radius:32px;background:radial-gradient(circle at 40% 15%,rgba(37,99,235,.09),transparent 28rem),#f7f9fc;overflow:hidden;box-shadow:0 24px 70px rgba(15,23,42,.08)}.showcase-grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(49,76,118,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(49,76,118,.055) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,black,transparent 95%)}
.mini-phone{position:absolute;width:238px;height:445px;padding:12px;border-radius:30px;background:#fff;border:1px solid #d7dfeb;box-shadow:0 24px 55px rgba(15,23,42,.15);overflow:hidden}.mp-one{left:10%;top:82px;transform:rotate(-7deg)}.mp-two{right:8%;top:42px;transform:rotate(8deg)}.mp-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:10px 7px 14px}.mp-head span{width:22px;height:22px;border-radius:8px;background:#eef2f7}.mp-head b{font-size:11px}.mp-search{height:32px;margin:0 4px 14px;border-radius:10px;background:#f1f4f8}.mp-row{display:flex;align-items:center;gap:9px;margin:8px 4px;padding:8px;border-radius:12px;border:1px solid #e8edf3}.mp-row>i{width:30px;height:30px;border-radius:9px}.mp-row>i.r1{background:#fff0f0}.mp-row>i.r2{background:#fff7e8}.mp-row>i.r3{background:#eef5ff}.mp-row span{flex:1}.mp-row b{display:block;font-size:8px}.mp-row small{display:block;margin-top:2px;color:#97a3b2;font-size:6px}.mp-row em{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:#f5f7fa;font-size:7px;font-style:normal;font-weight:800}.camera-preview{position:relative;height:255px;border-radius:20px;background:linear-gradient(145deg,#334155,#0f172a);overflow:hidden}.camera-preview::before{content:"";position:absolute;inset:35px;border:1.5px solid rgba(255,255,255,.6);border-radius:15px}.date-box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-2deg);padding:8px 11px;background:#f9fafb;border-radius:6px;color:#111827;box-shadow:0 8px 22px rgba(0,0,0,.24)}.date-box span{display:block;font-size:6px;font-weight:800}.date-box b{display:block;font-family:monospace;font-size:13px;letter-spacing:.06em;margin-top:2px}.scan-beam{position:absolute;left:35px;right:35px;top:42%;height:2px;background:#60a5fa;box-shadow:0 0 12px #60a5fa;animation:scanLine 2.5s ease-in-out infinite}.camera-sheet{margin-top:12px;padding:14px;border-radius:16px;background:#f5f7fa}.camera-sheet small{display:block;color:#8a98a9;font-size:7px}.camera-sheet b{display:block;margin:5px 0 12px;font-family:Manrope;font-size:19px}.camera-sheet button{width:100%;height:34px;border:0;border-radius:10px;color:#fff;background:#2563eb;font-size:8px;font-weight:800}.showcase-label{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid #dde5ef;border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 12px 25px rgba(15,23,42,.08);font-size:9px;font-weight:800}.showcase-label i{width:7px;height:7px;border-radius:50%}.label-one{left:34px;bottom:38px}.label-one i{background:#f59e0b}.label-two{right:42px;bottom:78px}.label-two i{background:#7c3aed}

.pricing { background:linear-gradient(180deg,#f8faff,#fff); border-top:1px solid #edf1f6; }
.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,470px));justify-content:center;gap:18px}.price-card{position:relative;padding:30px;border:1px solid #dfe6ef;border-radius:26px;background:#fff;box-shadow:0 16px 42px rgba(15,23,42,.055)}.price-featured{border-color:#b7caf8;box-shadow:0 24px 60px rgba(37,99,235,.12),inset 0 0 0 1px rgba(37,99,235,.06);background:radial-gradient(circle at 90% 0,rgba(124,58,237,.08),transparent 22rem),#fff}.recommended{position:absolute;right:24px;top:24px;padding:6px 9px;border-radius:999px;background:#eef2ff;color:#5b36c9;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.price-top{display:flex;align-items:center;gap:12px}.price-top .price-icon{margin:0}.price-top b{display:block;font-family:Manrope;font-size:16px}.price-top small{display:block;margin-top:3px;color:#8a97a8;font-size:9px}.price{display:flex;align-items:flex-end;gap:7px;margin:30px 0 12px}.price strong{font-family:Manrope;font-size:44px;line-height:1;letter-spacing:-.05em}.price span{padding-bottom:5px;color:#7a8798;font-size:14px;font-weight:800}.price-desc{min-height:42px;margin:0 0 20px;color:var(--muted);font-size:12px;line-height:1.7}.saving{display:flex;justify-content:space-between;align-items:center;min-height:42px;margin:-1px 0 20px;padding:9px 10px;border-radius:12px;background:#f5f3ff;color:#6d3fd6;font-size:8px}.saving span{color:#7d719f}.saving b{font-size:9px}.price-list{list-style:none;padding:18px 0;margin:0 0 24px;border-top:1px solid #edf1f6;display:grid;gap:12px}.price-list li{display:flex;gap:9px;align-items:center;color:#4a596e;font-size:11px;font-weight:600}.price-list li span{width:19px;height:19px;display:grid;place-items:center;border-radius:6px;background:#eef5ff;color:#2563eb;font-size:9px;font-weight:900}.payment-note{max-width:958px;margin:20px auto 0;display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid #e0e6ef;border-radius:15px;background:#fbfcfe}.payment-lock{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:#edf4ff;color:#2563eb}.payment-lock svg{width:17px;height:17px}.payment-note b{display:block;font-size:11px}.payment-note small{display:block;margin-top:3px;color:#8492a4;font-size:9px}.payment-note code{padding:1px 3px;border-radius:4px;background:#f0f3f7;color:#586579}

.faq { background:#fff; }
.faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:90px;align-items:start}.faq-intro{position:sticky;top:118px}.faq-intro p{margin:20px 0 24px;color:var(--muted);font-size:14px;line-height:1.75}.faq-list{border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:23px 0;font-family:Manrope;font-size:15px;font-weight:700;letter-spacing:-.02em}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{position:relative;width:24px;height:24px;flex-shrink:0;border-radius:50%;background:#f1f4f8}.faq-list summary span::before,.faq-list summary span::after{content:"";position:absolute;left:7px;right:7px;top:11px;height:2px;background:#64748b;border-radius:2px}.faq-list summary span::after{transform:rotate(90deg);transition:transform .2s ease}.faq-list details[open] summary span::after{transform:rotate(0)}.faq-list details p{max-width:720px;margin:-8px 46px 24px 0;color:#657489;font-size:13px;line-height:1.75}

.final-cta{padding:20px 0 100px;background:#fff}.final-cta-card{position:relative;overflow:hidden;min-height:310px;padding:54px 58px;border-radius:34px;background:linear-gradient(135deg,#123b9c,#245bdd 45%,#4d4ad5);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:50px;box-shadow:0 30px 80px rgba(37,99,235,.20)}.cta-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle at 50% 50%,black,transparent 82%)}.cta-orb{position:absolute;border-radius:50%;filter:blur(20px);opacity:.55}.orb-one{width:210px;height:210px;background:#5fcdf1;right:12%;top:-100px}.orb-two{width:180px;height:180px;background:#9b7df8;left:35%;bottom:-120px}.cta-copy,.cta-actions{position:relative;z-index:2}.cta-copy{max-width:630px}.cta-badge{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}.cta-copy h2{margin:15px 0 0;font-family:Manrope;font-size:clamp(34px,4vw,50px);letter-spacing:-.045em;line-height:1.05}.cta-copy p{margin:16px 0 0;max-width:560px;color:rgba(255,255,255,.76);font-size:14px;line-height:1.7}.cta-actions{display:flex;flex-direction:column;gap:10px;min-width:210px}

.site-footer{padding:58px 0 30px;background:#f8fafc;border-top:1px solid #e7ebf1}.footer-grid{display:grid;grid-template-columns:1.9fr repeat(3,1fr);gap:40px}.footer-brand-col p{max-width:330px;margin:16px 0 0;color:#7a8797;font-size:12px;line-height:1.7}.footer-grid h3{margin:4px 0 14px;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#7f8b9c}.footer-grid>div:not(:first-child) a{display:block;margin:10px 0;color:#526177;font-size:11px;font-weight:600}.footer-grid a:hover{color:var(--blue)}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:42px;padding-top:22px;border-top:1px solid #e3e8ef;color:#8b97a6;font-size:9px}.demo-badge{padding:5px 8px;border-radius:999px;background:#eef3f9;color:#758297}

.demo-toast{position:fixed;left:50%;bottom:28px;z-index:500;transform:translate(-50%,22px);display:flex;align-items:center;gap:10px;min-width:min(430px,calc(100vw - 32px));padding:12px 13px;border:1px solid #dce4ee;border-radius:15px;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);box-shadow:0 22px 55px rgba(15,23,42,.16);opacity:0;pointer-events:none;transition:.25s ease}.demo-toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}.toast-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#eaf2ff;color:#2563eb;font-weight:900}.demo-toast div{flex:1}.demo-toast b{display:block;font-size:10px}.demo-toast small{display:block;margin-top:2px;color:#7a8799;font-size:8px}.demo-toast button{width:28px;height:28px;border:0;border-radius:9px;background:#f2f5f8;color:#66758a;cursor:pointer;font-size:16px}

.reveal { opacity:0; transform:translateY(18px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity:1; transform:none; }
.reveal-delay-1{transition-delay:.08s}.reveal-delay-2{transition-delay:.15s}.reveal-delay-3{transition-delay:.22s}

@media (max-width: 1080px){
  .desktop-nav{gap:18px}.nav-ghost{display:none}.hero-grid{grid-template-columns:1fr 1fr;gap:30px}.hero h1{font-size:52px}.hero-visual{transform:scale(.88);min-height:580px}.section-pad{padding:96px 0}.showcase-grid{gap:50px}.faq-grid{gap:50px}
}

@media (max-width: 900px){
  .desktop-nav,.nav-actions{display:none}.mobile-menu-button{display:block}.nav-wrap{min-height:68px}.hero{padding-top:70px}.hero-grid{grid-template-columns:1fr}.hero-copy{text-align:center}.eyebrow{margin-inline:auto}.hero h1{max-width:780px;margin-left:auto;margin-right:auto;font-size:clamp(44px,8vw,62px)}.hero-lead{margin-inline:auto}.hero-actions,.trust-row{justify-content:center}.hero-visual{min-height:610px;max-width:600px;width:100%;margin:0 auto}.proof-grid{grid-template-columns:1fr 1fr}.proof-copy{grid-column:1/-1;padding:24px 0 18px}.proof-item{border-left:0;border-top:1px solid var(--line);padding:16px 0}.proof-item:nth-child(3),.proof-item:nth-child(4){padding-left:20px;border-left:1px solid var(--line)}.section-head{display:block}.section-head p{margin-top:18px}.bento-grid{grid-template-columns:repeat(2,1fr)}.bento-large,.bento-wide{grid-column:span 2}.steps-grid{grid-template-columns:repeat(2,1fr)}.showcase-grid{grid-template-columns:1fr}.showcase-copy{text-align:center}.showcase-copy p{margin-inline:auto}.check-list{max-width:560px;margin-inline:auto;text-align:left}.showcase-board{max-width:720px;width:100%;margin:10px auto 0}.faq-grid{grid-template-columns:1fr}.faq-intro{position:static;text-align:center;max-width:700px;margin:0 auto}.faq-list{max-width:780px;width:100%;margin:0 auto}.final-cta-card{display:block;text-align:center}.cta-copy{margin-inline:auto}.cta-actions{margin:30px auto 0;max-width:310px}.footer-grid{grid-template-columns:1.6fr repeat(3,1fr);gap:24px}
}

@media (max-width: 640px){
  .container{width:min(calc(100% - 28px),var(--container))}.section-pad{padding:76px 0}.hero{padding-top:52px;padding-bottom:44px}.hero h1{font-size:42px;line-height:1.04}.hero-lead{font-size:15px;line-height:1.7}.hero-actions{flex-direction:column}.hero-actions .button{width:100%}.trust-row{gap:13px}.hero-visual{min-height:525px;transform:scale(.78);margin-top:-30px;margin-bottom:-45px}.phone-front{transform:translate(42px,5px) rotate(4deg)}@keyframes floatPhone{0%,100%{transform:translate(42px,5px) rotate(4deg)}50%{transform:translate(42px,-8px) rotate(3deg)}}.phone-back{transform:translate(-112px,16px) rotate(-10deg) scale(.95)}@keyframes floatBack{0%,100%{transform:translate(-112px,16px) rotate(-10deg) scale(.95)}50%{transform:translate(-112px,5px) rotate(-9deg) scale(.95)}}.sync-card{right:-40px}.scan-card{left:-42px}.alert-card{right:-46px}.proof-grid{display:block;padding:18px 0}.proof-copy{padding:6px 0 18px}.proof-item,.proof-item:nth-child(3),.proof-item:nth-child(4){border-left:0;border-top:1px solid var(--line);padding:14px 0}.section-head h2,.showcase-copy h2,.faq-intro h2{font-size:34px}.bento-grid{display:block}.bento-card{margin-bottom:13px;min-height:260px}.bento-large,.bento-wide{display:block;min-height:0}.barcode-demo{margin-top:24px}.notifications-demo{margin-top:24px}.steps-grid{grid-template-columns:1fr}.showcase-board{min-height:460px}.mini-phone{width:190px;height:360px;padding:9px}.mp-one{left:4%;top:80px}.mp-two{right:3%;top:44px}.showcase-label{display:none}.pricing-grid{grid-template-columns:1fr}.price-card{padding:24px}.payment-note{align-items:flex-start}.payment-note small{line-height:1.6}.faq-list summary{font-size:14px}.faq-list details p{margin-right:38px}.final-cta{padding-bottom:76px}.final-cta-card{padding:42px 24px;border-radius:26px}.cta-actions{min-width:0}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand-col{grid-column:1/-1}.footer-bottom{display:block;text-align:center}.demo-badge{display:inline-block;margin-top:10px}.page-noise{display:none}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}.gradient-text,.phone-front,.phone-back,.floating-card,.scanner-line,.scan-beam{animation:none!important}.reveal{opacity:1;transform:none;transition:none}.button,.bento-card{transition:none}
}

/* Contact page — Premium V1 */
.desktop-nav a.is-active { color: var(--blue); }
.contact-page { min-height: 100vh; }
.contact-shell { position: relative; padding: 86px 0 108px; overflow: hidden; }
.contact-shell::before { content:""; position:absolute; width:520px; height:520px; border-radius:50%; right:-170px; top:-170px; background:radial-gradient(circle,rgba(37,99,235,.12),rgba(124,58,237,.05) 46%,transparent 72%); pointer-events:none; }
.contact-shell::after { content:""; position:absolute; width:420px; height:420px; border-radius:50%; left:-260px; bottom:-180px; background:radial-gradient(circle,rgba(6,182,212,.09),transparent 70%); pointer-events:none; }
.contact-layout { position:relative; z-index:1; display:grid; grid-template-columns:.84fr 1.16fr; gap:72px; align-items:start; }
.contact-copy { padding-top:24px; }
.contact-kicker { display:inline-flex; align-items:center; gap:8px; min-height:32px; padding:0 11px; border:1px solid #dce6f4; border-radius:999px; background:rgba(255,255,255,.78); box-shadow:0 6px 20px rgba(15,23,42,.04); color:var(--blue); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.10em; }
.contact-kicker::before { content:""; width:7px; height:7px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 4px rgba(34,197,94,.10); }
.contact-copy h1 { margin:20px 0 0; max-width:560px; font-family:Manrope,Inter,sans-serif; font-size:clamp(42px,5vw,64px); line-height:1.03; letter-spacing:-.055em; }
.contact-copy h1 span { color:transparent; background:linear-gradient(100deg,#1d4ed8,#2563eb 45%,#7c3aed); -webkit-background-clip:text; background-clip:text; }
.contact-lead { max-width:570px; margin:22px 0 0; color:var(--muted); font-size:17px; line-height:1.75; }
.contact-channels { display:grid; gap:12px; margin-top:34px; }
.contact-channel { display:flex; align-items:center; gap:14px; padding:17px 18px; border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.76); box-shadow:0 10px 30px rgba(15,23,42,.045); backdrop-filter:blur(12px); }
.contact-channel-icon { width:42px; height:42px; display:grid; place-items:center; flex-shrink:0; border-radius:13px; background:var(--blue-soft); color:var(--blue); }
.contact-channel-icon svg { width:20px; height:20px; }
.contact-channel small { display:block; color:#8b97a7; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.contact-channel a,.contact-channel b { display:inline-block; margin-top:3px; font-size:14px; font-weight:800; color:#24324a; }
.contact-channel a:hover { color:var(--blue); }
.contact-topic-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.contact-topic-row span { padding:7px 10px; border:1px solid #e0e7f0; border-radius:999px; background:#fff; color:#6d7b8f; font-size:10px; font-weight:700; }
.contact-safe { display:flex; align-items:center; gap:9px; margin-top:22px; color:#7d8a9b; font-size:11px; line-height:1.6; }
.contact-safe svg { width:16px; height:16px; color:#059669; flex-shrink:0; }
.contact-form-card { position:relative; overflow:hidden; padding:30px; border:1px solid #dce4ef; border-radius:28px; background:rgba(255,255,255,.94); box-shadow:0 28px 80px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.9); }
.contact-form-card::before { content:""; position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg,#2563eb,#60a5fa,#7c3aed); }
.contact-form-head { display:flex; justify-content:space-between; gap:20px; margin-bottom:26px; padding-bottom:22px; border-bottom:1px solid #edf1f6; }
.contact-form-head h2 { margin:0; font-family:Manrope,Inter,sans-serif; font-size:22px; letter-spacing:-.035em; }
.contact-form-head p { margin:7px 0 0; color:#7a8799; font-size:11px; line-height:1.6; }
.contact-form-badge { height:30px; padding:0 10px; display:inline-flex; align-items:center; gap:7px; flex-shrink:0; border-radius:999px; background:#eefbf5; color:#047857; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.contact-form-badge::before { content:""; width:6px; height:6px; border-radius:50%; background:#10b981; }
.contact-alert { margin:0 0 20px; padding:14px 16px; border-radius:15px; font-size:11px; line-height:1.6; }
.contact-alert b { display:block; margin-bottom:2px; font-size:12px; }
.contact-alert.success { border:1px solid #bcebd8; background:#effcf7; color:#047857; }
.contact-alert.error { border:1px solid #fecaca; background:#fff5f5; color:#b91c1c; }
.contact-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field { min-width:0; }
.field.full { grid-column:1/-1; }
.field label { display:block; margin-bottom:8px; color:#26344b; font-size:11px; font-weight:800; }
.required { color:#dc2626; }
.field input,.field select,.field textarea { width:100%; border:1px solid #dce4ef; border-radius:13px; background:#f8fafc; color:#172033; outline:0; transition:border-color .2s ease,box-shadow .2s ease,background .2s ease,transform .2s ease; }
.field input,.field select { height:50px; padding:0 14px; }
.field textarea { min-height:150px; padding:14px; resize:vertical; line-height:1.65; }
.field input::placeholder,.field textarea::placeholder { color:#9aa6b6; }
.field input:focus,.field select:focus,.field textarea:focus { border-color:#7ba4f8; background:#fff; box-shadow:0 0 0 4px rgba(37,99,235,.08); }
.field-hint { margin:7px 0 0; color:#95a0af; font-size:9px; }
.kvkk-box { grid-column:1/-1; display:flex; gap:12px; padding:15px; border:1px solid #e2e8f0; border-radius:14px; background:#f8fafc; }
.kvkk-box input { width:17px; height:17px; margin:2px 0 0; accent-color:#2563eb; flex-shrink:0; }
.kvkk-box label { color:#657489; font-size:10.5px; line-height:1.7; cursor:pointer; }
.kvkk-box label b { color:#334155; }
.contact-form-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:24px; }
.contact-form-actions .button { min-width:145px; }
.contact-back { color:#66758a; font-size:11px; font-weight:700; }
.contact-back:hover { color:var(--blue); }
.contact-response-note { margin-top:13px; text-align:center; color:#96a1af; font-size:9px; }
.contact-mini-proof { position:relative; z-index:1; margin-top:28px; display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:20px; background:rgba(255,255,255,.72); overflow:hidden; }
.contact-mini-proof div { padding:18px 20px; }
.contact-mini-proof div+div { border-left:1px solid var(--line); }
.contact-mini-proof b { display:block; font-size:11px; color:#344258; }
.contact-mini-proof span { display:block; margin-top:4px; color:#8a96a6; font-size:9px; line-height:1.5; }
.contact-mini-proof i { display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 4px rgba(34,197,94,.08); }

@media (max-width: 980px) {
  .contact-shell { padding-top:64px; }
  .contact-layout { grid-template-columns:1fr; gap:44px; }
  .contact-copy { padding-top:0; text-align:center; }
  .contact-copy h1,.contact-lead { margin-left:auto; margin-right:auto; }
  .contact-channels { max-width:620px; margin-left:auto; margin-right:auto; }
  .contact-topic-row,.contact-safe { justify-content:center; }
  .contact-form-card { max-width:760px; width:100%; margin:0 auto; }
  .contact-mini-proof { max-width:760px; margin-left:auto; margin-right:auto; }
}
@media (max-width: 640px) {
  .contact-shell { padding:48px 0 76px; }
  .contact-copy h1 { font-size:40px; }
  .contact-lead { font-size:15px; }
  .contact-form-card { padding:22px 18px; border-radius:22px; }
  .contact-form-head { display:block; }
  .contact-form-badge { margin-top:12px; }
  .contact-form-grid { grid-template-columns:1fr; }
  .field.full,.kvkk-box { grid-column:auto; }
  .contact-form-actions { flex-direction:column; align-items:stretch; }
  .contact-form-actions .button { width:100%; }
  .contact-back { text-align:center; }
  .contact-mini-proof { grid-template-columns:1fr; }
  .contact-mini-proof div+div { border-left:0; border-top:1px solid var(--line); }
}