
/* ── NETKON POWER — Global Design System ── */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
  --bg:#08152D; --bg-2:#0B1C3B; --bg-card:#10264A; --bg-light:#F4F7FF;
  --border:rgba(255,255,255,0.08); --border-b:rgba(255,255,255,0.14);
  --blue:#2f6fe4; --blue-hover:#4b84ec; --blue-faint:rgba(47,111,228,0.16);
  --cyan:#d62839; --orange:#ff6b6b;
  --text-1:#EDF3FF; --text-2:#90A8CE; --text-3:#41577A; --text-dark:#09162F;
  --radius-sm:8px; --radius:14px; --radius-lg:22px;
  --font-display:'Bebas Neue',sans-serif; --font-body:'Inter',sans-serif;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { background:var(--bg); color:var(--text-1); font-family:var(--font-body);
  line-height:1.6; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
ul { list-style:none; }
img { max-width:100%; display:block; }



/* Scrollbar */
::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:var(--cyan); border-radius:4px; }

/* Progress bar */
#progress { position:fixed; top:0; left:0; height:2px; background:var(--cyan); width:0%; z-index:9999; transition:width 0.1s; }

/* Noise */
.noise::after {
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
}
.noise { position:relative; }
.noise > * { position:relative; z-index:1; }

/* Reveal animations */
[data-reveal] { opacity:0; transform:translateY(28px); transition:opacity 0.7s ease, transform 0.7s ease; }
[data-reveal="left"] { transform:translateX(-36px); }
[data-reveal="right"] { transform:translateX(36px); }
[data-reveal].visible { opacity:1; transform:none; }
[data-delay="1"].visible { transition-delay:0.1s; }
[data-delay="2"].visible { transition-delay:0.2s; }
[data-delay="3"].visible { transition-delay:0.3s; }
[data-delay="4"].visible { transition-delay:0.4s; }
[data-delay="5"].visible { transition-delay:0.5s; }

/* ── HEADER ────────────────────────────────── */
#site-header {
  position:fixed; top:0; left:0; right:0; z-index:900;
  background:transparent; transition:background 0.4s, box-shadow 0.4s;
}
#site-header.stuck {
  background:rgba(5,13,26,0.92); backdrop-filter:blur(18px);
  box-shadow:0 1px 0 rgba(255,255,255,0.06);
}
.hdr-inner { max-width:1260px; margin:0 auto; padding:0 5%; display:flex; align-items:center; height:72px; gap:40px; }
.hdr-logo { display:flex; align-items:center; gap:12px; }
.hdr-logo-icon {
  width:46px; height:46px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; background:transparent;
}
.hdr-logo-icon img { width:100%; height:100%; object-fit:contain; display:block; }
.hdr-logo-text .brand { display:block; font-family:var(--font-display); font-size:20px; line-height:1.1; color:#fff; letter-spacing:1px; }
.hdr-logo-text .sub { display:block; font-size:10px; color:#8ea8cc; text-transform:uppercase; letter-spacing:1px; }
.hdr-nav { flex:1; display:flex; gap:32px; justify-content:center; }
.hdr-nav a { font-size:13px; font-weight:600; letter-spacing:0.5px; text-transform:uppercase; color:var(--text-2); transition:color 0.2s; position:relative; }
.hdr-nav a::after { content:''; position:absolute; bottom:-4px; left:0; right:0; height:2px; background:var(--cyan); transform:scaleX(0); transition:transform 0.25s; }
.hdr-nav a:hover, .hdr-nav a.active { color:#fff; }
.hdr-nav a.active::after, .hdr-nav a:hover::after { transform:scaleX(1); }
.hdr-cta { display:flex; align-items:center; gap:16px; }
.hdr-burger { background:none; border:none; cursor:pointer; padding:6px; display:none; }
.hdr-burger span { display:block; width:22px; height:2px; background:#fff; transition:transform 0.3s, opacity 0.3s; margin:4px 0; }
.hdr-burger.open span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
.hdr-burger.open span:nth-child(2) { opacity:0; }
.hdr-burger.open span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }
.mobile-drawer {
  position:fixed; top:72px; left:0; right:0; bottom:0; background:rgba(5,13,26,0.97);
  backdrop-filter:blur(24px); z-index:800; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:36px; opacity:0; pointer-events:none;
  transition:opacity 0.3s;
}
.mobile-drawer.open { opacity:1; pointer-events:auto; }
.mobile-drawer a { font-family:var(--font-display); font-size:48px; color:var(--text-2); letter-spacing:2px; }
.mobile-drawer a:hover { color:#fff; }

/* ── BUTTONS ──────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-size:14px; font-weight:700; letter-spacing:0.4px;
  border-radius:var(--radius-sm); padding:12px 24px;
  border:2px solid transparent; cursor:pointer; transition:all 0.25s;
  position:relative; overflow:hidden; white-space:nowrap;
}
.btn-primary { background:var(--cyan); color:#fff; border-color:var(--cyan); }
.btn-primary:hover { background:var(--orange); border-color:var(--orange); transform:translateY(-2px); box-shadow:0 8px 24px rgba(214,40,57,0.35); }
.btn-ghost { background:transparent; color:#fff; border-color:rgba(255,255,255,0.18); }
.btn-ghost:hover { border-color:rgba(255,255,255,0.5); background:rgba(255,255,255,0.05); transform:translateY(-2px); }
.btn-white { background:#fff; color:var(--text-dark); border-color:#fff; }
.btn-white:hover { background:var(--bg-light); transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.2); }
.btn-sm { padding:8px 16px; font-size:12px; }
.btn-lg { padding:16px 32px; font-size:15px; }
.btn-icon { width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; background:rgba(255,255,255,0.06); border:1px solid var(--border); color:var(--text-2); cursor:pointer; transition:background 0.2s,transform 0.2s,color 0.2s; }
.btn-icon:hover { background:rgba(255,255,255,0.12); transform:translateY(-2px); color:#fff; }
.magnetic { transition:all 0.3s cubic-bezier(0.23,1,0.32,1); }

/* ── MARQUEE ──────────────────────────────── */
.marquee-wrap { overflow:hidden; padding:20px 0; background:linear-gradient(90deg,rgba(214,40,57,0.14),rgba(47,111,228,0.1),rgba(214,40,57,0.08)); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.marquee-track { display:flex; gap:0; white-space:nowrap; animation:marquee-move 28s linear infinite; }
.marquee-item { font-family:var(--font-display); font-size:14px; letter-spacing:3px; text-transform:uppercase; color:#5f7daa; padding:0 8px; }
.marquee-sep { color:var(--blue); font-size:14px; padding:0 8px; }
@keyframes marquee-move { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ── SECTIONS ─────────────────────────────── */
.section { padding:100px 0; }
.section--white { background:var(--bg-light); }
.section--dark { background:var(--bg-2); }
.container { max-width:1260px; margin:0 auto; padding:0 5%; }
.section-head { max-width:600px; margin-bottom:64px; }
.section-head--center { text-align:center; margin:0 auto 64px; }
.section-label { font-size:11px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--cyan); margin-bottom:16px; }
.section-title { font-family:var(--font-display); font-size:clamp(38px,4.5vw,64px); line-height:0.95; letter-spacing:0.01em; text-transform:uppercase; color:var(--text-1); }
.section-title--light { color:var(--text-dark); }
.section-sub { font-size:16px; color:#8da6cc; line-height:1.75; max-width:560px; margin-top:16px; }
.section-sub--center { margin-left:auto; margin-right:auto; text-align:center; }
.section-sub--light { color:#56697A; }
.accent { color:var(--cyan); }

/* Stats strip */
.stats-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--border); }
.stat-item { padding:28px 32px; border-right:1px solid var(--border); text-align:center; background:rgba(8,17,35,0.6); }
.stat-item:last-child { border-right:none; }
.stat-num { display:block; font-family:var(--font-display); font-size:52px; line-height:1; color:#fff; }
.stat-num .suf { font-size:28px; color:var(--cyan); }
.stat-num sup { font-size:24px; color:var(--text-2); }
.stat-label { display:block; font-size:12px; color:#607eab; text-transform:uppercase; letter-spacing:1.5px; margin-top:6px; }

/* Tags */
.tag { display:inline-flex; align-items:center; padding:4px 12px; border-radius:99px; font-size:11px; font-weight:700; letter-spacing:0.5px; text-transform:uppercase; }
.tag-blue { background:rgba(47,111,228,0.16); color:#8FB5FF; border:1px solid rgba(47,111,228,0.28); }
.tag-cyan { background:rgba(214,40,57,0.14); color:#ff9aa4; border:1px solid rgba(214,40,57,0.32); }
.tag-dark { background:rgba(255,255,255,0.07); color:#9eb4d7; border:1px solid var(--border); }

/* Bento grid */
.bento-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.bento-card--wide { grid-column:span 2; }
.bento-card { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-lg); padding:36px 32px; transition:border-color 0.25s, box-shadow 0.25s; }
.bento-card:hover { border-color:rgba(214,40,57,0.34); box-shadow:0 12px 40px rgba(47,111,228,0.14); }
.bento-icon { display:block; margin-bottom:16px; color:var(--cyan); line-height:1; }
.bento-big-num { font-family:var(--font-display); font-size:56px; color:var(--blue); line-height:1; display:block; margin-bottom:4px; }
.bento-title { font-size:18px; font-weight:700; color:#fff; margin-bottom:10px; }
.bento-text { font-size:14px; color:var(--text-2); line-height:1.75; }

/* Process grid */
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative; margin-top:64px; }
.process-step { padding:36px 24px; border:1px solid var(--border); border-right:none; background:var(--bg-card); position:relative; }
.process-step:last-child { border-right:1px solid var(--border); }
.process-step-num { font-family:var(--font-display); font-size:72px; color:rgba(255,255,255,0.06); position:absolute; top:16px; right:20px; line-height:1; }
.process-step-title { font-size:16px; font-weight:700; color:#fff; margin-bottom:10px; letter-spacing:0.3px; padding-top:36px; }
.process-step-text { font-size:14px; color:var(--text-2); line-height:1.75; }
.process-connector { position:absolute; top:50px; right:-16px; width:32px; height:2px; background:var(--cyan); z-index:2; }
.process-connector::after { content:''; position:absolute; right:-4px; top:-4px; width:10px; height:10px; border-radius:50%; background:var(--blue); }

/* Product cards */
.product-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.product-card-big { border-radius:var(--radius-lg); overflow:hidden; background:var(--bg-card); border:1px solid var(--border); transition:transform 0.4s ease, box-shadow 0.4s ease; }
.product-card-big:hover { transform:translateY(-8px); box-shadow:0 24px 60px rgba(0,0,0,0.25); }
.product-card-hero { height:200px; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.product-card-hero .bg { position:absolute; inset:0; }
.product-card-hero .icon-wrap { font-size:80px; position:relative; z-index:1; filter:drop-shadow(0 0 32px rgba(47,111,228,0.6)); }
.product-card-photo { position:relative; z-index:1; width:100%; height:100%; object-fit:cover; opacity:0.92; }
.product-card-body { padding:32px; }
.product-card-tag { margin-bottom:14px; }
.product-card-title { font-family:var(--font-display); font-size:36px; color:var(--text-1); line-height:1.05; margin-bottom:14px; }
.product-card-desc { font-size:14px; color:var(--text-2); line-height:1.75; margin-bottom:18px; }
.product-card-specs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; }
.product-card-link { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--cyan); letter-spacing:0.3px; transition:gap 0.2s; }
.product-card-link:hover { gap:10px; }
.tilt-card { transform-style:preserve-3d; }

/* Testimonials */
.testimonial-wrap { overflow:hidden; border-radius:var(--radius-lg); background:var(--bg-card); border:1px solid var(--border); position:relative; }
.testimonials-inner { display:flex; transition:transform 0.5s cubic-bezier(0.4,0,0.2,1); }
.testimonial-slide { min-width:100%; padding:48px 52px; }
.testimonial-stars { color:#FFD54F; font-size:20px; margin-bottom:28px; }
.testimonial-quote { font-size:20px; color:var(--text-1); line-height:1.75; font-style:italic; margin-bottom:32px; }
.testimonial-author { display:flex; align-items:center; gap:16px; }
.testimonial-avatar { width:48px; height:48px; border-radius:50%; background:var(--blue-faint); border:2px solid rgba(47,111,228,0.3); display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--blue); font-size:14px; }
.testimonial-name { font-weight:700; color:#fff; }
.testimonial-role { font-size:13px; color:var(--text-2); margin-top:2px; }
.testimonial-controls { display:flex; align-items:center; gap:12px; margin-top:24px; }
.t-nav-btn { background:none; border:1px solid var(--border); color:var(--text-2); width:40px; height:40px; border-radius:50%; cursor:pointer; font-size:16px; display:flex; align-items:center; justify-content:center; transition:background 0.2s,color 0.2s; }
.t-nav-btn:hover { background:var(--blue); color:#fff; border-color:var(--blue); }
.t-dot { width:8px; height:8px; border-radius:50%; background:var(--border-b); border:none; cursor:pointer; transition:background 0.2s,width 0.2s; padding:0; }
.t-dot.active { background:var(--blue); width:24px; border-radius:4px; }

/* CTA Banner */
.cta-banner {
  background:linear-gradient(135deg,#7d1420 0%,#d62839 45%,#2f6fe4 100%);
  border-radius:var(--radius-lg); padding:52px 56px;
  display:grid; grid-template-columns:1fr auto; gap:48px; align-items:center;
  border:1px solid rgba(255,255,255,0.07); position:relative; overflow:hidden;
}
.cta-banner::before {
  content:''; position:absolute; right:-60px; top:50%; transform:translateY(-50%);
  width:360px; height:360px; border-radius:50%;
  background:radial-gradient(circle,rgba(214,40,57,0.3) 0%,transparent 70%);
  pointer-events:none;
}
.cta-content { position:relative; z-index:1; }
.cta-title { font-family:var(--font-display); font-size:clamp(36px,4vw,56px); color:#fff; line-height:0.95; }
.cta-title .highlight { color:var(--cyan); }
.cta-text { font-size:16px; color:rgba(255,255,255,0.76); line-height:1.7; max-width:480px; margin-top:12px; }
.cta-actions { position:relative; z-index:1; }
.cta-warranty { text-align:center; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12); border-radius:14px; padding:24px 36px; }
.cta-warranty-stars { color:#FFD54F; font-size:20px; margin-bottom:4px; }
.cta-warranty-num { font-family:var(--font-display); font-size:64px; color:#fff; line-height:1; }
.cta-warranty-num span { font-size:30px; color:var(--cyan); }
.cta-warranty-label { font-size:12px; color:rgba(255,255,255,0.62); text-transform:uppercase; letter-spacing:1.5px; }

/* FAQ */
.faq-list { display:flex; flex-direction:column; gap:0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--border); }
.faq-item { border-bottom:1px solid var(--border); }
.faq-item:last-child { border-bottom:none; }
.faq-q { width:100%; padding:22px 28px; background:var(--bg-card); border:none; text-align:left; cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-size:15px; font-weight:700; color:#eaf2ff; gap:16px; transition:background 0.2s; }
.faq-q:hover { background:rgba(255,255,255,0.04); }
.faq-q .faq-icon { font-size:20px; color:var(--blue); flex-shrink:0; transition:transform 0.3s; }
.faq-item.open .faq-q .faq-icon { transform:rotate(45deg); }
.faq-a { max-height:0; overflow:hidden; transition:max-height 0.4s ease; }
.faq-a-inner { padding:0 28px 22px; font-size:15px; color:#9bb1d2; line-height:1.75; }
.faq-item.open .faq-a { max-height:300px; }

/* Contact cards */
.contact-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-bottom:64px; }
.contact-card { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius); padding:28px 24px; display:flex; align-items:flex-start; gap:16px; transition:border-color 0.25s,box-shadow 0.25s; min-height:150px; }
.contact-card > div { min-width:0; }
.contact-card:hover { border-color:rgba(47,111,228,0.38); box-shadow:0 8px 28px rgba(47,111,228,0.12); }
.contact-card-icon { width:48px; height:48px; border-radius:12px; background:var(--blue-faint); border:1px solid rgba(47,111,228,0.24); display:flex; align-items:center; justify-content:center; color:var(--cyan); flex-shrink:0; }
.contact-card-label { font-size:11px; text-transform:uppercase; letter-spacing:1px; color:var(--text-2); font-weight:700; margin-bottom:6px; }
.contact-card-value { font-size:17px; color:#fff; font-weight:700; line-height:1.35; overflow-wrap:anywhere; word-break:break-word; }
.contact-card-value a { color:#fff; }
.contact-card-value a:hover { color:var(--cyan); }

/* Form */
.form-wrap { max-width:640px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-control { width:100%; background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-sm); padding:14px 18px; font-family:var(--font-body); font-size:14px; color:#fff; outline:none; transition:border-color 0.2s,box-shadow 0.2s; resize:vertical; display:block; margin-bottom:16px; }
.form-control::placeholder { color:#6e87ab; }
.form-control:focus { border-color:rgba(47,111,228,0.55); box-shadow:0 0 0 4px rgba(47,111,228,0.1); }
.form-submit { margin-top:8px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }

/* Page hero */
.page-hero { min-height:56vh; background:var(--bg); display:flex; align-items:center; position:relative; overflow:hidden; padding:120px 5% 80px; }
.page-hero .glow-blob { position:absolute; width:600px; height:600px; border-radius:50%; background:radial-gradient(circle,rgba(214,40,57,0.22) 0%,rgba(47,111,228,0.16) 52%,transparent 74%); top:-200px; left:-100px; pointer-events:none; }
.page-hero-inner { max-width:1260px; width:100%; margin:0 auto; position:relative; z-index:2; }
.page-hero-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,460px); gap:56px; align-items:center; }
.page-hero-media { width:100%; }
.page-hero-photo { aspect-ratio:4 / 5; }
.page-hero-eyebrow { font-size:11px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--cyan); margin-bottom:16px; }
.page-hero-title { font-family:var(--font-display); font-size:clamp(52px,7vw,100px); line-height:0.92; letter-spacing:0.01em; text-transform:uppercase; color:#fff; }
.page-hero-title .accent { color:var(--cyan); }
.page-hero-sub { font-size:17px; color:var(--text-2); line-height:1.75; max-width:520px; margin-top:20px; }

/* Product detail */
.product-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.product-detail-grid.reverse { direction:rtl; }
.product-detail-grid.reverse > * { direction:ltr; }
.product-detail-visual { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-lg); aspect-ratio:1; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.product-detail-visual::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(214,40,57,0.16),rgba(47,111,228,0.14)); }
.product-detail-visual-icon { font-size:120px; position:relative; z-index:1; filter:drop-shadow(0 0 40px rgba(47,111,228,0.58)); }
.product-detail-visual img { width:100%; height:100%; object-fit:cover; position:relative; z-index:1; }
.product-detail-content { }
.product-detail-tag { margin-bottom:12px; }
.product-detail-title { font-family:var(--font-display); font-size:clamp(38px,4.5vw,60px); color:var(--text-1); line-height:0.95; margin-bottom:16px; letter-spacing:0.02em; }
.product-detail-desc { font-size:16px; color:var(--text-2); line-height:1.8; margin-bottom:28px; }
.specs-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:28px; }
.spec-item { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-sm); padding:16px 18px; }
.spec-label { font-size:11px; text-transform:uppercase; letter-spacing:1px; color:#6c88af; margin-bottom:4px; }
.spec-value { font-size:15px; font-weight:700; color:#fff; }
.apps-title { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:#6c88af; margin-bottom:12px; }
.apps-list { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; }

/* Compare table */
.compare-table { width:100%; border-collapse:collapse; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--border); }
.compare-table th { background:var(--bg-card); padding:18px 24px; text-align:left; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:#9eb6d8; border-bottom:1px solid var(--border); }
.compare-table td { padding:16px 24px; font-size:14px; color:#5d7596; border-bottom:1px solid #dae5f7; vertical-align:top; }
.compare-table tr:last-child td { border-bottom:none; }
.compare-table tr:nth-child(even) td { background:rgba(47,111,228,0.06); }
.compare-table td:first-child { color:var(--text-dark); font-weight:700; }
.compare-table td.check { color:var(--cyan); font-size:16px; }

/* Footer */
#site-footer { background:var(--bg-2); padding:80px 0 0; border-top:1px solid var(--border); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.2fr; gap:48px; padding-bottom:56px; border-bottom:1px solid var(--border); }
.footer-brand-desc { font-size:14px; color:#90a8cb; line-height:1.75; margin-top:12px; max-width:280px; }
.footer-social { display:flex; gap:10px; margin-top:24px; }
.footer-col-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:2px; color:#7d9cc4; margin-bottom:20px; }
.footer-links li { margin-bottom:12px; }
.footer-links a { font-size:14px; color:#b1c4df; transition:color 0.2s; }
.footer-links a:hover { color:#fff; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; padding:24px 0; flex-wrap:wrap; gap:16px; }
.footer-copy { font-size:13px; color:#7f9bc0; }
.footer-copy a { color:var(--text-2); }
.footer-badges { display:flex; gap:8px; }
.footer-badge { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1px; padding:4px 12px; border-radius:99px; background:rgba(255,255,255,0.05); border:1px solid var(--border); color:#9eb4d5; }

/* Better select arrow visibility */
select.form-control {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 42px;
  background-image: linear-gradient(45deg, transparent 50%, #7da0ce 50%), linear-gradient(135deg, #7da0ce 50%, transparent 50%);
  background-position: calc(100% - 20px) calc(50% - 3px), calc(100% - 14px) calc(50% - 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

/* Back to top */
#back-top { position:fixed; bottom:28px; right:28px; width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,var(--blue),var(--cyan)); color:#fff; display:flex; align-items:center; justify-content:center; font-size:20px; box-shadow:0 4px 18px rgba(47,111,228,0.34); opacity:0; pointer-events:none; transition:opacity 0.3s,transform 0.3s; z-index:500; }
#back-top.show { opacity:1; pointer-events:auto; }
#back-top:hover { transform:translateY(-3px); }

/* Image blocks */
.media-frame { border-radius:var(--radius-lg); border:1px solid var(--border); overflow:hidden; background:var(--bg-card); box-shadow:0 12px 30px rgba(0,0,0,0.22); }
.media-frame img { width:100%; height:100%; display:block; object-fit:cover; }
.motion-float { animation:section-float 6s ease-in-out infinite; }
@keyframes section-float {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-10px); }
}
.hero-photo-stack { position:relative; width:min(470px,92vw); margin-inline:auto; }
.hero-photo-main { aspect-ratio:4 / 5; }
.hero-photo-chip { position:absolute; width:48%; aspect-ratio:4 / 3; border-radius:var(--radius); }
.hero-photo-chip:nth-child(2) { left:-12%; bottom:8%; }
.hero-photo-chip:nth-child(3) { right:-10%; top:8%; }
.hero-photo-badge {
  position:absolute; right:-6%; bottom:6%; max-width:220px;
  background:rgba(8,21,45,0.88); border:1px solid rgba(214,40,57,0.25);
  border-radius:16px; padding:16px 18px; box-shadow:0 18px 40px rgba(0,0,0,0.26);
}
.hero-photo-badge-title { display:block; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--cyan); margin-bottom:6px; }
.hero-photo-badge-text { display:block; font-size:13px; line-height:1.55; color:var(--text-2); }
.photo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.photo-grid .media-frame { aspect-ratio:4 / 5; }

/* Stock showcase */
.stock-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.stock-card { margin:0; border-radius:var(--radius-lg); overflow:hidden; border:1px solid rgba(10,22,40,0.12); box-shadow:0 14px 30px rgba(7,18,38,0.14); }
.stock-card img { width:100%; height:100%; display:block; aspect-ratio:4 / 3; object-fit:cover; }

/* Deco text */
.deco-text { font-family:var(--font-display); font-size:clamp(80px,12vw,180px); color:rgba(255,255,255,0.025); line-height:1; user-select:none; pointer-events:none; position:absolute; }

/* Blinking dot */
@keyframes blink { 0%,100%{opacity:1;} 50%{opacity:0.3;} }

/* ── RESPONSIVE ──────────────────────────── */
@media(max-width:1100px) {
  .bento-grid { grid-template-columns:repeat(2,1fr); }
  .bento-card--wide { grid-column:span 2; }
  .product-grid { grid-template-columns:1fr; max-width:600px; margin:0 auto; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .process-grid { grid-template-columns:repeat(2,1fr); }
  .process-step:nth-child(2) .process-connector { display:none; }
  .process-step:nth-child(4) .process-connector { display:none; }
  .cta-banner { grid-template-columns:1fr; }
  .cta-actions { justify-content:flex-start; display:flex; }
  .product-detail-grid { grid-template-columns:1fr; gap:48px; }
  .product-detail-grid.reverse { direction:ltr; }
  .product-detail-visual { max-width:480px; }
  .photo-grid { grid-template-columns:repeat(2,1fr); }
  .stock-grid { grid-template-columns:repeat(2,1fr); }
  .page-hero-layout { grid-template-columns:1fr; }
  .page-hero-media { max-width:460px; margin:0 auto; }
}
@media(max-width:900px) {
  .hdr-nav { display:none; }
  .hdr-burger { display:flex; flex-direction:column; cursor:none; }
  .section { padding:72px 0; }
  .stats-strip { grid-template-columns:repeat(2,1fr); }
  .stats-strip .stat-item:nth-child(2) { border-right:none; }
}
@media(max-width:640px) {
  .bento-grid { grid-template-columns:1fr; }
  .bento-card--wide { grid-column:span 1; }
  .process-grid { grid-template-columns:1fr; }
  .process-connector { display:none !important; }
  .process-step { border-right:1px solid var(--border); }
  .footer-grid { grid-template-columns:1fr; }
  .testimonial-slide { padding:28px 24px; }
  .testimonial-quote { font-size:16px; }
  .form-row { grid-template-columns:1fr; }
  .specs-grid { grid-template-columns:1fr; }
  .hero-photo-chip { display:none; }
  .hero-photo-badge { position:static; margin-top:18px; max-width:none; }
  .photo-grid { grid-template-columns:1fr; }
  .stock-grid { grid-template-columns:1fr; }
  .warranty-slice { grid-template-columns:1fr !important; }
  .compare-table td, .compare-table th { padding:12px 14px; font-size:13px; }
}
