/* Measurements from Figma Desktop 1:4. Natural document flow allows reflow. */
:root{--ink:#181a1b;--paper:#f5f5ee;--red:#f51a0d;--yellow:#f7ea2f}
body{font-family:Inter,Arial,Helvetica,sans-serif}
.review-demo-note{font-size:13px;color:var(--muted);margin:10px 0 18px}
.review-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:32px}
.review-card{margin:0;padding:24px;border:1px solid #dedfd4;border-radius:8px;background:#fffef9;box-shadow:0 4px 16px #181a1b0a;display:flex;flex-direction:column}
.review-stars{color:#8b6800;font-size:20px;letter-spacing:3px}
.review-card blockquote{margin:16px 0 24px;font-size:16px;line-height:1.6}
.review-card figcaption{margin-top:auto;font-weight:700;font-size:14px}
.review-card figcaption span{display:block;font-weight:400;font-size:13px;color:var(--muted);margin-top:4px}
@media(max-width:760px){.review-grid{grid-template-columns:1fr;gap:16px}.review-card{padding:20px}}
.work-carousel{position:relative;margin-top:20px;margin-bottom:26px;touch-action:pan-y}
.work-slide{margin:0}.work-slide[hidden]{display:none}.work-slide img{display:block;max-width:100%;width:auto;height:clamp(260px,45vw,510px);object-fit:contain;margin-inline:auto;border-radius:8px;box-shadow:0 8px 24px #181a1b26}
.work-slide figcaption{padding:12px 18px;color:#f5f5ee;font-size:14px}
.carousel-controls{display:flex;align-items:center;justify-content:center;padding:12px 0 0;gap:12px}
.carousel-controls>button{position:absolute;top:calc((100% - 48px)/2);transform:translateY(-50%);width:44px;height:44px;border:1px solid #181a1b26;border-radius:50%;font-size:28px;background:#f5f5eeeb;color:var(--ink);cursor:pointer;box-shadow:0 3px 12px #181a1b26;z-index:1}
#previous-photo{left:12px}#next-photo{right:12px}
.carousel-controls>button{display:grid;place-items:center;padding:0;font-size:0;line-height:1}
.carousel-controls>button::before{content:'';position:absolute;left:50%;top:50%;width:9px;height:9px;border-top:2px solid currentColor;border-right:2px solid currentColor}
#previous-photo::before{transform:translate(calc(-50% + 2px),-50%) rotate(-135deg)}
#next-photo::before{transform:translate(calc(-50% - 2px),-50%) rotate(45deg)}
.carousel-controls>button:hover{background:#e4e5da}.slide-dots{display:flex;gap:0;flex-wrap:wrap;justify-content:center}
.slide-dot{height:36px;width:30px;border:0;cursor:pointer;background:transparent;padding:0;position:relative}
.slide-dot:after{content:'';display:block;width:8px;height:8px;border-radius:50%;background:#969b91;margin:auto}.slide-dot[aria-pressed=true]:after{background:var(--red);width:11px;height:11px}
.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-request{margin-top:20px}#text-request .actions{margin-top:12px}#copy-message{border:1px solid #9a9f95;background:white;color:var(--ink)}
.brand{display:flex;align-items:flex-start;gap:12px;color:white;text-decoration:none;margin-left:-21px;margin-top:-7px}
.header-inner>a:first-child{text-decoration:none}
.mascot{width:94px;height:102px;object-fit:contain;flex:none}
.brand-copy{display:flex;flex-direction:column;padding-top:3px}
.brand-title{font-family:'Iosevka Charon','Arial Narrow',Impact,sans-serif;font-size:42px;font-style:italic;font-weight:900;-webkit-text-stroke:.55px currentColor;white-space:nowrap;line-height:1.2}
.brand-subtitle{font-family:'Istok Web',Arial,sans-serif;font-style:italic;font-weight:700;color:var(--red);font-size:24px;line-height:1.1}
.brand-subtitle em{color:var(--yellow)}
.header-phone{display:flex;align-items:center;gap:5px}
.art-button{display:inline-flex;align-items:center;justify-content:center;padding:0;background:none;border:0;border-radius:8px;cursor:pointer;min-height:44px;flex:none}
.art-button img{display:block;max-width:none}
.art-button{position:relative;color:white;font-family:Inter,Arial,sans-serif;font-size:15px;font-weight:500;text-decoration:none}
.art-button>span{position:absolute;left:39px;right:8px;text-align:center;pointer-events:none;white-space:nowrap}
.art-button[data-quote]>span{color:#ffffffbf;left:43px;font-size:16px}
.art-button:hover{filter:brightness(1.12)}
.quote-banner{background-image:linear-gradient(#181a1bcc,#181a1bcc),url('assets/BottomGrassImage.png')}
.hero{background-position:center;background-size:cover}
.service-icon img,.benefit-icon img{display:block;max-width:none}
.service-icon,.benefits article>.benefit-icon{display:flex;align-items:center;min-height:41px}
@media(max-width:760px){.brand{margin:0;gap:8px}.mascot{width:64px;height:auto}.brand-title{font-size:30px}.brand-subtitle{font-size:18px}.header-inner{flex-wrap:wrap}.header-phone{margin-left:auto}}
@media(max-width:440px){.header-phone{margin-left:0}.brand-title{font-size:30px}.actions{flex-wrap:wrap}.art-button{flex:none}.quote-inner .actions{flex-wrap:wrap}}
.wrap{width:calc(100% - 33px);max-width:calc(50% + 720px)}
.header-inner{min-height:113px;align-items:flex-start;padding-top:16px}
.logo{width:390px;margin-left:-17px;margin-top:0}
.header-phone{font-size:16px;font-weight:600}
.hero{background-image:linear-gradient(90deg,#181a1b 20%,#181a1b00),url('assets/HeroHousePhoto.png')}
.hero-inner{min-height:384px;padding-block:172px 25px}
.hero-copy{max-width:470px}
h1{font-family:'Instrument Sans',Inter,Arial,sans-serif;font-size:32px;line-height:1.22;letter-spacing:-.6px;margin-bottom:4px}
.desktop-break{display:none}
.hero p{font-size:14px;line-height:1.45;margin-bottom:24px}
.button{min-height:41px;padding:9px 14px;font-size:15px;font-weight:500;border-radius:8px;min-width:201px}
.actions{gap:15px}
.outline{border-color:#e7e7d7;color:#ffffffbf;background:#181a1b80}
.services{padding-block:14px 25px;min-height:223px;column-gap:0}
.services article{padding-inline:33px 20px;position:relative;border:0}
.services article:after{content:'';position:absolute;right:0;top:11px;bottom:0;border-right:1px solid #b8bbb3}
.services article:last-child:after{display:none}
.service-icon{height:40px;font-size:35px}
.services h2{font-size:15px;margin:0 0 4px}
.services ul{font-size:14px;line-height:1.2;margin-bottom:0}
.text-link{display:none}
.why{min-height:169px;padding-block:15px 18px}
.why h2{font-size:24px;margin-bottom:18px}
.benefits{gap:0;grid-template-columns:repeat(4,1fr)}
.benefits article:not(:first-child){padding-left:33px}
.benefits article>span{font-size:32px;display:block;height:36px}
.benefits h3{font-size:14px;margin:0 0 5px}
.benefits p{font-size:14px;line-height:1.25}
.work{padding-block:15px 0;min-height:153px}
.reviews{padding-block:15px 0;min-height:183px}
.work h2,.reviews h2{font-size:18px;margin-bottom:0}
.pending{min-height:90px}
.pending p{font-size:13px}
.quote-banner{padding-block:23px;min-height:102px}
.quote-inner{width:calc(100% - 33px);max-width:calc(50% + 720px)}
.header-inner .brand{margin-left:0}
.quote-inner h2{font-size:24px}
footer{min-height:113px;padding-block:30px}
.footer-brand{font-family:'Iosevka Charon','Arial Narrow',Arial,sans-serif;font-size:16px;letter-spacing:0}
@media(max-width:1000px) and (min-width:761px){.quote-inner{width:calc(100% - 100px)}.quote-inner .actions{flex-wrap:nowrap}.quote-inner .button{min-width:180px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.header-inner{min-height:100px;padding-block:16px;align-items:center}.logo{width:260px;margin:0}.hero-inner{padding-block:140px 25px}.hero-copy{max-width:470px}.services{row-gap:24px}.services article{padding-inline:20px}.services article:nth-child(even):after{display:none}.services article:nth-child(odd){padding-left:0}.benefits{gap:24px;grid-template-columns:repeat(2,1fr)}.benefits article:not(:first-child){padding-left:0}.why{padding-block:24px}.quote-inner{width:calc(100% - 40px)}.quote-inner .actions{flex-wrap:wrap}.work,.reviews{min-height:150px}}
@media(max-width:440px){.header-inner{align-items:flex-start}.logo{width:250px}h1{font-size:30px}.button{min-width:0}.hero{background-image:linear-gradient(90deg,#181a1be8,#181a1b65),url('assets/HeroHousePhoto.png')}.hero-inner{padding-top:100px;min-height:365px}.services article{padding-inline:14px}.services h2{font-size:15px}.quote-inner .actions{width:100%}}
