/* Shared compact type scale for public pages and website management. */
:root{--app-body:14px;--app-control:14px;--app-small:12px;--app-card-title:18px;--app-section-title:28px}
html body:is(.homepage,.storefront-body,.admin-body){font-size:var(--app-body);line-height:1.6;--content-size:var(--app-body);--content-link-size:var(--app-control);--card-title-size:var(--app-card-title)}
html body.homepage :is(.capabilities .section-heading h2,.process .process-heading h2,.studio .studio-copy h2){font-size:var(--app-section-title);line-height:1.25;letter-spacing:-.6px}
html body.homepage .hero h1{font-size:clamp(36px,4vw,56px);line-height:1.2}
html body.homepage .hero-heading-frame{text-align:left}
html body.homepage .hero h1{margin-left:0;margin-right:auto}
@media(min-width:1051px){
    html body.homepage .hero-content .site-header{
        left:auto;
        right:calc(min(23%, 260px) - 32px);
        top:98px;
        width:max-content;
        max-width:40%;
    }
    html body.homepage .hero-content .header-inner{justify-content:flex-end}
    html body.homepage .hero-content .primary-nav{flex-wrap:nowrap;justify-content:flex-end;gap:6px}
    html body.homepage .hero-content .primary-nav-link{font-size:13px;padding-inline:8px}
}
@media(min-width:701px){
    /* Size the portrait against the whole hero, rather than the shorter text frame. */
    html body.homepage .hero-heading-frame{position:static}
    html body.homepage .hero-sales-representative{
        bottom:36px;
        right:0;
        width:42%;
        height:calc(100% - 68px);
        max-height:510px;
        object-fit:contain;
        object-position:right bottom;
    }
}
html body.homepage .hero-content .primary-nav-link{font-size:14px}
html body.homepage :is(.capabilities .section-kicker,.process .section-kicker,.studio .section-kicker){font-size:12px}
html body.homepage :is(.capabilities .capability-caption b,.process .process-card h3){font-size:var(--app-card-title)}
html body:is(.homepage,.storefront-body) :is(.capabilities-bottom>a,.process-next>a,.studio .text-link,.capability-card-link),
html body:is(.homepage,.storefront-body) .dh-footer :is(.dh-footer-services-heading>a,.dh-footer-invite>a){font-size:var(--app-control);min-height:44px;padding:10px 18px;gap:10px}
html body:is(.homepage,.storefront-body) .dh-footer .dh-footer-services .dh-footer-title{font-size:var(--app-section-title)}
html body:is(.homepage,.storefront-body) .dh-footer .dh-footer-links h3{font-size:var(--app-card-title)}
html body:is(.homepage,.storefront-body) .dh-footer .dh-footer-invite h3{font-size:24px}
html body:is(.homepage,.storefront-body) .dh-footer :is(.dh-footer-links nav a,.dh-footer-brand p,.dh-footer-service>span:nth-child(2)){font-size:var(--app-body)}
html body:is(.homepage,.storefront-body) .dh-footer .dh-footer-services .dh-footer-eyebrow,
html body:is(.homepage,.storefront-body) .dh-footer :is(.dh-footer-eyebrow,.dh-footer-bottom small,.dh-footer-bottom>a){font-size:var(--app-small)}
html body:is(.homepage,.storefront-body) .dh-footer :is(.dh-footer-brand-line,.dh-footer-bottom>span){font-size:11px}
html body.storefront-body :is(.storefront-benefits p,.storefront-benefits strong,.storefront-product-grid .product-card p,.storefront-empty p,.storefront-service-card p,.detail-summary,.product-description,.specifications th,.specifications td,.recent-product-copy strong,.recent-product-copy>span){font-size:var(--app-body)}
html body.storefront-body :is(.storefront-benefits small,.storefront-count,.storefront-sort>span,.recent-product-copy small,.breadcrumb,.breadcrumb a,.gallery>small,.results-count){font-size:var(--app-small)}
html body.storefront-body :is(.storefront-section-heading h2,.product-info h1){font-size:var(--app-section-title)}
html body.storefront-body :is(.storefront-empty h3,.storefront-service-card h3,.recent-products-heading h2,.product-description h2,.specifications h2){font-size:20px}
html body.storefront-body :is(.storefront-product-grid .product-card h2,.storefront-product-grid .product-card strong){font-size:var(--app-card-title)}
html body.storefront-body .detail-price{font-size:26px}
html body.storefront-body :is(.storefront-filters .btn,.storefront-empty .btn,.storefront-sort select,.storefront-search input,.quiet-link,.storefront-section-heading .quiet-link,.recent-products-heading>a){font-size:var(--app-control)}
html body.storefront-body :is(.storefront-section-heading .eyebrow,.storefront-empty .eyebrow,.recent-products-heading .eyebrow,.service-number){font-size:11px}
html body.admin-body h1{font-size:28px;letter-spacing:-.6px}
html body.admin-body h2{font-size:20px}
html body.admin-body :is(.btn,.text-button,nav a,.form-stack label,.homepage-fields label,.quiet-link){font-size:var(--app-control)}
html body.admin-body :is(.product-name small,.user-identity small,.users-table th,.badge){font-size:var(--app-small)}
html body.admin-body :is(.product-name,.user-identity strong,.users-table td){font-size:var(--app-body)}
@media(max-width:700px){
    :root{--app-section-title:24px}
    html body.storefront-body .dh-footer{text-align:center}
    html body.storefront-body .dh-footer .dh-footer-main{justify-items:center}
    html body.storefront-body .dh-footer .dh-footer-services-heading{flex-direction:column;align-items:center}
    html body.storefront-body .dh-footer :is(.dh-footer-links nav,.dh-footer-service){align-items:center}
    html body.storefront-body .dh-footer :is(.dh-footer-links nav a,.dh-footer-brand-line,.dh-footer-bottom){justify-content:center}
    html body.storefront-body .dh-footer .dh-footer-brand img{margin-inline:auto}
    html body.homepage :is(main,.dh-footer){text-align:center}
    html body.homepage .hero-content{align-items:center;padding-top:20px}
    html body.homepage .hero-brand-lockup{align-self:flex-start;max-width:calc(100% - 60px);justify-content:flex-start;margin:0 auto 0 0;gap:8px;min-height:56px}
    html body.homepage .hero-mark{width:40px;height:44px}
    html body.homepage .hero-wordmark-image{width:clamp(105px,33vw,145px);min-width:0}
    html body.homepage .hero-content .site-header{top:24px;right:0}
    html body.homepage .hero-heading-frame{position:relative;display:flex;align-items:center;min-height:300px;padding-block:24px;isolation:isolate}
    html body.homepage .hero h1{position:relative;z-index:1;width:52%;margin:0 auto 0 0;text-align:left;transform:translateY(-20px)}
    html body.homepage .hero-sales-representative{position:absolute;right:0;bottom:0;width:62%;height:calc(100% - 24px);margin:0;object-fit:contain;object-position:right bottom;z-index:0}
    html body.homepage :is(.capabilities .section-heading,.process .process-heading){justify-items:center}
    html body.homepage :is(.capabilities .capability-caption,.process-card-top,.studio .studio-copy,.capabilities-bottom,.process-next,.contact-actions){align-items:center}
    html body.homepage :is(.capabilities .capability-caption,.process .process-card,.studio .studio-copy,.process .process-card p){text-align:center}
    html body.homepage .process-card-top{flex-direction:column}
    html body.homepage .process-card-number{align-items:center}
    html body.homepage :is(.section-kicker,.process-next>span,.studio-image-note){justify-content:center}
    html body.homepage .studio .studio-image>span.studio-image-label{left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 28px);justify-content:center}
    html body.homepage .dh-footer :is(.dh-footer-services-heading,.dh-footer-main){justify-items:center}
    html body.homepage .dh-footer .dh-footer-services-heading{align-items:center}
    html body.homepage .dh-footer :is(.dh-footer-links nav,.dh-footer-service){align-items:center}
    html body.homepage .dh-footer :is(.dh-footer-links nav a,.dh-footer-brand-line,.dh-footer-bottom){justify-content:center}
    html body.homepage .dh-footer .dh-footer-brand img{margin-inline:auto}
    html body.homepage .hero h1{font-size:clamp(32px,7vw,44px)}
    /* Keep mobile inputs readable without triggering browser focus zoom. */
    html body:is(.storefront-body,.admin-body) :is(input,textarea,select),
    html body.storefront-body :is(.storefront-search input,.storefront-sort select){font-size:16px}
    html body.storefront-body .header-row nav a{font-size:12px}
}