/*
Theme Name: ДПС Радар
Theme URI: https://driversdetect.com/
Author: Manus AI
Description: Адаптивный лендинг дорожных сообщений сообщества водителей.
Version: 1.0.0
Requires at least: 5.3
Requires PHP: 7.4
Text Domain: dps-radar
License: GPL-2.0-or-later
*/
:root{color-scheme:dark;--ink:#07131f;--ink-soft:#0c1d2b;--paper:#eef3f2;--paper-deep:#e6ecea;--white:#f6f8f7;--muted:#9caeb8;--muted-dark:#61737b;--cyan:#58e0e5;--cyan-deep:#22bec8;--amber:#e9bd76;--line:rgba(232,244,245,.14);--dark-line:rgba(8,27,39,.15);--font-body:'Inter',Arial,sans-serif;--font-display:'Manrope','Inter',Arial,sans-serif;--wrap:1180px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{margin:0;background:var(--ink);color:var(--white);font-family:var(--font-body);font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{max-width:100%}
::selection{background:var(--cyan);color:var(--ink)}
:focus-visible{outline:3px solid var(--amber);outline-offset:4px}
.wrap{width:min(var(--wrap),calc(100% - 64px));margin-inline:auto}
.skip-link{position:absolute;z-index:100;top:-60px;left:18px;padding:10px 14px;background:var(--cyan);color:var(--ink);font-weight:700}
.skip-link:focus{top:12px}
.site-header{position:relative;z-index:10;background:var(--ink);border-bottom:1px solid rgba(228,243,245,.09)}
.header-inner{min-height:80px;width:min(1320px,calc(100% - 64px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:36px}
.brand{display:inline-flex;align-items:center;gap:10px;flex:none}
.brand-mark{display:block;width:38px;height:38px}
.brand-name{display:flex;flex-direction:column;font-family:var(--font-display);font-size:10px;line-height:1.16;letter-spacing:.14em}
.brand-name span{color:#afc3ca;font-weight:600}
.brand-name strong{color:var(--white);font-size:13px;letter-spacing:.22em}
.site-nav{display:flex;align-items:center;gap:34px;color:#c0cdd1;font-size:12px;font-weight:500}
.site-nav>a:not(.nav-cta){transition:color .2s ease}
.site-nav>a:not(.nav-cta):hover{color:var(--cyan)}
.nav-cta{display:inline-flex;align-items:center;gap:15px;border:1px solid rgba(88,224,229,.5);padding:10px 15px;color:var(--cyan);font-size:11px;letter-spacing:.04em;transition:background .2s ease,color .2s ease}
.nav-cta:hover{background:var(--cyan);color:var(--ink)}
.nav-cta span{font-size:15px}
.menu-toggle{display:none}
.hero{position:relative;overflow:hidden;background:var(--ink);isolation:isolate}
.hero:after{position:absolute;z-index:-1;content:"";width:480px;height:480px;left:-280px;top:160px;border:1px solid rgba(88,224,229,.09);border-radius:50%;box-shadow:0 0 0 60px rgba(88,224,229,.018),0 0 0 120px rgba(88,224,229,.014)}
.hero-backdrop{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse 44% 80% at 75% 44%,rgba(20,89,104,.23),transparent 75%),linear-gradient(115deg,#07131f 12%,#091823 56%,#0a1c29 100%)}
.hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,.91fr) minmax(0,1.09fr);align-items:center;gap:36px;min-height:620px;padding-top:74px;padding-bottom:62px}
.hero-copy{position:relative;z-index:2;max-width:555px;padding:7px 0 20px}
.eyebrow{margin:0 0 23px;color:var(--cyan);font-size:9px;font-weight:700;letter-spacing:.18em;line-height:1.5}
.status-dot{display:inline-block;width:7px;height:7px;margin:0 9px 1px 0;border-radius:50%;background:var(--cyan);box-shadow:0 0 13px rgba(88,224,229,.7)}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:var(--font-display)}
h1{max-width:620px;margin-bottom:23px;font-size:clamp(42px,5vw,66px);font-weight:600;letter-spacing:-.065em;line-height:1.08}
h1 span,h2 em{color:var(--cyan);font-style:normal;font-weight:400}
.hero-lead{max-width:500px;margin-bottom:12px;color:#d5e0e3;font-size:15px;line-height:1.8}
.hero-subcopy{max-width:455px;margin-bottom:30px;color:#93a6b0;font-size:12px;line-height:1.75}
.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap}
.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:0 19px;font-size:11px;font-weight:700;letter-spacing:.02em;transition:transform .18s ease,background .18s ease,color .18s ease}
.button:hover{transform:translateY(-2px)}
.button-primary{background:var(--cyan);color:#07131f}
.button-primary:hover{background:#8cf1f1}
.button-primary span{font-size:15px}
.text-link{display:inline-flex;align-items:center;gap:12px;color:#d3e1e3;font-size:11px;font-weight:600}
.text-link span{color:var(--cyan);font-size:14px;transition:transform .18s ease}
.text-link:hover span{transform:translate(2px,-2px)}
.hero-proof{display:flex;align-items:flex-start;gap:11px;max-width:425px;margin-top:42px;color:#748894;font-size:9px;line-height:1.65;letter-spacing:.01em}
.proof-line{width:24px;height:1px;flex:none;margin-top:7px;background:var(--amber)}
.hero-visual{position:relative;min-height:430px;isolation:isolate}
.visual-image{position:absolute;inset:0 0 26px 0;z-index:-3;background-image:linear-gradient(90deg,rgba(7,19,31,.08),rgba(7,19,31,.03) 60%,rgba(7,19,31,.26)),linear-gradient(0deg,rgba(7,19,31,.6),transparent 45%),url('assets/images/road-hero.svg');background-size:cover;background-position:center;border:1px solid rgba(140,228,231,.13);mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 100%)}
.visual-grid{position:absolute;z-index:-2;inset:0 0 26px 0;background-image:linear-gradient(rgba(137,224,229,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(137,224,229,.045) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(90deg,transparent 10%,#000 70%);pointer-events:none}
.radar-rings{position:absolute;right:9%;top:5%;width:178px;height:178px;border:1px solid rgba(88,224,229,.23);border-radius:50%;opacity:.8}
.radar-rings:before,.radar-rings:after,.radar-rings i{position:absolute;inset:19px;border:1px solid rgba(88,224,229,.19);border-radius:50%;content:""}
.radar-rings:after{inset:39px}.radar-rings i:nth-child(1){inset:59px}.radar-rings i:nth-child(2),.radar-rings i:nth-child(3){display:none}
.radar-rings b{position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 18px 5px rgba(88,224,229,.5);transform:translate(-50%,-50%)}
.signal-label{position:absolute;display:flex;align-items:center;gap:9px;padding:9px 12px;background:rgba(7,19,31,.76);border:1px solid rgba(88,224,229,.22);color:#d6eeee;font-size:8px;letter-spacing:.07em;backdrop-filter:blur(12px)}
.signal-label-top{right:2%;top:36%}
.signal-point{width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 9px var(--cyan)}
.signal-card{position:absolute;right:1%;bottom:0;width:min(362px,86%);padding:17px 19px 11px;background:rgba(8,24,35,.93);border:1px solid rgba(188,234,233,.24);box-shadow:0 24px 60px rgba(0,0,0,.3);backdrop-filter:blur(18px)}
.signal-card-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:11px;color:#859aa5;font-size:8px;font-weight:600;letter-spacing:.14em;border-bottom:1px solid rgba(225,242,242,.1)}
.signal-live{display:flex;align-items:center;gap:6px;color:#b8d5d9;font-size:7px;letter-spacing:.12em}
.signal-live i{width:5px;height:5px;border-radius:50%;background:var(--amber)}
.signal-row{display:flex;align-items:center;gap:11px;padding:12px 0;border-bottom:1px solid rgba(225,242,242,.08)}
.signal-icon{width:28px;height:28px;display:grid;place-items:center;flex:none;border:1px solid rgba(88,224,229,.25);color:var(--cyan);font-size:16px}
.signal-row b,.signal-row small{display:block}
.signal-row b{color:#e6eeee;font-size:9px;font-weight:600;line-height:1.4}
.signal-row small{margin-top:3px;color:#82959f;font-size:8px;line-height:1.3}
.row-arrow{margin-left:auto;color:#85b9c1;font-size:12px}
.signal-caption{margin:9px 0 0;color:#738793;font-size:7px;text-align:right;letter-spacing:.04em}
.visual-coordinate{position:absolute;left:8px;bottom:4px;color:#90a8b1;font-family:var(--font-display);font-size:8px;letter-spacing:.1em}
.visual-coordinate span{display:block;margin-top:5px;color:#607983;font-family:var(--font-body);font-size:7px;letter-spacing:.16em}
.hero-bottom{display:flex;align-items:center;gap:12px;padding-bottom:20px;color:#617580;font-size:8px;font-weight:600;letter-spacing:.14em}
.hero-bottom-line{width:60px;height:1px;background:#2f5762}
.section-pad{padding:106px 0}
.intro{background:var(--paper);color:var(--ink)}
.intro-grid{display:grid;grid-template-columns:210px 1fr;gap:50px}
.section-marker{display:flex;align-items:center;gap:10px;color:#6f858b;font-size:8px;font-weight:700;letter-spacing:.13em}
.section-marker>span:first-child{color:var(--cyan-deep);font-family:var(--font-display);font-size:11px}
.marker-rule{width:28px;height:1px;background:#9eb2b3}
.intro-main{max-width:840px}
.intro h2,.section-heading h2,.steps-heading h2,.safety-content h2,.closing-copy h2{margin:0;font-size:clamp(34px,4.4vw,56px);font-weight:600;letter-spacing:-.06em;line-height:1.12}
.intro h2 em,.section-heading h2 em,.safety-content h2 em{color:#189ca6}
.intro-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:42px;margin-top:34px}
.intro-bottom>p{max-width:482px;margin:0;color:#52656c;font-size:14px;line-height:1.9}
.intro-note{display:flex;align-items:center;gap:12px;min-width:245px;padding:15px 0 5px;border-top:1px solid var(--dark-line);color:#708088;font-size:9px;line-height:1.7}
.intro-note strong{color:#12313c;font-size:10px;font-weight:600}
.note-symbol{color:#1399a1;font-size:20px}
.message-types{background:var(--paper-deep);color:var(--ink)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:40px}
.eyebrow-dark{margin-bottom:17px;color:#278f97}
.section-aside{margin:0 0 5px;color:#74858a;font-size:10px;line-height:1.8;text-align:right}
.signal-list{border-top:1px solid var(--dark-line)}
.signal-type{display:grid;grid-template-columns:60px 48px 1fr 30px;align-items:center;gap:18px;min-height:115px;border-bottom:1px solid var(--dark-line);transition:padding .2s ease,background .2s ease}
.signal-type:hover{padding-inline:10px;background:rgba(255,255,255,.35)}
.type-number{color:#83a0a5;font-size:9px;letter-spacing:.1em}
.type-symbol{width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(20,157,165,.35);color:#168f98;font-size:20px}
.signal-type h3{margin:0 0 5px;font-size:17px;font-weight:600;letter-spacing:-.03em}
.signal-type p{margin:0;color:#718188;font-size:11px}
.type-end{justify-self:end;color:#2d9299;font-size:17px}
.steps-section{background:#0b1b28;color:var(--white)}
.steps-wrap{display:grid;grid-template-columns:.83fr 1.17fr;gap:100px;align-items:start}
.section-marker-light{margin-bottom:35px;color:#82969e}
.section-marker-light .marker-rule{background:#3e5a62}
.steps-heading h2 em,.closing-copy h2 em{color:var(--cyan);font-style:normal;font-weight:400}
.steps-heading>p{max-width:350px;margin:24px 0 0;color:#91a4ad;font-size:12px;line-height:1.8}
.steps-list{border-top:1px solid var(--line)}
.step-item{display:grid;grid-template-columns:42px 1fr 30px;gap:17px;align-items:start;padding:22px 0 25px;border-bottom:1px solid var(--line)}
.step-number{padding-top:2px;color:var(--cyan);font-family:var(--font-display);font-size:10px;letter-spacing:.1em}
.step-line{display:none}
.step-item h3{margin:0 0 7px;color:#eaf0ef;font-size:15px;font-weight:600;letter-spacing:-.02em}
.step-item p{max-width:390px;margin:0;color:#91a4ad;font-size:11px;line-height:1.8}
.step-symbol{justify-self:end;color:#71cfd1;font-size:16px}
.safety-section{background:#f0f3ef;color:var(--ink)}
.safety-grid{display:grid;grid-template-columns:210px 1fr;gap:50px}
.safety-content{display:grid;grid-template-columns:54px 1fr;gap:23px;max-width:800px}
.safety-icon{width:43px;height:43px;display:grid;place-items:center;border:1px solid rgba(198,152,74,.63);border-radius:50%;color:#ae7d32;font-family:var(--font-display);font-size:20px;font-weight:600}
.safety-content .eyebrow{margin:1px 0 18px}
.safety-content h2{font-size:clamp(32px,4vw,48px)}
.safety-copy{max-width:700px;margin:23px 0 0;color:#5c6c70;font-size:12px;line-height:1.95}
.closing{position:relative;overflow:hidden;background:#07131f}
.closing-inner{position:relative;display:grid;grid-template-columns:.75fr 1.25fr;align-items:center;min-height:320px}
.closing-graphic{position:relative;width:280px;height:280px;margin-left:30px}
.closing-orbit{position:absolute;inset:22px;border:1px solid rgba(88,224,229,.13);border-radius:50%}
.orbit-b{inset:55px;border-color:rgba(88,224,229,.22)}
.orbit-c{inset:88px;border-color:rgba(88,224,229,.28)}
.closing-core{position:absolute;left:50%;top:50%;width:12px;height:12px;border-radius:50%;background:var(--cyan);box-shadow:0 0 30px 10px rgba(88,224,229,.25);transform:translate(-50%,-50%)}
.closing-route{position:absolute;left:16%;top:67%;width:75%;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);transform:rotate(-28deg)}
.closing-copy{max-width:610px;padding:30px 0}
.closing-copy .eyebrow{margin-bottom:18px}
.closing-copy h2{font-size:clamp(36px,4.5vw,55px)}
.closing-copy>p:not(.eyebrow){max-width:450px;margin:18px 0 22px;color:#94a8b1;font-size:12px;line-height:1.8}
.site-footer{border-top:1px solid var(--line);background:#06111a}
.footer-main{min-height:90px;display:flex;align-items:center;justify-content:space-between;gap:22px;border-bottom:1px solid rgba(228,243,245,.08)}
.brand-footer .brand-mark{width:34px;height:34px}
.footer-main>p{max-width:380px;margin:0;color:#82959e;font-size:9px;text-align:center}
.footer-top{color:#a8bcc2;font-size:8px;font-weight:600;letter-spacing:.13em}
.footer-top span{margin-left:9px;color:var(--cyan);font-size:12px}
.footer-bottom{min-height:49px;display:flex;align-items:center;justify-content:space-between;gap:15px;color:#61747e;font-size:8px;letter-spacing:.04em}
@media(max-width:980px){.hero-inner{grid-template-columns:1fr 1fr;gap:18px;min-height:600px}.hero-copy{padding-right:0}.hero-visual{min-height:400px}.signal-card{width:min(350px,94%)}.intro-grid,.safety-grid{grid-template-columns:150px 1fr;gap:28px}.steps-wrap{gap:58px}.section-pad{padding:86px 0}}
@media(max-width:720px){html{scroll-padding-top:75px}.wrap{width:min(100% - 40px,var(--wrap))}.header-inner{width:calc(100% - 40px);min-height:70px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;width:42px;height:42px;padding:10px;border:1px solid rgba(88,224,229,.32);background:transparent;color:var(--white);cursor:pointer}.menu-toggle span{height:1px;width:100%;background:var(--cyan);transition:transform .2s ease}.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.site-nav{position:absolute;top:69px;left:0;right:0;display:none;align-items:stretch;gap:0;padding:8px 20px 20px;background:#091923;border-bottom:1px solid rgba(88,224,229,.23)}.site-nav.is-open{display:flex;flex-direction:column}.site-nav>a:not(.nav-cta){padding:13px 3px;border-bottom:1px solid rgba(228,243,245,.08)}.nav-cta{justify-content:space-between;margin-top:14px}.hero-inner{display:flex;flex-direction:column;align-items:stretch;gap:32px;min-height:0;padding-top:63px;padding-bottom:26px}.hero-copy{max-width:560px;padding:0}.eyebrow{margin-bottom:18px;font-size:8px}.hero h1{font-size:clamp(42px,10vw,63px)}.hero-lead{font-size:13px}.hero-subcopy{font-size:11px}.hero-proof{margin-top:28px}.hero-visual{width:100%;min-height:390px}.visual-image{inset:0 0 23px}.visual-grid{inset:0 0 23px}.signal-card{right:0;bottom:0;width:min(365px,93%)}.signal-label-top{right:3%;top:24%}.radar-rings{right:4%;top:2%;width:140px;height:140px}.hero-bottom{font-size:7px;padding-bottom:17px}.section-pad{padding:72px 0}.intro-grid,.safety-grid{display:block}.section-marker{margin-bottom:35px}.intro h2,.section-heading h2,.steps-heading h2,.safety-content h2,.closing-copy h2{font-size:clamp(33px,8vw,48px)}.intro-bottom{align-items:flex-start;flex-direction:column;gap:24px;margin-top:25px}.intro-bottom>p{font-size:12px}.intro-note{width:100%;max-width:320px}.section-heading{align-items:flex-start;flex-direction:column;margin-bottom:28px}.section-aside{text-align:left}.signal-type{grid-template-columns:32px 38px 1fr 18px;gap:10px;min-height:103px}.signal-type h3{font-size:14px}.signal-type p{font-size:9px;line-height:1.55}.type-symbol{width:34px;height:34px;font-size:17px}.steps-wrap{display:block}.steps-heading{margin-bottom:38px}.steps-heading>p{font-size:11px}.step-item{grid-template-columns:32px 1fr 20px;gap:12px;padding:19px 0}.step-item p{font-size:10px}.safety-content{grid-template-columns:40px 1fr;gap:14px}.safety-icon{width:34px;height:34px;font-size:17px}.safety-content .eyebrow{font-size:7px}.safety-copy{font-size:11px}.closing-inner{display:flex;flex-direction:column;align-items:stretch;min-height:0}.closing-graphic{position:absolute;right:-92px;top:4px;width:230px;height:230px;opacity:.65}.closing-copy{position:relative;padding:0}.closing-copy .eyebrow{max-width:270px;font-size:7px}.closing-copy h2{font-size:clamp(36px,8vw,48px)}.closing-copy>p:not(.eyebrow){max-width:370px;font-size:11px}.footer-main{min-height:0;align-items:flex-start;flex-wrap:wrap;padding:19px 0}.footer-main>p{order:3;flex-basis:100%;text-align:left}.footer-top{margin-left:auto}.footer-bottom{align-items:flex-start;flex-direction:column;gap:6px;padding:14px 0;font-size:7px}}
@media(max-width:390px){.wrap{width:calc(100% - 32px)}.header-inner{width:calc(100% - 32px)}.hero h1{font-size:39px}.hero-visual{min-height:358px}.signal-card{padding:14px 13px 9px}.signal-label{font-size:7px}.hero-actions{gap:15px}.button{padding-inline:14px}.text-link{font-size:10px}.type-number{font-size:8px}.signal-type{grid-template-columns:25px 33px 1fr 14px;gap:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* WordPress theme integration */
.brand .custom-logo-link,.brand-mark-link{display:inline-flex;align-items:center;justify-content:center;flex:none}
.brand .custom-logo{display:block;width:38px;height:38px;object-fit:contain}
.site-nav{gap:0}
.site-nav-menu{display:flex;align-items:center;gap:34px;list-style:none;margin:0;padding:0}
.site-nav-menu li{margin:0;padding:0}
.site-nav-menu a{color:#c0cdd1;font-size:12px;font-weight:500;transition:color .2s ease}
.site-nav-menu a:hover,.site-nav-menu .current-menu-item>a{color:var(--cyan)}
.site-nav-menu>li:last-child>a{display:inline-flex;align-items:center;gap:15px;border:1px solid rgba(88,224,229,.5);padding:10px 15px;color:var(--cyan);font-size:11px;letter-spacing:.04em}
.site-nav-menu>li:last-child>a:hover{background:var(--cyan);color:var(--ink)}
.site-nav-menu>li:last-child>a:after{content:"↗";font-size:15px}
.secondary-content{min-height:50vh;color:var(--ink)}
.secondary-content article{padding:28px 0;border-bottom:1px solid var(--dark-line)}
.secondary-content h1,.secondary-content h2{color:var(--ink)}
.secondary-content .entry-content{color:#52656c}
@media(max-width:720px){.site-nav{gap:0}.site-nav-menu{width:100%;display:flex;flex-direction:column;align-items:stretch;gap:0}.site-nav-menu>li>a{display:block;padding:13px 3px;border-bottom:1px solid rgba(228,243,245,.08)}.site-nav-menu>li:last-child>a{display:flex;justify-content:space-between;margin-top:14px;padding:10px 15px;border:1px solid rgba(88,224,229,.5)}}
