/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.relative{position:relative}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.block{display:block}.hidden{display:none}.table{display:table}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}}:root{--ink:#11100e;--paper:#f2efe8;--gold:#c8a44d;--muted:#6f6a61;--line:#11100e29;--paint-edge:76px;--font-display:Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;--font-sans:"Helvetica Neue", Helvetica, Arial, sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:var(--font-sans), sans-serif;margin:0;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}img{display:block}.services,.booking-section,.references-section,.contact,footer{isolation:isolate;position:relative}.services:before,.booking-section:before,.booking-section:after,.references-section:before,.contact:before,.hero:after{content:"";z-index:3;left:0;top:calc(var(--paint-edge) * -.47);width:100%;height:var(--paint-edge);background:inherit;pointer-events:none;position:absolute;-webkit-mask-image:url("/showcases/goldcut/assets/brush-edge-mask.png");mask-image:url("/showcases/goldcut/assets/brush-edge-mask.png");-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.booking-section:after{background:#fff;top:auto;bottom:-1px}.site-header{z-index:100;pointer-events:none;padding:14px clamp(8px,1.25vw,18px);position:fixed;top:0;left:0;right:0}.header-shell{color:#fff;pointer-events:auto;background:0 0;border:1px solid #0000;border-radius:22px;grid-template-columns:1fr auto 1fr;align-items:center;width:100%;min-height:78px;margin:0 auto;padding:0 clamp(6px,.7vw,12px);transition:background-color .3s,color .3s,box-shadow .3s,border-color .3s;display:grid}.site-header.is-scrolled .header-shell{min-height:78px;color:var(--ink);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#c8a44df5;border-color:#11100e24;box-shadow:0 14px 38px #11100e2e}.logo-link{align-items:center;width:max-content;display:inline-flex}.header-logo{object-fit:contain;filter:drop-shadow(0 1px 1px #000c);width:70px;height:70px}.brand{font-family:var(--font-display), sans-serif;letter-spacing:.04em;width:max-content;font-size:28px;line-height:1}.brand span{color:var(--gold)}.brand i{margin:0 2px;font-style:normal}nav{letter-spacing:.1em;text-transform:uppercase;gap:34px;font-size:12px;font-weight:800;display:flex}nav a,footer a{transition:color .2s}nav a:hover{color:var(--gold)}.site-header.is-scrolled nav a:hover{color:#fff}.hero{color:#fff;text-align:center;justify-content:center;align-items:center;min-height:100svh;display:flex;position:relative;overflow:hidden}.hero:after{background:var(--paper);top:auto;bottom:-1px}.hero-image,.craft-image{object-fit:cover}.hero-image{object-position:center 52%;filter:saturate(.72)contrast(1.12)brightness(.78);transform:scale(1.01)}.hero-shade{z-index:1;background:linear-gradient(#0a090747 0%,#0a090714 36%,#0000 58%),linear-gradient(#0a09078a,#0a09078a),linear-gradient(#0000 46%,#0a09078f);position:absolute;inset:0}.hero-content{z-index:2;flex-direction:column;justify-content:center;align-items:center;width:100%;padding:clamp(90px,10vw,120px) 24px;display:flex;position:absolute;inset:0}.eyebrow,.section-kicker{color:var(--gold);letter-spacing:.22em;text-transform:uppercase;margin:0 0 22px;font-size:11px;font-weight:800}.hero-brand-name{color:var(--gold);font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;text-shadow:0 4px 24px #00000047;margin:0 0 14px;font-size:clamp(34px,4.2vw,68px);font-weight:400;line-height:.9}h1,h2{font-family:var(--font-display), sans-serif;text-transform:uppercase;letter-spacing:.01em;margin:0;font-weight:400;line-height:.95}h1{font-size:clamp(42px,5.2vw,80px)}h1 em,h2 em{color:var(--gold);font-style:normal}.hero-copy{color:#ffffffd1;max-width:620px;margin:28px auto 34px;font-size:clamp(16px,1.4vw,20px)}.hero-actions{justify-content:center;align-items:center;display:flex}.button{text-transform:uppercase;letter-spacing:.1em;justify-content:center;align-items:center;min-height:54px;padding:0 28px;font-size:12px;font-weight:800;transition:transform .2s,background .2s;display:inline-flex}.button:hover{transform:translateY(-2px)}.button-gold{background:var(--gold);color:var(--ink)}.text-link{text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:800}.text-link span{color:var(--gold);margin-left:8px;font-size:18px}.hero-note{z-index:2;text-align:right;flex-direction:column;display:flex;position:absolute;bottom:52px;right:clamp(24px,4vw,70px)}.hero-note span{color:var(--gold);letter-spacing:.18em;font-size:10px;font-weight:800}.hero-note strong{font-family:var(--font-display);font-size:24px;font-weight:400}.services{padding:clamp(86px,11vw,170px) clamp(24px,7vw,110px)}.contact h2{font-size:clamp(50px,6.8vw,104px)}.services{background:var(--paper);color:var(--ink);text-align:center;padding-top:clamp(52px,6vw,84px);padding-left:clamp(16px,3vw,48px);padding-right:clamp(16px,3vw,48px);scroll-margin-top:106px}.services-heading{max-width:760px;margin:0 auto 50px}.services-heading .section-kicker{margin-bottom:18px}.heading-ornament{background:var(--gold);width:52px;height:1px;margin:27px auto 0;display:block;position:relative}.heading-ornament:before,.heading-ornament:after{content:"";border:1px solid var(--gold);background:var(--paper);width:5px;height:5px;position:absolute;top:-2px;transform:rotate(45deg)}.heading-ornament:before{left:18px}.heading-ornament:after{right:18px}.booking-planner{text-align:left;grid-template-columns:minmax(0,1.18fr) minmax(380px,.82fr);align-items:start;gap:26px;max-width:1240px;margin:0 auto 110px;display:grid}.booking-services,.booking-calendar{background:#fff;border:1px solid #11100e0f;border-radius:28px;box-shadow:0 18px 42px #11100e17}.booking-services{padding:30px}.booking-calendar{padding:30px;position:sticky;top:116px}.booking-panel-title{align-items:center;gap:16px;margin-bottom:30px;display:flex}.booking-panel-title>span{background:var(--gold);border-radius:13px;flex:none;place-items:center;width:42px;height:42px;font-size:11px;font-weight:850;display:grid}.booking-panel-title p{color:#a5660c;letter-spacing:.18em;margin:0 0 3px;font-size:9px;font-weight:850}.booking-panel-title h3{margin:0;font-size:21px;line-height:1.15}.booking-service-group+.booking-service-group{margin-top:28px}.booking-service-group h4{font-family:var(--font-display);text-transform:uppercase;margin:0 0 12px;font-size:25px;font-weight:400}.booking-service-list{border:1px solid #11100e17;border-radius:18px;overflow:hidden}.booking-service{width:100%;min-height:86px;color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:#fff;border:0;border-bottom:1px solid #11100e17;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:18px;padding:16px 18px;transition:background-color .2s,box-shadow .2s;display:grid}.booking-service:last-child{border-bottom:0}.booking-service:hover{background:#fbf7ef}.booking-service.is-selected{z-index:1;box-shadow:inset 4px 0 0 var(--gold);background:#fbf2df;position:relative}.booking-service-copy{flex-direction:column;min-width:0;display:flex}.booking-service-copy strong{font-size:14px;line-height:1.4}.booking-service-copy small{color:#a5660c;margin-top:5px;font-size:10px}.booking-service-facts{white-space:nowrap;align-items:center;gap:12px;font-size:12px;display:flex}.booking-service-facts>span{color:var(--muted)}.booking-service-facts strong{font-size:14px}.booking-select-label{background:var(--ink);color:#fff;text-align:center;text-transform:uppercase;letter-spacing:.06em;border-radius:12px;min-width:88px;padding:9px 12px;font-size:10px;font-weight:800}.booking-service.is-selected .booking-select-label{background:var(--gold);color:var(--ink)}.booking-placeholder{color:var(--muted);text-align:center;border:1px dashed #11100e2e;border-radius:18px;margin:0;padding:44px 20px}.phone-booking{text-align:center;background:#fbf2df;border-radius:18px;padding:30px}.phone-booking p{color:var(--muted);margin:0 0 12px}.phone-booking a{color:#8f5708;font-family:var(--font-display);font-size:30px}.booking-step+.booking-step{margin-top:28px}.booking-step-head{justify-content:space-between;align-items:center;gap:20px;margin-bottom:12px;font-size:11px;display:flex}.booking-step-head span{text-transform:uppercase;letter-spacing:.1em;font-weight:800}.booking-step-head strong{color:var(--muted);font-weight:600}.booking-days{grid-template-columns:repeat(7,1fr);gap:6px;display:grid}.booking-days button{min-width:0;color:var(--ink);cursor:pointer;background:#fff;border:1px solid #11100e1c;border-radius:12px;flex-direction:column;align-items:center;padding:10px 3px;display:flex}.booking-days button span{color:var(--muted);text-transform:uppercase;font-size:9px}.booking-days button strong{margin:3px 0 1px;font-size:17px}.booking-days button small{color:var(--muted);font-size:9px}.booking-days button:hover,.booking-days button.is-selected,.booking-times button:hover,.booking-times button.is-selected{border-color:var(--gold);background:var(--gold);color:var(--ink)}.booking-days button.is-selected span,.booking-days button.is-selected small{color:var(--ink)}.booking-step.is-disabled{opacity:.43}.booking-times{grid-template-columns:repeat(4,1fr);gap:7px;display:grid}.booking-times button{min-height:40px;color:var(--ink);font:inherit;cursor:pointer;background:#fff;border:1px solid #11100e1c;border-radius:11px;font-size:12px}.booking-times button:disabled{cursor:not-allowed}.booking-summary{border-top:1px solid var(--line);margin-top:30px;padding-top:22px}.booking-summary p{grid-template-columns:70px 1fr;gap:12px;margin:0 0 10px;font-size:11px;display:grid}.booking-summary p span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.booking-summary p strong{font-weight:700}.booking-summary>a{background:var(--ink);color:#fff;letter-spacing:.09em;text-transform:uppercase;border-radius:14px;justify-content:center;align-items:center;min-height:50px;margin-top:20px;font-size:11px;font-weight:850;display:flex}.booking-summary>a.is-disabled{opacity:.35;pointer-events:none}.booking-summary>a.is-ready:hover{background:var(--gold);color:var(--ink)}.booking-service:focus-visible,.booking-days button:focus-visible,.booking-times button:focus-visible{outline-offset:-3px;outline:3px solid #c8a44d66}.service-cards{grid-template-columns:minmax(0,1.7fr) minmax(400px,1fr);align-items:start;gap:24px;width:100%;padding:10px 0 28px;display:grid}.service-slider-shell{max-width:1380px;margin:0 auto}.service-side-cards{gap:24px;display:grid}.service-card{box-shadow:none;text-align:left;background:#fff;border:1px solid #11100e0b;border-radius:28px;padding:22px 24px 34px;transition:transform .25s,box-shadow .25s}.service-card:hover{box-shadow:none;transform:translateY(-3px)}.service-card.is-wide{padding-bottom:18px}.service-category-head{align-items:center;margin-bottom:16px;display:flex}.service-card-number{color:#bc7d13;width:46px;height:46px;font-family:var(--font-display);letter-spacing:.06em;border:1px solid #c8a44d94;border-radius:50%;flex:none;place-items:center;font-size:18px;display:grid}.service-category-head h3{font-family:var(--font-display);text-transform:uppercase;margin:0;font-size:28px;font-weight:400;line-height:1}.service-lines{border-top:1px solid var(--line)}.service-line{border-top:1px solid var(--line);grid-template-columns:minmax(0,430px) 64px 52px 96px;align-items:center;column-gap:16px;padding:18px 0;display:grid}.service-card.is-compact{padding:22px 20px 26px}.service-card.is-compact .service-line{grid-template-columns:minmax(0,1fr) 56px 43px 88px;column-gap:9px;padding:16px 0}.service-card.is-compact .service-line-name>strong{font-size:14px;line-height:1.35}.service-card.is-compact .service-line>span{font-size:12px}.service-card.is-compact .service-line>strong{font-size:14px}.service-card.is-compact .service-select{min-height:32px;padding:0 7px;font-size:10px}.service-line:first-child{border-top:0}.service-line-name{flex-direction:column;min-width:0;display:flex}.service-line-name>strong{font-size:16px;line-height:1.45}.service-line-name small{color:#a5660c;margin-top:5px;font-size:11px;font-weight:750}.service-line>span{color:var(--muted);white-space:nowrap;grid-column:2;justify-self:start;font-size:14px}.service-line>strong{color:#a5660c;white-space:nowrap;grid-column:3;justify-self:start;margin-left:0;font-size:16px}.service-select{background:var(--ink);color:#fff;letter-spacing:.05em;text-transform:uppercase;border-radius:12px;grid-column:4;justify-content:center;align-items:center;min-height:34px;margin-left:0;padding:0 10px;font-size:11px;font-weight:800;display:inline-flex}.service-select:hover{background:var(--gold);color:var(--ink)}.booking-section{background:#b9923e;grid-template-columns:minmax(280px,.72fr) minmax(520px,1.28fr);align-items:center;gap:clamp(50px,7vw,110px);padding:clamp(86px,10vw,150px) clamp(24px,7vw,110px);scroll-margin-top:106px;display:grid}.booking-copy .section-kicker{color:var(--ink)}.booking-copy h2{margin:0;font-size:clamp(50px,6.4vw,94px)}.booking-copy h2 em{color:#f4ead0}.booking-copy>p:not(.section-kicker){max-width:440px;margin:28px 0 0}.booking-hours{border-top:1px solid #11100e4d;flex-direction:column;gap:8px;margin-top:44px;padding-top:24px;display:flex}.booking-hours span{letter-spacing:.16em;font-size:9px;font-weight:850}.booking-hours strong{font-size:14px;line-height:1.5}.calendar-card{background:var(--paper);border:1px solid #11100e14;border-radius:28px;padding:clamp(24px,3vw,42px);box-shadow:0 24px 55px #11100e29}.calendar-card-head,.calendar-time-head{justify-content:space-between;align-items:end;gap:24px;display:flex}.calendar-card-head{margin-bottom:22px}.calendar-card-head p{color:#a5660c;letter-spacing:.17em;margin:0 0 4px;font-size:9px;font-weight:850}.calendar-card-head h3,.calendar-time-head h3{margin:0;font-size:20px}.calendar-card-head>span,.calendar-time-head>span{color:var(--muted);font-size:11px;font-weight:650}.calendar-week-nav{align-items:center;gap:8px;display:flex}.calendar-week-nav span{color:var(--muted);white-space:nowrap;font-size:10px;font-weight:700}.calendar-week-nav button{width:30px;height:30px;color:var(--ink);cursor:pointer;background:#fff;border:1px solid #11100e21;border-radius:9px}.calendar-week-nav button:disabled{opacity:.3;cursor:not-allowed}.calendar-days{grid-template-columns:repeat(7,1fr);gap:7px;display:grid}.calendar-days button{min-height:76px;color:var(--ink);cursor:pointer;background:#fff;border:1px solid #11100e1f;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;padding:8px 4px;transition:background-color .2s,border-color .2s;display:flex}.calendar-days button span{color:var(--muted);text-transform:uppercase;font-size:9px}.calendar-days button strong{margin:2px 0;font-size:19px}.calendar-days button small{color:var(--muted);font-size:9px}.calendar-days button.is-closed,.calendar-days button.is-past{opacity:.38;cursor:not-allowed;background:#e5e2dc}.calendar-time-panel{margin-top:30px}.calendar-time-panel.is-disabled{opacity:1}.calendar-time-head{margin-bottom:13px}.calendar-times{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.calendar-times button{min-height:39px;color:var(--ink);font:inherit;cursor:pointer;background:#fff;border:1px solid #11100e1f;border-radius:11px;font-size:11px}.calendar-times button:disabled{cursor:not-allowed;opacity:1;color:var(--muted);background:#fff}.calendar-times button.is-booked{color:#77736c;background:#dedbd5;flex-direction:column;justify-content:center;align-items:center;gap:1px;text-decoration:line-through;display:flex}.calendar-times button.is-past-time{color:#a19d95;background:#e5e2dc}.calendar-times button.is-booked small,.calendar-times button.is-past-time small{letter-spacing:.06em;text-transform:uppercase;font-size:7px;font-weight:800;text-decoration:none}.calendar-days button:not(:disabled):hover,.calendar-days button.is-selected,.calendar-times button:not(:disabled):hover,.calendar-times button.is-selected{border-color:var(--gold);background:var(--gold)}.calendar-days button.is-selected span,.calendar-days button.is-selected small{color:var(--ink)}.calendar-days button:focus-visible,.calendar-times button:focus-visible{outline-offset:2px;outline:3px solid #c8a44d73}.calendar-summary{border-top:1px solid var(--line);grid-template-columns:1fr auto;align-items:center;gap:24px;margin-top:28px;padding-top:22px;display:grid}.calendar-summary>div{flex-direction:column;gap:4px;display:flex}.calendar-summary span{color:var(--muted);letter-spacing:.12em;text-transform:uppercase;font-size:9px;font-weight:800}.calendar-summary strong{font-size:13px}.calendar-summary .calendar-summary-service{color:#a5660c;margin-top:3px}.calendar-summary>button{background:var(--ink);color:#fff;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;border:0;border-radius:12px;grid-column:auto;justify-content:center;align-items:center;min-height:34px;padding:0 10px;font-family:inherit;font-size:10px;font-weight:800;display:inline-flex}.calendar-summary>button.is-disabled{opacity:.35;cursor:not-allowed}.calendar-summary>button.is-ready:hover{background:var(--gold);color:var(--ink)}.customer-details-panel{animation:.34s cubic-bezier(.22,1,.36,1) reviewIn}.customer-details-head p{color:#a5660c;letter-spacing:.17em;margin:0 0 4px;font-size:9px;font-weight:850}.customer-details-head h3{margin:0;font-size:24px}.customer-details-selection{background:var(--paper);border-radius:16px;flex-direction:column;gap:4px;margin:26px 0;padding:18px 20px;display:flex}.customer-details-selection span{color:var(--muted);letter-spacing:.12em;text-transform:uppercase;font-size:9px;font-weight:800}.customer-details-selection strong{font-size:13px}.customer-details-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.customer-details-form label{flex-direction:column;gap:7px;display:flex}.customer-details-form label span{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;font-size:9px;font-weight:800}.customer-details-form input{width:100%;min-height:50px;color:var(--ink);font:inherit;background:#fff;border:1px solid #11100e24;border-radius:12px;padding:0 14px}.customer-details-form textarea{resize:vertical;width:100%;color:var(--ink);font:inherit;background:#fff;border:1px solid #11100e24;border-radius:12px;padding:13px 14px}.customer-details-form input:focus,.customer-details-form textarea:focus{border-color:var(--gold);outline:3px solid #c8a44d59}.customer-details-form>button{border-radius:12px;grid-column:1/-1;justify-self:end;min-height:34px;margin-top:4px;padding:0 10px}.customer-details-form>button:disabled{opacity:.55;cursor:wait}.customer-details-form .customer-note,.customer-details-form .privacy-check,.booking-form-error{grid-column:1/-1}.customer-details-form .privacy-check{grid-template-columns:18px 1fr;align-items:start;gap:10px;display:grid}.customer-details-form .privacy-check input{width:17px;min-height:17px;accent-color:var(--gold);margin:1px 0 0}.customer-details-form .privacy-check span{letter-spacing:0;text-transform:none;font-size:10px;font-weight:600;line-height:1.5}.customer-details-form .privacy-check a{color:#98600d;text-decoration:underline}.details-back{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;margin:0 0 22px;padding:0;font-size:11px;font-weight:750}.booking-form-error{color:#8d271a;background:#f7e4e1;border-radius:10px;margin:0;padding:12px 14px;font-size:12px}.booking-success{text-align:center;flex-direction:column;align-items:center;padding:12px 0 4px;animation:.34s cubic-bezier(.22,1,.36,1) reviewIn;display:flex}.booking-success-icon{background:var(--gold);border-radius:50%;place-items:center;width:60px;height:60px;margin-bottom:22px;font-size:27px;font-weight:900;display:grid}.booking-success>p:first-of-type{color:#9a620d;letter-spacing:.17em;margin:0 0 5px;font-size:9px;font-weight:850}.booking-success h3{margin:0;font-size:29px}.booking-success .customer-details-selection{width:100%}.booking-success-copy{max-width:430px;color:var(--muted);margin:0;font-size:13px;line-height:1.6}.booking-success small{color:var(--muted);margin:16px 0 22px;font-size:9px}.booking-success .service-select{grid-column:auto}.salon-login-page,.salon-portal{min-height:100svh;color:var(--ink);background:#ece9e2}.salon-login-page{place-items:center;padding:30px 20px;display:grid;position:relative}.salon-home-link{color:#5e5a53;font-size:12px;font-weight:750;position:absolute;top:28px;left:30px}.salon-login-card{text-align:center;background:#fff;border-radius:28px;width:min(100%,450px);padding:44px;box-shadow:0 26px 65px #11100e24}.salon-login-card>img{object-fit:contain}.salon-kicker{color:#9a620d;letter-spacing:.17em;margin:14px 0 5px;font-size:9px;font-weight:850}.salon-login-card h1{margin:0;font-size:46px}.salon-login-card>p:not(.salon-kicker){color:var(--muted);margin:10px auto 28px;font-size:13px;line-height:1.55}.salon-login-card form,.salon-block-form{text-align:left;flex-direction:column;gap:16px;display:flex}.salon-login-card label,.salon-block-form label{flex-direction:column;gap:7px;display:flex}.salon-login-card label span,.salon-block-form label span{color:var(--muted);letter-spacing:.11em;text-transform:uppercase;font-size:9px;font-weight:800}.salon-login-card input,.salon-block-form input{min-height:50px;color:var(--ink);font:inherit;background:#fff;border:1px solid #d9d5cd;border-radius:12px;padding:0 14px}.salon-login-card button,.salon-block-form button,.salon-portal button{background:var(--ink);color:#fff;font:inherit;cursor:pointer;border:0;border-radius:11px;font-size:11px;font-weight:800}.salon-login-card form>button,.salon-block-form>button{min-height:48px;margin-top:4px}.salon-error{color:#8d271a;background:#f7e4e1;border-radius:10px;margin:0;padding:11px;font-size:11px}.salon-portal{padding:24px clamp(16px,3vw,46px) 60px}.salon-portal-header{justify-content:space-between;align-items:center;gap:24px;max-width:1540px;margin:0 auto 24px;display:flex}.salon-portal-header>div{align-items:center;gap:15px;display:flex}.salon-portal-header img{object-fit:contain}.salon-portal-header .salon-kicker{margin:0 0 2px}.salon-portal-header h1{margin:0;font-size:34px;line-height:1}.salon-portal-header nav{gap:8px;display:flex}.salon-portal-header button{min-height:39px;padding:0 14px}.salon-portal-header button.salon-secondary{color:var(--ink);background:#fff;border:1px solid #d4cfc5}.salon-toolbar{background:#fff;border-radius:16px;grid-template-columns:1fr auto 1fr;align-items:center;max-width:1540px;margin:0 auto 14px;padding:13px 16px;display:grid}.salon-toolbar>div{gap:6px;display:flex}.salon-toolbar button{min-width:36px;min-height:34px;color:var(--ink);background:#f0ede7;padding:0 10px}.salon-toolbar strong{font-size:14px}.salon-toolbar>span{color:var(--muted);justify-self:end;font-size:11px;font-weight:750}.salon-banner-error{color:#8d271a;background:#f7e4e1;border-radius:12px;max-width:1540px;margin:0 auto 14px;padding:13px 15px;font-size:12px}.salon-banner-notice{color:#315f37;background:#e2eee2;border-radius:12px;max-width:1540px;margin:0 auto 14px;padding:13px 15px;font-size:12px}.salon-desktop-calendar{overscroll-behavior-x:contain;overscroll-behavior-y:auto;background:#fff;border:1px solid #ddd8cf;border-radius:18px;grid-template-columns:62px repeat(7,minmax(130px,1fr));max-width:1540px;margin:0 auto;display:grid;overflow:auto hidden}.salon-time-column{background:#faf9f6;min-width:62px}.salon-grid-corner,.salon-day-column>header{border-bottom:1px solid #ddd8cf;height:66px}.salon-time-labels{flex-direction:column;height:1134px;display:flex}.salon-time-labels span{color:#8b877e;text-align:right;border-bottom:1px solid #ece9e3;flex:0 0 54px;width:100%;height:54px;padding:8px 10px 0 0;font-size:9px;line-height:1;display:block}.salon-day-column{border-left:1px solid #e4e0d9;min-width:130px}.salon-day-column>header{flex-direction:column;justify-content:center;align-items:center;display:flex}.salon-day-column>header span{color:var(--muted);text-transform:uppercase;font-size:9px;font-weight:800}.salon-day-column>header strong{font-size:20px}.salon-day-grid{height:1134px;position:relative;overflow:hidden}.salon-day-grid>span{border-bottom:1px solid #ece9e3;height:54px;display:block}.salon-event{z-index:2;text-align:left;min-height:32px;padding:6px 7px;position:absolute;left:4px;right:4px;overflow:hidden;box-shadow:0 3px 10px #11100e1f;color:#11100e!important;background:#b9923e!important;border-radius:8px!important}.salon-event strong,.salon-event span{text-overflow:ellipsis;white-space:nowrap;font-size:9px;line-height:1.35;display:block;overflow:hidden}.salon-event span{opacity:.7;font-weight:650}.salon-event.status-completed{background:#b7cbb8!important}.salon-event.salon-block{color:#fff!important;background:#4a4844!important}.salon-mobile-list{display:none}.salon-modal-backdrop{z-index:100;background:#11100ea6;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.salon-modal{background:#fff;border-radius:24px;width:min(100%,520px);max-height:calc(100svh - 40px);padding:34px;position:relative;overflow:auto;box-shadow:0 30px 80px #0000004d}.salon-modal-close{width:35px;height:35px;position:absolute;top:18px;right:18px;color:var(--ink)!important;background:#eeeae4!important;border-radius:50%!important;font-size:22px!important}.salon-modal h2{margin:2px 0 24px;font-size:35px}.salon-modal dl{margin:0}.salon-modal dl>div{border-top:1px solid #ebe7df;grid-template-columns:90px 1fr;gap:12px;padding:13px 0;font-size:13px;display:grid}.salon-modal dt{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:9px;font-weight:800}.salon-modal dd{overflow-wrap:anywhere;margin:0;line-height:1.5}.salon-modal dd a{color:#915b0b;text-decoration:underline}.salon-modal-actions{grid-template-columns:1fr 1fr;gap:8px;margin-top:24px;display:grid}.salon-modal-actions.salon-modal-actions-single{grid-template-columns:1fr}.salon-modal-actions button{min-height:44px;padding:0 12px}.salon-modal-actions .salon-danger{background:#8d271a}.salon-block-times{grid-template-columns:1fr 1fr;gap:12px;display:grid}.salon-block-dates{grid-template-columns:1fr;gap:12px;display:grid}.salon-block-dates.is-range{grid-template-columns:1fr 1fr}.salon-block-mode{background:#efebe4;border-radius:13px;grid-template-columns:1fr 1.25fr;gap:4px;padding:4px;display:grid}.salon-block-form .salon-block-mode .salon-mode-button{color:#69655e;width:100%;min-width:0;min-height:40px;font-family:var(--font-sans);letter-spacing:0;text-align:center;white-space:nowrap;box-shadow:none;background:0 0;border:0;border-radius:9px;justify-content:center;align-items:center;margin:0;padding:0 12px;font-size:11px;font-weight:800;line-height:1.1;display:flex}.salon-block-form .salon-block-mode .salon-mode-button.is-active{color:var(--ink);background:#fff;box-shadow:0 3px 10px #11100e14}.salon-block-form .salon-block-mode .salon-mode-button:focus-visible{outline-offset:1px;outline:3px solid #dca13b8c}.salon-form-hint{color:var(--muted);margin:-3px 0 0;font-size:10px;line-height:1.5}.salon-confirm-modal>p:not(.salon-kicker){color:var(--muted);margin:-10px 0 20px;font-size:13px;line-height:1.6}.salon-confirm-modal ul{border:1px solid #e4dfd6;border-radius:14px;margin:0;padding:0;list-style:none;overflow:hidden}.salon-confirm-modal li{border-top:1px solid #ece8e0;flex-direction:column;gap:3px;padding:13px 15px;display:flex}.salon-confirm-modal li:first-child{border-top:0}.salon-confirm-modal li strong{font-size:13px}.salon-confirm-modal li span{color:var(--muted);font-size:10px;line-height:1.4}.salon-confirm-actions{grid-template-columns:1fr 1.4fr;gap:9px;margin-top:22px;display:grid}.salon-confirm-actions button{min-height:46px;padding:0 12px}.salon-confirm-actions .salon-secondary{color:var(--ink);background:#fff;border:1px solid #d8d3ca}.salon-confirm-actions .salon-danger{background:#8d271a}.salon-modal button:disabled{opacity:.55;cursor:wait}.goldcut-schedule-scroll{overscroll-behavior-x:contain;overscroll-behavior-y:auto;-webkit-overflow-scrolling:touch;background:#fff;border:1px solid #ddd8cf;border-radius:18px;width:100%;max-width:1540px;margin:0 auto;overflow:auto hidden}.goldcut-schedule-grid{grid-template-columns:72px repeat(7,minmax(144px,1fr));align-items:start;width:100%;min-width:1080px;display:grid}.goldcut-schedule-axis,.goldcut-schedule-day{min-width:0}.goldcut-schedule-corner,.goldcut-schedule-day>header{border-bottom:1px solid #ddd8cf;height:70px}.goldcut-schedule-axis{background:#faf9f6}.goldcut-schedule-times{grid-template-rows:repeat(21,54px);height:1134px;display:grid}.goldcut-schedule-times>div{color:#817d75;height:54px;font-family:var(--font-sans);text-align:right;white-space:nowrap;border-bottom:1px solid #ece9e3;padding:9px 10px 0 0;font-size:10px;font-weight:650;line-height:1}.goldcut-schedule-day{background:#fff;border-left:1px solid #e4e0d9}.goldcut-schedule-day>header{background:#fff;flex-direction:column;justify-content:center;align-items:center;display:flex}.goldcut-schedule-day>header span{color:var(--muted);font-family:var(--font-sans);text-transform:uppercase;font-size:9px;font-weight:800;line-height:1}.goldcut-schedule-day>header strong{font-family:var(--font-sans);margin-top:5px;font-size:20px;line-height:1}.goldcut-schedule-day-body{cursor:crosshair;touch-action:pan-y;-webkit-user-select:none;user-select:none;background-color:#fff;background-image:repeating-linear-gradient(#0000 0 53px,#ece9e3 53px 54px);background-size:100% 54px;height:1134px;position:relative;overflow:hidden}.goldcut-schedule-day-body.is-selecting{cursor:ns-resize}.goldcut-schedule-selection{z-index:1;color:#714505;pointer-events:none;background:#dca13b4d;border:2px solid #9b610b;border-radius:8px;min-height:51px;padding:7px 8px;position:absolute;left:4px;right:4px;overflow:hidden}.goldcut-schedule-selection span,.goldcut-schedule-selection strong{font-family:var(--font-sans);white-space:nowrap;font-size:9px;line-height:1.35;display:block}.salon-selection-layer{z-index:110;background:0 0;position:fixed;inset:0}.salon-quick-block{background:#fff;border:1px solid #ded8ce;border-radius:18px;width:min(320px,100vw - 32px);padding:22px;position:fixed;box-shadow:0 24px 70px #11100e3d}.salon-quick-block h2{margin:2px 0 16px;font-size:28px}.salon-quick-block-summary{font-family:var(--font-sans);background:#f0ece5;border-radius:10px;flex-direction:column;gap:3px;padding:11px 12px;display:flex}.salon-quick-block-summary strong{text-transform:capitalize;font-size:12px}.salon-quick-block-summary span{color:var(--muted);font-size:11px;font-weight:700}.salon-quick-block-actions{grid-template-columns:.85fr 1.35fr;gap:8px;display:grid}.salon-quick-block-actions button{min-width:0;min-height:43px;padding:0 10px;font-size:10px}.salon-quick-block-actions .salon-secondary{color:var(--ink);background:#fff;border:1px solid #d8d3ca}.goldcut-schedule-event{z-index:2;text-align:left;border:0;min-height:28px;padding:6px 8px;position:absolute;left:5px;right:5px;overflow:hidden;box-shadow:0 3px 10px #11100e1f;color:#11100e!important;font-family:var(--font-sans)!important;background:#b9923e!important;border-radius:8px!important}.goldcut-schedule-event strong,.goldcut-schedule-event span{text-overflow:ellipsis;white-space:nowrap;font-size:9px;line-height:1.35;display:block;overflow:hidden}.goldcut-schedule-event span{opacity:.72;font-weight:650}.goldcut-schedule-event.status-completed{background:#b7cbb8!important}.goldcut-schedule-event.is-blocked{color:#fff!important;background:#4a4844!important}.salon-booking-visibility{background:#fff;border:1px solid #d7d1c7;border-radius:16px;justify-content:space-between;align-items:center;gap:24px;max-width:1540px;margin:0 auto 18px;padding:17px 18px;display:flex}.salon-booking-visibility>div{flex-direction:column;display:flex}.salon-booking-visibility>div>span{color:#9a620d;letter-spacing:.16em;font-size:9px;font-weight:850}.salon-booking-visibility>div>strong{margin-top:2px;font-size:14px}.salon-booking-visibility>div>small{color:var(--muted);margin-top:2px;font-size:10px}.salon-booking-visibility>button{min-width:210px;min-height:44px;color:var(--ink);background:#e8e4dc;justify-content:flex-start;align-items:center;gap:10px;padding:5px 13px 5px 6px;display:inline-flex}.salon-booking-visibility>button i{background:#8d8880;border-radius:999px;width:34px;height:22px;position:relative}.salon-booking-visibility>button i:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .2s;position:absolute;top:3px;left:3px}.salon-booking-visibility.is-enabled>button i{background:#3d7e4d}.salon-booking-visibility.is-enabled>button i:after{transform:translate(12px)}.salon-booking-visibility>button span{font-size:10px}.service-booking-paused{background:#ebe5da;border:1px solid #11100e1f;border-radius:13px;justify-content:center;align-items:center;gap:12px;max-width:1380px;margin:0 auto 18px;padding:14px 18px;display:flex}.service-booking-paused span{color:#9a620d;letter-spacing:.14em;font-size:9px;font-weight:850}.service-booking-paused p{color:var(--muted);margin:0;font-size:11px}.styles-section{background:var(--paper);color:var(--ink);padding:68px clamp(20px,6vw,96px) 78px;scroll-margin-top:100px}.styles-heading{grid-template-columns:minmax(0,1fr) minmax(280px,430px);align-items:end;gap:40px;max-width:1380px;margin:0 auto 30px;display:grid}.styles-heading .section-kicker{margin:0 0 10px}.styles-heading h2{max-width:720px;font-family:var(--font-sans), sans-serif;letter-spacing:-.035em;text-transform:none;font-size:clamp(30px,3.2vw,46px);font-weight:750;line-height:1.08}.styles-heading>p{color:var(--muted);margin:0 0 3px;font-size:13px;line-height:1.7}.styles-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;max-width:1380px;margin:0 auto;display:grid}.style-card{background:#f5efe6;border:1px solid #11100e14;border-radius:20px;overflow:hidden}.style-card-image{background:#d6cbbb;height:clamp(260px,27vw,410px);position:relative;overflow:hidden}.style-card-image img{filter:saturate(.78)contrast(1.04);transition:transform .45s cubic-bezier(.22,1,.36,1);display:block;object-fit:cover!important;width:100%!important;max-width:none!important;height:100%!important}.style-card:first-child .style-card-image img{object-position:center 45%}.style-card:nth-child(3) .style-card-image img{object-position:center 58%}.style-card:hover .style-card-image img{transform:scale(1.025)}.style-card-copy{padding:19px}.style-card-copy h3{font-family:var(--font-display);text-transform:uppercase;margin:0;font-size:28px;font-weight:400;line-height:1}.team-section{background:var(--ink);color:#fff;padding:clamp(82px,9vw,138px) clamp(20px,6vw,96px);scroll-margin-top:100px}.team-heading{max-width:760px;margin-bottom:50px}.team-heading h2{font-size:clamp(52px,6.2vw,94px)}.team-heading>p:last-child{color:#ffffffa1;max-width:490px;margin:28px 0 0;font-size:14px;line-height:1.8}.team-layout{grid-template-columns:minmax(320px,.9fr) minmax(420px,1.1fr);align-items:stretch;gap:clamp(28px,5vw,80px);display:grid}.team-feature{background:#181613;border-radius:28px;min-height:590px;margin:0;position:relative;overflow:hidden}.team-feature img{object-fit:cover;object-position:center 42%;filter:saturate(.78)contrast(1.08)}.team-feature:after{content:"";background:linear-gradient(#0000,#000000b8);position:absolute;inset:52% 0 0}.team-feature figcaption{z-index:2;color:var(--gold);letter-spacing:.2em;font-size:10px;font-weight:850;position:absolute;bottom:24px;left:26px}.team-roster{border-top:1px solid #fff3}.team-roster article{border-bottom:1px solid #fff3;grid-template-columns:56px 1fr;align-items:center;gap:20px;min-height:25%;padding:24px 6px;display:grid}.team-roster article>span{color:var(--gold);letter-spacing:.14em;font-size:10px;font-weight:850}.team-roster h3{font-family:var(--font-display);text-transform:uppercase;margin:0;font-size:clamp(30px,3vw,48px);font-weight:400;line-height:.94}.team-roster p{color:#ffffff94;letter-spacing:.13em;text-transform:uppercase;margin:9px 0 0;font-size:10px;font-weight:750}.team-gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;min-width:0;display:grid}.team-card{aspect-ratio:3/4;background:#24211d;border-radius:24px;margin:0;position:relative;overflow:hidden}.team-card img{object-fit:cover;transition:transform .45s}.team-card>img{object-position:center 38%}.team-card:hover img{transform:scale(1.025)}.team-card:after{content:"";background:linear-gradient(#0000,#000c);position:absolute;inset:45% 0 0}.team-card figcaption{z-index:2;flex-direction:column;display:flex;position:absolute;bottom:22px;left:24px;right:24px}.team-card figcaption span{color:var(--gold);letter-spacing:.16em;font-size:9px;font-weight:850}.team-card figcaption strong{font-family:var(--font-display);text-transform:uppercase;margin-top:3px;font-size:clamp(21px,2vw,28px);font-weight:400;line-height:1}.team-card figcaption small{color:#ffffffa8;letter-spacing:.08em;text-transform:uppercase;margin-top:6px;font-size:9px;font-weight:700}.team-card-placeholder{background:linear-gradient(145deg,#2b2823,#151411);place-items:center;display:grid}.team-card-placeholder:before{content:"";border:1px solid #c8a44d38;border-radius:16px;position:absolute;inset:14px}.team-card-placeholder>img{opacity:.6;object-fit:contain;filter:saturate(.75);width:42%;height:auto;position:static!important}.products-section{background:#ded8cd;padding:clamp(82px,9vw,138px) clamp(20px,6vw,96px);scroll-margin-top:100px}.products-heading{grid-template-columns:1fr minmax(280px,440px);align-items:end;gap:48px;margin-bottom:52px;display:grid}.products-heading h2{font-size:clamp(52px,6vw,90px)}.products-heading>p{color:var(--muted);margin:0 0 6px;font-size:14px;line-height:1.8}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;display:grid}.product-card{background:#f5efe6;border-radius:24px;overflow:hidden}.product-image{aspect-ratio:4/5;background:#dfcfb7;position:relative;overflow:hidden}.product-image img{object-fit:cover;transition:transform .5s cubic-bezier(.22,1,.36,1)}.product-card:hover .product-image img{transform:scale(1.025)}.product-copy{padding:24px 24px 28px}.product-copy>span{color:#9a620d;letter-spacing:.15em;font-size:9px;font-weight:850}.product-copy h3{font-family:var(--font-display);text-transform:uppercase;margin:5px 0 8px;font-size:32px;font-weight:400;line-height:1}.product-copy p{min-height:48px;color:var(--muted);margin:0;font-size:12px;line-height:1.6}.product-copy>strong{border-top:1px solid var(--line);letter-spacing:.09em;text-transform:uppercase;margin-top:18px;padding-top:14px;font-size:10px;display:block}.craft-section{background:#b9923e;grid-template-columns:1.05fr .95fr;min-height:760px;display:grid}.craft-image-wrap{min-height:620px;position:relative;overflow:hidden}.craft-image-wrap:after{content:"";z-index:2;background:#b9923e;width:72px;position:absolute;top:0;bottom:0;right:-2px;-webkit-mask-image:url("/showcases/goldcut/assets/brush-edge-mask-vertical.png");mask-image:url("/showcases/goldcut/assets/brush-edge-mask-vertical.png");-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.craft-image{filter:saturate(.72)contrast(1.06)}.craft-copy{flex-direction:column;justify-content:center;padding:clamp(70px,9vw,140px);display:flex}.craft-copy .section-kicker{color:var(--ink)}blockquote{font-family:var(--font-display);text-transform:uppercase;margin:12px 0 32px;font-size:clamp(38px,4.3vw,68px);line-height:1.08}.craft-copy>p:not(.section-kicker){max-width:500px}.signature{font-family:var(--font-display);border-top:1px solid #11100e59;justify-content:space-between;margin-top:42px;padding-top:25px;font-size:26px;display:flex}.signature span{font-family:var(--font-sans);letter-spacing:.15em;font-size:10px;font-weight:800}.references-section{color:var(--ink);background:#fff;padding:clamp(86px,10vw,150px) 0 clamp(78px,9vw,130px);scroll-margin-top:106px;overflow:hidden}.references-heading{text-align:center;max-width:760px;margin:0 auto 50px;padding:0 24px}.references-heading .section-kicker{margin-bottom:18px}.references-heading h2{margin:0;font-size:clamp(46px,5.5vw,80px)}.references-heading>p:last-child{max-width:520px;color:var(--muted);margin:18px auto 0;font-size:13px;line-height:1.7}.references-heading .heading-ornament:before,.references-heading .heading-ornament:after{background:#fff}.reference-gallery{width:100%;position:relative}.reference-track{overscroll-behavior-inline:contain;scroll-behavior:smooth;scroll-snap-type:inline mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:clamp(16px,2vw,28px);padding:8px clamp(24px,7vw,110px) 26px;scroll-padding-inline:clamp(24px,7vw,110px);display:flex;overflow-x:auto}.reference-track::-webkit-scrollbar{display:none}.reference-card{aspect-ratio:4/5;scroll-snap-align:start;background:#24211d;border:0;border-radius:24px;flex:0 0 clamp(260px,27vw,380px);margin:0;position:relative;overflow:hidden}.reference-image{object-fit:cover;transition:transform .45s,filter .45s}.reference-card:hover .reference-image{filter:saturate(1.06);transform:scale(1.025)}.reference-controls{z-index:2;pointer-events:none;justify-content:space-between;padding:0 clamp(10px,2vw,30px);display:flex;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.reference-controls button{background:var(--gold);width:52px;height:52px;color:var(--ink);font:inherit;cursor:pointer;pointer-events:auto;border:1px solid #11100e24;border-radius:50%;font-size:20px;transition:background-color .2s,color .2s;box-shadow:0 10px 28px #11100e2e}.reference-controls button:hover{background:var(--ink);color:var(--gold)}.reference-controls button:focus-visible{outline-offset:3px;outline:3px solid #c8a44d6b}.reference-controls button.is-hidden{visibility:hidden;opacity:0;pointer-events:none}.contact{background:var(--gold);padding:clamp(86px,10vw,150px) clamp(24px,7vw,110px) 55px}.contact-top{grid-template-columns:1fr auto;align-items:end;gap:40px;display:grid}.contact-top .section-kicker{color:var(--ink);grid-column:1/-1;margin-bottom:0}.button-dark{background:var(--ink);color:#fff;margin-bottom:10px}.contact-details{border-top:1px solid #11100e4d;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:80px;padding-top:38px;display:grid}.contact-details span{letter-spacing:.18em;font-size:10px;font-weight:800}.contact-details p{margin:10px 0 0}.salon-map{background:#d3a13f;border:1px solid #11100e3d;border-radius:26px;min-height:430px;margin-top:62px;position:relative;overflow:hidden}.salon-map iframe{filter:saturate(.72)contrast(1.04);border:0;width:100%;height:430px;display:block}.salon-map-card{color:#fff;background:#11100ef0;border-radius:18px;flex-direction:column;min-width:290px;padding:20px 22px;display:flex;position:absolute;bottom:24px;left:24px;box-shadow:0 18px 44px #00000038}.salon-map-card span{color:var(--gold);letter-spacing:.16em;font-size:9px;font-weight:850}.salon-map-card strong{margin-top:6px;font-size:13px;line-height:1.55}.salon-map-card a{color:var(--gold);letter-spacing:.08em;text-transform:uppercase;margin-top:16px;font-size:10px;font-weight:850}footer{background:var(--gold);color:var(--ink);justify-content:space-between;align-items:center;min-height:190px;padding:26px clamp(24px,7vw,110px);display:flex}.footer-logo-link{align-items:center;display:inline-flex}.footer-logo{object-fit:contain;width:138px;height:138px}footer p,footer>a:last-child{letter-spacing:.14em;font-size:10px;font-weight:700}.mobile-book{display:none}@media (max-width:1180px){.service-cards{grid-template-columns:1fr}.service-side-cards{grid-template-columns:1fr 1fr}}@media (max-width:900px){.site-header{padding:10px 14px}.header-shell{grid-template-columns:1fr auto;min-height:70px}nav{display:none}.hero{min-height:100svh}.hero-note{display:none}.booking-planner{grid-template-columns:1fr}.booking-calendar{position:static}.booking-section{grid-template-columns:1fr}.booking-copy{max-width:620px}.craft-section{grid-template-columns:1fr}.team-heading{max-width:680px}.team-layout{grid-template-columns:1fr}.team-feature{min-height:560px}.styles-heading{grid-template-columns:1fr;gap:12px}.styles-heading>p{max-width:600px}.styles-grid,.team-gallery{grid-template-columns:1fr 1fr}.products-heading{grid-template-columns:1fr;gap:20px}.products-heading>p{max-width:620px}.product-grid{grid-template-columns:1fr}.product-card{grid-template-columns:minmax(240px,.8fr) 1fr;display:grid}.product-image{aspect-ratio:4/5}.product-copy{align-self:center;padding:30px}.craft-image-wrap{min-height:520px}.craft-image-wrap:after{width:auto;height:72px;inset:auto 0 -1px;-webkit-mask-image:url("/showcases/goldcut/assets/brush-edge-mask.png");mask-image:url("/showcases/goldcut/assets/brush-edge-mask.png")}.salon-desktop-calendar,.goldcut-schedule-scroll{display:none}.salon-mobile-list{flex-direction:column;gap:12px;max-width:760px;margin:0 auto;display:flex}.salon-mobile-list article{background:#fff;border-radius:16px;overflow:hidden}.salon-mobile-list article>header{border-bottom:1px solid #ebe7df;justify-content:space-between;padding:14px 16px;display:flex}.salon-mobile-list article>header strong{text-transform:capitalize;font-size:13px}.salon-mobile-list article>header span{color:var(--muted);font-size:10px}.salon-mobile-list article>button{width:100%;color:var(--ink);text-align:left;background:#fff;border-bottom:1px solid #f0ede7;border-radius:0;grid-template-columns:50px 1fr auto;align-items:center;gap:12px;padding:13px 15px;display:grid}.salon-mobile-list article>button time{color:#96600f;font-size:12px;font-weight:850}.salon-mobile-list article>button span{flex-direction:column;gap:3px;display:flex}.salon-mobile-list article>button small{color:var(--muted);font-size:10px;font-weight:500}.salon-mobile-list article>button b{font-size:20px}.salon-mobile-list article>p{color:var(--muted);margin:0;padding:18px 16px;font-size:11px}}@media (max-width:620px){body{padding-bottom:0}.site-header{padding:8px 10px}.header-shell{min-height:62px;padding:0 8px}.site-header.is-scrolled .header-shell{border-radius:18px;min-height:62px;padding:0 8px}.header-logo{width:60px;height:60px}.brand{font-size:24px}.hero-content{padding:80px 20px}h1{font-size:clamp(42px,12vw,62px)}.hero-image{object-position:center 48%}.hero-actions{justify-content:center}.services{padding-left:20px;padding-right:20px}.contact h2{font-size:52px}.salon-map,.salon-map iframe{height:460px;min-height:460px}.salon-map-card{min-width:0;bottom:12px;left:12px;right:12px}.services-heading{margin-bottom:50px}.service-booking-paused{text-align:left;flex-direction:column;align-items:flex-start}.styles-section,.team-section,.products-section{padding-left:18px;padding-right:18px}.styles-section{padding-top:56px;padding-bottom:62px;overflow:hidden}.styles-heading{margin-bottom:24px}.styles-heading h2{font-size:31px}.styles-grid{grid-template-columns:1fr}.style-card-image{height:min(108vw,460px)}.team-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.team-feature{border-radius:20px;min-height:118vw;max-height:620px}.team-roster article{grid-template-columns:42px 1fr;gap:10px;min-height:0;padding:20px 2px}.team-roster h3{font-size:27px}.team-card{border-radius:16px}.team-card figcaption{bottom:13px;left:13px;right:13px}.team-card figcaption strong{font-size:18px}.team-card figcaption small{font-size:8px;line-height:1.35}.product-card{display:block}.product-copy p{min-height:0}.booking-planner{gap:20px;margin-bottom:82px}.booking-services,.booking-calendar{border-radius:22px;padding:22px}.booking-service{grid-template-columns:1fr auto;gap:12px}.booking-service-facts{grid-area:2/1}.booking-select-label{grid-area:1/2/3}.booking-days{grid-template-columns:repeat(4,1fr)}.booking-times{grid-template-columns:repeat(3,1fr)}.service-cards{gap:18px;padding-left:3px;padding-right:3px}.service-side-cards{grid-template-columns:1fr;gap:18px}.service-card,.service-card.is-wide{flex-basis:calc(100vw - 50px);min-height:0;padding:24px 20px 32px}.service-line{grid-template-columns:1fr auto;align-items:center;gap:10px}.service-line-name{grid-column:1/-1}.service-line>span{grid-column:1}.service-line>strong{text-align:right;grid-column:2}.service-select{grid-column:1/-1;width:100%}.booking-section{padding:80px 20px}.calendar-card{border-radius:22px;padding:22px}.calendar-card-head{flex-direction:column;align-items:flex-start}.calendar-days{grid-template-columns:repeat(7,1fr);gap:4px}.calendar-days button{min-height:66px}.calendar-days button strong{font-size:16px}.calendar-times{grid-template-columns:repeat(3,1fr)}.calendar-summary{grid-template-columns:1fr}.calendar-summary>button{justify-content:center;width:100%}.customer-details-form{grid-template-columns:1fr}.customer-details-form>button,.customer-details-form .customer-note,.customer-details-form .privacy-check,.booking-form-error{grid-column:1}.salon-login-card{padding:34px 22px}.salon-home-link{top:18px;left:18px}.salon-portal{padding:15px 12px 40px}.salon-portal-header{align-items:flex-start}.salon-portal-header img{width:48px;height:48px}.salon-portal-header h1{font-size:27px}.salon-portal-header nav{flex-direction:column}.salon-portal-header button{min-height:34px;padding:0 10px;font-size:9px}.salon-booking-visibility{flex-direction:column;align-items:stretch}.salon-booking-visibility>button{width:100%;min-width:0}.salon-toolbar{grid-template-columns:1fr auto;gap:10px}.salon-toolbar>strong{grid-area:2/1/auto/-1;justify-self:center}.salon-toolbar>span{grid-area:1/2}.salon-modal{padding:30px 20px 22px}.salon-modal-actions,.salon-confirm-actions{grid-template-columns:1fr}.craft-image-wrap{min-height:430px}.craft-copy{padding:65px 20px}.reference-card{border-radius:20px;flex-basis:min(82vw,330px)}.reference-controls{padding:0 8px}.reference-controls button{width:46px;height:46px}.contact{padding:80px 20px 40px}.contact-top{grid-template-columns:1fr}.contact-details{grid-template-columns:1fr;gap:28px;margin-top:58px}footer{text-align:center;flex-direction:column;gap:16px;padding:30px 20px 92px}.footer-logo{width:120px;height:120px}footer p{margin:0}.mobile-book{z-index:50;background:var(--gold);height:64px;color:var(--ink);text-transform:uppercase;letter-spacing:.12em;justify-content:center;align-items:center;font-size:12px;font-weight:850;display:flex;position:fixed;bottom:0;left:0;right:0}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}

/* Separately loaded so the persistent local dev server picks up the latest layout immediately. */
html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0;
  background: var(--ink);
  overscroll-behavior: none;
}

main {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

html {
  overflow-x: hidden;
}

body {
  max-width: 100%;
  overflow-x: clip;
}

html:has(#seitenende:target) { scroll-behavior: auto; }

.menu-toggle,
.menu-backdrop { display: none; }
.mobile-menu-legal { display: none; }

.site-header::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, .72) 62%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, .72) 62%, transparent 100%);
  transition: opacity .28s ease;
}
.site-header.is-scrolled::before,
.site-header.menu-open::before { opacity: 1; }
.header-shell { position: relative; z-index: 2; }

.logo-link {
  position: relative;
  width: 70px;
  height: 70px;
}
.logo-link .header-logo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: translateY(3px);
  transition: opacity .28s ease;
}
.header-logo-unscrolled { opacity: 1; }
.header-logo-scrolled { opacity: 0; }
.site-header.is-scrolled .header-logo-unscrolled,
.site-header.menu-open .header-logo-unscrolled { opacity: 0; }
.site-header.is-scrolled .header-logo-scrolled,
.site-header.menu-open .header-logo-scrolled { opacity: 1; }

.booking-hours {
  border-top: 0;
}

.services {
  padding-top: clamp(40px, 5vw, 64px);
  padding-left: clamp(16px, 3vw, 48px);
  padding-right: clamp(16px, 3vw, 48px);
  padding-bottom: clamp(48px, 5vw, 72px);
}
.services::after {
  content: "";
  position: absolute;
  z-index: 4;
  top: -4px;
  left: 0;
  right: 0;
  height: 9px;
  background: var(--paper);
  pointer-events: none;
}

.service-cards {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: clamp(16px, 2vw, 28px);
  padding: 10px 0 14px;
}

.service-column { min-width: 0; display: flex; flex-direction: column; gap: clamp(16px, 2vw, 28px); }
.service-options-stage { max-height: 6000px; }

.service-slider-shell { max-width: 1380px; overflow-anchor: none; }
.service-card.is-wide { padding-bottom: 18px; }
.service-card.is-wide .service-line-name > strong {
  font-size: 14px;
  line-height: 1.35;
}
.service-card.is-wide .service-line > span { font-size: 12px; }
.service-card.is-wide .service-line > strong { font-size: 14px; }
.service-card.is-wide .service-select { font-size: 10px; }
.service-select {
  border: 0;
  font-family: inherit;
  cursor: pointer;
}
.service-select.is-selected {
  background: var(--gold);
  color: var(--ink);
}
.service-select:focus-visible {
  outline: 3px solid rgba(200, 164, 77, .45);
  outline-offset: 2px;
}
.service-card:hover { transform: none; box-shadow: none; }
.service-options-stage {
  max-height: 6000px;
  overflow: hidden;
  opacity: 1;
  transform: translateX(0);
  transition: max-height .42s cubic-bezier(.22, 1, .36, 1), opacity .24s ease, transform .34s cubic-bezier(.22, 1, .36, 1);
}
.booking-flow.is-calendar-open .service-options-stage {
  max-height: 0;
  opacity: 0;
  transform: translateX(-26px);
  pointer-events: none;
}
.service-calendar-stage {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  text-align: left;
  transform: translateX(26px);
  pointer-events: none;
  transition: max-height .48s cubic-bezier(.22, 1, .36, 1), opacity .25s ease .06s, transform .34s cubic-bezier(.22, 1, .36, 1);
}
.service-calendar-stage .calendar-card {
  background: #fff;
  border: 0;
  box-shadow: none;
}
.service-calendar-stage .calendar-days button {
  background: #f1e5ca;
  border-color: rgba(166, 102, 12, .18);
}
.service-calendar-stage .calendar-days button.is-closed,
.service-calendar-stage .calendar-days button.is-past {
  background: #d6d6d6;
  opacity: .42;
}
.service-calendar-stage .calendar-days button:not(:disabled):hover,
.service-calendar-stage .calendar-days button.is-selected {
  background: var(--gold);
  border-color: var(--gold);
}
.booking-flow.is-calendar-open .service-calendar-stage {
  max-height: 2200px;
  padding: 12px 0 24px;
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}
.service-calendar-inner {
  width: min(1050px, 100%);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
}
.booking-flow.is-calendar-open .service-calendar-inner {
  animation: serviceCalendarIn .52s cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes serviceCalendarIn {
  from { opacity: 0; transform: translateX(72px); }
  to { opacity: 1; transform: translateX(0); }
}
.service-calendar-back {
  width: max-content;
  min-height: 42px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 9px;
  border: 0;
  border-radius: 999px;
  background: var(--gold);
  color: var(--ink);
  font-family: inherit;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
.service-calendar-back span { font-size: 18px; line-height: 1; }
.service-calendar-back:hover { transform: translateX(-3px); background: var(--ink); color: var(--gold); }
.service-calendar-back:focus-visible { outline: 3px solid rgba(200, 164, 77, .45); outline-offset: 3px; }

.returning-customer-note {
  margin: -3px 0 16px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #d8e7d9;
  border-radius: 13px;
  background: #f0f7f0;
}
.returning-customer-note > span { width: 26px; height: 26px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: #3f7b4a; color: #fff; font-size: 12px; font-weight: 900; }
.returning-customer-note p { margin: 0; color: #3e5d42; font-size: 11px; line-height: 1.45; }
.returning-customer-note strong { display: block; color: #26482c; }
.returning-customer-note button { margin-left: auto; padding: 5px 0; border: 0; background: transparent; color: #386641; font: inherit; font-size: 9px; font-weight: 850; text-decoration: underline; cursor: pointer; white-space: nowrap; }

.review-overview {
  margin-top: 42px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.review-overview strong { font-family: var(--font-display); font-size: 30px; font-weight: 400; }
.review-overview span { font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.review-slider {
  position: relative;
  width: 100%;
  max-width: 760px;
  padding-bottom: 34px;
  justify-self: end;
}
.review-card {
  min-height: 360px;
  padding: clamp(32px, 5vw, 64px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 28px;
  background: var(--paper);
  color: var(--ink);
  animation: reviewIn .34s cubic-bezier(.22, 1, .36, 1);
}
.review-rating { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.review-rating strong { font-family: var(--font-display); font-size: 38px; font-weight: 400; }
.review-rating span { color: #a5660c; font-size: 16px; letter-spacing: .16em; }
.review-card blockquote {
  margin: 32px 0;
  font-family: var(--font-sans);
  font-size: clamp(16px, 1.45vw, 21px);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
  text-transform: none;
}
.review-card > p { margin: 0; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.review-attribution { display: flex; align-items: center; gap: 10px; }
.review-attribution > img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
.review-attribution p { margin: 0; display: flex; flex-direction: column; gap: 3px; font-size: 11px; font-weight: 750; }
.review-attribution p span { color: var(--muted); font-size: 9px; font-weight: 650; }
.review-attribution a { text-decoration: underline; text-underline-offset: 2px; }
.review-controls {
  position: absolute;
  inset: 0 0 34px;
  pointer-events: none;
}
.review-controls > button {
  position: absolute;
  top: 50%;
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 50%;
  background: var(--ink);
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  pointer-events: auto;
  transform: translateY(-50%);
}
.review-controls > button:first-child { left: -24px; }
.review-controls > button:last-child { right: -24px; }
.review-dots {
  position: absolute;
  left: 50%;
  bottom: -28px;
  display: flex;
  justify-content: center;
  gap: 9px;
  pointer-events: auto;
  transform: translateX(-50%);
}
.review-dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: rgba(17,16,14,.28); cursor: pointer; }
.review-dots button.is-active { width: 28px; border-radius: 999px; background: var(--ink); }
.review-counter {
  position: absolute;
  left: 50%;
  bottom: -28px;
  transform: translateX(-50%);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
}
.review-counter strong { color: var(--ink); }
@keyframes reviewIn { from { opacity: 0; transform: translateX(26px); } to { opacity: 1; transform: translateX(0); } }
.booking-section::after {
  content: "";
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: -1px;
  width: 100%;
  height: var(--paint-edge);
  background: var(--paper);
  pointer-events: none;
  -webkit-mask-image: url("/showcases/goldcut/assets/brush-edge-mask.png");
  mask-image: url("/showcases/goldcut/assets/brush-edge-mask.png");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.booking-section {
  padding-top: clamp(58px, 6vw, 92px);
}
.booking-watermark {
  position: absolute;
  z-index: 0;
  inset: 0;
  background-image: url("/showcases/goldcut/assets/goldcut-footer-watermark.png");
  background-repeat: no-repeat;
  background-size: clamp(650px, 60vw, 920px);
  background-position: left 15px center;
  opacity: .14;
  mix-blend-mode: soft-light;
  pointer-events: none;
}
.booking-section > *:not(.booking-watermark) {
  position: relative;
  z-index: 1;
}
.reference-card { border: 0; }

.reference-controls button.is-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.contact {
  padding-top: clamp(58px, 6vw, 92px);
  padding-bottom: 8px;
}
.contact-top { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.contact-top h2 { grid-column: 1 / 3; }
.contact-details {
  margin-top: 38px;
  padding-top: 0;
  border-top: 0;
}
.contact h2 em { color: #f4ead0; }
.hero .button-gold,
.contact .button-dark { border-radius: 14px; }
.contact-phone {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.contact-call-button {
  grid-column: 3;
  grid-row: 2;
  align-self: end;
  justify-self: start;
  margin-bottom: clamp(20px, 2.2vw, 34px);
}

.references-section {
  background: var(--paper);
  padding-top: clamp(38px, 4vw, 58px);
  padding-bottom: clamp(46px, 5vw, 68px);
}
.references-heading .heading-ornament::before,
.references-heading .heading-ornament::after {
  background: var(--paper);
}

footer {
  min-height: 0;
  padding: 4px clamp(24px, 7vw, 110px) 10px;
  display: block;
}
.yellow-ending {
  position: relative;
  isolation: isolate;
  background: var(--gold);
}
.yellow-ending::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background-image: url("/showcases/goldcut/assets/goldcut-footer-watermark.png");
  background-repeat: no-repeat;
  background-size: clamp(560px, 52vw, 800px);
  background-position: right -45px bottom -175px;
  opacity: .14;
  mix-blend-mode: soft-light;
  pointer-events: none;
}
.yellow-ending .contact,
.yellow-ending footer { isolation: auto; }
.yellow-ending .contact > *,
.yellow-ending footer > * {
  position: relative;
  z-index: 1;
}
.footer-bottom {
  position: relative;
  z-index: 1;
  padding-top: 48px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 28px;
}
.footer-bottom > p,
.footer-legal-links a {
  margin: 0;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.footer-bottom > p {
  grid-column: 2;
  justify-self: center;
  color: rgba(17, 16, 14, .58);
}
.footer-legal-links { grid-column: 3; justify-self: end; display: flex; gap: 26px; }
.footer-legal-links a { color: #f4ead0; }
.footer-legal-links a:hover { color: #fff; }

.legal-page { min-height: 100svh; background: var(--paper); }
.legal-header {
  min-height: 112px;
  padding: 15px clamp(24px, 6vw, 90px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--gold);
}
.legal-header img { width: 82px; height: 82px; object-fit: contain; }
.legal-content { width: min(900px, calc(100% - 156px)); margin: 0 auto; padding: clamp(70px, 9vw, 130px) 0; }
.legal-content > h1 { margin-bottom: 24px; font-size: clamp(50px, 6.8vw, 104px); }
.legal-kicker-row { position: relative; }
.legal-kicker-row .section-kicker { margin-bottom: 22px; }
.legal-back {
  width: 50px;
  height: 50px;
  position: absolute;
  top: -16px;
  right: calc(100% + 28px);
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--gold);
  color: var(--ink);
  font-size: 22px;
  font-weight: 800;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.legal-back:hover { background: var(--ink); color: var(--gold); transform: translateX(-3px); }
.legal-back:focus-visible { outline: 3px solid rgba(200, 164, 77,.45); outline-offset: 3px; }
.legal-intro { max-width: 680px; margin: 0 0 60px; color: var(--muted); font-size: clamp(18px, 2vw, 24px); }
.legal-content section { padding: 30px 0; border-top: 1px solid rgba(17,16,14,.14); }
.legal-content section h2 { margin: 0 0 16px; font-family: var(--font-sans); font-size: 19px; font-weight: 800; line-height: 1.3; text-transform: none; }
.legal-content section p { margin: 0 0 13px; }
.legal-content section p:last-child { margin-bottom: 0; }
.legal-content section a { color: #9a5c00; text-decoration: underline; text-underline-offset: 3px; }
.legal-date { margin: 42px 0 0; color: var(--muted); font-size: 12px; }
.legal-footer {
  min-height: 100px;
  padding: 0;
  display: block;
  background: var(--gold);
}

.hero {
  width: calc(100% + 4px);
  margin-inline: -2px;
}
.hero-image {
  top: -2px !important;
  left: -2px !important;
  width: calc(100% + 4px) !important;
  height: calc(100% + 4px) !important;
  max-width: none !important;
}

@media (max-width: 1180px) {
  .hero {
    min-height: 0;
    height: clamp(500px, 58svh, 650px);
  }
  .service-cards { display: flex; flex-direction: column; }
  .service-column { display: contents; }
}

@media (min-width: 1181px) and (max-width: 1366px) and (pointer: coarse) {
  .hero {
    min-height: 0;
    height: clamp(500px, 58svh, 650px);
  }
}

@media (max-width: 1180px) {
  .booking-hours { display: none; }
  .header-shell {
    position: relative;
    z-index: 2;
    grid-template-columns: 1fr auto;
    transition: background-color .3s ease, color .3s ease, box-shadow .3s ease, border-color .3s ease, border-radius .3s ease;
  }
  .menu-backdrop {
    position: fixed;
    z-index: 1;
    inset: 0;
    display: block;
    border: 0;
    background: rgba(8, 7, 6, .58);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .32s ease, visibility .32s ease;
  }
  .site-header.menu-open .menu-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  .menu-toggle {
    width: 48px;
    height: 48px;
    padding: 13px 11px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    justify-self: end;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: inherit;
    cursor: pointer;
  }
  .menu-toggle span {
    width: 100%;
    height: 2px;
    display: block;
    border-radius: 999px;
    background: currentColor;
    transition: transform .22s ease, opacity .22s ease;
  }
  .menu-open .menu-toggle span:first-child { transform: translateY(8px) rotate(45deg); }
  .menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
  .menu-open .menu-toggle span:last-child { transform: translateY(-8px) rotate(-45deg); }
  .site-header.menu-open .header-shell {
    color: var(--ink);
    background: rgba(200, 164, 77, .97);
    border-color: rgba(17, 16, 14, .14);
    border-bottom-color: transparent;
    border-radius: 22px 22px 0 0;
    box-shadow: 0 14px 38px rgba(17, 16, 14, .18);
  }
  .site-header nav {
    position: absolute;
    top: calc(100% - 1px);
    left: -1px;
    right: -1px;
    max-height: 0;
    padding: 0 10px;
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid rgba(17, 16, 14, .14);
    border-top: 0;
    border-radius: 0 0 18px 18px;
    background: rgba(200, 164, 77, .98);
    color: var(--ink);
    box-shadow: 0 20px 40px rgba(17, 16, 14, 0);
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition: max-height .38s cubic-bezier(.22, 1, .36, 1), padding .38s cubic-bezier(.22, 1, .36, 1), opacity .2s ease, box-shadow .3s ease;
  }
  .site-header nav.is-open {
    max-height: 330px;
    padding: 12px 10px 10px;
    opacity: 1;
    pointer-events: auto;
    box-shadow: 0 20px 40px rgba(17, 16, 14, .2);
  }
  .site-header nav a {
    padding: 13px 12px;
    border-radius: 10px;
  }
  .site-header nav a:hover { color: var(--ink); background: rgba(255, 243, 216, .45); }
  .site-header nav .mobile-menu-legal {
    margin: 5px 12px 3px;
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .site-header nav .mobile-menu-legal a {
    padding: 5px 0;
    color: #f4ead0;
    font-size: 9px;
    letter-spacing: .11em;
  }
  .site-header nav .mobile-menu-legal a:hover {
    color: #fff;
    background: transparent;
  }
  .hero {
    min-height: 0;
    height: clamp(460px, 62svh, 620px);
    width: calc(100% + 4px);
    margin-inline: -2px;
    background: var(--ink);
  }
  .hero-image {
    width: calc(100% + 4px) !important;
    max-width: none !important;
  }
  .hero::after { bottom: -4px; }
  .services { margin-top: -2px; }
  .service-line,
  .service-card.is-compact .service-line {
    grid-template-columns: minmax(0, 1fr) 48px 88px;
    column-gap: 10px;
  }
  .service-line-name { grid-column: 1 / -1; }
  .service-line > span { grid-column: 1; }
  .service-line > strong { grid-column: 2; text-align: right; }
  .service-select {
    grid-column: 3;
    width: auto;
  }
  .calendar-times {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 701px) and (max-width: 1180px) {
  .yellow-ending::after {
    background-position: right -45px bottom -85px;
  }
}

@media (min-width: 701px) and (max-width: 1000px) {
  .booking-section {
    grid-template-columns: minmax(0, 1fr);
    gap: 46px;
  }
  .review-slider {
    width: calc(100% - 56px);
    max-width: 760px;
    justify-self: center;
    transform: translateX(-30px);
  }
}

@media (max-width: 700px) {
  .logo-link { width: 60px; height: 60px; }
  .hero { height: clamp(460px, 63svh, 580px); }
  .booking-watermark {
    background-size: 440px;
    background-position: left 28px top 10px;
  }
  .review-slider { padding-bottom: 64px; }
  .review-card {
    min-height: 270px;
    padding: 24px;
  }
  .review-card blockquote { margin: 20px 0; }
  .review-controls {
    inset: auto 0 0;
    height: 48px;
  }
  .review-controls > button {
    top: 0;
    transform: none;
  }
  .review-controls > button:first-child { left: calc(50% - 92px); }
  .review-controls > button:last-child { right: calc(50% - 92px); }
  .review-counter { bottom: 15px; }
  .contact { padding-top: 58px; padding-bottom: 12px; }
  .contact-top { grid-template-columns: 1fr; }
  .contact-top h2 { grid-column: 1; }
  .contact-call-button {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
    margin: 8px 0 0;
  }
  footer { padding-bottom: 18px; }
  .yellow-ending::after {
    background-size: 560px;
    background-position: right -130px bottom -125px;
    opacity: .11;
  }
  .footer-bottom { grid-template-columns: 1fr; justify-items: center; gap: 18px; text-align: center; }
  .footer-bottom > p,
  .footer-legal-links { grid-column: 1; justify-self: center; }
  .footer-legal-links { order: 1; }
  .footer-bottom > p { order: 2; }
  .legal-header { min-height: 92px; }
  .legal-header img { width: 64px; height: 64px; }
  .legal-content { width: min(100% - 36px, 900px); }
  .legal-content > h1 { font-size: 52px; }
  .legal-kicker-row { padding-top: 58px; padding-left: 0; }
  .legal-back { width: 44px; height: 44px; top: 0; right: auto; left: 0; }
  .legal-footer { padding: 0; }
}

/* Salon operations: one calm working surface for prices, revenue and customers. */
.salon-operations {
  max-width: 1440px;
  margin: 22px auto 26px;
  padding: 24px;
  border: 1px solid #e6dfd2;
  border-radius: 24px;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 18px 48px rgba(17, 16, 14, .07);
}
.salon-operations-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.salon-operations-head h2 { font-size: clamp(29px, 3vw, 46px); }
.salon-operations-head .salon-kicker { margin-bottom: 8px; }
.salon-operations-intro { max-width: 560px; margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.salon-operations-tabs { display: flex; flex-wrap: wrap; gap: 7px; }
.salon-operations-tabs button,
.salon-report-filter button,
.salon-service-add button,
.salon-service-manager button,
.salon-customer-manager button {
  min-height: 40px;
  padding: 0 15px;
  border: 1px solid #ded6c8;
  border-radius: 11px;
  background: #f5f1e9;
  color: var(--ink);
  font: inherit;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
}
.salon-operations-tabs button.is-active,
.salon-report-filter button:not(.salon-secondary),
.salon-service-add button,
.salon-service-manager button,
.salon-customer-manager button:not(.salon-secondary) { border-color: var(--gold); background: var(--gold); }
.salon-operations-panel { margin-top: 24px; }
.salon-report-filter { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; }
.salon-report-filter label,
.salon-service-manager label { display: flex; flex-direction: column; gap: 6px; }
.salon-report-filter label span,
.salon-service-manager label > span { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.salon-report-filter input,
.salon-service-add input,
.salon-service-manager input {
  min-height: 40px;
  padding: 0 11px;
  border: 1px solid #ded6c8;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
}
.salon-kpis { margin-top: 18px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.salon-kpis article { min-height: 130px; padding: 20px; display: flex; flex-direction: column; border-radius: 17px; background: #f5f1e9; }
.salon-kpis article:first-child { background: var(--ink); color: #fff; }
.salon-kpis span { font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.salon-kpis strong { margin-top: auto; font-family: var(--font-display); font-size: 32px; font-weight: 400; }
.salon-kpis small { color: #8a8379; font-size: 10px; }
.salon-kpis article:first-child small { color: #c8a44d; }
.salon-report-table { margin-top: 18px; overflow-x: auto; border: 1px solid #e9e3d8; border-radius: 16px; }
.salon-report-table table { width: 100%; min-width: 760px; border-collapse: collapse; }
.salon-report-table th,
.salon-report-table td { padding: 13px 14px; border-bottom: 1px solid #eee9e0; text-align: left; font-size: 11px; }
.salon-report-table th { background: #f7f4ee; color: #817a70; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.salon-report-table td small { margin-top: 3px; display: block; color: var(--muted); }
.salon-report-table > p { margin: 0; padding: 22px; color: var(--muted); font-size: 11px; }
.salon-status { width: max-content; padding: 5px 8px; display: inline-flex; border-radius: 999px; background: #e8e4dd; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.salon-status.status-completed { background: #dcebdd; color: #276031; }
.salon-status.status-confirmed { background: #fff0ca; color: #76520a; }
.salon-status.status-no_show,
.salon-status.status-cancelled { background: #f8dddd; color: #8a2929; }
.salon-service-add { display: grid; grid-template-columns: minmax(180px, 2fr) minmax(130px, 1fr) 100px 100px auto; gap: 9px; }
.salon-service-manager { margin-top: 16px; display: grid; gap: 8px; }
.salon-service-manager > form { padding: 10px; display: grid; grid-template-columns: minmax(180px, 2fr) minmax(130px, 1fr) 88px 88px 76px 68px auto; align-items: end; gap: 8px; border: 1px solid #ebe5da; border-radius: 14px; }
.salon-service-active { min-height: 40px; flex-direction: row !important; align-items: center; justify-content: center; gap: 7px !important; border: 1px solid #ded6c8; border-radius: 10px; }
.salon-service-active input { min-height: 0; }
.salon-operations-note { margin: 0 0 16px; max-width: 760px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.salon-block-list { margin-bottom: 18px; padding: 18px; border-radius: 16px; background: #f7f4ee; }
.salon-block-list h3 { margin: 0 0 12px; font-size: 15px; }
.salon-block-list article { padding: 11px 0; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid #e3ddcf; }
.salon-block-list article > div { display: flex; flex-direction: column; gap: 3px; }
.salon-block-list article span,
.salon-block-list article small { color: var(--muted); font-size: 10px; }
.salon-no-show-alert { color: #a42d2d; }
.salon-booking-editor { margin: 18px 0; padding: 13px; border: 1px solid #e3dccf; border-radius: 13px; background: #f8f5ef; }
.salon-booking-editor summary { font-size: 10px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.salon-booking-editor form { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.salon-booking-editor label { display: flex; flex-direction: column; gap: 5px; }
.salon-booking-editor label span { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.salon-booking-editor input,
.salon-booking-editor select,
.salon-booking-editor textarea { width: 100%; min-height: 40px; padding: 9px 10px; border: 1px solid #ddd5c7; border-radius: 9px; background: #fff; color: var(--ink); font: inherit; font-size: 12px; }
.salon-booking-editor textarea { resize: vertical; }
.salon-booking-editor button { min-height: 42px; border: 0; border-radius: 10px; background: var(--gold); color: var(--ink); font: inherit; font-size: 10px; font-weight: 850; text-transform: uppercase; cursor: pointer; }
.salon-editor-wide { grid-column: 1 / -1; }
.salon-modal-actions-three { grid-template-columns: repeat(3, 1fr); }
.salon-modal-actions .salon-warning { background: #f0c86a; color: #2f240d; }

@media (max-width: 1050px) {
  .salon-operations-head { align-items: stretch; flex-direction: column; }
  .salon-kpis { grid-template-columns: repeat(2, 1fr); }
  .salon-service-add { grid-template-columns: 1fr 1fr; }
  .salon-service-manager > form { grid-template-columns: repeat(4, 1fr); }
  .salon-service-manager > form > input:first-child { grid-column: span 2; }
}

@media (max-width: 620px) {
  .salon-operations { margin-top: 14px; padding: 17px; border-radius: 19px; }
  .salon-operations-tabs { display: grid; grid-template-columns: 1fr 1fr; }
  .salon-kpis { grid-template-columns: 1fr 1fr; }
  .salon-kpis article { min-height: 112px; padding: 15px; }
  .salon-kpis strong { font-size: 25px; }
  .salon-report-filter label { flex: 1 1 calc(50% - 5px); }
  .salon-report-filter input { width: 100%; }
  .salon-report-filter button { flex: 1 1 calc(50% - 5px); }
  .salon-service-add { grid-template-columns: 1fr; }
  .salon-service-manager > form { grid-template-columns: 1fr 1fr; }
  .salon-service-manager > form > input:first-child,
  .salon-service-manager > form > input:nth-child(2) { grid-column: 1 / -1; }
  .salon-service-manager > form > button { grid-column: 1 / -1; }
  .salon-block-list article { align-items: flex-start; flex-direction: column; }
  .salon-booking-editor form,
  .salon-modal-actions-three { grid-template-columns: 1fr; }
  .salon-booking-editor label { grid-column: 1; }
}

.styles-section .styles-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.styles-heading > p a { color: #8d590c; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.styles-section .style-card-image img { filter: saturate(.94) contrast(1.02); }
.team-feature img { object-position: center 38%; filter: saturate(.9) contrast(1.04); }

@media (max-width: 900px) {
  .styles-section .styles-grid { grid-template-columns: repeat(3, minmax(240px, 1fr)); overflow-x: auto; scroll-snap-type: x mandatory; }
  .styles-section .style-card { scroll-snap-align: start; }
}

@media (max-width: 620px) {
  .styles-section .styles-grid { grid-template-columns: repeat(3, minmax(82vw, 1fr)); }
}

/* Salon UX pass: touch-first, quiet surfaces, explicit states. */
.salon-sidebar nav a,
.salon-sidebar nav button { position: relative; transition: background-color .16s ease, color .16s ease, transform .16s ease; }
.salon-sidebar nav a:not(.is-active):hover,
.salon-sidebar nav button:not(.is-active):hover,
.salon-sidebar nav a:focus-visible,
.salon-sidebar nav button:focus-visible { background: rgba(200,164,77,.16); color: #fff; transform: translateX(3px); outline: none; }
.salon-sidebar nav a:not(.is-active):hover::before,
.salon-sidebar nav button:not(.is-active):hover::before,
.salon-sidebar nav a:focus-visible::before,
.salon-sidebar nav button:focus-visible::before { width: 3px; position: absolute; inset: 9px auto 9px 0; border-radius: 9px; background: var(--gold); content: ""; }
.salon-nav-icon { width: 21px; height: 21px; display: none; flex: 0 0 auto; }

.salon-service-create { margin-top: 11px; border-radius: 11px; background: #f4f1eb; }
.salon-service-create > summary,
.salon-service-item > summary,
.salon-employee-list article > details > summary,
.salon-customer-edit > summary,
.salon-block-list > summary { min-height: 44px; padding: 0 13px; display: flex; align-items: center; color: var(--ink); font-size: 10px; font-weight: 850; cursor: pointer; list-style: none; }
.salon-service-create > summary::-webkit-details-marker,
.salon-service-item > summary::-webkit-details-marker,
.salon-employee-list article > details > summary::-webkit-details-marker,
.salon-customer-edit > summary::-webkit-details-marker,
.salon-block-list > summary::-webkit-details-marker { display: none; }
.salon-service-create > summary::after,
.salon-service-item > summary::after,
.salon-employee-list article > details > summary::after,
.salon-customer-edit > summary::after { margin-left: auto; color: #8d867b; font-size: 16px; content: "+"; }
.salon-service-create[open] > summary::after,
.salon-service-item[open] > summary::after,
.salon-employee-list article > details[open] > summary::after,
.salon-customer-edit[open] > summary::after { content: "−"; }
.salon-service-create .salon-service-add { margin-top: 0; border-top: 1px solid #e4ded4; border-radius: 0 0 11px 11px; }
.salon-service-manager { display: grid; gap: 6px; }
.salon-service-item { overflow: hidden; border-radius: 11px; background: #f7f5f1; }
.salon-service-item > summary { min-height: 58px; gap: 12px; }
.salon-service-item > summary > span { min-width: 0; display: flex; flex: 1; flex-direction: column; gap: 3px; }
.salon-service-item > summary strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.salon-service-item > summary small { color: var(--muted); font-size: 9px; }
.salon-service-item > summary > b { padding: 5px 8px; border-radius: 999px; background: #e5efe3; color: #3f7048; font-size: 8px; }
.salon-service-item > form { padding: 10px; display: grid; grid-template-columns: minmax(210px,1.7fr) minmax(130px,1fr) 85px 95px 120px auto; align-items: end; gap: 7px; border-top: 1px solid #e7e1d7; }
.salon-service-item label { min-width: 0; }

.salon-drag-hint { margin: 12px 2px 7px; color: var(--muted); font-size: 9px; }
.salon-employee-list { margin-top: 0; }
.salon-employee-list > article { overflow: hidden; border-left: 5px solid var(--employee-color); border-radius: 12px; background: #f7f5f1; transition: opacity .16s ease, transform .16s ease, box-shadow .16s ease; }
.salon-employee-list > article.is-dragging { z-index: 3; opacity: .82; transform: scale(.985); box-shadow: 0 14px 30px rgba(17,16,14,.17); }
.salon-employee-list > article > header { min-height: 68px; padding: 9px 10px; display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 11px; }
.salon-employee-list > article > header > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.salon-employee-list > article > header strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.salon-employee-list > article > header small { color: var(--muted); font-size: 9px; }
.salon-drag-handle { min-height: 40px; padding: 0 13px; touch-action: none; border: 1px solid #dcd5ca !important; background: #fff !important; color: var(--ink) !important; font-size: 9px !important; cursor: grab !important; user-select: none; }
.salon-drag-handle:active { cursor: grabbing !important; background: var(--gold) !important; }
.salon-employee-list > article > details { border-top: 1px solid #e6e0d6; }
.salon-employee-list > article > details > form { padding: 10px; display: grid; grid-template-columns: minmax(190px,1fr) 105px minmax(210px,1fr) 125px auto; align-items: end; gap: 8px; }
.salon-employee-list > article > details > form > button { min-height: 40px; padding: 0 13px; border: 0; border-radius: 8px; background: var(--gold); color: var(--ink); font: inherit; font-size: 9px; font-weight: 850; }

.salon-risk-list { margin-bottom: 12px; padding: 11px; border-radius: 13px; background: #f8e7e4; }
.salon-risk-list > header { margin-bottom: 8px; display: flex; align-items: center; justify-content: space-between; color: #8a3027; }
.salon-risk-list > header strong { font-size: 11px; }
.salon-risk-list > header span { font-size: 9px; font-weight: 800; }
.salon-risk-list > div { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.salon-risk-list button { min-height: 54px; padding: 7px 9px; display: grid; grid-template-columns: 30px minmax(0,1fr) auto; align-items: center; gap: 8px; background: #fff; color: var(--ink); text-align: left; }
.salon-risk-list button > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #b44235; color: #fff; font-size: 10px; font-weight: 900; }
.salon-risk-list button > div { min-width: 0; display: flex; flex-direction: column; }
.salon-risk-list button strong,
.salon-risk-list button small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.salon-risk-list button strong { font-size: 10px; }
.salon-risk-list button small { color: var(--muted); font-size: 8px; }
.salon-risk-list button b { color: #94372e; font-size: 8px; }
.salon-block-list { margin-bottom: 12px; overflow: hidden; border-radius: 12px; background: #f4f1eb; }
.salon-block-list article { margin: 0 8px 8px; }
.salon-customer-modal-head,
.salon-booking-detail-head { margin-bottom: 17px; display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.salon-customer-modal-head h2,
.salon-booking-detail-head h2 { margin: 0; font-size: 28px; }
.salon-customer-modal-head > div,
.salon-booking-detail-head > div { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.salon-customer-modal-head > div > span { color: #a13b31; font-size: 9px; font-weight: 800; }
.salon-customer-modal-head > button,
.salon-booking-detail-head > button { min-height: 36px; padding: 0 11px; border-radius: 9px; background: #ece8e1; color: var(--ink); }
.salon-customer-detail-kpis article.is-risk { background: #f5dcd8; color: #8d2f27; }
.salon-customer-edit { margin: 14px 0; overflow: hidden; border-radius: 12px; background: #f5f2ec; }
.salon-customer-edit form { padding: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; border-top: 1px solid #e5dfd5; }
.salon-customer-edit label { display: flex; flex-direction: column; gap: 5px; }
.salon-customer-edit label span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.salon-customer-edit input { min-height: 40px; padding: 0 10px; border: 0; border-radius: 8px; background: #fff; font: inherit; font-size: 11px; }
.salon-customer-edit button { min-height: 40px; grid-column: 1 / -1; background: var(--gold); color: var(--ink); }

.salon-booking-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.salon-booking-facts > div { min-height: 64px; padding: 10px 11px; display: flex; flex-direction: column; gap: 4px; border-radius: 10px; background: #f5f2ec; }
.salon-booking-facts > div > span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.salon-booking-facts > div > strong { overflow-wrap: anywhere; font-size: 11px; line-height: 1.45; }
.salon-booking-facts a { color: #8d590c; }
.salon-payment-panel { margin-top: 12px; padding: 12px; border-radius: 12px; background: #f7e8e5; }
.salon-payment-panel.is-paid { background: #e8f1e7; }
.salon-payment-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.salon-payment-panel > header > div { display: flex; flex-direction: column; gap: 2px; }
.salon-payment-panel > header span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.salon-payment-panel > header strong { font-size: 13px; }
.salon-payment-panel > header b { padding: 5px 8px; border-radius: 999px; background: #fff; font-size: 8px; }
.salon-payment-panel > div { margin-top: 10px; display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
.salon-payment-panel button { min-height: 38px; background: #fff; color: var(--ink); }
.salon-payment-panel button.is-active { background: var(--ink); color: #fff; }
.salon-payment-panel .salon-remove-payment { grid-column: 1 / -1; background: transparent; color: #91382e; text-decoration: underline; }
.salon-finished-actions { margin-top: 13px; padding: 10px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-radius: 11px; background: #efede8; }
.salon-finished-actions span { color: var(--muted); font-size: 10px; }
.salon-finished-actions button { min-height: 36px; padding: 0 11px; background: #fff; color: var(--ink); }
.salon-reopen-booking { grid-column: 1 / -1; }
.salon-desktop-week button.status-completed,
.salon-mobile-appointment-list > button.status-completed,
.goldcut-schedule-event.status-completed { opacity: .46; filter: grayscale(.7); background: #deddd9 !important; }
.salon-desktop-week button.status-no_show,
.salon-mobile-appointment-list > button.status-no_show,
.goldcut-schedule-event.status-no_show { opacity: .62; }
.salon-booking-editor { margin: 12px 0 0; padding: 0; overflow: hidden; border: 0; border-radius: 11px; background: #f4f1eb; }
.salon-booking-editor summary { min-height: 42px; padding: 0 12px; display: flex; align-items: center; list-style: none; }
.salon-booking-editor summary::after { margin-left: auto; content: "+"; font-size: 16px; }
.salon-booking-editor[open] summary::after { content: "−"; }
.salon-booking-editor form { margin: 0; padding: 10px; border-top: 1px solid #e3ddd3; }

.customer-details-head { display: flex; align-items: end; justify-content: space-between; gap: 14px; }
.customer-details-head > div p { margin: 0 0 4px; color: #a5660c; font-size: 9px; font-weight: 850; letter-spacing: .17em; }
.customer-details-head > a { min-height: 36px; padding: 0 11px; display: inline-flex; align-items: center; border-radius: 10px; background: #f1ede6; color: var(--ink); font-size: 9px; font-weight: 800; }

.customer-portal-page { min-height: 100svh; padding: 28px; background: #ece9e2; color: var(--ink); }
.customer-portal-back { position: fixed; top: 24px; left: 24px; color: #5f5a53; font-size: 11px; font-weight: 750; }
.customer-access-card { width: min(100%,450px); margin: 8vh auto 0; padding: 38px; border-radius: 24px; background: #fff; box-shadow: 0 24px 64px rgba(17,16,14,.13); text-align: center; }
.customer-access-card h1 { margin: 8px 0 5px; font-size: 38px; }
.customer-access-card > p { margin: 0 auto 24px; max-width: 330px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.customer-access-card form,
.customer-profile-card form { display: grid; gap: 11px; text-align: left; }
.customer-access-card label,
.customer-profile-card label { display: flex; flex-direction: column; gap: 5px; }
.customer-access-card label span,
.customer-profile-card label span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.customer-access-card input,
.customer-profile-card input { min-height: 46px; padding: 0 12px; border: 1px solid #ded7cc; border-radius: 10px; background: #fff; color: var(--ink); font: inherit; }
.customer-access-card button,
.customer-profile-card button { min-height: 46px; border: 0; border-radius: 10px; background: var(--gold); color: var(--ink); font: inherit; font-size: 10px; font-weight: 850; }
.customer-portal-error,
.customer-portal-notice { margin: 0; padding: 10px; border-radius: 9px; background: #f5dcd8; color: #852f27; font-size: 10px; }
.customer-portal-notice { background: #e3eee1; color: #38623e; }
.customer-portal-header { max-width: 1180px; margin: 0 auto 18px; padding: 10px 12px; display: grid; grid-template-columns: 58px minmax(0,1fr) auto; align-items: center; gap: 12px; border-radius: 16px; background: #11100e; color: #fff; }
.customer-portal-header > div { min-width: 0; display: flex; flex-direction: column; }
.customer-portal-header h1 { margin: 0; font-size: 22px; }
.customer-portal-header span { overflow: hidden; color: #aca59a; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.customer-portal-header button { min-height: 38px; padding: 0 11px; border: 0; border-radius: 9px; background: #292723; color: #fff; font: inherit; font-size: 9px; font-weight: 800; }
.customer-portal-grid { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,.7fr); gap: 14px; }
.customer-appointments,
.customer-profile-card { padding: 20px; border-radius: 18px; background: #fff; }
.customer-appointments h2,
.customer-profile-card h2 { margin: 0 0 11px; font-size: 18px; }
.customer-appointments h2:not(:first-child) { margin-top: 23px; }
.customer-appointments > div { display: grid; gap: 6px; }
.customer-appointments article { min-height: 72px; padding: 11px 12px; display: grid; grid-template-columns: 1.2fr 1fr 1fr auto; align-items: center; gap: 10px; border-left: 4px solid var(--gold); border-radius: 10px; background: #f7f5f1; }
.customer-appointments article.status-completed,
.customer-appointments article.status-cancelled { opacity: .55; filter: grayscale(.6); }
.customer-appointments article time,
.customer-appointments article span { color: var(--muted); font-size: 9px; }
.customer-appointments article strong { font-size: 11px; }
.customer-appointments article b { padding: 5px 7px; border-radius: 999px; background: #eee8dd; font-size: 8px; }
.customer-empty { margin: 0; padding: 24px; border-radius: 10px; background: #f7f5f1; color: var(--muted); font-size: 11px; text-align: center; }

@media (max-width: 900px) {
  .salon-bottom-nav { grid-auto-flow: unset; grid-template-columns: repeat(6,minmax(0,1fr)); min-height: 62px; }
  .salon-bottom-nav a,
  .salon-bottom-nav button { min-height: 50px; padding: 4px 1px; gap: 3px; font-size: 7px; }
  .salon-bottom-nav .salon-nav-icon { width: 19px; height: 19px; display: block; }
  .salon-bottom-nav a span,
  .salon-bottom-nav button span { max-width: 100%; overflow: hidden; font-size: 7px; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
  .salon-service-item > form { grid-template-columns: 1fr 1fr; }
  .salon-service-item .salon-service-name,
  .salon-service-item .salon-service-actions { grid-column: 1 / -1; }
  .salon-employee-list > article > details > form { grid-template-columns: 1fr 86px; }
  .salon-employee-list .salon-photo-field,
  .salon-employee-list .salon-employee-active,
  .salon-employee-list > article > details > form > button { grid-column: 1 / -1; }
  .salon-risk-list > div { grid-template-columns: 1fr 1fr; }
  .customer-portal-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .salon-category-row { gap: 7px; }
  .salon-category-tabs { margin-right: -13px; padding-right: 13px; }
  .salon-category-tabs button { min-height: 38px; padding: 0 10px; font-size: 9px; }
  .salon-category-manage-button { min-height: 36px; padding: 0 10px; }
  .salon-service-create > summary { min-height: 40px; }
  .salon-service-item > summary { min-height: 54px; }
  .salon-service-item > summary > b { display: none; }
  .salon-service-item > form { grid-template-columns: 1fr 1fr; }
  .salon-service-item .salon-service-name,
  .salon-service-item .salon-service-active,
  .salon-service-item .salon-service-actions { grid-column: 1 / -1; }
  .salon-service-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .salon-service-actions button:last-child { grid-column: 1 / -1; }
  .salon-employee-list > article > header { grid-template-columns: 44px minmax(0,1fr) auto; }
  .salon-drag-handle { min-height: 36px; padding: 0 9px; }
  .salon-employee-list > article > details > form { grid-template-columns: 1fr 72px; }
  .salon-risk-list > div { grid-template-columns: 1fr; }
  .salon-customer-detail { max-height: 94svh; padding: 18px 15px 22px; }
  .salon-customer-modal-head h2,
  .salon-booking-detail-head h2 { font-size: 22px; }
  .salon-customer-detail-kpis { gap: 5px; }
  .salon-customer-detail-kpis article { min-height: 67px; }
  .salon-customer-edit form { grid-template-columns: 1fr; }
  .salon-customer-edit button { grid-column: 1; }
  .salon-customer-history article { grid-template-columns: 6px minmax(0,1fr) auto; }
  .salon-customer-history article > b { grid-column: 2 / -1; text-align: left; }
  .salon-booking-detail { max-height: 94svh; padding: 18px 15px 22px; }
  .salon-booking-facts { grid-template-columns: 1fr; }
  .salon-booking-facts > div { min-height: 54px; }
  .salon-payment-panel > div { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .salon-finished-actions { align-items: stretch; flex-direction: column; }
  .customer-details-head { align-items: start; }
  .customer-details-head > a { white-space: nowrap; }
  .customer-portal-page { padding: 12px; }
  .customer-portal-back { position: static; display: inline-block; margin: 7px 4px; }
  .customer-access-card { margin-top: 4vh; padding: 25px 18px; }
  .customer-portal-header { grid-template-columns: 48px minmax(0,1fr) auto; }
  .customer-portal-header img { width: 48px; height: 48px; }
  .customer-portal-header h1 { font-size: 18px; }
  .customer-appointments,
  .customer-profile-card { padding: 14px; }
  .customer-appointments article { grid-template-columns: 1fr auto; }
  .customer-appointments article time,
  .customer-appointments article > span { grid-column: 1 / -1; }
}

/* Mitarbeiterwahl: bewusst vor dem Kalender und horizontal kompakt auf dem Handy. */
.employee-picker { margin-bottom: 28px; }
.employee-picker-head { margin-bottom: 11px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.employee-picker-head h3 { margin: 0; font-family: var(--font-sans); font-size: 14px; font-weight: 850; letter-spacing: -.02em; }
.employee-picker-head > span { color: var(--muted); font-size: 9px; font-weight: 750; text-transform: uppercase; }
.employee-picker-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.employee-picker-options button { min-width: 0; min-height: 116px; padding: 11px 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #e2ddd4; border-radius: 15px; background: #fff; color: var(--ink); font: inherit; cursor: pointer; }
.employee-picker-options button.is-selected { border-color: var(--gold); background: #fbf4e3; box-shadow: inset 0 0 0 1px var(--gold); }
.employee-picker-photo,
.employee-any-mark { width: 48px; height: 48px; margin-bottom: 8px; display: grid; place-items: center; flex: 0 0 auto; overflow: hidden; border-radius: 50%; background-position: center; background-size: cover; color: #fff; font-size: 17px; font-weight: 900; }
.employee-any-mark { background: var(--ink); }
.employee-picker-options strong { max-width: 100%; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.employee-picker-options small { margin-top: 3px; color: var(--muted); font-size: 8px; font-weight: 750; }
.calendar-summary small { color: var(--muted); font-size: 9px; }

.salon-employee-legend { margin: -4px 0 10px; padding: 6px 8px; display: flex; flex-wrap: wrap; gap: 7px; border-radius: 10px; background: rgba(255,255,255,.58); }
.salon-employee-legend span { display: inline-flex; align-items: center; gap: 5px; color: #625e57; font-size: 9px; font-weight: 750; }
.salon-employee-legend i { width: 8px; height: 8px; border-radius: 50%; }
.goldcut-schedule-event { border-left: 5px solid var(--gold) !important; }
.salon-desktop-week button:not(.is-blocked),
.salon-mobile-appointment-list > button:not(.is-blocked) { border-left-width: 5px; border-left-style: solid; }

.salon-employee-add { padding: 10px; display: grid; grid-template-columns: minmax(190px,1fr) 90px minmax(220px,1fr) auto; align-items: end; gap: 8px; border-radius: 12px; background: #f3f0ea; }
.salon-employee-add > input,
.salon-employee-add label,
.salon-employee-list label { min-width: 0; }
.salon-employee-add label,
.salon-employee-list label { display: flex; flex-direction: column; gap: 5px; }
.salon-employee-add label > span,
.salon-employee-list label > span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.salon-employee-add input,
.salon-employee-list input { width: 100%; min-height: 40px; padding: 0 10px; border: 0; border-radius: 8px; background: #fff; color: var(--ink); font: inherit; font-size: 11px; }
.salon-employee-add input[type="color"],
.salon-employee-list input[type="color"] { padding: 4px; }
.salon-photo-field input { padding: 8px; font-size: 9px; }
.salon-employee-add > button,
.salon-employee-actions button { min-height: 40px; padding: 0 12px; border: 0; border-radius: 8px; background: var(--gold); color: var(--ink); font: inherit; font-size: 9px; font-weight: 850; cursor: pointer; }
.salon-capability-field { min-width: 0; margin: 0; padding: 10px; grid-column: 1 / -1; border: 1px solid #e1dbd0; border-radius: 10px; background: #fff; }
.salon-capability-field legend { padding: 0 5px; color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.salon-capability-field > div { display: flex; flex-wrap: wrap; gap: 7px; }
.salon-capability-field label { min-height: 34px; padding: 0 10px; display: inline-flex !important; flex-direction: row !important; align-items: center; gap: 7px !important; border: 1px solid #e2ddd4; border-radius: 999px; background: #f6f3ed; color: var(--ink); font-size: 9px; font-weight: 800; cursor: pointer; }
.salon-capability-field input { width: 15px !important; min-height: 15px !important; padding: 0 !important; accent-color: var(--gold); }
.salon-capability-field input:checked + span { color: #80500b; }
.salon-employee-list { margin-top: 8px; display: grid; gap: 7px; }
.salon-employee-list > form { padding: 10px; display: grid; grid-template-columns: 54px minmax(170px,1.2fr) 110px minmax(190px,1fr) 120px minmax(240px,auto); align-items: end; gap: 8px; border-left: 5px solid var(--employee-color); border-radius: 11px; background: #f7f5f1; }
.salon-employee-avatar { width: 48px; height: 48px; display: grid; place-items: center; align-self: center; overflow: hidden; border-radius: 50%; background-position: center; background-size: cover; color: #fff; font-size: 17px; font-weight: 900; }
.salon-employee-active { min-height: 40px; padding: 0 9px; flex-direction: row !important; align-items: center; border-radius: 8px; background: #fff; }
.salon-employee-active input { width: 16px; min-height: 16px; padding: 0; accent-color: var(--gold); }
.salon-employee-actions { display: flex; justify-content: flex-end; gap: 5px; }
.salon-employee-actions button:not(:last-child) { background: #e7e2da; }
.salon-employee-actions button:disabled { opacity: .35; cursor: default; }

@media (max-width: 1180px) {
  .salon-employee-list > form { grid-template-columns: 54px minmax(180px,1fr) 100px minmax(180px,1fr) 120px; }
  .salon-employee-actions { grid-column: 2 / -1; justify-content: flex-start; }
}

@media (max-width: 720px) {
  .employee-picker-options { margin-right: -14px; padding-right: 14px; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .employee-picker-options::-webkit-scrollbar { display: none; }
  .employee-picker-options button { width: 112px; flex: 0 0 112px; scroll-snap-align: start; }
  .salon-employee-legend { overflow-x: auto; flex-wrap: nowrap; white-space: nowrap; scrollbar-width: none; }
  .salon-employee-add { grid-template-columns: 1fr 86px; }
  .salon-employee-add .salon-photo-field { grid-column: 1 / -1; }
  .salon-employee-add > button { grid-column: 1 / -1; }
  .salon-employee-list > form { grid-template-columns: 48px minmax(0,1fr) 72px; align-items: end; }
  .salon-employee-avatar { width: 44px; height: 44px; }
  .salon-employee-list .salon-photo-field,
  .salon-employee-active,
  .salon-employee-actions { grid-column: 1 / -1; }
  .salon-employee-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .salon-employee-actions button:last-child { grid-column: 1 / -1; }
}

/* Mobile-first salon agenda: the daily workflow stays separate from administration. */
.salon-header-link {
  min-height: 39px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d4cfc5;
  border-radius: 11px;
  background: #fff;
  color: var(--ink);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}
.salon-portal {
  display: grid;
  grid-template-columns: 218px minmax(0, 1fr);
  align-items: start;
  gap: 20px;
  padding: 16px 20px 44px 16px;
}
.salon-app-main { min-width: 0; }
.salon-sidebar {
  min-height: calc(100svh - 32px);
  position: sticky;
  top: 16px;
  padding: 16px 12px;
  display: flex;
  flex-direction: column;
  border-radius: 21px;
  background: var(--ink);
  color: #fff;
}
.salon-sidebar-brand { padding: 2px 7px 17px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid rgba(255,255,255,.1); }
.salon-sidebar-brand img { object-fit: contain; }
.salon-sidebar-brand span { display: flex; flex-direction: column; line-height: 1.1; }
.salon-sidebar-brand strong { font-size: 15px; }
.salon-sidebar-brand small { margin-top: 4px; color: #aaa399; font-size: 9px; }
.salon-sidebar nav { margin-top: 15px; display: flex; flex-direction: column; gap: 16px; }
.salon-sidebar nav section { display: grid; gap: 4px; }
.salon-sidebar nav h2 { margin: 0 8px 4px; color: #817a70; font-family: var(--font-sans); font-size: 8px; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.salon-sidebar nav a,
.salon-sidebar nav button { min-height: 42px; padding: 0 10px; display: flex; align-items: center; gap: 10px; border: 0; border-radius: 11px; background: transparent; color: #d7d2c9; font: inherit; font-size: 11px; font-weight: 750; text-align: left; cursor: pointer; }
.salon-sidebar nav a i,
.salon-sidebar nav button i { width: 22px; color: #a69f94; font-size: 16px; font-style: normal; text-align: center; }
.salon-sidebar nav a.is-active,
.salon-sidebar nav button.is-active { background: var(--gold); color: var(--ink); }
.salon-sidebar nav .is-active i { color: var(--ink); }
.salon-sidebar-account { margin: auto 7px 0; padding-top: 14px; overflow: hidden; border-top: 1px solid rgba(255,255,255,.1); color: #8e877d; font-size: 9px; text-overflow: ellipsis; }
.salon-mobile-agenda,
.salon-bottom-nav { display: none; }
.salon-management-page .salon-operations { margin-top: 18px; }

@media (max-width: 900px) {
  .salon-portal { display: block; padding: 15px 12px calc(92px + env(safe-area-inset-bottom)); background: #f0ede6; }
  .salon-sidebar { display: none; }
  .salon-portal-header { margin-bottom: 14px; }
  .salon-portal-header nav { display: none; }
  .salon-toolbar {
    position: sticky;
    z-index: 20;
    top: 0;
    margin-bottom: 10px;
    border: 1px solid #e2ddd3;
    box-shadow: 0 10px 26px rgba(17, 16, 14, .07);
  }
  .salon-toolbar > strong { font-size: 12px; }
  .salon-toolbar > span { font-size: 10px; }
  .salon-mobile-list { display: none; }
  .salon-mobile-agenda { max-width: 760px; margin: 0 auto; display: block; }
  .salon-mobile-week-strip {
    padding: 5px;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
    border: 1px solid #dfd9cf;
    border-radius: 18px;
    background: #fff;
  }
  .salon-mobile-week-strip button {
    min-width: 0;
    min-height: 70px;
    padding: 7px 2px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    border-radius: 13px;
    background: transparent;
    color: var(--ink);
  }
  .salon-mobile-week-strip button.is-active { background: var(--ink); color: #fff; }
  .salon-mobile-week-strip button span { font-size: 9px; text-transform: uppercase; }
  .salon-mobile-week-strip button strong { font-size: 19px; line-height: 1; }
  .salon-mobile-week-strip button small { min-width: 18px; min-height: 18px; display: grid; place-items: center; border-radius: 999px; background: #eee9df; color: #6f6a61; font-size: 9px; }
  .salon-mobile-week-strip button.is-active small { background: var(--gold); color: var(--ink); }
  .salon-mobile-day { margin-top: 10px; overflow: hidden; border: 1px solid #dfd9cf; border-radius: 20px; background: #fff; }
  .salon-mobile-day > header { padding: 18px; display: flex; align-items: end; justify-content: space-between; gap: 14px; border-bottom: 1px solid #ece7de; }
  .salon-mobile-day > header div { display: flex; flex-direction: column; }
  .salon-mobile-day > header span { color: #98600d; font-size: 10px; font-weight: 850; text-transform: uppercase; }
  .salon-mobile-day > header strong { margin-top: 1px; font-size: 20px; text-transform: capitalize; }
  .salon-mobile-day > header b { color: var(--muted); font-size: 10px; }
  .salon-mobile-appointment-list { padding: 8px; display: grid; gap: 7px; }
  .salon-mobile-appointment-list > button {
    width: 100%;
    min-height: 78px;
    padding: 11px 12px;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 12px;
    border: 1px solid #ebe5da;
    border-left: 5px solid var(--gold);
    border-radius: 14px;
    background: #faf8f3;
    color: var(--ink);
    text-align: left;
  }
  .salon-mobile-appointment-list > button.status-completed { border-left-color: #4e8959; background: #f1f7f1; }
  .salon-mobile-appointment-list > button.status-no_show { border-left-color: #b44235; background: #fbf1ef; }
  .salon-mobile-appointment-list > button.is-blocked { border-left-color: #595650; background: #efede8; }
  .salon-mobile-appointment-list time { display: flex; flex-direction: column; color: #8d590c; font-size: 18px; font-weight: 900; line-height: 1; }
  .salon-mobile-appointment-list time small { margin-top: 5px; color: var(--muted); font-size: 8px; font-weight: 700; }
  .salon-mobile-appointment-list > button > span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .salon-mobile-appointment-list > button > span strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  .salon-mobile-appointment-list > button > span small { overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
  .salon-mobile-appointment-list > button > span em { color: #8d590c; font-size: 9px; font-style: normal; font-weight: 800; }
  .salon-mobile-appointment-list > button > b { font-size: 24px; font-weight: 400; }
  .salon-mobile-empty { min-height: 150px; padding: 28px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 14px; background: #f8f5ef; text-align: center; }
  .salon-mobile-empty strong { font-size: 15px; }
  .salon-mobile-empty span { max-width: 260px; margin-top: 4px; color: var(--muted); font-size: 11px; }
  .salon-bottom-nav {
    position: fixed;
    z-index: 90;
    left: 10px;
    right: 10px;
    bottom: calc(10px + env(safe-area-inset-bottom));
    min-height: 68px;
    padding: 6px;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    gap: 4px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 20px;
    background: rgba(17, 16, 14, .96);
    box-shadow: 0 14px 35px rgba(17, 16, 14, .3);
  }
  .salon-bottom-nav a,
  .salon-bottom-nav button {
    min-width: 0;
    min-height: 56px;
    padding: 5px 3px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: #d9d4ca;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
  }
  .salon-bottom-nav a span,
  .salon-bottom-nav button span { font-size: 19px; line-height: 1; }
  .salon-bottom-nav .is-active { background: var(--gold); color: var(--ink); }
  .salon-management-page .salon-booking-visibility { margin-bottom: 10px; }
  .salon-management-page .salon-operations { margin-top: 10px; }
}

@media (max-width: 620px) {
  .salon-portal-header { align-items: center; }
  .salon-portal-header .salon-kicker { display: none; }
  .salon-portal-header h1 { font-family: var(--font-sans); font-size: 23px; font-weight: 850; letter-spacing: -.03em; text-transform: none; }
  .salon-toolbar { padding: 9px 10px; }
  .salon-toolbar > strong { grid-column: 1 / -1; }
  .salon-mobile-week-strip button { min-height: 64px; }
  .salon-mobile-week-strip button strong { font-size: 17px; }
  .salon-modal-backdrop { padding: 0; align-items: end; }
  .salon-modal { width: 100%; max-height: 92svh; border-radius: 24px 24px 0 0; }
  .salon-operations-head h2 { font-family: var(--font-sans); font-size: 25px; font-weight: 850; letter-spacing: -.03em; text-transform: none; }
  .salon-operations-tabs { grid-template-columns: repeat(3, 1fr); }
  .salon-operations-tabs button { padding: 0 7px; font-size: 9px; }
}

/* Compact salon cockpit: dense enough for a laptop, calm enough for a phone. */
.salon-app-main { width: 100%; max-width: 1540px; margin: 0 auto; }
.salon-portal-header { min-height: 64px; padding: 8px 2px 12px; }
.salon-portal-header > div img { width: 46px; height: 46px; }
.salon-portal-header h1 { font-size: clamp(28px, 3vw, 42px); }
.salon-toolbar { min-height: 54px; padding: 7px 10px; }
.goldcut-schedule-scroll { display: none !important; }
.salon-desktop-week {
  padding: 2px 0 12px;
  display: grid;
  grid-template-columns: repeat(7, minmax(145px, 1fr));
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.salon-desktop-week > article {
  min-height: 420px;
  overflow: hidden;
  border: 1px solid #dfd9cf;
  border-radius: 16px;
  background: #fff;
}
.salon-desktop-week > article > header {
  min-height: 62px;
  padding: 11px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #ebe6dd;
  background: #f7f4ee;
}
.salon-desktop-week > article > header div { display: flex; flex-direction: column; gap: 2px; }
.salon-desktop-week > article > header span { overflow: hidden; font-size: 9px; font-weight: 850; letter-spacing: .06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.salon-desktop-week > article > header strong { color: #857e74; font-size: 10px; }
.salon-desktop-week > article > header b { min-width: 25px; min-height: 25px; display: grid; place-items: center; border-radius: 999px; background: #e9e3d8; font-size: 9px; }
.salon-desktop-week > article > div { padding: 7px; display: grid; align-content: start; gap: 6px; }
.salon-desktop-week > article > div > p { margin: 16px 5px; color: #aaa39a; font-size: 10px; text-align: center; }
.salon-desktop-week button {
  min-height: 65px;
  padding: 8px;
  display: grid;
  grid-template-columns: 39px minmax(0, 1fr) 8px;
  align-items: center;
  gap: 7px;
  border: 1px solid #e9e2d5;
  border-left: 4px solid var(--gold);
  border-radius: 11px;
  background: #fbf8f2;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.salon-desktop-week button.status-completed { border-left-color: #4e8959; background: #f0f6f0; }
.salon-desktop-week button.status-no_show { border-left-color: #b44235; background: #fbf1ef; }
.salon-desktop-week button.status-cancelled { opacity: .55; }
.salon-desktop-week button.is-blocked { border-left-color: #5d5953; background: #efede8; }
.salon-desktop-week button time { color: #86540d; font-size: 11px; font-weight: 900; }
.salon-desktop-week button > span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.salon-desktop-week button > span strong,
.salon-desktop-week button > span small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.salon-desktop-week button > span strong { font-size: 10px; }
.salon-desktop-week button > span small { color: var(--muted); font-size: 8px; }
.salon-desktop-week button > b { font-size: 16px; font-weight: 400; }

.salon-operations { max-width: none; margin: 12px auto 24px; padding: 22px; border-radius: 19px; box-shadow: 0 12px 35px rgba(17,16,14,.05); }
.salon-management-header { min-height: 58px; padding-bottom: 7px; }
.salon-management-page .salon-booking-visibility { margin: 10px 0 0; }
.salon-operations-head h2 { font-family: var(--font-sans); font-size: clamp(26px, 2.6vw, 38px); font-weight: 900; letter-spacing: -.04em; text-transform: none; }
.salon-operations-intro { max-width: 630px; font-size: 11px; }

.salon-hours-list { display: grid; gap: 8px; }
.salon-hours-list > article {
  min-height: 72px;
  padding: 10px 12px;
  display: grid;
  grid-template-columns: minmax(150px, 1fr) 100px minmax(260px, .9fr);
  align-items: center;
  gap: 16px;
  border: 1px solid #e7e1d7;
  border-radius: 14px;
  background: #f7f4ee;
}
.salon-hours-list > article.is-open { background: #fff; }
.salon-hours-list > article > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.salon-hours-list > article > div:first-child strong { font-size: 13px; }
.salon-hours-list > article > div:first-child span { color: var(--muted); font-size: 10px; }
.salon-day-toggle { min-height: 38px; padding: 5px 9px; display: flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid #ddd6ca; border-radius: 999px; background: #fff; color: #766f65; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.salon-day-toggle input { accent-color: var(--gold); }
.salon-hours-times { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.salon-hours-times label { display: flex; align-items: center; gap: 7px; }
.salon-hours-times label span { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.salon-hours-times input { width: 100%; min-height: 39px; padding: 0 8px; border: 1px solid #ddd6ca; border-radius: 9px; background: #fff; font: inherit; font-size: 11px; }
.salon-hours-times input:disabled { opacity: .35; }
.salon-sticky-save { margin-top: 12px; padding: 12px 14px; position: sticky; bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid #ded6c8; border-radius: 14px; background: rgba(255,255,255,.94); box-shadow: 0 12px 34px rgba(17,16,14,.1); backdrop-filter: blur(12px); }
.salon-sticky-save p { margin: 0; color: var(--muted); font-size: 10px; }
.salon-sticky-save button { min-height: 42px; padding: 0 17px; border: 0; border-radius: 10px; background: var(--gold); color: var(--ink); font: inherit; font-size: 10px; font-weight: 900; text-transform: uppercase; cursor: pointer; }

.salon-category-tabs { margin-bottom: 13px; display: flex; gap: 7px; overflow-x: auto; scrollbar-width: thin; }
.salon-category-tabs button { min-width: max-content; min-height: 43px; padding: 0 13px; display: flex; align-items: center; gap: 8px; border: 1px solid #ddd6ca; border-radius: 11px; background: #f7f4ee; color: var(--ink); font: inherit; font-size: 10px; font-weight: 850; cursor: pointer; }
.salon-category-tabs button small { min-width: 20px; min-height: 20px; display: grid; place-items: center; border-radius: 999px; background: #e8e2d7; font-size: 8px; }
.salon-category-tabs button.is-active { border-color: var(--ink); background: var(--ink); color: #fff; }
.salon-category-tabs button.is-active small { background: var(--gold); color: var(--ink); }
.salon-service-title { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.salon-service-title strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.salon-service-title span { color: var(--muted); font-size: 8px; }
.salon-service-manager > form { grid-template-columns: minmax(130px, 1.2fr) minmax(150px, 1.4fr) minmax(105px, .9fr) 82px 82px 65px 67px auto; }
.salon-service-manager > form > input:first-of-type { grid-column: auto; }

.salon-revenue-kpis { margin-top: 0; }
.salon-analytics-grid { margin-top: 13px; display: grid; grid-template-columns: minmax(0, 2fr) minmax(250px, .8fr); gap: 12px; }
.salon-chart-card { min-height: 285px; padding: 17px; border: 1px solid #e8e2d7; border-radius: 16px; background: #fff; }
.salon-chart-card > header { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.salon-chart-card > header div { display: flex; flex-direction: column; gap: 3px; }
.salon-chart-card > header span { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .1em; }
.salon-chart-card > header strong { font-size: 14px; text-transform: capitalize; }
.salon-chart-card > header b { font-family: var(--font-display); font-size: 25px; font-weight: 400; }
.salon-revenue-bars { height: 205px; margin-top: 18px; display: grid; grid-template-columns: repeat(31, 1fr); align-items: end; gap: 3px; }
.salon-revenue-bars > div { height: 100%; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: end; gap: 5px; }
.salon-revenue-bars i { width: 100%; max-width: 15px; min-height: 2px; display: block; border-radius: 4px 4px 1px 1px; background: linear-gradient(180deg, var(--gold), #9c6b18); }
.salon-revenue-bars span { height: 10px; color: #8d867c; font-size: 7px; }
.salon-status-chart { display: flex; flex-direction: column; }
.salon-donut { width: 142px; aspect-ratio: 1; margin: 19px auto; position: relative; display: grid; place-items: center; border-radius: 50%; }
.salon-donut::after { width: 84px; aspect-ratio: 1; position: absolute; border-radius: 50%; background: #fff; content: ""; }
.salon-donut span { z-index: 1; display: flex; flex-direction: column; align-items: center; font-size: 9px; }
.salon-donut strong { font-size: 22px; }
.salon-chart-legend { margin-top: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.salon-chart-legend span { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 9px; }
.salon-chart-legend i { width: 8px; height: 8px; border-radius: 50%; }
.salon-ledger { margin-top: 13px; }

.salon-customer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.salon-customer-grid > button { min-height: 82px; padding: 10px 12px; position: relative; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto 8px; align-items: center; gap: 10px; border: 1px solid #e7e1d6; border-radius: 14px; background: #fff; color: var(--ink); text-align: left; }
.salon-customer-avatar { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #f1eadb; color: #76520a; font-size: 11px; font-weight: 900; }
.salon-customer-grid > button > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.salon-customer-grid > button > div strong,
.salon-customer-grid > button > div span,
.salon-customer-grid > button > div small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.salon-customer-grid > button > div strong { font-size: 12px; }
.salon-customer-grid > button > div span { color: #7c7469; font-size: 9px; }
.salon-customer-grid > button > div small { color: #aaa298; font-size: 8px; }
.salon-customer-grid > button > span:not(.salon-customer-avatar) { padding: 5px 7px; border-radius: 999px; background: #edf3eb; color: #3f7248; font-size: 8px; font-weight: 850; }
.salon-customer-grid > button > span.has-no-show { background: #f7dfdc; color: #95382e; }
.salon-customer-grid > button > em { position: absolute; top: 5px; right: 6px; padding: 3px 5px; border-radius: 999px; background: #b44235; color: #fff; font-size: 7px; font-style: normal; font-weight: 850; text-transform: uppercase; }
.salon-customer-detail { width: min(780px, 100%); }
.salon-customer-detail-kpis { margin: 17px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.salon-customer-detail-kpis article { min-height: 84px; padding: 12px; display: flex; flex-direction: column; justify-content: space-between; border-radius: 12px; background: #f4f0e8; }
.salon-customer-detail-kpis span { color: var(--muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.salon-customer-detail-kpis strong { font-size: 20px; }
.salon-customer-history { max-height: 280px; overflow-y: auto; display: grid; gap: 5px; }
.salon-customer-history article { min-height: 54px; padding: 7px 9px; display: grid; grid-template-columns: 7px minmax(0, 1fr) auto 65px; align-items: center; gap: 9px; border: 1px solid #ebe5db; border-radius: 10px; }
.salon-customer-history article > i { width: 7px; height: 34px; border-radius: 99px; background: #d5a63b; }
.salon-customer-history article > i.status-completed { background: #4e8959; }
.salon-customer-history article > i.status-no_show,
.salon-customer-history article > i.status-cancelled { background: #b44235; }
.salon-customer-history article > div { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.salon-customer-history article > div strong,
.salon-customer-history article > div span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.salon-customer-history article > div strong { font-size: 10px; }
.salon-customer-history article > div span { color: var(--muted); font-size: 8px; }
.salon-customer-history article > b { font-size: 10px; text-align: right; }
.salon-customer-block-action { width: 100%; margin-top: 14px; border-color: #e8b7b0 !important; background: #f7dfdc !important; color: #8a2f26 !important; }

.contact-opening-hours { display: grid; gap: 3px; }
.contact-opening-hours p { margin: 0 !important; display: flex; align-items: baseline; justify-content: space-between; gap: 18px; }
.contact-opening-hours p span { color: inherit; font: inherit; letter-spacing: 0; text-transform: none; }
.contact-opening-hours p strong { font-weight: 500; }

@media (max-width: 1180px) and (min-width: 901px) {
  .salon-portal { grid-template-columns: 196px minmax(0, 1fr); gap: 14px; padding-right: 12px; }
  .salon-desktop-week { grid-template-columns: repeat(7, minmax(138px, 1fr)); }
  .salon-service-manager > form { grid-template-columns: repeat(4, 1fr); }
  .salon-service-title { grid-column: span 2; }
  .salon-service-manager > form > input:first-of-type { grid-column: span 2; }
  .salon-service-manager > form > button { grid-column: span 2; }
}

@media (max-width: 900px) {
  .salon-desktop-week { display: none; }
  .salon-operations { padding: 18px; }
  .salon-hours-list > article { grid-template-columns: minmax(120px, 1fr) 100px minmax(240px, 1.2fr); }
  .salon-analytics-grid { grid-template-columns: minmax(0, 1.5fr) minmax(230px, .8fr); }
}

@media (max-width: 700px) {
  .salon-hours-list > article { padding: 12px; grid-template-columns: 1fr auto; gap: 10px; }
  .salon-hours-times { grid-column: 1 / -1; }
  .salon-sticky-save { align-items: stretch; flex-direction: column; bottom: 82px; }
  .salon-sticky-save button { width: 100%; }
  .salon-analytics-grid { grid-template-columns: 1fr; }
  .salon-chart-card { min-height: 265px; }
  .salon-customer-grid { grid-template-columns: 1fr; }
  .salon-revenue-bars { gap: 2px; }
}

@media (max-width: 480px) {
  .salon-operations { padding: 14px; }
  .salon-hours-times label { align-items: stretch; flex-direction: column; }
  .salon-service-manager > form { grid-template-columns: 1fr 1fr; }
  .salon-service-title,
  .salon-service-manager > form > input:first-of-type,
  .salon-service-manager > form > input:nth-of-type(2),
  .salon-service-manager > form > button { grid-column: 1 / -1; }
  .salon-service-add { grid-template-columns: 1fr; }
  .salon-customer-detail-kpis { grid-template-columns: 1fr 1fr 1fr; }
  .salon-customer-detail-kpis article { min-height: 73px; padding: 9px; }
  .salon-customer-detail-kpis strong { font-size: 16px; }
  .salon-customer-history article { grid-template-columns: 6px minmax(0, 1fr) auto; }
  .salon-customer-history article > b { display: none; }
  .contact-opening-hours p { gap: 10px; }
}

/* Reduced salon UI: fewer borders, no decorative labels, fixed navigation. */
@media (min-width: 901px) {
  .salon-sidebar {
    width: 218px;
    min-height: 0;
    position: fixed;
    inset: 16px auto 16px 16px;
  }
  .salon-portal > .salon-app-main { grid-column: 2; }
  .salon-management-page .salon-app-main { padding-top: 3px; }
}
.salon-sidebar-brand { justify-content: center; }
.salon-sidebar-brand img { width: 62px; height: 62px; }
.salon-sidebar nav a,
.salon-sidebar nav button { padding: 0 12px; gap: 0; }
.salon-sidebar nav a span,
.salon-sidebar nav button span { width: 100%; }
.salon-sidebar nav h2 { color: #777168; }
.salon-portal-header { min-height: 52px; margin-bottom: 8px; padding: 2px 0 8px; }
.salon-portal-header h1 { margin: 0; font-family: var(--font-sans); font-size: 30px; font-weight: 900; letter-spacing: -.04em; text-transform: none; }
.salon-management-page .salon-booking-visibility { margin-top: 0; }
.salon-operations { margin-top: 10px; padding: 18px 20px 22px; border: 0; background: #fff; box-shadow: none; }
.salon-operations-head { min-height: 44px; align-items: center; }
.salon-operations-head h2 { margin: 0; font-size: clamp(24px, 2.2vw, 34px); }
.salon-portal .salon-modal > .salon-kicker,
.salon-portal .salon-quick-block > .salon-kicker { display: none; }
.salon-operations-panel { margin-top: 14px; }
.salon-live-indicator { color: #8e877d; font-size: 9px; }
.salon-category-row { display: flex; align-items: center; gap: 9px; }
.salon-category-tabs { min-width: 0; flex: 1; margin: 0; }
.salon-category-tabs button { border: 0; border-radius: 9px; background: #f0ede7; }
.salon-category-tabs button small { background: rgba(255,255,255,.72); }
.salon-category-manage-button {
  min-width: max-content;
  min-height: 40px;
  padding: 0 13px;
  border: 0;
  border-radius: 9px;
  background: #e9e4dc;
  color: var(--ink);
  font: inherit;
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
}
.salon-service-add { margin-top: 11px; grid-template-columns: minmax(220px, 2fr) minmax(140px, 1fr) 100px 100px auto; padding: 9px; border-radius: 12px; background: #f4f1eb; }
.salon-service-add input,
.salon-service-add select,
.salon-service-manager input,
.salon-service-manager select { min-height: 39px; padding: 0 10px; border: 1px solid transparent; border-radius: 8px; background: #fff; color: var(--ink); font: inherit; font-size: 11px; }
.salon-service-add input:focus,
.salon-service-add select:focus,
.salon-service-manager input:focus,
.salon-service-manager select:focus { border-color: #c7a550; outline: none; }
.salon-service-manager { margin-top: 8px; gap: 6px; }
.salon-service-manager > form {
  padding: 10px;
  grid-template-columns: minmax(210px, 1.8fr) minmax(130px, .9fr) 82px 90px 70px minmax(220px, auto);
  align-items: end;
  gap: 7px;
  border: 0;
  border-radius: 11px;
  background: #f7f5f1;
}
.salon-service-manager label { min-width: 0; }
.salon-service-name input { font-weight: 750; }
.salon-service-active { min-height: 39px; border: 0; background: #fff; }
.salon-service-actions { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.salon-service-manager .salon-service-actions button { min-height: 39px; padding: 0 9px; border: 0; border-radius: 8px; background: var(--gold); font-size: 8px; }
.salon-service-manager .salon-service-actions .salon-order-button { background: #e8e3dc; }
.salon-service-manager .salon-service-actions button:disabled { opacity: .35; cursor: default; }
.salon-category-manager { width: min(680px, 100%); }
.salon-category-manager > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.salon-category-manager > header h2 { margin: 0; }
.salon-category-manager > header button,
.salon-category-add button,
.salon-category-manager-list button { min-height: 38px; padding: 0 11px; border: 0; border-radius: 8px; background: #e9e4dc; color: var(--ink); font: inherit; font-size: 9px; font-weight: 850; cursor: pointer; }
.salon-category-add { margin: 18px 0 10px; padding: 8px; display: grid; grid-template-columns: 1fr auto; gap: 7px; border-radius: 11px; background: #f4f1eb; }
.salon-category-add input,
.salon-category-manager-list input { min-height: 40px; padding: 0 10px; border: 0; border-radius: 8px; background: #fff; color: var(--ink); font: inherit; font-size: 11px; }
.salon-category-add button,
.salon-category-manager-list button:last-child { background: var(--gold); }
.salon-category-manager-list { display: grid; gap: 6px; }
.salon-category-manager-list form { padding: 8px; display: grid; grid-template-columns: 1fr auto; gap: 8px; border-radius: 10px; background: #f7f5f1; }
.salon-category-manager-list form > div { display: flex; gap: 5px; }
.salon-category-manager-list button:disabled { opacity: .3; cursor: default; }
.salon-category-manager > p { margin: 11px 0 0; color: var(--muted); font-size: 10px; }
.salon-hours-list > article,
.salon-report-table,
.salon-chart-card,
.salon-customer-grid > button { border-color: transparent; background: #f7f5f1; }
.salon-hours-list > article.is-open,
.salon-chart-card { background: #f7f5f1; }
.salon-booking-ledger { margin-top: 10px; display: grid; gap: 5px; }
.salon-booking-ledger article { min-height: 54px; padding: 8px 10px; display: grid; grid-template-columns: 130px minmax(0,1fr) auto 80px; align-items: center; gap: 10px; border: 0; border-radius: 9px; background: #f7f5f1; }
.salon-booking-ledger article > div { min-width: 0; display: flex; flex-direction: column; }
.salon-booking-ledger time,
.salon-booking-ledger span { color: var(--muted); font-size: 9px; }
.salon-booking-ledger strong,
.salon-booking-ledger b { font-size: 10px; }
.salon-status-chart ul { margin: auto 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; list-style: none; }
.salon-status-chart li { display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 6px; color: var(--muted); font-size: 9px; }
.salon-status-chart li i { width: 8px; height: 8px; border-radius: 50%; background: #aaa39a; }
.salon-status-chart li i.is-completed { background: #4e8959; }
.salon-status-chart li i.is-confirmed { background: #d5a63b; }
.salon-status-chart li i.is-no-show { background: #b44235; }
.salon-bottom-nav a,
.salon-bottom-nav button { font-size: 9px; }
.salon-login-link-button { border: 1px solid #d8d1c5 !important; background: #fff !important; color: var(--ink) !important; }
.service-calendar-stage { scroll-margin-top: 12px; }

@media (max-width: 1180px) and (min-width: 901px) {
  .salon-sidebar { width: 196px; }
  .salon-service-manager > form { grid-template-columns: minmax(190px, 1.6fr) minmax(120px, 1fr) 78px 86px 66px; }
  .salon-service-actions { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
  .salon-portal > .salon-app-main { grid-column: auto; }
  .salon-management-page .salon-app-main { padding-top: 0; }
  .salon-category-row { align-items: stretch; flex-direction: column; }
  .salon-category-manage-button { align-self: flex-start; }
  .salon-service-manager > form { grid-template-columns: minmax(180px, 1.5fr) minmax(130px, 1fr) 78px 88px 68px; }
  .salon-service-actions { grid-column: 1 / -1; justify-content: flex-start; }
}

@media (max-width: 620px) {
  .salon-portal-header { min-height: 42px; }
  .salon-portal-header h1 { font-size: 24px; }
  .salon-operations { padding: 13px; }
  .salon-service-add { grid-template-columns: 1fr 1fr; }
  .salon-service-add input:first-child { grid-column: 1 / -1; }
  .salon-service-add button { grid-column: 1 / -1; }
  .salon-service-manager > form { grid-template-columns: 1fr 1fr; padding: 9px; }
  .salon-service-name { grid-column: 1 / -1; }
  .salon-service-actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
  .salon-service-actions button:last-child { grid-column: 1 / -1; }
  .salon-category-manager-list form { grid-template-columns: 1fr; }
  .salon-category-manager-list form > div { display: grid; grid-template-columns: 1fr 1fr; }
  .salon-category-manager-list form > div button:last-child { grid-column: 1 / -1; }
  .salon-booking-ledger article { grid-template-columns: minmax(0,1fr) auto; }
  .salon-booking-ledger article time { grid-column: 1 / -1; }
  .salon-booking-ledger article > b { display: none; }
}

/* Final mobile navigation sizing must win over legacy portal rules. */
@media (max-width: 900px) {
  .salon-bottom-nav { grid-auto-flow: unset; grid-template-columns: repeat(6, minmax(0, 1fr)); min-height: 62px; }
  .salon-bottom-nav a,
  .salon-bottom-nav button { min-height: 50px; padding: 4px 1px; gap: 3px; font-size: 7px; }
  .salon-bottom-nav .salon-nav-icon { width: 19px; height: 19px; display: block; }
  .salon-bottom-nav a span,
  .salon-bottom-nav button span { max-width: 100%; overflow: hidden; font-size: 7px; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
}

/* Appointment cockpit: high-capacity daily lists with clear parallel bookings. */
@media (min-width: 901px) {
  .salon-desktop-week > article {
    height: clamp(520px, calc(100svh - 250px), 900px);
    min-height: 520px;
    display: flex;
    flex-direction: column;
  }
  .salon-desktop-week > article > header { flex: 0 0 auto; }
  .salon-desktop-week > article > .salon-day-scroll {
    min-height: 0;
    padding: 6px;
    display: block;
    flex: 1 1 auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #c9c1b5 transparent;
    scrollbar-width: thin;
  }
}

.salon-time-group + .salon-time-group { margin-top: 8px; }
.salon-time-group > header {
  z-index: 2;
  top: 0;
  padding: 4px 3px 5px;
  position: sticky;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(8px);
}
.salon-time-group > header time {
  color: #85530c;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: -.02em;
}
.salon-time-group > header span {
  padding: 3px 5px;
  border-radius: 999px;
  background: #eee5d3;
  color: #775116;
  font-size: 7px;
  font-weight: 900;
  white-space: nowrap;
}
.salon-time-group > div { display: grid; gap: 5px; }
.salon-desktop-week .salon-appointment-card {
  min-height: 70px;
  padding: 7px 7px 7px 9px;
  grid-template-columns: minmax(0, 1fr) 7px;
  gap: 8px;
}
.salon-desktop-week .salon-appointment-card > span { gap: 2px; }
.salon-desktop-week .salon-appointment-card > span em {
  overflow: hidden;
  color: #8a611d;
  font-size: 7px;
  font-style: normal;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.salon-desktop-week > article > .salon-day-scroll > p {
  margin: 24px 5px;
  color: #aaa39a;
  font-size: 10px;
  text-align: center;
}

@media (max-width: 900px) {
  .salon-mobile-day { display: flex; flex-direction: column; }
  .salon-mobile-appointment-list {
    max-height: max(330px, calc(100svh - 330px));
    min-height: 210px;
    padding: 8px;
    display: block;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  .salon-mobile-time-group + .salon-mobile-time-group { margin-top: 12px; }
  .salon-mobile-time-group > header {
    z-index: 3;
    top: -8px;
    padding: 8px 4px 7px;
    position: sticky;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #ece4d7;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(9px);
  }
  .salon-mobile-time-group > header time {
    color: #80500b;
    font-size: 15px;
    font-weight: 950;
  }
  .salon-mobile-time-group > header span {
    padding: 4px 7px;
    border-radius: 999px;
    background: #eee5d3;
    color: #765016;
    font-size: 8px;
    font-weight: 900;
  }
  .salon-mobile-time-group > div { padding-top: 6px; display: grid; gap: 6px; }
  .salon-mobile-appointment-list .salon-mobile-time-group button {
    width: 100%;
    min-height: 76px;
    padding: 10px 11px 10px 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 14px;
    align-items: center;
    gap: 10px;
    border: 1px solid #ebe5da;
    border-left: 5px solid var(--gold);
    border-radius: 13px;
    background: #faf8f3;
    color: var(--ink);
    text-align: left;
  }
  .salon-mobile-appointment-list .salon-mobile-time-group button.status-completed { opacity: .5; filter: grayscale(.65); background: #f1f7f1; }
  .salon-mobile-appointment-list .salon-mobile-time-group button.status-no_show { opacity: .66; background: #fbf1ef; }
  .salon-mobile-appointment-list .salon-mobile-time-group button.is-blocked { border-left-color: #595650; background: #efede8; }
  .salon-mobile-time-group button > span { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
  .salon-mobile-time-group button > span strong,
  .salon-mobile-time-group button > span small,
  .salon-mobile-time-group button > span em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .salon-mobile-time-group button > span strong { font-size: 13px; }
  .salon-mobile-time-group button > span small { color: #5e5952; font-size: 10px; }
  .salon-mobile-time-group button > span em { color: #8a611d; font-size: 9px; font-style: normal; font-weight: 850; }
  .salon-mobile-time-group button > b { font-size: 22px; font-weight: 400; }
}

/* Secure customer self-service: quiet, compact and touch friendly. */
.customer-portal-global { max-width: 1180px; margin: 0 auto 12px; }
.customer-appointments .customer-appointment-card {
  min-height: 92px;
  padding: 12px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px 12px;
}
.customer-appointment-card > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.customer-appointment-card > div time,
.customer-appointment-card > div span { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.customer-appointment-card > div strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.customer-appointment-card > b { padding: 5px 7px; border-radius: 999px; background: #eee8dd; font-size: 8px; }
.customer-appointment-card > nav { grid-column: 1 / -1; display: flex; gap: 6px; }
.customer-appointment-card > nav button {
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: #e9e4da;
  color: var(--ink);
  font: inherit;
  font-size: 8px;
  font-weight: 850;
  cursor: pointer;
}
.customer-appointment-card > nav button.is-danger { background: #f4dfdc; color: #8c3128; }
.customer-device-note { margin-top: 18px; padding-top: 14px; display: block; border-top: 1px solid #e7e1d7; color: var(--muted); font-size: 9px; line-height: 1.6; }

.customer-action-backdrop { position: fixed; z-index: 120; inset: 0; padding: 20px; display: grid; place-items: center; background: rgba(17,16,14,.66); }
.customer-action-modal { width: min(540px, 100%); max-height: calc(100svh - 40px); overflow-y: auto; padding: 24px; border-radius: 20px; background: #fff; box-shadow: 0 28px 80px rgba(17,16,14,.3); }
.customer-action-modal > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.customer-action-modal > header div { display: flex; flex-direction: column; gap: 2px; }
.customer-action-modal > header span { color: #93600f; font-size: 8px; font-weight: 900; letter-spacing: .13em; }
.customer-action-modal h2 { margin: 0; font-family: var(--font-sans); font-size: 25px; letter-spacing: -.03em; }
.customer-action-modal > header button { min-height: 34px; padding: 0 9px; border: 0; border-radius: 8px; background: #eee9e1; color: var(--ink); font: inherit; font-size: 8px; font-weight: 850; }
.customer-action-modal > p { margin: 10px 0 18px; color: var(--muted); font-size: 10px; }
.customer-action-modal form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.customer-action-modal label { display: flex; flex-direction: column; gap: 5px; }
.customer-action-modal label span,
.customer-action-modal legend { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.customer-action-modal input,
.customer-action-modal select { width: 100%; min-height: 44px; padding: 0 10px; border: 1px solid #ddd6ca; border-radius: 9px; background: #fff; color: var(--ink); font: inherit; font-size: 11px; }
.customer-action-modal fieldset { min-width: 0; margin: 2px 0 0; padding: 0; grid-column: 1 / -1; border: 0; }
.customer-time-options { margin-top: 7px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.customer-time-options button { min-height: 38px; border: 1px solid #ded7cb; border-radius: 8px; background: #f6f3ed; color: var(--ink); font: inherit; font-size: 9px; font-weight: 850; }
.customer-time-options button.is-selected { border-color: var(--gold); background: var(--gold); }
.customer-action-modal fieldset > p { color: var(--muted); font-size: 10px; }
.customer-action-modal form > .customer-portal-error,
.customer-action-modal form > button { grid-column: 1 / -1; }
.customer-action-modal form > button[type="submit"] { min-height: 45px; border: 0; border-radius: 9px; background: var(--gold); color: var(--ink); font: inherit; font-size: 10px; font-weight: 900; }
.customer-action-modal button:disabled { opacity: .45; cursor: wait; }

@media (max-width: 620px) {
  .customer-appointments .customer-appointment-card { grid-template-columns: minmax(0, 1fr) auto; }
  .customer-action-backdrop { padding: 0; align-items: end; }
  .customer-action-modal { width: 100%; max-height: 92svh; padding: 20px 16px calc(20px + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; }
  .customer-action-modal form { grid-template-columns: 1fr; }
  .customer-action-modal fieldset { grid-column: 1; }
  .customer-time-options { grid-template-columns: repeat(4, 1fr); }
  .customer-action-modal form > .customer-portal-error,
  .customer-action-modal form > button { grid-column: 1; }
}

.salon-customer-updates { margin: 0 0 10px; padding: 10px; border-radius: 14px; background: #fff; }
.salon-customer-updates > header { padding: 1px 3px 8px; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.salon-customer-updates > header strong { font-size: 11px; }
.salon-customer-updates > header span { color: var(--muted); font-size: 8px; }
.salon-customer-updates > div { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: thin; }
.salon-customer-updates button { min-width: 220px; min-height: 52px; padding: 7px 9px; display: grid; grid-template-columns: 7px minmax(0, 1fr) auto; align-items: center; gap: 8px; border: 0; border-radius: 10px; background: #f5f1ea; color: var(--ink); text-align: left; }
.salon-customer-updates button > i { width: 7px; height: 32px; border-radius: 99px; background: #c08a2c; }
.salon-customer-updates button > i.is-cancelled { background: #b44235; }
.salon-customer-updates button > span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.salon-customer-updates button strong,
.salon-customer-updates button small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.salon-customer-updates button strong { font-size: 9px; }
.salon-customer-updates button small { color: var(--muted); font-size: 7px; }
.salon-customer-updates button > b { color: #87550c; font-size: 7px; }
.salon-customer-action-badge { background: #f1e6d1 !important; color: #80500b !important; }

@media (max-width: 900px) {
  .salon-customer-updates { margin-bottom: 9px; }
  .salon-customer-updates > header span { display: none; }
  .salon-customer-updates button { min-width: 205px; }
}

/* Sichere Löschaktionen und eine skalierbare Kundenliste. */
.salon-delete-button,
.salon-booking-delete,
.salon-history-delete { border: 0 !important; background: #f3dfdc !important; color: #8c3028 !important; }
.salon-delete-button:hover,
.salon-booking-delete:hover,
.salon-history-delete:hover { background: #eecbc6 !important; }
.salon-employee-form-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 7px; }
.salon-employee-form-actions button { min-height: 40px; padding: 0 13px; border: 0; border-radius: 8px; background: var(--gold); color: var(--ink); font: inherit; font-size: 9px; font-weight: 850; }
.salon-customer-search {
  min-height: 56px;
  margin-bottom: 12px;
  padding: 7px 9px 7px 13px;
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr) auto;
  align-items: center;
  gap: 10px;
  border-radius: 13px;
  background: #f2eee7;
}
.salon-customer-search > span { color: #625c54; font-size: 10px; font-weight: 850; white-space: nowrap; }
.salon-customer-search input { width: 100%; min-height: 42px; padding: 0 13px; border: 0; border-radius: 9px; background: #fff; color: var(--ink); font: inherit; font-size: 12px; }
.salon-customer-search input:focus { outline: 3px solid rgba(200,164,77,.3); }
.salon-customer-search > b { min-width: max-content; color: #8a8379; font-size: 9px; }
.salon-customer-empty { margin: 0; padding: 34px 16px; border-radius: 13px; background: #f7f5f1; color: var(--muted); font-size: 12px; text-align: center; }
.salon-customer-history article { grid-template-columns: 7px minmax(0, 1fr) auto 72px auto; }
.salon-history-delete { min-height: 32px; padding: 0 8px; border-radius: 7px !important; font-size: 8px !important; }
.salon-customer-detail-actions { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.salon-customer-detail-actions > button { width: 100%; min-height: 43px; margin: 0; }
.salon-booking-delete { width: 100%; min-height: 40px; margin-top: 8px; border-radius: 9px; font: inherit; font-size: 9px; font-weight: 850; cursor: pointer; }
.salon-delete-backdrop { z-index: 140; }
.salon-delete-confirm { width: min(500px, 100%); }
.salon-delete-confirm h2 { margin: 0 0 12px; font-family: var(--font-sans); font-size: 27px; letter-spacing: -.04em; }
.salon-delete-confirm > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.salon-delete-confirm .salon-confirm-actions { margin-top: 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.salon-delete-confirm .salon-confirm-actions button { min-height: 44px; }

@media (max-width: 900px) {
  .salon-portal {
    padding-right: max(14px, env(safe-area-inset-right));
    padding-left: max(14px, env(safe-area-inset-left));
  }
  .salon-bottom-nav {
    left: max(14px, env(safe-area-inset-left));
    right: max(14px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
    min-height: 70px;
    border-radius: 28px;
  }
  .salon-bottom-nav a,
  .salon-bottom-nav button { min-height: 54px; border-radius: 20px; }
  .salon-bottom-nav a span,
  .salon-bottom-nav button span { font-size: 9px; line-height: 1.1; }
  .salon-bottom-nav .salon-nav-icon { width: 21px; height: 21px; }
  .salon-operations-head h2 { font-size: 27px; }
  .salon-category-tabs button,
  .salon-category-manage-button,
  .salon-service-create > summary,
  .salon-service-item > summary,
  .salon-employee-list > article > details > summary,
  .salon-customer-edit > summary { font-size: 11px; }
  .salon-service-item > summary > span strong,
  .salon-employee-list > article > header strong,
  .salon-customer-grid > button > div strong { font-size: 14px; }
  .salon-service-item > summary > span small,
  .salon-employee-list > article > header small,
  .salon-customer-grid > button > div span { font-size: 11px; }
  .salon-customer-grid > button > div small { font-size: 10px; }
  .salon-service-add input,
  .salon-service-add select,
  .salon-service-manager input,
  .salon-service-manager select,
  .salon-employee-add input,
  .salon-employee-list input,
  .salon-customer-edit input,
  .salon-customer-search input { font-size: 16px; }
  .salon-customer-grid > button { min-height: 92px; }
  .salon-customer-grid > button > span:not(.salon-customer-avatar) { font-size: 10px; }
}

@media (max-width: 620px) {
  .salon-customer-search { grid-template-columns: 1fr auto; padding: 9px; }
  .salon-customer-search > span { grid-column: 1; }
  .salon-customer-search > b { grid-column: 2; grid-row: 1; }
  .salon-customer-search input { grid-column: 1 / -1; }
  .salon-customer-history article { grid-template-columns: 6px minmax(0, 1fr) auto; }
  .salon-customer-history article > b { grid-column: 2; display: block; text-align: left; }
  .salon-history-delete { grid-column: 3; grid-row: 2; }
  .salon-customer-detail-actions { grid-template-columns: 1fr; }
  .salon-delete-confirm { padding: 24px 18px calc(22px + env(safe-area-inset-bottom)); }
  .salon-delete-confirm .salon-confirm-actions { grid-template-columns: 1fr; }
  .salon-category-manager-list form > div { grid-template-columns: 1fr 1fr; }
  .salon-category-manager-list form > div button:last-child { grid-column: auto; }
}

/* Final media direction: one cinematic hero, two real cuts, one team photo. */
.hero {
  background: #0f0e0c url("/showcases/goldcut/assets/video/goldcut-hero-poster.webp") center / cover no-repeat;
}
.hero-video {
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  position: absolute;
  inset: -2px;
  object-fit: cover;
  object-position: center;
  filter: saturate(.82) contrast(1.08) brightness(.78);
  pointer-events: none;
}
.styles-section .styles-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2.6vw, 38px);
  overflow: visible;
}
.styles-section .style-card-image { height: auto; aspect-ratio: 1 / 1; }
.styles-section .style-card-image img { object-fit: cover; filter: none; }
.styles-section .style-card-copy h3 { font-size: clamp(28px, 3.4vw, 48px); }

.hairsystem-section {
  padding: clamp(78px, 9vw, 140px) clamp(22px, 7vw, 110px);
  display: grid;
  grid-template-columns: minmax(280px, .82fr) minmax(360px, .7fr);
  align-items: center;
  justify-content: center;
  gap: clamp(34px, 7vw, 110px);
  background: #ece7dc;
}
.hairsystem-copy { max-width: 680px; }
.hairsystem-copy h2 { max-width: 680px; font-size: clamp(50px, 6vw, 92px); }
.hairsystem-copy > p:last-child { max-width: 520px; margin: 28px 0 0; color: #68625a; font-size: clamp(16px, 1.35vw, 20px); line-height: 1.65; }
.hairsystem-video-frame {
  width: min(100%, 520px);
  aspect-ratio: 3 / 4;
  margin: 0;
  position: relative;
  justify-self: center;
  overflow: hidden;
  border-radius: 30px;
  background: #111;
  box-shadow: 0 28px 70px rgba(17,16,14,.2);
}
.hairsystem-video-frame video { width: 100%; height: 100%; display: block; object-fit: cover; }

.team-section {
  padding: clamp(78px, 9vw, 140px) clamp(22px, 7vw, 110px);
  display: grid;
  grid-template-columns: minmax(270px, .6fr) minmax(420px, 1fr);
  align-items: center;
  gap: clamp(34px, 6vw, 90px);
}
.team-section .team-heading { max-width: 560px; margin: 0; }
.team-section .team-heading h2 { font-size: clamp(54px, 6.4vw, 98px); }
.team-section .team-heading > p:last-child { max-width: 470px; font-size: clamp(15px, 1.2vw, 19px); line-height: 1.7; }
.team-group-photo {
  width: min(100%, 820px);
  aspect-ratio: 4 / 5;
  margin: 0;
  position: relative;
  justify-self: end;
  overflow: hidden;
  border-radius: 30px;
  background: #181613;
}
.team-group-photo img { object-fit: cover; object-position: center; }
.team-group-photo::after { content: ""; position: absolute; inset: 60% 0 0; background: linear-gradient(transparent, rgba(0,0,0,.72)); }
.team-group-photo figcaption { position: absolute; z-index: 2; left: 26px; bottom: 24px; color: var(--gold); font-size: 11px; font-weight: 850; letter-spacing: .2em; }

/* The service rows must never create fixed-height cards on narrow screens. */
@media (max-width: 1180px) {
  .service-cards { width: 100%; }
  .service-card,
  .service-card.is-wide,
  .service-card.is-compact {
    width: 100%;
    max-width: none;
    min-height: 0;
    flex: 0 0 auto;
  }
}

@media (max-width: 700px) {
  .hero-video { object-position: 50% center; }
  .styles-section .styles-grid {
    grid-template-columns: 1fr;
    gap: 18px;
    overflow: visible;
  }
  .styles-section .style-card { width: 100%; min-width: 0; }
  .styles-section .style-card-image { height: auto; aspect-ratio: 1 / 1; }
  .hairsystem-section,
  .team-section { padding: 66px 18px; grid-template-columns: 1fr; gap: 30px; }
  .hairsystem-copy h2,
  .team-section .team-heading h2 { font-size: clamp(42px, 13vw, 62px); }
  .hairsystem-video-frame { width: min(100%, 470px); border-radius: 22px; }
  .team-group-photo { width: 100%; aspect-ratio: 4 / 5; border-radius: 22px; }
  .service-card,
  .service-card.is-wide,
  .service-card.is-compact { padding: 26px 20px 28px; }
  .service-category-head h3 { font-size: 36px; }
  .service-line,
  .service-card.is-compact .service-line {
    padding: 19px 0;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    column-gap: 12px;
    row-gap: 10px;
  }
  .service-line-name { grid-column: 1 / -1; }
  .service-line-name > strong,
  .service-card.is-wide .service-line-name > strong,
  .service-card.is-compact .service-line-name > strong { font-size: 17px; line-height: 1.35; }
  .service-line > span,
  .service-card.is-wide .service-line > span,
  .service-card.is-compact .service-line > span { grid-column: 1; font-size: 14px; }
  .service-line > strong,
  .service-card.is-wide .service-line > strong,
  .service-card.is-compact .service-line > strong { grid-column: 2; font-size: 16px; text-align: right; }
  .service-select,
  .service-card.is-wide .service-select,
  .service-card.is-compact .service-select { grid-column: 3; width: auto; min-height: 44px; padding: 0 13px; font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-video,
  .hairsystem-video-frame video { display: none; }
  .hairsystem-video-frame { background: #111 url("/showcases/goldcut/assets/video/goldcut-haarsystem-poster.webp") center / cover no-repeat; }
}

/* Calendar and admin readability pass. */
.salon-customer-updates { padding: 7px 9px; }
.salon-customer-updates > summary {
  min-height: 42px;
  padding: 0 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  list-style: none;
}
.salon-customer-updates > summary::-webkit-details-marker { display: none; }
.salon-customer-updates > summary > span { display: flex; align-items: baseline; gap: 9px; }
.salon-customer-updates > summary strong { font-size: 13px; }
.salon-customer-updates > summary small { color: var(--muted); font-size: 10px; }

/* Cinematic hero reveal: the opening title makes room for the salon film. */
.hero-content { pointer-events: none; }
.hero-intro {
  width: min(100%, 860px);
  display: flex;
  flex-direction: column;
  align-items: center;
  animation: heroIntroOut .9s cubic-bezier(.22, 1, .36, 1) 2s forwards;
  will-change: opacity, transform, filter;
}
.hero-intro .hero-copy { margin-bottom: 0; }
.hero-signature {
  position: absolute;
  left: clamp(26px, 5vw, 78px);
  bottom: clamp(30px, 5vw, 62px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  color: white;
  text-align: left;
  opacity: 0;
  transform: translateY(16px);
  animation: heroSignatureIn .75s cubic-bezier(.22, 1, .36, 1) 2.45s forwards;
  will-change: opacity, transform;
}
.hero-signature::before {
  content: "";
  width: 42px;
  height: 2px;
  margin-bottom: 7px;
  background: var(--gold);
}
.hero-signature span {
  color: var(--gold);
  font-family: var(--font-display);
  font-size: clamp(23px, 2.3vw, 36px);
  line-height: .9;
  letter-spacing: .08em;
}
.hero-signature strong {
  font-size: clamp(9px, .75vw, 11px);
  font-weight: 800;
  letter-spacing: .24em;
}
.hero-shade {
  animation: heroShadeReveal 1.1s cubic-bezier(.22, 1, .36, 1) 2s forwards;
  will-change: opacity;
}
.hero-video {
  animation: heroVideoReveal 1.25s cubic-bezier(.22, 1, .36, 1) 2s forwards;
  will-change: filter;
}

@keyframes heroIntroOut {
  to {
    opacity: 0;
    filter: blur(4px);
    transform: translateY(-18px) scale(.95);
    visibility: hidden;
  }
}
@keyframes heroSignatureIn {
  to { opacity: 1; transform: translateY(0); }
}
@keyframes heroShadeReveal {
  to { opacity: .4; }
}
@keyframes heroVideoReveal {
  to { filter: saturate(.96) contrast(1.03) brightness(1); }
}

@media (max-width: 700px) {
  .hero-content { padding-inline: 22px; }
  .hero-intro { width: min(100%, 500px); }
  .hero-brand-name { font-size: clamp(32px, 10vw, 46px); }
  .hero-content h1 { font-size: clamp(40px, 12.4vw, 58px); }
  .hero-copy {
    max-width: 330px;
    margin-top: 20px;
    font-size: 15px;
    line-height: 1.5;
  }
  .hero-signature { left: 22px; bottom: 54px; }
  .hero-signature span { font-size: 25px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-intro,
  .hero-signature,
  .hero-shade,
  .hero-video { animation: none !important; }
  .hero-intro { opacity: 1; filter: none; transform: none; visibility: visible; }
  .hero-signature { display: none; }
}
.salon-customer-updates > summary > b { padding: 6px 9px; border-radius: 999px; background: #efe6d5; color: #81530d; font-size: 10px; }
.salon-customer-updates[open] > div { margin-top: 7px; }
.salon-toolbar strong { font-size: 14px; }
.salon-toolbar span,
.salon-employee-legend span { font-size: 11px; }
.salon-toolbar button { font-size: 11px; }
.salon-sidebar nav a span,
.salon-sidebar nav button span { font-size: 11px; }
.salon-sidebar nav h2 { font-size: 8px; }
.salon-time-group > header time { font-size: 14px; }
.salon-time-group > header span { font-size: 9px; }
.salon-desktop-week > article > header span { font-size: 10px; }
.salon-desktop-week > article > header strong { font-size: 12px; }
.salon-desktop-week .salon-appointment-card { min-height: 80px; }
.salon-desktop-week .salon-appointment-card > span strong { font-size: 13px; }
.salon-desktop-week .salon-appointment-card > span small { font-size: 11px; }
.salon-desktop-week .salon-appointment-card > span em { font-size: 10px; }
.salon-booking-facts span { font-size: 10px; }
.salon-booking-facts strong { font-size: 13px; }

@media (max-width: 900px) {
  .salon-mobile-appointment-list {
    max-height: none;
    min-height: 210px;
    overflow: visible;
    overscroll-behavior: auto;
    touch-action: pan-y;
  }
  .salon-mobile-time-group > header time { font-size: 17px; }
  .salon-mobile-time-group > header span { font-size: 10px; }
  .salon-mobile-appointment-list .salon-mobile-time-group button { min-height: 88px; padding: 12px 13px; }
  .salon-mobile-time-group button > span strong { font-size: 15px; }
  .salon-mobile-time-group button > span small { font-size: 12px; }
  .salon-mobile-time-group button > span em { font-size: 11px; }
  .salon-mobile-week-strip button span { font-size: 10px; }
  .salon-mobile-week-strip button strong { font-size: 17px; }
  .salon-mobile-day > header span { font-size: 11px; }
  .salon-mobile-day > header strong { font-size: 17px; }
  .salon-bottom-nav a span,
  .salon-bottom-nav button span { font-size: 10px; }
  .salon-bottom-nav .salon-nav-icon { width: 22px; height: 22px; }
}

/* Scheduling: calm cream surface, gold actions, employee-coloured appointments. */
.salon-week-view[hidden] { display: none !important; }
.salon-mobile-calendar-tools, .salon-employee-short-name, .salon-compact-layout.is-desktop-hidden { display: none; }
.salon-new-booking { background: var(--gold, #c8a44d) !important; color: #161410 !important; }
.salon-portal .salon-toolbar { display: flex; flex-wrap: wrap; gap: 14px; padding: 14px 16px; }
.salon-toolbar > strong { flex: 1; text-align: center; }
.salon-toolbar .salon-view-switch { display: flex; gap: 3px; background: #eeeae3; padding: 4px; border-radius: 12px; }
.salon-toolbar .salon-view-switch button { min-height: 42px; padding: 10px 15px; font-size: 14px; background: transparent; color: #625d54; border-radius: 9px; letter-spacing: 0; }
.salon-toolbar .salon-view-switch button[aria-pressed="true"] { background: #171612; color: white; }
.salon-toolbar .salon-date-nav { display: flex; gap: 5px; }
.salon-toolbar .salon-date-nav button { min-height: 44px; min-width: 44px; font-size: 15px; }
.salon-day-picker { display: grid; gap: 3px; margin-inline: auto; }
.salon-day-picker > span { font-size: 12px; color: #69645b; }
.salon-day-picker input { min-height: 40px; font: inherit; font-weight: 700; border: 0; color: #171612; background: transparent; width: 170px; }
.salon-staff-day { margin-top: 18px; min-width: 0; }
.salon-day-swipe { display: none; }
.salon-staff-scroll { width: 100%; max-height: max(440px, calc(100dvh - 220px)); overflow: auto; border-radius: 18px; background: #fff; touch-action: pan-x pan-y; overscroll-behavior: auto; }
.salon-staff-grid { min-width: calc(68px + var(--staff-count) * 210px); }
.salon-staff-row { display: grid; grid-template-columns: 68px repeat(var(--staff-count), minmax(210px, 1fr)); align-items: stretch; }
.salon-staff-row:nth-child(even) { background: #faf9f6; }
.salon-staff-axis { position: sticky; left: 0; z-index: 2; background: #f1eee7; padding: 20px 10px; font-size: 14px; font-weight: 750; font-variant-numeric: tabular-nums; }
.salon-staff-head { position: sticky; top: 0; z-index: 3; background: #f8f6f1; }
.salon-staff-head > header { padding: 18px 14px 14px; display: flex; flex-direction: column; gap: 7px; border-top: 4px solid var(--employee-color); margin-inline: 5px; }
.salon-staff-head strong { font-size: 16px; overflow-wrap: anywhere; }
.salon-staff-head span { font-size: 13px; color: #625d54; }
.salon-staff-head button { min-height: 42px; margin-top: 5px; align-self: flex-start; border: 0; border-radius: 9px; padding: 8px 13px; font-size: 14px; font-weight: 650; background: #ebe5d9; color: #26211b; cursor: pointer; }
.salon-staff-head button:disabled { opacity: .5; cursor: default; }
.salon-staff-cell { min-width: 0; padding: 10px 8px; display: flex; flex-direction: column; gap: 8px; }
.salon-portal .salon-staff-appointment, .salon-portal .salon-staff-block { display: flex; flex-direction: column; gap: 6px; text-align: left; width: 100%; min-width: 0; padding: 15px 13px; background: color-mix(in srgb, var(--employee-color) 9%, white); border: 0; border-left: 4px solid var(--employee-color); border-radius: 12px; cursor: pointer; font: inherit; color: #25221c; overflow-wrap: anywhere; }
.salon-staff-appointment strong { font-size: 16px; line-height: 1.3; }
.salon-staff-appointment > span { font-size: 14px; line-height: 1.35; }
.salon-staff-appointment > .salon-staff-time { font-size: 13px; font-weight: 750; font-variant-numeric: tabular-nums; }
.salon-staff-appointment small { font-size: 12px; color: #686052; }
.salon-portal .salon-staff-appointment.status-completed, .salon-portal .salon-staff-appointment.status-no_show { opacity: .55; background: #efefec; }
.salon-portal .salon-staff-block { border-left-color: #999185; background: #eeeae3; font-size: 14px; }
.salon-staff-placeholder { padding: 20px 12px; color: #cbc6bb; }
.salon-portal .salon-staff-ongoing { display: flex; flex-direction: column; gap: 4px; padding: 12px; text-align: left; background: #f0ede7; color: #746c60; font-weight: 400; }
.salon-staff-ongoing span, .salon-staff-ongoing small { font-size: 12px; }
.salon-staff-ongoing strong { font-size: 14px; }
.salon-day-empty { padding: 40px 22px; color: #736e64; font-size: 15px; }
.salon-portal .salon-staff-appointment:hover { background: color-mix(in srgb, var(--employee-color) 18%, white); }
.salon-staff-scroll:focus-visible, .salon-staff-day button:focus-visible { outline: 3px solid #b0862b; outline-offset: 2px; }

/* Compact is the working default: real appointments, never empty time rows. */
.salon-day-overview { margin-top: 14px; min-width: 0; }
.salon-agenda-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.salon-agenda-controls > label { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: 14px; }
.salon-agenda-controls select { min-height: 44px; max-width: 250px; width: 100%; min-width: 0; border: 0; border-radius: 10px; padding: 10px 30px 10px 12px; background: #fff; color: #25221c; font: inherit; font-size: 16px; }
.salon-agenda-layout { display: flex; padding: 3px; border-radius: 11px; background: #e4dfd5; }
.salon-portal .salon-agenda-layout button { min-height: 42px; padding: 8px 13px; border-radius: 8px; background: transparent; color: #625d54; font-size: 14px; font-weight: 650; letter-spacing: 0; }
.salon-portal .salon-agenda-layout button[aria-pressed="true"] { background: white; color: #171612; box-shadow: 0 1px 3px #1716120d; }
.salon-agenda-summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 48px; margin-block: 4px; color: #69645b; font-size: 14px; }
.salon-agenda-summary > span > strong { color: #25221c; }
.salon-portal .salon-agenda-summary button { min-height: 44px; padding: 8px 0 8px 10px; background: transparent; color: #69645b; font-size: 14px; font-weight: 400; letter-spacing: 0; }
.salon-agenda-summary button strong { margin-left: 5px; color: #916521; font-variant-numeric: tabular-nums; }
.salon-compact-desktop { overflow-x: auto; touch-action: pan-x pan-y; }
.salon-compact-columns { display: grid; grid-template-columns: repeat(var(--agenda-columns), minmax(190px, 1fr)); align-items: start; gap: 12px; }
.salon-compact-column { min-width: 0; border-radius: 15px; background: white; padding: 0 8px 8px; }
.salon-compact-column > header { display: flex; gap: 8px; align-items: center; justify-content: space-between; padding: 14px 5px 13px; margin-inline: 3px; border-top: 3px solid var(--employee-color); }
.salon-compact-column h2 { margin: 0 0 5px; font: inherit; font-size: 16px; font-weight: 750; color: #25221c; letter-spacing: -.02em; text-transform: none; overflow-wrap: anywhere; }
.salon-compact-column .salon-employee-full-name { font: inherit; color: inherit; }
.salon-compact-column header span { font-size: 13px; color: #69645b; }
.salon-portal .salon-compact-column header button { flex-shrink: 0; min-width: 44px; min-height: 44px; background: #f1ede4; color: #25221c; font-size: 23px; font-weight: 400; }
.salon-agenda-list { display: flex; flex-direction: column; gap: 6px; }
.salon-portal .salon-agenda-booking { display: grid; grid-template-columns: 49px minmax(0, 1fr) 8px; gap: 8px; align-items: start; width: 100%; min-height: 72px; padding: 12px 9px; border: 0; border-radius: 10px; background: color-mix(in srgb, var(--employee-color) 9%, white); color: #25221c; text-align: left; font: inherit; letter-spacing: 0; cursor: pointer; }
.salon-agenda-time { display: flex; flex-direction: column; gap: 4px; font-variant-numeric: tabular-nums; }
.salon-agenda-time time { color: #916521; font-size: 15px; line-height: 1.3; font-weight: 750; }
.salon-agenda-time small { font-size: 11px; white-space: nowrap; font-weight: 400; color: #756d60; }
.salon-agenda-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.salon-agenda-info > strong { font-size: 15px; line-height: 1.3; font-weight: 750; overflow-wrap: anywhere; }
.salon-agenda-info > span { font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.salon-agenda-info > small { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; color: #69645b; font-size: 12px; line-height: 1.4; }
.salon-agenda-info > small:empty { display: none; }
.salon-agenda-info small b { display: flex; align-items: center; gap: 5px; font-weight: 650; }
.salon-agenda-info small b::before { content: ""; width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; background: var(--employee-color); }
.salon-agenda-info em { font-style: normal; }
.salon-agenda-arrow { align-self: center; color: #8c8579; font-size: 20px; }
.salon-agenda-empty { margin: 0; padding: 18px 10px; color: #756d60; font-size: 14px; }
.salon-agenda-completed { margin-top: 8px; }
.salon-agenda-completed summary { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; min-height: 44px; padding: 10px 5px; font-size: 14px; color: #69645b; cursor: pointer; list-style: none; }
.salon-agenda-completed summary::-webkit-details-marker { display: none; }
.salon-agenda-completed summary::before { content: "›"; font-size: 21px; width: 10px; line-height: 1; }
.salon-agenda-completed[open] summary::before { transform: rotate(90deg); }
.salon-agenda-completed summary span { padding: 2px 6px; border-radius: 5px; background: #f1eee7; font-variant-numeric: tabular-nums; }
.salon-agenda-completed summary small { width: 100%; padding-left: 17px; font-size: 12px; color: #916521; }
.salon-portal .salon-agenda-booking.status-completed { background: #f3f3f1; color: #736e64; }
.salon-agenda-booking.status-no_show .salon-agenda-info em { color: #a0392c; font-weight: 650; }
.salon-agenda-blocks { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.salon-portal .salon-agenda-blocks button { display: flex; flex-direction: column; gap: 4px; padding: 12px 16px; min-height: 48px; background: #e4dfd5; color: #625d54; font-size: 14px; text-align: left; }
.salon-agenda-blocks span { font-weight: 400; }
.salon-portal .salon-agenda-booking:hover { background: color-mix(in srgb, var(--employee-color) 16%, white); }
.salon-day-overview button:focus-visible, .salon-day-overview select:focus-visible, .salon-day-overview summary:focus-visible { outline: 3px solid #b0862b; outline-offset: 2px; }
@media (max-width: 900px) {
  .salon-agenda-controls > label > span { display: none; }
  .salon-agenda-controls > label { flex: 1; }
  .salon-agenda-controls select { max-width: none; }
  .salon-agenda-controls { gap: 8px; }
  .salon-portal .salon-agenda-layout button { padding-inline: 10px; }
  .salon-agenda-summary { font-size: 13px; }
  .salon-portal .salon-agenda-summary button { font-size: 13px; white-space: nowrap; }
  .salon-portal .salon-agenda-booking { grid-template-columns: 56px minmax(0, 1fr) 10px; gap: 10px; padding: 12px; background: white; }
  .salon-agenda-time time, .salon-agenda-info > strong { font-size: 16px; }
  .salon-agenda-time small { font-size: 12px; }
  .salon-agenda-info > span { font-size: 14px; }
  .salon-agenda-info > small { font-size: 13px; }
  .salon-agenda-completed { background: white; border-radius: 12px; padding: 0 8px 6px; }
}
@media (max-width: 370px) {
  .salon-portal .salon-agenda-layout button { font-size: 13px; padding-inline: 8px; }
  .salon-agenda-controls select { padding-left: 9px; padding-right: 18px; }
  .salon-agenda-summary { flex-wrap: wrap; }
}

.salon-modal.salon-quick-booking { width: min(640px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px; border-radius: 22px; }
.salon-quick-booking > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.salon-quick-booking h2 { margin: 0; font-family: inherit; font-size: 27px; font-weight: 750; letter-spacing: -.035em; text-transform: none; }
.salon-quick-booking > header button { padding: 10px 12px; border: 0; border-radius: 10px; font-size: 14px; background: #eeeae3; color: #26211b; min-height: 44px; }
.salon-quick-booking fieldset { min-width: 0; border: 0; padding: 0; margin: 0; }
.salon-quick-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.salon-quick-booking label { display: flex; flex-direction: column; gap: 7px; min-width: 0; font-size: 14px; font-weight: 600; }
.salon-quick-booking input, .salon-quick-booking select, .salon-quick-booking textarea { width: 100%; min-width: 0; min-height: 48px; padding: 11px 12px; border: 1px solid #dad4ca; border-radius: 10px; background: white; color: #161410; font: inherit; font-size: 16px; box-sizing: border-box; }
.salon-quick-wide { grid-column: 1 / -1; }
.salon-quick-customer { margin-top: 25px; }
.salon-quick-customer h3 { margin: 0 0 14px; font-size: 19px; }
.salon-quick-customer > label { margin-bottom: 15px; }
.salon-quick-matches { margin-bottom: 16px; background: #f5f2eb; padding: 6px; border-radius: 10px; }
.salon-quick-matches button { display: flex; flex-direction: column; gap: 5px; width: 100%; text-align: left; background: none; color: #26211b; border: 0; padding: 12px; cursor: pointer; border-radius: 8px; }
.salon-quick-matches button:hover { background: #ebe3d4; }
.salon-quick-matches strong { font-size: 15px; }
.salon-quick-matches span, .salon-quick-matches p { font-size: 13px; overflow-wrap: anywhere; }
.salon-quick-note { margin: 18px 0; }
.salon-quick-booking .salon-shift-toggle, .salon-employee-hours .salon-shift-toggle { display: flex; flex-direction: row; align-items: center; gap: 10px; cursor: pointer; }
.salon-quick-booking .salon-shift-toggle input, .salon-employee-hours .salon-shift-toggle input { appearance: auto; width: 21px; height: 21px; min-height: 21px; flex: 0 0 21px; margin: 0; accent-color: #a67b21; }
.salon-quick-booking .salon-quick-submit { width: 100%; min-height: 50px; margin-top: 22px; background: #c8a44d; color: #161410; border: 0; border-radius: 11px; font-size: 16px; font-weight: 750; cursor: pointer; }
.salon-quick-booking button:disabled { opacity: .5; cursor: default; }
.salon-employee-hours { margin-top: 8px; }
.salon-employee-list > article > .salon-employee-hours > summary { font-size: 15px; min-height: 46px; display: flex; align-items: center; cursor: pointer; }
.salon-employee-list > article > .salon-employee-hours > form { display: flex; flex-direction: column; align-items: stretch; gap: 15px; }
.salon-employee-list > article > .salon-employee-hours > form > button { font-size: 14px; min-height: 46px; align-self: flex-start; }
.salon-employee-hours p { margin: 0; font-size: 14px; line-height: 1.5; color: #6b655b; }
.salon-shift-days { display: grid; gap: 7px; }
.salon-shift-day { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(0, 1.6fr); gap: 10px; align-items: center; padding: 10px 12px; border-radius: 11px; background: #f5f2ed; }
.salon-shift-day > small { grid-column: 1 / -1; font-size: 12px; color: #846421; }
.salon-shift-toggle span, .salon-employee-hours label > span { font-size: 14px; font-weight: 600; text-transform: none; }
.salon-shift-range { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.salon-shift-range label { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.salon-employee-hours .salon-shift-range label span { font-size: 12px; color: #736b5f; }
.salon-employee-hours .salon-shift-range input { width: 100%; min-width: 0; min-height: 44px; padding: 8px; font-size: 16px; border-radius: 8px; box-sizing: border-box; }
.salon-shift-off { color: #8c8579; font-size: 14px; text-align: right; }
.salon-employee-hours .salon-shift-hint { font-size: 12px; }

@media (max-width: 900px) {
  .salon-portal .salon-portal-header nav { display: flex; gap: 8px; }
  .salon-portal .salon-portal-header nav button { min-height: 44px; font-size: 14px; }
  .salon-day-swipe { display: block; font-size: 12px; color: #756d60; margin: 0 0 10px; }
  .salon-portal .salon-toolbar { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .salon-toolbar > strong { grid-column: 1 / -1; grid-row: 2; font-size: 14px; }
  .salon-toolbar .salon-view-switch { grid-column: 2; grid-row: 1; justify-self: end; }
  .salon-toolbar .salon-view-switch button { padding: 8px 11px; font-size: 13px; white-space: nowrap; }
  .salon-day-picker { grid-row: 2; grid-column: 1 / -1; margin: 0; flex-direction: row; display: flex; align-items: center; justify-content: space-between; }
  .salon-staff-grid { min-width: calc(58px + var(--staff-count) * 205px); }
  .salon-staff-row { grid-template-columns: 58px repeat(var(--staff-count), minmax(205px, 1fr)); }
  .salon-staff-axis { padding-inline: 8px; font-size: 13px; }
}
@media (max-width: 600px) {
  .salon-portal .salon-portal-header { flex-direction: column; align-items: stretch; gap: 12px; }
  .salon-portal .salon-portal-header nav { display: flex; flex-direction: row; width: 100%; gap: 8px; }
  .salon-portal-header nav button { min-height: 46px; font-size: 14px; padding-inline: 13px; }
  .salon-portal-header .salon-new-booking { flex: 1; }
  .salon-modal.salon-quick-booking { padding: 20px 16px; max-height: calc(100dvh - 24px); border-radius: 20px; }
  .salon-quick-fields { gap: 12px; }
  .salon-shift-day { grid-template-columns: 1fr; }
  .salon-shift-day.is-off { grid-template-columns: 1fr auto; }
  .salon-shift-range { padding-left: 31px; }
}
@media (max-width: 370px) {
  .salon-portal .salon-toolbar { padding: 10px; gap: 8px; grid-template-columns: 1fr auto; }
  .salon-toolbar .salon-view-switch { grid-row: 1; grid-column: 2; }
  .salon-toolbar .salon-day-picker, .salon-toolbar > strong { grid-row: 2; grid-column: 1 / -1; }
  .salon-toolbar .salon-view-switch button { padding-inline: 8px; font-size: 12px; }
  .salon-toolbar .salon-date-nav button { min-width: 38px; padding-inline: 8px; }
  .salon-quick-fields { grid-template-columns: 1fr; }
}

/* Phone calendar: controls take two short rows; the team owns the screen. */
@media (max-width: 900px) {
  .salon-appointments-page > .salon-app-main > .salon-portal-header,
  .salon-appointments-page > .salon-app-main > .salon-toolbar { display: none; }
  .salon-mobile-calendar-tools { display: grid; gap: 4px; margin: 0 0 4px; }
  .salon-mobile-date-row { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px 44px; gap: 4px; align-items: center; }
  .salon-portal .salon-mobile-date-row button { width: 100%; min-height: 44px; padding: 0; background: white; color: #25221c; font-size: 26px; font-weight: 400; border-radius: 10px; letter-spacing: 0; }
  .salon-mobile-date-row input { width: 100%; min-width: 0; min-height: 44px; padding: 7px 4px; box-sizing: border-box; border: 0; border-radius: 10px; background: white; color: #25221c; font: inherit; font-size: 16px; font-weight: 750; }
  .salon-mobile-date-row > strong { text-align: center; font-size: 15px; font-variant-numeric: tabular-nums; }
  .salon-mobile-mode-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
  .salon-mobile-mode-row > div { display: flex; gap: 2px; }
  .salon-portal .salon-mobile-mode-row button { min-height: 40px; padding: 6px 13px; border-radius: 9px; font-size: 14px; font-weight: 650; letter-spacing: 0; color: #625d54; background: transparent; }
  .salon-portal .salon-mobile-mode-row button[aria-pressed="true"] { background: #171612; color: white; }
  .salon-mobile-calendar-tools button:focus-visible, .salon-mobile-calendar-tools input:focus-visible { outline: 3px solid #b0862b; outline-offset: 1px; }
  .salon-day-overview { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; margin-top: 0; }
  .salon-agenda-controls { grid-column: 1; min-width: 0; }
  .salon-agenda-layout, .salon-parallel-layout { display: none; }
  .salon-agenda-controls select { min-height: 40px; height: 40px; max-width: 240px; padding-block: 5px; border-radius: 9px; }
  .salon-agenda-summary { grid-column: 2; min-height: 40px; margin: 0; font-size: 13px; }
  .salon-agenda-summary > span:not(:first-child), .salon-agenda-summary > button { display: none; }
  .salon-compact-layout, .salon-compact-layout.is-desktop-hidden { display: block; grid-column: 1 / -1; min-width: 0; }
  .salon-compact-desktop { display: block; width: 100%; overflow: auto; padding-bottom: 4px; touch-action: pan-x pan-y; }
  .salon-compact-columns { grid-template-columns: repeat(var(--agenda-columns), minmax(96px, 1fr)); gap: 4px; }
  .salon-compact-column { border-radius: 10px; padding: 0 3px 4px; }
  .salon-compact-column > header { min-height: 42px; margin-inline: 2px; padding: 6px 3px; box-sizing: border-box; border-top-width: 3px; }
  .salon-compact-column > header > div { display: flex; align-items: center; justify-content: space-between; gap: 4px; width: 100%; min-width: 0; }
  .salon-compact-column h2 { margin: 0; font-size: 15px; letter-spacing: 0; }
  .salon-compact-column h2 .salon-employee-short-name { display: inline; font-size: inherit; font-weight: 750; color: #25221c; }
  .salon-employee-full-name, .salon-column-count-label, .salon-column-shift, .salon-compact-column > header > button { display: none; }
  .salon-compact-column .salon-column-count { font-size: 12px; color: #756d60; }
  .salon-portal .salon-agenda-booking { display: flex; flex-direction: column; align-items: stretch; gap: 4px; min-height: 68px; padding: 8px 6px; border-radius: 8px; background: color-mix(in srgb, var(--employee-color) 9%, white); }
  .salon-agenda-list { gap: 4px; }
  .salon-agenda-time time { font-size: 15px; line-height: 1.2; }
  .salon-agenda-time small, .salon-agenda-info > span, .salon-agenda-arrow { display: none; }
  .salon-agenda-info > strong { font-size: 14px; line-height: 1.3; display: block; }
  .salon-agenda-info > strong > span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .salon-agenda-info > small { font-size: 11px; line-height: 1.2; }
  .salon-agenda-booking.status-confirmed .salon-agenda-info > small { display: none; }
  .salon-agenda-empty { padding: 12px 4px; font-size: 12px; line-height: 1.4; }
  .salon-agenda-completed { margin-top: 4px; padding: 0; background: transparent; }
  .salon-agenda-completed summary { padding: 6px 2px; gap: 4px; font-size: 12px; min-height: 40px; }
  .salon-agenda-completed summary small { font-size: 11px; padding-left: 0; overflow-wrap: anywhere; }
  .salon-agenda-blocks { margin-bottom: 6px; }
  .salon-portal .salon-agenda-blocks button { padding: 8px 10px; font-size: 13px; }
  .salon-appointments-page .salon-customer-updates { margin-block: 4px; padding: 4px 10px; }
  .salon-appointments-page .salon-customer-updates > summary { min-height: 36px; padding: 0; }
  .salon-appointments-page .salon-customer-updates > summary small,
  .salon-appointments-page .salon-customer-updates > summary > b { display: none; }
}