/* V10.3: consistent service inventory, helpful tint education, and real opening hours. */
/* Five concise service panels replace an overlong duplicate card list. */
.flow-row{height:clamp(145px,13vw,190px)}
.flow-title{font-size:clamp(38px,5.2vw,70px)}
.flow-sub{font-size:clamp(13px,1vw,15px)}
.services-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 19px;padding:13px 20px}
.services-nav a{white-space:nowrap}
.service-detail-extra{border-top:1px solid rgba(124,139,158,.15)}
.service-detail-extra .detail-copy h2{font-size:clamp(42px,5.8vw,80px)}
/* Tint technology guide — visual comparison, not a fictional product catalog. */
.tint-guide{position:relative;background:#f2f2ee;color:#111922;padding:clamp(82px,9vw,145px) 0 clamp(94px,10vw,155px);overflow:hidden}
.tint-guide::before{content:"";pointer-events:none;position:absolute;inset:-25% -15%;background:radial-gradient(circle at 84% 0%,rgba(7,87,232,.09),transparent 44%)}
.tint-guide>.shell{position:relative;z-index:1}
.tint-guide-heading{display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:32px;margin-bottom:clamp(38px,5vw,74px)}
.tint-guide-heading h2{font-size:clamp(56px,7vw,108px);font-weight:520;letter-spacing:-.02em;line-height:1.07;margin:0}
.tint-guide-heading p{font-size:clamp(16px,1.3vw,19px);color:#59616c;line-height:1.65;max-width:470px;margin:0 0 6px}
.tint-guide-layout{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(18px,2.6vw,42px);align-items:stretch}
.film-column,.shade-column{border:1px solid #d6dce0;min-width:0;background:#fbfbf8;padding:clamp(25px,3vw,46px)}
.shade-column{background:#101a25;color:#f4f7fb;border:1px solid #263648;display:flex;flex-direction:column}
.guide-column-title{font-size:clamp(26px,2.5vw,39px);font-weight:540;line-height:1.15;letter-spacing:-.012em;margin:0 0 12px}
.guide-intro{color:#606a74;line-height:1.7;font-size:15px;max-width:540px;margin:0 0 32px}
.shade-column .guide-intro{color:#afbbc7}
.film-grid{display:grid;gap:12px}
.film-tile{padding:22px 23px 21px;border:1px solid #e2e5e6;background:#f2f3f1;transition:background .25s ease,border-color .25s ease}
.film-tile-feature{background:#e9f0fc;border-color:#c9d9f4}
.film-tile-head{display:flex;align-items:center;gap:12px;margin-bottom:7px}
.film-marker{width:9px;height:9px;background:#0757e8;border-radius:50%;flex:none}
.film-tile h3{font-size:20px;font-weight:580;letter-spacing:0;margin:0}
.film-tile p{color:#58616b;font-size:14px;line-height:1.63;margin:0;max-width:610px}
.shade-preview{background:#0b1118;border:1px solid #324454;overflow:hidden;margin-top:3px}
.shade-preview-glass{height:clamp(158px,14.5vw,220px);position:relative;overflow:hidden;isolation:isolate}
.shade-preview-scene{position:absolute;inset:0;background:linear-gradient(#b4c7d7 0%,#dce3e3 57%,#96a6a8 58%,#78858d 100%)}
.scene-sky{position:absolute;inset:7% auto auto 19%;width:80px;height:80px;border-radius:50%;background:#fff5d1;filter:blur(18px);opacity:.75}
.scene-hill{position:absolute;bottom:0;left:-10%;width:85%;height:65%;clip-path:polygon(0 100%,38% 35%,72% 55%,100% 100%);background:#425a70}
.scene-hill-two{left:40%;width:85%;height:74%;background:#607583;opacity:.95}
.shade-preview-film{position:absolute;inset:0;background:#071019;opacity:.62;transition:opacity .55s cubic-bezier(.22,1,.36,1)}
.shade-preview-data{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:18px 20px;border-top:1px solid #344454}
.shade-preview-data strong{font-size:24px;font-weight:540;white-space:nowrap;letter-spacing:-.015em}
.shade-preview-data span{font-size:13px;line-height:1.5;color:#b7c7d5;max-width:285px}
.shade-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:16px}
.shade-choice{font:inherit;font-weight:600;font-size:15px;line-height:1.2;cursor:pointer;color:#cad7e3;background:#172534;border:1px solid #394b5a;padding:15px 8px;min-height:48px;transition:border-color .18s,background .18s,color .18s}
.shade-choice:hover{background:#203248;color:#fff}
.shade-choice[aria-pressed="true"]{background:#0757e8;border-color:#5b95ff;color:#fff}
.shade-choice:focus-visible{outline:3px solid #9dc7ff;outline-offset:3px}
.shade-disclaimer{color:#b1bfcd;font-size:12px;line-height:1.65;margin:20px 0 18px}
.shade-cta{align-self:flex-start;margin-top:auto}
.guide-availability{color:#69727c;font-size:13px;line-height:1.6;margin:28px 0 0}
.footer-top{grid-template-columns:1.2fr .62fr .95fr}
.footer-hours{padding-top:26px;margin-top:20px;border-top:1px solid rgba(255,255,255,.14)}
.footer-hours-title{font-size:13px!important;font-weight:650!important;letter-spacing:.025em;color:#f0f3f7!important;margin:0 0 12px!important}
.footer-hours dl{margin:0;display:grid;gap:9px}
.footer-hours dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:15px}
.footer-hours dt,.footer-hours dd{font-size:13px;line-height:1.55;color:#c7d1da;margin:0}
.footer-hours dd{text-align:right;color:#fff}
@media(max-width:1100px){.tint-guide-layout{grid-template-columns:1fr 1fr}.shade-preview-data{display:block}.shade-preview-data span{display:block;margin-top:7px}}
@media(max-width:820px){.tint-guide-heading,.tint-guide-layout{grid-template-columns:1fr}.tint-guide-heading{gap:16px}.tint-guide-heading h2{font-size:clamp(52px,10vw,82px)}.tint-guide-heading p{max-width:650px}.film-column,.shade-column{padding:28px}.shade-preview-data{display:flex}.shade-preview-data span{margin:0}.flow-row{height:144px}.flow-title{font-size:clamp(32px,5.7vw,50px)}.footer-top{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.tint-guide{padding:78px 0 92px}.tint-guide-heading{margin-bottom:31px}.tint-guide-heading h2{font-size:clamp(50px,11.5vw,67px)}.tint-guide-heading p{font-size:15px}.film-column,.shade-column{padding:22px 18px}.guide-intro{font-size:14px;margin-bottom:22px}.film-tile{padding:19px 18px}.film-tile h3{font-size:18px}.shade-preview-data{display:block}.shade-preview-data span{margin:6px 0 0}.shade-options{gap:6px}.shade-choice{font-size:13px;min-height:47px}.flow-row{height:133px}.flow-title{font-size:clamp(28px,7.8vw,39px)}.flow-sub{font-size:12px}.footer-top{grid-template-columns:1fr}.footer-hours dl>div{max-width:390px}}
@media(prefers-reduced-motion:reduce){.shade-preview-film,.shade-choice,.film-tile{transition:none!important}}

#tint-guide{scroll-margin-top:95px}
