/* Local prototype: visual layer for /services/videonablyudenie.html only. */
:root { --psv-ink:#0d0f12; --psv-panel:#171a1e; --psv-panel-2:#20242a; --psv-paper:#f2f0eb; --psv-muted:#c8c7c1; --psv-gold:#d5a84a; --psv-gold-light:#f1ce7a; --psv-line:rgba(242,240,235,.16); --psv-container:1240px; --psv-radius:18px; }
body:has(.psv-page) { background:var(--psv-ink); color:var(--psv-paper); }
.psv-page { overflow:hidden; background:var(--psv-ink); color:var(--psv-paper); }
.psv-page .site-header { min-height:70px; padding:9px clamp(18px,4vw,52px); gap:18px; background:rgba(13,15,18,.97); border-bottom-color:var(--psv-line); }
.psv-page .brand { display:block; width:194px; overflow:hidden; }
.psv-page .brand img { width:194px; filter:invert(1) hue-rotate(180deg) contrast(1.08); mix-blend-mode:screen; }
.psv-page .nav { gap:18px; color:var(--psv-paper); font-size:13px; font-weight:700; }
.psv-page .header-phone { color:var(--psv-gold-light); font-size:14px; }
.psv-page .nav a:hover,.psv-page .header-phone:hover { color:var(--psv-gold); }
.psv-page .menu-toggle { border-color:var(--psv-line); background:var(--psv-panel); }
.psv-page .menu-toggle span { background:var(--psv-paper); }
.psv-page .service-page { max-width:none; margin:0; padding:0; }
.psv-shell { width:min(var(--psv-container),calc(100% - 48px)); margin:0 auto; padding:22px 0 clamp(72px,9vw,128px); }
.psv-breadcrumbs { display:flex; gap:8px; margin:0 0 clamp(32px,6vw,66px); color:var(--psv-muted); font-size:13px; }
.psv-breadcrumbs a { color:var(--psv-gold-light); }
.psv-breadcrumbs span:last-child { color:#e6e3da; }
.psv-layout { display:grid; grid-template-columns:minmax(0,1fr) 292px; gap:clamp(28px,5vw,72px); align-items:start; }
.psv-article { min-width:0; }
.psv-article > .eyebrow { margin:0 0 12px; color:var(--psv-gold-light); font-size:12px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.psv-article h1 { max-width:920px; margin:0 0 22px; color:var(--psv-paper); font-size:clamp(40px,5.6vw,74px); line-height:.98; letter-spacing:-.052em; }
.psv-article > p:first-of-type { max-width:760px; margin:0 0 30px; color:#deded8; font-size:clamp(17px,2vw,21px); line-height:1.52; }
.psv-article h2 { max-width:850px; margin:clamp(56px,8vw,90px) 0 17px; color:var(--psv-paper); font-size:clamp(29px,3.6vw,50px); line-height:1.05; letter-spacing:-.037em; }
.psv-article h3 { color:var(--psv-paper); }
.psv-article p { max-width:850px; color:var(--psv-muted); font-size:17px; line-height:1.62; }
.psv-article a { color:var(--psv-gold-light); text-decoration-color:rgba(241,206,122,.5); text-underline-offset:3px; }
.psv-article a:hover { color:#fff0ba; }
.psv-article .article-hero-image { position:relative; margin:0 0 8px; overflow:hidden; border:1px solid var(--psv-line); border-radius:var(--psv-radius); background:var(--psv-panel); box-shadow:0 24px 54px rgba(0,0,0,.26); }
.psv-article .article-hero-image::after { position:absolute; inset:0; content:''; background:linear-gradient(0deg,rgba(8,9,10,.53),transparent 52%); pointer-events:none; }
.psv-article .article-hero-image img { display:block; width:100%; min-height:300px; max-height:590px; object-fit:cover; filter:grayscale(.36) contrast(1.06) brightness(.78); }
.psv-article .article-hero-image figcaption { position:absolute; z-index:1; right:0; bottom:0; left:0; max-width:760px; padding:32px; color:#f0eee7; font-size:15px; line-height:1.45; }
.psv-article .service-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 16px; max-width:940px; margin:26px 0 0; padding:0; list-style:none; }
.psv-article .service-list li { position:relative; min-height:76px; padding:19px 20px 18px 38px; border:1px solid var(--psv-line); border-radius:12px; background:var(--psv-panel); color:#dfddd5; font-size:15px; line-height:1.48; }
.psv-article .service-list li::before { position:absolute; top:27px; left:20px; width:7px; height:7px; border:1px solid var(--psv-gold-light); content:''; transform:rotate(45deg); }
.psv-article .blog-cta { max-width:940px; margin:clamp(48px,7vw,76px) 0; padding:clamp(25px,4vw,44px); border:1px solid rgba(213,168,74,.58); border-radius:var(--psv-radius); background:linear-gradient(118deg,#28231a,#1b1d20 66%); box-shadow:0 20px 45px rgba(0,0,0,.18); }
.psv-article .blog-cta h2 { margin:0 0 13px; font-size:clamp(28px,3vw,43px); }
.psv-article .blog-cta p { margin-bottom:23px; }
.psv-article .hero-actions { display:flex; flex-wrap:wrap; gap:10px; }
.psv-page .button { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:12px 21px; border-radius:999px; font-weight:700; text-decoration:none; transition:transform .2s ease,background .2s ease; }
.psv-page .button:hover { transform:translateY(-2px); }
.psv-page .button-primary { border-color:var(--psv-gold); background:var(--psv-gold); color:#17130b; }
.psv-page .button-secondary { border-color:rgba(242,240,235,.36); background:transparent; color:var(--psv-paper); }
.psv-page .button-secondary:hover { border-color:var(--psv-gold); color:var(--psv-gold-light); }
.psv-article .faq-block { max-width:940px; margin-top:clamp(58px,8vw,92px); padding-top:1px; border-top:1px solid var(--psv-line); }
.psv-article .faq-block h2 { margin-top:42px; }
.psv-article .faq-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.psv-article .faq-item { padding:24px; border:1px solid var(--psv-line); border-radius:14px; background:var(--psv-panel); }
.psv-article .faq-item h3 { margin:0 0 10px; font-size:18px; line-height:1.18; }
.psv-article .faq-item p { margin:0; font-size:14px; line-height:1.5; }
.psv-aside { position:sticky; top:96px; padding:26px; border:1px solid var(--psv-line); border-top:2px solid var(--psv-gold); border-radius:var(--psv-radius); background:var(--psv-panel); box-shadow:0 18px 42px rgba(0,0,0,.19); }
.psv-aside strong { display:block; margin-bottom:10px; color:var(--psv-gold-light); font-size:20px; line-height:1.15; }
.psv-aside p { margin:0 0 22px; color:var(--psv-muted); font-size:14px; line-height:1.55; }
.psv-aside a:not(.button) { color:var(--psv-gold-light); }
.psv-aside .button { width:100%; }
.psv-page + .site-footer { background:#0b0d10; color:#d5d4ce; }
.psv-page + .site-footer .footer-main { background:#0b0d10; }
.psv-page + .site-footer .footer-bottom { background:#07080a; border-top-color:var(--psv-line); }
.psv-page + .site-footer a:hover { color:var(--psv-gold-light); }
@media (max-width:980px) { .psv-layout { grid-template-columns:1fr; } .psv-aside { position:static; max-width:760px; } }
@media (max-width:720px) { .psv-page .site-header { min-height:60px; gap:8px; padding-right:16px; padding-left:16px; } .psv-page .brand { order:1; width:126px; } .psv-page .brand img { width:126px; } .psv-page .header-phone { order:2; width:auto; margin-left:auto; font-size:12px; letter-spacing:-.025em; } .psv-page .menu-toggle { order:3; margin-left:0; } .psv-page .site-header .nav { background:#15181c; border-color:var(--psv-line); } .psv-shell { width:min(100% - 32px,var(--psv-container)); padding-top:18px; } .psv-breadcrumbs { margin-bottom:34px; font-size:12px; } .psv-article h1 { margin-bottom:16px; font-size:clamp(36px,11.1vw,48px); } .psv-article > p:first-of-type { margin-bottom:22px; font-size:16px; line-height:1.5; } .psv-article h2 { margin-top:54px; font-size:clamp(28px,8.9vw,38px); } .psv-article p { font-size:16px; line-height:1.58; } .psv-article .article-hero-image img { min-height:270px; } .psv-article .article-hero-image figcaption { padding:20px; font-size:13px; } .psv-article .service-list,.psv-article .faq-list { grid-template-columns:1fr; } .psv-article .service-list li { min-height:0; padding:16px 16px 16px 34px; } .psv-article .service-list li::before { top:24px; left:17px; } .psv-article .blog-cta { margin:48px 0; padding:24px 20px; } .psv-article .hero-actions { display:grid; grid-template-columns:1fr; } .psv-article .hero-actions .button { width:100%; } .psv-article .faq-item { padding:20px; } .psv-aside { margin-top:4px; padding:23px 20px; } .site-footer .footer-grid { gap:28px; } .site-footer .footer-column { gap:11px; } .site-footer .footer-bottom-row { align-items:flex-start; gap:14px; } .site-footer .legal-links { gap:9px 14px; } .site-footer .footer-contacts .button { width:100%; justify-content:center; } }
