:root {
  --ink: #071522;
  --navy: #081c30;
  --cyan: #14b8d4;
  --cyan-light: #70e3ef;
  --amber: #f5b941;
  --paper: #f4f7f8;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ink); color: #fff; font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }

.site-header {
  height: 92px; padding: 0 clamp(24px, 5vw, 84px); display: grid;
  grid-template-columns: auto 1fr auto; align-items: center; gap: 48px;
  position: absolute; inset: 0 0 auto; z-index: 20;
  border-bottom: 1px solid rgba(255,255,255,.13);
  background: linear-gradient(180deg, rgba(3,14,26,.72), transparent);
}
.brand { display: flex; align-items: center; gap: 11px; }
.brand img { width: 43px; height: 52px; object-fit: cover; object-position: 50% 23%; border-radius: 8px; mix-blend-mode: screen; filter: contrast(1.2); }
.brand-copy { display: flex; flex-direction: column; line-height: .88; letter-spacing: .06em; }
.brand-copy b { font-size: 21px; }
.brand-copy small { margin-top: 7px; color: #91a6b5; font-size: 9px; letter-spacing: .34em; }
.main-nav { justify-self: center; display: flex; gap: clamp(24px, 3vw, 48px); align-items: center; }
.main-nav a { position: relative; color: #d8e2e8; font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.main-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -12px; height: 2px; background: var(--cyan); transition: right .3s ease; }
.main-nav a:hover::after { right: 0; }
.header-contact { min-width: 142px; height: 44px; display: flex; align-items: center; justify-content: center; gap: 14px; background: rgba(20,184,212,.12); border: 1px solid rgba(76,213,232,.6); font-size: 13px; font-weight: 800; transition: .3s; }
.header-contact:hover { background: var(--cyan); color: var(--ink); }
.header-contact i { font-style: normal; font-size: 18px; }
.menu-toggle { display: none; }

.hero { min-height: min(900px, 100vh); height: 100vh; position: relative; overflow: hidden; isolation: isolate; background: #051321; }
.hero-image {
  position: absolute; inset: 0; z-index: -4;
  background-image: linear-gradient(90deg, rgba(3,14,26,.98) 0%, rgba(3,14,26,.88) 30%, rgba(3,14,26,.15) 67%, rgba(3,14,26,.2) 100%), url('/media/hero-radio-tian.png');
  background-size: cover; background-position: center; animation: hero-breathe 10s ease-in-out infinite alternate;
}
.hero::after { content:""; position:absolute; inset:0; z-index:-3; background: radial-gradient(circle at 72% 42%, transparent 0 18%, rgba(2,14,25,.25) 58%, rgba(2,12,21,.7)); }
.hero-grid { position:absolute; inset:0; z-index:-2; opacity:.12; background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg,#000,transparent 72%); }
.signal-rings { position:absolute; width:620px; height:620px; right:8%; top:16%; z-index:-1; opacity:.28; }
.signal-rings i { position:absolute; border:1px solid var(--cyan-light); border-radius:50%; inset:22%; animation:ring 4.6s ease-out infinite; }
.signal-rings i:nth-child(2){ animation-delay:1.4s; }
.signal-rings i:nth-child(3){ animation-delay:2.8s; }

.hero-content { position:absolute; z-index:2; top:50%; left:clamp(24px,9vw,146px); width:min(650px,50vw); transform:translateY(-42%); animation:content-in .85s cubic-bezier(.16,1,.3,1); }
.eyebrow { display:flex; align-items:center; gap:14px; margin-bottom:26px; color:var(--cyan-light); font-size:11px; font-weight:900; letter-spacing:.28em; }
.eyebrow span { width:36px; height:2px; background:var(--cyan); box-shadow:0 0 14px var(--cyan); }
.hero h1 { margin:0; font-size:clamp(56px,6vw,102px); line-height:.91; letter-spacing:-.065em; font-weight:850; text-wrap:balance; }
.hero h1 span { display:block; }
.hero h1 span:last-child { color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.75); }
.hero-content > p { max-width:600px; margin:31px 0 36px; color:#b8c8d2; font-size:clamp(16px,1.3vw,20px); line-height:1.65; }
.hero-actions { display:flex; align-items:center; gap:31px; }
.primary-button { min-height:58px; padding:0 28px; display:inline-flex; align-items:center; gap:26px; background:var(--cyan); color:#03131f; font-size:13px; font-weight:900; box-shadow:0 12px 40px rgba(20,184,212,.22); transition:.3s; }
.primary-button:hover { transform:translateY(-3px); background:#6ee8f4; }
.primary-button i { font-size:21px; font-style:normal; }
.text-link { color:#dce8ed; font-size:13px; font-weight:800; }
.text-link span { margin-right:10px; color:var(--amber); font-size:10px; animation:pulse 1.8s infinite; }
.hero-stat { position:absolute; right:clamp(28px,6vw,96px); bottom:110px; display:grid; justify-items:end; animation:stat-in 1s .15s both; }
.hero-stat strong { font-size:clamp(44px,4vw,68px); line-height:1; color:#fff; }
.hero-stat span { margin-top:7px; color:#9bb0bd; font-size:11px; letter-spacing:.18em; text-transform:uppercase; }
.slider-controls { position:absolute; left:clamp(24px,9vw,146px); bottom:56px; display:flex; align-items:center; gap:17px; }
.slider-controls > button { width:42px; height:42px; border:1px solid rgba(255,255,255,.22); background:rgba(4,20,34,.35); color:#fff; cursor:pointer; transition:.25s; }
.slider-controls > button:hover { border-color:var(--cyan); color:var(--cyan); }
.slider-dots { display:flex; align-items:center; gap:7px; }
.slider-dots button { width:34px; height:18px; padding:0; border:0; background:none; cursor:pointer; }
.slider-dots span { display:block; width:100%; height:2px; background:rgba(255,255,255,.28); overflow:hidden; }
.slider-dots .active span::after { content:""; display:block; height:100%; background:var(--cyan); animation:progress 6.5s linear; }
.scroll-cue { position:absolute; left:52%; bottom:0; height:74px; display:flex; flex-direction:column; align-items:center; gap:11px; color:#8fa4b1; font-size:8px; letter-spacing:.3em; }
.scroll-cue i { font-style:normal; color:var(--cyan); animation:scroll 1.7s infinite; }
.brands-strip {
  min-height: 118px; padding: 24px clamp(24px, 6vw, 96px); display: grid;
  grid-template-columns: 180px 1fr 180px; align-items: center; gap: 36px;
  background: #fff; color: var(--ink); border-bottom: 1px solid #dfe6e9;
}
.brands-strip > p { margin: 0; color: #6b7b84; font-size: 10px; line-height: 1.5; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.brand-logos { display: grid; grid-template-columns: repeat(5, minmax(70px, 1fr)); align-items: center; gap: clamp(22px, 4vw, 70px); }
.brand-logos img { width: 100%; height: 35px; object-fit: contain; filter: grayscale(1); opacity: .48; transition: .3s; }
.brand-logos img:hover { filter: grayscale(0); opacity: 1; }
.brand-proof { justify-self: end; color: #77868f; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.brand-proof b { display: block; color: var(--ink); font-size: 23px; letter-spacing: -.04em; }

.section-light { padding: clamp(90px, 10vw, 160px) clamp(24px, 7vw, 112px); background: var(--paper); color: var(--ink); }
.section-heading { max-width: 1340px; margin: 0 auto 70px; display: grid; grid-template-columns: 1.3fr .7fr; align-items: end; gap: 70px; }
.section-heading h2, .method-copy h2, .contact-copy h2 { margin: 18px 0 0; font-size: clamp(48px, 5.3vw, 88px); line-height: .97; letter-spacing: -.065em; }
.section-heading h2 em, .method-copy h2 em, .contact-copy h2 em { color: transparent; font-style: normal; -webkit-text-stroke: 1px #78909d; }
.section-heading > p { max-width: 470px; margin: 0 0 8px; color: #697983; font-size: 17px; line-height: 1.75; }
.section-kicker { color: #079cb9; font-size: 10px; font-weight: 900; letter-spacing: .28em; }
.section-heading.dark { color: #fff; }
.section-heading.dark h2 em { -webkit-text-stroke-color: #637586; }

[data-reveal] { opacity: 0; transform: translateY(36px); transition: opacity .8s ease, transform .8s cubic-bezier(.16,1,.3,1); transition-delay: var(--delay, 0ms); }
[data-reveal].is-visible { opacity: 1; transform: none; }

.service-grid { max-width: 1340px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #cad4d8; border-left: 1px solid #cad4d8; }
.service-card { min-height: 430px; padding: 30px; display: flex; flex-direction: column; border-right: 1px solid #cad4d8; border-bottom: 1px solid #cad4d8; background: rgba(255,255,255,.25); transition: background .35s, transform .35s, box-shadow .35s; }
.service-card:hover { background: #fff; transform: translateY(-8px); box-shadow: 0 26px 60px rgba(4,27,42,.09); }
.service-top { display: flex; justify-content: space-between; align-items: flex-start; color: #87979f; }
.service-top > span { font-size: 10px; font-weight: 900; letter-spacing: .2em; }
.service-top i { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%; background: #e3eef1; color: #079cb9; font-style: normal; font-size: 25px; transition: .35s; }
.service-card:hover .service-top i { background: var(--cyan); color: #fff; transform: rotate(10deg); }
.service-card h3 { margin: 65px 0 20px; font-size: 24px; line-height: 1.15; letter-spacing: -.035em; }
.service-card p { margin: 0; color: #6d7c84; font-size: 14px; line-height: 1.75; }
.service-card small { margin-top: 24px; color: #83939b; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.service-card > a { margin-top: auto; padding-top: 28px; display: flex; justify-content: space-between; border-top: 1px solid #dce3e6; color: #163342; font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.service-card > a b { color: #079cb9; font-size: 18px; }

.method-section { min-height: 820px; display: grid; grid-template-columns: 1fr 1fr; background: #061725; }
.method-visual { min-height: 700px; position: relative; overflow: hidden; background: radial-gradient(circle at 50% 50%, rgba(16,177,206,.16), transparent 28%), linear-gradient(145deg,#0b2d42,#05131f 70%); }
.method-visual::before { content:""; position:absolute; inset:0; opacity:.18; background-image:linear-gradient(rgba(112,227,239,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(112,227,239,.2) 1px,transparent 1px); background-size:44px 44px; transform:perspective(500px) rotateX(58deg) scale(1.6); }
.coverage-map { position: absolute; width: min(560px, 80%); aspect-ratio: 1; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.coverage-circle { position: absolute; inset: 18%; border: 1px solid rgba(81,218,237,.34); border-radius: 50%; animation: coverage 4s ease-out infinite; }
.coverage-circle.circle-two { animation-delay: 1.3s; }
.coverage-circle.circle-three { animation-delay: 2.6s; }
.coverage-core { position: absolute; z-index: 2; width: 96px; height: 96px; left: 50%; top: 50%; transform: translate(-50%,-50%); display: grid; place-items: center; border: 1px solid var(--cyan); border-radius: 50%; color: #fff; background: rgba(7,26,40,.84); box-shadow: 0 0 50px rgba(20,184,212,.25); letter-spacing: .14em; }
.coverage-core small { display: block; color: var(--cyan-light); font-size: 7px; letter-spacing: .2em; }
.map-label { position: absolute; z-index: 3; color: #c5d3da; font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.map-label i { display: inline-block; width: 6px; height: 6px; margin-left: 8px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 16px var(--amber); }
.label-a { top: 15%; left: 16%; }.label-b { top: 36%; right: 5%; }.label-c { bottom: 17%; left: 11%; }
.method-copy { padding: clamp(80px, 8vw, 140px); display: flex; flex-direction: column; justify-content: center; }
.method-copy h2 { color: #fff; }
.method-copy > p { max-width: 580px; margin: 32px 0 42px; color: #9fb0bb; font-size: 16px; line-height: 1.8; }
.method-copy ol { margin: 0; padding: 0; list-style: none; }
.method-copy li { max-width: 610px; padding: 20px 0; display: grid; grid-template-columns: 55px 1fr; gap: 18px; border-top: 1px solid rgba(255,255,255,.12); }
.method-copy li > b { color: var(--cyan); font-size: 10px; letter-spacing: .16em; }
.method-copy li span { color: #8fa2ae; font-size: 12px; line-height: 1.55; }
.method-copy li strong { display: block; margin-bottom: 6px; color: #fff; font-size: 15px; }

.products { padding: clamp(90px, 10vw, 150px) clamp(24px, 7vw, 112px); color: #fff; background: #091c2b; overflow: hidden; }
.product-buttons { display: flex; align-items: center; gap: 16px; }
.product-buttons button { width: 48px; height: 48px; border: 1px solid #38505f; background: transparent; color: #fff; cursor: pointer; transition: .25s; }
.product-buttons button:hover { border-color: var(--cyan); color: var(--cyan); }
.product-buttons span { color: #8ba0ac; font-size: 10px; letter-spacing: .16em; }
.product-stage { max-width: 1340px; min-height: 600px; margin: 0 auto; position: relative; display: grid; grid-template-columns: 1.2fr .8fr; align-items: center; border: 1px solid rgba(255,255,255,.11); background: radial-gradient(circle at 28% 48%, color-mix(in srgb, var(--product-accent) 18%, transparent), transparent 34%), linear-gradient(135deg,#0d2638,#061725); overflow: hidden; animation: product-in .7s cubic-bezier(.16,1,.3,1); }
.product-watermark { position: absolute; left: -2%; top: 3%; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.055); font-size: clamp(100px, 17vw, 260px); font-weight: 900; letter-spacing: -.07em; }
.radio-product { width: 270px; height: 470px; position: relative; justify-self: center; filter: drop-shadow(0 42px 34px rgba(0,0,0,.45)); transform: rotate(-4deg); animation: radio-float 4s ease-in-out infinite; }
.radio-body { position: absolute; z-index: 2; width: 226px; height: 360px; left: 24px; bottom: 24px; border: 4px solid #1f2c35; border-radius: 22px 22px 35px 35px; background: linear-gradient(115deg,#30414c,#101820 45%,#263742); box-shadow: inset 5px 0 10px rgba(255,255,255,.08), inset -10px -10px 25px rgba(0,0,0,.48); }
.radio-body::before { content:""; position:absolute; inset:8px; border:1px solid rgba(255,255,255,.08); border-radius:15px 15px 28px 28px; }
.radio-antenna { position: absolute; width: 29px; height: 150px; left: 48px; top: 0; border-radius: 18px 18px 6px 6px; background: linear-gradient(90deg,#0a1015,#2d3b43 50%,#090d10); transform: rotate(-2deg); }
.radio-knob { position: absolute; z-index: 1; top: 93px; width: 38px; height: 32px; border-radius: 8px 8px 2px 2px; background: repeating-linear-gradient(90deg,#10171b 0 4px,#34454f 4px 6px); }
.radio-knob.knob-one { left: 122px; }.radio-knob.knob-two { left: 180px; width: 31px; }
.radio-screen { position: absolute; width: 140px; height: 64px; left: 39px; top: 38px; padding: 12px; display: flex; justify-content: space-between; align-items: flex-end; border: 3px solid #0a1014; border-radius: 7px; background: color-mix(in srgb, var(--product-accent) 68%, #adf6ff); color: #07131c; font-size: 13px; font-weight: 900; box-shadow: 0 0 24px color-mix(in srgb, var(--product-accent) 38%, transparent); }
.radio-screen small { font-size: 8px; }
.radio-speaker { position: absolute; width: 150px; left: 35px; top: 126px; display: grid; gap: 13px; transform: skewY(-2deg); }
.radio-speaker i { height: 9px; border-radius: 8px; background: linear-gradient(180deg,#090e11,#4b5961); box-shadow: 0 2px 2px rgba(255,255,255,.06); }
.radio-keypad { position: absolute; left: 53px; bottom: 38px; width: 114px; display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }
.radio-keypad i { height: 24px; border-radius: 5px; background: linear-gradient(#52626b,#1b272e); border: 1px solid #0a1013; }
.radio-shadow { position: absolute; width: 290px; height: 42px; left: -10px; bottom: -8px; border-radius: 50%; background: rgba(0,0,0,.45); filter: blur(14px); }
.product-copy { z-index: 2; padding: 70px clamp(28px,5vw,80px) 70px 0; }
.product-copy > span { color: var(--product-accent); font-size: 10px; font-weight: 900; letter-spacing: .3em; }
.product-copy h3 { margin: 18px 0 0; font-size: clamp(70px,8vw,132px); line-height: .82; letter-spacing: -.08em; }
.product-copy h4 { margin: 22px 0; color: #d6e1e6; font-size: 19px; font-weight: 500; }
.product-copy p { max-width: 490px; color: #94a8b4; font-size: 15px; line-height: 1.75; }
.product-tags { display: flex; flex-wrap: wrap; gap: 9px; margin: 29px 0 36px; }
.product-tags b { padding: 8px 13px; border: 1px solid rgba(255,255,255,.16); color: #b9c9d1; font-size: 9px; letter-spacing: .13em; }
.outline-button { min-height: 51px; padding: 0 22px; display: inline-flex; align-items: center; gap: 28px; border: 1px solid var(--product-accent); color: #fff; font-size: 11px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.outline-button i { color: var(--product-accent); font-style: normal; font-size: 18px; }
.product-tabs { max-width: 1340px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); }
.product-tabs button { min-height: 72px; padding: 0 18px; border: 0; border-bottom: 2px solid rgba(255,255,255,.12); background: transparent; color: #6f8490; text-align: left; font-size: 10px; font-weight: 800; letter-spacing: .08em; cursor: pointer; transition: .3s; }
.product-tabs button span { margin-right: 12px; color: #526875; font-size: 8px; }
.product-tabs button.active { border-bottom-color: var(--cyan); color: #fff; background: linear-gradient(0deg,rgba(20,184,212,.08),transparent); }

.sector-grid { max-width: 1340px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); }
.sector-grid article { min-height: 330px; padding: 30px; position: relative; border: 1px solid #ced9dd; border-right: 0; background: #eff3f4; transition: .35s; }
.sector-grid article:last-child { border-right: 1px solid #ced9dd; }
.sector-grid article:hover { z-index: 2; background: #092436; color: #fff; transform: translateY(-10px); box-shadow: 0 25px 55px rgba(5,26,40,.2); }
.sector-grid article > span { color: #079cb9; font-size: 9px; font-weight: 900; letter-spacing: .2em; }
.sector-grid h3 { margin: 110px 0 15px; font-size: 23px; line-height: 1.08; }
.sector-grid p { margin: 0; color: #73828a; font-size: 13px; line-height: 1.7; }
.sector-grid article:hover p { color: #aebec7; }
.sector-grid article > i { position: absolute; right: 25px; bottom: 24px; color: #079cb9; font-style: normal; font-size: 21px; }

.references { min-height: 560px; display: grid; grid-template-columns: .92fr 1.08fr; background: #fff; color: var(--ink); }
.reference-image { min-height: 520px; padding: clamp(46px,5vw,76px); display: grid; place-items: center; position: relative; overflow: hidden; background: #f1f3f3; }
.reference-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 60%,rgba(255,255,255,.18)); }
.reference-image img { width: min(100%,720px); height: auto; max-height: 320px; object-fit: contain; filter: grayscale(1) contrast(.88); transform: scale(.97); transition: 1s; }
.reference-image.is-visible img { transform: scale(1); }
.reference-image > span { position: absolute; z-index: 2; left: 35px; bottom: 34px; padding: 10px 14px; background: #092436; color: #fff; font-size: 8px; font-weight: 900; letter-spacing: .2em; }
.reference-copy { padding: clamp(56px,6vw,96px); display: flex; flex-direction: column; justify-content: center; }
.reference-copy h2 { max-width: 560px; margin: 20px 0 25px; font-size: clamp(40px,3.7vw,60px); line-height: .98; letter-spacing: -.06em; }
.reference-copy blockquote { max-width: 580px; margin: 0 0 25px; padding-left: 22px; border-left: 2px solid var(--cyan); color: #425865; font-size: 17px; line-height: 1.65; }
.reference-copy > p { max-width: 580px; color: #71818a; font-size: 14px; line-height: 1.75; }
.reference-meta { margin: 28px 0 34px; display: flex; gap: 60px; }
.reference-meta span { color: #61727c; font-size: 11px; }
.reference-meta b { display: block; margin-bottom: 7px; color: #8b9aa2; font-size: 8px; letter-spacing: .15em; text-transform: uppercase; }
.reference-copy > a { width: fit-content; display: flex; gap: 28px; align-items: center; color: #0a2c3f; font-size: 11px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.reference-copy > a i { color: #079cb9; font-style: normal; font-size: 20px; }

.numbers { padding: 72px clamp(24px,7vw,112px); display: grid; grid-template-columns: repeat(4,1fr); background: var(--cyan); color: #052033; }
.numbers > div { padding: 0 34px; border-right: 1px solid rgba(5,32,51,.23); }
.numbers > div:last-child { border: 0; }
.numbers strong { font-size: clamp(50px,5vw,78px); line-height: 1; letter-spacing: -.06em; }
.numbers strong span { color: #fff; }
.numbers p { margin: 10px 0 0; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }

.contact { padding: clamp(90px,10vw,150px) clamp(24px,7vw,112px); display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(60px,9vw,150px); background: #061725; }
.contact-copy > p { max-width: 540px; margin: 30px 0 45px; color: #9dafb9; font-size: 16px; line-height: 1.75; }
.contact-lines { max-width: 560px; border-top: 1px solid rgba(255,255,255,.14); }
.contact-lines > * { margin: 0; min-height: 88px; padding: 18px 4px; position: relative; display: flex; flex-direction: column; justify-content: center; border-bottom: 1px solid rgba(255,255,255,.14); }
.contact-lines small { margin-bottom: 8px; color: var(--cyan); font-size: 8px; font-weight: 900; letter-spacing: .2em; }
.contact-lines b { color: #fff; font-size: 15px; line-height: 1.55; }
.contact-lines i { position: absolute; right: 7px; color: var(--cyan); font-style: normal; font-size: 19px; }
.contact-form { padding: clamp(30px,5vw,65px); background: #fff; color: var(--ink); box-shadow: 0 35px 100px rgba(0,0,0,.27); }
.form-heading { margin-bottom: 35px; display: flex; justify-content: space-between; align-items: baseline; }
.form-heading b { font-size: 22px; letter-spacing: -.03em; }.form-heading span { color: #7d8c94; font-size: 9px; }
.contact-form label { display: grid; gap: 9px; margin-bottom: 22px; }
.contact-form label > span { color: #536771; font-size: 9px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.contact-form input, .contact-form textarea, .contact-form select { width: 100%; border: 0; border-bottom: 1px solid #bdcbd1; border-radius: 0; outline: none; background: transparent; color: var(--ink); padding: 13px 0; transition: border .25s; }
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus { border-bottom-color: var(--cyan); }
.contact-form textarea { resize: vertical; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.form-submit { width: 100%; border: 0; justify-content: center; cursor: pointer; }
.form-note { display: block; margin-top: 13px; color: #84939b; font-size: 9px; line-height: 1.45; text-align: center; }

footer { padding: 80px clamp(24px,7vw,112px) 26px; display: grid; grid-template-columns: 1.7fr .65fr .8fr 1fr; gap: 70px; background: #030d15; color: #fff; }
.footer-brand > p { max-width: 340px; margin: 26px 0; color: #788d99; font-size: 13px; line-height: 1.7; }
.footer-links, .footer-contact { display: flex; flex-direction: column; gap: 14px; }
.footer-links > b, .footer-contact > b { margin-bottom: 9px; color: #8094a0; font-size: 9px; letter-spacing: .2em; text-transform: uppercase; }
.footer-links a, .footer-contact a { color: #c2cfd5; font-size: 12px; }
.footer-contact a:first-of-type { color: var(--cyan-light); font-size: 19px; font-weight: 800; }
.footer-bottom { grid-column: 1/-1; padding-top: 25px; display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.1); color: #617683; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.whatsapp { position: fixed; z-index: 25; right: 22px; bottom: 22px; height: 48px; padding: 0 18px; display: flex; align-items: center; gap: 9px; border-radius: 28px; background: #22c76b; color: #032713; box-shadow: 0 12px 35px rgba(0,0,0,.28); font-size: 11px; }
.whatsapp span { color: #fff; animation: pulse 1.8s infinite; }

@keyframes coverage { 0%{transform:scale(.2);opacity:0} 25%{opacity:1} 100%{transform:scale(2.6);opacity:0} }
@keyframes product-in { from{opacity:0;transform:translateX(35px)} to{opacity:1;transform:none} }
@keyframes radio-float { 50%{transform:rotate(-3deg) translateY(-10px)} }

@keyframes hero-breathe { from{transform:scale(1)} to{transform:scale(1.035)} }
@keyframes content-in { from{opacity:0; transform:translateY(calc(-42% + 38px)); filter:blur(8px)} to{opacity:1; transform:translateY(-42%); filter:blur(0)} }
@keyframes stat-in { from{opacity:0; transform:translateY(28px)} to{opacity:1; transform:none} }
@keyframes ring { 0%{transform:scale(.35);opacity:0} 20%{opacity:1} 100%{transform:scale(2.4);opacity:0} }
@keyframes pulse { 50%{opacity:.35} }
@keyframes progress { from{width:0} to{width:100%} }
@keyframes scroll { 50%{transform:translateY(7px)} }

@media (max-width: 900px) {
  .site-header { height:76px; grid-template-columns:1fr auto; padding:0 22px; }
  .header-contact { display:none; }
  .menu-toggle { display:grid; width:44px; height:44px; place-content:center; gap:7px; padding:0; border:1px solid rgba(255,255,255,.25); background:rgba(4,20,34,.6); }
  .menu-toggle span { display:block; width:18px; height:1px; background:#fff; }
  .main-nav { position:absolute; left:18px; right:18px; top:82px; display:flex; flex-direction:column; align-items:flex-start; gap:0; padding:12px; background:rgba(5,21,35,.97); border:1px solid rgba(255,255,255,.13); opacity:0; visibility:hidden; transform:translateY(-10px); transition:.25s; }
  .main-nav.is-open { opacity:1; visibility:visible; transform:none; }
  .main-nav a { width:100%; padding:16px 12px; }
  .hero { min-height:760px; }
  .hero-image { background-image:linear-gradient(180deg,rgba(3,14,26,.45),rgba(3,14,26,.58) 28%,rgba(3,14,26,.97) 72%),url('/media/hero-radio-tian.png'); background-position:68% 50%; }
  .hero-content { top:auto; left:22px; right:22px; bottom:145px; width:auto; transform:none; }
  .eyebrow { font-size:9px; margin-bottom:18px; }
  .hero h1 { font-size:clamp(47px,14vw,70px); }
  .hero-content > p { margin:22px 0 26px; font-size:15px; line-height:1.55; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:18px; }
  .primary-button { min-height:52px; }
  .hero-stat, .scroll-cue { display:none; }
  .slider-controls { left:22px; bottom:32px; }
  .signal-rings { right:-55%; top:7%; }
  @keyframes content-in { from{opacity:0; transform:translateY(28px); filter:blur(8px)} to{opacity:1; transform:none; filter:blur(0)} }
}

@media (max-width: 900px) {
  .brands-strip { padding: 30px 22px; grid-template-columns: 1fr; gap: 24px; }
  .brands-strip > p { text-align: center; }
  .brand-logos { grid-template-columns: repeat(5, 1fr); gap: 15px; }
  .brand-logos img { height: 24px; }
  .brand-proof { display: none; }
  .section-light, .products, .contact { padding: 85px 22px; }
  .section-heading { margin-bottom: 48px; grid-template-columns: 1fr; gap: 28px; }
  .section-heading h2, .method-copy h2, .contact-copy h2 { font-size: clamp(44px, 13vw, 66px); }
  .section-heading > p { font-size: 15px; }
  .service-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 360px; }
  .service-card h3 { margin-top: 48px; }
  .method-section { grid-template-columns: 1fr; }
  .method-visual { min-height: 490px; }
  .method-copy { padding: 85px 22px; }
  .method-copy > p { font-size: 15px; }
  .coverage-map { width: 86%; }
  .product-buttons { justify-self: start; }
  .product-stage { min-height: 760px; grid-template-columns: 1fr; align-content: center; }
  .product-watermark { top: 1%; font-size: 30vw; }
  .radio-product { width: 230px; height: 390px; margin-top: 40px; transform: scale(.82) rotate(-4deg); transform-origin: bottom center; }
  .product-copy { padding: 20px 28px 58px; }
  .product-copy h3 { font-size: 76px; }
  .product-tabs { grid-template-columns: 1fr 1fr; }
  .product-tabs button { min-height: 62px; }
  .sector-grid { grid-template-columns: 1fr; }
  .sector-grid article { min-height: 250px; border-right: 1px solid #ced9dd; }
  .sector-grid h3 { margin-top: 70px; }
  .references { grid-template-columns: 1fr; }
  .reference-image { min-height: 240px; padding: 42px 24px; }
  .reference-image img { max-height: 150px; }
  .reference-image > span { left: 22px; bottom: 20px; }
  .reference-copy { padding: 58px 22px; }
  .reference-meta { gap: 28px; }
  .numbers { padding: 0; grid-template-columns: 1fr 1fr; }
  .numbers > div { padding: 38px 22px; border-right: 1px solid rgba(5,32,51,.23); border-bottom: 1px solid rgba(5,32,51,.23); }
  .numbers strong { font-size: 52px; }
  .contact { grid-template-columns: 1fr; gap: 58px; }
  .contact-form { padding: 32px 22px; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .form-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  footer { padding: 70px 22px 25px; grid-template-columns: 1fr 1fr; gap: 48px 30px; }
  .footer-brand, .footer-bottom { grid-column: 1/-1; }
  .footer-bottom { gap: 25px; flex-direction: column; }
  .whatsapp { right: 14px; bottom: 14px; }
}

@media (max-width: 520px) {
  .hero-actions .primary-button { width: 100%; justify-content: space-between; }
  .hero-actions .text-link { font-size: 12px; }
  .slider-dots button { width: 24px; }
  .brand-copy b { font-size: 18px; }
  .brand-copy small { font-size: 7px; }
  .product-stage { min-height: 720px; }
  .radio-product { margin-top: 20px; transform: scale(.7) rotate(-4deg); }
  .product-copy { margin-top: -40px; }
  .product-tabs { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}