/* R1: approved design alignment and legibility. Motion stays on whole cards. */
.hero-heading{position:relative;display:block}
.hero h1{white-space:normal;font-size:clamp(28px,3.52vw,54px);line-height:1.25}
.hero-line{display:block;white-space:nowrap;overflow-wrap:normal}
.hero-heading>p{position:absolute;right:1.3vw;bottom:2px;margin:0;font-size:clamp(14px,1.6vw,23px);line-height:1.4}
.menu-toggle{display:none}
.nav-contact .icon-svg{width:24px;height:22px;flex-shrink:0}
.contact-pending .icon-svg{width:25px;height:25px;flex-shrink:0}
.works-scroll-cue,.works-control-label{display:none}
.works-toolbar button:disabled{opacity:.3;cursor:default}
.card-heading{padding:10px 5px 8px}
.card-heading h2{font-weight:400}
.hero-cards{margin-left:20px}
.card-stage{height:clamp(250px,24vw,355px)}
.design-card{width:clamp(142px,14.05vw,210px)}
.design-card[data-pos="0"]{transform:translate(-130%,-45%) rotate(-15deg) scale(.93)}
.design-card[data-pos="2"]{transform:translate(30%,-45%) rotate(15deg) scale(.93)}

.section-layout{grid-template-columns:minmax(0,28fr) minmax(0,72fr)}
.works-section .section-layout{grid-template-columns:minmax(0,25fr) minmax(0,75fr)}
.faq-section{grid-template-columns:minmax(0,43fr) minmax(0,57fr)}
.service-copy{padding:8px 14px 16px}
.service-card h3,.price-card h3{font-size:clamp(12px,1.23vw,18px);letter-spacing:0;word-break:keep-all;overflow-wrap:normal;line-height:1.6}
.service-copy p,.price-card>p:not(.amount){font-size:clamp(11px,.94vw,14px);line-height:1.8;line-break:strict;overflow-wrap:normal}
.price-card{display:flex;flex-direction:column;align-items:stretch;padding-inline:14px}
.price-card .line-icon{margin-bottom:10px}
.price-card .amount{margin-top:auto;padding-top:12px}
.price-card details{margin-top:0}
.service-copy p br,.price-card>p:not(.amount) br{display:none}
.icon-svg{display:inline-block;vertical-align:middle}
@media(min-width:801px){
 .hero,.site-header{width:79%}
 .site-header{padding-top:12px;padding-bottom:6px}
 .hero{min-height:clamp(318px,31vw,450px);padding-block:18px 38px}
 .hero-cards{left:12px}
 .hero-copy .eyebrow{margin-bottom:12px}
 .hero-heading{margin-bottom:12px}
 .hero .intro{margin-bottom:16px;line-height:1.7}
 .hero .filled{min-height:40px;padding-block:8px}
 .hero-note{margin-top:14px}
 .hero-shell .scroll-hint{bottom:10px}
 .service-copy{padding-bottom:14px}
 .service-section .wrap{width:80%}
 .price-card{padding-block:16px 12px}
 .price-card .line-icon{height:32px;margin-bottom:8px}
 .price-card h3{margin-bottom:8px}
 .price-card .amount{font-size:20px;margin:8px 0;margin-top:auto;padding-top:8px}
 .price-card summary{min-height:34px;padding-block:5px}
}
@media(min-width:801px) and (max-width:1150px){
 .service-grid{gap:12px}
 .service-copy{padding-inline:10px}
 .price-card{padding-inline:10px}
 .service-card h3,.price-card h3{font-size:clamp(12px,1.28vw,13px);letter-spacing:0}
}
@media(max-width:800px){
 body{font-size:15px;line-height:1.9}
 .js .menu-toggle:not([hidden]){display:block}
 .hero h1{font-size:clamp(30px,6.7vw,48px);line-height:1.5}
 .hero-heading>p{font-size:clamp(13px,2.8vw,20px);bottom:4px;right:0}
 .hero .intro{font-size:15px;line-height:1.95;margin-bottom:22px}
 .hero-note{font-size:12px;line-height:1.85;margin-top:16px}
 .hero-cards{margin:24px 0 14px}
 .card-stage{height:320px;max-width:500px}
 .design-card{width:clamp(128px,29vw,185px)}
 .design-card[data-pos="0"]{transform:translate(-137%,-44%) rotate(-13deg) scale(.9)}
 .design-card[data-pos="2"]{transform:translate(37%,-44%) rotate(13deg) scale(.9)}
 
 
 .card-heading h2{font-size:clamp(11px,2.55vw,16px)}
 .card-heading p{font-size:clamp(9px,1.8vw,11px)}
 .section-layout,.works-section .section-layout{grid-template-columns:minmax(0,1fr)}
 .faq-section{grid-template-columns:minmax(0,1fr)}
 .section-intro>p:not(.eyebrow),.faq-intro>p:not(.eyebrow),.contact-section>div>p:not(.eyebrow){font-size:15px;line-height:1.95}
 .button,.price-card summary{font-size:14px;min-height:46px;letter-spacing:.04em}
 .service-card h3,.price-card h3{font-size:18px;line-height:1.6;overflow-wrap:normal}
 .service-copy p,.price-card>p:not(.amount){font-size:14px;line-height:1.9}
 .pricing-note,.process-note,.works-disclosure,.contact-section>div>p.contact-note{font-size:12px;line-height:1.85;letter-spacing:.025em}
 .price-card{padding:24px 20px}
 .price-card .amount{margin-top:14px;padding-top:0;font-size:25px}
 .price-card details{width:100%;max-width:280px;margin:0 auto;font-size:14px}
 .works-scroll-cue{display:block;font-size:13px;line-height:1.8;color:#ead8bf;letter-spacing:.03em;padding:0 0 15px}
 .works-toolbar{position:static;justify-content:flex-end;gap:12px;margin-bottom:14px;pointer-events:auto}
 .works-toolbar button{width:auto;min-width:88px;height:44px;font-size:15px;padding:6px 12px;color:#f4e5ca;line-height:1.5}
 .works-control-label{display:inline}
 .work-list{gap:18px;scroll-padding-inline:2px;scrollbar-width:auto;padding-bottom:18px}
 .work-card{flex-basis:42%}
 .work-card h3{font-size:14px;line-height:1.85;margin-top:12px;letter-spacing:.02em;line-break:strict}
 .work-card p{font-size:12px;line-height:1.85;margin-top:6px}
 .process-steps h3{font-size:17px}
 .process-steps p{font-size:13px;line-height:1.85}
 .faq-list summary{font-size:14px;line-height:1.85;min-height:58px}
 .faq-list details>p{font-size:14px}
 .site-footer nav{font-size:13px}
 .site-footer>small{font-size:12px}
 .contact-pending{display:flex;width:fit-content;max-width:100%;padding:12px 16px}
}
@media(max-width:520px){
 .hero{padding-top:24px;padding-bottom:48px}
 .hero h1{font-size:7.35vw;line-height:1.5;letter-spacing:.03em}
 .hero-heading>p{font-size:3.1vw;bottom:3px}
 .hero-cards{margin-top:22px}
 .card-stage{height:clamp(270px,77vw,310px)}
 .design-card{width:32.5vw;min-width:0;max-width:169px}
 .card-heading{padding:8px 3px 7px;min-height:24%}
 .card-heading h2{font-size:2.7vw;letter-spacing:0}
 .card-heading p{font-size:2.2vw;letter-spacing:0}
 .service-card{grid-template-columns:minmax(0,40fr) minmax(0,60fr)}
 .service-copy{padding:12px}
 .service-card h3{font-size:16px;word-break:keep-all;line-break:strict;overflow-wrap:normal}
 .service-copy p{font-size:14px;line-height:1.9}
 .service-card>img{height:100%;min-height:165px;object-fit:cover}
 .work-card{flex-basis:43%}
 .process-steps h3{font-size:18px}
 .process-steps p{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.design-card{transition:none!important}}
