img:is([sizes=auto i],[sizes^="auto," i]){contain-intrinsic-size:3000px 1500px}:root{--wp--preset--aspect-ratio--square:1;--wp--preset--aspect-ratio--4-3:4/3;--wp--preset--aspect-ratio--3-4:3/4;--wp--preset--aspect-ratio--3-2:3/2;--wp--preset--aspect-ratio--2-3:2/3;--wp--preset--aspect-ratio--16-9:16/9;--wp--preset--aspect-ratio--9-16:9/16;--wp--preset--color--black:#000000;--wp--preset--color--cyan-bluish-gray:#abb8c3;--wp--preset--color--white:#ffffff;--wp--preset--color--pale-pink:#f78da7;--wp--preset--color--vivid-red:#cf2e2e;--wp--preset--color--luminous-vivid-orange:#ff6900;--wp--preset--color--luminous-vivid-amber:#fcb900;--wp--preset--color--light-green-cyan:#7bdcb5;--wp--preset--color--vivid-green-cyan:#00d084;--wp--preset--color--pale-cyan-blue:#8ed1fc;--wp--preset--color--vivid-cyan-blue:#0693e3;--wp--preset--color--vivid-purple:#9b51e0;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple:linear-gradient(135deg,rgb(6,147,227) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan:linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange:linear-gradient(135deg,rgb(252,185,0) 0%,rgb(255,105,0) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red:linear-gradient(135deg,rgb(255,105,0) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray:linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum:linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple:linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux:linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk:linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean:linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass:linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight:linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small:13px;--wp--preset--font-size--medium:20px;--wp--preset--font-size--large:36px;--wp--preset--font-size--x-large:42px;--wp--preset--spacing--20:0.44rem;--wp--preset--spacing--30:0.67rem;--wp--preset--spacing--40:1rem;--wp--preset--spacing--50:1.5rem;--wp--preset--spacing--60:2.25rem;--wp--preset--spacing--70:3.38rem;--wp--preset--spacing--80:5.06rem;--wp--preset--shadow--natural:6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep:12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp:6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined:6px 6px 0px -3px rgb(255, 255, 255), 6px 6px rgb(0, 0, 0);--wp--preset--shadow--crisp:6px 6px 0px rgb(0, 0, 0)}:where(body){margin:0}:where(.is-layout-flex){gap:.5em}:where(.is-layout-grid){gap:.5em}body .is-layout-flex{display:flex}.is-layout-flex{flex-wrap:wrap;align-items:center}.is-layout-flex>:is(*,div){margin:0}body .is-layout-grid{display:grid}.is-layout-grid>:is(*,div){margin:0}body{padding-top:0;padding-right:0;padding-bottom:0;padding-left:0}:root :where(.wp-element-button,.wp-block-button__link){background-color:#32373c;border-width:0;color:#fff;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;padding-top:calc(0.667em + 2px);padding-right:calc(1.333em + 2px);padding-bottom:calc(0.667em + 2px);padding-left:calc(1.333em + 2px);text-decoration:none;text-transform:inherit}.has-black-color{color:var(--wp--preset--color--black)!important}.has-cyan-bluish-gray-color{color:var(--wp--preset--color--cyan-bluish-gray)!important}.has-white-color{color:var(--wp--preset--color--white)!important}.has-pale-pink-color{color:var(--wp--preset--color--pale-pink)!important}.has-vivid-red-color{color:var(--wp--preset--color--vivid-red)!important}.has-luminous-vivid-orange-color{color:var(--wp--preset--color--luminous-vivid-orange)!important}.has-luminous-vivid-amber-color{color:var(--wp--preset--color--luminous-vivid-amber)!important}.has-light-green-cyan-color{color:var(--wp--preset--color--light-green-cyan)!important}.has-vivid-green-cyan-color{color:var(--wp--preset--color--vivid-green-cyan)!important}.has-pale-cyan-blue-color{color:var(--wp--preset--color--pale-cyan-blue)!important}.has-vivid-cyan-blue-color{color:var(--wp--preset--color--vivid-cyan-blue)!important}.has-vivid-purple-color{color:var(--wp--preset--color--vivid-purple)!important}.has-black-background-color{background-color:var(--wp--preset--color--black)!important}.has-cyan-bluish-gray-background-color{background-color:var(--wp--preset--color--cyan-bluish-gray)!important}.has-white-background-color{background-color:var(--wp--preset--color--white)!important}.has-pale-pink-background-color{background-color:var(--wp--preset--color--pale-pink)!important}.has-vivid-red-background-color{background-color:var(--wp--preset--color--vivid-red)!important}.has-luminous-vivid-orange-background-color{background-color:var(--wp--preset--color--luminous-vivid-orange)!important}.has-luminous-vivid-amber-background-color{background-color:var(--wp--preset--color--luminous-vivid-amber)!important}.has-light-green-cyan-background-color{background-color:var(--wp--preset--color--light-green-cyan)!important}.has-vivid-green-cyan-background-color{background-color:var(--wp--preset--color--vivid-green-cyan)!important}.has-pale-cyan-blue-background-color{background-color:var(--wp--preset--color--pale-cyan-blue)!important}.has-vivid-cyan-blue-background-color{background-color:var(--wp--preset--color--vivid-cyan-blue)!important}.has-vivid-purple-background-color{background-color:var(--wp--preset--color--vivid-purple)!important}.has-black-border-color{border-color:var(--wp--preset--color--black)!important}.has-cyan-bluish-gray-border-color{border-color:var(--wp--preset--color--cyan-bluish-gray)!important}.has-white-border-color{border-color:var(--wp--preset--color--white)!important}.has-pale-pink-border-color{border-color:var(--wp--preset--color--pale-pink)!important}.has-vivid-red-border-color{border-color:var(--wp--preset--color--vivid-red)!important}.has-luminous-vivid-orange-border-color{border-color:var(--wp--preset--color--luminous-vivid-orange)!important}.has-luminous-vivid-amber-border-color{border-color:var(--wp--preset--color--luminous-vivid-amber)!important}.has-light-green-cyan-border-color{border-color:var(--wp--preset--color--light-green-cyan)!important}.has-vivid-green-cyan-border-color{border-color:var(--wp--preset--color--vivid-green-cyan)!important}.has-pale-cyan-blue-border-color{border-color:var(--wp--preset--color--pale-cyan-blue)!important}.has-vivid-cyan-blue-border-color{border-color:var(--wp--preset--color--vivid-cyan-blue)!important}.has-vivid-purple-border-color{border-color:var(--wp--preset--color--vivid-purple)!important}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background:var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple)!important}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background:var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan)!important}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background:var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange)!important}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background:var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red)!important}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background:var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray)!important}.has-cool-to-warm-spectrum-gradient-background{background:var(--wp--preset--gradient--cool-to-warm-spectrum)!important}.has-blush-light-purple-gradient-background{background:var(--wp--preset--gradient--blush-light-purple)!important}.has-blush-bordeaux-gradient-background{background:var(--wp--preset--gradient--blush-bordeaux)!important}.has-luminous-dusk-gradient-background{background:var(--wp--preset--gradient--luminous-dusk)!important}.has-pale-ocean-gradient-background{background:var(--wp--preset--gradient--pale-ocean)!important}.has-electric-grass-gradient-background{background:var(--wp--preset--gradient--electric-grass)!important}.has-midnight-gradient-background{background:var(--wp--preset--gradient--midnight)!important}.has-small-font-size{font-size:var(--wp--preset--font-size--small)!important}.has-medium-font-size{font-size:var(--wp--preset--font-size--medium)!important}.has-large-font-size{font-size:var(--wp--preset--font-size--large)!important}.has-x-large-font-size{font-size:var(--wp--preset--font-size--x-large)!important}:root{--bg-primary:#FFFFFF;--bg-secondary:#F6F7F8;--bg-card:#FFFFFF;--bg-card-hover:#FAFAF9;--gold:#C25205;--gold-hover:#AB4009;--gold-soft:rgba(249, 115, 22, 0.10);--text:#292524;--text-muted:#57534E;--text-hint:#8A837C;--border:rgba(41, 37, 36, 0.10);--border-strong:rgba(41, 37, 36, 0.18);--whatsapp:#25D366;--whatsapp-hover:#1da851;--overlay:rgba(255, 255, 255, 0.90);--success:#1D9E75;--danger:#E24B4A;--font-heading:'Heebo', 'Assistant', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--font-body:'Rubik', 'Heebo', 'Assistant', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:18px;--text-xl:20px;--text-2xl:clamp(22px, 4vw, 28px);--text-3xl:clamp(26px, 5vw, 36px);--text-4xl:clamp(30px, 6.5vw, 48px);--text-5xl:clamp(36px, 8vw, 56px);--lh-tight:1.15;--lh-snug:1.3;--lh-base:1.6;--lh-loose:1.75;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--section-py:clamp(56px, 9vw, 112px);--section-px:20px;--container-max:1120px;--container-px:20px;--radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px;--shadow-sm:0 1px 2px rgba(41, 37, 36, 0.06);--shadow-md:0 4px 14px rgba(41, 37, 36, 0.08);--shadow-lg:0 14px 36px rgba(41, 37, 36, 0.12);--shadow-gold:0 8px 24px rgba(212, 160, 23, 0.32);--t-fast:120ms ease;--t-base:200ms ease;--t-slow:320ms ease;--z-base:1;--z-sticky:100;--z-nav:200;--z-overlay:800;--z-modal:900;--cta-height:56px;--cta-height-lg:64px;--nav-height:64px;--tap-min:44px}*,*::before,*::after{box-sizing:border-box}*{margin:0;padding:0}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--nav-height)}body{font-family:var(--font-body);font-size:var(--text-base);line-height:var(--lh-base);color:var(--text);background:var(--bg-primary);direction:rtl;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow-x:hidden}img,picture,video,svg{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none;transition:color var(--t-fast),opacity var(--t-fast)}a:hover,a:focus-visible{color:var(--gold)}button{font:inherit;color:inherit;cursor:pointer;background:#fff0;border:none}ul,ol{list-style:none}input,textarea,select,button{font-family:inherit;color:inherit}:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:var(--radius-sm)}::selection{background:var(--gold);color:var(--bg-primary)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);line-height:var(--lh-tight);font-weight:700;color:var(--text);letter-spacing:-.01em}.section-title,.why-card h3,.step-body h3,.review-card,.faq-q span{color:var(--text)!important}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl);font-weight:500}h5{font-size:var(--text-lg);font-weight:500}h6{font-size:var(--text-base);font-weight:500}p{color:var(--text-muted);font-size:var(--text-base);line-height:var(--lh-base)}p strong,p b{color:var(--text);font-weight:500}small,.text-sm{font-size:var(--text-sm)}.text-xs{font-size:var(--text-xs)}.text-lg{font-size:var(--text-lg)}.text-xl{font-size:var(--text-xl)}.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-px)}.section{padding-block:var(--section-py)}.section-tight{padding-block:calc(var(--section-py) * 0.6)}.section-dark{background:var(--bg-primary)}.section-darker{background:#050505}.section-card{background:var(--bg-secondary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--cta-height);padding:0 var(--space-5);border-radius:var(--radius-md);font-family:var(--font-heading);font-weight:700;font-size:var(--text-lg);line-height:1;text-decoration:none;transition:transform var(--t-fast),box-shadow var(--t-fast),background var(--t-fast),color var(--t-fast);white-space:nowrap;user-select:none;-webkit-tap-highlight-color:#fff0}.btn:active{transform:translateY(1px)}.btn:hover,.btn:focus-visible{color:inherit}.btn-gold{background:var(--gold);color:var(--bg-primary);box-shadow:var(--shadow-gold)}.btn-gold:hover,.btn-gold:focus-visible{background:var(--gold-hover);color:var(--bg-primary);transform:translateY(-1px);box-shadow:0 10px 28px rgb(240 180 41 / .4)}.btn-wa{background:var(--whatsapp);color:#fff}.btn-wa:hover,.btn-wa:focus-visible{background:var(--whatsapp-hover);color:#fff}.btn-ghost{background:#fff0;color:var(--text);border:1px solid var(--border-strong)}.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--gold);color:var(--gold)}.btn-lg{min-height:var(--cta-height-lg);font-size:20px;padding:0 var(--space-6)}.btn-sm{min-height:40px;font-size:var(--text-sm);padding:0 var(--space-4)}.btn-block{width:100%}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);transition:border-color var(--t-base),transform var(--t-base)}.card:hover{border-color:var(--border-strong)}.card-link{display:block;color:inherit}.card-link:hover{transform:translateY(-2px);color:inherit}.badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:6px 14px;border-radius:var(--radius-pill);background:var(--gold-soft);color:var(--gold);font-size:var(--text-sm);font-weight:500;font-family:var(--font-heading)}.badge-success{background:rgb(29 158 117 / .16);color:var(--success)}.badge-live::before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor;animation:locksmithil-pulse 1.8s infinite}@keyframes locksmithil-pulse{0%{box-shadow:0 0 0 0 rgb(29 158 117 / .6)}70%{box-shadow:0 0 0 10px #fff0}100%{box-shadow:0 0 0 0 #fff0}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.text-muted{color:var(--text-muted)}.text-hint{color:var(--text-hint)}.text-gold{color:var(--gold)}.text-white{color:var(--text)}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}.flex{display:flex}.flex-col{display:flex;flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-5{gap:var(--space-5)}.grid{display:grid}.mt-1{margin-top:var(--space-1)}.mt-2{margin-top:var(--space-2)}.mt-3{margin-top:var(--space-3)}.mt-4{margin-top:var(--space-4)}.mt-5{margin-top:var(--space-5)}.mt-6{margin-top:var(--space-6)}.mb-1{margin-bottom:var(--space-1)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.mb-5{margin-bottom:var(--space-5)}.mb-6{margin-bottom:var(--space-6)}.hidden{display:none!important}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}@media (min-width:768px){:root{--container-px:32px;--section-px:32px}body{font-size:16.5px}.hidden-desktop{display:none!important}}@media (min-width:1024px){:root{--container-px:40px}body{font-size:17px}}@media (max-width:767px){.hidden-mobile{display:none!important}}.site-header{position:fixed;top:0;left:0;right:0;z-index:var(--z-nav);height:var(--nav-height);background:#FFF;box-shadow:0 1px 0 var(--border)}.header-inner{display:flex;align-items:center;justify-content:space-between;height:100%;gap:var(--space-4)}.site-logo{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-heading);font-weight:700;font-size:20px;letter-spacing:-.02em;flex-shrink:0}.site-header .site-logo{color:var(--text)}.site-header .site-logo:hover{color:var(--gold)}.logo-icon{flex-shrink:0}.desktop-nav{display:flex;align-items:center;gap:var(--space-5);flex:1;justify-content:center}.desktop-nav a{font-family:var(--font-heading);font-size:var(--text-sm);font-weight:500;transition:color var(--t-fast)}.site-header .desktop-nav a{color:var(--text-muted)}.site-header .desktop-nav a:hover{color:var(--text)}.header-cta{min-height:40px;font-size:14px}.site-main{padding-top:var(--nav-height)}body.menu-open{overflow:hidden}.hero{position:relative;min-height:calc(100svh - var(--nav-height));display:flex;align-items:center;background-size:cover;background-position:center;background-repeat:no-repeat;padding-block:var(--space-9) var(--space-8)}.hero-overlay{position:absolute;inset:0;background:var(--overlay)}.hero-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-5)}.hero-heading{font-size:var(--text-5xl);font-weight:700;line-height:var(--lh-tight);text-shadow:none;max-width:760px}.hero h1.hero-heading{color:var(--text)}.hero-sub{font-size:var(--text-xl);color:var(--text-muted);font-family:var(--font-heading);font-weight:500;margin-top:calc(-1 * var(--space-3))}.hero-cta{font-size:20px;min-height:var(--cta-height-lg);padding:0 var(--space-7);box-shadow:0 10px 26px rgb(249 115 22 / .32)}.trust-bar{display:flex;justify-content:center;gap:24px;padding:16px 0;margin-top:var(--space-4)}.trust-item{display:flex;flex-direction:column;align-items:center;gap:4px;border:1px solid rgb(41 37 36 / .12);border-radius:12px;padding:10px 16px;background:rgb(255 255 255 / .85)}.trust-item .icon{font-size:22px;line-height:1}.trust-item .label{font-size:12px;color:var(--text-muted);text-align:center;font-family:var(--font-heading);font-weight:500}.section-title{font-size:var(--text-3xl);margin-bottom:var(--space-6)}.section-sub{color:var(--text-muted);font-size:var(--text-lg);margin-top:calc(-1 * var(--space-5));margin-bottom:var(--space-6)}.services-strip{padding-block:var(--space-8)}.services-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-3)}.service-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-5) var(--space-3);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;transition:border-color var(--t-base),transform var(--t-base),background var(--t-base)}.service-card:hover{border-color:var(--gold);background:var(--bg-card-hover);transform:translateY(-3px);color:var(--gold)}.service-icon{font-size:32px;line-height:1}.service-name{font-family:var(--font-heading);font-size:var(--text-sm);font-weight:500;color:var(--text)}.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}.why-card{padding:var(--space-6);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;transition:border-color var(--t-base)}.why-card:hover{border-color:var(--gold-soft)}.why-icon{display:block;font-size:40px;margin-bottom:var(--space-4)}.why-card h3{font-size:var(--text-xl);margin-bottom:var(--space-3)}.why-card p{font-size:var(--text-sm)}.steps-timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);counter-reset:steps;position:relative}.steps-timeline::before{content:'';position:absolute;top:28px;right:calc(33% + var(--space-4));left:calc(33% + var(--space-4));height:2px;background:linear-gradient(to left,var(--gold),var(--border))}.step{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-4);padding:var(--space-5)}.step-num{width:56px;height:56px;border-radius:50%;background:var(--gold);color:var(--bg-primary);font-family:var(--font-heading);font-weight:700;font-size:var(--text-xl);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--shadow-gold);position:relative;z-index:1}.step-body h3{font-size:var(--text-xl);margin-bottom:var(--space-2)}.step-body p{font-size:var(--text-sm)}.cities-grid{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:center;margin-top:var(--space-2)}.city-link{padding:8px 16px;border:1px solid var(--border);border-radius:var(--radius-pill);font-size:var(--text-sm);font-family:var(--font-heading);color:var(--text-muted);transition:border-color var(--t-fast),color var(--t-fast),background var(--t-fast);white-space:nowrap}.city-link:hover{border-color:var(--gold);color:var(--gold);background:var(--gold-soft)}.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}.review-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-4);transition:border-color var(--t-base)}.review-card:hover{border-color:var(--gold)}.review-stars{color:var(--gold);font-size:var(--text-xl);letter-spacing:2px}.review-text p{font-size:var(--text-base);color:var(--text);font-style:italic;line-height:var(--lh-loose)}.review-author{font-size:var(--text-sm);color:var(--text-muted)}.review-author strong{color:var(--text)}.faq-container{max-width:760px}.faq-list{display:flex;flex-direction:column;gap:var(--space-2)}.faq-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;transition:border-color var(--t-base)}.faq-item.is-open,.faq-item:hover{border-color:var(--border-strong)}.faq-item.is-open{border-color:var(--gold)}.faq-q{display:flex;justify-content:space-between;align-items:center;padding:var(--space-5);cursor:pointer;font-family:var(--font-heading);font-weight:500;font-size:var(--text-lg);color:var(--text);user-select:none;-webkit-tap-highlight-color:#fff0;list-style:none}.faq-q::-webkit-details-marker{display:none}.faq-icon{font-size:22px;color:var(--gold);line-height:1;transition:transform var(--t-base);flex-shrink:0;margin-inline-start:var(--space-3)}.faq-item.is-open .faq-icon{transform:rotate(45deg)}.faq-a{max-height:0;overflow:hidden;transition:max-height 300ms ease}.faq-a>div{padding:0 var(--space-5) var(--space-5)}.faq-a p{font-size:var(--text-base)}.site-footer{background:var(--bg-secondary);border-top:1px solid var(--border);padding-top:var(--space-8)}.footer-inner{display:grid;grid-template-columns:1.4fr 2fr;gap:var(--space-7);padding-bottom:var(--space-7)}.footer-brand{display:flex;flex-direction:column;gap:var(--space-4)}.footer-logo{font-size:18px}.footer-tagline{color:var(--text-muted);font-size:var(--text-sm);margin-top:calc(-1 * var(--space-2))}.footer-contact-btns{display:flex;gap:var(--space-2);flex-wrap:wrap}.footer-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}.footer-nav-heading{font-size:var(--text-sm);font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--space-3)}.footer-nav ul{display:flex;flex-direction:column;gap:var(--space-2)}.footer-nav a{font-size:var(--text-sm);color:var(--text-muted)}.footer-nav a:hover{color:var(--text)}.footer-bottom{border-top:1px solid var(--border);padding-block:var(--space-4)}.footer-bottom-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3)}.footer-copy,.footer-legal{font-size:var(--text-xs);color:var(--text-hint)}.footer-legal{display:flex;gap:var(--space-4)}.footer-legal a{color:var(--text-hint)}.footer-legal a:hover{color:var(--text-muted)}@media (min-width:768px) and (max-width:1023px){.services-grid{grid-template-columns:repeat(3,1fr)}.reviews-grid{grid-template-columns:repeat(2,1fr)}.footer-inner{grid-template-columns:1fr}.footer-nav{grid-template-columns:repeat(3,1fr)}}@media (max-width:767px){.hero{min-height:92svh;padding-block:var(--space-7) var(--space-6)}.hero-heading{font-size:clamp(28px, 9vw, 38px)}.hero-sub{font-size:var(--text-base)}.hero-cta{width:100%;font-size:18px;min-height:var(--cta-height);padding:0 var(--space-5)}.services-strip .container{padding-inline:0}.services-grid{grid-template-columns:repeat(5,160px);overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-inline:var(--container-px);gap:var(--space-3);scrollbar-width:none}.services-grid::-webkit-scrollbar{display:none}.service-card{scroll-snap-align:start;min-width:0}.why-grid{grid-template-columns:1fr;gap:var(--space-4)}.why-card{text-align:right;padding:var(--space-5)}.why-icon{display:inline;font-size:26px;margin-bottom:0;margin-inline-end:var(--space-2)}.steps-timeline{grid-template-columns:1fr;gap:0}.steps-timeline::before{display:none}.step{flex-direction:row;text-align:right;align-items:flex-start;padding:var(--space-4) var(--space-4) var(--space-4) 0;border-bottom:1px solid var(--border);gap:var(--space-4)}.step:last-child{border-bottom:none}.step-num{width:44px;height:44px;font-size:var(--text-base);flex-shrink:0}.step-body h3{font-size:var(--text-lg)}.reviews-grid{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr;gap:var(--space-6)}.footer-nav{grid-template-columns:repeat(2,1fr);gap:var(--space-4)}.footer-bottom-inner{justify-content:center;text-align:center}}.breadcrumb-nav{background:var(--bg-secondary);border-bottom:1px solid var(--border);padding-block:var(--space-3)}.breadcrumb{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;list-style:none;font-size:var(--text-sm);color:var(--text-muted)}.breadcrumb a{color:var(--text-muted)}.breadcrumb a:hover{color:var(--text)}.breadcrumb-sep{color:var(--text-hint)}.city-hero{padding-block:var(--space-9) var(--space-8);text-align:center}.city-hero-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-5)}.city-h1{font-size:var(--text-4xl);font-weight:700;color:var(--text)!important;line-height:var(--lh-tight);max-width:800px}.city-intro{font-size:var(--text-lg);color:var(--text-muted);max-width:680px;line-height:var(--lh-base)}.city-cta{font-size:20px;min-height:var(--cta-height-lg);padding:0 var(--space-7);box-shadow:0 10px 26px rgb(249 115 22 / .32)}.city-stats{display:flex;gap:var(--space-6);justify-content:center;flex-wrap:wrap;margin-top:var(--space-4)}.city-stat{display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.city-stat-icon{font-size:28px;line-height:1}.city-stat-value{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:700;color:var(--gold)}.city-stat-label{font-size:var(--text-xs);color:var(--text-muted)}.city-services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-6)}.city-service-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;transition:border-color var(--t-base),transform var(--t-base)}.city-service-card:hover{border-color:var(--gold);transform:translateY(-2px)}.city-service-card .service-icon{display:block;font-size:40px;margin-bottom:var(--space-4)}.city-service-card h3{font-size:var(--text-lg);color:var(--text)!important;margin-bottom:var(--space-3)}.city-service-card p{font-size:var(--text-sm);color:var(--text-muted);line-height:var(--lh-base)}.hoods-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3);margin-top:var(--space-6)}.hood-item{display:flex;align-items:center;gap:var(--space-2);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--text-muted)}.hood-icon{font-size:16px;flex-shrink:0}.nearby-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-top:var(--space-6)}.nearby-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);text-align:center;transition:border-color var(--t-base);color:var(--text)}.nearby-card:hover{border-color:var(--gold);color:var(--text)}.nearby-icon{font-size:28px}.nearby-name{font-size:var(--text-sm);font-weight:500;color:var(--text)}.nearby-time{font-size:var(--text-xs);color:var(--gold)}.city-bottom-cta{padding-block:var(--space-8)}.cta-group{display:flex;gap:var(--space-4);justify-content:center;flex-wrap:wrap;margin-top:var(--space-5)}@media (max-width:767px){.city-h1{font-size:clamp(26px, 8vw, 36px)}.city-intro{font-size:var(--text-base)}.city-cta{width:100%;font-size:18px}.city-stats{gap:var(--space-4)}.city-services-grid{grid-template-columns:1fr}.hoods-grid{grid-template-columns:repeat(2,1fr)}.nearby-grid{grid-template-columns:repeat(2,1fr)}.cta-group .btn{width:100%}}.service-hero{padding-block:var(--space-10) var(--space-8)}.service-hero-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-5);max-width:820px;margin-inline:auto}.service-hero-icon{font-size:60px;line-height:1}.service-h1{font-family:var(--font-heading);font-size:var(--text-4xl);font-weight:700;color:var(--text)!important;line-height:var(--lh-tight);margin:0}.service-intro{font-size:var(--text-lg);color:var(--text-muted);line-height:var(--lh-loose);max-width:700px}.service-cta{min-width:260px}.service-features{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3) var(--space-5);margin-top:var(--space-2)}.service-feature-item{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-muted)}.feature-check{color:var(--gold);font-size:var(--text-base);font-weight:700;flex-shrink:0}.service-process{padding-block:var(--space-9)}.process-steps{display:flex;flex-direction:column;gap:var(--space-6);margin-top:var(--space-7);max-width:760px;margin-inline:auto}.process-step{display:flex;gap:var(--space-5);align-items:flex-start}.process-num{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:var(--gold);color:#000;font-family:var(--font-heading);font-size:var(--text-lg);font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}.process-content{flex:1}.process-title{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-2)}.process-desc{font-size:var(--text-sm);color:var(--text-muted);line-height:var(--lh-base);margin:0}.service-bottom-cta{padding-block:var(--space-8)}@media (max-width:767px){.service-h1{font-size:clamp(24px, 7.5vw, 34px)}.service-intro{font-size:var(--text-base)}.service-cta{width:100%}.process-step{flex-direction:column;align-items:flex-start;gap:var(--space-3)}.service-features{flex-direction:column;align-items:flex-start;gap:var(--space-2);padding-inline:var(--space-2)}}.areas-hero{padding-block:var(--space-10) var(--space-8)}.areas-hero-inner{max-width:760px;margin-inline:auto;display:flex;flex-direction:column;align-items:center;gap:var(--space-5)}.areas-h1{font-family:var(--font-heading);font-size:var(--text-4xl);font-weight:700;color:var(--text)!important;line-height:var(--lh-tight);margin:0}.areas-intro{font-size:var(--text-lg);color:var(--text-muted);line-height:var(--lh-loose);max-width:680px}.areas-cta{min-width:260px}.areas-grid-section{padding-block:var(--space-9)}.areas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-top:var(--space-7)}.area-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5) var(--space-4);text-align:center;transition:border-color var(--t-base),background var(--t-base);color:var(--text);text-decoration:none}.area-card:hover{border-color:var(--gold);background:var(--bg-card-hover);color:var(--text)}.area-icon{font-size:28px}.area-name{font-size:var(--text-sm);font-weight:600;color:var(--text)}.area-time{font-size:var(--text-xs);color:var(--gold)}.areas-why{padding-block:var(--space-9)}.areas-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-5);margin-top:var(--space-7)}.why-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center}.why-icon{font-size:40px;display:block;margin-bottom:var(--space-3)}.why-card h3{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-3)}.why-card p{font-size:var(--text-sm);color:var(--text-muted);line-height:var(--lh-base);margin:0}.areas-bottom-cta{padding-block:var(--space-8)}@media (max-width:767px){.areas-h1{font-size:clamp(24px, 7.5vw, 34px)}.areas-intro{font-size:var(--text-base)}.areas-cta{width:100%}.areas-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.areas-why-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-4)}}.services-hub-hero{padding-block:var(--space-10) var(--space-8)}.services-hub-inner{max-width:760px;margin-inline:auto;display:flex;flex-direction:column;align-items:center;gap:var(--space-5);text-align:center}.services-hub-h1{font-family:var(--font-heading);font-size:var(--text-4xl);font-weight:700;color:var(--text)!important;line-height:var(--lh-tight);margin:0}.services-hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);margin-top:var(--space-7)}.service-hub-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-7) var(--space-5);text-align:center;transition:border-color var(--t-base),background var(--t-base);color:var(--text);text-decoration:none}.service-hub-card:hover{border-color:var(--gold);background:var(--bg-card-hover);color:var(--text)}.service-hub-icon{font-size:48px}.service-hub-name{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:700;color:var(--text);margin:0}.service-hub-desc{font-size:var(--text-sm);color:var(--text-muted);line-height:var(--lh-base);margin:0}.service-hub-link{color:var(--gold);font-size:var(--text-sm);font-weight:600;margin-top:auto}@media (max-width:767px){.services-hub-h1{font-size:clamp(24px, 7.5vw, 34px)}.services-hub-grid{grid-template-columns:1fr;gap:var(--space-4)}}.blog-archive-hero{padding-block:var(--space-9) var(--space-7)}.blog-archive-h1{font-family:var(--font-heading);font-size:var(--text-4xl);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-3)}.blog-archive-sub{font-size:var(--text-lg);color:var(--text-muted);max-width:640px;margin:0 auto}.blog-archive-section{padding-block:var(--space-9)}.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);margin-top:var(--space-6)}.blog-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:border-color var(--t-base)}.blog-card:hover{border-color:var(--gold)}.blog-card-inner{display:block;padding:var(--space-6);text-decoration:none;color:var(--text);height:100%}.blog-card-body{display:flex;flex-direction:column;gap:var(--space-3)}.blog-card-title{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:700;color:var(--text)!important;margin:0;line-height:var(--lh-snug)}.blog-card-excerpt{font-size:var(--text-sm);color:var(--text-muted);line-height:var(--lh-base);margin:0;flex:1}.blog-card-meta{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-xs);color:var(--text-hint);margin-top:var(--space-2)}.blog-card-read{color:var(--gold);font-weight:600}.nav-links{display:flex;gap:var(--space-2);justify-content:center;margin-top:var(--space-8)}.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-muted);font-size:var(--text-sm);text-decoration:none;transition:border-color var(--t-base);padding-inline:var(--space-3)}.page-numbers:hover{border-color:var(--gold);color:var(--gold)}.page-numbers.current{border-color:var(--gold);color:var(--gold);font-weight:700;border-width:2px}@media (max-width:767px){.blog-archive-h1{font-size:clamp(22px, 7vw, 32px)}.blog-grid{grid-template-columns:1fr;gap:var(--space-4)}}@media (min-width:768px) and (max-width:1023px){.blog-grid{grid-template-columns:repeat(2,1fr)}}.article-hero{padding-block:var(--space-9) var(--space-7)}.article-hero-inner{max-width:800px;margin-inline:auto;text-align:center}.article-cat-badge{display:inline-block;background:var(--gold-soft);color:var(--gold);border:1px solid rgb(212 160 23 / .3);border-radius:100px;font-size:var(--text-xs);font-weight:600;padding:4px 12px;margin-bottom:var(--space-4);text-decoration:none}.article-title{font-family:var(--font-heading);font-size:clamp(26px, 5vw, 44px);font-weight:700;color:var(--text)!important;line-height:var(--lh-tight);margin:0 0 var(--space-4)}.article-meta{display:flex;align-items:center;justify-content:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--text-muted)}.article-meta-sep{opacity:.4}.article-body{padding-block:var(--space-9);background:var(--bg-secondary)}.article-layout{display:grid;grid-template-columns:1fr 280px;gap:var(--space-8);align-items:start}.article-content{min-width:0;font-size:var(--text-base);line-height:var(--lh-loose);color:var(--text-muted)}.article-content h2{font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:700;color:var(--text)!important;margin:var(--space-8) 0 var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--border)}.article-content h3{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:700;color:var(--text)!important;margin:var(--space-6) 0 var(--space-3)}.article-content p{margin:0 0 var(--space-4)}.article-content ul,.article-content ol{margin:0 0 var(--space-4);padding-right:var(--space-5)}.article-content li{margin-bottom:var(--space-2)}.article-content a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}.article-content a:hover{color:var(--gold-hover)}.article-content strong{color:var(--text);font-weight:600}.article-cta-box{background:linear-gradient(135deg,var(--bg-card),#111);border:1px solid rgb(212 160 23 / .35);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;margin:var(--space-8) 0}.article-cta-box .btn-gold{font-size:var(--text-lg);padding:14px 28px}.article-sidebar{position:sticky;top:calc(var(--space-6) + 70px);display:flex;flex-direction:column;gap:var(--space-4)}.sidebar-cta-card,.sidebar-links-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5)}.sidebar-cta-icon{font-size:36px;text-align:center;display:block;margin-bottom:var(--space-3)}.sidebar-cta-title{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-2);text-align:center}.sidebar-cta-sub{font-size:var(--text-xs);color:var(--text-muted);text-align:center;margin:0 0 var(--space-4)}.sidebar-cta-btn{margin-bottom:var(--space-2);font-size:var(--text-sm)}.sidebar-links-title{font-family:var(--font-heading);font-size:var(--text-base);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-3)}.sidebar-links-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.sidebar-links-list a{font-size:var(--text-sm);color:var(--text-muted);text-decoration:none;display:block;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);transition:background var(--t-base),color var(--t-base)}.sidebar-links-list a:hover{background:var(--bg-card-hover);color:var(--gold)}.article-nav{padding-block:var(--space-6)}.article-nav-inner{display:flex;gap:var(--space-4);justify-content:space-between}.article-nav-item{display:flex;flex-direction:column;gap:var(--space-1);flex:1;max-width:48%;text-decoration:none;padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-card);transition:border-color var(--t-base)}.article-nav-item:hover{border-color:var(--gold)}.article-nav-next{text-align:left;margin-right:auto}.article-nav-label{font-size:var(--text-xs);color:var(--gold);font-weight:600}.article-nav-title{font-size:var(--text-sm);color:var(--text-muted);line-height:var(--lh-snug)}@media (max-width:1023px){.article-layout{grid-template-columns:1fr;gap:var(--space-6)}.article-sidebar{position:static;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}}@media (max-width:767px){.article-title{font-size:clamp(22px, 7vw, 32px)}.article-sidebar{grid-template-columns:1fr}.article-nav-inner{flex-direction:column}.article-nav-item{max-width:100%}}.blog-archive-hero{padding-block:var(--space-9) var(--space-7)}@media (min-width:1024px){.blog-grid{grid-template-columns:repeat(3,1fr)}}.blog-card-badge{display:inline-block;background:var(--gold-soft);color:var(--gold);border:1px solid rgb(212 160 23 / .35);border-radius:100px;font-size:var(--text-xs);font-weight:600;padding:3px 10px;margin-bottom:var(--space-2);line-height:1.6}.blog-card-readtime{font-size:var(--text-xs);color:var(--text-muted)}.blog-card{background:var(--bg-card)!important}.article-content{font-size:17px!important;line-height:1.8!important;color:var(--text-muted)!important;font-family:'Rubik','Heebo',sans-serif}.article-content h2{color:var(--text)!important;border-bottom:none!important;border-right:3px solid #D4A017!important;padding-right:var(--space-4)!important;padding-bottom:0!important;scroll-margin-top:100px}.article-content h3{color:#D4A017!important;scroll-margin-top:100px}.toc-desktop{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5)}.toc-heading{font-family:var(--font-heading);font-size:var(--text-base);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-3);padding-bottom:var(--space-3);border-bottom:1px solid var(--border)}.toc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;counter-reset:toc-counter}.toc-list li{counter-increment:toc-counter}.toc-list a{display:block;font-size:var(--text-sm);color:var(--text-muted);text-decoration:none;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);border-right:2px solid #fff0;transition:background var(--t-base),color var(--t-base),border-color var(--t-base);line-height:var(--lh-snug)}.toc-list a:hover,.toc-list li.toc-active>a{background:var(--gold-soft);color:var(--gold);border-right-color:var(--gold)}.toc-mobile{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:var(--space-6);overflow:hidden}.toc-mobile-toggle{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-5);cursor:pointer;font-family:var(--font-heading);font-size:var(--text-base);font-weight:700;color:var(--text);list-style:none;user-select:none}.toc-mobile-toggle::-webkit-details-marker{display:none}.toc-chevron{transition:transform 0.25s ease;flex-shrink:0;color:var(--gold)}.toc-mobile[open] .toc-chevron{transform:rotate(180deg)}.toc-mobile .toc-list{padding:0 var(--space-4) var(--space-4)}@media (min-width:1024px){.toc-mobile{display:none}}@media (max-width:1023px){.toc-desktop{display:none}}.article-mid-cta{background:linear-gradient(135deg,#111,var(--bg-card));border:2px solid #D4A017;border-radius:var(--radius-lg);padding:var(--space-6) var(--space-5);text-align:center;margin:var(--space-8) 0}.article-mid-cta-headline{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-2)}.article-mid-cta-sub{font-size:var(--text-sm);color:var(--text-muted);margin:0 0 var(--space-5)}.article-mid-cta-btn{font-size:var(--text-base)}.article-related{padding-block:var(--space-8)}.article-related-title{font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-6)}.blog-grid-2{grid-template-columns:repeat(2,1fr)!important}@media (max-width:767px){.blog-grid-2{grid-template-columns:1fr!important}}.sticky-mobile-cta{display:none}@media (max-width:767px){.sticky-mobile-cta{display:grid;grid-template-columns:1fr 1fr;position:fixed;bottom:0;left:0;right:0;z-index:999;background:#0d0d0d;border-top:1px solid rgb(212 160 23 / .4);transform:translateY(100%);transition:transform 0.3s ease}.sticky-mobile-cta.is-visible{transform:translateY(0)}.sticky-mobile-cta-call,.sticky-mobile-cta-wa{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:14px var(--space-3);font-family:var(--font-heading);font-size:15px;font-weight:700;text-decoration:none;text-align:center}.sticky-mobile-cta-call{background:#D4A017;color:#000}.sticky-mobile-cta-wa{background:#25D366;color:#000}body.single .site-main{padding-bottom:60px}}.legal-hero{padding-block:var(--space-9) var(--space-7)}.legal-h1{font-family:var(--font-heading);font-size:clamp(26px, 5vw, 44px);font-weight:700;color:var(--text)!important;margin:0 0 var(--space-3);line-height:var(--lh-tight)}.legal-hero-sub{font-size:var(--text-lg);color:var(--text-muted);margin:0}.legal-body{background:var(--bg-secondary);padding-block:var(--space-9)}.legal-content{max-width:780px;font-size:17px;line-height:1.85;color:var(--text-muted)}.legal-updated{font-size:var(--text-sm);color:var(--text-muted);margin-bottom:var(--space-7);padding-bottom:var(--space-4);border-bottom:1px solid var(--border)}.legal-content h2{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:700;color:var(--text)!important;margin:var(--space-8) 0 var(--space-4);border-right:3px solid var(--gold);padding-right:var(--space-4)}.legal-content h3{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:600;color:var(--gold)!important;margin:var(--space-5) 0 var(--space-3)}.legal-content p{margin:0 0 var(--space-4)}.legal-content ul,.legal-content ol{margin:0 0 var(--space-5);padding-right:var(--space-6)}.legal-content li{margin-bottom:var(--space-2)}.legal-content a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}.legal-content a:hover{color:var(--gold-hover)}.legal-content strong{color:var(--text);font-weight:600}.legal-contact-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-5) var(--space-6);margin:var(--space-5) 0}.legal-contact-box p{margin:0 0 var(--space-2)}.legal-contact-box p:last-child{margin:0}@media (max-width:767px){.legal-content{font-size:16px}.legal-h1{font-size:clamp(22px, 7vw, 32px)}}.footer-legal a{color:var(--text-muted);font-size:var(--text-xs);text-decoration:none}.footer-legal a:hover{color:var(--gold)}.cya11y-menu-btn{left:20px!important;right:auto!important;bottom:80px!important}.cya11y-widget,.cya11y-panel{left:20px!important;right:auto!important}#joinchat,.joinchat,.joinchat__button{display:block!important;visibility:visible!important;opacity:1!important;z-index:9998!important}.joinchat{bottom:90px!important;right:20px!important}@media (max-width:767px){.joinchat{bottom:70px!important}}body{background:var(--bg-primary);color:var(--text)}.site-header .site-logo{color:var(--text)!important}.site-header .desktop-nav a{color:var(--text-muted)}.site-header .desktop-nav a:hover,.site-header .desktop-nav a:focus-visible{color:var(--gold)!important}.hero-overlay{background:linear-gradient(180deg,rgb(255 255 255 / .94) 0%,rgb(255 255 255 / .9) 55%,rgb(255 255 255 / .95) 100%)}.hero h1.hero-heading{color:var(--text)!important}.hero-sub{color:var(--text-muted)}.hero .badge-live{background:#FFF;border:1.5px solid var(--gold);color:var(--text);box-shadow:var(--shadow-sm)}.trust-item{box-shadow:var(--shadow-sm)}.trust-item .label{color:var(--text-muted)!important}.trust-item .value,.trust-item strong{color:var(--text)}.card,.service-card,.city-service-card,.why-card,.blog-card,.service-hub-card,.area-card,.faq-item,.review-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}.card:hover,.service-card:hover,.city-service-card:hover,.why-card:hover,.blog-card:hover,.service-hub-card:hover,.area-card:hover{box-shadow:var(--shadow-md);border-color:rgb(249 115 22 / .35);transform:translateY(-2px)}.btn-gold{background:var(--gold);color:#FFFFFF!important;border:none;font-weight:700;border-radius:10px}.btn-gold:hover,.btn-gold:focus-visible{background:var(--gold-hover);color:#FFFFFF!important}.section-alt,.bg-secondary{background:var(--bg-secondary)}.sticky-mobile-cta{background:#292524!important;border-top:none;box-shadow:0 -6px 18px rgb(41 37 36 / .22)}.sticky-mobile-cta-call{background:var(--gold)!important;color:#FFFFFF!important}.sticky-mobile-cta-wa{background:var(--whatsapp)!important;color:#FFFFFF!important}.site-footer{background:#292524;color:rgb(255 255 255 / .82)}.site-footer a{color:rgb(255 255 255 / .82)}.site-footer a:hover{color:var(--gold)}.site-footer h3,.site-footer h4,.site-footer .footer-heading{color:var(--gold)}.site-footer strong,.site-footer b{color:#FFF}.article-content,.legal-content{color:var(--text-muted)}.article-content strong,.legal-content strong{color:var(--text)}.article-content a,.legal-content a{color:var(--gold-hover)}.faq-q span{color:var(--text)!important}.faq-item{background:var(--bg-card)}::selection{background:rgb(249 115 22 / .22);color:var(--text)}:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.ls-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px, 4vw, 56px);align-items:center}.ls-hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(14px, 2vw, 22px);max-width:620px}.ls-hero-actions{display:flex;flex-wrap:wrap;gap:14px;width:100%}.ls-btn-outline{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;background:var(--bg-primary);color:var(--text);border:1.5px solid var(--border);transition:border-color .2s ease,color .2s ease,background-color .2s ease}.ls-btn-outline:hover,.ls-btn-outline:focus-visible{border-color:var(--gold);color:var(--gold)}.ls-stats-strip{background:#292524;color:#fff}.ls-stats-strip ul{display:grid;grid-template-columns:repeat(4,1fr);margin:0;padding:0;list-style:none}.ls-stat{text-align:center;padding:clamp(22px, 3.2vw, 34px) 16px;font-size:.95rem;line-height:1.4;color:rgb(255 255 255 / .82);border-inline-start:1px solid rgb(255 255 255 / .14)}.ls-stat:first-child{border-inline-start:0}.ls-stat-num{display:block;margin-bottom:6px;font-family:var(--font-heading);font-weight:800;font-size:clamp(2rem, 5vw, 3rem);line-height:1;color:#FB923C}.ls-section-head,.ls-reviews-head{max-width:760px;margin-inline:auto;margin-bottom:clamp(28px, 4vw, 46px)}.ls-section-head.text-center,.ls-reviews-head.text-center{text-align:center}.ls-kicker{display:inline-block;margin-bottom:14px;padding:6px 16px;font-family:var(--font-heading);font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-hover);background:rgb(249 115 22 / .10);border-radius:999px;transform:rotate(-1.5deg)}.ls-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px, 2vw, 22px)}.ls-svc-card{display:flex;align-items:center;gap:14px;padding:16px 18px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);color:var(--text);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.ls-svc-card:hover,.ls-svc-card:focus-visible{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgb(249 115 22 / .35)}.ls-svc-icon{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:13px;background:var(--gold);color:#fff}.ls-svc-icon svg{width:26px;height:26px}.ls-svc-name{font-family:var(--font-heading);font-weight:700;font-size:1.05rem;line-height:1.25}.ls-detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px, 2vw, 24px)}.ls-detail-card{padding:clamp(22px, 2.5vw, 28px);background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.ls-detail-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgb(249 115 22 / .35)}.ls-detail-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}.ls-detail-icon{flex:none;display:grid;place-items:center;width:46px;height:46px;font-size:1.5rem;line-height:1;background:rgb(249 115 22 / .12);border-radius:12px}.ls-detail-card h3{margin:0;font-family:var(--font-heading);font-size:1.2rem;line-height:1.2;color:var(--text)}.ls-detail-card p{margin:0 0 .9em;font-size:.95rem;line-height:1.75;color:var(--text-muted)}.ls-detail-card p:last-child{margin-bottom:0}.ls-incl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px, 2vw, 18px)}.ls-incl-item{display:flex;align-items:flex-start;gap:14px;padding:20px 22px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease}.ls-incl-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.ls-incl-check{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--gold);color:#fff;box-shadow:0 4px 10px -3px rgb(249 115 22 / .5)}.ls-incl-check svg{width:20px;height:20px}.ls-incl-item b{display:block;margin-bottom:3px;font-family:var(--font-heading);font-size:1.1rem;color:var(--text)}.ls-incl-item p{margin:0;font-size:.92rem;line-height:1.55;color:var(--text-muted)}.ls-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(16px, 2vw, 22px);margin:0;padding:0;list-style:none}.ls-step{padding:clamp(22px, 2.5vw, 28px);background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease}.ls-step:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.ls-step-num{display:grid;place-items:center;width:40px;height:40px;margin-bottom:14px;border-radius:50%;background:var(--gold);color:#fff;font-family:var(--font-heading);font-weight:800;font-size:1.2rem;line-height:1;box-shadow:0 4px 10px -3px rgb(249 115 22 / .5)}.ls-step-body h3{margin:0 0 8px;font-family:var(--font-heading);font-size:1.2rem;color:var(--text)}.ls-step-body p{margin:0;font-size:.95rem;line-height:1.7;color:var(--text-muted)}.ls-situations{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px, 2vw, 22px)}.ls-situation-card{padding:clamp(22px, 2.5vw, 28px);background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.ls-situation-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgb(249 115 22 / .35)}.ls-situation-icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:14px;font-size:1.6rem;line-height:1;background:rgb(249 115 22 / .12);border-radius:13px}.ls-situation-card h3{margin:0 0 8px;font-family:var(--font-heading);font-size:1.15rem;color:var(--text)}.ls-situation-card p{margin:0;font-size:.95rem;line-height:1.7;color:var(--text-muted)}.ls-google-badge{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:9px 20px;background:var(--bg-primary);border:1px solid var(--border);border-radius:999px;box-shadow:var(--shadow-sm)}.ls-google-rating{font-family:var(--font-heading);font-weight:800;font-size:1.35rem;line-height:1;color:var(--text)}.ls-review-stars{color:var(--gold);font-size:1rem;line-height:1;letter-spacing:2px}.ls-google-count{font-size:.88rem;color:var(--text-muted)}.ls-review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.ls-review-card{display:flex;flex-direction:column;min-height:210px;padding:22px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease}.ls-review-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.ls-review-card .ls-review-stars{margin-bottom:12px}.ls-review-card blockquote{flex:1;margin:0;font-size:.97rem;line-height:1.65;color:var(--text)}.ls-review-author{display:flex;align-items:center;gap:11px;margin-top:18px;padding-top:15px;border-top:1px solid var(--border)}.ls-review-avatar{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--gold);color:#fff;font-family:var(--font-heading);font-weight:700;font-size:1rem}.ls-review-author strong{display:block;font-family:var(--font-heading);font-size:.95rem;color:var(--text)}.ls-review-when{display:block;font-size:.8rem;color:var(--text-muted)}.ls-article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px, 2vw, 22px)}.ls-article-card{display:flex;flex-direction:column;gap:8px;padding:24px 22px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);color:var(--text);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.ls-article-card:hover,.ls-article-card:focus-visible{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgb(249 115 22 / .35)}.ls-article-cat{align-self:flex-start;padding:4px 12px;font-family:var(--font-heading);font-weight:700;font-size:.72rem;letter-spacing:.04em;color:var(--gold-hover);background:rgb(249 115 22 / .10);border-radius:999px}.ls-article-card b{font-family:var(--font-heading);font-size:1.25rem;line-height:1.25;color:var(--text)}.ls-article-ex{flex:1;font-size:.92rem;line-height:1.6;color:var(--text-muted)}.ls-article-link{display:inline-flex;align-items:center;gap:8px;margin-top:4px;font-family:var(--font-heading);font-weight:700;color:var(--gold);transition:gap .2s ease,color .2s ease}.ls-article-link svg{width:16px;height:16px}.ls-article-card:hover .ls-article-link{gap:12px;color:var(--gold-hover)}.ls-cta-band{padding:clamp(38px, 6vw, 64px) clamp(22px, 5vw, 56px);background:var(--gold);border-radius:20px;text-align:center;color:#fff}.ls-cta-band h2{margin:0 0 12px;font-family:var(--font-heading);font-size:clamp(1.8rem, 4vw, 2.6rem);line-height:1.1;color:#fff!important}.ls-cta-band p{max-width:52ch;margin:0 auto 26px;font-size:1.05rem;line-height:1.6;color:rgb(255 255 255 / .95)}.ls-cta-band .ls-hero-actions{justify-content:center}.ls-cta-band .btn-gold{background:#fff;color:var(--gold-hover)}.ls-cta-band .btn-gold:hover{background:var(--bg-secondary);color:var(--gold-hover)}.ls-contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px, 2vw, 18px)}.ls-contact-card{display:flex;align-items:center;gap:15px;padding:18px 20px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);color:var(--text);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}a.ls-contact-card:hover,a.ls-contact-card:focus-visible{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgb(249 115 22 / .35)}.ls-contact-icon{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:var(--gold);color:#fff}.ls-contact-icon svg{width:22px;height:22px}.ls-contact-card b{display:block;font-family:var(--font-heading);font-size:1.1rem;color:var(--text)}.ls-contact-card span span{display:block;font-size:.92rem;color:var(--text-muted)}.ls-contact-card .ltr{direction:ltr;unicode-bidi:embed}@media (max-width:1000px){.ls-svc-grid,.ls-detail-grid,.ls-incl-grid,.ls-situations,.ls-review-grid,.ls-article-grid,.ls-contact-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:760px){.ls-hero-grid{grid-template-columns:1fr}.ls-stats-strip ul{grid-template-columns:repeat(2,1fr)}.ls-stat{border-inline-start:0}.ls-stat:nth-child(even){border-inline-start:1px solid rgb(255 255 255 / .14)}.ls-stat:nth-child(n+3){border-top:1px solid rgb(255 255 255 / .14)}.ls-svc-grid,.ls-detail-grid,.ls-incl-grid,.ls-situations,.ls-review-grid,.ls-article-grid,.ls-contact-grid{grid-template-columns:1fr}.ls-hero-actions .btn,.ls-cta-band .btn{flex:1 1 100%}}@media (prefers-reduced-motion:reduce){.ls-svc-card,.ls-detail-card,.ls-incl-item,.ls-step,.ls-situation-card,.ls-review-card,.ls-article-card,.ls-contact-card,.ls-btn-outline,.ls-article-link{transition:none}}:root{--ls-swash:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M2 9 C 18 4, 34 11, 52 8 S 88 4, 118 7' fill='none' stroke='%23F97316' stroke-width='6' stroke-linecap='round' opacity='0.95'/%3E%3C/svg%3E");
}

.hero.ls-hero {
	position: relative;
	isolation: isolate;
	background: #FFFFFF !important;
	background-image: none !important;
	min-height: clamp(470px, 52vw, 620px);
	display: flex;
	align-items: center;
	padding-block: clamp(28px, 4vw, 56px);
	overflow: hidden;
}

/* Full-bleed artwork, left half, fading into white toward the copy */
.hero.ls-hero::before {
	content: "";
	position: absolute;
	top: 0; bottom: 0; left: 0;
	width: 58%;
	z-index: -1;
	background: url(https://locksmithil.com/wp-content/themes/locksmithil/assets/css/../images/hero-bg-q75.webp) 78% center / cover no-repeat;
	-webkit-mask-image: linear-gradient(to right, #000 0%, #000 50%, rgba(0,0,0,0.45) 78%, transparent 100%);
	mask-image: linear-gradient(to right, #000 0%, #000 50%, rgba(0,0,0,0.45) 78%, transparent 100%);
}
.hero.ls-hero .hero-overlay { display: none !important; }

/* Copy sits on the right in RTL */
.hero.ls-hero .hero-content {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: flex-start;
	width: 100%;
	text-align: start;
}
.hero.ls-hero .ls-hero-grid { display: block; }
.hero.ls-hero .ls-hero-copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: start;
	gap: clamp(12px, 1.5vw, 18px);
	max-width: 600px;
}

/* Badge */
.hero.ls-hero .badge-live {
	align-self: flex-start;
	background: #fff;
	border: 1.5px solid var(--gold);
	color: var(--text);
	box-shadow: var(--shadow-sm);
	font-weight: 600;
}

/* Headline + orange brush underline */
.hero.ls-hero h1.hero-heading {
	color: var(--text) !important;
	text-shadow: none;
	font-family: var(--font-heading);
	font-weight: 800;
	font-size: clamp(2.2rem, 5.2vw, 4rem);
	line-height: 1.08;
	margin: 0;
}
.hero.ls-hero h1.hero-heading .u {
	position: relative;
	background-image: var(--ls-swash);
	background-repeat: no-repeat;
	background-position: 50% 100%;
	background-size: 100% 0.30em;
	padding-bottom: 0.16em;
}

.hero.ls-hero .hero-sub {
	color: var(--text-muted);
	font-size: clamp(1rem, 1.45vw, 1.18rem);
	font-weight: 600;
	margin: 0;
}

/* Actions inline */
.hero.ls-hero .ls-hero-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	width: auto;
	margin-top: 6px;
}
.hero.ls-hero .ls-hero-actions .btn-gold {
	box-shadow: 0 10px 26px -8px rgba(249,115,22,.5);
}
.hero.ls-hero .ls-btn-outline {
	background: #fff;
	border: 1.5px solid var(--border-strong);
	color: var(--text) !important;
	border-radius: 10px;
	padding-inline: 20px;
	box-shadow: var(--shadow-sm);
}
.hero.ls-hero .ls-btn-outline:hover,
.hero.ls-hero .ls-btn-outline:focus-visible {
	border-color: var(--gold);
	color: var(--gold) !important;
}

/* ---------- Mobile: artwork becomes a bottom band ---------- */
@media (max-width: 860px) {
	.hero.ls-hero {
		min-height: 0;
		align-items: flex-start;
		padding-bottom: clamp(180px, 46vw, 280px);
	}
	.hero.ls-hero::before {
		top: auto; bottom: 0; left: 0; right: 0;
		width: 100%;
		height: 44%;
		background-position: 72% center;
		-webkit-mask-image: linear-gradient(to top, #000 0%, #000 48%, rgba(0,0,0,0.5) 76%, transparent 100%);
		mask-image: linear-gradient(to top, #000 0%, #000 48%, rgba(0,0,0,0.5) 76%, transparent 100%);
	}
	.hero.ls-hero .ls-hero-copy { max-width: none; }
	.hero.ls-hero .ls-hero-actions .btn { flex: 1 1 100%; }
}


/*FILESTART  /home/u467377426/domains/locksmithil.com/public_html/wp-content/themes/locksmithil/assets/css/mobile.css */
/* ==========================================================================
   locksmithil — mobile-specific styles
   Mobile is the primary breakpoint (most traffic). This file holds
   mobile-only components and tap-target adjustments that don't belong
   in the global design system.
   ========================================================================== */

/* Sticky bottom CTA bar — visible on mobile only, always tappable */
.sticky-mobile-cta {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: var(--z-sticky);
	display: none;
	gap: var(--space-2);
	padding: 10px;
	background: var(--bg-secondary);
	border-top: 1px solid var(--border);
	box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.45);
	padding-bottom: max(10px, env(safe-area-inset-bottom));
}

.sticky-mobile-cta .btn {
	flex: 1;
	min-height: 52px;
	font-size: 16px;
	padding: 0 12px;
}

.sticky-mobile-cta .btn-gold { color: #000000; }
.sticky-mobile-cta .btn-wa   { color: #ffffff; }

/* Hide joinchat floating bubble — inline <style> loads after our CSS,
   !important ensures we always win regardless of source order */
.joinchat { display: none !important; visibility: hidden !important; pointer-events: none !important; }
.joinchat__button { display: none !important; }

/* Hamburger toggle (mobile only) */
.mobile-menu-toggle {
	display: none;
	width: var(--tap-min);
	height: var(--tap-min);
	align-items: center;
	justify-content: center;
	border-radius: var(--radius-sm);
	flex-direction: column;
}

/* Override Elementor kit button styles (.elementor-kit-69 button = 0,1,1).
   Use .site-header scope to reach 0,2,0 and !important as fallback. */
.site-header .mobile-menu-toggle,
.site-header button.mobile-menu-toggle {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	border-radius: var(--radius-sm) !important;
	min-height: 0 !important;
}

.mobile-menu-toggle:focus-visible {
	background: var(--bg-card) !important;
}

.mobile-menu-toggle .bar {
	display: block;
	width: 24px;
	height: 2px;
	background: #ffffff;
	border-radius: 2px;
	margin: 5px 0;
	transition: transform var(--t-base), opacity var(--t-base);
}

/* Mobile nav drawer */
.mobile-nav {
	position: fixed;
	inset: 0;
	z-index: var(--z-overlay);
	background: var(--bg-primary);
	display: none;
	flex-direction: column;
	padding: var(--space-7) var(--space-5) var(--space-5);
}

.mobile-nav.is-open { display: flex; }

.mobile-nav a {
	display: block;
	padding: var(--space-3) 0;
	font-family: var(--font-heading);
	font-size: var(--text-xl);
	font-weight: 500;
	border-bottom: 1px solid var(--border);
}

/* ---------- MOBILE BREAKPOINT (max 767px) ---------- */
@media (max-width: 767px) {
	/* Show mobile-only components */
	.sticky-mobile-cta  { display: flex; }
	.mobile-menu-toggle { display: inline-flex; }

	/* Reserve space for sticky CTA bar */
	body { padding-bottom: 84px; }

	/* Tap-target minimums */
	a, button, .btn {
		min-height: var(--tap-min);
	}

	/* Slightly larger body text on mobile (legibility) */
	body { font-size: 16px; }

	/* Full-width CTAs by default on mobile */
	.btn-cta-mobile {
		width: 100%;
		min-height: var(--cta-height);
	}

	/* Section padding tightens on mobile */
	.section {
		padding-block: clamp(48px, 12vw, 72px);
	}

	/* Hero responsive: ensure h1 stays readable */
	.hero h1 {
		font-size: clamp(28px, 8.5vw, 40px);
	}
}

/* Very small phones (<360px) */
@media (max-width: 359px) {
	:root {
		--container-px: 16px;
	}
	.btn { font-size: 16px; padding: 0 16px; }
}


/*FILESTART  /home/u467377426/domains/locksmithil.com/public_html/wp-content/themes/locksmithil/assets/css/mockup.css */
/* ============================================================
   ג'ונסונים צביעת דירות — Handcrafted Impasto (Solar Shock)
   Design language: thick plaster & palette-knife artwork.
   Fine + coarse stucco textures (inline SVG turbulence) ·
   rough hand-painted edges (organic "daub" radii) — no clean
   vector lines · sculptural soft directional light instead of
   hard offset shadows · cream surfaces, indigo/blue structure,
   orange painted accents. Signature: price calculator +
   before/after slider.
   ============================================================ */

/* ---------- Design tokens ---------- */
:root {
  /* Solar Shock palette */
  --cream: #FFFFFF;          /* warm plaster base */
  --paper: #F6F7F8;          /* lighter plaster surface */
  --white: #FFFFFF;
  --ink: #292524;            /* near-black indigo — text, dark blocks */
  --ink-soft: #57534E;
  --indigo: #292524;         /* primary structure / trust */
  --indigo-deep: #1C1917;
  --blue: #78716C;
  /* Contrast remediation 2026-08-26 — ת"י 5568 חלק 1,1.4.3 (AA). Measured on white:#F97316=2.80:1,#EA580C=3.56:1 — both below the 4.5:1 floor. Each token is used BOTH as text on #fff and as a button background under #fff text,so a single luminance target fixes both directions. Hue and saturation are preserved;only lightness is reduced. --amber is deliberately NOT changed:it is used on the dark footer,where darkening it would REDUCE contrast. */ --orange:#C25205;--orange-deep:#AB4009;--amber:#FB923C;--grad-warm:linear-gradient(120deg, #F97316 0%, #FB923C 100%);--grad-cool:linear-gradient(135deg, #1C1917 0%, #292524 55%, #78716C 130%);--wa-green:#118648;--error:#d32f2f;--ok:#1f7a4d;--tex-fine:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.08 0 0 0 0 0.09 0 0 0 0 0.18 0 0 0 0.055 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --tex-coarse: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='460' height='460'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.045' numOctaves='4' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.08 0 0 0 0 0.09 0 0 0 0 0.18 0 0 0 0.07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E");
  --tex-light: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='l'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='3' seed='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 0.97 0 0 0 0 0.92 0 0 0 0.10 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23l)'/%3E%3C/svg%3E");

  /* Brush swash underline (orange, hand-painted) */
  --swash: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M2 9 C 18 4, 34 11, 52 8 S 88 4, 118 7' fill='none' stroke='%23FB923C' stroke-width='6' stroke-linecap='round' opacity='0.95'/%3E%3C/svg%3E");

  /* Hand-painted daub radii — irregular, like palette-knife strokes */
  --r-daub: 255px 22px 235px 18px / 22px 240px 20px 250px;
  --r-daub-sm: 14px 5px 16px 6px / 5px 15px 5px 17px;
  --r-daub-md: 26px 9px 30px 10px / 10px 28px 9px 30px;
  --r-blob: 48% 52% 55% 45% / 52% 46% 54% 48%;

  /* Sculptural light: raised-paint shadows (soft top light) */
  --raise-sm: inset 0 1px 0 rgba(255,255,255,0.55), 0 3px 8px -2px rgba(41,37,36,0.22);
  --raise: inset 0 2px 0 rgba(255,255,255,0.6), inset 0 -2px 3px rgba(41,37,36,0.08), 0 10px 26px -10px rgba(41,37,36,0.38);
  --raise-lg: inset 0 2px 0 rgba(255,255,255,0.55), 0 22px 44px -18px rgba(41,37,36,0.45);
  --raise-dark: inset 0 2px 0 rgba(255,255,255,0.14), 0 14px 32px -12px rgba(41,37,36,0.55);
  --shadow-pop: var(--raise);
  --line: 2px solid rgba(41,37,36,0.16);
  --line-strong: 2px solid rgba(41,37,36,0.32);

  /* Type */
  --font-display: 'Rubik', system-ui, sans-serif;
  --font-body: 'Assistant', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fs-hero: clamp(2.5rem, 5.6vw, 4.4rem);
  --fs-h2: clamp(2rem, 5vw, 3.3rem);
  --fs-h3: clamp(1.4rem, 3vw, 2rem);

  /* Embossed-into-plaster lettering (light bg) */
  --emboss: 0 1px 0 rgba(255,255,255,0.75), 0 3px 5px rgba(41,37,36,0.14);
  --emboss-strong: 0 2px 0 rgba(255,255,255,0.8), 0 5px 9px rgba(41,37,36,0.18);
  /* Painted lettering on dark blocks */
  --paint-soft: 0 2px 2px rgba(0,0,0,0.28), 0 8px 22px rgba(0,0,0,0.3);

  /* Layout */
  --container: 1200px;
  --header-h: 64px;

  /* Motion */
  --ease: cubic-bezier(0.23, 1, 0.32, 1);
  --dur: 0.25s;

  --z-header: 100;
  --z-overlay: 200;
  --z-float: 300;
  --z-lightbox: 400;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: clip; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--ink);
  background-color: var(--cream);
  background-image: none;
  overflow-x: clip;
  padding-top: var(--header-h);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
h1, h2, h3, h4 { margin: 0; line-height: 1.04; font-weight: 800; }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; list-style: none; }
::selection { background: var(--amber); color: var(--ink); }
:focus-visible { outline: 3px solid var(--indigo); outline-offset: 3px; }

.skip-link {
  position: absolute; inset-inline-start: 12px; top: -60px; z-index: 999;
  background: var(--ink); color: var(--cream); font-weight: 700; padding: 10px 18px;
  border-radius: var(--r-daub-sm); transition: top 0.2s;
}
.skip-link:focus { top: 12px; }

.container { width: min(100% - 40px, var(--container)); margin-inline: auto; }

.disp { font-family: var(--font-display); font-weight: 800; line-height: 0.98; letter-spacing: -0.01em; }
.grad-warm {
  background: none;
  color: var(--orange-deep);
  -webkit-text-fill-color: var(--orange-deep);
  text-shadow: none;
}

/* ---------- Plaster seam divider (was checkerboard) ---------- */
.checker {
  height: 22px;
  background-color: var(--paper);
  background-image: none;
  border-block: var(--line);
}

/* ---------- Buttons — painted daubs ---------- */
.btn {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 54px; padding: 13px 34px;
  border-radius: var(--r-daub);
  font-family: var(--font-display); font-weight: 700; font-size: 1.18rem; line-height: 1;
  letter-spacing: 0.01em;
  background-image: none;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background-color var(--dur), color var(--dur);
  touch-action: manipulation; text-align: center;
}
.btn:active { transform: scale(0.96); }
.btn svg { width: 20px; height: 20px; flex-shrink: 0; }

.btn-cta { background-color: var(--orange); color: #fff; box-shadow: var(--raise), 0 14px 30px -10px rgba(228,82,15,0.55); text-shadow: 0 1px 2px rgba(120,35,0,0.35); }
.btn-cta:hover { transform: translateY(-2px) rotate(-1.2deg); background-color: var(--orange-deep); box-shadow: var(--raise-lg), 0 20px 38px -12px rgba(228,82,15,0.6); }

.btn-ink { background-color: var(--ink); color: var(--cream); box-shadow: var(--raise-dark); }
.btn-ink:hover { transform: translateY(-2px) rotate(-1.2deg); background-color: var(--indigo-deep); }

.btn-outline { background-color: rgba(255,253,251,0.5); color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink), var(--raise-sm); }
.btn-outline:hover { transform: translateY(-2px) rotate(1.2deg); background-color: var(--ink); color: var(--cream); }

.btn-cream { background-color: var(--paper); color: var(--ink); box-shadow: var(--raise); }
.btn-cream:hover { transform: translateY(-2px) rotate(-1.2deg); box-shadow: var(--raise-lg); }

.btn-wa { background-color: var(--wa-green); color: #fff; box-shadow: var(--raise); }
.btn-wa:hover { transform: translateY(-2px) rotate(1deg); box-shadow: var(--raise-lg); }

/* ---------- Sticky slim header ---------- */
.site-header {
  position: fixed; inset-inline: 0; top: 0; z-index: var(--z-header);
  height: var(--header-h); display: flex; align-items: center;
  background-color: var(--paper); background-image: none;
  border-bottom: var(--line-strong);
  box-shadow: 0 10px 26px -14px rgba(41,37,36,0.35);
  transform: none; transition: box-shadow 0.3s var(--ease);
}
.site-header.scrolled { box-shadow: 0 14px 30px -12px rgba(41,37,36,0.45); }
.site-header .container { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.logo { font-family: var(--font-display); font-weight: 800; font-size: 1.55rem; line-height: 1; letter-spacing: -0.02em; text-shadow: var(--emboss); }
.logo .dot { color: var(--orange); text-shadow: none; }
.logo small {
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 700;
  letter-spacing: 0.22em; display: block; color: var(--indigo); text-shadow: none;
}
.main-nav ul { display: flex; gap: 2px; }
.main-nav a {
  display: block; padding: 8px 13px; font-family: var(--font-display);
  font-size: 1.02rem; font-weight: 600; border-radius: var(--r-daub-sm);
  transition: background-color var(--dur), color var(--dur), box-shadow var(--dur);
}
.main-nav a:hover { background-color: var(--ink); color: var(--cream); box-shadow: var(--raise-sm); }
.main-nav a.active { background-color: var(--indigo); color: #fff; box-shadow: var(--raise-sm); }
.header-cta { display: flex; align-items: center; gap: 10px; }
.header-cta .btn { min-height: 42px; padding: 8px 20px; font-size: 1.02rem; }

/* Burger */
.burger {
  display: none; width: 46px; height: 46px; border-radius: var(--r-daub-sm);
  background-color: var(--paper); background-image: none;
  box-shadow: var(--raise-sm); position: relative; z-index: calc(var(--z-overlay) + 1);
}
.burger span { position: absolute; inset-inline: 11px; height: 3px; border-radius: 3px; background: var(--ink);
  transition: transform 0.3s var(--ease), opacity 0.2s, top 0.3s var(--ease); }
.burger span:nth-child(1) { top: 15px; }
.burger span:nth-child(2) { top: 21px; }
.burger span:nth-child(3) { top: 27px; }
.burger[aria-expanded="true"] span:nth-child(1) { top: 21px; transform: rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { top: 21px; transform: rotate(-45deg); }

/* Mobile menu */
.mobile-menu {
  position: fixed; inset: 0; z-index: var(--z-overlay);
  background-color: var(--cream); background-image: none;
  display: flex; flex-direction: column; justify-content: center; padding: 90px 30px 40px;
  opacity: 0; visibility: hidden; transition: opacity 0.25s var(--ease), visibility 0.25s;
}
.mobile-menu.open { opacity: 1; visibility: visible; }
.mobile-menu nav ul { display: flex; flex-direction: column; }
.mobile-menu nav a {
  display: block; font-family: var(--font-display); font-size: 2rem; font-weight: 700;
  padding: 10px 4px; border-bottom: var(--line); text-shadow: var(--emboss);
  transform: translateY(14px); opacity: 0;
  transition: transform 0.4s var(--ease), opacity 0.4s, background-color var(--dur);
}
.mobile-menu.open nav a { transform: none; opacity: 1; }
.mobile-menu nav a:hover { background-color: var(--ink); color: var(--cream); text-shadow: none; }
.mobile-menu nav a.active { color: var(--orange-deep); }
.mobile-menu nav li:nth-child(1) a { transition-delay: 0.04s; }
.mobile-menu nav li:nth-child(2) a { transition-delay: 0.08s; }
.mobile-menu nav li:nth-child(3) a { transition-delay: 0.12s; }
.mobile-menu nav li:nth-child(4) a { transition-delay: 0.16s; }
.mobile-menu nav li:nth-child(5) a { transition-delay: 0.2s; }
.mobile-menu nav li:nth-child(6) a { transition-delay: 0.24s; }
.mobile-menu nav li:nth-child(7) a { transition-delay: 0.28s; }
.mobile-menu .menu-ctas { display: flex; flex-direction: column; gap: 12px; margin-top: 30px; }

/* ---------- Masthead ---------- */
.masthead {
  background-color: var(--paper);
  background-image: none;
  padding: clamp(12px, 2.2vw, 20px) 0;
  border-bottom: var(--line);
}
.masthead .container { display: flex; align-items: center; justify-content: space-between; gap: 12px 28px; flex-wrap: wrap; }
.masthead .brand {
  font-family: var(--font-display); font-weight: 800; font-size: clamp(2rem, 5vw, 3.6rem);
  line-height: 0.9; letter-spacing: -0.03em; display: block; text-shadow: var(--emboss-strong);
}
.masthead .brand .dot { color: var(--orange); text-shadow: none; }
.masthead .brand-sub {
  display: block; font-family: var(--font-body); font-weight: 700; letter-spacing: 0.28em;
  font-size: clamp(0.65rem, 1.5vw, 0.95rem); color: var(--indigo); margin-top: 0.4em; text-shadow: none;
}
.masthead-nav { display: flex; flex-wrap: wrap; gap: 6px 20px; align-items: center; }
.masthead-nav a {
  font-family: var(--font-display); font-weight: 600; font-size: clamp(1rem, 2vw, 1.2rem);
  padding: 3px 10px; border-radius: var(--r-daub-sm);
  transition: background-color var(--dur), color var(--dur), box-shadow var(--dur);
}
.masthead-nav a:hover { background-color: var(--ink); color: var(--cream); box-shadow: var(--raise-sm); }
.masthead-nav a.active { background-color: var(--indigo); color: #fff; }

/* ---------- Hero — full-bleed impasto artwork, copy on top ---------- */
.hero {
  background-color: #FFFFFF;
  position: relative; border-block: var(--line);
  background-color: var(--cream); overflow: hidden; isolation: isolate;
  min-height: clamp(520px, 58vw, 700px);
  display: flex; align-items: center;
}
/* the artwork, flipped so the clean plaster sits on the right (RTL copy side) */
.hero::before {
  content: ''; position: absolute; inset: 0; z-index: -2;
  inset: 0 auto 0 0; width: 52%;
  background: url(https://locksmithil.com/wp-content/themes/locksmithil/assets/css/../images/ls-hero-opt.jpg) 88% center / cover no-repeat;
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 55%, rgba(0,0,0,0.45) 82%, transparent 100%);
  mask-image: linear-gradient(to right, #000 0%, #000 55%, rgba(0,0,0,0.45) 82%, transparent 100%);
}
/* light legibility hint on the copy side only — the artwork stays crisp */
.hero::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: none;
}
.hero-inner { display: flex; width: 100%; justify-content: flex-start; }
.hero-copy {
  color: var(--ink);
  max-width: 620px;
  padding: clamp(36px, 5vw, 72px) 0;
  display: flex; flex-direction: column; gap: 18px; justify-content: center;
}
@media (max-width: 860px) {
  .hero { min-height: auto; }
  .hero::before {
    inset: auto 0 0 0; width: 100%; height: 46%;
    background: url(https://locksmithil.com/wp-content/themes/locksmithil/assets/css/../images/ls-hero-opt.jpg) 78% center / cover no-repeat;
    -webkit-mask-image: linear-gradient(to top, #000 0%, #000 52%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: linear-gradient(to top, #000 0%, #000 52%, rgba(0,0,0,0.5) 78%, transparent 100%);
  }
  .hero-copy { padding-bottom: clamp(190px, 46vw, 300px); }
  .hero::after { background: none; }
}
.hero-copy .kicker-light {
  align-self: flex-start; font-family: var(--font-display); font-weight: 700;
  font-size: 0.85rem; letter-spacing: 0.1em;
  background-color: var(--indigo); background-image: none;
  color: #fff; padding: 8px 18px; border-radius: var(--r-daub-md);
  box-shadow: var(--raise-sm); transform: rotate(-1.6deg);
}
.hero-copy h1 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-hero);
  line-height: 1.02; text-shadow: var(--emboss-strong);
}
.hero-copy h1 .u {
  text-decoration: none;
  background-image: var(--swash);
  background-repeat: no-repeat; background-position: 50% 100%; background-size: 100% 0.32em;
  padding-bottom: 0.18em;
}
.hero-copy .hero-sub { font-size: clamp(1rem, 1.7vw, 1.18rem); font-weight: 500; color: var(--ink-soft); max-width: 46ch; margin: 0; }
.hero-mini-trust { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 4px; }
.hero-mini-trust li { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 0.95rem; }
.hero-mini-trust svg { width: 18px; height: 18px; color: var(--orange-deep); flex-shrink: 0; }

/* short lead form floating on hero media — plaster card */
.hero-form {
  position: absolute; z-index: 3; inset-inline: 18px; bottom: 18px;
  background-color: var(--paper); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise-lg);
  padding: 18px 18px 20px;
}
.hero-form h2 { font-family: var(--font-display); font-size: 1.25rem; margin-bottom: 12px; text-shadow: var(--emboss); }
.hero-form .mini-row { display: grid; gap: 10px; }
@media (min-width: 480px) { .hero-form .mini-row { grid-template-columns: 1fr 1fr; } }
.hero-form input, .hero-form select {
  font: inherit; color: var(--ink);
  background-color: rgba(255,253,251,0.85); background-image: none;
  border: var(--line-strong); border-radius: var(--r-daub-sm);
  padding: 10px 13px; min-height: 46px; width: 100%;
  box-shadow: inset 0 2px 4px rgba(41,37,36,0.1);
  transition: box-shadow var(--dur), background-color var(--dur), border-color var(--dur);
}
.hero-form input:focus, .hero-form select:focus { outline: none; background-color: var(--white); border-color: var(--orange); box-shadow: inset 0 2px 4px rgba(41,37,36,0.08), 0 0 0 3px rgba(255,102,36,0.25); }
.hero-form .btn { width: 100%; margin-top: 10px; min-height: 50px; }

/* ---------- Trust strip — deep indigo painted band ---------- */
.trust-strip {
  background-color: var(--ink); background-image: none;
  color: var(--cream);
}
.trust-strip ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.trust-strip li {
  display: flex; align-items: center; justify-content: center; gap: 12px; padding: 18px 12px;
  font-family: var(--font-display); font-weight: 700; font-size: 1.15rem; text-align: center;
  text-shadow: var(--paint-soft);
}
.trust-strip li + li { border-inline-start: 2px solid rgba(255,255,255,0.16); }
.trust-strip b { font-size: 1.7rem; color: var(--amber); }
@media (max-width: 620px) {
  .trust-strip ul { grid-template-columns: 1fr 1fr; }
  .trust-strip li + li { border-inline-start: 0; }
  .trust-strip li:nth-child(even) { border-inline-start: 2px solid rgba(255,255,255,0.16); }
  .trust-strip li:nth-child(n+3) { border-top: 2px solid rgba(255,255,255,0.16); }
}

/* ---------- Marquee — painted orange band ---------- */
.marquee {
  --marquee-dur: 26s; overflow: hidden;
  background-color: var(--orange); background-image: none;
  color: #fff; padding-block: 12px; display: flex; user-select: none;
  border-block: var(--line-strong);
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.25), inset 0 -3px 6px rgba(120,35,0,0.25);
}
.marquee-track { display: flex; flex-shrink: 0; min-width: 100%; animation: marquee var(--marquee-dur) linear infinite; }
.marquee span {
  display: inline-flex; align-items: center; gap: 28px; padding-inline: 14px; white-space: nowrap;
  font-family: var(--font-display); font-weight: 700; font-size: 1.4rem; letter-spacing: 0.02em;
  text-shadow: 0 1px 2px rgba(120,35,0,0.4);
}
.marquee span::after { content: '✦'; color: var(--ink); font-size: 0.85em; text-shadow: none; }
@keyframes marquee { to { transform: translateX(50%); } }

/* ---------- Sections ---------- */
.section { padding-block: clamp(52px, 8vw, 96px); position: relative; }
.section-head { max-width: 720px; margin-bottom: clamp(28px, 4.5vw, 48px); }
.section-head.center { margin-inline: auto; text-align: center; }
.kicker {
  display: inline-block; font-family: var(--font-display); font-weight: 700; font-size: 0.82rem;
  letter-spacing: 0.1em; background-color: var(--ink); background-image: none;
  color: var(--cream); padding: 6px 16px; margin-bottom: 16px;
  border-radius: var(--r-daub-md); box-shadow: var(--raise-sm); transform: rotate(-1.4deg);
}
.section-head h2 { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-h2); line-height: 1.02; margin-bottom: 12px; text-shadow: var(--emboss-strong); }
.section-head h2 em { font-style: normal; }
.section-head p { color: var(--ink-soft); font-size: 1.05rem; margin: 0; }
.bg-paper { background-color: var(--paper); background-image: none; border-block: var(--line); }
.bg-white { background-color: var(--white); background-image: none; border-block: var(--line); }

/* ---------- Price calculator — sculpted plaster panel ---------- */
.calc-wrap {
  display: grid; gap: 0; overflow: hidden;
  background-color: var(--paper); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise-lg);
}
@media (min-width: 860px) { .calc-wrap { grid-template-columns: 1.15fr 0.85fr; } }
.calc-inputs { padding: clamp(22px, 3.5vw, 40px); }
.calc-field { margin-bottom: 24px; }
.calc-field > label { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font-family: var(--font-display); font-weight: 700; font-size: 1.15rem; margin-bottom: 12px; text-shadow: var(--emboss); }
.calc-field .val { color: var(--orange-deep); font-weight: 800; text-shadow: none; }
input[type="range"] {
  -webkit-appearance: none; appearance: none; width: 100%; height: 10px;
  background-color: var(--cream); background-image: none;
  border: var(--line-strong); border-radius: 50px; outline-offset: 4px;
  box-shadow: inset 0 2px 4px rgba(41,37,36,0.15);
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 32px; height: 32px; border-radius: var(--r-blob);
  background: var(--orange); border: 2px solid rgba(120,35,0,0.35); cursor: pointer;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.4), 0 4px 10px -2px rgba(228,82,15,0.6);
}
input[type="range"]::-moz-range-thumb {
  width: 32px; height: 32px; border-radius: 50%; background: var(--orange);
  border: 2px solid rgba(120,35,0,0.35); cursor: pointer;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.4), 0 4px 10px -2px rgba(228,82,15,0.6);
}
.seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border-radius: var(--r-daub-md); overflow: hidden; box-shadow: var(--raise-sm); border: var(--line-strong); }
.seg button {
  padding: 12px 8px; font-family: var(--font-display); font-weight: 700; font-size: 0.98rem;
  background-color: var(--paper); background-image: none;
  transition: background-color var(--dur), color var(--dur); min-height: 48px;
}
.seg button + button { border-inline-start: var(--line-strong); }
.seg button[aria-pressed="true"] { background-color: var(--indigo); background-image: none; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.35); }
.calc-toggles { display: grid; gap: 12px; }
.toggle {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 16px; border-radius: var(--r-daub-md);
  background-color: var(--paper); background-image: none;
  box-shadow: var(--raise-sm); border: var(--line);
  cursor: pointer; min-height: 54px; text-align: start;
  transition: box-shadow var(--dur), background-color var(--dur);
}
.toggle:hover { background-color: var(--cream); box-shadow: var(--raise); }
.toggle b { font-family: var(--font-display); font-weight: 700; font-size: 1.05rem; }
.toggle span { color: var(--ink-soft); font-size: 0.85rem; display: block; }
.switch { flex-shrink: 0; width: 54px; height: 32px; border-radius: 50px; border: var(--line-strong);
  background-color: var(--cream); box-shadow: inset 0 2px 4px rgba(41,37,36,0.16); position: relative; transition: background-color var(--dur); }
.switch::after { content: ''; position: absolute; top: 2px; inset-inline-start: 3px; width: 23px; height: 23px; border-radius: var(--r-blob);
  background: var(--ink); box-shadow: 0 2px 4px rgba(41,37,36,0.35); transition: transform var(--dur) var(--ease), background-color var(--dur); }
.toggle[aria-pressed="true"] .switch { background-color: var(--amber); }
.toggle[aria-pressed="true"] .switch::after { transform: translateX(-22px); background-color: var(--orange-deep); }

.calc-result {
  background-color: var(--ink); background-image: none;
  color: var(--cream); padding: clamp(22px, 3.5vw, 40px);
  display: flex; flex-direction: column; justify-content: center; text-align: center;
  box-shadow: inset 6px 0 18px -10px rgba(0,0,0,0.5);
}
.calc-result .cr-label { font-weight: 600; font-size: 0.95rem; color: rgba(255,255,255,0.75); letter-spacing: 0.05em; }
.calc-result .cr-range {
  font-family: var(--font-display); font-weight: 800; font-size: clamp(2.4rem, 6vw, 3.6rem);
  line-height: 1; margin: 10px 0; font-variant-numeric: tabular-nums; text-shadow: var(--paint-soft);
}
.calc-result .cr-range .grad-warm { display: inline; text-shadow: none; }
.calc-result .cr-sub { font-size: 0.9rem; color: rgba(255,255,255,0.7); margin-bottom: 22px; }
.calc-result .btn { align-self: center; }
.calc-note { text-align: center; color: var(--ink-soft); font-size: 0.85rem; margin: 16px 0 0; }

/* ---------- What's included — plaster tiles ---------- */
.incl-grid { display: grid; gap: 14px; }
@media (min-width: 640px) { .incl-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .incl-grid { grid-template-columns: repeat(3, 1fr); } }
.incl-item {
  display: flex; gap: 14px; align-items: flex-start; padding: 20px 22px;
  background-color: var(--white); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise-sm); border: var(--line);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.incl-item:hover { transform: translateY(-3px) rotate(-0.4deg); box-shadow: var(--raise); }
.incl-check {
  flex-shrink: 0; width: 42px; height: 42px; border-radius: var(--r-blob);
  background-color: var(--orange); background-image: none;
  display: grid; place-items: center; color: #fff;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.35), 0 4px 10px -3px rgba(228,82,15,0.55);
}
.incl-check svg { width: 20px; height: 20px; }
.incl-item b,
/* 2.4.10 remediation 2026-08-26 — feature and scenario titles are now <h3>. Same intent
   as .guide-card h3 above: identical rendering, correct semantics. */
.incl-item h3 { font-family: var(--font-display); font-size: 1.2rem; display: block; margin-bottom: 2px; text-shadow: var(--emboss); }
.incl-item h3 { font-weight: 700; margin-top: 0; color: inherit; letter-spacing: normal; line-height: 1.15; }
.incl-item p { color: var(--ink-soft); font-size: 0.92rem; margin: 0; }

/* ---------- Service poster cards — painted panels ---------- */
.services-grid { display: grid; gap: 16px; }
@media (min-width: 640px) { .services-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .services-grid { grid-template-columns: repeat(3, 1fr); } }
.svc-card {
  position: relative; min-height: clamp(230px, 25vw, 300px); overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end; color: #fff; isolation: isolate;
  background-color: var(--indigo-deep); border-radius: var(--r-daub-md); box-shadow: var(--raise-dark);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.svc-card:hover { transform: translateY(-4px) rotate(-0.35deg); }
.svc-card img, .svc-card .ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 0.6s var(--ease); }
.svc-card:hover img, .svc-card:hover .ph { transform: scale(1.05); }
.svc-card::after { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(41,37,36,0.15) 0%, rgba(41,37,36,0.05) 35%, rgba(41,37,36,0.88) 100%); }
.svc-card .svc-name {
  font-family: var(--font-display); font-weight: 800; font-size: clamp(1.7rem, 3.4vw, 2.3rem);
  line-height: 0.98; padding: 20px 22px 0; position: absolute; top: 0; inset-inline-start: 0;
  text-shadow: var(--paint-soft);
}
.svc-body { background: rgba(20,18,40,0.6); background-image: none; padding: 14px 22px 18px; border-top: 2px solid rgba(255,255,255,0.28); }
.svc-body p { margin: 0 0 10px; font-size: 0.94rem; max-width: 52ch; }
.svc-link { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; color: var(--amber); transition: gap var(--dur); }
.svc-link:hover { gap: 14px; }
.svc-link svg { width: 16px; height: 16px;  }

/* ---------- Before / After — framed artwork ---------- */
.ba-wrap { max-width: 900px; margin-inline: auto; }
.ba {
  position: relative; overflow: hidden;
  border-radius: var(--r-daub-md); box-shadow: var(--raise-lg);
  border: 10px solid var(--paper); outline: var(--line-strong);
  aspect-ratio: 16 / 10; background: var(--indigo-deep); user-select: none; touch-action: pan-y;
}
.ba .ba-after { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ba .ba-before-wrap { position: absolute; top: 0; bottom: 0; left: 0; right: auto; width: 50%; overflow: hidden; border-right: 3px solid var(--paper); }
.ba .ba-before-wrap .ba-before { position: absolute; top: 0; left: 0; height: 100%; width: 100%; object-fit: cover; }
.ba-tag {
  position: absolute; top: 14px; z-index: 4; font-family: var(--font-display); font-weight: 700;
  font-size: 0.85rem; padding: 6px 16px; border-radius: var(--r-daub-md);
  background-color: var(--paper); background-image: none; color: var(--ink); box-shadow: var(--raise-sm);
}
.ba-tag.before { left: 14px; transform: rotate(-2deg); }
.ba-tag.after { right: 14px; background-color: var(--orange); background-image: none; color: #fff; transform: rotate(2deg); text-shadow: 0 1px 2px rgba(120,35,0,0.4); }
.ba-handle {
  position: absolute; top: 0; bottom: 0; left: 50%; width: 3px; background: var(--paper);
  z-index: 5; transform: translateX(-50%); pointer-events: none;
}
.ba-knob {
  position: absolute; top: 50%; left: 50%; z-index: 6; transform: translate(-50%, -50%);
  width: 52px; height: 52px; border-radius: var(--r-blob);
  background-color: var(--orange); background-image: none;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.4), 0 8px 18px -4px rgba(41,37,36,0.5);
  display: grid; place-items: center; color: #fff; pointer-events: none;
}
.ba-knob svg { width: 26px; height: 26px; }
.ba-range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; z-index: 7; direction: ltr; border: 0; background: none; box-shadow: none; }

/* ---------- Projects showcase — example project cards ---------- */
.projects-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); margin-top: 28px; }
.project-card {
  overflow: hidden; background-color: var(--white); background-image: none;
  border: var(--line); border-radius: var(--r-daub-md); box-shadow: var(--raise-sm);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.project-card:nth-child(2) { transform: rotate(0.4deg); }
.project-card:hover { transform: translateY(-4px) rotate(-0.3deg); box-shadow: var(--raise); }
.project-imgs { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; aspect-ratio: 16 / 9; }
.project-imgs .ph { border-radius: 0; }
.project-body { padding: 16px 18px 18px; }
.pj-loc { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; font-size: 0.82rem; color: var(--orange-deep); margin-bottom: 6px; }
.pj-loc svg { width: 15px; height: 15px; }
.project-body b { display: block; font-family: var(--font-display); font-size: 1.3rem; line-height: 1.1; margin-bottom: 6px; text-shadow: var(--emboss); }
.project-body p { color: var(--ink-soft); font-size: 0.92rem; margin: 0; }

/* ---------- Price table — plaster board ---------- */
.price-table {
  background-color: var(--paper); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise); overflow: hidden; border: var(--line);
}
.price-table table { width: 100%; border-collapse: collapse; }
.price-table th, .price-table td { padding: 15px 18px; text-align: start; border-bottom: var(--line); }
.price-table thead th {
  background-color: var(--indigo); background-image: none;
  color: #fff; font-family: var(--font-display); font-size: 1.05rem; text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}
.price-table tbody tr:last-child td { border-bottom: 0; }
.price-table tbody tr:hover { background-color: rgba(255,255,255,0.6); }
.price-table td.price { font-family: var(--font-display); font-weight: 800; color: var(--orange-deep); font-variant-numeric: tabular-nums; white-space: nowrap; }
.price-table caption { caption-side: bottom; padding: 12px; font-size: 0.82rem; color: var(--ink-soft); }

/* ---------- City chips — painted daubs ---------- */
.chips { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.chip {
  display: inline-flex; align-items: center; gap: 9px; padding: 12px 26px;
  border-radius: var(--r-daub); background-color: var(--paper); background-image: none;
  box-shadow: var(--raise-sm); border: var(--line);
  font-family: var(--font-display); font-weight: 700; font-size: clamp(1.1rem, 2.2vw, 1.35rem);
  text-shadow: var(--emboss);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur), background-color var(--dur), color var(--dur);
}
.chip:nth-child(odd) { transform: rotate(-0.8deg); }
.chip:nth-child(even) { transform: rotate(0.7deg); }
.chip:hover { transform: translateY(-3px); box-shadow: var(--raise); background-color: var(--indigo); background-image: none; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.35); }
.chip svg { width: 19px; height: 19px; color: var(--orange-deep); flex-shrink: 0; }
.chip:hover svg { color: var(--amber); }

/* ---------- Testimonials — plaster cards ---------- */
.testi-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }
.testi-card {
  background-color: var(--white); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise-sm); border: var(--line);
  padding: 24px 22px 20px;
  display: flex; flex-direction: column; gap: 14px;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.testi-card:nth-child(2) { transform: rotate(0.4deg); }
.testi-card:hover { transform: translateY(-4px) rotate(-0.3deg); box-shadow: var(--raise); }
.testi-stars { display: flex; gap: 3px; color: var(--orange); filter: drop-shadow(0 1px 1px rgba(120,35,0,0.3)); }
.testi-stars svg { width: 17px; height: 17px; }
.testi-card blockquote { margin: 0; font-size: 1rem; flex: 1; }
.testi-who { display: flex; align-items: center; gap: 12px; border-top: var(--line); padding-top: 14px; }
.testi-who .avatar {
  width: 42px; height: 42px; border-radius: var(--r-blob); display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 800; font-size: 1.2rem;
  background-color: var(--amber); background-image: none;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.4), 0 3px 8px -2px rgba(228,82,15,0.4); flex-shrink: 0;
}
.testi-who b { display: block; font-size: 0.96rem; }
.testi-who span { color: var(--ink-soft); font-size: 0.84rem; }

/* ---------- FAQ — carved plaster list ---------- */
.faq-list {
  max-width: 800px; margin-inline: auto;
  background-color: var(--paper); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise); border: var(--line); overflow: hidden;
}
.faq-item { border-bottom: var(--line); }
.faq-item:last-child { border-bottom: 0; }
.faq-item summary {
  list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px 20px; font-family: var(--font-display); font-weight: 700; font-size: 1.2rem;
  cursor: pointer; min-height: 44px; text-shadow: var(--emboss);
  transition: background-color var(--dur), color var(--dur);
}
.faq-item summary:hover { background-color: var(--cream); }
.faq-item[open] summary { background-color: var(--indigo); background-image: none; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.35); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary .faq-x {
  flex-shrink: 0; width: 30px; height: 30px; border-radius: var(--r-blob);
  display: grid; place-items: center; position: relative;
  background-color: var(--cream); box-shadow: var(--raise-sm);
  transition: transform 0.3s var(--ease), background-color var(--dur);
}
.faq-item[open] summary .faq-x { background-color: var(--orange); transform: rotate(45deg); }
.faq-item summary .faq-x::before, .faq-item summary .faq-x::after { content: ''; position: absolute; background: var(--ink); border-radius: 2px; }
.faq-item[open] summary .faq-x::before, .faq-item[open] summary .faq-x::after { background: #fff; }
.faq-item summary .faq-x::before { width: 12px; height: 2.5px; }
.faq-item summary .faq-x::after { width: 2.5px; height: 12px; }
.faq-item .faq-a { padding: 16px 20px 20px; color: var(--ink-soft); border-top: var(--line); }
.faq-item .faq-a p { margin: 0; }

/* ---------- CTA band — painted indigo canvas ---------- */
.cta-band {
  border-radius: var(--r-daub-md); box-shadow: var(--raise-lg);
  background-color: var(--indigo); background-image: none;
  color: #fff; text-align: center; padding: clamp(38px, 6vw, 72px) clamp(22px, 5vw, 68px);
}
.cta-band h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(2.2rem, 5.5vw, 3.8rem); line-height: 1.0; margin-bottom: 12px; text-shadow: var(--paint-soft); }
.cta-band p { font-size: 1.06rem; font-weight: 500; max-width: 52ch; margin: 0 auto 26px; color: rgba(255,255,255,0.92); }
.cta-ctas { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }

/* ---------- Contact — plaster form ---------- */
.contact-grid { display: grid; gap: 24px; }
@media (min-width: 960px) { .contact-grid { grid-template-columns: 0.85fr 1.15fr; align-items: start; } }
.contact-form {
  background-color: var(--paper); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise-lg); border: var(--line);
  padding: clamp(22px, 4vw, 38px);
}
.form-row { display: grid; gap: 14px; }
@media (min-width: 640px) { .form-row.cols-2 { grid-template-columns: 1fr 1fr; } }
.field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.field label { font-weight: 700; font-size: 0.92rem; }
.field label .req { color: var(--orange-deep); }
.field input, .field select, .field textarea {
  font: inherit; color: var(--ink);
  background-color: rgba(255,253,251,0.85); background-image: none;
  border: var(--line-strong); border-radius: var(--r-daub-sm);
  padding: 12px 15px; min-height: 50px; width: 100%;
  box-shadow: inset 0 2px 4px rgba(41,37,36,0.1);
  transition: box-shadow var(--dur), background-color var(--dur), border-color var(--dur);
}
.field textarea { resize: vertical; min-height: 110px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; background-color: var(--white); border-color: var(--orange); box-shadow: inset 0 2px 4px rgba(41,37,36,0.08), 0 0 0 3px rgba(255,102,36,0.25); }
.field input[aria-invalid="true"], .field select[aria-invalid="true"] { border-color: var(--error); box-shadow: inset 0 2px 4px rgba(41,37,36,0.08), 0 0 0 3px rgba(211,47,47,0.25); }
.field .err { display: none; color: var(--error); font-size: 0.83rem; font-weight: 600; }
.field.invalid .err { display: block; }
.field select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%2326241E' stroke-width='2'/%3E%3C/svg%3E"), var(--tex-fine);
  background-repeat: no-repeat, repeat; background-position: left 16px center, 0 0; padding-inline-end: 16px;
}
.hp-field { position: absolute; opacity: 0; height: 0; overflow: hidden; pointer-events: none; }
.form-note { color: var(--ink-soft); font-size: 0.84rem; margin: 14px 0 0; text-align: center; }
.form-success {
  display: none; align-items: center; gap: 12px;
  background: #e7f3ea; border: 2px solid var(--ok); border-radius: var(--r-daub-sm);
  color: var(--ok); font-weight: 700; padding: 14px 18px; margin-top: 16px;
}
.form-success.show { display: flex; }
.form-success svg { width: 22px; height: 22px; flex-shrink: 0; }
.contact-aside {
  display: grid; gap: 0; align-content: start; overflow: hidden;
  background-color: var(--paper); background-image: none;
  border-radius: var(--r-daub-md); box-shadow: var(--raise); border: var(--line);
}
.info-card { display: flex; align-items: center; gap: 15px; padding: 18px 20px; transition: background-color var(--dur); }
.info-card + .info-card { border-top: var(--line); }
a.info-card:hover { background-color: rgba(255,155,41,0.25); }
.info-card .ic {
  width: 46px; height: 46px; flex-shrink: 0; border-radius: var(--r-blob);
  display: grid; place-items: center;
  background-color: var(--cream); background-image: none; box-shadow: var(--raise-sm);
}
.info-card .ic svg { width: 21px; height: 21px; }
.info-card b { display: block; font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; text-shadow: var(--emboss); }
.info-card span { color: var(--ink-soft); font-size: 0.92rem; }
.info-card span.ltr { direction: ltr; unicode-bidi: embed; white-space: nowrap; }

/* ---------- Footer — deep painted wall ---------- */
.site-footer {
  background-color: var(--ink); background-image: none;
  color: var(--cream); border-top: var(--line-strong); position: relative; z-index: 2;
}
.footer-marquee { overflow: hidden; border-bottom: 1px solid rgba(255,255,255,0.22); padding-block: 10px; display: flex; }
.footer-marquee .marquee-track { animation-duration: 32s; }
.footer-marquee span { display: inline-flex; align-items: center; gap: 26px; padding-inline: 14px; white-space: nowrap; font-family: var(--font-display); font-weight: 700; font-size: 1.25rem; letter-spacing: 0.03em; color: var(--cream); text-shadow: var(--paint-soft); }
.footer-marquee span::after { content: '✦'; color: var(--orange); text-shadow: none; }
.footer-grid { display: grid; gap: 32px; padding-block: clamp(38px, 6vw, 60px) 38px; }
@media (min-width: 760px) { .footer-grid { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; } }
.footer-brand .brand { font-family: var(--font-display); font-weight: 800; font-size: clamp(2.2rem, 4vw, 3.2rem); line-height: 0.9; display: block; letter-spacing: -0.02em; text-shadow: var(--paint-soft); }
.footer-brand .brand .dot { color: var(--orange); }
.footer-brand p { color: rgba(255,255,255,0.75); font-size: 0.94rem; max-width: 280px; margin-top: 14px; }
/* Footer column headings are h3, not h4: they follow page sections that end at h2, so h4
   skipped a level on every page. Both selectors are kept so the rendering is identical. */
.footer-col h4,
.footer-col h3 { font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; color: var(--amber); margin-bottom: 14px; text-shadow: 0 1px 2px rgba(0,0,0,0.3); }
.footer-col h3 { letter-spacing: normal; word-spacing: normal; }
.footer-col ul { display: grid; gap: 8px; }
.footer-col a { color: rgba(255,255,255,0.85); font-size: 0.95rem; transition: color var(--dur); }
.footer-col a:hover { color: var(--amber); }
.footer-col li { color: rgba(255,255,255,0.85); font-size: 0.95rem; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.22); padding: 18px 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; color: rgba(255,255,255,0.6); font-size: 0.85rem; }

/* ---------- Floating WhatsApp — painted blob ---------- */
.wa-float {
  position: fixed; bottom: 22px; inset-inline-end: 20px; z-index: var(--z-float); width: 60px; height: 60px;
  border-radius: var(--r-blob); background-color: var(--wa-green); background-image: none;
  display: grid; place-items: center; color: #fff;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.3), 0 10px 24px -6px rgba(41,37,36,0.45);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.wa-float:hover { transform: translateY(-3px) rotate(-4deg); box-shadow: inset 0 2px 0 rgba(255,255,255,0.3), 0 16px 30px -8px rgba(41,37,36,0.5); }
.wa-float svg { width: 30px; height: 30px; }

/* ---------- Placeholder blocks (swap for real photos) ---------- */
.ph {
  display: grid; place-items: center; text-align: center; color: rgba(255,255,255,0.9);
  background-color: var(--indigo); background-image: none;
  font-family: var(--font-display); font-weight: 700;
}
.ph::after { content: attr(data-ph); font-size: 0.9rem; padding: 8px 14px; border: 1.5px dashed rgba(255,255,255,0.55); border-radius: var(--r-daub-sm); }
.ph.warm { background-color: var(--orange); background-image: none; }
.ph.ink { background-color: var(--indigo-deep); background-image: none; }

/* ============================================================
   Inner pages — city (STAG) + article/guide
   ============================================================ */
.breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 0.9rem; color: var(--ink-soft); margin-bottom: 18px; }
.breadcrumb a { font-weight: 600; transition: color var(--dur); }
.breadcrumb a:hover { color: var(--orange-deep); }
.breadcrumb .bc-sep { color: var(--ink-soft); opacity: 0.7; }
.breadcrumb [aria-current] { font-weight: 700; }

/* Page hero (cities + index pages) — plaster band, no photo */
.page-hero {
  background-color: var(--paper); background-image: none;
  border-bottom: var(--line); padding-block: clamp(30px, 5vw, 56px);
}
.page-hero .kicker { margin-bottom: 14px; }
.page-hero h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(2.1rem, 5vw, 3.4rem); line-height: 1.03; text-shadow: var(--emboss-strong); margin-bottom: 14px; }
.page-hero-sub { font-size: clamp(1.02rem, 1.8vw, 1.2rem); color: var(--ink-soft); max-width: 62ch; margin: 0 0 22px; }

/* Prose layout: article + sticky aside */
.prose-wrap { display: grid; gap: 30px; }
@media (min-width: 960px) { .prose-wrap { grid-template-columns: minmax(0, 1fr) 320px; align-items: start; } }
.prose { max-width: 760px; font-size: 1.08rem; line-height: 1.8; }
.prose h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.5rem, 3vw, 2.05rem); line-height: 1.1; margin: 1.4em 0 0.5em; text-shadow: var(--emboss); }
.prose h3 { font-family: var(--font-display); font-weight: 700; font-size: 1.3rem; margin: 1.2em 0 0.4em; }
.prose p { margin: 0 0 1.1em; }
.prose ul, .prose ol { margin: 0 0 1.2em; padding-inline-start: 1.4em; }
.prose ul { list-style: none; padding-inline-start: 0; }
.prose ul li { position: relative; padding-inline-start: 30px; margin-bottom: 0.6em; }
.prose ul li::before { content: ''; position: absolute; inset-inline-start: 0; top: 0.5em; width: 16px; height: 16px; border-radius: var(--r-blob); background-color: var(--orange); box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); }
.prose ol { counter-reset: n; list-style: none; padding-inline-start: 0; }
.prose ol li { position: relative; padding-inline-start: 42px; margin-bottom: 0.7em; }
.prose ol li::before { counter-increment: n; content: counter(n); position: absolute; inset-inline-start: 0; top: 0; width: 28px; height: 28px; border-radius: var(--r-blob); background-color: var(--indigo); color: #fff; display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; font-size: 0.9rem; }
.prose strong, .prose b { font-weight: 700; }
.prose a { color: var(--orange-deep); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.prose table { width: 100%; border-collapse: collapse; margin: 0 0 1.4em; font-size: 0.98rem; }
.prose th, .prose td { padding: 11px 14px; text-align: start; border: var(--line); }
.prose thead th { background-color: var(--indigo); color: #fff; font-family: var(--font-display); }
.prose blockquote { margin: 1.2em 0; padding: 14px 20px; border-inline-start: 5px solid var(--orange); background: rgba(255,155,41,0.12); border-radius: 0 var(--r-daub-sm) var(--r-daub-sm) 0; font-style: italic; }

.article-h1 { font-size: clamp(2rem, 4.5vw, 3rem); margin-bottom: 12px; }
.article-meta { color: var(--ink-soft); font-size: 0.9rem; margin-bottom: 20px; font-weight: 600; }
.answer-box {
  background-color: var(--paper); background-image: none;
  border: var(--line-strong); border-inline-start: 6px solid var(--orange);
  border-radius: 0 var(--r-daub-md) var(--r-daub-md) 0;
  padding: 18px 22px; margin: 0 0 26px; font-size: 1.1rem; box-shadow: var(--raise-sm);
}
.answer-box b { font-family: var(--font-display); color: var(--orange-deep); }

.toc {
  background-color: var(--paper); background-image: none; border: var(--line);
  border-radius: var(--r-daub-md); padding: 18px 22px; margin: 0 0 28px; box-shadow: var(--raise-sm);
}
.toc b,
/* 2.4.10 remediation 2026-08-26 — the TOC title is a real <h2>. The overrides keep
   the previous <b> rendering: .prose h2 would otherwise apply a clamped 1.5–2.05rem
   size, weight 800 and a 1.4em margin. Zero visual change is intended. */
.toc h2 { font-family: var(--font-display); font-size: 1.1rem; display: block; margin-bottom: 8px; }
.toc h2 { font-weight: 700; margin-top: 0; line-height: 1.15; text-shadow: none;
          color: inherit; letter-spacing: normal; }
.toc ol { counter-reset: t; list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.toc ol li { counter-increment: t; padding-inline-start: 0; }
.toc ol li::before { content: counter(t) ". "; color: var(--orange-deep); font-weight: 700; }
.toc a { color: var(--ink); font-weight: 600; text-decoration: none; }
.toc a:hover { color: var(--orange-deep); }

/* Aside */
.prose-aside { display: grid; gap: 16px; align-content: start; }
@media (min-width: 960px) { .prose-aside { position: sticky; top: calc(var(--header-h) + 16px); } }
.aside-card {
  background-color: var(--white); background-image: none; border: var(--line);
  border-radius: var(--r-daub-md); box-shadow: var(--raise-sm); padding: 20px;
}
.aside-card > b { font-family: var(--font-display); font-size: 1.2rem; display: block; margin-bottom: 8px; text-shadow: var(--emboss); }
.aside-card p { color: var(--ink-soft); font-size: 0.92rem; margin: 0 0 14px; }
.aside-card .btn { width: 100%; margin-bottom: 10px; min-height: 50px; }
.aside-cta { background-color: var(--paper); }
.hoods { display: flex; flex-wrap: wrap; gap: 8px; }
.hood { display: inline-flex; align-items: center; gap: 5px; font-size: 0.86rem; font-weight: 600; background: var(--cream); padding: 5px 12px; border-radius: var(--r-daub-sm); box-shadow: var(--raise-sm); }
.hood svg { width: 14px; height: 14px; color: var(--orange-deep); }
.svc-mini-list { display: grid; gap: 8px; }
.svc-mini { display: block; padding: 10px 14px; border-radius: var(--r-daub-sm); background: var(--cream); box-shadow: var(--raise-sm); transition: transform var(--dur), background-color var(--dur); }
.svc-mini:hover { transform: translateX(-3px); background: var(--amber); }
.svc-mini b { font-family: var(--font-display); font-size: 1rem; display: block; }
.svc-mini span { font-size: 0.82rem; color: var(--ink-soft); }

.area-group { margin-bottom: 34px; }
.area-group h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.5rem, 3vw, 2rem); margin-bottom: 16px; text-shadow: var(--emboss); }

/* Guides grid */
.guides-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.guide-card {
  display: flex; flex-direction: column; gap: 8px; padding: 24px 22px;
  background-color: var(--white); background-image: none; border: var(--line);
  border-radius: var(--r-daub-md); box-shadow: var(--raise-sm);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.guide-card:hover { transform: translateY(-4px) rotate(-0.3deg); box-shadow: var(--raise); }
.guide-cat { align-self: flex-start; font-family: var(--font-display); font-weight: 700; font-size: 0.72rem; letter-spacing: 0.06em; background: var(--indigo); color: #fff; padding: 4px 12px; border-radius: var(--r-daub-sm); }
.guide-card b,
/* 2.4.10 remediation 2026-08-26 — card titles are now real <h3> headings.
   These declarations reproduce the previous <b> rendering exactly: the global
   h1–h6 rules would otherwise apply --font-heading, font-weight 800, --text-2xl
   and a letter-spacing the <b> never had. Zero visual change is intended. */
.guide-card h2,
.guide-card h3 { font-family: var(--font-display); font-size: 1.32rem; line-height: 1.15; text-shadow: var(--emboss); }
.guide-card h2,
.guide-card h3 { font-weight: 700; margin: 0; color: inherit; letter-spacing: normal; }
.guide-ex { color: var(--ink-soft); font-size: 0.92rem; flex: 1; }
.guide-card .svc-link { color: var(--orange-deep); }

/* ---------- Reveal on scroll ---------- */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity 0.6s var(--ease), transform 0.6s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
.reveal-d1 { transition-delay: 0.07s; }
.reveal-d2 { transition-delay: 0.14s; }
.reveal-d3 { transition-delay: 0.21s; }

/* ---------- Scroll progress bar ---------- */
.scroll-beam { position: fixed; top: 0; inset-inline-start: 0; height: 4px; width: 0; z-index: calc(var(--z-header) + 2);
  background: var(--grad-warm); border-radius: 0 3px 3px 0; pointer-events: none; transition: width 0.12s linear; }

/* ---------- Call-first CTAs ---------- */
.ltr { direction: ltr; unicode-bidi: embed; white-space: nowrap; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 6px; }
.btn-call { font-size: clamp(1.2rem, 2.2vw, 1.4rem); min-height: 62px; padding: 14px 36px; }
.btn-call .ltr { font-variant-numeric: tabular-nums; }

/* Sticky mobile call bar */
.call-bar {
  position: fixed; bottom: 0; inset-inline: 0; z-index: var(--z-float);
  display: none; gap: 10px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  background-color: var(--paper); background-image: none;
  border-top: var(--line-strong);
  box-shadow: 0 -12px 28px -14px rgba(41,37,36,0.45);
}
.call-bar .btn { flex: 1; min-height: 52px; font-size: 1.1rem; padding: 10px 14px; }
@media (max-width: 760px) {
  .call-bar { display: flex; }
  .wa-float { display: none; }
  body { padding-bottom: 78px; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .main-nav { display: none; }
  .header-cta .btn-outline { display: none; }
  .burger { display: block; }
  /* only the burger menu on small screens: hide the masthead links,
     pin the slim header (logo + call + burger) from the very top */
  .masthead-nav { display: none; }
  .site-header { transform: none; }
  body { padding-top: var(--header-h); }
}
@media (min-width: 1025px) { .mobile-menu { display: none; } }
@media (max-width: 640px) {
  .hero-ctas .btn, .cta-ctas .btn { flex: 1 1 100%; }
  .footer-bottom { justify-content: center; text-align: center; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .marquee-track { animation: none; }
}


/* ══════════════════════════════════════════════════════════════
   AUDIT FIXES — appended 2026-07-19
   Additive only. No content hidden, no selectors removed.
   ══════════════════════════════════════════════════════════════ */

/* F1 — mobile menu must work without JS.
   10Web delays main.js, so the first burger tap had no effect.
   :target opens the drawer with zero JS; the JS toggle still works on top. */
.mobile-menu:target {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
}
.mobile-menu:target nav a {
	transform: none !important;
	opacity: 1 !important;
}

/* F9 — header CTA tap target (was 42px) */
.header-cta .btn,
.header-cta .btn-cta {
	min-height: 44px;
}

/* F3 — footer links were 20px tall; 12px block padding brings them to 44px */
.footer-grid a {
	display: inline-block;
	padding-block: 12px;
	padding-inline: 2px;
	min-height: 44px;
}
.footer-bottom a {
	display: inline-block;
	padding-block: 10px;
	min-height: 44px;
}
@media (max-width: 767px) {
	.footer-grid ul { gap: 0; }
}

/* F4 — cap the reading measure at ~68ch (was 93ch at 1440) */
.prose {
	max-width: 760px;                    /* fallback for browsers without ch */
	max-inline-size: min(68ch, 100%);    /* 68ch alone is 413px — wider than a
	                                        310px mobile container, so cap it */
	min-width: 0;
}

/* F6 — /areas/ city chips were a 2,042px single column on mobile */
@media (max-width: 560px) {
	.chips {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}
	.chips .chip {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 48px;
		text-align: center;
	}
}

/* Section rhythm — every .section sat at a uniform 52px, so nothing
   signalled relative importance. Vary density instead of cutting copy. */
.section {
	padding-block: clamp(40px, 6vw, 72px);
}
.section.bg-paper {
	padding-block: clamp(32px, 5vw, 56px);
}
/* Close control for the mobile drawer (works with :target and with JS) */
.mobile-menu .menu-close {
	position: absolute;
	top: 22px;
	inset-inline-end: 22px;
	width: 46px;
	height: 46px;
	display: grid;
	place-items: center;
	font-size: 1.5rem;
	line-height: 1;
	border-radius: var(--r-daub-sm, 10px);
	background-color: var(--paper, #f6f7f8);
	box-shadow: var(--raise-sm, 0 2px 6px rgba(0,0,0,.15));
	color: var(--ink, #292524);
}

/* ══════════════════════════════════════════════════════════════
   ROUND 2 FIXES — 2026-07-19
   ══════════════════════════════════════════════════════════════ */

/* 1 — Dead 64px band between header and hero.
   body already offsets the fixed header; .site-main added a second offset. */
.site-main,
#main.site-main {
	padding-top: 0 !important;
}

/* 2 — Text was ink-on-ink and invisible.
   The palette rework made --indigo identical to --ink, so headings inside the
   dark bands inherited a dark colour from the legacy heading rules. */
.cta-band,
.cta-band h2,
.cta-band h3,
.cta-band p {
	color: #fff !important;
}
.svc-card,
.svc-card .svc-name,
.svc-card .svc-body,
.svc-card .svc-body p {
	color: #fff !important;
}
.svc-card .svc-name {
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}
.svc-card .svc-link {
	color: var(--orange) !important;
}

/* 3 — Contact row: the mockup's second column is a lead form we do not have,
   so the single info column was sitting in a half-empty two-column grid. */
.contact-grid {
	grid-template-columns: 1fr;
}
.contact-grid > .contact-aside {
	width: 100%;
}
@media (min-width: 900px) {
	.contact-grid > .contact-aside {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 0;
	}
	.contact-grid .info-card {
		border-top: 0;
		border-inline-start: var(--line);
	}
	.contact-grid .info-card:first-child {
		border-inline-start: 0;
	}
}

/* 4 — Real photos replace the placeholder blocks in the service cards. */
.svc-card img.ph {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	background: none;
}
.svc-card img.ph::after {
	content: none;
}

/* ══════════════════════════════════════════════════════════════
   ROUND 3 FIXES — 2026-07-19
   ══════════════════════════════════════════════════════════════ */

/* 1 — Mobile hero was spilling 44px off the left edge.
   .hero-copy sized itself to its widest child (the CTA buttons, 394px) inside
   a 310px container. body has overflow-x:clip, so it silently clipped instead
   of scrolling — the copy read as pushed off-centre. */
@media (max-width: 767px) {
	.hero .hero-inner,
	.hero .hero-copy {
		max-width: 100%;
		min-width: 0;
	}
	.hero .hero-copy > * {
		max-width: 100%;
	}
	.hero .hero-copy h1,
	.hero .hero-sub {
		overflow-wrap: break-word;
	}
	/* Direction-agnostic: with wrap + 100% basis the buttons stack whether the
	   container resolves to row or column, so neither can spill off-screen. */
	.hero .hero-ctas {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: stretch;
		gap: 12px;
	}
	.hero .hero-ctas > .btn {
		flex: 1 1 100%;
		width: 100%;
		max-width: 100%;
		min-width: 0;
		padding-inline: 16px;
	}
}

/* 2 — Article table of contents.
   The <ol> had list-style:none with no inline padding, so the numbering never
   rendered; the box itself also overflowed the viewport on mobile. */
.toc {
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
.toc ol {
	list-style: none;
	counter-reset: toc;
	padding-inline-start: 0;
	margin: 0;
}
.toc ol > li {
	counter-increment: toc;
	display: flex;
	align-items: baseline;
	gap: 10px;
	padding-block: 6px;
	max-width: 100%;
}
.toc ol > li::before {
	content: counter(toc);
	flex: 0 0 auto;
	min-width: 1.6em;
	height: 1.6em;
	display: inline-grid;
	place-items: center;
	font-family: var(--font-display, inherit);
	font-weight: 700;
	font-size: 0.82rem;
	line-height: 1;
	color: #fff;
	background-color: var(--orange, #C25205);
	border-radius: 50%;
}
.toc ol > li > a {
	min-width: 0;
	overflow-wrap: break-word;
}

/* 3 — Nothing may exceed its container and clip off-screen again. */
.container > *,
.prose > *,
.section-head > * {
	max-width: 100%;
}

/* ══════════════════════════════════════════════════════════════
   ROUND 4 — container overflow on article + header CTA
   ══════════════════════════════════════════════════════════════ */

/* Grid/flex children default to min-width:auto, so a wide child forces the
   track wider than the container instead of shrinking. */
.prose-wrap,
.prose-wrap > *,
.prose-aside,
.prose-aside > * {
	min-width: 0;
	max-width: 100%;
}
.prose-wrap {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
}
@media (min-width: 1024px) {
	.prose-wrap {
		grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
		align-items: start;
	}
	.prose-aside {
		position: sticky;
		top: 84px;
	}
}
.prose-aside {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 18px;
}

/* Header CTA: logo + phone button + burger measured 392px inside a 350px
   container. Trim the button on narrow screens so nothing clips. */
@media (max-width: 767px) {
	.site-header .container {
		gap: 10px;
	}
	.header-cta {
		min-width: 0;
		flex-shrink: 1;
	}
	.header-cta .btn {
		padding-inline: 12px;
		font-size: 0.92rem;
		min-width: 0;
	}
	.logo {
		font-size: 1.25rem;
	}
}
/* superseded by the 344px rule in Round 9 */


/* Editorial imagery on service and city pages */
.svc-figure,
.city-figure {
	margin: 0 0 clamp(22px, 3vw, 34px);
	max-width: 100%;
	border-radius: var(--r-daub-md, 14px);
	overflow: hidden;
	box-shadow: var(--raise-sm, 0 6px 18px rgba(41,37,36,.16));
	background-color: var(--paper, #F6F7F8);
}
.svc-figure img,
.city-figure img {
	display: block;
	width: 100%;
	height: clamp(200px, 34vw, 380px);
	object-fit: cover;
}
.city-figure figcaption {
	padding: 12px 18px;
	font-size: 0.92rem;
	color: var(--ink, #292524);
	border-top: var(--line, 1px solid rgba(41,37,36,.14));
}

/* ══════════════════════════════════════════════════════════════
   ROUND 6 — service cards rebuilt as photo-on-top cards
   Overlaying the title and body on the photo kept producing collisions
   (absolute title clipped the body; in-flow title overlapped it). Separating
   image from text removes the whole class of bug and reads far clearer.
   ══════════════════════════════════════════════════════════════ */
.svc-card {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	min-height: 0;
	height: 100%;
	overflow: hidden;
	color: var(--ink, #292524);
	background-color: var(--paper, #F6F7F8) !important;
	isolation: isolate;
}
.svc-card::before,
.svc-card::after {
	content: none !important;
}

/* Photo: normal flow, fixed ratio, no more absolute overlay */
.svc-card img.ph,
.svc-card .ph {
	position: static !important;
	inset: auto !important;
	z-index: auto !important;
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transform: none !important;
	border-radius: 0;
	flex: 0 0 auto;
}

/* Title below the photo, on a solid surface */
.svc-card .svc-name {
	position: static !important;
	inset: auto !important;
	color: var(--ink, #292524) !important;
	text-shadow: none !important;
	font-size: clamp(1.25rem, 1.6vw, 1.55rem);
	line-height: 1.15;
	text-wrap: balance;
	padding: 16px 20px 6px;
	margin: 0;
}

.svc-card .svc-body {
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1 1 auto;
	background: transparent !important;
	border-top: 0 !important;
	padding: 0 20px 18px;
}
.svc-card .svc-body p {
	color: var(--ink, #292524) !important;
	opacity: 0.82;
	font-size: 0.97rem;
	line-height: 1.55;
	margin: 0;
}

/* Clearer "read more" affordance */
.svc-card .svc-link {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	align-self: flex-start;
	font-weight: 700;
	color: #fff !important;
	background-color: var(--orange, #C25205);
	padding: 9px 16px;
	border-radius: var(--r-daub-sm, 10px);
	box-shadow: var(--raise-sm, 0 3px 8px rgba(41,37,36,.18));
}
.svc-card .svc-link:hover,
.svc-card .svc-link:focus-visible {
	background-color: var(--orange-deep, #AB4009);
}
.svc-card .svc-link svg {
	width: 16px;
	height: 16px;
}

/* Even card heights in the grid */
.services-grid {
	align-items: stretch;
}
.services-grid > .svc-card {
	height: 100%;
}

/* ══════════════════════════════════════════════════════════════
   ROUND 7 — make the mobile services carousel obviously scrollable
   It was already a scroll-snap carousel, but ::-webkit-scrollbar was hidden
   and the 160px cards left no "peek", so nothing signalled more content.
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
	.services-grid {
		grid-template-columns: repeat(5, min(72vw, 300px));
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: 20px;
		scroll-behavior: smooth;
		gap: 14px;
		padding-bottom: 14px;   /* room for the scrollbar */
		overscroll-behavior-x: contain;
		-webkit-overflow-scrolling: touch;
	}
	.services-grid > .svc-card {
		scroll-snap-align: start;
	}

	/* Show a slim, on-brand scrollbar instead of hiding it */
	.services-grid::-webkit-scrollbar {
		display: block !important;
		height: 6px;
	}
	.services-grid::-webkit-scrollbar-track {
		background: rgba(41, 37, 36, 0.10);
		border-radius: 99px;
	}
	.services-grid::-webkit-scrollbar-thumb {
		background: var(--orange, #C25205);
		border-radius: 99px;
	}
	.services-grid {
		scrollbar-width: thin;
		scrollbar-color: var(--orange, #C25205) rgba(41, 37, 36, 0.10);
	}

	/* Explicit hint so the affordance does not rely on the scrollbar alone */
	.services-grid-hint {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		margin-top: 10px;
		font-size: 0.88rem;
		font-weight: 600;
		color: var(--ink, #292524);
		opacity: 0.72;
	}
}
/* Desktop shows the full grid, so the swipe hint is mobile-only. */
@media (min-width: 768px) {
	.services-grid-hint {
		display: none;
	}
}

/* ══════════════════════════════════════════════════════════════
   ROUND 8 — tighten the mobile hero so the trust strip reaches the fold
   Measured at 390x844: hero 761px tall, so the info squares started at
   y=867 — 23px below the fold. The height came from
   .hero 48/32 padding + .hero-copy 36/190 padding (photo band reserve).
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
	.hero {
		padding-block: 16px 24px;
	}
	.hero .hero-copy {
		padding-top: 8px;
		padding-bottom: clamp(140px, 36vw, 165px);
		gap: 14px;
	}
	.hero .hero-copy h1.disp {
		line-height: 1.05;
	}
	.hero .kicker-light {
		padding-block: 6px;
	}
}

/* ══════════════════════════════════════════════════════════════
   ROUND 9 — universal phone fit (320px → 430px)
   Measured: .hero-ctas .btn-call is white-space:nowrap with a 354px
   max-content width inside a 310px container, so the label spilled outside
   the orange pill on every phone. Buttons must be allowed to wrap; only the
   phone number itself must stay unbroken.
   ══════════════════════════════════════════════════════════════ */
.btn {
	white-space: normal;
	overflow-wrap: break-word;
	text-wrap: balance;
	max-width: 100%;
	min-width: 0;
	/* .btn is inline-flex — without this its children stay on one line no
	   matter what white-space says, which is what pushed the label out of
	   the orange pill. */
	flex-wrap: wrap;
	row-gap: 2px;
}
.kicker-light,
.kicker {
	flex-wrap: wrap;
	max-width: 100%;
	white-space: normal;
}
/* A phone number must never be split across lines */
.btn .ltr,
.ltr {
	white-space: nowrap;
	unicode-bidi: isolate;
}

@media (max-width: 767px) {
	.hero .hero-ctas .btn {
		font-size: clamp(0.95rem, 4.1vw, 1.15rem);
		padding-inline: 14px;
		line-height: 1.25;
		text-align: center;
		justify-content: center;
	}
	/* Header: keep the number visible as long as it fits, shrink instead of hide */
	.site-header .container {
		gap: 8px;
	}
	.logo {
		font-size: clamp(1.05rem, 4.6vw, 1.3rem);
		/* The logo was a shrinking flex item squeezed to 92px while its
		   nowrap sub-label needed 97px. Let the CTA absorb the squeeze. */
		flex: 0 0 auto;
		min-width: max-content;
	}
	.logo small {
		/* Fixed sizing overflowed the logo box by 5px at 360px — scale it. */
		font-size: clamp(0.44rem, 2.1vw, 0.56rem);
		letter-spacing: 0.09em;
		white-space: nowrap;
	}
	.header-cta .btn {
		font-size: clamp(0.78rem, 3.3vw, 0.95rem);
		padding-inline: 10px;
		gap: 6px;
	}
	.header-cta .btn svg {
		width: 15px;
		height: 15px;
		flex: 0 0 auto;
	}
	.call-bar .btn {
		font-size: clamp(0.9rem, 3.8vw, 1.05rem);
		padding-inline: 10px;
	}
	.trust-strip li {
		font-size: clamp(0.86rem, 3.6vw, 1.05rem);
	}
}

/* Only on the very narrowest handsets does the header number give way */
@media (max-width: 344px) {
	.header-cta .btn .ltr {
		display: none;
	}
	.header-cta .btn {
		padding-inline: 12px;
	}
}

/* ══════════════════════════════════════════════════════════════
   ROUND 10 — hero LCP
   The hero was a 1,439 KB JPEG while the page preloaded a different
   73 KB file that the CSS never referenced. Both are fixed: the hero now
   uses a 68 KB image, and phones get a 22 KB 800px version.
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 860px) {
	.hero::before {
		background-image: url(https://locksmithil.com/wp-content/themes/locksmithil/assets/css/../images/ls-hero-mobile.jpg);
	}
}

/* ══════════════════════════════════════════════════════════════
   ROUND 11 — two specificity bugs inside article content
   ══════════════════════════════════════════════════════════════ */

/* 1. TOC numbering sat ON TOP of the link text.
   A legacy rule sets .toc li::before { position: absolute }, which took the
   marker out of the flex flow — my Round-2 marker styling never overrode the
   position, so it rendered over the first characters of each item. */
.toc ol > li::before {
	position: static !important;
	inset: auto !important;
	transform: none !important;
}

/* 2. Buttons inside .prose were unreadable.
   .prose a { color: var(--orange-deep) } is 0,1,1 and beat .btn-cta at 0,1,0,
   so the call button rendered orange-on-orange and the WhatsApp button
   orange-on-green. */
.prose a.btn,
.prose .btn-cta,
.prose .btn-call,
.prose .btn-wa {
	color: #fff !important;
}
.prose a.btn-outline,
.prose a.btn-ink {
	color: var(--ink, #292524) !important;
}
.prose a.btn:hover,
.prose a.btn:focus-visible {
	color: #fff;
}
/* ---------------------------------------------------------------- related pages
   A content-level list of the site's other standalone pages, rendered on the policy
   pages. It exists to satisfy WCAG 2.4.5: the header and footer are one way to reach
   a page, and these pages had no second one. Styled from the existing tokens so it
   reads as part of the page rather than as another navigation bar.

   The underline is not decoration — the links sit in body copy, so colour alone must
   not be what distinguishes them (1.4.1). --orange is the token measured at 4.66:1
   on white, which is the surface this block sits on. */
.related-pages { margin-top: 40px; padding-top: 24px; border-top: var(--line); }
.related-pages__title { font-size: 1.05rem; margin: 0 0 12px; }
.related-pages__list { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0; padding: 0; list-style: none; }
.related-pages__list a { color: var(--orange); text-decoration: underline; text-underline-offset: 3px; font-weight: 700; }

/* ------------------------------------------------------------------ visually hidden
   Text for assistive technology only. Used to give the service-card links their own
   context: seventeen links reading "לפרטים" pointed at seventeen different services,so the name said nothing about where any of them led (2.4.6,and 2.4.4 Link Purpose). The visible text stays first and unchanged,so the accessible name still contains the label a speech-input user would say. Clipped rather than display:none,which would remove it from the accessibility tree along with the screen. */ .sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.logo--img{display:flex;align-items:center;text-shadow:none}.logo--img img{display:block;height:44px;width:auto;background:#fff0}.footer-brand .brand--img{display:inline-block;line-height:0}.footer-brand .brand--img img{display:block;height:64px;width:auto;border-radius:6px}.brand-continuity{font-weight:700;color:var(--cream,#fff)}@media (max-width:768px){.logo--img img{height:36px}.footer-brand .brand--img img{height:52px}}@media (max-width:380px){.logo--img img{height:32px}}