/* Mobile reading and booking: one clear action, comfortable controls, real page links. */
.ui-arrow{display:inline-block;width:1em;height:1em;flex:0 0 auto;vertical-align:-.125em;overflow:visible}
[hidden]{display:none!important}
html{scroll-padding-top:110px}
main{min-width:0}
input,select,textarea{font-size:16px}
:focus-visible{outline:3px solid #9c4270;outline-offset:4px}
.mobile-booking{display:none}
.mobile-service-links{display:none}
.page-shortcuts{display:flex;flex-wrap:wrap;gap:10px;padding:18px 6%;border-bottom:1px solid var(--line);background:var(--paper)}
.page-shortcuts a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:30px;font-size:14px}
.page-shortcuts a:hover{background:var(--lime)}
.article-summary{font-size:19px;line-height:1.7;padding:24px;border-left:4px solid var(--accent);background:#f5e9e7;margin:25px 0}
.article-related{display:flex;flex-wrap:wrap;gap:12px;margin:25px 0}
.article-related a{padding:12px 16px;border:1px solid var(--line);border-radius:8px;font-size:16px}
.article-index a{min-height:44px;display:flex;align-items:center}
@media(max-width:1000px){
 header{position:sticky;top:0;z-index:30;min-height:88px}
 header .brand-original{width:120px}
 .menu{min-width:48px;min-height:48px;border:1px solid #ffffff38;border-radius:10px}
 header nav.open{max-height:calc(100dvh - 88px);overflow:auto;overscroll-behavior:contain;gap:0;box-shadow:0 20px 30px #241b3333}
 header nav>a{padding:13px 0;border-bottom:1px solid #ffffff20;min-height:48px}
 .mobile-service-links{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 20px}
 .mobile-service-links a{padding:12px;border:1px solid #ffffff38;border-radius:8px;min-height:48px;font-size:16px}
 .menu-open{overflow:hidden}
 .menu-open .mobile-booking{display:none}
}
@media(max-width:750px){
 body{padding-bottom:90px}
 header{padding:9px 5%;gap:12px;min-height:86px}
 header>.button.small{font-size:14px;min-height:44px;padding:10px 12px;gap:8px}
 .topbar{font-size:12px}
 .mobile-booking{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:25;gap:10px;background:var(--ink);padding:12px 5% calc(12px + env(safe-area-inset-bottom));box-shadow:0 -4px 24px #241b331a}
 .mobile-booking>a{min-height:48px;display:flex;align-items:center;justify-content:center;border-radius:9px;font-size:16px}
 .mobile-booking>.mobile-primary{background:var(--lime);color:var(--ink);flex:1;font-weight:700}
 .mobile-booking>[data-contact]{border:1px solid #ffffff60;color:var(--paper);padding:10px 14px}
 .mobile-booking>[aria-disabled=true]{display:none}
 .mobile-cta{display:none!important}
 .vhero{padding:28px 6% 32px;gap:20px}
 .vhero-copy{display:contents}
 .vhero-copy>.eyebrow{grid-row:1;margin:0;font-size:12px;max-width:none}
 .vhero h1{grid-row:2;margin:0;font-size:clamp(42px,10vw,65px);letter-spacing:-1.8px}
 .vhero>.compare-figure{grid-row:3;margin:0;width:100%;max-width:500px;justify-self:center}
 .vhero-copy>p{grid-row:4;margin:0;font-size:17px}
 .vhero .hero-actions{grid-row:5;gap:14px;margin:0}
 .vhero .hero-reasons{grid-row:6;display:flex;flex-wrap:wrap;font-size:14px;gap:7px 18px}
 .vhero .hand-note{grid-row:7;font-size:29px;margin:0}
 .vhero .compare{max-height:390px}
 .vhero .compare-top{font-size:12px;letter-spacing:0}
 .compare-label{font-size:12px}
 .compare-figure figcaption{font-size:12px}
 .page-shortcuts{flex-wrap:nowrap;overflow:auto;gap:8px;padding:12px 6%;scrollbar-width:thin}
 .page-shortcuts a{flex-shrink:0}
 .section{padding:44px 6%}
 .service-subnav{justify-content:flex-start;overflow:auto;gap:12px;padding:12px 6%}
 .service-subnav a{flex-shrink:0;padding:9px 12px;min-height:44px}
 .service-hero{display:flex;flex-direction:column;min-height:0}
 .service-hero>div:first-child{padding:30px 6%}
 .service-hero h1{font-size:clamp(36px,9vw,50px);letter-spacing:-1.4px}
 .service-hero>.service-route-photo{min-height:280px;height:280px}
 .service-card p{font-size:16px}
 .service-card h3{font-size:26px}
 .service-photo{height:210px}
 .service-card-copy{padding:16px 5px}
 .landing-copy{display:flex;flex-direction:column}
 .landing-copy>.eyebrow{order:0}
 .landing-copy>h1{order:1;font-size:clamp(36px,9vw,50px)}
 .landing-copy>.service-route-photo{order:2;margin:0 0 20px}
 .landing-copy>p{order:3}
 .landing-copy>.landing-checks{order:4}
 .landing-copy>.button{order:5}
 .landing-hero{padding:28px 6%;gap:25px}
 .landing-form-wrap{padding:0;background:transparent;scroll-margin-top:100px}
 .landing-form-wrap form,.quote form{padding:25px 20px}
 .lead-form input,.lead-form select,.lead-form textarea{font-size:16px;min-height:48px}
 .lead-form label,.lead-form legend,.lead-form .choices span{font-size:16px}
 .lead-form .choices span{min-height:48px;display:flex;align-items:center;justify-content:center}
 .lead-form .form-note{font-size:14px}
 .form-extra summary,.faq summary,.landing-faq summary{min-height:48px;padding-top:15px;padding-bottom:15px}
 .article{padding:30px 6%}
 .article h1{font-size:clamp(34px,8.5vw,48px);letter-spacing:-1px}
 .article h2{font-size:29px;letter-spacing:-.5px}
 .article p{font-size:17px;overflow-wrap:anywhere}
 .article .byline{font-size:14px}
 .article-summary{padding:18px}
 .sources{overflow-wrap:anywhere}
 .stain-nav button{min-height:44px;font-size:14px}
 footer{padding-bottom:40px}
}
@media(max-width:420px){
 .service-grid{grid-template-columns:1fr}
 .service-photo{height:260px}
 .service-card h3{font-size:30px}
 header>.button.small{font-size:13px}
 header .brand-original{width:110px}
 .landing-header>span{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{transition:none!important;animation:none!important}
}

.seo-breadcrumb{padding:16px 6%;font-size:14px;line-height:1.7;overflow-wrap:anywhere;border-bottom:1px solid var(--line)}
.seo-breadcrumb a{text-decoration:underline;text-underline-offset:3px}

/* Content must reflow, rather than relying on a clipped page overflow. */
main :where(section,article,aside,nav,div,form,fieldset,figure){min-width:0}
:where(h1,h2,h3,p,li,label,legend,summary,.eyebrow,.button,.channel-link){overflow-wrap:anywhere}
.button{max-width:100%;white-space:normal}
.button>span{flex-shrink:0}
.button>span,.channel-link>span{display:inline-flex;align-items:center}
/* Keep the desktop arrow circles at every width; their parent remains clickable. */
.service-card h3>span{width:33px;height:33px;flex-shrink:0;font-size:20px}
.compare-handle>span{width:50px;height:50px;font-size:26px}
.lead-form fieldset{min-inline-size:0;max-width:100%}
.lead-form :where(input,select,textarea){max-width:100%;min-width:0}
.lead-form .choices input{min-height:0}
@media(max-width:750px){
 .vhero{grid-template-columns:minmax(0,1fr)}
 .service-ribbon{white-space:normal;flex-wrap:wrap;justify-content:center;gap:10px 16px;overflow:visible}
 .service-ribbon span{font-size:16px}
 .service-ribbon b{font-size:18px}
 .quote,.pricing,.brand-story,.service-summary,.answer-band,.textile{grid-template-columns:minmax(0,1fr)}
 .lead-form .choices,.landing-form-wrap .choices{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sofa-price-main{flex-wrap:wrap;gap:12px 20px}
 .sofa-price-main>p{flex:1 1 140px}
 .mobile-booking>.mobile-primary{min-width:0;text-align:center;padding:10px}
 .mobile-booking>[data-contact]{flex-shrink:0}
 .brand-story h1{font-size:clamp(36px,8vw,52px);line-height:1.1;letter-spacing:-1px}
 .compare-top{flex-wrap:wrap;gap:8px}
 .landing-header>span{min-width:0;line-height:1.5}
 .page-shortcuts{flex-wrap:wrap;overflow:visible}
 .page-shortcuts a{flex-shrink:1}
 .service-subnav{flex-wrap:wrap;overflow:visible;gap:5px 10px}
 .service-subnav a{flex-shrink:1}
}
@media(max-width:380px){
 header:not(.landing-header)>.button.small{display:none}
 header .menu{margin-left:auto}
 .section h2{font-size:clamp(30px,10vw,38px);letter-spacing:-1px}
 .mobile-booking{gap:8px;padding-left:12px;padding-right:12px}
 .mobile-booking>a{font-size:14px}
 .quote form,.landing-form-wrap form{padding:22px 16px}
}