#view-site{--spring:cubic-bezier(.22,1.15,.36,1);--finish-radius:8px 28px 8px 8px}
#view-site .hdr{background:color-mix(in srgb,var(--bg) 78%,transparent);border-bottom-color:color-mix(in srgb,var(--surface) 80%,transparent)}
#view-site .hdr__in{background:linear-gradient(110deg,color-mix(in srgb,var(--surface) 25%,transparent),transparent 48%,color-mix(in srgb,var(--accent-soft) 15%,transparent))}
#view-site .account-button{background:var(--accent-soft);color:var(--accent);border-color:color-mix(in srgb,var(--accent) 25%,var(--line))}
#view-site .account-button:hover{background:var(--accent-soft)}
#view-site :is(a,button,input,textarea,summary):focus-visible{outline:3px solid var(--accent);outline-offset:5px}
#view-site .nav a[aria-current]{color:var(--accent);text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px}
#view-site .card{gap:20px;border-radius:var(--finish-radius);padding:28px;box-shadow:0 4px 16px #15151c03}
#view-site .card > .mono{font-size:11px;letter-spacing:.07em;color:var(--accent);padding-bottom:14px;border-bottom:1px solid var(--line)}
#view-site .card::after{top:28px;right:28px}
#view-site .card h3{font-size:24px;line-height:1.3;min-height:2.6em;letter-spacing:-.025em}
#view-site .card ul{font-size:15px;line-height:1.65;gap:10px;margin:0 0 8px}
#view-site .price{align-items:baseline;gap:12px;padding-top:18px}
#view-site .price b{font-size:clamp(23px,2.2vw,28px);letter-spacing:-.025em;line-height:1.3}
#view-site .price b:not(.num){font-size:20px;letter-spacing:-.015em}
#view-site .service-link{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:46px;padding:12px 14px;border-radius:4px 14px 4px 4px;background:var(--accent-soft);color:var(--accent);text-decoration:none;font-size:14px;font-weight:550}
#view-site .service-link span{font-size:22px;line-height:1}
#view-site .slot__book{min-height:44px;padding:8px;align-items:center}
#view-site .ccard{border-radius:var(--finish-radius);gap:20px;padding:24px}
#view-site .ccard__metric b{font-size:clamp(42px,5vw,64px);letter-spacing:-.04em}
#view-site .ccard__title{line-height:1.4}
#view-site .ccard__arrow{top:auto;bottom:20px;right:20px;width:40px;height:40px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:23px;opacity:.8}
#view-site .ccard__foot{padding-right:48px;font-size:12px;letter-spacing:.015em;line-height:1.5;text-transform:none}
#view-site .faq details{border-radius:8px;padding-inline:16px}
#view-site .faq details[open]{background:var(--surface)}
#view-site .faq summary{line-height:1.45}
#view-site .faq summary::after{transition:transform .3s var(--spring),background .2s}
#view-site .faq details[open] summary::after{background:var(--accent-soft);color:var(--accent);border-color:transparent}
@media(prefers-reduced-motion:no-preference){
 #view-site :is(.btn,.service-link,.slot__book,.ccard,.card){transition:transform .4s var(--spring),box-shadow .25s ease,background .2s ease,border-color .2s ease}
 #view-site :is(.sec__head,.step,.visual-card,.csec,.card){transition:opacity .45s ease,transform .65s var(--spring)}
 #view-site .reveal-pending{transform:translateY(14px)}
 #view-site :is(.btn,.service-link,.slot__book):active{transform:scale(.985)}
 @media(hover:hover) and (pointer:fine){
  #view-site .card:hover{transform:translateY(-4px);box-shadow:0 12px 28px #3029770d}
  #view-site :is(.service-link,.ccard):hover{transform:translateY(-3px);box-shadow:0 8px 24px #30297712}
 }
}
@media(max-width:1000px){#view-site .card h3{min-height:0}}
@media(max-width:600px){#view-site .card{padding:24px;gap:18px}#view-site .card::after{top:24px;right:24px}#view-site .card h3{font-size:23px}#view-site .price b{font-size:26px}#view-site .ccard{padding:20px}#view-site .faq details{padding-inline:10px}}
@supports not (backdrop-filter:blur(1px)){#view-site .hdr{background:var(--bg)}}

/* Stable section heights keep hash links accurate during initial loading. */
#view-site .sec{content-visibility:visible;contain-intrinsic-size:none}
#view-site .price{min-height:56px}