.crl-screen-guide { background: var(--cream); color: var(--dark-text); font-size: 16px; line-height: 1.65; }
.crl-screen-guide *, .crl-screen-guide *::before, .crl-screen-guide *::after { box-sizing: border-box; }
.crl-screen-guide [hidden] { display: none !important; }
.crl-screen-guide .wp-block-group__inner-container { display: contents; }
.crl-screen-guide :where(h1,h2,h3,p,figure,ul,ol) { margin: 0; }
.crl-screen-guide :where(h1,h2,h3) { color: inherit; opacity: 1; text-align: left; font-weight: 600; }
.crl-screen-guide h1 { font-size: clamp(40px,5.1vw,70px); line-height: 1.06; letter-spacing: -.055em; }
.crl-screen-guide h2 { font-size: clamp(29px,3.25vw,43px); line-height: 1.13; letter-spacing: -.045em; }
.crl-screen-guide h3 { font-size: 21px; line-height: 1.25; letter-spacing: -.025em; }
.crl-screen-guide p + p { margin-top: 16px; }
.crl-screen-guide a:not(.crl-shell-button) { color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.crl-screen-guide a:not(.crl-shell-button):hover { text-decoration-thickness: 2px; }
.crl-screen-guide :where(button,a,input,summary):focus-visible { outline: 3px solid #a17c00; outline-offset: 5px; }
.crl-screen-guide :where(section,[id]) { scroll-margin-top: 32px; }
.sg-wrap { width: min(100%,var(--page-width)); margin-inline: auto; padding-inline: 42px; }
.sg-section { padding-block: 80px; }
.sg-white { background: var(--paper); }
.sg-dark { background: var(--ink); color: var(--text); }
.sg-kicker { color: #806000; font-size: 11px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; line-height: 1.4; margin-bottom: 17px !important; }
.sg-dark .sg-kicker { color: var(--accent); }
.sg-intro { max-width: 660px; margin-bottom: 36px; }
.sg-intro p:not(.sg-kicker) { margin-top: 18px; color: var(--dark-muted); }
.sg-dark .sg-intro p:not(.sg-kicker) { color: var(--muted); }
.sg-lead { font-size: 18px; line-height: 1.65; }
.sg-small { font-size: 13px; line-height: 1.45; color: var(--dark-muted); }
.sg-dark .sg-small { color: var(--muted); }
.sg-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 25px; margin-top: 27px; }
.crl-screen-guide .crl-shell-button { color: var(--dark-text); text-decoration: none; }
.sg-text-link { font-size: 14px; font-weight: 600; }
.sg-hero { padding-block: 33px 64px; overflow: hidden; }
.sg-breadcrumb { font-size: 12px; line-height: 1.4; color: var(--muted); margin-bottom: 48px; }
.sg-hero-grid { display: grid; grid-template-columns: 1.12fr 1fr; align-items: center; gap: 64px; }
.sg-hero h1 em { font-style: normal; color: var(--accent); }
.sg-hero .sg-lead { margin-top: 25px; max-width: 580px; color: #c5cdd3; }
.sg-hero .sg-small { margin-top: 25px; }
.sg-hero-art { position: relative; padding: 22px 0 24px; }
.sg-device { background: #20272e; border: 1px solid #52606a; padding: 13px 13px 20px; border-radius: 18px 18px 8px 8px; box-shadow: 0 30px 60px #0006; transform: rotate(-4deg); }
.sg-device::before { content: ''; display: block; width: 4px; height: 4px; background: #71808b; border-radius: 50%; margin: -5px auto 7px; }
.sg-device img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 4px; display: block; }
.sg-device::after { content: ''; display: block; background: linear-gradient(#66737c,#202a32); height: 18px; margin: 20px -26px -36px; border-radius: 2px 2px 22px 22px; }
.sg-art-note { position: relative; display: flex; gap: 15px; align-items: center; background: #1c252c; border: 1px solid #34424c; border-radius: 12px; padding: 18px 20px; margin: 35px 0 0 30px; font-size: 13px; line-height: 1.4; }
.sg-art-note b { color: var(--accent); font-size: 25px; }
.sg-art-note strong { display: block; color: #fff; margin-bottom: 5px; }
.sg-art-note span { color: #bbc5cc; }
.sg-toc { border-bottom: 1px solid var(--light-line); background: var(--paper); }
.sg-toc-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 25px; padding-block: 22px; font-size: 13px; }
.sg-toc-inner strong { margin-right: 8px; }
.sg-toc-inner a { padding-block: 6px; }
.sg-symptoms { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; align-items: start; }
.sg-symptom { min-width: 0; border: 1px solid var(--light-line); border-radius: 14px; background: var(--paper); overflow: hidden; }
.sg-symptom[open] { border-color: #a58000; box-shadow: 0 0 0 1px #a58000; }
.sg-symptom summary { cursor: pointer; display: grid; grid-template-columns: 62px 1fr 20px; align-items: center; gap: 15px; padding: 23px; list-style: none; font-size: 16px; font-weight: 600; line-height: 1.35; }
.sg-symptom summary::-webkit-details-marker { display: none; }
.sg-symptom summary::after { content: '+'; font-size: 23px; font-weight: 300; }
.sg-symptom[open] summary::after { content: '-'; }
.sg-screen { height: 43px; border: 3px solid #38434b; border-radius: 5px; position: relative; background: #dce5e7; overflow: hidden; }
.sg-screen::before,.sg-screen::after { content: ''; position: absolute; }
.sg-screen--crack::before { inset: 0; background: #33424b; clip-path: polygon(45% 0,50% 36%,83% 30%,56% 44%,70% 100%,49% 57%,10% 81%,42% 46%,13% 20%,44% 35%); }
.sg-screen--lines { background: repeating-linear-gradient(90deg,#e5bc62 0 2px,#506b83 2px 5px,#c0cfd3 5px 8px); }
.sg-screen--flicker { background: repeating-linear-gradient(0deg,#dce5e7 0 5px,#70808b 5px 7px); }
.sg-screen--black { background: #141a1f; }
.sg-screen--dim { background: #39434a; }
.sg-screen--dim::before { inset: 9px 8px; border: 1px solid #63727a; }
.sg-screen--hinge { transform: rotate(-8deg); border-bottom-color: #b78415; }
.sg-answer { border-top: 1px solid var(--light-line); padding: 20px 23px 24px; font-size: 14px; line-height: 1.6; }
.sg-answer p + p { margin-top: 12px; }
.sg-answer a { display: inline-block; margin-top: 15px; font-weight: 600; }
.sg-notice { margin-top: 27px; padding: 21px 25px; border-left: 4px solid var(--accent); background: #ece9df; border-radius: 0 8px 8px 0; }
.sg-notice p { font-size: 14px; }
.sg-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.sg-stack > * + *, .sg-stack > .wp-block-group__inner-container > * + * { margin-top: 22px; }
.sg-list { padding-left: 22px; }
.sg-list li + li { margin-top: 12px; }
.sg-feature-list { display: grid; gap: 0; }
.sg-feature { padding: 23px 0; border-bottom: 1px solid var(--light-line); }
.sg-feature:first-child { padding-top: 0; }
.sg-feature h3 { margin-bottom: 10px; font-size: 19px; }
.sg-feature p { font-size: 15px; color: var(--dark-muted); }
.sg-anatomy { padding: 34px; border: 1px solid var(--light-line); border-radius: 16px; background: var(--cream); }
.sg-anatomy svg { display: block; width: 100%; height: auto; margin-bottom: 26px; }
.sg-anatomy ol { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 13px; font-size: 13px; }
.sg-anatomy b { color: #805f00; margin-right: 5px; }
.sg-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.sg-card { border: 1px solid var(--light-line); background: var(--paper); padding: 30px; border-radius: 14px; }
.sg-card h3 { margin-bottom: 14px; }
.sg-card p { color: var(--dark-muted); font-size: 15px; }
.sg-card .sg-kicker { margin-bottom: 14px !important; }
.sg-cost-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: 50px; align-items: start; }
.sg-cost-factors { list-style: none; padding: 0; }
.sg-cost-factors li { display: grid; grid-template-columns: 40px 1fr; gap: 14px; padding-block: 20px; border-bottom: 1px solid #34404a; }
.sg-cost-factors li:first-child { padding-top: 0; }
.sg-cost-factors span { color: var(--accent); font-size: 13px; }
.sg-cost-factors strong { display: block; color: #fff; margin-bottom: 6px; }
.sg-cost-factors p { color: var(--muted); font-size: 14px; }
.sg-cost-layout + .sg-small, .sg-cost-layout ~ .sg-small { margin-top: 25px; }
.sg-quote-card { background: var(--accent); color: var(--dark-text); padding: 34px; border-radius: 16px; }
.sg-quote-card h3 { font-size: 25px; }
.sg-quote-card ul { padding-left: 20px; font-size: 14px; margin-top: 23px; }
.sg-quote-card li + li { margin-top: 13px; }
.sg-quote-card .crl-shell-button { background: var(--ink); color: #fff; margin-top: 27px; }
.sg-checklist { padding: 28px; border: 1px solid var(--light-line); border-radius: 14px; background: var(--paper); }
.sg-checklist label { display: flex; gap: 14px; padding: 16px 0; align-items: flex-start; cursor: pointer; font-size: 15px; border-bottom: 1px solid var(--light-line); }
.sg-checklist input[type=checkbox] { flex: none; width: 21px; height: 21px; margin: 2px 0 0; accent-color: #806000; }
.sg-checklist output { display: block; font-size: 14px; line-height: 1.5; background: var(--cream); padding: 18px; margin-top: 23px; border-radius: 8px; }
.sg-steps { counter-reset: sg-step; list-style: none; padding: 0; }
.sg-steps li { position: relative; padding: 0 0 27px 58px; counter-increment: sg-step; }
.sg-steps li::before { content: counter(sg-step,decimal-leading-zero); position: absolute; left: 0; top: 0; border: 1px solid #b9a159; border-radius: 50%; color: #806000; font-size: 13px; font-weight: 600; width: 35px; height: 35px; display: grid; place-items: center; }
.sg-steps h3 { margin-bottom: 9px; font-size: 19px; }
.sg-steps p { font-size: 15px; color: var(--dark-muted); }
.sg-buying { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.sg-buying .sg-card { padding: 27px; }
.sg-faq details { border-bottom: 1px solid var(--light-line); padding-block: 21px; }
.sg-faq summary { cursor: pointer; font-size: 17px; font-weight: 600; padding-right: 10px; }
.sg-faq details p { color: var(--dark-muted); margin-top: 16px; padding-right: 20px; }
.sg-form-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 65px; align-items: start; }
.sg-form-card { background: var(--paper); color: var(--dark-text); border-radius: 16px; padding: 30px; min-width: 0; }
.sg-form-card .crpn-enquiry { margin: 0; border: 0; padding: 0; box-shadow: none; background: transparent; }
.sg-form-card .crpn-enquiry__title { font-size: 23px; letter-spacing: -.025em; }
.sg-form-card .crpn-enquiry__intro { font-size: 13px; }
.sg-selected { color: var(--accent); font-size: 14px; margin-top: 25px; }
.sg-sources { padding-block: 35px; border-top: 1px solid var(--light-line); }
.sg-sources h2 { font-size: 21px; margin-bottom: 14px; }
.sg-sources ul { font-size: 13px; line-height: 1.5; columns: 2; padding-left: 18px; }
.sg-sources li { margin-bottom: 10px; break-inside: avoid; }
.sg-sources .sg-small { margin-top: 20px; }
@media (max-width: 1000px) {
 .sg-wrap { padding-inline: 28px; }
 .sg-hero-grid { gap: 36px; }
 .sg-symptoms { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .sg-split,.sg-form-layout { gap: 35px; }
 .sg-buying { grid-template-columns: 1fr; }
 .sg-cost-layout { gap: 30px; }
}
@media (max-width: 720px) {
 .sg-wrap { padding-inline: 22px; }
 .sg-section { padding-block: 52px; }
 .sg-hero { padding-block: 24px 46px; }
 .sg-breadcrumb { margin-bottom: 32px; }
 .sg-hero-grid,.sg-split,.sg-cost-layout,.sg-form-layout { grid-template-columns: 1fr; gap: 35px; }
 .sg-hero-art { max-width: 500px; margin-inline: auto; padding-inline: 12px; }
 .sg-hero .sg-lead { font-size: 16px; }
 .sg-toc-inner { gap: 7px 20px; }
 .sg-toc-inner strong { width: 100%; }
 .sg-cards { grid-template-columns: 1fr; }
 .sg-cost-factors { margin-bottom: 0; }
 .sg-form-card { padding: 22px; }
 .sg-sources ul { columns: 1; }
}
@media (max-width: 480px) {
 .sg-symptoms { grid-template-columns: 1fr; }
 .sg-symptom summary { padding: 18px; }
 .sg-card,.sg-quote-card,.sg-checklist,.sg-anatomy { padding: 24px; }
 .sg-anatomy ol { grid-template-columns: 1fr; }
 .sg-actions { align-items: stretch; flex-direction: column; }
 .sg-actions .sg-text-link { text-align: center; padding: 6px; }
 .sg-form-card { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
 html:has(.crl-screen-guide) { scroll-behavior: auto; }
 .crl-screen-guide .crl-shell-button { transition: none; }
}