/* Diagnostic opt-in skin. All selectors require .seo-diagnostic. No pinned scene. */
.seo-diagnostic { --dg-line: #5cbce12c; --dg-muted: #8bc2db; }
.seo-diagnostic .dg-hero { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: 42px; align-items: center; padding: 34px 0 32px; }
.seo-diagnostic .dg-hero-copy { padding: 24px 0; min-width: 0; }
.seo-diagnostic .dg-hero h1 { font-size: clamp(34px,3.9vw,55px); line-height: 1.08; letter-spacing: -1.8px; margin: 20px 0 24px; text-wrap: balance; }
.seo-diagnostic .dg-hero .lead { font-size: 18px; max-width: 620px; }
.seo-diagnostic .dg-visual { position: relative; height: 460px; margin: 0; border: 1px solid #78bdde3b; border-radius: 6px 30px 6px 30px; overflow: hidden; background: radial-gradient(ellipse at 60% 40%,#14507145,transparent 70%),#03111e; isolation: isolate; }
.seo-diagnostic .dg-visual > img { width: 100%; height: 100%; object-fit: cover; object-position: 64% center; display: block; }
.seo-diagnostic .dg-visual::after { content: ''; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg,transparent 55%,#020c16eb 100%); pointer-events: none; }
.seo-diagnostic .dg-grid { position: absolute; inset: 0; z-index: 1; background-image: linear-gradient(#8edbff0b 1px,transparent 1px),linear-gradient(90deg,#8edbff0b 1px,transparent 1px); background-size: 48px 48px; pointer-events: none; mask-image: linear-gradient(90deg,#000,transparent 80%); }
.seo-diagnostic .dg-corners { position: absolute; inset: 22px; z-index: 2; border: 1px solid #72d4fb44; clip-path: polygon(0 0,12% 0,12% 1px,1px 1px,1px 12%,0 12%,0 0,100% 0,100% 12%,calc(100% - 1px) 12%,calc(100% - 1px) 1px,88% 1px,88% 0,100% 0,100% 100%,88% 100%,88% calc(100% - 1px),calc(100% - 1px) calc(100% - 1px),calc(100% - 1px) 88%,100% 88%,100% 100%,0 100%,0 88%,1px 88%,1px calc(100% - 1px),12% calc(100% - 1px),12% 100%,0 100%); pointer-events: none; }
.seo-diagnostic .dg-visual figcaption { position: absolute; bottom: 28px; left: 30px; right: 30px; z-index: 3; padding-top: 16px; border-top: 1px solid #79c7e64d; color: #d2e6f0; font-size: 14px; line-height: 1.55; }
.seo-diagnostic .dg-scan { position: absolute; inset: 45px 0 90px 26px; width: 46%; z-index: 1; overflow: hidden; pointer-events: none; }
.seo-diagnostic .dg-scan i { position: absolute; border: 1px solid #6bdbff3b; width: 320px; height: 320px; border-radius: 50%; left: -235px; top: 0; }
.seo-diagnostic .dg-scan i:nth-child(2) { width: 440px; height: 440px; top: -60px; }
.seo-diagnostic .dg-scan i:nth-child(3) { width: 560px; height: 560px; top: -120px; }
.seo-diagnostic .dg-method { display: flex; justify-content: space-between; align-items: center; gap: 28px; padding: 24px 28px; border-top: 1px solid var(--dg-line); border-bottom: 1px solid var(--dg-line); background: linear-gradient(100deg,#0821358c,#06111e00); }
.seo-diagnostic .dg-method ol { display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0; padding: 0; gap: 28px; }
.seo-diagnostic .dg-method li { color: #d0e1ed; font-size: 15px; line-height: 1.55; }
.seo-diagnostic .dg-method li span { display: inline-block; color: #60bfdc; margin-left: 28px; }
.seo-diagnostic .sr-hero-tags { gap: 20px 30px; flex-wrap: wrap; padding: 22px 0; }
.seo-diagnostic .sr-page-nav { border-top: 0; }
.seo-diagnostic .sr-section { margin-top: 82px; }
.seo-diagnostic .sr-section-heading { position: relative; padding-left: 24px; border-left: 2px solid #42c4f266; }
.seo-diagnostic .sr-section h2 { font-size: clamp(28px,3vw,39px); }
.seo-diagnostic .sr-kicker { letter-spacing: 1.5px; }
.seo-diagnostic .sr-card { border-radius: 6px 18px 6px 18px; background: linear-gradient(135deg,#0a2133b3,#061421); border-color: var(--dg-line); }
.seo-diagnostic .sr-scope .sr-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; border: 1px solid var(--dg-line); border-radius: 8px; overflow: hidden; }
.seo-diagnostic .sr-scope .sr-card { padding: 30px; border: 0; border-radius: 0; border-bottom: 1px solid var(--dg-line); background: linear-gradient(90deg,#0b253380,#06132180); position: relative; }
.seo-diagnostic .sr-scope .sr-card:nth-child(odd) { border-right: 1px solid var(--dg-line); }
.seo-diagnostic .sr-scope .sr-card h3 { display: flex; gap: 14px; align-items: baseline; }
.seo-diagnostic .sr-scope .sr-card h3::before { content: ''; flex: 0 0 12px; width: 12px; height: 1px; background: #6ed5fc; box-shadow: 0 0 10px #50baff40; }
.seo-diagnostic .sr-scope .sr-card p { padding-left: 26px; }
.seo-diagnostic .sr-step-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.seo-diagnostic .sr-step-number { font-family: ui-monospace,Consolas,monospace; color: #91d8ef; width: 32px; height: 32px; line-height: 30px; text-align: center; border: 1px solid #6daec944; margin-bottom: 24px; }
.seo-diagnostic .sr-scene { border-radius: 8px 28px 8px 28px; background-image: linear-gradient(#6bc2f008 1px,transparent 1px),linear-gradient(90deg,#6bc2f008 1px,transparent 1px),radial-gradient(ellipse at 85% 50%,#17618138,transparent 70%); background-size: 56px 56px,56px 56px,auto; }
.seo-diagnostic .sr-scene .sr-section-heading { border: 0; padding: 0; }
.seo-diagnostic .sr-assessment { background: none; }
.seo-diagnostic .sr-assessment-dot { border-radius: 2px; }
.seo-diagnostic .sr-note.sr-section { border-left: 2px solid #3fc8f7a0; border-radius: 4px 18px 18px 4px; background: linear-gradient(110deg,#08283d,#071523); }
.seo-diagnostic .sr-note .sr-section-heading { border: 0; padding: 0; }
.seo-diagnostic .sr-note .sr-section-heading p:last-child { margin-bottom: 0; }
.seo-diagnostic .sr-price { border-radius: 8px; background: linear-gradient(110deg,#102b40,#091827); position: relative; }
.seo-diagnostic .sr-price::before { content: ''; width: 35px; height: 2px; background: #df616b; position: absolute; top: 0; left: 42px; }
.seo-diagnostic .sr-related-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.seo-diagnostic .sr-contact { border-radius: 8px 28px 8px 28px; }
.seo-diagnostic .dg-plates { position: absolute; inset: 28px 24px 150px; perspective: 800px; }
.seo-diagnostic .dg-plate { position: absolute; width: 56%; height: 90%; left: 21%; top: 5%; border: 1px solid #7bc8e47a; border-radius: 7px; background: linear-gradient(130deg,#183f5780,#06142299); box-shadow: 0 20px 60px #0004; }
.seo-diagnostic .dg-plate-back { transform: translateX(-48px) rotate(-13deg); opacity: .5; }
.seo-diagnostic .dg-plate-front { transform: translateX(28px) rotate(10deg); }
.seo-diagnostic .dg-plane { position: absolute; inset: 24px; border: 1px solid #71c1e040; background: repeating-linear-gradient(0deg,transparent 0 28px,#77c0e01a 28px 29px); }
.seo-diagnostic .dg-axis { position: absolute; left: 50%; top: 10%; height: 80%; width: 1px; background: #a1e5f862; }
.seo-diagnostic .dg-axis::after { content: ''; position: absolute; width: 100px; height: 1px; left: -50px; top: 50%; background: #a1e5f862; }
.seo-diagnostic .dg-diagram-label { position: absolute; left: 32px; right: 26px; bottom: 110px; z-index: 2; color: #93c7df; font-size: 12px; line-height: 1.4; letter-spacing: 1px; }
.seo-diagnostic .dg-diagram-label strong { display: block; font-size: 24px; color: #e0f3fb; letter-spacing: -.5px; line-height: 1.2; margin-top: 10px; }
.seo-diagnostic .dg-sample { position: absolute; inset: 40px 35px 220px; border: 1px solid #6ecbed30; border-radius: 6px; background: linear-gradient(90deg,#1d689333,#05142270); }
.seo-diagnostic .dg-sample::before { content: ''; position: absolute; width: 28px; top: 28px; bottom: 28px; left: 24px; border-radius: 6px 6px 16px 16px; border: 1px solid #8dd1e47a; background: linear-gradient(180deg,#af647a45,#307da14d); }
.seo-diagnostic .dg-sample::after { content: ''; position: absolute; width: 42px; height: 6px; top: 22px; left: 17px; border: 1px solid #ae5f76; border-radius: 2px; background: #663047; }
.seo-diagnostic .dg-sample i { position: absolute; width: 24px; height: 24px; border: 1px solid #78d2ed77; border-radius: 50%; background: radial-gradient(circle,#408da430,transparent); top: 32px; left: 36%; }
.seo-diagnostic .dg-sample i:nth-child(2) { left: 62%; top: 35%; width: 32px; height: 32px; border-color: #bb72887d; }
.seo-diagnostic .dg-sample i:nth-child(3) { left: 43%; top: 65%; width: 16px; height: 16px; }
.seo-diagnostic .dg-sample i:nth-child(4) { left: 78%; top: 65%; width: 18px; height: 18px; }
.seo-diagnostic .dg-sample i:nth-child(5) { left: 80%; top: 14%; width: 12px; height: 12px; }
.seo-diagnostic.dg-laboratory .dg-hero h1 { font-size: clamp(33px,3.35vw,48px); }
.seo-diagnostic.dg-laboratory .dg-visual > img { object-position: 72% center; }
@media (max-width:1000px) and (min-width:761px) {
 .seo-diagnostic .dg-hero { gap: 26px; }
 .seo-diagnostic .dg-visual { height: 440px; }
 .seo-diagnostic .dg-method { flex-direction: column; align-items: flex-start; gap: 16px; }
 .seo-diagnostic .dg-hero h1 { font-size: 38px; }
 .seo-diagnostic.dg-laboratory .dg-hero h1 { font-size: 34px; overflow-wrap: anywhere; }
}
@media (max-width:760px) {
 .seo-diagnostic .dg-hero { grid-template-columns: 1fr; gap: 20px; padding-top: 18px; }
 .seo-diagnostic .dg-hero-copy { padding: 12px 0 0; }
 .seo-diagnostic .dg-hero h1,.seo-diagnostic.dg-laboratory .dg-hero h1 { font-size: clamp(31px,7.7vw,44px); letter-spacing: -1.1px; margin-top: 16px; }
 .seo-diagnostic .dg-hero .lead { font-size: 17px; }
 .seo-diagnostic .dg-visual { height: 340px; border-radius: 4px 24px 4px 24px; }
 .seo-diagnostic .dg-visual > img { object-position: 67% center; }
 .seo-diagnostic .dg-visual figcaption { left: 22px; right: 22px; bottom: 22px; font-size: 13px; }
 .seo-diagnostic .dg-method { flex-direction: column; align-items: flex-start; gap: 16px; padding: 22px; }
 .seo-diagnostic .dg-method ol { gap: 12px; flex-direction: column; align-items: flex-start; }
 .seo-diagnostic .dg-method li span { margin-left: 16px; transform: rotate(90deg); }
 .seo-diagnostic .sr-hero-tags { font-size: 12px; }
 .seo-diagnostic .sr-section { margin-top: 65px; }
 .seo-diagnostic .sr-section-heading { padding-left: 18px; }
 .seo-diagnostic .sr-scope .sr-card-grid,.seo-diagnostic .sr-step-grid,.seo-diagnostic .sr-related-grid { grid-template-columns: 1fr; }
 .seo-diagnostic .sr-scope .sr-card { padding: 24px; }
 .seo-diagnostic .sr-scope .sr-card:nth-child(odd) { border-right: 0; }
 .seo-diagnostic .sr-steps .sr-card { grid-template-columns: 32px 1fr; gap: 0 16px; border-radius: 0; background: none; }
 .seo-diagnostic .sr-step-number { margin-top: 0; }
 .seo-diagnostic .dg-diagram-label { left: 24px; bottom: 97px; font-size: 11px; }
 .seo-diagnostic .dg-diagram-label strong { font-size: 21px; }
 .seo-diagnostic .dg-plates { inset: 18px 15px 130px; }
 .seo-diagnostic .dg-sample { inset: 24px 24px 177px; }
 .seo-diagnostic .dg-sample::before { top: 22px; bottom: 20px; }
 .seo-diagnostic .dg-sample::after { top: 16px; }
}
@media (max-width:360px) {
 .seo-diagnostic .dg-hero h1,.seo-diagnostic.dg-laboratory .dg-hero h1 { font-size: 30px; overflow-wrap: anywhere; }
 .seo-diagnostic .dg-visual { height: 315px; }
 .seo-diagnostic .dg-diagram-label strong { font-size: 20px; }
}