@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600&display=swap'); :root{--primary:#101820;--accent:#C8443B;--bg:#FAFAF8; --surface:#FFFFFF;--surface2:#F1F1EE;--text:#15181B;--muted:#414852; --border:#E2E3E0;--radius:4px;--font-head:'Fraunces',serif;--font-body:'Inter',sans-serif;} *{box-sizing:border-box}body{margin:0;font-family:var(--font-body);background:var(--bg); color:var(--text);line-height:1.6}a{color:var(--accent);text-decoration:none} img{max-width:100%;height:auto} /* плавный скролл по якорям (nav «Top Picks» → #top-picks и т.п.); отключаем при prefers-reduced-motion. scroll-padding-top — чтобы якорь не уезжал под шапку. */ @media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}} html{scroll-padding-top:24px} .wrap{max-width:1100px;margin:0 auto;padding:0 20px} header.site{background:var(--primary);color:#fff;padding:16px 0} header.site .wrap{display:flex;align-items:center;justify-content:space-between} header .brand{font-family:var(--font-head);font-size:1.4rem;font-weight:700;color:#fff} .hero{padding:56px 0;text-align:center}.hero h1{font-family:var(--font-head);font-size:2.4rem;margin:.2em 0} .hero p{color:var(--muted);font-size:1.15rem;max-width:640px;margin:0 auto} .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;padding:24px 0} .card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius); overflow:hidden;display:flex;flex-direction:column;transition:.15s} .card:hover{box-shadow:0 8px 30px rgba(0,0,0,.09);transform:translateY(-2px)} .card img{width:100%;height:180px;object-fit:cover;background:#f5f5f4} .card .body{padding:14px;display:flex;flex-direction:column;gap:6px;flex:1} .card h3{margin:0;font-size:1.02rem}.card .cat{color:var(--muted);font-size:.82rem} .rating{color:var(--accent);font-weight:600} .btn{display:inline-block;background:var(--accent);color:#fff;padding:10px 16px; border-radius:8px;font-weight:600;margin-top:auto} .product{padding:32px 0;max-width:900px;margin:0 auto} .gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:16px 0} .gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;background:#f5f5f4;border-radius:var(--radius)} .product h1{font-family:var(--font-head)} .cols{display:grid;grid-template-columns:1fr 1fr;gap:20px} .chip{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:10px 12px} ul.clean{list-style:none;padding:0}ul.clean li{padding:4px 0;border-bottom:1px solid var(--border)} .review{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin:10px 0} footer.site{background:var(--primary);color:#cbd5e1;padding:32px 0;margin-top:48px;font-size:.9rem} footer.site a{color:#fff} .pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:40px;flex-wrap:wrap} .page-btn{min-width:40px;height:40px;padding:0 10px;border:1px solid var(--border);background:var(--surface); color:var(--text);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-weight:500;cursor:pointer} .page-btn:hover,.page-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)} .page-btn.disabled{opacity:.4;pointer-events:none} .section-head{text-align:center;margin:40px 0 8px}.section-head h2{font-family:var(--font-head);margin:.2em 0} .section-head p{color:var(--muted);margin:0} .featured-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;padding:16px 0} .featured-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius); overflow:hidden;display:flex;flex-direction:column;color:var(--text)} .featured-card .featured-img{height:160px;display:flex;align-items:center;justify-content:center;background:#f5f5f4} .featured-card .featured-img img{width:100%;height:100%;object-fit:cover} .featured-body{padding:14px}.featured-rank{color:var(--accent);font-weight:700;font-size:.8rem} .featured-title{font-weight:600;margin:4px 0} .compare-wrap{overflow-x:auto}.compare-table{width:100%;border-collapse:collapse;background:var(--surface); border:1px solid var(--border);border-radius:var(--radius)} .compare-table th,.compare-table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left} .compare-table th{background:var(--surface2);font-size:.85rem} .compare-bar{height:6px;background:var(--border);border-radius:4px;margin-top:4px} .compare-bar-fill{height:100%;background:var(--accent);border-radius:4px} .score-bar-wrap{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px 18px;margin:14px 0} .score-bar-label{display:flex;justify-content:space-between;font-size:.8rem;color:var(--muted);margin-bottom:6px} .score-bar-track{height:8px;background:var(--border);border-radius:4px;overflow:hidden} .score-bar-fill{height:100%;background:var(--accent)} .cta-disclosure{font-size:.78rem;color:var(--muted);margin:6px 0 0;line-height:1.45;font-style:italic} /* гарантированный affiliate-disclosure под hero (код, не LLM); цвет — акцент темы */ .aff-disc{font-size:.85rem;color:var(--muted);line-height:1.5} .aff-disc .aff-ic{color:var(--accent);font-weight:700;margin-right:6px} .aff-strip{margin:20px 0;padding:10px 16px;background:var(--surface2);border-left:3px solid var(--accent);border-radius:var(--radius)} .aff-card{margin:24px auto;padding:14px 18px;max-width:720px;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--radius)} .verdict-box{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;margin:14px 0} .verdict-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:6px} .related-section{background:var(--surface2);padding:32px 0;margin-top:32px;border-top:1px solid var(--border)} .related-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;color:inherit} .related-card .featured-img{height:150px;display:flex;align-items:center;justify-content:center;background:#f5f5f4} .related-card .featured-img img{width:100%;height:100%;object-fit:cover} .brand-cloud-section{background:var(--surface2);padding:22px 20px;border:1px solid var(--border);border-radius:var(--radius);margin:28px 0} .brand-cloud-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);text-align:center;margin-bottom:10px} .brand-cloud{display:flex;flex-wrap:wrap;gap:8px;justify-content:center} .brand-tag{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:6px 14px;font-size:.85rem;cursor:pointer} .brand-tag.active{background:var(--primary);color:#fff;border-color:var(--primary)} .filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:18px 0;padding:12px 16px; background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)} .filter-select{padding:7px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text)} .filter-reset{background:none;border:1.5px solid var(--border);border-radius:7px;padding:7px 13px;font-size:.8rem;color:var(--muted);cursor:pointer} .filter-results{margin-left:auto;color:var(--muted);font-size:.85rem} .ad-placement{margin:20px 0}.ad-placement-inner{display:flex;gap:16px;justify-content:center;flex-wrap:wrap} .ad-unit{width:300px;height:250px;background:var(--surface2);border:1px dashed var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center} .ad-unit:empty::before{content:"Advertisement";color:var(--muted);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase} .content-with-sidebar{display:grid;grid-template-columns:1fr 300px;gap:28px;align-items:start;margin-top:28px} @media(max-width:900px){.content-with-sidebar{grid-template-columns:1fr}} /* отступ у 2-колоночного блока даёт сам контейнер; первый brand_cloud в колонке контента обнуляет свой верхний margin, чтобы обе колонки стартовали вровень */ .content-with-sidebar .main-content>.brand-cloud-section:first-child{margin-top:0} .sidebar-top10{position:sticky;top:20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px} .sidebar-head{font-weight:700;margin-bottom:8px} .sidebar-item{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--border);color:inherit} .sidebar-rank{color:var(--accent);font-weight:700;font-size:.85rem}.sidebar-name{flex:1;font-size:.9rem} #cookie-banner{position:fixed;bottom:0;left:0;right:0;background:var(--primary);color:#fff;padding:14px 20px;display:none;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;z-index:50} html.cookie-ask #cookie-banner{display:flex} #cookie-banner a{color:#fff;text-decoration:underline} #cookie-banner button{background:var(--accent);color:#fff;border:0;border-radius:8px;padding:8px 16px;cursor:pointer;margin-left:8px} #cookie-banner .cookie-btns button#cookie-decline{background:transparent;border:1px solid #fff} /* Варианты лэйаута AI-темы (data-* на body) */ body[data-hero="left"] .hero{text-align:left} body[data-hero="split"] .hero{text-align:left;max-width:640px} body[data-card="horizontal"] .card{flex-direction:row} body[data-card="horizontal"] .card img{width:40%;height:auto} body[data-card="overlay"] .card{position:relative} body[data-card="overlay"] .card .body{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff} body[data-btn="outlined"] .btn{background:transparent;color:var(--accent);border:2px solid var(--accent)} body[data-btn="gradient"] .btn{background:linear-gradient(135deg,var(--accent),var(--primary))} body[data-btn="pill"] .btn{border-radius:999px} body[data-fbg="dark"] .featured-strip{background:var(--primary);color:#fff;padding:24px 0;border-radius:var(--radius)} body[data-fbg="accent"] .featured-strip{background:var(--accent);color:#fff;padding:24px 0;border-radius:var(--radius)} .card-highlights{list-style:none;padding:0;margin:4px 0;font-size:.82rem;color:var(--muted)} .card-highlights li{padding:1px 0}.card-highlights li::before{content:"✓ ";color:var(--accent)} tr[data-href]{cursor:pointer}tr[data-href]:hover{background:var(--surface2)} @media(min-width:900px){.grid{grid-template-columns:repeat(4,1fr)}} .hero-lab .lab-wrap{display:grid;grid-template-columns:1fr 300px;gap:32px;align-items:center;text-align:left;max-width:1100px}@media(max-width:900px){.hero-lab .lab-wrap{grid-template-columns:1fr}}.lab-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px}.lab-meta{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:12px}.lab-score-label{font-size:.9rem;font-weight:600}.lab-score-track{height:8px;background:var(--border);border-radius:4px;overflow:hidden;margin-top:6px}.lab-score-fill{height:100%;background:var(--accent)} .picks-podium .podium-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:end;padding:16px 0}@media(max-width:700px){.picks-podium .podium-grid{grid-template-columns:1fr;align-items:stretch}}.podium-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;color:var(--text)}.podium-card.podium-1{border-color:var(--accent);box-shadow:0 8px 30px rgba(0,0,0,.12)}@media(min-width:701px){.picks-podium .podium-card.podium-1{transform:translateY(-16px)}}.podium-medal{position:absolute;top:8px;left:8px;font-size:1.5rem;z-index:2}.podium-card .featured-img{height:170px;display:flex;align-items:center;justify-content:center;background:#f5f5f4}.podium-card .featured-img img{width:100%;height:100%;object-fit:cover}.podium-card .featured-body{padding:14px} .product-lab-report{max-width:900px;margin:0 auto;padding:32px 20px}.product-lab-report .lr-panel{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:20px;margin-bottom:24px} /* theme overrides */ /* dz fallback */ /* design extra */ :root{--dz-gap:1.5rem;} /* ===== Header ===== */ .dz-header{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;} .dz-header-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0.85rem 1.5rem;gap:1.5rem;} .dz-brand{display:flex;align-items:center;gap:0.6rem;text-decoration:none;color:var(--text);font-family:var(--font-head);position:relative;} .dz-brand-logo{height:36px;max-height:36px;width:auto;object-fit:contain;} .dz-brand-name{font-size:1.25rem;font-weight:700;letter-spacing:0.02em;color:var(--text);} .dz-brand-gauge{position:relative;width:22px;height:22px;border-radius:50%;background:var(--surface2);border:2px solid var(--border);display:inline-block;overflow:hidden;} .dz-brand-gauge-fill{position:absolute;inset:0;background:conic-gradient(var(--accent) 0deg 250deg,transparent 250deg 360deg);} .dz-brand-gauge-needle{position:absolute;top:50%;left:50%;width:2px;height:8px;background:var(--primary);transform-origin:bottom center;transform:translate(-50%,-100%) rotate(35deg);} .dz-nav-toggle-input{display:none;} .dz-nav-toggle{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:0.4rem;} .dz-nav-toggle-bar{width:24px;height:2px;background:var(--text);display:block;} .dz-nav-list{display:flex;align-items:center;gap:1.75rem;list-style:none;margin:0;padding:0;} .dz-nav-link{color:var(--text);text-decoration:none;font-family:var(--font-body);font-weight:500;font-size:0.95rem;transition:color 0.2s ease;} .dz-nav-link:hover{color:var(--accent);} @media (max-width:840px){ .dz-nav-toggle{display:flex;} .dz-nav{position:absolute;top:100%;left:0;right:0;background:var(--surface);border-bottom:1px solid var(--border);max-height:0;overflow:hidden;transition:max-height 0.3s ease;} .dz-nav-list{flex-direction:column;align-items:flex-start;gap:0;padding:0.5rem 1.5rem;} .dz-nav-item{width:100%;border-top:1px solid var(--border);} .dz-nav-link{display:block;padding:0.85rem 0;} .dz-nav-toggle-input:checked ~ .dz-nav{max-height:500px;} } /* ===== Hero ===== */ .dz-hero{position:relative;overflow:hidden;background:var(--bg);padding:5rem 1.5rem;} .dz-hero-dark{background:linear-gradient(160deg,var(--surface2),var(--bg));} .dz-hero-bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.25;z-index:0;} .dz-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.15),var(--bg) 95%);z-index:1;} .dz-hero-grid{position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:40px 40px;opacity:0.15;z-index:1;} .dz-hero-gauge-deco{position:absolute;right:5%;top:50%;transform:translateY(-50%);width:260px;height:260px;z-index:1;opacity:0.5;pointer-events:none;} .dz-hero-gauge-ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent);} .dz-hero-gauge-ring-2{inset:30px;border-color:var(--primary);} .dz-hero-gauge-ticks{position:absolute;inset:0;} .dz-hero-gauge-needle{position:absolute;top:50%;left:50%;width:3px;height:90px;background:var(--accent);transform-origin:bottom center;transform:translate(-50%,-100%) rotate(40deg);} .dz-hero-gauge-hub{position:absolute;top:50%;left:50%;width:14px;height:14px;border-radius:50%;background:var(--primary);transform:translate(-50%,-50%);} .dz-hero-inner{position:relative;z-index:2;max-width:820px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.25rem;} .dz-hero-logo-wrap{position:relative;width:84px;height:84px;display:flex;align-items:center;justify-content:center;margin-bottom:0.5rem;} .dz-hero-logo-ring{position:absolute;inset:0;border-radius:50%;border:2px dashed var(--accent);opacity:0.5;} .dz-hero-logo{max-height:60px;width:auto;object-fit:contain;position:relative;z-index:1;} .dz-hero-gear{position:absolute;top:50%;left:50%;width:124px;height:124px;transform:translate(-50%,-50%);z-index:0;opacity:0.85;filter:drop-shadow(0 2px 6px rgba(200,68,59,0.25));} @keyframes dz-gear-spin{from{transform:translate(-50%,-50%) rotate(0deg);}to{transform:translate(-50%,-50%) rotate(360deg);}} @media (prefers-reduced-motion:no-preference){ .dz-hero-gear{animation:dz-gear-spin 9s linear infinite;} } .dz-anim-spin{animation:dz-spin 12s linear infinite;} .dz-anim-float{animation:dz-float 3.5s ease-in-out infinite;} @keyframes dz-spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}} @keyframes dz-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}} .dz-hero-title{font-family:var(--font-head);font-size:clamp(2rem,4.5vw,3.2rem);line-height:1.15;color:var(--text);margin:0;} .dz-hero-title-highlight{color:var(--accent);} .dz-hero-subtitle{font-family:var(--font-body);color:var(--muted);font-size:1.1rem;max-width:600px;margin:0.5rem 0 0;} .dz-hero-cta-row{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:1.5rem;} .dz-hero-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:0.75rem;margin-top:1.5rem;} .dz-hero-badge{display:inline-flex;align-items:center;gap:0.4rem;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:0.5rem 1rem;font-size:0.85rem;color:var(--muted);box-shadow:0 2px 8px rgba(16,24,32,0.05);} .dz-hero-badge b{font-family:var(--font-head);color:var(--accent);font-size:1rem;} .dz-btn{display:inline-flex;align-items:center;justify-content:center;padding:0.85rem 1.75rem;border-radius:var(--radius);font-family:var(--font-body);font-weight:600;text-decoration:none;transition:transform 0.2s ease,opacity 0.2s ease;} .dz-btn-gradient{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border:none;} .dz-btn-gradient:hover{transform:translateY(-2px);opacity:0.92;} .dz-btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border);} .dz-btn-ghost:hover{border-color:var(--accent);color:var(--accent);} .dz-hero-scanline{position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);z-index:2;} /* ===== Footer ===== */ .dz-footer{background:var(--surface);border-top:1px solid var(--border);padding:3rem 1.5rem 2rem;margin-top:3rem;} .dz-footer-inner{max-width:1000px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0.75rem;} .dz-footer-brand{display:flex;align-items:center;gap:0.6rem;} .dz-footer-logo{height:32px;max-height:32px;width:auto;object-fit:contain;} .dz-footer-name{font-family:var(--font-head);font-weight:700;font-size:1.1rem;color:var(--text);} .dz-footer-desc{color:var(--muted);font-family:var(--font-body);max-width:560px;margin:0.25rem 0 0.5rem;line-height:1.6;} .dz-footer-links{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;justify-content:center;margin-bottom:0.5rem;} .dz-footer-link{color:var(--muted);text-decoration:none;font-size:0.9rem;} .dz-footer-link:hover{color:var(--accent);} .dz-footer-sep{color:var(--border);} .dz-footer-bottom{margin-top:0.75rem;padding-top:1rem;border-top:1px solid var(--border);width:100%;} .dz-footer-copy{color:var(--muted);font-size:0.85rem;} /* ===== Editor's Picks Podium ===== */ .dz-picks-podium{padding:4rem 1.5rem;background:var(--bg);} .dz-picks-header{text-align:center;max-width:640px;margin:0 auto 2.5rem;} .dz-picks-title{font-family:var(--font-head);font-size:2rem;color:var(--text);margin:0 0 0.75rem;} .dz-picks-sub{color:var(--muted);font-family:var(--font-body);margin:0;} .dz-podium-track{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--dz-gap);max-width:1100px;margin:0 auto;align-items:end;} .dz-podium-step{display:flex;flex-direction:column;position:relative;} .dz-rank-1{order:2;} .dz-rank-2{order:1;} .dz-rank-3{order:3;} .dz-podium-badge{position:absolute;top:-14px;left:14px;background:var(--accent);color:#fff;font-weight:700;font-size:0.85rem;padding:0.25rem 0.65rem;border-radius:999px;z-index:2;box-shadow:0 2px 6px rgba(0,0,0,0.25);} .dz-podium-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:var(--text);transition:transform 0.2s ease,box-shadow 0.2s ease;} .dz-podium-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.15);} .dz-rank-1 .dz-podium-card{border-color:var(--accent);} .dz-podium-media{position:relative;display:block;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--surface2);} .dz-podium-img{width:100%;height:100%;object-fit:cover;display:block;} .dz-podium-body{padding:1rem 1.1rem 1.25rem;display:flex;flex-direction:column;gap:0.35rem;} .dz-podium-category{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--muted);} .dz-podium-name{font-family:var(--font-head);font-weight:600;font-size:1.05rem;color:var(--text);} .dz-podium-media .dz-gauge{position:absolute;bottom:0.6rem;right:0.6rem;width:46px;height:46px;background:var(--surface);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,0.25);} .dz-gauge-svg{width:100%;height:100%;transform:rotate(-90deg);} .dz-gauge-track{fill:none;stroke:var(--border);stroke-width:3;} .dz-gauge-fill{fill:none;stroke:var(--accent);stroke-width:3;stroke-dasharray:94.2;stroke-dashoffset:94.2;} .dz-gauge-value{position:absolute;font-size:0.75rem;font-weight:700;color:var(--text);} @media (max-width:780px){ .dz-podium-track{grid-template-columns:1fr;} .dz-rank-1,.dz-rank-2,.dz-rank-3{order:0;} } /* ===== Top 10 sidebar ===== */ .dz-top10{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;} .dz-top10-inner{display:flex;flex-direction:column;} .dz-top10-title{font-family:var(--font-head);font-size:1.15rem;color:var(--text);margin:0 0 1rem;padding-bottom:0.75rem;border-bottom:1px solid var(--border);} .dz-top10-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.5rem;} .dz-top10-item{border-bottom:1px solid var(--border);} .dz-top10-item:last-child{border-bottom:none;} .dz-top10-link{display:flex;align-items:center;gap:0.75rem;text-decoration:none;color:var(--text);padding:0.5rem 0.25rem;border-radius:calc(var(--radius) - 4px);transition:background 0.2s ease,color 0.2s ease;} .dz-top10-link:hover{background:var(--surface2);color:var(--accent);} .dz-top10-rank{flex:0 0 auto;width:26px;height:26px;border-radius:50%;background:var(--surface2);color:var(--accent);font-weight:700;font-size:0.8rem;display:flex;align-items:center;justify-content:center;} .dz-top10-name{font-size:0.9rem;line-height:1.3;} /* ===== Listing / Grid ===== */ .dz-listing-section{padding:3rem 1.5rem 4rem;max-width:1280px;margin:0 auto;} .dz-grid.pg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--dz-gap);margin-top:0.5rem;} .dz-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:var(--text);transition:transform 0.2s ease,box-shadow 0.2s ease;} .dz-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.15);} .dz-card-media{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--surface2);} .dz-card-img{width:100%;height:100%;object-fit:cover;display:block;} .dz-card-overlay{position:absolute;left:0;right:0;bottom:0;padding:1rem;background:linear-gradient(180deg,transparent,rgba(0,0,0,0.75));display:flex;flex-direction:column;gap:0.25rem;} .dz-card-category{color:#fff;opacity:0.8;font-size:0.7rem;text-transform:uppercase;letter-spacing:0.05em;} .dz-card-name{font-family:var(--font-head);font-size:1rem;color:#fff;margin:0;} .dz-card-overlay .dz-gauge{margin-top:0.5rem;align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--accent);box-shadow:0 2px 8px rgba(0,0,0,0.35);} .dz-card-overlay .dz-gauge-dial{display:none;} .dz-card-overlay .dz-gauge-val{color:#fff;font-family:var(--font-head);font-weight:700;font-size:0.9rem;line-height:1;} .dz-gauge-dial{width:14px;height:14px;border-radius:50%;background:var(--accent);display:inline-block;} .dz-card-body{padding:1rem 1.1rem 1.25rem;display:flex;flex-direction:column;gap:0.85rem;flex:1;} .dz-card-highlights{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.35rem;} .dz-highlight-item{font-size:0.85rem;color:var(--muted);padding-left:1rem;position:relative;} .dz-highlight-item::before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:700;} .dz-card-cta{margin-top:auto;align-self:flex-start;font-weight:600;color:var(--accent);font-size:0.9rem;} #pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:0.6rem;margin-top:3rem;} /* ===== How We Test ===== */ .dz-how-we-test{padding:4rem 1.5rem;background:var(--surface);} .dz-htw-inner{max-width:1100px;margin:0 auto;} .dz-htw-head{text-align:center;max-width:700px;margin:0 auto 2.5rem;} .dz-htw-title{font-family:var(--font-head);font-size:2rem;color:var(--text);margin:0 0 1rem;} .dz-htw-intro{color:var(--muted);line-height:1.7;margin:0;} .dz-htw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--dz-gap);} .dz-htw-card{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:1.75rem 1.5rem;display:flex;flex-direction:column;align-items:flex-start;gap:0.75rem;} .dz-htw-card .dz-gauge{width:52px;height:52px;border-radius:50%;background:var(--bg);border:2px solid var(--accent);position:relative;margin-bottom:0.25rem;} .dz-gauge-face{position:absolute;inset:0;} .dz-gauge-needle{position:absolute;top:50%;left:50%;width:2px;height:18px;background:var(--primary);transform-origin:bottom center;transform:translate(-50%,-100%) rotate(30deg);} .dz-htw-crit-title{font-family:var(--font-head);font-size:1.05rem;color:var(--text);margin:0;} .dz-htw-crit-desc{color:var(--muted);font-size:0.9rem;line-height:1.6;margin:0;} /* ===== Stats Strip ===== */ .dz-stats-strip{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2.5rem;padding:3rem 1.5rem;background:var(--bg);border-top:1px solid var(--border);border-bottom:1px solid var(--border);} .dz-stat-item{display:flex;flex-direction:column;align-items:center;gap:0.4rem;text-align:center;min-width:120px;} .dz-stat-value{font-family:var(--font-head);font-size:2.25rem;font-weight:700;color:var(--accent);} .dz-stat-label{color:var(--muted);font-size:0.85rem;text-transform:uppercase;letter-spacing:0.04em;} .dz-stat-gauge .dz-gauge{width:80px;height:80px;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--p,0)*1%),var(--surface2) 0);display:flex;align-items:center;justify-content:center;position:relative;} .dz-gauge-inner{width:60px;height:60px;border-radius:50%;background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;} .dz-gauge-max{font-size:0.7rem;color:var(--muted);} .dz-stat-gauge .dz-gauge-value{position:static;font-size:1.15rem;font-weight:700;color:var(--text);line-height:1;} /* ===== Speedometer animations (page-wide) ===== */ @property --dz-gauge-deg{syntax:"";inherits:false;initial-value:0deg;} @property --pct{syntax:"";inherits:false;initial-value:0%;} @keyframes dz-fill-deg{from{--dz-gauge-deg:0deg;}} @keyframes dz-fill-pct{from{--pct:0%;}} @keyframes dz-grow{from{width:0;}} @keyframes dz-rev{0%{transform:translate(-50%,-100%) rotate(6deg);}50%{transform:translate(-50%,-100%) rotate(64deg);}72%{transform:translate(-50%,-100%) rotate(34deg);}100%{transform:translate(-50%,-100%) rotate(46deg);}} @keyframes dz-rev-loop{0%,100%{transform:translate(-50%,-100%) rotate(16deg);}50%{transform:translate(-50%,-100%) rotate(58deg);}} @keyframes dz-spin{to{transform:rotate(360deg);}} @keyframes dz-spin-rev{to{transform:rotate(-360deg);}} @keyframes dz-hub-pulse{0%{box-shadow:0 0 0 0 rgba(200,68,59,0.55);}70%,100%{box-shadow:0 0 0 12px rgba(200,68,59,0);}} @keyframes dz-rise{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}} @keyframes dz-scan{0%{transform:translateX(-100%);}100%{transform:translateX(100%);}} /* speedometer face: tick marks + brighter dashboard presence on hero */ .dz-hero-gauge-deco{opacity:0.9;} .dz-hero-gauge-ticks{border-radius:50%;background:repeating-conic-gradient(from -8deg,var(--accent) 0 1.4deg,transparent 1.4deg 30deg);-webkit-mask:radial-gradient(circle,transparent 63%,#000 65%,#000 73%,transparent 75%);mask:radial-gradient(circle,transparent 63%,#000 65%,#000 73%,transparent 75%);opacity:0.7;} .dz-hero-gauge-ring-1{border-color:transparent;border-top-color:var(--accent);border-right-color:var(--accent);} .dz-hero-gauge-ring-2{border-color:transparent;border-bottom-color:var(--primary);border-left-color:var(--primary);} .dz-hero-scanline{overflow:hidden;} @media (prefers-reduced-motion:no-preference){ /* hero entrance */ .dz-hero-title{animation:dz-rise 0.7s ease-out both;} .dz-hero-subtitle{animation:dz-rise 0.7s 0.12s ease-out both;} .dz-hero-cta-row{animation:dz-rise 0.7s 0.24s ease-out both;} /* revving needles everywhere */ .dz-hero-gauge-needle{animation:dz-rev 2.4s cubic-bezier(0.2,0.85,0.25,1) both,dz-rev-loop 4.5s 2.4s ease-in-out infinite;} .dz-brand-gauge-needle,.dz-htw-card .dz-gauge-needle,.dz-faq .dz-gauge-needle{animation:dz-rev-loop 5s ease-in-out infinite;} .dz-htw-card:nth-child(2) .dz-gauge-needle{animation-duration:5.6s;} .dz-htw-card:nth-child(3) .dz-gauge-needle{animation-duration:4.4s;} .dz-htw-card:nth-child(4) .dz-gauge-needle{animation-duration:6s;} /* sweeping dial arcs + pulsing hub */ .dz-hero-gauge-ring-1{animation:dz-spin 20s linear infinite;} .dz-hero-gauge-ring-2{animation:dz-spin-rev 14s linear infinite;} .dz-hero-gauge-hub{animation:dz-hub-pulse 2.6s ease-out infinite;} .dz-hero-scanline::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:dz-scan 3.2s ease-in-out infinite;} /* fills sweep up on load, whole page */ .dz-gauge-lab{animation:dz-fill-deg 1.7s 0.15s cubic-bezier(0.2,0.8,0.2,1) both;} .pdp-side-ring{animation:dz-fill-pct 1.7s 0.15s cubic-bezier(0.2,0.8,0.2,1) both;} .pdp-stars{animation:dz-fill-pct 1.4s 0.3s ease-out both;} .dz-lead-meter-fill,.score-bar-fill,.compare-bar-fill,.lab-score-fill{animation:dz-grow 1.5s cubic-bezier(0.2,0.8,0.2,1) both;} } .dz-stat-badge{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;font-weight:700;font-size:0.85rem;padding:0.5rem 1rem;border-radius:999px;} /* ===== FAQ ===== */ .dz-faq{padding:4rem 1.5rem;background:var(--surface);max-width:900px;margin:0 auto;} .dz-faq-head{text-align:center;margin-bottom:2.5rem;display:flex;flex-direction:column;align-items:center;gap:0.75rem;} .dz-gauge-deco{width:48px;height:48px;border-radius:50%;border:2px solid var(--accent);position:relative;} .dz-gauge-deco .dz-gauge-ring{position:absolute;inset:6px;border-radius:50%;border:1px dashed var(--border);} .dz-gauge-deco .dz-gauge-needle{position:absolute;top:50%;left:50%;width:2px;height:16px;background:var(--primary);transform-origin:bottom center;transform:translate(-50%,-100%) rotate(45deg);} .dz-faq-title{font-family:var(--font-head);font-size:2rem;color:var(--text);margin:0;} .dz-faq-sub{color:var(--muted);margin:0;max-width:560px;} .dz-faq-list{display:flex;flex-direction:column;gap:1rem;} .dz-faq-item{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:0.25rem 1.25rem;} .dz-faq-q{display:flex;align-items:center;gap:0.75rem;padding:1rem 0;cursor:pointer;font-weight:600;color:var(--text);list-style:none;} .dz-faq-q::-webkit-details-marker{display:none;} .dz-gauge-sm{width:22px;height:22px;border-radius:50%;background:var(--bg);border:2px solid var(--border);flex:0 0 auto;position:relative;overflow:hidden;} .dz-gauge-sm .dz-gauge-fill{position:absolute;inset:0;background:var(--accent);opacity:0.6;} .dz-faq-a{padding:0 0 1.25rem;color:var(--muted);line-height:1.7;} .dz-faq-a p{margin:0;} /* ===== Product Hero ===== */ .dz-hero-lab{padding:4rem 1.5rem;} .dz-hero-lab .dz-hero-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.4fr 0.8fr;gap:2.5rem;align-items:center;background:none;position:relative;z-index:2;} .dz-hero-copy{display:flex;flex-direction:column;gap:1rem;text-align:left;} .dz-eyebrow{color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:0.06em;font-size:0.8rem;margin:0;} .dz-hero-lab .dz-hero-title{text-align:left;font-size:clamp(1.75rem,3.5vw,2.6rem);} .dz-hero-tagline{color:var(--muted);font-size:1.05rem;margin:0;} .dz-hero-meta{display:flex;gap:0.6rem;flex-wrap:wrap;margin-top:0.5rem;} .dz-chip{background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:0.4rem 0.85rem;border-radius:999px;font-size:0.82rem;} .dz-chip-outline{background:transparent;} .dz-hero-gauge-wrap{display:flex;flex-direction:column;align-items:center;gap:0.75rem;} .dz-gauge-lab{--dz-gauge-deg:0deg;width:164px;height:164px;border-radius:50%;background:conic-gradient(var(--accent) var(--dz-gauge-deg),var(--border) var(--dz-gauge-deg));display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 10px 26px rgba(16,24,32,0.14);} .dz-gauge-lab::after{content:'';position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(16,24,32,0.08);pointer-events:none;} .dz-gauge-lab .dz-gauge-face{width:112px;height:112px;border-radius:50%;background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(16,24,32,0.10);position:relative;z-index:1;} .dz-gauge-num{font-family:var(--font-head);font-size:2rem;font-weight:700;color:var(--text);line-height:1;} .dz-gauge-sub{font-size:0.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.04em;margin-top:0.15rem;} .dz-gauge-ticks{position:absolute;inset:0;} .dz-gauge-caption{color:var(--muted);font-size:0.8rem;text-align:center;margin:0;} @media (max-width:800px){ .dz-hero-lab .dz-hero-grid{grid-template-columns:1fr;text-align:center;} .dz-hero-copy{align-items:center;text-align:center;} .dz-hero-lab .dz-hero-title{text-align:center;} } /* ===== Buy Box ===== */ .dz-buybox{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.75rem;max-width:360px;} .dz-buybox--sticky{position:sticky;top:6rem;} .dz-buybox-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0.85rem;} .dz-buybox .dz-gauge{width:90px;height:90px;border-radius:50%;background:var(--surface2);display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:0.5rem;} .dz-gauge-dial{position:relative;width:70px;height:70px;border-radius:50%;background:var(--surface);display:flex;align-items:center;justify-content:center;} .dz-buybox .dz-gauge-track{position:absolute;inset:0;border-radius:50%;border:4px solid var(--border);} .dz-buybox .dz-gauge-fill{position:absolute;inset:0;border-radius:50%;border:4px solid var(--accent);clip-path:inset(0 0 0 0);} .dz-gauge-center{display:flex;flex-direction:column;align-items:center;} .dz-buybox-title{font-family:var(--font-head);font-size:1.2rem;color:var(--text);margin:0;} .dz-buybox-brand{color:var(--muted);font-size:0.85rem;margin:0 0 0.5rem;} .dz-buybox-cta{width:100%;margin-top:0.5rem;} .dz-buybox-trust{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-direction:column;gap:0.6rem;width:100%;text-align:left;} .dz-trust-item{font-size:0.85rem;color:var(--muted);padding-left:1.4rem;position:relative;} .dz-trust-check::before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:700;} .dz-buybox-secondary-link{color:var(--accent);font-size:0.85rem;text-decoration:none;margin-top:0.5rem;} .dz-buybox-secondary-link:hover{text-decoration:underline;} /* ===== Spec Table ===== */ .dz-spec-section{padding:3.5rem 1.5rem;max-width:1100px;margin:0 auto;} .dz-spec-header{display:flex;align-items:center;justify-content:space-between;gap:2rem;margin-bottom:2.25rem;flex-wrap:wrap;} .dz-spec-title{font-family:var(--font-head);font-size:1.75rem;color:var(--text);margin:0 0 0.5rem;} .dz-spec-sub{color:var(--muted);margin:0;} .dz-spec-header .dz-gauge{width:90px;height:90px;border-radius:50%;background:var(--surface2);position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 auto;} .dz-spec-header .dz-gauge-track{position:relative;width:70px;height:70px;border-radius:50%;background:var(--surface);display:flex;align-items:center;justify-content:center;border:4px solid var(--accent);} .dz-spec-header .dz-gauge-inner{display:flex;flex-direction:column;align-items:center;} .dz-gauge-label{font-size:0.7rem;color:var(--muted);} .dz-spec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--dz-gap);margin-bottom:2rem;} .dz-spec-card{display:flex;align-items:flex-start;gap:0.75rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem;} .dz-spec-marker{width:8px;height:8px;border-radius:50%;background:var(--accent);margin-top:0.35rem;flex:0 0 auto;} .dz-spec-body{display:flex;flex-direction:column;gap:0.25rem;} .dz-spec-label{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--muted);} .dz-spec-value{font-weight:600;color:var(--text);} .dz-spec-chips{display:flex;flex-wrap:wrap;gap:0.6rem;} .dz-spec-chips .dz-chip{background:var(--surface2);border:1px solid var(--border);} .dz-chip-label{color:var(--muted);margin-right:0.25rem;} .dz-chip-value{color:var(--text);font-weight:600;} /* guard: потолок высоты товарных картинок (независимо от LLM extra_css; НЕ hero-фон) */ .product img,[class*="dz-buy-box"] img,[class*="dz-product-image"]{max-height:70vh;object-fit:contain} /* guard: отступ под заголовком LLM-секции (extra_css иногда его опускает) */ [class*="dz-section-head"]{margin-bottom:1.5rem} /* guard: контейнер пагинации LLM-листинга (