:root { --ink:#10243b; --blue:#0a66c2; --navy:#08243f; --sky:#eaf4ff; --line:#dce6ef; --muted:#5e7084; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#fff; font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
button, input, textarea, select { font:inherit; }
.shell { width:min(1180px, calc(100% - 40px)); margin-inline:auto; }
.topbar { background:#071c30; color:#cbd9e7; font-size:12px; }
.topbar-inner { height:34px; display:flex; align-items:center; justify-content:space-between; }
.topbar a { color:#fff; }
.topbar-contacts { display:flex; align-items:center; gap:20px; }
.topbar-contacts a:hover { color:#8fc6ff; }
.header { position:sticky; top:0; z-index:30; background:rgba(255,255,255,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.brand { display:flex; align-items:center; gap:10px; font-size:15px; letter-spacing:.08em; font-weight:800; white-space:nowrap; }
.brand b { color:var(--blue); }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:var(--blue); color:white; letter-spacing:-.05em; }
nav { display:flex; gap:30px; font-size:14px; font-weight:600; color:#31475d; }
nav a:hover { color:var(--blue); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:52px; padding:0 25px; border:1px solid var(--blue); border-radius:7px; background:var(--blue); color:#fff; font-weight:700; cursor:pointer; transition:.2s ease; }
.button:hover { background:#084f96; transform:translateY(-1px); }
.button-small { min-height:42px; padding:0 18px; font-size:14px; }
.hero { min-height:690px; position:relative; display:flex; align-items:center; color:#fff; overflow:hidden; }
.hero>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,21,39,.92) 0%,rgba(3,29,54,.77) 48%,rgba(3,19,36,.2) 100%); }
.hero-content { position:relative; padding:110px 0 70px; }
.eyebrow { margin:0 0 18px; color:#8fc6ff; font-size:12px; font-weight:800; letter-spacing:.18em; }
.eyebrow.dark { color:var(--blue); }
h1 { max-width:800px; margin:0; font-size:clamp(44px,6vw,76px); line-height:1.03; letter-spacing:-.045em; }
.hero-copy { max-width:720px; margin:26px 0 32px; font-size:20px; line-height:1.65; color:#dfeaf5; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; }
.button-ghost { border-color:rgba(255,255,255,.6); background:rgba(255,255,255,.08); }
.button-ghost:hover { background:#fff; color:var(--navy); }
.hero-proof { display:flex; gap:46px; margin-top:65px; padding-top:26px; border-top:1px solid rgba(255,255,255,.25); color:#c8d7e4; font-size:13px; }
.hero-proof span { display:grid; gap:5px; }
.hero-proof b { color:#fff; font-size:15px; }
.section { padding:100px 0; }
.section-heading { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:end; margin-bottom:44px; }
h2 { margin:0; font-size:clamp(34px,4vw,50px); line-height:1.08; letter-spacing:-.035em; }
.section-heading>p { margin:0; color:var(--muted); line-height:1.75; }
.product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.product-card { border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; transition:.25s; }
.product-card:hover { transform:translateY(-5px); box-shadow:0 18px 42px rgba(15,46,76,.12); }
.product-visual { position:relative; height:220px; overflow:hidden; background:#f7f9fb; }
.product-visual img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .35s ease; }
.product-card:hover .product-visual img { transform:scale(1.035); }
.product-code { position:absolute; top:14px; left:14px; z-index:1; background:rgba(255,255,255,.9); border:1px solid rgba(255,255,255,.95); padding:7px 9px; border-radius:5px; box-shadow:0 3px 12px rgba(15,46,76,.08); font-size:11px; font-weight:700; }
.product-body { padding:23px; }
.product-body>p { margin:0 0 9px; color:var(--blue); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.product-body h3 { margin:0 0 11px; font-size:20px; }
.product-body>span { display:block; min-height:66px; color:var(--muted); font-size:14px; line-height:1.55; }
.product-body button { width:100%; margin-top:18px; padding:14px 0 0; border:0; border-top:1px solid var(--line); background:none; color:var(--blue); text-align:left; font-weight:700; cursor:pointer; }
.product-body button b { float:right; }
.capabilities { padding:100px 0; background:var(--navy); color:#fff; }
.capability-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; align-items:center; }
.muted-light { color:#b8cadb; line-height:1.75; font-size:17px; }
.feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.feature { padding:24px; border:1px solid rgba(255,255,255,.12); border-radius:10px; background:rgba(255,255,255,.05); }
.feature span { color:#75b9ff; }
.feature h3 { display:inline; margin-left:9px; font-size:18px; }
.feature p { color:#b8cadb; line-height:1.55; font-size:14px; }
.center-heading { text-align:center; margin-bottom:50px; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.steps article { position:relative; padding-top:24px; border-top:2px solid var(--line); }
.steps article:before { content:""; position:absolute; top:-5px; left:0; width:9px; height:9px; border-radius:50%; background:var(--blue); }
.steps b { color:var(--blue); font-size:12px; }
.steps h3 { margin:16px 0 10px; font-size:19px; }
.steps p { color:var(--muted); line-height:1.65; font-size:14px; }
.about-strip { padding:100px 0; background:#f3f8fc; }
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.about-image { min-height:480px; border-radius:13px; background:linear-gradient(90deg,rgba(8,36,63,.15),rgba(8,36,63,0)),url("/images/rfid-manufacturing.png") center/cover; box-shadow:0 20px 55px rgba(8,36,63,.15); }
.about-grid p:not(.eyebrow) { color:var(--muted); font-size:17px; line-height:1.8; }
.about-grid ul { margin:25px 0 0; padding:0; list-style:none; }
.about-grid li { margin:13px 0; padding-left:27px; position:relative; font-weight:600; }
.about-grid li:before { content:"✓"; position:absolute; left:0; color:var(--blue); }
.inquiry-section { padding:100px 0; background:#0a3257; color:#fff; }
.inquiry-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; align-items:start; }
.inquiry-grid>div>p:not(.eyebrow) { color:#c3d5e6; font-size:17px; line-height:1.75; }
.response-note { display:grid; gap:8px; margin-top:30px; padding:20px; border-left:3px solid #6eb8ff; background:rgba(255,255,255,.06); }
.response-note span { color:#c3d5e6; font-size:13px; line-height:1.6; }
.whatsapp-button { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:16px; padding:16px 20px; border:1px solid rgba(255,255,255,.2); border-radius:8px; background:#25d366; color:#062813; font-weight:800; transition:.2s ease; }
.whatsapp-button:hover { background:#20bd5a; transform:translateY(-1px); }
.whatsapp-button span { font-size:13px; font-weight:700; }
.quote-form { display:grid; gap:17px; padding:32px; border-radius:12px; background:#fff; color:var(--ink); box-shadow:0 25px 70px rgba(0,0,0,.18); }
.two-fields { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.quote-form label { display:grid; gap:7px; font-size:13px; font-weight:700; }
.quote-form input,.quote-form textarea,.quote-form select { width:100%; padding:13px 14px; border:1px solid #ccd9e5; border-radius:6px; color:var(--ink); background:#fff; outline:none; }
.quote-form input:focus,.quote-form textarea:focus,.quote-form select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(10,102,194,.1); }
.form-button { width:100%; border:0; }
.form-button:disabled { cursor:wait; opacity:.78; transform:none; }
.form-note { margin:0; text-align:center; color:var(--muted); font-size:12px; }
.form-success { padding:11px 12px; border-radius:6px; background:#eaf8ef; color:#176b35; font-weight:700; }
.form-error { padding:11px 12px; border-radius:6px; background:#fff0f0; color:#a12626; font-weight:700; }
.website-field { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
footer { padding:70px 0 25px; background:#061a2c; color:#fff; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1.3fr; gap:55px; }
.brand-light b { color:#77baff; }
.footer-grid p,.footer-grid span { color:#91a7ba; font-size:13px; line-height:1.7; }
.footer-grid>div:not(:first-child) { display:flex; flex-direction:column; gap:12px; }
.footer-grid>div>b { margin-bottom:7px; }
.footer-grid a { color:#b7c6d4; font-size:13px; }
.footer-grid a:hover { color:#fff; }
.footer-bottom { display:flex; justify-content:space-between; margin-top:55px; padding-top:22px; border-top:1px solid rgba(255,255,255,.1); color:#778fa4; font-size:12px; }

@media (max-width:900px) {
  nav { display:none; }
  .product-grid,.steps { grid-template-columns:1fr 1fr; }
  .capability-grid,.about-grid,.inquiry-grid { grid-template-columns:1fr; gap:45px; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:620px) {
  .shell { width:min(100% - 28px,1180px); }
  .topbar span { display:none; }
  .topbar-inner { height:auto; min-height:34px; padding:7px 0; justify-content:center; }
  .topbar-contacts { width:100%; justify-content:space-between; gap:10px; font-size:10px; }
  .topbar-contacts a { display:block; }
  .topbar-contacts a:last-child { text-align:right; }
  .nav { min-height:68px; }
  .nav>.button { display:none; }
  .brand { font-size:12px; }
  .brand-mark { width:34px; height:34px; }
  .hero { min-height:680px; }
  .hero-content { padding-top:85px; }
  h1 { font-size:44px; }
  .hero-copy { font-size:17px; }
  .hero-proof { display:grid; gap:20px; margin-top:45px; }
  .section { padding:75px 0; }
  .section-heading { grid-template-columns:1fr; gap:20px; }
  .product-grid,.steps,.feature-grid,.two-fields,.footer-grid { grid-template-columns:1fr; }
  .product-visual { height:250px; }
  .about-image { min-height:350px; }
  .quote-form { padding:22px; }
  .footer-bottom { gap:16px; flex-direction:column; }
}