/* Illustrated service content: every title and description remains HTML. */
.service-detail-cards { padding:24px; margin:24px 0; background:radial-gradient(ellipse at 90% 0,#20445655,transparent 55%),#071e2e; border:1px solid #294b61; border-radius:22px; }
.service-cards-heading { text-align:center; margin:0 auto 22px; max-width:700px; }.service-cards-heading > span { color:#ffb744; font:750 10px/1.4 system-ui,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.service-detail-cards .service-cards-heading h2 { color:#fff; margin:9px 0; font:800 clamp(23px,2.5vw,32px)/1.15 system-ui,sans-serif; }.service-cards-heading p { margin:0; color:#b8ccdc; font:400 13px/1.6 system-ui,sans-serif; }
.service-cards-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:start; }
.service-detail-card { position:relative; isolation:isolate; overflow:hidden; border:1px solid #42647b; border-radius:18px; background:#0a2435; box-shadow:inset 0 1px #ffffff12,0 8px 20px #020d161f; }
.service-card-art { position:absolute; inset:0 0 auto auto; aspect-ratio:1; height:auto; z-index:-2; width:max(48%,var(--service-card-photo-size,0px)); background-image:url('../img/services/electric-cards-atlas-v1.webp'); background-size:200% 200%; background-repeat:no-repeat; -webkit-mask-image:linear-gradient(90deg,transparent 0%,#00000018 14%,#00000080 34%,#000 62%),linear-gradient(180deg,transparent 0%,#000 7%,#000 93%,transparent 100%); mask-image:linear-gradient(90deg,transparent 0%,#00000018 14%,#00000080 34%,#000 62%),linear-gradient(180deg,transparent 0%,#000 7%,#000 93%,transparent 100%); -webkit-mask-composite:source-in; mask-composite:intersect; }
.service-card-photo-0 { background-position:0 0; }.service-card-photo-1 { background-position:100% 0; }.service-card-photo-2 { background-position:0 100%; }.service-card-photo-3 { background-position:100% 100%; }
.service-detail-card::after { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#092334 32%,#092334b3 46%,#09233433 64%,transparent 82%); pointer-events:none; }
.service-card-main { padding:20px; }.service-card-icon { display:grid; place-items:center; width:43px; height:43px; margin-bottom:12px; color:#ffc45a; border:1px solid #cfa14d77; border-radius:12px; background:linear-gradient(145deg,#284a5a,#0b2232); }.service-card-icon svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.service-detail-card h3 { max-width:83%; color:#fff; font:800 19px/1.2 system-ui,sans-serif; margin:0 0 10px; text-wrap:balance; text-shadow:0 1px 3px #061521,0 0 8px #06152180; }
.service-detail-card p { max-width:83%; color:#c8d8e4; font:400 12px/1.6 system-ui,sans-serif; margin:0 0 12px; text-shadow:0 1px 3px #061521; }
.service-detail-card ul { list-style:none; padding:0; margin:14px 0; }.service-detail-card li { display:flex; gap:7px; color:#d3dfeb; font:400 11px/1.5 system-ui,sans-serif; margin:5px 0; }.service-detail-card li::before { content:'✓'; display:grid; place-items:center; flex:0 0 16px; height:16px; border-radius:50%; color:#092334; background:#ffc45a; font-weight:900; }
.service-detail-card summary,.service-card-contact { display:inline-flex; align-items:center; gap:14px; border:1px solid #ffd57d; border-radius:24px; padding:9px 15px; background:linear-gradient(#ffcf6e,#ffb938); color:#0b2535; font:750 11px/1.4 system-ui,sans-serif; cursor:pointer; text-decoration:none; list-style:none; }.service-detail-card summary::-webkit-details-marker { display:none; }.service-detail-card summary:focus-visible,.service-card-contact:focus-visible { outline:3px solid white; outline-offset:3px; }
.service-detail-card details[open] { padding-top:0; }.service-detail-card details > div { background:#071e2ef2; padding:14px; margin-top:12px; border-radius:10px; }.service-detail-card details p { max-width:100%; }.service-detail-card details a { color:#ffca65; font:700 12px/1.5 system-ui,sans-serif; }
@media(max-width:760px) {
 .service-detail-cards { margin:16px 0; padding:14px 10px; border-radius:17px; }.service-cards-heading { margin-bottom:15px; }.service-cards-heading p { font-size:11px; }.service-cards-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
 .service-card-art { width:max(57%,var(--service-card-photo-size,0px)); }
 .service-card-main { display:grid; grid-template-columns:30px minmax(0,1fr); column-gap:9px; row-gap:8px; padding:14px; }
 .service-card-icon { grid-column:1; grid-row:1; width:30px; height:30px; margin:0; border-radius:9px; }.service-card-icon svg { width:21px; height:21px; }
 .service-detail-card h3 { grid-column:2; align-self:center; font-size:16px; line-height:1.2; max-width:100%; margin:0; text-wrap:initial; }
 .service-card-main > p,.service-card-main > ul,.service-card-main > details,.service-card-main > a,.service-card-main > small { grid-column:1/-1; }
 .service-detail-card p { max-width:90%; font-size:11px; margin:0; line-height:1.45; }
 .service-card-main > .service-card-preview { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
 .service-card-main > ul { margin:0; }.service-detail-card li { font-size:10px; margin:3px 0; line-height:1.4; }
 .service-detail-card summary,.service-card-contact { padding:8px 12px; font-size:11px; }.service-card-contact { justify-self:start; }.service-detail-card details > div p { margin-bottom:10px; max-width:100%; }
 .service-coverage-card .service-card-main > p { max-width:100%; }
}

.service-cards-plumbing .service-card-art { background-image:url('../img/services/plumbing-cards-atlas-v1.webp'); }

/* One scope card replaces the previous two standalone panels. */
.service-coverage-card { background:radial-gradient(ellipse at top right,#ffb83c1a,transparent 65%),#0a2435; }
.service-coverage-card::after { display:none; }.service-coverage-card h3,.service-coverage-card p { max-width:100%; }
.service-coverage-card details { margin:10px 0; }.service-coverage-card summary { display:flex; justify-content:space-between; padding:10px 12px; border:1px solid #355969; border-radius:10px; background:#10323f; color:#c9f3e5; }
.service-coverage-card .service-coverage-excludes summary { color:#f4c3ca; background:#322c3c; border-color:#66505c; }.service-coverage-card details > div { margin-top:5px; padding:10px 12px; }.service-coverage-card ul { margin:0; }.service-coverage-card .service-coverage-excludes li::before { content:'−'; background:#dba0ab; }.service-coverage-card small { display:block; margin-top:13px; color:#b2c8d5; font:400 10px/1.5 system-ui,sans-serif; }

.service-cards-fans .service-card-art { background-image:url('../img/services/fans-cards-atlas-v1.webp'); }

.service-cards-wifi .service-card-art { background-image:url('../img/services/wifi-cards-atlas-v1.webp'); }

.service-cards-air .service-card-art { background-image:url('../img/services/air-cards-atlas-v1.webp'); }

.service-cards-emergency .service-card-art { background-image:url('../img/services/emergency-cards-atlas-v1.webp'); }

/* WiFi benefits use compact tiles instead of the long-form reading styles. */
body .service-detail-pro .service-story-body.reading-panel-refresh:has(.wifi-benefits) { padding:24px!important; }
body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh:has(.wifi-benefits),
body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh > .wifi-benefits { max-width:none!important; width:100%; }
.wifi-benefits-label { display:block; color:#ffc45a; font:750 10px/1.4 system-ui,sans-serif; letter-spacing:.12em; text-transform:uppercase; }
body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh .wifi-benefits h2 { padding:0!important; border:0!important; margin:8px 0 18px!important; color:#fff; font:800 25px/1.2 system-ui,sans-serif!important; }
.wifi-benefits-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0 0 16px; }
.wifi-benefits-grid article { display:grid; grid-template-columns:36px minmax(0,1fr); column-gap:12px; align-content:start; padding:16px; border:1px solid #36596b; border-radius:14px; background:linear-gradient(145deg,#123344,#0a2435); }
.wifi-benefit-icon { grid-column:1; grid-row:1/3; display:grid; place-items:center; width:36px; height:36px; color:#ffc45a; border-radius:10px; background:#ffc45a12; }
.wifi-benefit-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh .wifi-benefits h3 { grid-column:2; margin:0 0 6px!important; color:#fff; font:800 16px/1.25 system-ui,sans-serif!important; }
body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh .wifi-benefits p { grid-column:2; margin:0!important; color:#c8d8e4; font:400 13px/1.5 system-ui,sans-serif!important; }
body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh:has(.wifi-benefits) > p { margin:14px 0 0!important; font-size:13px!important; line-height:1.6!important; }
.reading-content-refresh:has(.wifi-benefits) > p:empty { display:none; }
@media(max-width:520px) {
 body .service-detail-pro .service-story-body.reading-panel-refresh:has(.wifi-benefits) { padding:18px 14px!important; }
 .wifi-benefits-grid { grid-template-columns:minmax(0,1fr); gap:10px; }
 .wifi-benefits-grid article { padding:13px; }
 body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh .wifi-benefits h2 { font-size:22px!important; }
 body:not(.theme-pro-app) .service-detail-pro .reading-content-refresh .wifi-benefits h3 { font-size:15px!important; }
}

/* Refined card disclosure, separate from the scope accordions. */
.service-detail-card .service-card-disclosure { min-width:0; }
.service-detail-card .service-card-disclosure > summary { gap:16px; padding:7px 8px 7px 15px; color:#ffe0a2; border:1px solid #c49b5480; background:linear-gradient(135deg,#193747f5,#0c2637f5); box-shadow:inset 0 1px #ffffff0d,0 3px 12px #020d1629; transition:background .2s,border-color .2s; }
.service-card-disclosure > summary > span { display:grid; place-items:center; width:25px; height:25px; flex:0 0 25px; border-radius:50%; background:#ffc45a1a; color:#ffd17a; font-size:17px; line-height:1; transition:transform .2s; }
.service-detail-card .service-card-disclosure > summary:hover { border-color:#ffd17a; background:#1b3b4b; }
.service-card-disclosure[open] > summary > span { transform:rotate(45deg); }
.service-detail-card .service-card-disclosure > .service-card-disclosure-panel { position:relative; margin-top:12px; padding:19px 18px 16px; border:1px solid #5a7b8c66; border-top-color:#cfa65f80; border-radius:14px; background:linear-gradient(135deg,#173646fa,#0a2334fc); box-shadow:inset 0 1px #ffffff09,0 8px 20px #020d1629; }
.service-detail-card .service-card-disclosure-panel p { max-width:100%; color:#dce8f0; font-size:13px; line-height:1.7; margin:0 0 12px; text-shadow:none; }
.service-detail-card .service-card-disclosure-panel > a { display:inline-flex; align-items:center; justify-content:center; min-height:40px; max-width:100%; margin-top:3px; padding:9px 14px; border:1px solid #d5ac6266; border-radius:9px; background:#ffc45a12; color:#ffcf78; font:750 12px/1.5 system-ui,sans-serif; text-decoration:none; transition:background .2s,border-color .2s; }
.service-detail-card .service-card-disclosure-panel > a:hover { background:#ffc45a24; border-color:#ffd17a; }
.service-detail-card .service-card-disclosure-panel > a:focus-visible { outline:3px solid #ffd17a; outline-offset:3px; }
@media(max-width:760px) {
 .service-detail-card .service-card-disclosure > .service-card-disclosure-panel { padding:15px 13px 13px; border-radius:12px; }
 .service-detail-card .service-card-disclosure-panel p { font-size:12px; line-height:1.65; }
}
@media(prefers-reduced-motion:reduce) {
 .service-card-disclosure > summary,.service-card-disclosure > summary > span,.service-card-disclosure-panel > a { transition:none!important; }
}

/* Additional emergency scenes: one distinct photograph per card. */
.service-cards-emergency .service-card-photo-4,
.service-cards-emergency .service-card-photo-5,
.service-cards-emergency .service-card-photo-6,
.service-cards-emergency .service-card-photo-7 { background-image:url('../img/services/emergency-extra-atlas-v1.webp'); }
.service-cards-emergency .service-card-photo-4 { background-position:0 0; }
.service-cards-emergency .service-card-photo-5 { background-position:100% 0; }
.service-cards-emergency .service-card-photo-6 { background-position:0 100%; }
.service-cards-emergency .service-card-photo-7 { background-position:100% 100%; }

/* Distinct WiFi scenes for extenders and interference analysis. */
.service-cards-wifi .service-card-photo-4,
.service-cards-wifi .service-card-photo-5,
.service-cards-wifi .service-card-photo-6,
.service-cards-wifi .service-card-photo-7 { background-image:url('../img/services/wifi-extra-atlas-v1.webp'); }
.service-cards-wifi .service-card-photo-4 { background-position:0 0; }
.service-cards-wifi .service-card-photo-5 { background-position:100% 0; }
.service-cards-wifi .service-card-photo-6 { background-position:0 100%; }
.service-cards-wifi .service-card-photo-7 { background-position:100% 100%; }

.service-cards-electric .service-card-photo-4 { background-image:url('../img/services/electric-installations-v1.webp'); background-size:cover; background-position:center; }

.service-cards-fans .service-card-photo-4 { background-image:url('../img/services/fans-completed-installation-v1.webp'); background-size:cover; background-position:center; }

.service-cards-plumbing .service-card-photo-4,
.service-cards-plumbing .service-card-photo-5,
.service-cards-plumbing .service-card-photo-6,
.service-cards-plumbing .service-card-photo-7 { background-image:url('../img/services/plumbing-extra-atlas-v1.webp'); background-size:202% 202%; }
.service-cards-plumbing .service-card-photo-4 { background-position:0 0; }
.service-cards-plumbing .service-card-photo-5 { background-position:100% 0; }
.service-cards-plumbing .service-card-photo-6 { background-position:0 100%; }
.service-cards-plumbing .service-card-photo-7 { background-position:100% 100%; }
