/* Site structure upgrade: designers, works, and compact homepage navigation. */
.stylists.featured-designers{grid-template-columns:repeat(3,minmax(0,1fr))}
.stylist-link-card .stylist-photo{display:block}
.stylist-role{display:block;color:var(--tan);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.stylist-specialty{margin:0 0 12px;color:var(--coffee);font-family:var(--serif);font-size:18px;line-height:1.45}
.stylist-detail-link{display:inline-flex;align-items:center;gap:8px;width:max-content;margin-top:auto;padding-top:18px;color:var(--coffee);font-size:13px;font-weight:700;letter-spacing:.06em;border-bottom:1px solid rgba(93,66,49,.28)}
.stylist-detail-link:after{content:"→";color:var(--gold)}
.section-actions{display:flex;justify-content:center;gap:12px;margin-top:30px}

.designer-profile-section{padding:82px 0 66px}
.designer-profile-layout{display:grid;grid-template-columns:minmax(320px,.86fr) minmax(0,1.14fr);gap:64px;align-items:center}
.designer-profile-photo{overflow:hidden;aspect-ratio:4/5;border-radius:8px;background:#e7d9c9;box-shadow:var(--shadow-soft)}
.designer-profile-photo img{width:100%;height:100%;object-fit:cover;object-position:center top}
.designer-profile-copy{max-width:650px}
.designer-profile-copy h1{margin:12px 0 16px;color:var(--ink);font-size:clamp(54px,7vw,94px);line-height:.95;letter-spacing:.04em}
.designer-profile-role{display:block;margin-bottom:24px;color:var(--tan);font-size:13px;font-weight:700;letter-spacing:.14em}
.designer-profile-label{margin-bottom:8px;color:var(--coffee);font-family:var(--serif);font-size:28px}
.designer-profile-specialties{margin:0 0 25px;color:#6f5b4e;font-size:14px;letter-spacing:.04em}
.designer-profile-bio{margin:0;color:#554b43;font-size:16px;line-height:2}
.designer-profile-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.designer-works-section{padding:68px 0 96px;border-top:1px solid var(--line);background:rgba(255,250,243,.38)}
.designer-works-section .section-head{align-items:center}
.designer-works-section .works-grid{grid-template-columns:repeat(4,minmax(0,1fr))}

.works-page-shell{padding:72px 0 104px}
.works-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,240px)) 1fr;gap:12px;align-items:end;margin-bottom:30px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.works-filter label{display:block;margin-bottom:8px;color:var(--tan);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.works-filter select{width:100%;min-height:46px;padding:10px 38px 10px 13px;border:1px solid rgba(20,16,13,.14);border-radius:8px;background:#fffaf3;color:var(--ink);font:inherit}
.works-count{justify-self:end;padding-bottom:12px;color:var(--muted);font-size:13px}
.works-page-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.works-page-grid .works-empty{grid-column:1/-1}
.works-instagram-band{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;margin-top:58px;padding:32px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.works-instagram-band h2{font-size:32px}
.works-instagram-band p{max-width:620px;margin:10px 0 0;color:var(--muted)}

.resource-strip{padding:62px 0;background:#241a15;color:var(--soft)}
.resource-strip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid rgba(255,250,243,.18);border-bottom:1px solid rgba(255,250,243,.18)}
.resource-link{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;min-height:190px;padding:30px 34px;color:var(--soft)}
.resource-link+.resource-link{border-left:1px solid rgba(255,250,243,.18)}
.resource-link small{display:block;margin-bottom:10px;color:var(--gold2);font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.resource-link h2{font-size:34px}
.resource-link p{margin:10px 0 0;color:rgba(255,250,243,.68);font-size:14px;line-height:1.8}
.resource-link-icon{font-family:var(--serif);font-size:38px;color:var(--gold)}
#booking{display:none}

@media(max-width:980px){
  .stylists.featured-designers{grid-template-columns:repeat(3,minmax(0,1fr))}
  .designer-profile-layout{gap:36px}
  .designer-works-section .works-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .works-page-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:980px){
  body.home-scalp-visible .floating-actions{opacity:0;visibility:hidden;pointer-events:none}
}

@media(max-width:760px){
  .stylists.featured-designers{grid-template-columns:1fr!important}
  .designer-profile-section{padding:48px 0 52px}
  .designer-profile-layout{grid-template-columns:1fr;gap:32px}
  .designer-profile-photo{width:min(100%,520px);margin:0 auto}
  .designer-profile-copy h1{font-size:52px}
  .designer-profile-bio{font-size:15px;line-height:1.9}
  .designer-profile-actions{display:grid;grid-template-columns:1fr 1fr}
  .designer-profile-actions .btn:first-child{grid-column:1/-1}
  .designer-works-section{padding:52px 0 72px}
  .works-page-shell{padding:52px 0 78px}
  .works-toolbar{grid-template-columns:1fr 1fr}
  .works-count{grid-column:1/-1;justify-self:start;padding:4px 0 0}
  .works-instagram-band{grid-template-columns:1fr;gap:18px}
  .resource-strip{padding:34px 0}
  .resource-strip-grid{grid-template-columns:1fr}
  .resource-link{min-height:150px;padding:26px 8px}
  .resource-link+.resource-link{border-left:0;border-top:1px solid rgba(255,250,243,.18)}
  #story .story-copy p:nth-child(n+3),#story .brand-values{display:none}
  #services .services{grid-template-columns:repeat(2,minmax(0,1fr))}
  #services .service-card{min-height:0;padding:18px 16px}
  #services .service-card:before{width:92px;height:92px}
  #services .num{margin-bottom:12px;font-size:28px}
  #services .service-card h3{margin-bottom:8px;font-size:19px}
  #services .service-card p{margin-bottom:0;font-size:13px;line-height:1.62}
  #services .tags{display:none}
  #scalp .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  #scalp .step{padding:18px 15px}
  #scalp .step:before{margin-bottom:12px;font-size:26px}
  #scalp .step h3{font-size:18px}
  #scalp .step p{font-size:13px;line-height:1.6}
}

/* Hair Notes knowledge carousels */
.knowledge-summary{margin:0 0 18px;color:#51473f;font-size:15px;line-height:1.85}
.knowledge-carousel{position:relative;margin:4px 0 20px;outline:none}
.knowledge-viewport{position:relative;overflow:hidden;width:min(100%,520px);aspect-ratio:4/5;border-radius:8px;background:#e8ddd1;border:1px solid rgba(20,16,13,.10)}
.knowledge-track{display:flex;height:100%;transition:transform .32s ease;will-change:transform}
.knowledge-slide{flex:0 0 100%;height:100%;margin:0;display:grid;place-items:center;background:#e8ddd1}
.knowledge-slide img{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .24s ease}
.knowledge-slide img.is-loaded{opacity:1}
.knowledge-arrow{position:absolute;top:50%;z-index:2;width:42px;height:42px;border:1px solid rgba(255,255,255,.34);border-radius:50%;background:rgba(20,16,13,.68);color:#fffaf3;font-size:28px;line-height:1;display:grid;place-items:center;transform:translateY(-50%);cursor:pointer;backdrop-filter:blur(8px)}
.knowledge-arrow.prev{left:12px}.knowledge-arrow.next{right:12px}.knowledge-arrow:disabled{opacity:.28;cursor:default}
.knowledge-carousel-footer{width:min(100%,520px);min-height:30px;margin-top:10px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.knowledge-dots{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.knowledge-dot{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:rgba(60,45,37,.22);cursor:pointer}
.knowledge-dot.active{background:var(--gold);box-shadow:0 0 0 3px rgba(184,154,106,.16)}
.knowledge-count{color:var(--muted);font-size:12px;white-space:nowrap}
.knowledge-ig{display:inline-flex;margin-top:18px;color:var(--coffee);font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.knowledge-empty{padding:30px 0;color:var(--muted);text-align:center}
@media(prefers-reduced-motion:reduce){.knowledge-track,.knowledge-slide img{transition:none}}
@media(max-width:760px){
  .knowledge-summary{font-size:14px;line-height:1.75}
  .knowledge-viewport{width:100%}
  .knowledge-carousel-footer{width:100%}
  .knowledge-arrow{width:38px;height:38px;font-size:24px}
}

@media(max-width:540px){
  .works-page-grid,.designer-works-section .works-grid{grid-template-columns:1fr}
  .works-toolbar{grid-template-columns:1fr}
  .works-count{grid-column:auto}
  .designer-profile-actions{grid-template-columns:1fr}
  .designer-profile-actions .btn:first-child{grid-column:auto}
}

@media(max-width:360px){
  #services .services,#scalp .steps{grid-template-columns:1fr}
}
