/* Shared page edges follow the homepage's image and text alignment. */
:root{--site-image-edge:20px;--site-text-inset:26px;--site-copy-edge:calc(var(--site-image-edge) + var(--site-text-inset))}
body.editorial-page .wrap{width:100%;max-width:none;padding-inline:var(--site-copy-edge)}
body.editorial-page :is(.design-packages,.design-studio,.catalog-section,.shop-collection,.case-grid,.case-visual-story,.target-product-row,.retail-trim-library,.pdp,.pdp-real-work,.related-shapes,.enterprise-program-hero,.enterprise-operations).wrap{padding-inline:var(--site-image-edge)}
body.editorial-page :is(.studio-heading,.catalog-section>.section-heading,.shop-toolbar,.pdp-real-work>.section-heading,.related-shapes>.section-heading,.retail-trim-library>.section-heading,.enterprise-operations-heading){padding-inline:var(--site-text-inset)}
body.editorial-page :is(.design-preview-note,.design-package-scroll-cue,.design-extra-work,.design-timing-note,.catalog-note,.studio-end){margin-inline:var(--site-text-inset)}
body.editorial-page .studio-row--closing{width:100%;max-width:none}
body.editorial-page .family-knit-grid{max-width:none}
/* Full-bleed features keep their existing image-to-copy composition. */
body.editorial-page .retail-finishing-page .retail-finishing-hero.wrap{padding-inline:0}
body.editorial-page .catalog-cta>.wrap{max-width:none;padding-inline:var(--site-copy-edge)}
body.editorial-page .service-design-copy{padding-inline:var(--site-copy-edge)}
/* Preserve the approved Products page and homepage navigation edges. */
body.shopping-overview :is(.products-categories,.product-customization,.bestsellers).wrap{padding-inline:var(--site-image-edge)}
body.shopping-overview :is(.product-customization-heading,.bestsellers-heading){padding-inline:var(--site-text-inset)}
body.editorial-page :is(.site-header,.site-footer).wrap{padding-inline:3.4vw}
@media(max-width:1100px){body.editorial-page :is(.site-header,.site-footer).wrap{padding-inline:25px}}
@media(max-width:800px){:root{--site-image-edge:14px;--site-text-inset:10px}}
@media(max-width:580px){
 :root{--site-image-edge:10px;--site-text-inset:12px}
 body.editorial-page :is(.site-header,.site-footer).wrap{padding-inline:22px}
}

/* Equal header actions stay together without crowding the wordmark. */
body .site-header .main-nav{gap:20px}
body .site-header .main-nav>a{white-space:nowrap}
.site-header .nav-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:330px;flex:none}
.site-header .nav-actions .button{width:100%;min-height:42px;padding:10px 12px;white-space:nowrap}
@media(max-width:1200px){
 body .site-header{position:relative}
 body .site-header .menu-toggle{display:block}
 body .site-header .main-nav{display:none;position:absolute;top:100%;left:0;right:0;z-index:20;background:var(--paper);border-block:1px solid var(--line);padding:25px;flex-direction:column;align-items:stretch;gap:14px;font-size:12px;max-height:calc(100dvh - 90px);overflow-y:auto}
 body .site-header .main-nav.open{display:flex}
 body .site-header .main-nav>a{padding:5px 0}
 .site-header .nav-actions{width:100%;max-width:360px;margin-top:6px}
}
@media(max-width:420px){
 .site-header .nav-actions{grid-template-columns:1fr;max-width:none}
}

/* A shared headline scale and copy edge across every page family. */
:root{--site-title-size:clamp(42px,4.6vw,68px);--site-title-leading:1.04;--site-title-tracking:-.04em}
body.editorial-page main h1,
body.editorial-page main :is(.home-opening-copy,.service-design-copy,.catalog-opening-copy,.case-intro,.service-hero-copy,.products-intro,.retail-finishing-hero-copy,.flapjack-intro-copy,.collection-overview-copy,.pdp-summary,.work-intro,.builder-opening-copy,.enterprise-program-copy) h1,
body.editorial-page .project-page .project-intro h1{font-size:var(--site-title-size);line-height:var(--site-title-leading);letter-spacing:var(--site-title-tracking);font-weight:700;text-transform:uppercase}
body.editorial-page main :is(.service-hero-copy,.service-design-copy,.enterprise-program-copy,.collection-overview-copy,.flapjack-intro-copy) h1{margin-bottom:22px}
body.editorial-page main :is(.collection-overview-copy,.flapjack-intro-copy,.enterprise-program-copy){padding-inline:var(--site-text-inset)}
body.editorial-page main .service-hero-copy{padding-inline:var(--site-copy-edge)}
body.editorial-page main :is(.service-hero-copy,.service-design-copy,.enterprise-program-copy,.collection-overview-copy,.flapjack-intro-copy)>p:not(.eyebrow){margin-bottom:28px}
body.editorial-page main .pdp-summary h1{font-size:clamp(38px,3.4vw,52px)}
/* White space frames the campaign image after the neutral best-seller block. */
body.shopping-overview .products-build-break{margin:var(--site-image-edge);width:calc(100% - var(--site-image-edge) * 2)}
body.shopping-overview .products-build-inner.wrap{padding-inline:var(--site-text-inset)}
.services-page .service-design-art{overflow:hidden}
@media(max-width:580px){:root{--site-title-size:42px}body.editorial-page main .pdp-summary h1{font-size:38px}}

/* The supplied flapjack brim extends right: keep it in the category crop on both surfaces. */
.home-products-image img.category-flapjack-photo,
.shopping-page .products-category-image img.category-flapjack-photo{object-position:75% 50%}

/* Keep text arrows monochrome on phones as well as desktop. */
html{font-variant-emoji:text}
