/*
Theme Name: Glen’s Gutter Cleaning Studio
Version: 1.0
*/
body{margin:0}
.mockup{--ink:#102338;--base:#fff;--wash:#edf2f5;--accent:#ff9445;--accent-ink:#172636;--night:#102338;--heading:"Arial",sans-serif;color:var(--ink);background:var(--base);font:17px/1.6 Arial,sans-serif}
.mockup :is(h1,h2,h3){font-family:var(--heading);font-weight:700;letter-spacing:-.04em;line-height:1.03;margin:0 0 .55em;text-wrap:balance}
.mockup h1{font-size:clamp(3rem,8vw,8rem)}
.mockup h2{font-size:clamp(2rem,4.9vw,4.3rem)}
.mockup h3{font-size:clamp(1.2rem,2.3vw,2rem)}
.mockup p{margin:0 0 1.15em;max-width:64ch}
.mockup a{color:inherit;text-underline-offset:.18em}
.mockup figure{margin:0}
.mockup .wp-block-image img{width:100%;height:auto;display:block;object-fit:cover}
.mockup .wp-block-columns{gap:clamp(1.3rem,4vw,4rem);align-items:center;margin-bottom:0}
.mockup .wp-block-column{min-width:0}
.mockup .wp-block-buttons{gap:.65rem;flex-wrap:wrap}
.mockup .wp-block-button__link{background:var(--accent);color:var(--accent-ink);border-radius:0;padding:.72em 1.15em;font-size:1rem;font-weight:bold;text-decoration:none}
.mockup .wp-block-button:nth-child(2) .wp-block-button__link{border:1px solid currentColor;background:transparent;color:inherit}
.mockup :focus-visible{outline:3px solid currentColor;outline-offset:4px}
.mockup .site-head{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.65rem 5vw;border-bottom:1px solid #8884;background:white;color:#102338}
.mockup .brand img{width:clamp(92px,11vw,146px)}
.mockup .site-head p{margin:0;font-weight:bold;white-space:nowrap}
.mockup .main-nav{font-size:.95rem;font-weight:bold}
.mockup .wp-block-navigation__responsive-container.is-menu-open{background:white;color:#102338;padding:2rem}
.mockup .band{padding:clamp(2.4rem,7vw,7rem) max(5vw,calc((100% - 1320px)/2))}
.mockup .hero{padding-top:clamp(2rem,6vw,5rem);padding-bottom:clamp(2rem,6vw,5rem)}
.mockup .hero-copy>p:first-child{font-size:.75rem;font-weight:bold;letter-spacing:.14em}
.mockup .hero-copy>p:nth-of-type(2){font-size:clamp(1rem,1.6vw,1.35rem)}
.mockup .hero img{aspect-ratio:1.18;object-fit:cover}
.mockup .answers,.mockup .information,.mockup .photo-band{background:var(--wash)}
.mockup .answers{padding-block:clamp(1.8rem,4vw,3.6rem)}
.mockup .answers h2{font-size:clamp(1.5rem,3vw,2.8rem)}
.mockup .answer{border-top:2px solid currentColor;padding-top:1.2rem}
.mockup .services{display:grid;gap:1rem}
.mockup .service{padding:clamp(1rem,3vw,2.2rem);background:var(--wash);min-width:0}
.mockup .service p,.mockup .answer p,.mockup .site-foot p:last-child{margin-bottom:0}
.mockup .service img{aspect-ratio:2.05;margin-bottom:1.4rem}
.mockup .method img,.mockup .flow img,.mockup .property img,.mockup .photo-band img,.mockup .coverage img{aspect-ratio:1.62}
.mockup .flow,.mockup .final{background:var(--night);color:white}
.mockup .information table{width:100%;table-layout:fixed;border-collapse:collapse}
.mockup .information :is(th,td){border:0;border-bottom:1px solid #8886;text-align:left;vertical-align:top;padding:clamp(.6rem,2.3vw,1.5rem);overflow-wrap:anywhere}
.mockup .information th{background:var(--night);color:white}
.mockup .faq details{border-bottom:1px solid #8886;padding:.9rem 0}
.mockup .faq summary{cursor:pointer;font-weight:bold}
.mockup .faq details p{margin:.65em 0}
.mockup .gallery{padding-block:clamp(1.2rem,4vw,3rem)}
.mockup .gallery img{aspect-ratio:1.6}
.mockup .site-foot{background:#101a21;color:#fff;padding:clamp(2rem,6vw,5rem) 5vw}
.mockup .site-foot .wp-block-columns{align-items:start}
.mockup .site-foot .brand{display:inline-block;background:white;padding:.3rem .6rem;margin-bottom:.7rem}
.mockup .site-foot ul{padding:0;list-style:none;margin:0}
.mockup .site-foot h3{font-size:1.3rem}
.design-1 .hero{background:var(--night);color:#fff}
.design-1 .hero .wp-block-column:first-child{flex:0 1 48%}
.design-1 .hero img{border-bottom:8px solid var(--accent)}
.design-1 .services{grid-template-columns:repeat(12,1fr)}
.design-1 .service{grid-column:span 3;border-top:4px solid #b8c6ce}
.design-1 .service:nth-child(1),.design-1 .service:nth-child(4){grid-column:span 6;background:var(--night);color:white;border-color:var(--accent)}
.design-1 .method{background:#f8f9fa}
.design-1 .coverage .wp-block-buttons{margin-top:1rem}
.design-2{--ink:#1d2421;--wash:#eef1ea;--accent:#c8fc47;--accent-ink:#1d2421;--night:#202822;--heading:"Arial Black",Arial,sans-serif}
.design-2 .hero{background:var(--accent)}
.design-2 .hero h1{font-size:clamp(3rem,7vw,7rem);letter-spacing:-.075em}
.design-2 .hero .wp-block-button:first-child .wp-block-button__link{background:var(--ink);color:white}
.design-2 .hero img{aspect-ratio:1;clip-path:polygon(12% 0,100% 0,100% 86%,87% 100%,0 100%,0 13%)}
.design-2 .flow img{clip-path:polygon(0 0,100% 0,87% 100%,0 100%)}
.design-2 .services{grid-template-columns:repeat(4,1fr)}
.design-2 .service:nth-child(-n+2){grid-column:span 2}
.design-2 .service:nth-child(2){background:var(--ink);color:white}
.design-2 .service:nth-child(5){background:var(--accent)}
.design-2 .property .wp-block-columns{align-items:start}
.design-2 .property img{margin-bottom:1rem}
.design-2 .coverage{background:var(--accent)}
.design-2 .coverage .wp-block-button__link{background:var(--ink);color:#fff}
.design-2 .site-foot{border-top:10px solid var(--accent)}
.design-3{--ink:#243c33;--base:#f8f4e9;--wash:#efe6d4;--night:#243c33;--accent:#e4be79;--accent-ink:#243c33;--heading:Georgia,serif}
.design-3 :is(h1,h2,h3){font-weight:400}
.design-3 .hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:1rem}
.design-3 .hero-copy{position:relative;z-index:1;margin-right:-24%;padding:clamp(1rem,3vw,3rem);background:var(--base)}
.design-3 .hero img{aspect-ratio:.98;border-radius:48% 48% 0 0}
.design-3 .property img,.design-3 .method img,.design-3 .coverage img{border-radius:48%}
.design-3 .photo-band{display:grid;grid-template-columns:3fr 2fr;align-items:center;gap:clamp(1rem,4vw,4rem);background:var(--night);color:white}
.design-3 .services{grid-template-columns:1.25fr 1fr}
.design-3 .service{background:transparent;border-top:1px solid currentColor}
.design-3 .service:first-child{grid-row:span 3;background:var(--wash);border:0}
.design-3 .service:first-child img{border-radius:50% 50% 0 0;aspect-ratio:1.05}
.design-3 .coverage{background:white}
.design-3 .final{text-align:center}
.design-3 .final p{margin-inline:auto}
.design-3 .final .wp-block-buttons{justify-content:center}
.design-3 .site-foot{background:var(--night);border-top:1px solid #e4be79;color:#faf3e2}
.design-3 .site-foot>.wp-block-group{margin-bottom:2rem}
@media(prefers-reduced-motion:no-preference){.design-3 .wp-block-button__link{transition:transform .18s ease}.design-3 .wp-block-button__link:hover{transform:translateY(-3px)}}
@media(max-width:900px){.design-1 .service{grid-column:span 6}.design-2 .services{grid-template-columns:repeat(2,1fr)}.mockup .site-foot .wp-block-columns{flex-wrap:wrap!important}.mockup .site-foot .wp-block-column{flex-basis:44%!important}.mockup .main-nav .wp-block-navigation__responsive-container-open{display:flex}.mockup .main-nav .wp-block-navigation__responsive-container:not(.is-menu-open){display:none}}
@media(max-width:650px){.mockup .site-head{padding-inline:4vw}.mockup .site-head p{font-size:.83rem}.mockup .hero .wp-block-columns{flex-direction:column}.design-2 .hero .wp-block-columns{flex-direction:column-reverse}.mockup .hero .wp-block-column{width:100%;flex-basis:auto!important}.mockup .wp-block-columns{align-items:stretch}.design-3 .hero,.design-3 .photo-band{grid-template-columns:1fr}.design-3 .hero-copy{margin:0;padding:0}.design-3 .hero img{aspect-ratio:1.36}.design-3 .service:first-child{grid-row:auto}.design-3 .services{grid-template-columns:1fr}.mockup .service{overflow-wrap:anywhere}.mockup .information table{font-size:.91rem}}
@media(max-width:370px){.design-1 .service,.design-1 .service:nth-child(1),.design-1 .service:nth-child(4){grid-column:span 12}.design-2 .services{grid-template-columns:1fr}.design-2 .service:nth-child(-n+2){grid-column:auto}.mockup .site-foot .wp-block-column{flex-basis:100%!important}}
.mockup .illustrations{padding-block:1.25rem;background:var(--wash)}
.mockup .illustrations h2{font-size:1.2rem}
.mockup .illustrations p{font-size:.95rem;margin-bottom:0}
.mockup .main-nav .wp-block-navigation__container{gap:clamp(1.1rem,2.4vw,2.2rem)}
.mockup .main-nav .is-menu-open .wp-block-navigation__container{gap:1rem}
.design-2 .property .wp-block-column:nth-child(3) img{object-position:68% center}
.design-3 .site-head .brand{position:absolute;left:50%;transform:translateX(-50%)}
.design-3 .site-head{min-height:clamp(3.4rem,5.6vw,5.2rem)}
@media(max-width:650px){.design-3 .site-head .brand img{width:78px}}