/* CDN's shared material system: all functional panels use the same frosted glass. */
:root {
  --glass-fill: rgba(244, 250, 255, .35);
  --glass-sheen: linear-gradient(135deg, rgba(255,255,255,.40), rgba(255,255,255,.06) 48%, rgba(222,232,255,.18));
  --glass-edge: rgba(255,255,255,.76);
  --glass-shadow: 0 18px 48px -24px rgba(34,48,83,.30), 0 4px 12px -7px rgba(26,46,73,.12), inset 0 1px 0 rgba(255,255,255,.72), inset 0 -1px 0 rgba(115,141,174,.10);
  --glass-blur: blur(24px) saturate(135%);
  --body: #3d4c64;
}
body {
  background-color: #e5eaf3;
  background-image:
    radial-gradient(ellipse at 5% 15%, rgba(0,168,232,.22) 0, transparent 42%),
    radial-gradient(ellipse at 95% 30%, rgba(107,33,168,.15) 0, transparent 43%),
    radial-gradient(ellipse at 30% 85%, rgba(230,0,126,.09) 0, transparent 35%),
    radial-gradient(ellipse at 100% 100%, rgba(255,119,0,.13) 0, transparent 39%),
    linear-gradient(135deg, #e7f0f5, #e6e7f1 54%, #f1e9e4);
  background-attachment: fixed;
}
.glass, .metric {
  background-color: var(--glass-fill);
  background-image: var(--glass-sheen);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  border: 1px solid var(--glass-edge);
  border-right-color: rgba(255,255,255,.45);
  border-bottom-color: rgba(126,148,178,.22);
  box-shadow: var(--glass-shadow);
}
.nav.glass {
  background-color: rgba(233,244,251,.66);
  background-image: linear-gradient(120deg,rgba(255,255,255,.30),rgba(231,224,245,.18));
  -webkit-backdrop-filter: blur(30px) saturate(135%);
  backdrop-filter: blur(30px) saturate(135%);
  box-shadow: 0 14px 45px -22px rgba(8,24,47,.40), inset 0 1px 0 rgba(255,255,255,.8);
}
.logo picture {mix-blend-mode:normal}
.nav nav a {position:relative;padding:10px 0}
.nav nav a::after {content:"";position:absolute;left:0;right:0;bottom:4px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--cyan),var(--magenta));transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav nav a:hover::after,.nav nav a:focus-visible::after {transform:scaleX(1)}
.service-dock.glass {background-color:rgba(233,244,251,.66)}
.service-dock a {border-bottom-color:rgba(73,97,127,.12)}
.service-dock a:last-child {border-bottom:0}
.service-dock a:hover {background:rgba(255,255,255,.20)}
.service-dock span {font-size:11px;line-height:1.4}
.service {border-top-width:1px;border-top-color:rgba(255,255,255,.9);position:relative;overflow:hidden;--surface-accent:0,168,232}
.service.magenta {--surface-accent:230,0,126;border-top-color:rgba(255,255,255,.9)}
.service.violet {--surface-accent:107,33,168;border-top-color:rgba(255,255,255,.9)}
.service.amber {--surface-accent:255,119,0;border-top-color:rgba(255,255,255,.9)}
.service::before {content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 100% 0,rgba(var(--surface-accent),.11),transparent 65%)}
.service>* {position:relative}
.service:hover,.guide-card:hover,.related-links a:hover {
  background-color:rgba(245,251,255,.48);
  border-color:rgba(255,255,255,.96);
  box-shadow:0 24px 55px -25px rgba(51,72,110,.32),inset 0 1px 0 rgba(255,255,255,.9);
}
.service h3 {font-size:22px}
.service p {font-size:16px;line-height:1.7}
.service ul {font-size:13px;line-height:1.9;color:#4b5d74}
.service>a {font-size:14px;display:inline-flex;align-items:center;min-height:44px}
.service-icon {background:rgba(var(--surface-accent,0,168,232),.09);border:1px solid rgba(255,255,255,.68);box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 6px 16px -10px rgba(15,23,42,.24)}
.viewer {border:7px solid rgba(242,249,255,.43);box-shadow:var(--glass-shadow);background:rgba(229,242,251,.22)}
.viewer-top .glass,.hotspots.glass,.rotation.glass {background-color:rgba(240,248,253,.65);-webkit-backdrop-filter:blur(22px) saturate(120%);backdrop-filter:blur(22px) saturate(120%)}
.controls button,.hotspots button {min-height:36px;padding:0 8px;font-size:13px;border-radius:20px}
.controls button:hover,.hotspots button:hover {background:rgba(255,255,255,.3);color:#005e80}
.controls {gap:3px}
.hotspots {gap:12px;padding:6px 13px}
.presence {background:linear-gradient(115deg,rgba(167,212,236,.20),rgba(213,194,235,.19));border-color:rgba(255,255,255,.5)}
.listing.complete {background-color:rgba(211,241,250,.35);border-color:rgba(170,228,249,.8)}
.listing.incomplete {background-color:rgba(239,226,242,.31)}
.listing-photo:not(.photo) {background:linear-gradient(140deg,rgba(132,155,180,.13),rgba(190,175,200,.17));border:1px solid rgba(255,255,255,.5);color:#68768c}
.listing-photo span {background:rgba(239,249,255,.70);border:1px solid rgba(255,255,255,.75);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.listing-line {border-top-color:rgba(71,96,130,.12);font-size:13px}
.listing-actions a {background:rgba(0,168,232,.10);border:1px solid rgba(255,255,255,.6);color:#005d81;min-height:40px;display:flex;align-items:center}
.tag {font-size:11px;line-height:1.5;display:block}
.stars span {font-size:12px}
.calculator-panel {background-color:rgba(232,241,252,.31)}
.metric {background-color:rgba(232,244,251,.30);box-shadow:inset 0 1px 0 rgba(255,255,255,.70),0 8px 25px -20px rgba(30,50,91,.4)}
.metric.revenue {background-color:rgba(216,219,246,.38);background-image:linear-gradient(125deg,rgba(93,198,234,.16),rgba(176,139,225,.12));border-color:rgba(255,255,255,.7)}
.metric span {font-size:13px;color:#506078}
input[type=range] {height:6px;cursor:pointer}
.address.glass {background-color:rgba(236,244,252,.33)}
.address p {font-size:16px}
.map-card.glass {background-color:rgba(222,237,251,.30);padding:7px}
.map-card iframe {border-radius:20px;filter:saturate(.72)}
.map-card div {font-size:13px;padding:20px;line-height:1.6}
.faq details {background-color:rgba(235,244,252,.34);transition:background-color .22s,box-shadow .22s}
.faq details:hover {background-color:rgba(237,248,255,.45)}
.faq details[open] {background-color:rgba(225,240,252,.49);border-left-color:rgba(0,168,232,.55);box-shadow:var(--glass-shadow)}
.faq summary {font-size:16px;line-height:1.65;padding-right:26px;position:relative}
.faq summary::after {position:absolute;right:0;top:-3px}
.faq details p {font-size:16px;line-height:1.85}
.guide-card.glass {background-color:rgba(231,242,253,.33)}
.guide-card:nth-child(2) {background-image:linear-gradient(140deg,rgba(255,255,255,.35),rgba(239,201,226,.11))}
.guide-card:nth-child(3) {background-image:linear-gradient(140deg,rgba(255,255,255,.35),rgba(206,191,237,.17))}
.guide-card:nth-child(4) {background-image:linear-gradient(140deg,rgba(255,255,255,.35),rgba(241,213,184,.14))}
.guide-index {color:#8798b2;opacity:.8}
.guide-card>p:not(.eyebrow) {font-size:16px}
.guide-toc.glass,.guide-prep.glass,.related-links a.glass {background-color:rgba(231,241,251,.38);background-image:var(--glass-sheen)}
.guide-next.glass,.final-cta.glass,.resource-callout.glass {
  background-color:rgba(225,236,249,.38);
  background-image:linear-gradient(110deg,rgba(97,203,238,.17),rgba(255,255,255,.14) 45%,rgba(193,145,223,.17));
}
.guide-step {border-color:rgba(93,118,152,.17)}
.button {background:linear-gradient(125deg,#007dba,#0099c9);border:1px solid rgba(255,255,255,.36);box-shadow:0 8px 22px -10px rgba(0,107,161,.45),inset 0 1px 0 rgba(255,255,255,.23)}
.button.ghost {background:linear-gradient(135deg,rgba(227,244,255,.19),rgba(217,223,243,.10));border-color:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}
.button.outline {background:linear-gradient(135deg,rgba(255,255,255,.25),rgba(232,241,252,.17));border-color:rgba(255,255,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 7px 20px -15px rgba(36,60,91,.30);color:#23435e}
footer.wrap {border-top:1px solid rgba(255,255,255,.55);color:#52647d}
.mobile-dock.glass {background-color:rgba(227,240,250,.78);background-image:var(--glass-sheen);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px)}
.mobile-dock a {border:1px solid rgba(255,255,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
@media(max-width:1100px) and (min-width:761px){.nav{gap:15px;padding-left:18px;padding-right:18px}.nav nav{gap:13px}.nav .button.small{padding:10px 15px;font-size:12px}}
@media(max-width:760px){
  body{background-attachment:scroll;background-size:100% 1500px;background-repeat:repeat-y}
  .nav nav{background-color:rgba(223,238,249,.96);background-image:linear-gradient(125deg,rgba(255,255,255,.19),rgba(212,197,236,.13));border:1px solid rgba(255,255,255,.8);box-shadow:var(--glass-shadow)}
  .nav nav a{padding:8px 0}
  .services{grid-template-columns:1fr;gap:18px}.service{padding:28px}.service-icon{margin-bottom:20px}.service h3{font-size:24px}.service p{font-size:16px}.service ul{font-size:14px;margin:20px 0 10px}.service>a{font-size:14px}
  .viewer{border-width:5px}.controls button{min-height:40px;font-size:12px}.hotspots{gap:2px}.hotspots button{font-size:11px;line-height:1.35;min-height:44px}
  .comparison{grid-template-columns:1fr}.comparison-note{grid-column:auto}.listing{padding:24px}.listing h3{font-size:22px}.listing-photo{height:180px}.listing-line{font-size:14px}.listing-actions a{font-size:14px}.tag{font-size:11px}.stars span{font-size:13px}
  .faq summary{font-size:15px}.faq details{padding:20px}.faq details p{font-size:15px}.metric span{font-size:12px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .glass,.metric{background-color:#e4eaf5}
  .nav.glass,.service-dock.glass,.viewer-top .glass,.hotspots.glass,.rotation.glass{background-color:#e0eaf3}
}
@media(prefers-reduced-transparency:reduce){.glass,.metric{background-color:#e3eaf3;background-image:none;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.nav nav a::after{transition:none}}