:root {
  --bg: #f7f9fc; --surface: #ffffff; --surface-2: #eef5fb; --ink: #101a25; --muted: #637181;
  --line: rgba(16, 44, 70, .11); --blue: #008fd1; --cyan: #00bfea; --deep: #071e32;
  --blue-soft: #dff5ff; --shadow: 0 22px 70px rgba(8, 51, 82, .10); --header: rgba(247, 249, 252, .84);
}
:root[data-theme="dark"] {
  --bg: #06131e; --surface: #0b1d2b; --surface-2: #0e2738; --ink: #eef8ff; --muted: #9eb0bd;
  --line: rgba(188, 225, 246, .12); --blue-soft: #0b3045; --shadow: 0 24px 70px rgba(0, 0, 0, .28); --header: rgba(6, 19, 30, .84);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: Tahoma, "Segoe UI", Arial, sans-serif; overflow-x: hidden; transition: background .35s ease, color .35s ease; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.section-pad { padding-inline: 0; }
.section { padding-block: 110px; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--blue); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 28px; height: 2px; background: linear-gradient(90deg, var(--cyan), var(--blue)); }
h1, h2, h3, p { margin-top: 0; }
h2 { margin: 16px 0 14px; font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1.14; letter-spacing: -.045em; }
p { color: var(--muted); line-height: 1.9; }

/* Navigation */
.site-header { position: sticky; top: 0; z-index: 50; height: 82px; background: var(--header); backdrop-filter: blur(18px); border-bottom: 1px solid var(--line); }
.nav-wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand { width: 134px; height: 52px; padding: 5px 8px; background: #fff; border: 1px solid rgba(0,0,0,.05); border-radius: 14px; display: grid; place-items: center; overflow: hidden; }
.brand img { width: 100%; }
.nav-links { display: flex; align-items: center; gap: 34px; margin-inline: auto; }
.nav-links > a { color: var(--muted); font-size: .92rem; font-weight: 700; padding-block: 29px 26px; border-bottom: 2px solid transparent; transition: .25s ease; }
.nav-links > a:hover, .nav-links > a.active { color: var(--blue); border-color: var(--blue); }
.nav-actions { display: flex; align-items: center; gap: 9px; }
.icon-btn, .menu-btn { width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; display: grid; place-items: center; transition: .25s ease; }
.icon-btn:hover { border-color: var(--blue); color: var(--blue); transform: translateY(-2px); }
.language-btn { font-size: .75rem; font-weight: 900; }
.nav-cta { padding: 12px 20px; border-radius: 12px; color: #fff; background: var(--deep); font-size: .86rem; font-weight: 800; }
:root[data-theme="dark"] .nav-cta { background: var(--blue); }
.menu-btn, .mobile-nav-cta { display: none; }

/* Hero */
.hero { position: relative; overflow: hidden; padding-top: 78px; background: radial-gradient(circle at 20% 25%, rgba(0, 191, 234, .08), transparent 30%), linear-gradient(180deg, var(--bg), var(--surface-2)); }
.hero::after { content: ""; position: absolute; inset: 0; opacity: .32; pointer-events: none; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 60px 60px; mask-image: linear-gradient(to bottom, #000, transparent 75%); }
.hero-grid { position: relative; z-index: 2; min-height: 600px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 55px; }
.hero-copy { padding-bottom: 60px; }
.display { margin: 20px 0 22px; font-size: clamp(3.3rem, 7vw, 6.6rem); line-height: .98; letter-spacing: -.065em; }
.display span, .display strong { display: block; }
.display strong { color: transparent; background: linear-gradient(120deg, var(--blue), var(--cyan)); background-clip: text; font-weight: 900; }
.hero-intro { max-width: 660px; font-size: 1.08rem; }
.hero-actions { display: flex; gap: 12px; margin-top: 30px; }
.btn { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 16px; padding: 0 24px; border: 0; border-radius: 14px; font-weight: 800; cursor: pointer; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.btn:hover { transform: translateY(-3px); }
.btn-primary { color: #fff; background: linear-gradient(135deg, var(--blue), #006fae); box-shadow: 0 12px 30px rgba(0, 143, 209, .25); }
.btn-primary:hover { box-shadow: 0 18px 34px rgba(0, 143, 209, .35); }
.btn-ghost { color: var(--ink); background: var(--surface); border: 1px solid var(--line); }
.trust-line { display: flex; gap: 9px; align-items: center; margin-top: 22px; color: var(--muted); font-size: .84rem; }
.trust-line span { color: var(--blue); }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.orb-one { width: 360px; height: 360px; top: 30px; right: -190px; border: 1px solid rgba(0,191,234,.26); }
.orb-two { width: 160px; height: 160px; left: 8%; bottom: 90px; background: rgba(0,143,209,.05); }
.stats-strip { position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; gap: 70px; padding: 25px; margin-bottom: 26px; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter: blur(14px); border-radius: 20px; box-shadow: var(--shadow); }
.stats-strip div { display: flex; align-items: baseline; gap: 10px; }
.stats-strip b { color: var(--blue); font-size: 1.45rem; }.stats-strip span { color: var(--muted); font-size: .84rem; }.stats-strip i { width: 1px; height: 26px; background: var(--line); }

/* Product art */
.phone-scene { position: relative; width: 100%; min-height: 330px; display: grid; place-items: center; perspective: 1200px; }
.hero-phone { min-height: 580px; }
.phone-body { position: relative; width: 185px; height: 370px; padding: 7px; border-radius: 37px; background: linear-gradient(135deg, #90b7ce, #102e41 36%, #5f8198 70%, #cbe8f7); box-shadow: 30px 45px 55px rgba(4,29,46,.28); transform: rotateY(-14deg) rotateZ(5deg); animation: phoneFloat 6s ease-in-out infinite; }
.hero-phone .phone-body { width: 240px; height: 480px; border-radius: 46px; padding: 9px; }
.phone-screen { position: relative; height: 100%; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-bottom: 38px; color: white; border-radius: 30px; background: radial-gradient(circle at 70% 25%, rgba(255,255,255,.38), transparent 16%), radial-gradient(circle at 45% 70%, #00bfea, transparent 36%), linear-gradient(155deg, #071c2c 15%, #006eaa 50%, #00bfe9 80%, #061a2a); }
.hero-phone .phone-screen { border-radius: 37px; }
.violet .phone-screen { background: radial-gradient(circle at 35% 30%, #bd9cff, transparent 25%), linear-gradient(150deg,#11102d,#44319b 53%,#07aaca); }
.orange .phone-screen { background: radial-gradient(circle at 30% 25%, #ffcc88, transparent 23%), linear-gradient(150deg,#311309,#c65120 54%,#ff9e37); }
.dynamic-island { position: absolute; width: 40%; height: 22px; top: 12px; border-radius: 30px; background: #02070a; }
.screen-glow { position: absolute; width: 155px; height: 155px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; top: 28%; box-shadow: 0 0 50px rgba(255,255,255,.12); }
.screen-mark { font: 900 4.6rem Arial; line-height: 1; opacity: .95; }.phone-screen small { font: 800 .55rem Arial; letter-spacing: .25em; opacity: .75; }
.phone-side { position: absolute; width: 3px; height: 55px; left: -3px; top: 84px; border-radius: 3px; background: #49748c; }
.phone-shadow { position: absolute; width: 260px; height: 85px; bottom: 62px; border-radius: 50%; background: rgba(0,26,45,.22); filter: blur(18px); transform: rotate(-5deg); }
.float-card { position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: 16px; background: color-mix(in srgb, var(--surface) 90%, transparent); border: 1px solid var(--line); box-shadow: var(--shadow); backdrop-filter: blur(12px); animation: badgeFloat 4.5s ease-in-out infinite; }
.float-card > span { width: 34px; height: 34px; display: grid; place-items: center; color: #fff; border-radius: 10px; background: var(--blue); font-weight: 900; }.float-card div { display: grid; }.float-card b { font-size: .9rem; }.float-card small { color: var(--muted); font-size: .65rem; }
.card-stock { top: 24%; left: 0; }.card-warranty { bottom: 24%; right: 0; animation-delay: -2s; }.spark { position: absolute; color: var(--cyan); animation: spinSpark 7s linear infinite; }.s1 { top: 15%; right: 12%; font-size: 1.8rem; }.s2 { bottom: 15%; left: 18%; font-size: 1rem; }
.audio-visual { position: relative; width: 100%; min-height: 330px; display: grid; place-items: center; }.case { position: relative; width: 145px; height: 115px; border-radius: 28px 28px 40px 40px; background: linear-gradient(145deg,#fff,#cdd8df); box-shadow: 18px 25px 38px rgba(13,37,53,.18); }.case::before { content:""; position:absolute; inset:9px 12px auto; height:5px; border-radius:9px; background:#b7c5cf; }.case i { position:absolute; width:36px; height:58px; top:24px; border-radius:25px 25px 15px 15px; background:#e9f0f4; box-shadow:inset 0 0 0 1px #c5d0d7; }.case i:first-child { left:26px; }.case i:last-child { right:26px; }.bud { position:absolute; width:30px; height:74px; border-radius:24px; background:linear-gradient(140deg,#fff,#bac8d0); box-shadow:9px 15px 22px rgba(13,37,53,.16); }.bud::after { content:""; position:absolute; width:38px; height:38px; top:-5px; left:-4px; border-radius:50%; background:inherit; }.bud-a { left:24%; top:34%; transform:rotate(-15deg); }.bud-b { right:24%; top:37%; transform:rotate(18deg); }

/* Sections and cards */
.section-head { margin-bottom: 46px; }.section-head p { max-width: 590px; }.split-head { display: flex; align-items: end; justify-content: space-between; gap: 25px; }.centered { text-align: center; }.centered .eyebrow { justify-content: center; }.centered p { margin-inline: auto; }
.text-link { color: var(--blue); font-weight: 800; padding-bottom: 8px; border-bottom: 1px solid currentColor; white-space: nowrap; }
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }.product-card { position: relative; padding: 18px; border-radius: 24px; background: var(--surface); border: 1px solid var(--line); overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; }.product-card:hover { transform: translateY(-8px); box-shadow: var(--shadow); }.product-card .tag { position: absolute; z-index: 3; top: 18px; inset-inline-start: 18px; padding: 7px 11px; border-radius: 9px; color: var(--blue); background: var(--blue-soft); font-size: .66rem; font-weight: 900; }.product-info { padding: 8px 6px 3px; display: flex; align-items: end; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); }.product-info h3 { margin: 14px 0 4px; font-size: 1rem; }.product-info span { color: var(--muted); font-size: .73rem; }.product-info > b { color: var(--blue); font-size: .86rem; white-space: nowrap; }
.service-band { background: var(--deep); color: #f1f9ff; }.service-band p, .service-band .section-copy { color: #9bb2c2; }.service-grid { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 100px; }.service-visual { position: relative; min-height: 510px; display: grid; place-items: center; }.repair-ring { position: relative; width: 330px; height: 330px; display: grid; place-items: center; text-align: center; border: 1px solid rgba(0,191,234,.38); border-radius: 50%; background: radial-gradient(circle, rgba(0,143,209,.19), transparent 68%); box-shadow: inset 0 0 70px rgba(0,191,234,.08), 0 0 100px rgba(0,143,209,.12); }.repair-ring::before,.repair-ring::after { content:""; position:absolute; border-radius:50%; border:1px dashed rgba(255,255,255,.17); inset:28px; animation:spinSpark 18s linear infinite; }.repair-ring::after { inset:-26px; animation-direction:reverse; }.repair-ring span { position:absolute; top:54px; color:var(--cyan); font-size:2rem; }.repair-ring b { font:900 2.4rem/1 Arial; letter-spacing:.08em; }.mini-badge { position:absolute; bottom:55px; right:8%; padding:15px 18px; border-radius:15px; background:#fff; color:#0a2030; box-shadow:0 20px 40px rgba(0,0,0,.24); display:grid; }.mini-badge b { color:var(--blue); font-size:1.2rem; }.mini-badge span { font-size:.68rem; }
.section-copy { font-size:1.03rem; max-width:600px; }.steps { list-style:none; margin:34px 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:14px; }.steps li { display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:13px; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04); }.steps b { color:var(--cyan); font-size:.72rem; }.steps span { font-weight:700; font-size:.86rem; }.fast-card { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:17px 19px; border-radius:17px; background:rgba(255,255,255,.07); }.fast-card > div { display:grid; gap:5px; }.fast-card span { color:#9bb2c2; font-size:.75rem; }.fast-card .btn { min-height:44px; font-size:.8rem; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.feature-card { padding:30px; border:1px solid var(--line); border-radius:21px; background:var(--surface); transition:.3s ease; }.feature-card:hover { border-color:rgba(0,143,209,.35); transform:translateY(-5px); }.feature-icon { width:49px; height:49px; display:grid; place-items:center; margin-bottom:28px; border-radius:14px; color:var(--blue); background:var(--blue-soft); font-size:1.2rem; font-weight:900; }.feature-card h3 { margin-bottom:8px; }.feature-card p { margin:0; font-size:.85rem; }
.soft-section { background:var(--surface-2); }.review-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.review-grid blockquote { margin:0; padding:28px; border:1px solid var(--line); border-radius:21px; background:var(--surface); }.stars { color:#ffaf18; letter-spacing:.15em; font-size:.8rem; }.review-grid blockquote > p { min-height:82px; margin:18px 0 25px; color:var(--ink); font-size:.9rem; }.review-grid footer { display:flex; align-items:center; gap:12px; }.review-grid footer > span { width:38px; height:38px; display:grid; place-items:center; color:#fff; border-radius:50%; background:linear-gradient(135deg,var(--blue),var(--cyan)); font-weight:800; }.review-grid footer div { display:grid; gap:3px; }.review-grid footer b { font-size:.82rem; }.review-grid footer small { color:var(--muted); font-size:.67rem; }
.cta-panel { margin-block:30px 100px; padding:52px; display:flex; align-items:center; justify-content:space-between; gap:30px; color:#fff; border-radius:28px; overflow:hidden; position:relative; background:radial-gradient(circle at 85% 20%,rgba(0,191,234,.35),transparent 26%),linear-gradient(135deg,#061b2b,#005e91); }.cta-panel::after { content:"R"; position:absolute; left:4%; top:-48px; font:900 13rem Arial; opacity:.04; }.cta-panel h2 { max-width:680px; font-size:clamp(2rem,4vw,3.2rem); }.cta-panel p { color:#aac2d1; margin:0; }.cta-actions { display:flex; gap:10px; position:relative; z-index:2; }.btn-light { color:#06304a; background:#fff; }.btn-outline-light { color:#fff; border:1px solid rgba(255,255,255,.3); background:transparent; }

/* Shared inner pages */
.page-hero, .repair-hero, .about-hero { position:relative; overflow:hidden; padding-block:95px; background:linear-gradient(150deg,var(--surface-2),var(--bg)); border-bottom:1px solid var(--line); }.page-hero::after,.repair-hero::after,.about-hero::after { content:""; position:absolute; width:500px; height:500px; top:-280px; inset-inline-end:-150px; border:1px solid rgba(0,143,209,.2); border-radius:50%; box-shadow:0 0 0 80px rgba(0,143,209,.025),0 0 0 160px rgba(0,143,209,.018); }
.page-hero-inner { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:60px; }.page-hero h1,.repair-hero h1,.about-hero h1 { margin:18px 0; font-size:clamp(3rem,6vw,5.6rem); line-height:1.02; letter-spacing:-.06em; }.page-hero h1 strong,.repair-hero h1 strong,.about-hero h1 strong { display:block; color:var(--blue); }.page-hero p,.repair-hero p,.about-hero p { max-width:650px; font-size:1.02rem; }.page-hero-chip { flex:0 0 200px; aspect-ratio:1; display:grid; place-items:center; align-content:center; gap:6px; text-align:center; border:1px solid var(--line); border-radius:50%; background:var(--surface); box-shadow:var(--shadow); }.page-hero-chip span { color:var(--cyan); font-size:1.6rem; }.page-hero-chip small { color:var(--muted); }

/* Shop */
.shop-section { padding-block:55px 110px; }.shop-tools { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:24px; }.filters { display:flex; gap:8px; flex-wrap:wrap; }.filters button { padding:11px 18px; color:var(--muted); border:1px solid var(--line); border-radius:12px; background:var(--surface); cursor:pointer; font-weight:700; }.filters button.active { color:#fff; background:var(--blue); border-color:var(--blue); }.search-box { width:min(320px,100%); height:46px; display:flex; align-items:center; gap:9px; padding:0 15px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }.search-box span { color:var(--blue); font-size:1.3rem; }.search-box input { width:100%; border:0; outline:0; color:var(--ink); background:transparent; }.shop-count { margin-bottom:18px; color:var(--muted); font-size:.82rem; }.shop-count b { color:var(--ink); }.shop-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }.shop-card { min-width:0; border:1px solid var(--line); border-radius:20px; background:var(--surface); overflow:hidden; transition:.3s ease; }.shop-card:hover { transform:translateY(-6px); box-shadow:var(--shadow); }.shop-visual { position:relative; background:linear-gradient(145deg,var(--surface-2),var(--surface)); }.shop-visual .phone-scene,.shop-visual .audio-visual { min-height:270px; transform:scale(.78); margin-block:-20px; }.shop-tag { position:absolute; z-index:2; top:14px; inset-inline-start:14px; padding:6px 9px; color:var(--blue); background:var(--blue-soft); border-radius:7px; font-size:.6rem; font-weight:900; }.heart { position:absolute; z-index:2; top:12px; inset-inline-end:12px; width:32px; height:32px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--surface); font-size:1.1rem; cursor:pointer; }.shop-info { padding:17px; border-top:1px solid var(--line); }.shop-info > span { color:var(--blue); font-size:.64rem; font-weight:900; }.shop-info h3 { margin:8px 0 4px; font-size:.97rem; }.shop-info small { display:block; color:var(--muted); min-height:28px; font-size:.67rem; }.shop-info > div { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:13px; }.shop-info > div b { font-size:.83rem; }.shop-info button { padding:7px 9px; color:#fff; border:0; border-radius:8px; background:var(--deep); font-size:.64rem; font-weight:800; cursor:pointer; }:root[data-theme="dark"] .shop-info button { background:var(--blue); }.empty-state { padding:90px 20px; text-align:center; }.empty-state > b { font-size:2.5rem; color:var(--blue); }

/* Repair */
.repair-hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:1.15fr .85fr; gap:100px; align-items:center; }.repair-promises { display:flex; flex-wrap:wrap; gap:16px; margin-top:28px; }.repair-promises span { color:var(--ink); font-size:.78rem; font-weight:700; }.repair-promises span::first-letter { color:var(--blue); }.diagnostic-card { width:min(390px,100%); justify-self:end; padding:24px; border:1px solid var(--line); border-radius:28px; background:var(--surface); box-shadow:var(--shadow); }.diagnostic-card > small { color:var(--muted); }.pulse-dot { display:inline-block; width:8px; height:8px; margin-inline-end:7px; border-radius:50%; background:#27c881; box-shadow:0 0 0 6px rgba(39,200,129,.12); }.diag-phone { position:relative; height:235px; margin:20px 0; display:grid; place-items:center; border-radius:20px; background:radial-gradient(circle,var(--blue-soft),transparent 65%); }.diag-phone div { width:100px; height:195px; border:5px solid #1a3b50; border-radius:22px; transform:rotate(8deg); background:linear-gradient(150deg,#082134,var(--blue)); box-shadow:17px 22px 28px rgba(5,32,49,.2); }.diag-phone div::after { content:""; display:block; width:35px; height:7px; margin:7px auto; border-radius:8px; background:#02090d; }.diag-phone i { position:absolute; width:170px; height:170px; border:1px dashed rgba(0,143,209,.35); border-radius:50%; animation:spinSpark 10s linear infinite; }.diag-row { display:flex; justify-content:space-between; margin-bottom:10px; font-size:.75rem; }.diag-row b { color:#27c881; }.progress { height:7px; overflow:hidden; border-radius:10px; background:var(--surface-2); }.progress i { display:block; width:88%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--blue),var(--cyan)); }
.repair-services { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.repair-services article { padding:28px 24px; border:1px solid var(--line); border-radius:20px; background:var(--surface); }.repair-services article > span { width:48px; height:48px; display:grid; place-items:center; color:var(--blue); border-radius:13px; background:var(--blue-soft); font-size:1.25rem; }.repair-services h3 { margin:24px 0 8px; }.repair-services p { min-height:72px; font-size:.8rem; }.repair-services a { color:var(--blue); font-size:.76rem; font-weight:900; }.process-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; align-items:start; }.process-list { list-style:none; margin:0; padding:0; }.process-list li { display:flex; gap:25px; padding:22px 0; border-bottom:1px solid var(--line); }.process-list > li > b { color:var(--blue); font-size:1.6rem; }.process-list h3 { margin:0 0 5px; }.process-list p { margin:0; font-size:.8rem; }.booking-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:80px; align-items:start; }.contact-note { display:flex; align-items:center; gap:13px; margin-top:32px; }.contact-note > span { width:45px; height:45px; display:grid; place-items:center; color:#fff; border-radius:13px; background:var(--blue); }.contact-note div { display:grid; }.contact-note small { color:var(--muted); }.booking-form,.message-form { padding:30px; border:1px solid var(--line); border-radius:22px; background:var(--surface); box-shadow:var(--shadow); }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.booking-form label,.message-form label { display:grid; gap:8px; margin-bottom:15px; color:var(--ink); font-size:.75rem; font-weight:800; }.booking-form input,.booking-form select,.booking-form textarea,.message-form input,.message-form textarea { width:100%; padding:13px 14px; border:1px solid var(--line); outline:0; border-radius:11px; color:var(--ink); background:var(--bg); resize:vertical; transition:border .2s ease; }.booking-form input:focus,.booking-form select:focus,.booking-form textarea:focus,.message-form input:focus,.message-form textarea:focus { border-color:var(--blue); }.full-btn { width:100%; }.success-message { min-height:330px; display:grid; place-items:center; align-content:center; text-align:center; }.success-message > span { width:60px; height:60px; display:grid; place-items:center; margin-bottom:15px; color:#fff; border-radius:50%; background:#27c881; font-size:1.5rem; }.success-message h3 { margin-bottom:5px; }.success-message button { color:var(--blue); border:0; background:transparent; font-weight:800; cursor:pointer; }

/* About & Contact */
.about-hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:1.1fr .9fr; gap:90px; align-items:center; }.about-numbers { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.about-numbers div { padding:25px; display:grid; border:1px solid var(--line); border-radius:18px; background:var(--surface); }.about-numbers div:first-child { grid-column:span 2; }.about-numbers b { color:var(--blue); font-size:2.4rem; }.about-numbers span { color:var(--muted); font-size:.75rem; }.values-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:90px; }.values-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.values-cards article { padding:24px; border:1px solid var(--line); border-radius:18px; background:var(--surface); }.values-cards article > b { color:var(--blue); font-size:.75rem; }.values-cards h3 { margin:55px 0 8px; font-size:1rem; }.values-cards p { margin:0; font-size:.74rem; }.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }.contact-cards { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:30px; }.contact-cards > * { display:flex; gap:12px; align-items:flex-start; padding:15px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }.contact-cards > * > span { color:var(--blue); }.contact-cards div div,.contact-cards a div { display:grid; min-width:0; }.contact-cards small { color:var(--muted); font-size:.65rem; }.contact-cards b { margin-top:3px; font-size:.74rem; overflow-wrap:anywhere; }.map-card { position:relative; min-height:430px; overflow:hidden; border:1px solid var(--line); border-radius:26px; background:var(--surface); box-shadow:var(--shadow); }.map-lines { position:absolute; inset:0; opacity:.8; background-image:linear-gradient(28deg,transparent 45%,rgba(0,143,209,.15) 46%,rgba(0,143,209,.15) 48%,transparent 49%),linear-gradient(112deg,transparent 44%,var(--line) 45%,var(--line) 47%,transparent 48%),linear-gradient(90deg,transparent 49%,var(--line) 50%,transparent 51%); background-size:190px 170px,150px 130px,110px 100%; }.map-pin { position:absolute; left:50%; top:45%; transform:translate(-50%,-50%); width:70px; height:70px; display:grid; place-items:center; border:10px solid var(--blue-soft); border-radius:50% 50% 50% 5px; background:var(--blue); color:#fff; rotate:-45deg; box-shadow:0 15px 30px rgba(0,143,209,.3); }.map-pin span { rotate:45deg; font:900 1.6rem Arial; }.map-label { position:absolute; left:50%; bottom:33px; transform:translateX(-50%); width:max-content; padding:12px 17px; display:grid; text-align:center; border-radius:12px; background:var(--surface); box-shadow:var(--shadow); }.map-label small { color:var(--muted); }.message-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:80px; align-items:start; }

/* Footer */
.site-footer { padding-top:65px; color:#dceaf3; background:#04131f; }.footer-grid { display:grid; grid-template-columns:1.25fr .65fr 1fr .8fr; gap:55px; padding-bottom:50px; }.footer-brand img { width:145px; padding:7px; border-radius:12px; background:#fff; }.footer-brand p { max-width:290px; margin:18px 0; color:#8ea5b5; font-size:.78rem; }.site-footer h3 { margin:4px 0 18px; color:#fff; font-size:.85rem; }.site-footer .footer-grid > div:not(:first-child) { display:flex; flex-direction:column; align-items:flex-start; gap:11px; }.site-footer a,.site-footer span { color:#8ea5b5; font-size:.73rem; }.site-footer b { font-size:.8rem; }.socials { display:flex; gap:8px; }.socials a { width:31px; height:31px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.13); border-radius:9px; color:#dceaf3; }.footer-bottom { padding:20px 0; display:flex; justify-content:space-between; border-top:1px solid rgba(255,255,255,.08); }

/* Motion */
.reveal-up { opacity:0; animation:revealUp .7s cubic-bezier(.2,.75,.25,1) forwards; }.delay-1 { animation-delay:.1s; }.delay-2 { animation-delay:.2s; }.delay-3 { animation-delay:.3s; }.reveal-scale { opacity:0; animation:revealScale .9s .15s cubic-bezier(.2,.75,.25,1) forwards; }.scroll-reveal { opacity:0; transform:translateY(30px); transition:opacity .8s ease,transform .8s cubic-bezier(.2,.75,.25,1); }.scroll-reveal.is-visible { opacity:1; transform:none; }
@keyframes revealUp { to { opacity:1; transform:none; } from { opacity:0; transform:translateY(25px); } } @keyframes revealScale { to { opacity:1; transform:none; } from { opacity:0; transform:scale(.94); } } @keyframes phoneFloat { 0%,100% { transform:rotateY(-14deg) rotateZ(5deg) translateY(0); } 50% { transform:rotateY(-10deg) rotateZ(3deg) translateY(-16px); } } @keyframes badgeFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } } @keyframes spinSpark { to { transform:rotate(360deg); } }

/* Responsive */
@media (max-width: 1020px) {
  .nav-links { gap:18px; }.nav-cta { display:none; }.hero-grid { gap:20px; }.display { font-size:clamp(3rem,7vw,4.8rem); }.service-grid { gap:45px; }.shop-grid { grid-template-columns:repeat(3,1fr); }.repair-hero-grid,.about-hero-grid { gap:50px; }.repair-services { grid-template-columns:1fr 1fr; }.values-grid,.message-grid { gap:40px; }.values-cards { grid-template-columns:1fr; }.values-cards h3 { margin-top:25px; }.footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 760px) {
  .container { width:min(100% - 28px, 1180px); }.section { padding-block:75px; }.site-header { height:70px; }.brand { width:116px; height:45px; }.menu-btn { display:flex; flex-direction:column; justify-content:center; gap:6px; }.menu-btn span { width:18px; height:2px; background:currentColor; }.nav-links { position:absolute; inset:70px 0 auto; padding:18px 20px 25px; display:flex; flex-direction:column; align-items:stretch; gap:0; border-bottom:1px solid var(--line); background:var(--surface); transform:translateY(-130%); opacity:0; transition:.3s ease; z-index:-1; }.nav-links.open { transform:none; opacity:1; }.nav-links > a { padding:14px 5px; border-bottom:1px solid var(--line); }.mobile-nav-cta { display:block; margin-top:12px; text-align:center; color:#fff!important; border:0!important; border-radius:12px; background:var(--blue); }.hero { padding-top:40px; }.hero-grid { min-height:auto; grid-template-columns:1fr; text-align:center; }.hero-copy { padding-bottom:0; }.hero-copy .eyebrow { justify-content:center; }.display { font-size:clamp(3.2rem,14vw,5.2rem); }.hero-intro { font-size:.94rem; }.hero-actions { justify-content:center; flex-wrap:wrap; }.trust-line { justify-content:center; }.hero-product { margin-top:-25px; }.hero-phone { min-height:500px; transform:scale(.9); }.stats-strip { gap:15px; padding:17px 10px; }.stats-strip div { display:grid; text-align:center; gap:2px; }.stats-strip b { font-size:1rem; }.stats-strip span { font-size:.6rem; }.stats-strip i { height:35px; }.split-head { display:block; }.text-link { display:inline-block; margin-top:10px; }.product-grid,.feature-grid,.review-grid { grid-template-columns:1fr; }.product-card .phone-scene,.product-card .audio-visual { min-height:300px; }.service-grid { grid-template-columns:1fr; }.service-visual { min-height:390px; }.repair-ring { width:260px; height:260px; }.mini-badge { bottom:30px; }.steps { grid-template-columns:1fr; }.fast-card { align-items:stretch; flex-direction:column; }.cta-panel { margin-bottom:70px; padding:35px 24px; display:block; text-align:center; }.cta-panel .eyebrow { justify-content:center; }.cta-actions { justify-content:center; flex-wrap:wrap; margin-top:25px; }.page-hero,.repair-hero,.about-hero { padding-block:65px; }.page-hero-inner { display:block; text-align:center; }.page-hero h1,.repair-hero h1,.about-hero h1 { font-size:clamp(3rem,14vw,4.6rem); }.page-hero-chip { width:160px; margin:35px auto 0; }.shop-tools { flex-direction:column; align-items:stretch; }.filters { justify-content:center; }.search-box { width:100%; }.shop-grid { grid-template-columns:1fr 1fr; }.repair-hero-grid,.about-hero-grid { grid-template-columns:1fr; text-align:center; }.repair-promises { justify-content:center; }.diagnostic-card { justify-self:center; }.repair-services { grid-template-columns:1fr; }.process-grid,.booking-grid,.values-grid,.contact-grid,.message-grid { grid-template-columns:1fr; gap:45px; }.contact-cards { grid-template-columns:1fr; }.form-row { grid-template-columns:1fr; }.about-numbers { width:min(450px,100%); margin:auto; }.values-intro,.message-grid > div { text-align:center; }.footer-grid { grid-template-columns:1fr; gap:35px; }.footer-bottom { gap:15px; flex-wrap:wrap; }
}
@media (max-width: 470px) {
  .icon-btn { width:35px; height:35px; }.shop-grid { grid-template-columns:1fr; }.shop-visual .phone-scene,.shop-visual .audio-visual { min-height:290px; }.repair-promises { flex-direction:column; }.cta-actions .btn { width:100%; }.stats-strip { margin-inline:14px; width:auto; }.hero-phone { transform:scale(.78); margin-inline:-35px; }.display { font-size:3.35rem; }.about-numbers { grid-template-columns:1fr; }.about-numbers div:first-child { grid-column:auto; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; } }

/* Static Hostinger edition */
.static-page main { min-height: 65vh; }
.static-page .site-header .brand img, .static-page .site-footer img { height: 100%; object-fit: contain; }
.nav-links a.active { color: var(--blue); border-color: var(--blue); }
.toast { position: fixed; z-index: 100; left: 50%; bottom: 28px; transform: translate(-50%, 30px); padding: 13px 20px; color: #fff; border-radius: 12px; background: var(--deep); box-shadow: var(--shadow); opacity: 0; pointer-events: none; transition: .3s ease; font-size: .82rem; font-weight: 800; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.hero-mini-products { display: flex; justify-content: center; gap: 15px; align-items: end; min-height: 520px; position: relative; }
.hero-mini-products .phone-body:nth-child(2) { width: 220px; height: 445px; z-index: 2; }
.hero-mini-products .phone-body:first-child { width: 150px; height: 300px; margin-inline-end: -45px; opacity: .76; }
.hero-mini-products .phone-body:last-child { width: 145px; height: 285px; margin-inline-start: -48px; opacity: .72; }
.category-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: -35px; position: relative; z-index: 4; }
.category-strip a { padding: 22px; display: flex; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 17px; background: var(--surface); box-shadow: var(--shadow); font-weight: 800; }
.category-strip a span { width: 40px; height: 40px; display: grid; place-items: center; color: var(--blue); border-radius: 11px; background: var(--blue-soft); }
.html-product-card .phone-scene, .html-product-card .audio-visual { min-height: 270px; transform: scale(.8); margin-block: -15px; }
.simple-banner { padding-block: 70px; text-align: center; background: linear-gradient(145deg, var(--surface-2), var(--bg)); border-bottom: 1px solid var(--line); }
.simple-banner h1 { margin: 14px 0; font-size: clamp(2.8rem, 7vw, 5rem); letter-spacing: -.055em; }
.simple-banner p { max-width: 650px; margin-inline: auto; }
.privacy-note { margin-top: 14px; color: var(--muted); font-size: .7rem; text-align: center; }
@media (max-width: 760px) { .category-strip { grid-template-columns: 1fr 1fr; margin-top: 15px; }.hero-mini-products { min-height: 430px; transform: scale(.77); margin-inline: -70px; }.simple-banner { padding-block: 55px; } }
@media (max-width: 440px) { .category-strip { grid-template-columns: 1fr; } }

/* Cinematic motion system */
body::before { content: ""; position: fixed; inset: 0; z-index: 999; pointer-events: none; background: var(--bg); transform-origin: top; animation: pageCurtain .72s cubic-bezier(.76,0,.24,1) forwards; }
body.page-leave::before { animation: pageClose .28s cubic-bezier(.76,0,.24,1) forwards; }
.motion-progress { position: fixed; z-index: 120; top: 0; inset-inline-start: 0; width: 0; height: 3px; background: linear-gradient(90deg, var(--blue), var(--cyan), #86eaff); box-shadow: 0 0 18px var(--cyan); pointer-events: none; }
.cursor-glow { position: fixed; z-index: 4; width: 260px; height: 260px; border-radius: 50%; pointer-events: none; opacity: .11; filter: blur(35px); background: radial-gradient(circle, var(--cyan), transparent 67%); transform: translate(-50%,-50%); transition: opacity .3s ease; mix-blend-mode: screen; }
.site-header { animation: headerDrop .8s .25s both cubic-bezier(.16,1,.3,1); }
.brand { position: relative; transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease; }
.brand::after { content: ""; position: absolute; inset: -70% -35%; background: linear-gradient(100deg, transparent 40%, rgba(255,255,255,.72) 50%, transparent 60%); transform: translateX(-100%) rotate(9deg); animation: logoShine 5s 1.4s infinite; }
.brand:hover { transform: rotate(-2deg) scale(1.055); box-shadow: 0 12px 28px rgba(0,143,209,.18); }
.nav-links > a { position: relative; animation: navDrop .55s both cubic-bezier(.16,1,.3,1); }
.nav-links > a:nth-child(1) { animation-delay: .34s; }.nav-links > a:nth-child(2) { animation-delay: .41s; }.nav-links > a:nth-child(3) { animation-delay: .48s; }.nav-links > a:nth-child(4) { animation-delay: .55s; }
.icon-btn { animation: popIn .5s .62s both cubic-bezier(.16,1.4,.3,1); }
.hero-orb { translate: 0 var(--parallax-y,0); animation: orbPulse 6s ease-in-out infinite alternate; }
.hero::before { content: ""; position: absolute; width: 45%; height: 180%; top: -50%; left: 28%; opacity: .08; background: linear-gradient(90deg,transparent,#fff,transparent); transform: rotate(22deg) translateX(-140%); animation: heroSweep 7s 1s infinite; pointer-events: none; }
.hero-mini-products { transform-style: preserve-3d; animation: sceneBreathe 5.5s ease-in-out infinite; }
.hero-mini-products .phone-body { transition: filter .4s ease; }
.hero-mini-products .phone-body:first-child { animation: sidePhoneLeft 5s ease-in-out infinite; }
.hero-mini-products .phone-body:last-child { animation: sidePhoneRight 5.5s -.7s ease-in-out infinite; }
.hero-mini-products:hover .phone-body { filter: saturate(1.2) brightness(1.08); }
.stats-strip { animation: statsRise .8s .65s both cubic-bezier(.16,1,.3,1); }
.stats-strip b { display: inline-block; animation: numberGlow 2.4s 1.1s ease-in-out infinite alternate; }
.category-strip a { position: relative; overflow: hidden; transition: transform .35s cubic-bezier(.16,1,.3,1), border-color .3s ease, box-shadow .3s ease; }
.category-strip a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg,transparent 30%,rgba(0,191,234,.14),transparent 70%); transform: translateX(-110%); transition: transform .65s ease; }
.category-strip a:hover { transform: translateY(-9px) scale(1.02); border-color: rgba(0,143,209,.32); box-shadow: 0 26px 55px rgba(0,105,160,.16); }
.category-strip a:hover::after { transform: translateX(110%); }
.category-strip a span,.feature-icon,.repair-services article > span { animation: iconFloat 3s ease-in-out infinite; }
.category-strip a:nth-child(2) span,.repair-services article:nth-child(2) > span { animation-delay: -.7s; }.category-strip a:nth-child(3) span,.repair-services article:nth-child(3) > span { animation-delay: -1.4s; }.category-strip a:nth-child(4) span,.repair-services article:nth-child(4) > span { animation-delay: -2.1s; }
.motion-item { opacity: 0; transform: translateY(36px) scale(.97); filter: blur(7px); transition: opacity .75s cubic-bezier(.16,1,.3,1), transform .75s cubic-bezier(.16,1,.3,1), filter .75s ease; transition-delay: var(--motion-delay,0ms); }
.motion-item.motion-in { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
.section-head h2,.simple-banner h1,.page-hero h1,.repair-hero h1,.about-hero h1 { background-image: linear-gradient(110deg,var(--ink) 20%,var(--blue) 46%,var(--ink) 70%); background-size: 240% auto; background-clip: text; color: transparent; animation: headlineShimmer 7s linear infinite; }
.product-card,.shop-card,.feature-card,.review-grid blockquote,.repair-services article,.values-cards article,.contact-cards > * { transform-style: preserve-3d; will-change: transform; }
.product-card::after,.shop-card::after,.feature-card::after,.repair-services article::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(0,191,234,.18),transparent 35%); opacity: 0; transition: opacity .3s ease; }
.product-card:hover::after,.shop-card:hover::after,.feature-card:hover::after,.repair-services article:hover::after { opacity: 1; }
.product-card,.feature-card,.repair-services article { position: relative; overflow: hidden; }
.shop-card:hover .phone-body,.product-card:hover .phone-body { animation-duration: 2.6s; }
.text-link span,.btn span { display: inline-block; transition: transform .3s ease; }.text-link:hover span,.btn:hover span { transform: translateX(-6px); }
.btn { position: relative; overflow: hidden; will-change: transform; }
.btn::after { content: ""; position: absolute; width: 18px; height: 18px; left: var(--ripple-x,50%); top: var(--ripple-y,50%); border-radius: 50%; background: rgba(255,255,255,.42); transform: translate(-50%,-50%) scale(0); opacity: 0; }
.btn.ripple::after { animation: ripple .65s ease-out; }
.repair-ring { animation: ringBreathe 4.5s ease-in-out infinite; }
.repair-ring span { animation: starPulse 1.8s ease-in-out infinite; }
.mini-badge,.map-label { animation: badgeFloat 4s ease-in-out infinite; }
.diagnostic-card { animation: diagHover 5s ease-in-out infinite; }
.pulse-dot { animation: livePulse 1.7s ease-out infinite; }
.progress i { transform-origin: right; animation: scanProgress 2.5s ease-in-out infinite; }
.diag-phone i { box-shadow: 0 0 22px rgba(0,191,234,.18); }
.map-pin { animation: pinBounce 2.5s ease-in-out infinite; }
.map-lines { animation: mapDrift 15s linear infinite; }
.stars { background: linear-gradient(90deg,#ffaf18,#fff0a5,#ffaf18); background-size: 200% auto; color: transparent; background-clip: text; animation: starShine 2.6s linear infinite; }
.cta-panel { background-size: 140% 140%; animation: ctaFlow 7s ease-in-out infinite; }
.socials a { transition: .3s cubic-bezier(.16,1,.3,1); }.socials a:hover { color:#fff; border-color:var(--cyan); background:var(--blue); transform:translateY(-5px) rotate(6deg); }
.eyebrow::before { transform-origin: right; animation: linePulse 2.5s ease-in-out infinite; }
.screen-glow { animation: screenPulse 3s ease-in-out infinite; }
.screen-mark { animation: markBreathe 4s ease-in-out infinite; }

@keyframes pageCurtain { 0%{transform:scaleY(1)} 100%{transform:scaleY(0)} } @keyframes pageClose { from{transform:scaleY(0)} to{transform:scaleY(1)} }
@keyframes headerDrop { from{opacity:0;transform:translateY(-100%)} to{opacity:1;transform:none} } @keyframes navDrop { from{opacity:0;transform:translateY(-16px)} to{opacity:1;transform:none} }
@keyframes popIn { from{opacity:0;transform:scale(.5) rotate(-18deg)} to{opacity:1;transform:none} } @keyframes logoShine { 0%,75%{transform:translateX(-120%) rotate(9deg)} 100%{transform:translateX(120%) rotate(9deg)} }
@keyframes heroSweep { 0%,55%{transform:rotate(22deg) translateX(-140%)} 90%,100%{transform:rotate(22deg) translateX(180%)} } @keyframes orbPulse { to{scale:1.12;opacity:.65} }
@keyframes sceneBreathe { 0%,100%{transform:translateY(0) rotateY(0) scale(var(--scene-scale,1))} 50%{transform:translateY(-12px) rotateY(-2deg) scale(var(--scene-scale,1))} } @keyframes sidePhoneLeft { 0%,100%{transform:translateY(18px) rotate(-7deg)} 50%{transform:translateY(0) rotate(-10deg)} } @keyframes sidePhoneRight { 0%,100%{transform:translateY(22px) rotate(8deg)} 50%{transform:translateY(2px) rotate(11deg)} }
@keyframes statsRise { from{opacity:0;transform:translateY(45px) scale(.96)} to{opacity:1;transform:none} } @keyframes numberGlow { to{text-shadow:0 0 20px rgba(0,191,234,.52)} }
@keyframes iconFloat { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-7px) rotate(4deg)} } @keyframes headlineShimmer { to{background-position:240% center} }
@keyframes ripple { 0%{transform:translate(-50%,-50%) scale(0);opacity:.65} 100%{transform:translate(-50%,-50%) scale(24);opacity:0} } @keyframes ringBreathe { 0%,100%{transform:scale(1);box-shadow:inset 0 0 70px rgba(0,191,234,.08),0 0 100px rgba(0,143,209,.12)} 50%{transform:scale(1.035);box-shadow:inset 0 0 90px rgba(0,191,234,.14),0 0 130px rgba(0,143,209,.22)} }
@keyframes starPulse { 50%{transform:scale(1.35) rotate(25deg);text-shadow:0 0 18px var(--cyan)} } @keyframes diagHover { 50%{transform:translateY(-11px) rotate(.5deg)} } @keyframes livePulse { 0%{box-shadow:0 0 0 0 rgba(39,200,129,.4)} 100%{box-shadow:0 0 0 14px rgba(39,200,129,0)} }
@keyframes scanProgress { 0%{transform:scaleX(.2)} 60%,100%{transform:scaleX(1)} } @keyframes pinBounce { 0%,100%{translate:0 0} 45%{translate:0 -13px} 60%{translate:0 -8px} } @keyframes mapDrift { to{background-position:190px 170px,-150px 130px,110px 0} }
@keyframes starShine { to{background-position:200% center} } @keyframes ctaFlow { 50%{background-position:70% 30%} } @keyframes linePulse { 50%{transform:scaleX(.5);opacity:.5} } @keyframes screenPulse { 50%{transform:scale(1.16);opacity:.6} } @keyframes markBreathe { 50%{transform:scale(1.06);text-shadow:0 0 25px rgba(255,255,255,.35)} }

@media (hover:none),(pointer:coarse) { .cursor-glow{display:none}.product-card,.shop-card,.feature-card,.review-grid blockquote,.repair-services article,.values-cards article{will-change:auto} }
@media (prefers-reduced-motion:reduce) { body::before,.motion-progress,.cursor-glow{display:none}.motion-item{opacity:1;transform:none;filter:none}.section-head h2,.simple-banner h1,.page-hero h1,.repair-hero h1,.about-hero h1{animation:none;background:initial;color:var(--ink)} }

/* Mobile layout hardening */
.hero-grid > *, .page-hero-inner > *, .repair-hero-grid > *, .about-hero-grid > *, .service-grid > *, .process-grid > *, .booking-grid > *, .contact-grid > *, .message-grid > * { min-width: 0; }
.shop-card, .product-card, .review-grid blockquote, .booking-form, .message-form, input, select, textarea { min-width: 0; max-width: 100%; }
input[name="website"] { position: fixed !important; inset: 0 auto auto 0 !important; left: auto !important; width: 1px !important; height: 1px !important; padding: 0 !important; opacity: 0 !important; pointer-events: none !important; }
@media (max-width: 760px) {
  .container { width: calc(100% - 28px); max-width: 1180px; }
  .hero { padding-top: 30px; }
  .hero-grid { width: calc(100% - 28px); gap: 0; }
  .hero-copy { width: 100%; min-width: 0; overflow: visible; }
  .display { width: 100%; font-size: clamp(2.8rem, 13.5vw, 4.2rem); line-height: 1.03; letter-spacing: -.05em; overflow-wrap: anywhere; }
  .hero-intro { max-width: 34rem; margin-inline: auto; }
  .hero-mini-products { --scene-scale: .72; width: 100%; min-height: 390px; margin: -20px 0 -40px; transform-origin: center top; overflow: visible; }
  .hero-mini-products .phone-body:nth-child(2) { width: 205px; height: 410px; }
  .hero-mini-products .phone-body:first-child { width: 135px; height: 270px; margin-inline-end: -42px; }
  .hero-mini-products .phone-body:last-child { width: 132px; height: 260px; margin-inline-start: -44px; }
  .stats-strip { width: calc(100% - 28px); margin-inline: auto; }
  .page-hero-inner, .repair-hero-grid, .about-hero-grid { width: calc(100% - 28px); }
  .page-hero h1, .repair-hero h1, .about-hero h1 { max-width: 100%; font-size: clamp(2.8rem, 13vw, 4.1rem); overflow-wrap: anywhere; }
  .shop-section { padding-block: 38px 75px; }
  .shop-tools { gap: 14px; }
  .filters { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  .filters button { width: 100%; padding-inline: 8px; }
  .service-grid, .process-grid, .booking-grid, .values-grid, .contact-grid, .message-grid { width: calc(100% - 28px); }
  .repair-services, .product-grid, .review-grid, .feature-grid, .shop-grid { width: 100%; }
  .booking-form, .message-form { padding: 22px 18px; }
  .footer-grid, .footer-bottom { width: calc(100% - 28px); }
}
@media (max-width: 380px) {
  .site-header { height: 66px; }
  .brand { width: 103px; height: 42px; }
  .nav-wrap { width: calc(100% - 20px); gap: 8px; }
  .nav-actions { gap: 5px; }
  .icon-btn, .menu-btn { width: 36px; height: 36px; border-radius: 10px; }
  .nav-links { inset-block-start: 66px; }
  .hero { padding-top: 24px; }
  .hero-grid { width: calc(100% - 24px); }
  .eyebrow { font-size: .67rem; letter-spacing: .09em; }
  .display { margin-top: 16px; font-size: clamp(2.45rem, 13vw, 3rem); line-height: 1.05; }
  .hero-intro { font-size: .82rem; line-height: 1.8; }
  .hero-actions { width: 100%; gap: 8px; }
  .hero-actions .btn { flex: 1 1 0; min-width: 0; padding-inline: 10px; font-size: .78rem; }
  .trust-line { font-size: .73rem; }
  .hero-mini-products { --scene-scale: .62; min-height: 330px; margin: -35px 0 -70px; }
  .stats-strip { width: calc(100% - 20px); gap: 8px; padding-inline: 7px; }
  .stats-strip b { font-size: .9rem; }.stats-strip span { font-size: .54rem; }
  .category-strip { width: calc(100% - 24px); }
  h2 { font-size: clamp(1.75rem, 9vw, 2.35rem); }
  .section { padding-block: 58px; }
  .page-hero h1, .repair-hero h1, .about-hero h1 { font-size: clamp(2.35rem, 12vw, 3rem); }
  .page-hero p, .repair-hero p, .about-hero p { font-size: .85rem; }
  .page-hero-chip { width: 140px; }
  .repair-ring { width: 230px; height: 230px; }
  .repair-ring b { font-size: 2rem; }
  .diagnostic-card { padding: 18px; }
  .cta-panel { padding: 30px 18px; }
  .cta-panel h2 { font-size: 1.8rem; }
  .contact-cards > * { min-width: 0; }
  .map-card { min-height: 340px; }
}

/* Touch devices: motion stays elegant without making the page drift */
@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  .brand::after,
  .hero::before,
  .hero-orb,
  .hero-mini-products,
  .hero-mini-products .phone-body,
  .phone-body,
  .stats-strip b,
  .category-strip a span,
  .feature-icon,
  .repair-services article > span,
  .section-head h2,
  .simple-banner h1,
  .page-hero h1,
  .repair-hero h1,
  .about-hero h1,
  .repair-ring,
  .repair-ring::before,
  .repair-ring::after,
  .repair-ring span,
  .mini-badge,
  .map-label,
  .diagnostic-card,
  .pulse-dot,
  .progress i,
  .diag-phone i,
  .map-pin,
  .map-lines,
  .stars,
  .cta-panel,
  .eyebrow::before,
  .screen-glow,
  .screen-mark { animation: none !important; }

  .hero-orb { translate: 0 0 !important; }
  .section-head h2,
  .simple-banner h1,
  .page-hero h1,
  .repair-hero h1,
  .about-hero h1 { background: none; color: var(--ink); }
  .page-hero h1 strong,
  .repair-hero h1 strong,
  .about-hero h1 strong { color: var(--blue); }

  .hero-mini-products { width: 100%; min-height: 325px; margin: -5px 0 -25px; opacity: 1 !important; transform: none !important; display: flex; align-items: center; justify-content: center; overflow: hidden; }
  .hero-mini-products .phone-body:first-child,
  .hero-mini-products .phone-body:last-child { display: none; }
  .hero-mini-products .phone-body:nth-child(2) { display: block; width: 170px; height: 340px; margin: 0; transform: rotate(3deg) !important; }
  .hero-mini-products .phone-body:nth-child(2) .phone-screen { border-radius: 28px; }
}

@media (max-width: 380px) {
  .hero-mini-products { min-height: 285px; margin-top: -10px; }
  .hero-mini-products .phone-body:nth-child(2) { width: 148px; height: 296px; }
}