/* Shared layout polish. Keep page content, catalogue and business rules intact. */
:root{--page-gutter:clamp(20px,4vw,56px);--section-space:clamp(48px,6vw,80px)}
html{scroll-padding-top:110px}
body{overflow-wrap:break-word}
main,section,article,form,fieldset,dialog{min-width:0}
input,select,textarea{max-width:100%;min-width:0}
button,summary,.button,.primary,.order-button,.business-jumps a,.operations-nav a,.customer-actions a,.shop-tabs a,.real-product-link{min-height:44px}
button{line-height:1.45}
button,.button,.primary{max-width:100%;white-space:normal}
summary{align-content:center}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),select{min-height:44px}
input[type=checkbox],input[type=radio]{width:20px;height:20px;flex:none;accent-color:var(--green)}
label:has(>input[type=checkbox]),label:has(>input[type=radio]){min-height:44px;line-height:1.6;gap:10px;align-content:center}
input[type=file]{width:100%;overflow:hidden}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--gold,#95642c);outline-offset:3px}
.skip-link{position:fixed;top:10px;left:20px;z-index:10001;transform:translateY(-160%);padding:12px 18px;border-radius:6px;background:var(--green,#062c25);color:#fff;box-shadow:0 2px 10px #0003}
.skip-link:focus{transform:none}
main#home>.real-products{max-width:calc(1240px + var(--page-gutter)*2);padding-inline:var(--page-gutter);margin-block:var(--section-space)}
main#home>:is(.collections,.seasonal,.story,.how,.contact,.follow){padding-inline:var(--page-gutter);padding-block:var(--section-space)}
.real-products>p,.hero-description,.shop-lead,.customer-welcome{line-height:1.75}
.real-product-link{display:inline-flex;align-items:center;padding-block:8px}
.real-product-card figcaption{font-size:12px;line-height:1.5}
.text-link,.shop-card a,.photo-guide-actions a,.journey-cart-link{min-height:44px;display:inline-flex;align-items:center}
.shop-main,.customer-main,.studio,.admin-main,.business-main,.orders-main{padding-inline:var(--page-gutter)}
.shop-two,.shop-two>*,.workspace>*,.line-layout>*,.business-heading>*,.business-section-heading>*,.shop-admin-grid>*,.order-metrics>*{min-width:0}
.customer-main>section{margin-top:32px}
.customer-main>section>h2{margin-bottom:16px}
.shop-form label:has(>input[type=checkbox]){display:flex;align-items:flex-start;padding-block:8px}
.shop-form label>input[type=checkbox]{margin:2px 0 0}
.shop-two ol{padding-left:22px;line-height:1.8}
.shop-two li+li{margin-top:10px}
.business-section-heading{flex-wrap:wrap;align-items:flex-start}
.business-section-heading label{min-width:0;max-width:100%;flex-wrap:wrap}
.business-section-heading input{max-width:100%}
.business-main .business-section-heading h2{margin-bottom:0}
.business-section-heading+*{margin-top:20px}
:where(.table-wrap,.business-tabs,.order-tabs){max-width:100%;min-width:0;overscroll-behavior-inline:contain}
.table-wrap:focus-visible{outline-offset:2px}
.business-main .business-wrap{overflow-wrap:anywhere}
.preview-heading h2,.paint-heading h2{min-width:0;overflow-wrap:break-word}
.preview-heading button,.paint-heading button,.dialog-close,.close-dialog{min-width:44px;min-height:44px;flex:none;display:inline-grid;place-items:center}
dialog{max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;scroll-padding-block:24px}
body:has(dialog[open]){overflow:hidden}
dialog .dialog-close{top:8px;right:8px}
dialog:has(>.dialog-close)>h2{padding-right:36px}
#line-3d-dialog,#basket-paint-dialog,#basket-art-dialog,#stock-dialog,#finance-editor{max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px)}
#line-3d-dialog{width:min(1050px,calc(100vw - 32px))}
.line-tools,.zoom-tools,.choice-row,.step-actions,.journey-actions,.preview-bottom{flex-wrap:wrap}
.choice-row>*{min-width:0}
.paint-settings,.paint-settings>*{min-width:0}
@media(max-width:1050px){
 body.has-sidebar>.commerce-nav{padding-inline:20px;gap:12px}
 .topbar-intro{flex:1;min-width:0}
 body.has-sidebar>.commerce-nav a.mobile-brand{min-width:0;flex-shrink:1}
 body.has-sidebar>.commerce-nav .mobile-brand .official-logo{width:170px;max-width:100%}
 .commerce-nav nav.utility-nav{flex:none;gap:6px}
 .sidebar-toggle,.sidebar-close{width:44px;height:44px;min-width:44px}
 .site-sidebar{padding-top:max(20px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}
 .has-sidebar .preview-panel,.has-sidebar .line-editor{top:100px}
}
@media(max-width:800px){
 .has-sidebar .preview-panel,.has-sidebar .line-editor{position:relative;top:0}
 .has-sidebar .hero{grid-template-columns:1fr;gap:32px;padding-inline:var(--page-gutter)}
 .has-sidebar .hero h1{font-size:clamp(54px,11vw,80px)}
 .has-sidebar .studio-invitation{margin:32px var(--page-gutter) var(--section-space);padding:28px 24px}
 .shop-grid,.shop-admin-grid{gap:20px}
 .studio-intro{margin-bottom:28px}
}
@media(max-width:700px){
 :root{--page-gutter:20px}
 body.has-sidebar>.commerce-nav{padding:12px 16px;gap:8px}
 .topbar-intro{gap:8px}
 body.has-sidebar>.commerce-nav .mobile-brand .official-logo{width:145px}
 .commerce-nav .utility-link,.commerce-nav .nav-orders{width:44px;min-width:44px;padding:10px!important}
 .commerce-nav nav.utility-nav,.commerce-nav [data-account-nav]{gap:4px}
 .site-sidebar{width:min(320px,calc(100vw - 24px))}
 .site-sidebar .side-link,.site-sidebar .utility-link{font-size:14px!important;min-height:48px}
 .site-sidebar .sidebar-label{font-size:10px}
 .site-sidebar .sidebar-footer>a{min-height:44px;font-size:13px}
 .shop-main{padding-block:32px 56px}
 .customer-main{margin-block:32px 56px}
 .studio,.admin-main,.business-main{padding-top:28px;padding-bottom:56px}
 .orders-main{margin-block:28px 56px}
 .hero h1,.customer-main h1,.admin-main h1,.business-heading h1,.shop-main h1{overflow-wrap:break-word}
 .shop-main h1,.customer-main h1,.admin-main h1,.business-heading h1{font-size:clamp(36px,10vw,48px);line-height:1.12}
 p,.shop-main p,.customer-welcome,.real-product-copy p,.shop-card p{font-size:15px;line-height:1.75}
 .hero .hero-description,.studio-invitation p:not(.eyebrow),.line-example-copy p,.line-guided .photo-guide p,.line-guided .photo-guide li,.line-journey-card p,.line-journey-card li{font-size:14px;line-height:1.75}
 .hint,.photo-note,.example-note,.landing-fine-print,.preview-disclaimer,.step-instruction,.customer-main .support-info{font-size:12px!important;line-height:1.7}
 .eyebrow,.hero .eyebrow{font-size:10px;line-height:1.6;letter-spacing:1.5px}
 .shop-form label,.contact label,.line-journey-card label{font-size:14px;line-height:1.6}
 input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),select,textarea,.shop-form textarea,.photo-guide textarea{font-size:16px}
 .contact form>p,.contact form .form-note{font-size:12px}
 .contact form{padding:24px 18px}
 .contact-options>*>div{min-width:0;overflow-wrap:anywhere}
 .shop-panel,.customer-project,.business-main .admin-card{padding:20px 16px}
 .customer-empty,.shop-empty{padding:24px 18px}
 .real-products{margin-block:48px}
 .real-products h2{font-size:clamp(30px,8.5vw,38px)}
 .real-product-grid{margin-block:24px;gap:24px}
 .real-product-copy{padding:22px 20px}
 .real-product-view{min-height:44px}
 .shop-card>div{padding:24px 20px}
 .line-art-landing .line-example-copy,.studio-landing .line-example-copy,.line-example-copy{padding:24px 18px}
 .line-art-landing .line-example-copy h2,.studio-landing .line-example-copy h2{font-size:clamp(30px,9vw,38px)}
 .example-stage{padding-inline:12px}
 .example-tabs{width:auto;justify-content:center;flex-wrap:wrap;border-radius:16px}
 .example-tabs button{padding:10px 12px;font-size:12px}
 .landing-steps{grid-template-columns:1fr;gap:0}
 .landing-steps>span{font-size:13px;padding-block:14px}
 .studio-model-heading{flex-wrap:wrap}
 .business-heading,.admin-heading,.orders-head{flex-wrap:wrap;gap:16px}
 .business-heading p,.business-main .admin-card>p,.business-status{font-size:13px}
 .business-main button:not(.primary):not(.quiet):not(.dialog-close),.business-tabs button,.operations-nav a{font-size:12px}
 .business-metrics .stat,.order-metrics>div{padding:16px 12px}
 .business-metrics .stat strong{font-size:23px}
 .business-form-grid,.two-col{gap:16px 12px}
 .business-section-heading{gap:16px}
 .business-section-heading label{width:100%;max-width:100%;display:flex;align-items:center;justify-content:flex-start}
 .business-section-heading input{width:100%;max-width:180px}
 .stat-row{grid-template-columns:1fr}
 .order-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 .shop-admin-nav{position:static;gap:8px}
 .shop-admin-nav a{padding:10px 6px;min-height:44px;align-content:center}
 .studio-footer,.site-footer{padding:24px var(--page-gutter);gap:16px;line-height:1.7}
 .studio-footer a,.site-footer a,footer>div a{min-height:44px;display:inline-flex;align-items:center}
 dialog{padding:24px 18px}
 #line-3d-dialog,#basket-paint-dialog,#basket-art-dialog,#stock-dialog,#finance-editor{padding:24px 16px}
 .preview-heading h2,#basket-paint-dialog h2{font-size:27px}
 #line-3d-viewport{height:48dvh;min-height:200px}
 .paint-footer{position:static}
 .paint-settings{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .paint-heading{gap:8px}
 .paint-stage{padding:12px}
 .line-guided #line-journey button,.basket-steps button{font-size:12px;min-height:56px}
 .line-guided .photo-guide,.line-guided .line-journey-card{padding:24px 16px}
 .step-content{padding-inline:16px}
 .step summary{padding-inline:16px}
 .step-actions,.journey-actions{gap:12px;align-items:stretch}
 .step-actions button,.journey-actions button{min-height:48px}
 .step-actions .primary,.journey-actions .primary{font-size:13px}
 .filters button{min-height:44px;font-size:12px}
 .values{gap:12px 18px;line-height:1.6}
}
@media(max-width:380px){
 .shape-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .basket-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
 .business-form-grid,.two-col,.paint-settings{grid-template-columns:minmax(0,1fr)}
 .paint-settings>*{grid-column:1/-1}
 .preview-spec{flex-wrap:wrap}
 .business-metrics{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.skip-link{transition:none}}
