:root{--cream:#faf8f4;--gold:#ad9673;--ink:#292624;--line:#ded5ca;--olive:#65715d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}header{display:flex;align-items:center;justify-content:space-between;padding:15px 5%;background:#fffefa;gap:30px;position:sticky;top:0;z-index:20;border-bottom:1px solid #eee6dc}.brand{width:185px;max-width:37vw;background:#171717;overflow:hidden;display:block}.brand img{width:100%;height:92px;object-fit:contain;display:block}nav{display:flex;gap:25px;align-items:center;font-size:12px;text-transform:uppercase;letter-spacing:1.4px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;background:var(--olive);border:1px solid var(--olive);color:white;padding:16px 23px;text-transform:uppercase;font-size:11px;letter-spacing:1.5px;font-weight:600;text-align:center}.btn.alt{background:transparent;color:var(--ink);border-color:#b8a48c}.hero{display:grid;grid-template-columns:39% 61%;background:#f3eee6;min-height:595px}.hero .copy{padding:65px 7% 65px 12%;display:flex;flex-direction:column;justify-content:center}.eyebrow{text-transform:uppercase;letter-spacing:3px;color:var(--gold);font-size:11px;font-weight:600}h1,h2,h3{font-family:Italiana,Georgia,serif;font-weight:400}h1{font-size:clamp(48px,4.8vw,75px);line-height:1.08;margin:20px 0}h2{font-size:clamp(40px,4.3vw,66px);line-height:1.1;margin:14px 0 20px}p{line-height:1.8;color:#6b625b}.hero p{max-width:450px;font-size:15px}.hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.hero-photo{height:100%;min-height:510px;overflow:hidden;background:#dfd3c4}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 40%;display:block}.intro{padding:70px 7%;text-align:center;max-width:920px;margin:auto}.intro p{font-size:17px}.line{height:1px;width:80px;background:var(--gold);margin:24px auto}.editorial{display:grid;grid-template-columns:1fr 1fr;gap:0;background:#ece6dd}.editorial .picture{height:520px;object-fit:cover;width:100%;display:block}.editorial .editorial-copy{padding:60px 12%;display:flex;flex-direction:column;justify-content:center}.services{padding:85px 6%;text-align:center;background:#fffefa}.servicegrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:35px}.service{border:1px solid var(--line);padding:35px 16px;min-height:155px;display:flex;flex-direction:column;justify-content:center}.service h3{font-size:28px;margin:0 0 10px}.service p{font-size:12px;margin:0}.team{padding:88px 6%;background:#f7f3ed;text-align:center}.teamgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px;max-width:1240px;margin:38px auto}.stylist{background:#fff;text-align:left;overflow:hidden;box-shadow:0 3px 20px #392e210b}.stylist img{display:block;width:100%;height:285px;object-fit:cover;object-position:center 24%;background:#e2d8c8}.stylist .info{padding:18px 20px 24px}.stylist h3{font-size:30px;margin:0 0 6px}.stylist p{font-size:11px;letter-spacing:.2px;margin:0 0 13px}.contact-link{text-transform:uppercase;color:#6c7358;font-size:11px;letter-spacing:1px;font-weight:600;border-bottom:1px solid #afac8b;padding-bottom:5px}.gallery{display:grid;grid-template-columns:1.1fr .9fr;background:#fffefa}.gallery img{width:100%;height:480px;object-fit:cover}.gallery .copy{padding:50px 11%;display:flex;flex-direction:column;justify-content:center}.consult{background:#26362b;color:white;text-align:center;padding:70px 8%}.consult p{color:#ede8da}.consult .btn{background:#e6dbca;color:#233127;border-color:#e6dbca;margin-top:14px}footer{background:#161915;color:#e8e1d4;padding:30px 6%;display:flex;justify-content:space-between;gap:15px;font-size:11px;flex-wrap:wrap}footer a{color:#e8e1d4}.note{background:#f0e7d9;text-align:center;padding:12px;font-size:12px;color:#514435}@media(max-width:850px){nav{gap:10px}nav a:not(.btn){display:none}header{padding:10px 4%}.brand{width:125px}.brand img{height:68px}.hero{grid-template-columns:1fr}.hero-photo{grid-row:1;height:360px;min-height:0}.hero .copy{padding:43px 7% 55px}.editorial,.gallery{grid-template-columns:1fr}.editorial .picture,.gallery img{height:350px}.editorial .editorial-copy,.gallery .copy{padding:40px 7%}.servicegrid{grid-template-columns:repeat(2,1fr)}.teamgrid{grid-template-columns:repeat(2,1fr)}.stylist img{height:240px}}@media(max-width:470px){.teamgrid{gap:10px}.stylist img{height:210px}.stylist .info{padding:12px}.stylist h3{font-size:25px}.stylist p{min-height:32px}.servicegrid{gap:9px}.service{min-height:125px;padding:20px 7px}.service h3{font-size:23px}}

/* Refined typographic wordmark: no pasted black logo artwork */
.brand{width:auto;max-width:none;background:transparent;overflow:visible;min-width:245px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:8px 2px 4px;color:#25211f;line-height:1}
.brand-hair{font-family:'Brush Script MT','Snell Roundhand','Apple Chancery',cursive;font-style:italic;font-size:37px;font-weight:400;line-height:.72;letter-spacing:.3px;transform:translate(-40px,9px) rotate(-5deg);z-index:1;color:#8e7959}
.brand-moxie{font-family:Italiana,Georgia,serif;font-size:48px;letter-spacing:-1.7px;line-height:.96;font-weight:400}
.brand-salon{font-size:9px;letter-spacing:3px;font-weight:500;color:#8e7959;margin-top:7px}
@media(max-width:850px){.brand{min-width:170px}.brand-hair{font-size:27px;transform:translate(-28px,7px) rotate(-5deg)}.brand-moxie{font-size:35px}.brand-salon{font-size:7px;letter-spacing:1.8px}header{gap:9px}header nav .btn{padding:12px 10px;font-size:9px;letter-spacing:1px}}

/* 3 requested brand refinements: readable calligraphic Hair, prominent SALON, charming Old Fair Oaks */
.brand{min-width:276px;padding:9px 4px 6px}
.brand-hair{font-family:'Allura','Brush Script MT',cursive;font-size:55px;line-height:.72;color:#ac8d5c;transform:translate(-47px,11px) rotate(-4deg);font-style:normal}
.brand-moxie{font-size:52px;letter-spacing:-1.5px}
.brand-salon{font-family:'DM Sans',Arial,sans-serif;font-size:15px;font-weight:600;letter-spacing:7px;color:#67563e;margin-top:10px;padding-left:7px;line-height:1.3}
.brand-location{font-size:9px;color:#8b806d;letter-spacing:2.5px;font-weight:500;margin-top:5px}
@media(max-width:850px){.brand{min-width:170px}.brand-hair{font-size:39px;transform:translate(-30px,8px) rotate(-4deg)}.brand-moxie{font-size:36px}.brand-salon{font-size:12px;letter-spacing:4.5px;margin-top:6px;padding-left:4px}.brand-location{font-size:7px;letter-spacing:1.7px;margin-top:3px}}

/* The user's actual logo, color-inverted to black on ivory, no font substitutions. */
.brand.original-logo{display:block;min-width:0;max-width:none;width:210px;padding:0;background:transparent;line-height:0}
.brand.original-logo img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
@media(max-width:850px){.brand.original-logo{width:132px;min-width:0}}

.site-page{display:none}.site-page.active{display:block}
header{flex-wrap:wrap}.note{font-size:11px}
nav{flex-wrap:wrap;gap:16px} nav a[data-nav].selected{color:#7c6847;border-bottom:1px solid #bda47f;padding-bottom:4px}
.page-head{text-align:center;background:#f3eee7;padding:90px 7% 75px}.page-head h1{font-size:clamp(52px,6vw,90px);margin:17px auto}.page-head p{max-width:650px;margin:0 auto}
.page-wrap{max-width:1200px;margin:auto;padding:72px 5%}.center{text-align:center}.center p{max-width:590px;margin:0 auto 25px}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.service-grid article{border:1px solid #e5d9c8;background:#fffdf9;padding:30px;min-height:300px}.service-grid article span{letter-spacing:2px;color:#a38a64;font-size:11px}.service-grid h2{font-size:35px}.service-grid .feature{background:#eae4d9}.service-grid .feature h2{font-size:40px}
.gallery-grid{max-width:1260px;margin:65px auto 0;padding:0 5%;display:grid;grid-template-columns:1.1fr .9fr;gap:16px}.gallery-grid img{width:100%;height:430px;object-fit:cover}.gallery-grid img:first-child{grid-row:span 2;height:876px}.gallery-grid img:nth-child(2),.gallery-grid img:nth-child(3){height:430px}
.event-layout{max-width:1160px;display:grid;grid-template-columns:1.5fr 1fr;gap:55px;padding:80px 5%;margin:auto}.event-main h2{font-size:58px}.event-line{display:flex;gap:20px;border-top:1px solid #ded5ca;padding:18px 0;justify-content:space-between}.event-line strong{min-width:140px}.event-line span{text-align:right;color:#6c6257;line-height:1.6}.event-main .btn{margin-top:28px}.event-aside{background:#efede6;padding:45px}.event-aside h2{font-size:50px}.thin{height:1px;background:#c8bdac;margin:25px 0}.fine{font-size:12px;line-height:1.7}
.contact-options{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:1100px;margin:75px auto;padding:0 5%}.contact-options article{padding:45px;background:#fffdf9;border:1px solid #e4dacf}.contact-options h2,.location h2{font-size:49px}.location{text-align:center;padding:55px 5% 90px;background:#f1ece5}
@media(max-width:800px){nav{gap:10px;font-size:10px}.service-grid{grid-template-columns:1fr}.gallery-grid{grid-template-columns:1fr}.gallery-grid img,.gallery-grid img:first-child,.gallery-grid img:nth-child(2),.gallery-grid img:nth-child(3){height:auto;max-height:620px;grid-row:auto}.event-layout,.contact-options{grid-template-columns:1fr}.page-head{padding:55px 7%}.event-layout{gap:20px}.event-aside{padding:25px}}
.keep-together{white-space:nowrap}


.jotform-section{padding:80px 5% 95px;background:#f8f5f0;text-align:center}
.jotform-title{max-width:650px;margin:0 auto 25px}.jotform-title h2{font-size:clamp(40px,5vw,66px)}
.jotform-section iframe{width:100%;max-width:800px;min-height:980px;border:1px solid #dfd5c8;background:#fff;border-radius:6px}
.form-fallback{font-size:13px}.form-fallback a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:800px){.jotform-section{padding:50px 4%}.jotform-section iframe{min-height:1150px}nav{row-gap:12px}}
.keep-together{white-space:nowrap}


.page-switcher{position:sticky;top:117px;z-index:19;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;padding:11px 18px;background:#f2ede4;border-bottom:1px solid #ddd0bc;box-shadow:0 4px 14px #0000000a}.page-switcher span{font-size:10px;letter-spacing:1.4px;color:#816e55;margin-right:10px}.page-switcher a{border:1px solid #c6b59d;border-radius:3px;padding:9px 13px;font-size:12px;color:#3c352c;background:#fffdf9}.page-switcher a.selected{background:#536349;border-color:#536349;color:white}
.photo-proof{text-align:center;padding:65px 5%;background:#fffefa}.photo-proof h2{font-size:44px}.real-photo-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:30px auto 0;max-width:1200px}.real-photo-strip img{width:100%;height:270px;object-fit:cover;display:block}
@media(max-width:850px){.page-switcher{position:static;gap:6px;padding:12px 8px}.page-switcher span{width:100%;text-align:center}.page-switcher a{padding:9px 10px;font-size:11px}.real-photo-strip{grid-template-columns:1fr 1fr}.real-photo-strip img{height:180px}.real-photo-strip img:last-child{grid-column:1 / -1;height:210px}}
.keep-together{white-space:nowrap}


/* Mobile-first polish; desktop presentation preserved */
html { scroll-padding-top: 120px; }
img { max-width:100%; }
.site-page { overflow-x:clip; }
button,a { -webkit-tap-highlight-color:rgba(0,0,0,0.08); }
@media (max-width: 850px) {
 header { position:sticky; top:0; display:flex; flex-direction:column; align-items:stretch; gap:8px; padding:9px 12px 10px; }
 header .brand.original-logo { align-self:center; width:136px; max-width:none; }
 header nav { width:100%; flex-wrap:nowrap; display:flex; align-items:center; justify-content:flex-start; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; gap:16px; padding:7px 3px 4px; }
 header nav::-webkit-scrollbar { display:none; }
 header nav a:not(.btn) { display:inline-flex !important; flex-shrink:0; font-size:11px; font-weight:600; letter-spacing:0.5px; padding:7px 0; white-space:nowrap; }
 header nav .btn { flex-shrink:0; padding:12px 13px; font-size:10px; white-space:nowrap; line-height:1.2; }
 .page-switcher { display:none; }
 .hero { display:flex; flex-direction:column; min-height:0; }
 .hero-photo { order:0; height:clamp(250px,58vw,440px); width:100%; min-height:0; }
 .hero-photo img { object-position:center 44%; }
 .hero .copy { order:1; padding:34px 7% 46px; }
 .hero .copy .eyebrow { font-size:10px; letter-spacing:1.7px; }
 .hero .copy .eyebrow span { white-space:normal !important; }
 .hero h1 { font-size:clamp(43px,9.2vw,69px); line-height:1.10; overflow-wrap:normal; }
 .hero p { font-size:15px; line-height:1.7; }
 .hero .actions { display:grid; grid-template-columns:1fr; width:100%; gap:10px; }
 .hero .actions .btn { width:100%; padding:16px; min-height:49px; }
 .intro { padding:54px 7%; }
 .intro h2, .editorial h2, .gallery h2, .team h2, .services h2, .page-head h1 { overflow-wrap:normal; }
 .editorial .picture { height:340px; object-position:center; }
 .editorial .editorial-copy { padding:42px 7%; }
 .team, .services { padding:55px 5%; }
 .teamgrid { gap:15px; }
 .stylist img { aspect-ratio:4/5; height:auto; object-fit:cover; }
 .stylist .info { padding:17px 15px 22px; }
 .stylist h3 { font-size:29px; }
 .contact-link { display:inline-block; padding:10px 0; min-height:44px; }
 .gallery img { height:320px; }
 .consult { padding:56px 7%; }
 .consult .btn { width:100%; max-width:410px; min-height:48px; }
 .page-head { padding:50px 7% 47px; }
 .page-head h1 { font-size:clamp(46px,9.8vw,67px); }
 .page-wrap { padding:48px 5%; }
 .event-layout { padding:48px 6%; }
 .event-main h2 { font-size:clamp(43px,10vw,58px); }
 .event-line { flex-direction:column; gap:5px; }
 .event-line span { text-align:left; }
 .event-main .btn { width:100%; max-width:440px; min-height:48px; }
 .contact-options { margin:45px auto; gap:12px; }
 .contact-options article { padding:28px 22px; }
 .contact-options h2, .location h2 { font-size:clamp(39px,9vw,53px); }
 .contact-options .btn { min-height:48px; }
 .jotform-section iframe { min-height:1200px; display:block; margin:auto; }
 .photo-proof { padding:48px 5%; }
 .photo-proof h2 { font-size:clamp(34px,8vw,47px); }
 footer { display:flex; flex-direction:column; gap:10px; line-height:1.6; }
}
@media (max-width: 600px) {
 .servicegrid { grid-template-columns:1fr 1fr; }
 .service { padding:25px 10px; }
 .service h3 { font-size:24px; }
 .teamgrid { grid-template-columns:1fr 1fr; gap:11px; }
 .stylist h3 { font-size:25px; }
 .stylist .info { padding:12px 11px 18px; }
 .stylist p { font-size:11px; min-height:0; }
 .real-photo-strip { gap:8px; }
 .real-photo-strip img { height:160px; }
 .real-photo-strip img:last-child { height:205px; }
 .jotform-section { padding:48px 3%; }
 .jotform-section iframe { width:100%; min-height:1250px; }
 .keep-together { white-space:normal; }
 .keep-together::before { content:''; }
}
@media (max-width: 360px) {
 .teamgrid,.servicegrid { grid-template-columns:1fr; }
 .stylist img { aspect-ratio:4/3; }
 .hero h1 { font-size:41px; }
 .real-photo-strip { grid-template-columns:1fr; }
 .real-photo-strip img, .real-photo-strip img:last-child { grid-column:auto; height:225px; }
}


/* Production multi-page overrides */
.site-page { display:block !important; }
.page-switcher, .note { display:none !important; }
header { background:#fffefa; }
footer { min-height:90px; }
.site-page img { max-width:100%; }
header .brand.original-logo img {mix-blend-mode:multiply;}
nav a[aria-current="page"] {color:#806645;border-bottom:1px solid #bda47f;}
@media(max-width:650px){
  .keep-together {white-space:normal;display:inline-block;}
  .hero h1 {font-size:clamp(42px,10vw,60px);}
  .hero-photo {min-height:280px;}
  .hero .copy {padding:36px 7% 50px;}
  .event-aside {padding:22px;}
  .jotform-section iframe {width:100%;max-width:100%;}
}

/* Larger original Hair Moxie logo on desktop; mobile sizes unchanged. */
@media (min-width: 851px) {
  header .brand.original-logo { width: 330px; }
}

/* Show the complete ornate mirror and styling station on the home editorial panel. */
@media (min-width: 851px) {
  .editorial .picture { height: 620px; object-fit: contain; object-position: center; background-color: #ece6dd; }
}
@media (max-width: 850px) {
  .editorial .picture { width: 100%; height: auto; object-fit: contain; background-color: #ece6dd; }
}

/* Individual stylist bio disclosure links. */
.stylist .bio-details{margin-top:14px;border-top:1px solid #e7ded3;padding-top:12px}
.stylist .bio-details summary{display:inline-block;cursor:pointer;list-style:none;color:#685638;text-transform:uppercase;font-size:11px;letter-spacing:1.1px;font-weight:600;border-bottom:1px solid #baa88d;padding:9px 0;min-height:40px}
.stylist .bio-details summary::-webkit-details-marker{display:none}
.stylist .bio-details summary:hover,.stylist .bio-details summary:focus-visible{color:#26251e;border-color:#26251e}
.stylist .bio-content{margin-top:9px;padding:4px 0 8px}
.stylist .bio-content p{font-size:13px;line-height:1.65;letter-spacing:0;margin:4px 0 12px;min-height:0}
.stylist .bio-contact{font-size:12px;text-decoration:underline;text-underline-offset:3px;color:#586248}

/* Refined accessible individual biographies: subtle links, one bio open at a time. */
.stylist .info{display:flex;flex-direction:column;align-items:flex-start}
.stylist .bio-details{width:100%;margin-top:14px;padding-top:11px}
.stylist .bio-details summary{display:inline-flex;align-items:center;gap:7px;min-height:42px;font-size:11px;line-height:1.4;color:#766243;outline-offset:4px}
.stylist .bio-details summary::after{content:"+";display:inline-block;font-size:16px;font-weight:400;line-height:1;opacity:.7}
.stylist .bio-details[open] summary::after{content:"−"}
.stylist .bio-details[open] .bio-content{animation:bio-reveal .18s ease-out}
.stylist .bio-content{padding:2px 0 2px;margin-top:7px}
.stylist .bio-content p{font-size:12.5px;line-height:1.75;color:#665e54;margin:0;max-width:36ch}
@keyframes bio-reveal{from{opacity:.45;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.stylist .bio-details[open] .bio-content{animation:none}}

/* Stylists full-width bio dropdown tabs: visible, mobile-friendly, below text links. */
.stylist .bio-details{width:100%;margin-top:14px;border-top:1px solid #e6dbcc;padding-top:0}
.stylist .bio-details summary{box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:46px;padding:13px 12px 12px 0;font-size:11px;letter-spacing:1.1px;line-height:1.4;font-weight:600;color:#66583e;border:0;cursor:pointer;text-transform:uppercase;text-align:left;user-select:none}
.stylist .bio-details summary::after{content:none!important}
.stylist .bio-chevron{height:8px;width:8px;flex:0 0 8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .15s ease;margin-right:4px;margin-top:-4px}
.stylist .bio-details[open] .bio-chevron{transform:rotate(225deg);margin-top:4px}
.stylist .bio-details[open] summary{color:#4c593f}
.stylist .bio-details summary:focus-visible{outline:2px solid #8a775b;outline-offset:3px}
.stylist .bio-content{padding:1px 5px 12px 0;margin-top:0}
.stylist .bio-content p{font-size:13px;line-height:1.75;color:#62594f;max-width:none;margin:0}
@media(prefers-reduced-motion:reduce){.stylist .bio-chevron{transition:none}}

/* Original biographies: balanced paragraph spacing when expanded. */
.stylist .bio-content p + p {margin-top:12px}
.stylist .bio-content {padding-bottom:16px}

/* Make stylist text contact buttons plainly visible above collapsed biographies. */
.stylist .info > .contact-link{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:10px 13px;margin-top:3px;border:1px solid #b8a88c;border-radius:2px;background:#f6f2eb;color:#4a5a43;font-size:11px;font-weight:700;letter-spacing:.7px;line-height:1.35;text-align:center;text-decoration:none;white-space:normal}
.stylist .info > .contact-link:hover,.stylist .info > .contact-link:focus-visible{background:#e8e3d8;color:#2f402a;border-color:#8f967f}
.stylist .bio-details{margin-top:12px}
@media(max-width:600px){.stylist .info > .contact-link{font-size:10px;letter-spacing:.3px;padding:9px 7px;width:100%;min-height:42px}.stylist .bio-details summary{font-size:10px;letter-spacing:.5px}}