@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Playfair+Display:ital,wght@0,500;1,500&display=swap');
:root{--ink:#241c22;--plum:#5b3a56;--rose:#d9b6c3;--blush:#f3e9ed;--paper:#fffafc;--muted:#756971;--accent:#efd9a8}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif}img{display:block;width:100%}a{color:inherit;text-decoration:none}
.header{height:78px;display:flex;align-items:center;padding:0 4.5vw;gap:35px;background:rgba(255,250,252,.96);border-bottom:1px solid rgba(36,28,34,.1);position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
.brand img{width:210px}.header nav{display:flex;gap:32px;margin-left:auto;font-size:12px;font-weight:600}.header-cta{margin-left:20px;border:1px solid var(--ink);padding:16px 22px;font-size:12px;font-weight:600}.header-cta span{margin-left:18px}.menu{display:none;border:0;background:none;font-size:24px}
.hero{min-height:calc(100vh - 78px);position:relative;background-image:var(--hero);background-size:cover;background-position:center;display:flex;align-items:center;color:white}
.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(29,18,27,.82),rgba(29,18,27,.45) 38%,rgba(29,18,27,.06) 75%),linear-gradient(0deg,rgba(22,13,20,.3),transparent 52%)}
.hero-copy{position:relative;z-index:2;padding:7vw;max-width:760px}.eyebrow,.section-no{font-size:10px;letter-spacing:.22em;font-weight:600}.eyebrow{color:#f2deb2;margin-bottom:20px}
.hero h1,.intro h2,.photo-copy h2,.cards h2,.salon-copy h2,.visit h2{font-family:"Playfair Display",Georgia,serif;font-weight:500;line-height:.89;letter-spacing:-.035em;margin:0}.hero h1{font-size:clamp(66px,8vw,118px)}em{font-weight:500}.lead{font-size:17px;line-height:1.7;max-width:620px;margin:28px 0}.actions{display:flex;gap:16px;flex-wrap:wrap}.primary{background:#efd9a8;color:#241c22;padding:16px 22px;font-size:12px;font-weight:600}.primary span{margin-left:20px}.secondary{padding:15px 18px;border:1px solid rgba(255,255,255,.55);font-size:12px;font-weight:600}
.section{padding:110px 6vw}.intro-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:9vw;margin-top:32px}.intro h2,.photo-copy h2,.cards h2,.salon-copy h2,.visit h2{font-size:clamp(48px,5.5vw,82px)}.intro-grid p,.photo-copy p,.salon-copy p,.visit-copy p{line-height:1.75;color:var(--muted);font-size:15px}.inline-link{display:inline-block;border-bottom:1px solid currentColor;padding-bottom:5px;margin-top:10px;font-size:12px;font-weight:600}
.photo-feature{display:grid;grid-template-columns:1.35fr .65fr;min-height:760px;background:#eee1e7}.real-photo img{height:100%;object-fit:cover}.photo-copy{padding:7vw 6vw;display:flex;flex-direction:column;justify-content:center}.photo-copy h2{margin:25px 0}.dark-btn{display:inline-block;align-self:flex-start;background:var(--ink);color:white;padding:15px 20px;font-size:12px;font-weight:600;margin-top:15px}
.cards-head{display:flex;justify-content:space-between;gap:60px;align-items:flex-end;margin-bottom:55px}.cards-note{max-width:420px;color:var(--muted);font-size:14px}.card-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}.card-grid article{border-top:1px solid rgba(36,28,34,.2);padding-top:15px}.card-grid img{aspect-ratio:4/3;object-fit:cover}.card-grid small{display:block;margin:16px 0 12px;font-size:9px;letter-spacing:.17em}.card-grid h3{font-family:"Playfair Display",Georgia,serif;font-size:30px;line-height:1.08;margin:0 0 12px;font-weight:500}.card-grid p{color:var(--muted);font-size:13px;line-height:1.7}.text-card{background:var(--plum);color:white;padding:30px}.text-card p{color:#eadde5}.text-card h3{font-size:36px}.inline-link.light{color:white}
.salon-band{display:grid;grid-template-columns:.7fr 1.3fr;background:#241c22;color:white}.salon-copy{padding:7vw 6vw;display:flex;flex-direction:column;justify-content:center}.salon-copy p{color:#d8ccd3}.salon-copy h2{margin:24px 0}.salon-photo img{height:100%;object-fit:cover;min-height:640px}
.quote{background:#d6b4c1;padding:120px 10vw;text-align:center}.quote p{font-family:"Playfair Display",Georgia,serif;font-size:clamp(40px,5vw,70px);font-style:italic;line-height:1.1;max-width:1100px;margin:auto}
.visit{display:grid;grid-template-columns:1.15fr .85fr;gap:8vw}.visit h2{margin-top:25px}.visit-copy{padding-top:35px}.primary.dark{display:inline-block;background:var(--ink);color:white;margin-top:20px}
footer{background:#1c161b;color:white;padding:60px 6vw 30px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;align-items:end}footer img{width:220px}footer p{color:#c9bdc5;font-size:12px;text-align:center}footer span{color:#8f828b;font-size:10px;text-align:right}
@media(max-width:850px){.header nav,.header-cta{display:none}.menu{display:block;margin-left:auto}.header nav.open{display:flex;position:absolute;top:78px;left:0;right:0;background:#fffafc;padding:25px;flex-direction:column}.hero{min-height:80vh}.hero-copy{padding:10vw 6vw}.intro-grid,.photo-feature,.salon-band,.visit{grid-template-columns:1fr}.real-photo{height:60vw;min-height:420px}.photo-copy,.salon-copy{padding:80px 6vw}.card-grid{grid-template-columns:1fr}.cards-head{display:block}.cards-note{margin-top:22px}.salon-photo img{min-height:450px}.section{padding:80px 6vw}footer{grid-template-columns:1fr}footer p,footer span{text-align:left}}
@media(max-width:560px){.brand img{width:180px}.hero h1{font-size:54px}.lead{font-size:15px}.hero-copy{padding-top:110px;padding-bottom:70px}.quote{padding:85px 6vw}}

/* Unique title placement edition */
.hero-copy-right{
  margin-left:auto;
  margin-right:5vw;
  width:min(720px,88vw);
  padding:6vw 0;
}
.hero-panel{
  margin-left:auto;
  max-width:620px;
  padding:42px 44px 46px;
  background:rgba(36,28,34,.52);
  border-left:1px solid rgba(255,255,255,.35);
  backdrop-filter:blur(8px);
}
.hero-copy-right h1{
  text-align:right;
  font-size:clamp(64px,7.4vw,110px);
  line-height:.86;
}
.hero-copy-right h1 span{
  display:inline-block;
  transform:translateX(-28px);
}
.hero-copy-right .eyebrow,
.hero-copy-right .lead{
  text-align:right;
}
.hero-copy-right .actions{
  justify-content:flex-end;
}
@media(max-width:850px){
  .hero-copy-right{
    margin:0;
    width:100%;
    padding:0 6vw;
  }
  .hero-panel{
    max-width:100%;
    padding:34px 26px 38px;
  }
}
@media(max-width:560px){
  .hero-copy-right h1{
    text-align:left;
    font-size:52px;
  }
  .hero-copy-right h1 span{
    transform:none;
  }
  .hero-copy-right .eyebrow,
  .hero-copy-right .lead{
    text-align:left;
  }
  .hero-copy-right .actions{
    justify-content:flex-start;
  }
}