/* Shared typography and control system. */
:root{--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-6:48px;--text-leading:1.6;--heading-leading:1.15;--label-leading:1.4;--control-leading:1.25;--button-radius:12px}
*,*::before,*::after{letter-spacing:0;word-spacing:0;font-kerning:none}
body{line-height:var(--text-leading)}
h1,h2,h3{overflow-wrap:normal}
.home-hero h1,.home-intro-copy h2,.collection-main h1,.detail-heading h1,.contact-heading h2,.expertise-intro h2,.portfolio-manager h2,.pair-manager h2,.project-manager-main .detail-heading h1{line-height:var(--heading-leading)}
.home-hero h1{font-size:clamp(40px,8.2vw,132px)}
.home-intro-copy p,.home-intro-copy .home-intro-lead,.service-body p,.detail-heading>p,.comparison-intro,.project-file-help,.studio-dialog p{line-height:var(--text-leading)}
.detail-heading,.section-heading{gap:var(--space-3);margin-bottom:var(--space-4)}
.home-intro-copy h2{margin-bottom:var(--space-4)}
.home-intro-copy .home-intro-lead{margin-bottom:var(--space-3)}
.detail-heading .eyebrow,.home-intro-label>.eyebrow,.expertise-intro .eyebrow{margin-bottom:var(--space-2)}
.detail-file{gap:var(--space-1)}
.portfolio-description h3{line-height:var(--heading-leading);margin-bottom:var(--space-1)}
.portfolio-description p{line-height:var(--text-leading);margin-bottom:var(--space-2)}
.eyebrow,.gallery-count,.detail-caption,.portfolio-meta,.loupe-footer{line-height:var(--label-leading)}
.site-header,.detail-page .site-header{min-height:96px;gap:var(--space-3)}
.brand{width:112px;padding:var(--space-1) 0}
.site-nav{display:flex;align-items:center;gap:var(--space-3);margin-left:auto;font-size:.875rem;line-height:var(--control-leading)}
.site-nav a{color:var(--muted);white-space:nowrap;transition:color .2s}
.site-nav a:hover{color:var(--cream)}
.site-nav .current-page{color:var(--orange);white-space:nowrap}
.menu-toggle{display:none}
.site-nav[hidden]{display:none!important}
.header-contact{gap:var(--space-1);line-height:var(--control-leading)}
.header-contact>span{display:contents}
.header-contact:hover>span{color:inherit;background:transparent}
.header-contact .ui-icon{width:18px;height:18px}
.ui-icon{display:inline-block;width:18px;height:18px;flex:0 0 18px;vertical-align:middle;color:currentColor;pointer-events:none;transition:transform .2s ease}
:is(button,.home-button,.portfolio-actions a,.project-view-links a,.collection-links a,.text-link,.header-contact,.back-top){align-items:center;justify-content:center;text-align:center;line-height:var(--control-leading);border-radius:var(--button-radius);text-shadow:none;filter:none}
button{display:inline-flex;gap:var(--space-1)}
:is(.upload-button,.gallery-feedback button,#retry-load,.project-admin-item button,.studio-dialog-actions button,.portfolio-actions a,.project-view-links a){min-height:44px;padding:12px 18px;box-shadow:none;transition:background-color .2s,border-color .2s,color .2s}
:is(.upload-button,.portfolio-actions a,.project-view-links a,.gallery-navigation button,.project-admin-item button,.studio-dialog-actions button):hover{box-shadow:none;text-shadow:none;filter:none;border-color:var(--orange)}
:is(button,a):hover .ui-icon[data-icon=arrow-up-right]{transform:translate(2px,-2px)}
:is(button,a):hover .ui-icon[data-icon=arrow-left]{transform:translateX(-2px)}
:is(button,a):hover .ui-icon[data-icon=arrow-right]{transform:translateX(2px)}
:is(button,a):hover .ui-icon[data-icon=arrow-up]{transform:translateY(-2px)}
:is(button,a):hover .ui-icon[data-icon=arrow-down]{transform:translateY(2px)}
.gallery-navigation button{width:40px;height:40px;padding:0;box-shadow:none}
.gallery-navigation .gallery-remove{width:auto;min-height:40px;padding:10px 14px}
.zoom-pills span{display:flex;align-items:center;justify-content:center;line-height:var(--control-leading);border-radius:var(--button-radius);box-shadow:none}
.zoom-pills input:checked+span{box-shadow:none}
.thumbnail{border-radius:var(--button-radius)}
.thumbnail[aria-pressed=true]{box-shadow:none;outline:2px solid var(--orange);outline-offset:1px}
.thumbnail:hover{box-shadow:none;border-color:var(--orange)}
.thumbnail-label{text-align:center;line-height:var(--label-leading)}
.thumbnail-number{line-height:var(--control-leading);text-align:center}
.portfolio-overlay,.detail-hover-hint,.detail-loupe,.loupe-window{box-shadow:none;text-shadow:none}
.portfolio-card.is-open{outline:1px solid var(--orange);outline-offset:2px}
.detail-target{box-shadow:none}
.detail-target::before{box-shadow:none}
.comparison-handle{box-shadow:none;gap:6px;border-radius:var(--button-radius)}
.comparison-handle .ui-icon{width:18px;height:18px}
.service-toggle-icon{display:flex;margin-left:auto;flex-shrink:0}
.service-toggle-icon .ui-icon[data-icon=minus],details[open] .service-toggle-icon .ui-icon[data-icon=plus]{display:none}
.service-toggle-icon .ui-icon[data-icon=plus],details[open] .service-toggle-icon .ui-icon[data-icon=minus]{display:block}
.contact-heading{justify-content:flex-start}
.contact-heading h2{font-size:clamp(42px,7vw,112px)}
.site-footer a{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);line-height:var(--control-leading)}
.collection-breadcrumb{gap:var(--space-1)}
@media(max-width:1100px){.site-nav{gap:var(--space-2)}}
@media(max-width:900px){.site-header,.detail-page .site-header{min-height:88px}.brand{width:88px}.header-contact{margin-left:auto}.menu-toggle{display:inline-flex;width:40px;height:44px;padding:10px;background:transparent;border:1px solid #ffffff25;border-radius:var(--button-radius)}.menu-toggle .ui-icon{width:20px;height:20px;flex-basis:20px}.menu-toggle .ui-icon[data-icon=close]{display:none}.menu-toggle[aria-expanded=true] .ui-icon[data-icon=menu]{display:none}.menu-toggle[aria-expanded=true] .ui-icon[data-icon=close]{display:block}.site-nav:not([hidden]){display:flex;position:fixed;inset:88px 0 0;z-index:30;margin:0;padding:var(--space-4) var(--pad);align-items:flex-start;justify-content:flex-start;flex-direction:column;gap:var(--space-4);font-size:1.8rem;line-height:var(--heading-leading);background:var(--popup-background);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);overflow-y:auto}}
@media(max-width:720px){.home-hero h1{font-size:clamp(28px,7.5vw,54px)}.contact-heading h2{font-size:clamp(28px,6.2vw,44px)}.detail-heading,.section-heading{gap:var(--space-2);margin-bottom:var(--space-3)}.home-intro-copy h2{margin-bottom:var(--space-3)}}
@media(prefers-reduced-motion:reduce){.ui-icon{transition:none!important;transform:none!important}}
@media(max-width:900px){.site-nav:not([hidden]){display:none}.menu-open .site-nav:not([hidden]){display:flex}}
/* Image-viewer controls share the same corners, stroke and center alignment. */
.comparison-label{display:flex;align-items:center;justify-content:center;min-height:44px;padding:12px 16px;border:1px solid #ffffff40;border-radius:var(--button-radius);font-size:.875rem;line-height:1.25;text-align:center;text-transform:none;background:#11120fcc}
.comparison-handle{width:44px;height:44px;left:var(--split);gap:4px;padding:0;border:1px solid #ffffff70;border-radius:var(--button-radius);box-shadow:none}
.comparison-handle .ui-icon{width:16px;height:16px;flex:0 0 16px;margin:0}
.comparison-divider{width:1px;box-shadow:none;background:#eeeee3b3}
.comparison-view:has(.comparison-range:focus-visible) .comparison-handle{box-shadow:none;outline:2px solid var(--cream);outline-offset:3px}
.gallery-navigation button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;gap:0;padding:0;border-width:1px;border-radius:var(--button-radius)}
.gallery-navigation button .ui-icon{width:18px;height:18px;flex:0 0 18px}
.zoom-pills span{min-height:44px}
@media(max-width:720px){.comparison-label{top:12px;padding:10px 12px;min-height:40px}.comparison-label-before{left:12px}.comparison-label-after{right:12px}}

/* Shared Homepage typeface across public pages, dialogs and management. */
:root{--site-font:Studio,Arial,sans-serif}
body{font-family:var(--site-font)}
button,input,select,textarea,input::file-selector-button{font-family:inherit}
h1,h2,h3,h4,h5,h6,em,.thumbnail-placeholder{font-family:inherit}
.thumbnail-placeholder{font-style:normal}

/* Public navigation shares Homepage's label, control and icon metrics. */
.site-header .brand,.detail-hidden-header .brand{width:105px}
.site-header .site-nav,.detail-hidden-header nav{font-family:var(--site-font);font-size:.875rem;font-weight:400;font-style:normal;line-height:var(--control-leading);gap:clamp(14px,2vw,32px)}
.site-header .header-contact,.detail-hidden-header .header-contact{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:12px 18px;border:1px solid currentColor;border-radius:var(--button-radius);font-family:var(--site-font);font-size:.875rem;line-height:var(--control-leading);text-align:center;background:transparent;color:inherit;box-shadow:none}
.site-header .header-contact:hover,.detail-hidden-header .header-contact:hover{color:var(--orange);border-color:var(--orange)}
.site-header .ui-icon,.detail-hidden-header .ui-icon,.detail-header-toggle .ui-icon{width:18px;height:18px;flex-basis:18px}
.detail-hidden-header a[aria-current=page]{color:var(--orange)}
@media(max-width:900px){.site-header .header-contact,.detail-hidden-header .header-contact{padding:10px 12px}.detail-hidden-header{flex-wrap:wrap}.detail-hidden-header nav{flex:1 1 100%;justify-content:flex-start;gap:16px}.detail-hidden-header .header-contact{margin-right:auto}}
