.elementor-87 .elementor-element.elementor-element-887a924{--display:grid;--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}@media(max-width:1024px){.elementor-87 .elementor-element.elementor-element-887a924{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-87 .elementor-element.elementor-element-887a924{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for html, class: .elementor-element-30b1702 */:root {
  --black:   #080808;
  --off:     #111111;
  --white:   #fafaf8;
  --cream:   #fdf8f3;
  --cream2:  #f8f0e8;
  --gold:    #c9a84c;
  --gold-lt: #f0d878;
  --gold-dk: #8a6520;
  --pink:    #e8b4c4;
  --pink-lt: #f7e8ef;
  --pink-dk: #c4789a;
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Cormorant Garamond', Georgia, serif;
  --font-ui:      'Montserrat', sans-serif;
}
 
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:var(--white); color:var(--black); font-family:var(--font-body); overflow-x:hidden; }
 
/* ── ANIMATIONS ── */
@keyframes shimmer {
  0%   { background-position:-200% center; }
  100% { background-position:200% center; }
}
@keyframes fadeUp   { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeIn   { from { opacity:0; } to { opacity:1; } }
@keyframes floatA   { 0%,100%{transform:translate(0,0) rotate(0deg);} 33%{transform:translate(8px,-12px) rotate(2deg);} 66%{transform:translate(-6px,8px) rotate(-1deg);} }
@keyframes floatC   { 0%,100%{transform:translate(0,0);} 40%{transform:translate(6px,10px);} 70%{transform:translate(-8px,4px);} }
@keyframes goldPulse { 0%,100%{opacity:0.5;} 50%{opacity:0.9;} }
@keyframes drawLine  { from{stroke-dashoffset:1000;} to{stroke-dashoffset:0;} }
@keyframes floatIn   { from{opacity:0;transform:translateY(40px);} to{opacity:1;transform:translateY(0);} }
 
/* ── SHARED LABELS ── */
.label {
  font-family:var(--font-ui); font-size:clamp(.85rem,1.1vw,1rem);
  font-weight:400; letter-spacing:.3em; text-transform:uppercase;
  display:flex; align-items:center; gap:14px; margin-bottom:20px;
}
.label.gold     { color:var(--gold-dk); }
.label.gold::before { content:''; width:32px; height:1px; background:var(--gold-dk); display:block; }
.label.white    { color:var(--gold); }
.label.white::before { content:''; width:32px; height:1px; background:var(--gold); display:block; }
.label.centered { justify-content:center; }
.label.centered::before { display:none; }
 
/* ── BUTTONS ── */
.btn-gold {
  display:inline-block; font-family:var(--font-ui); font-size:13px; font-weight:500;
  letter-spacing:.15em; text-transform:uppercase; color:var(--black);
  padding:16px 36px; text-decoration:none;
  background:linear-gradient(90deg,#c9a84c 0%,#f0d878 25%,#e2c05a 50%,#c9a84c 75%,#f5e090 100%);
  background-size:200% auto;
  transition:background-position .5s, transform .25s;
  box-shadow:0 0 30px rgba(201,168,76,.2), 0 2px 12px rgba(0,0,0,.15);
}
.btn-gold:hover { background-position:right center; transform:translateY(-2px); }
.btn-outline-light {
  display:inline-block; font-family:var(--font-ui); font-size:13px; font-weight:400;
  letter-spacing:.15em; text-transform:uppercase; color:rgba(255,255,255,.7);
  padding:16px 36px; text-decoration:none;
  border:1px solid rgba(255,255,255,.25);
  transition:border-color .3s, color .3s;
}
.btn-outline-light:hover { border-color:var(--gold); color:var(--gold); }
.btn-outline-dark {
  display:inline-block; font-family:var(--font-ui); font-size:13px; font-weight:400;
  letter-spacing:.15em; text-transform:uppercase; color:var(--black);
  padding:16px 36px; text-decoration:none;
  border:1px solid rgba(0,0,0,.25);
  transition:border-color .3s, color .3s;
}
.btn-outline-dark:hover { border-color:var(--gold); color:var(--gold-dk); }
 
/* ── REVEAL ── */
.reveal { opacity:0; transform:translateY(32px); transition:opacity .8s ease, transform .8s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:.12s; }
.reveal-delay-2 { transition-delay:.24s; }
.reveal-delay-3 { transition-delay:.36s; }
 
/* ── STRIP DIVIDER ── */
.strip-divider {
  height:6px;
  background:repeating-linear-gradient(90deg,var(--black) 0,var(--black) 20px,var(--gold) 20px,var(--gold) 22px);
}
 
/* ══════════════════════
   HERO
══════════════════════ */
.hero {
  min-height:62vh;
  display:grid; grid-template-columns:55% 45%;
  position:relative;
}
.hero-left {
  position:relative; background:var(--black);
  display:flex; flex-direction:column; justify-content:center;
  padding:80px 72px 80px 80px; overflow:hidden;
}
.hero-stripes {
  position:absolute; inset:0;
  background-image:repeating-linear-gradient(90deg,transparent 0,transparent 18px,rgba(255,255,255,.018) 18px,rgba(255,255,255,.018) 20px);
  animation:fadeIn 1.2s ease both;
}
.hero-left::before {
  content:''; position:absolute; top:80px; left:0;
  width:3px; height:200px;
  background:linear-gradient(to bottom,transparent,var(--gold),transparent);
  animation:goldPulse 3s ease-in-out infinite;
}
.hero-box {
  position:relative; z-index:2; padding:56px 52px;
  border:2px solid rgba(201,168,76,.7);
  background:rgba(255,255,255,.015);
  animation:fadeUp .9s ease .4s both;
}
.hero-box::before {
  content:''; position:absolute; top:9px; left:9px; right:9px; bottom:9px;
  border:1px solid rgba(201,168,76,.3); pointer-events:none;
}
.corner-floral { position:absolute; font-size:28px; color:var(--pink); opacity:.8; line-height:1; }
.corner-floral.tl { top:-14px; left:-14px; }
.corner-floral.tr { top:-14px; right:-14px; }
.corner-floral.bl { bottom:-14px; left:-14px; }
.corner-floral.br { bottom:-14px; right:-14px; }
 
.hero-eyebrow {
  font-family:var(--font-ui); font-size:13px; font-weight:400;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold);
  margin-bottom:22px; display:flex; align-items:center; gap:14px;
  animation:fadeUp .9s ease .5s both;
}
.hero-eyebrow::before { content:''; display:block; width:36px; height:1px; background:linear-gradient(90deg,var(--gold-dk),var(--gold-lt)); }
 
.hero-h1 {
  font-family:var(--font-display); font-size:clamp(36px,4vw,58px);
  font-weight:400; line-height:1.1; color:var(--white); margin-bottom:10px;
  animation:fadeUp .9s ease .6s both;
}
.hero-h1 em {
  font-style:italic;
  background:linear-gradient(90deg,#8a6520 0%,#c9a84c 15%,#f5e090 30%,#e2c05a 45%,#c9a84c 55%,#f0d878 70%,#c9a84c 85%,#8a6520 100%);
  background-size:200% auto;
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  animation:shimmer 3s linear infinite, fadeUp .9s ease .6s both;
  animation-fill-mode:both; display:inline-block;
}
.hero-divider {
  width:60px; height:1px;
  background:linear-gradient(90deg,var(--gold-dk),var(--gold-lt),var(--gold-dk));
  margin-bottom:28px; animation:fadeUp .9s ease .65s both;
}
.hero-sub {
  font-family:var(--font-body); font-size:20px; font-weight:300; font-style:italic;
  color:rgba(255,255,255,.82); line-height:1.85; margin-bottom:36px; max-width:420px;
  animation:fadeUp .9s ease .7s both;
}
.hero-actions {
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  animation:fadeUp .9s ease .8s both;
}
 
/* hero right — sign photo */
.hero-right {
  position:relative; overflow:hidden; background:#0a0a0a;
}
.hero-photo {
  position:absolute; inset:0;
  background:url('https://michelessalonandspanm.com/wp-content/uploads/2026/06/download-1-scaled.webp') center/cover no-repeat;
  filter:brightness(.55) contrast(1.05);
  transform:scale(1.04); transition:transform 8s ease;
}
.hero-right:hover .hero-photo { transform:scale(1.08); }
.hero-photo-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to right,rgba(8,8,8,.65) 0%,rgba(8,8,8,.1) 40%,transparent 100%),
             linear-gradient(to top,rgba(8,8,8,.75) 0%,transparent 50%);
}
.floral-overlay { position:absolute; pointer-events:none; user-select:none; }
.floral-br { bottom:-10px; right:-10px; width:300px; opacity:.75; animation:floatC 12s ease-in-out infinite; mix-blend-mode:multiply; }
.floral-tl { top:-10px; left:-10px; width:220px; opacity:.35; animation:floatA 14s ease-in-out infinite; animation-delay:-4s; mix-blend-mode:multiply; transform:rotate(180deg); }
.gold-frame { position:absolute; top:32px; right:32px; width:180px; height:240px; pointer-events:none; }
.gold-frame rect { stroke:var(--gold); stroke-width:1; fill:none; stroke-dasharray:840; stroke-dashoffset:840; animation:drawLine 2.5s cubic-bezier(.4,0,.2,1) .8s forwards; opacity:.5; }
.gold-frame-inner rect { stroke-dasharray:760; stroke-dashoffset:760; animation:drawLine 2.5s cubic-bezier(.4,0,.2,1) 1.2s forwards; opacity:.25; }
 
/* info card overlaid on photo */
.hero-photo-card {
  position:absolute; bottom:48px; left:-1px; right:48px;
  border-left:4px solid var(--gold); padding:28px 32px;
  background:rgba(8,8,8,.82); backdrop-filter:blur(16px);
  animation:fadeUp 1s ease 1.2s both;
}
.hero-photo-card-hours {
  font-family:var(--font-ui); font-size:11px; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold);
  margin-bottom:14px;
}
.hours-row {
  display:flex; justify-content:space-between; align-items:baseline;
  padding:7px 0; border-bottom:1px solid rgba(255,255,255,.05);
}
.hours-row:last-child { border-bottom:none; }
.hours-day {
  font-family:var(--font-ui); font-size:13px; font-weight:400;
  letter-spacing:.08em; color:rgba(255,255,255,.7);
}
.hours-time {
  font-family:var(--font-ui); font-size:14px; font-weight:300;
  color:rgba(255,255,255,.92);
}
.hours-time.closed { color:var(--pink); font-size:13px; font-weight:400; }
 
/* ══════════════════════
   WELCOME — full bleed split
══════════════════════ */
.welcome {
  display:grid; grid-template-columns:1fr 1fr; min-height:640px;
}
.welcome-photo {
  position:relative; overflow:hidden;
}
.welcome-photo img {
  width:100%; height:100%; object-fit:cover; object-position:center;
  display:block; filter:brightness(.88);
  transition:transform .8s ease;
}
.welcome-photo:hover img { transform:scale(1.04); }
.welcome-photo-floral {
  position:absolute; bottom:0px; left:-20px;
  width:280px; opacity:.5; pointer-events:none;
  animation:floatC 10s ease-in-out infinite; mix-blend-mode:multiply;
}
.welcome-content {
  background:var(--cream); padding:100px 80px;
  display:flex; flex-direction:column; justify-content:center;
  position:relative; overflow:hidden;
}
.welcome-content::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.welcome-content::after {
  content:''; position:absolute; top:0; right:0; bottom:0; width:4px;
  background:linear-gradient(to bottom,transparent,var(--gold),transparent);
}
.welcome-floral {
  position:absolute; top:-30px; right:-30px; width:260px;
  opacity:.3; pointer-events:none; mix-blend-mode:multiply;
}
.welcome-content h2 {
  font-family:var(--font-display); font-size:clamp(30px,3vw,48px);
  font-weight:400; line-height:1.2; color:var(--black); margin-bottom:24px;
}
.welcome-content h2 em { font-style:italic; color:var(--pink-dk); }
.welcome-content p {
  font-family:var(--font-body); font-size:21px; font-weight:300;
  line-height:1.9; color:#222; margin-bottom:18px; font-style:italic;
}
.welcome-content p:last-of-type { margin-bottom:40px; }
 
/* ══════════════════════
   CONTACT INFO BAND
══════════════════════ */
.info-band {
  background:var(--cream2);
  padding:100px 80px;
  position:relative; overflow:hidden;
}
.info-band::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.info-band-floral-tr {
  position:absolute; top:-40px; right:-40px; width:380px;
  opacity:.12; pointer-events:none; animation:floatA 11s ease-in-out infinite;
}
.info-band-floral-bl {
  position:absolute; bottom:-60px; left:-50px; width:300px;
  opacity:.09; pointer-events:none; animation:floatC 13s ease-in-out infinite;
  transform:rotate(180deg);
}
.info-band-inner {
  max-width:1200px; margin:0 auto; position:relative; z-index:1;
}
.info-band-header {
  text-align:center; margin-bottom:72px;
}
.info-band-header h2 {
  font-family:var(--font-display); font-size:clamp(28px,3.5vw,46px);
  font-weight:400; line-height:1.2; margin-top:8px;
}
.info-band-header h2 em { font-style:italic; color:var(--pink-dk); }
 
/* three info cards */
.info-cards {
  display:grid; grid-template-columns:repeat(3,1fr); gap:2px;
  background:rgba(0,0,0,.06);
}
.info-card {
  background:var(--cream); padding:56px 48px;
  position:relative; overflow:hidden;
  transition:background .3s;
}
.info-card:hover { background:var(--white); }
.info-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--pink-dk),var(--gold));
  transform:scaleX(0); transform-origin:left;
  transition:transform .4s cubic-bezier(.4,0,.2,1);
}
.info-card:hover::after { transform:scaleX(1); }
/* corner ✿ */
.info-card-floral {
  position:absolute; top:-10px; right:-10px;
  font-size:56px; color:var(--pink); opacity:.15; line-height:1;
  font-family:var(--font-ui); pointer-events:none;
  transition:opacity .3s;
}
.info-card:hover .info-card-floral { opacity:.28; }
.info-card-label {
  font-family:var(--font-ui); font-size:11px; font-weight:500;
  letter-spacing:.25em; text-transform:uppercase;
  color:var(--gold-dk); margin-bottom:20px;
  padding-bottom:14px; border-bottom:1px solid rgba(0,0,0,.07);
}
.info-card-title {
  font-family:var(--font-display); font-size:clamp(22px,2.5vw,32px);
  font-weight:400; color:var(--black); margin-bottom:20px; line-height:1.15;
}
.info-card-title em { font-style:italic; color:var(--pink-dk); }
.info-card-body {
  font-family:var(--font-body); font-size:20px; font-weight:300;
  color:#333; line-height:1.85; font-style:italic;
}
.info-card-body a {
  color:var(--black); text-decoration:none; display:block;
  transition:color .2s;
}
.info-card-body a:hover { color:var(--gold-dk); }
.info-card-hours-row {
  display:flex; justify-content:space-between; align-items:baseline;
  padding:.5rem 0; border-bottom:1px solid rgba(0,0,0,.05);
  font-style:normal;
}
.info-card-hours-row:last-child { border-bottom:none; }
.info-card-hours-day {
  font-family:var(--font-ui); font-size:12px; font-weight:400;
  letter-spacing:.08em; color:#777;
}
.info-card-hours-time {
  font-family:var(--font-ui); font-size:13px; font-weight:300; color:#222;
}
.info-card-hours-time.closed { color:var(--pink-dk); font-weight:400; }
 
/* ══════════════════════
   REVIEWS
══════════════════════ */
.reviews {
  background:var(--cream); padding:120px 80px;
  position:relative; overflow:hidden;
}
.reviews::before {
  content:''; position:absolute; top:-40px; right:-40px;
  width:500px; height:500px; pointer-events:none;
  background:url('https://michelessalonandspanm.com/wp-content/uploads/2026/06/5-1.png') center/contain no-repeat;
  opacity:.13;
}
.reviews::after {
  content:''; position:absolute; bottom:-60px; left:-60px;
  width:380px; height:380px; pointer-events:none;
  background:url('https://michelessalonandspanm.com/wp-content/uploads/2026/06/5-1.png') center/contain no-repeat;
  opacity:.09; transform:rotate(180deg);
}
.reviews-header { text-align:center; margin-bottom:72px; }
.reviews-header h2 {
  font-family:var(--font-display); font-size:clamp(28px,3vw,44px);
  font-weight:400; line-height:1.2; margin-top:8px;
}
.reviews-header h2 em { font-style:italic; color:var(--pink-dk); }
.reviews-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:36px;
  max-width:1260px; margin:0 auto;
  position:relative; z-index:1;
}
.review-card {
  padding:56px 48px; border:1px solid #e8e0d8;
  border-top:3px solid var(--gold); position:relative;
  background:var(--white); overflow:hidden; opacity:0;
  transition:border-color .3s, box-shadow .3s, transform .3s;
}
.review-card.float-in { animation:floatIn .75s ease forwards; }
.review-card.float-in:nth-child(2) { animation-delay:.15s; }
.review-card.float-in:nth-child(3) { animation-delay:.3s; }
.review-card::before {
  content:'\201C'; position:absolute; top:16px; left:28px;
  font-family:var(--font-display); font-size:160px; color:var(--pink);
  line-height:1; opacity:.35;
}
.review-card:hover { border-color:var(--pink); box-shadow:0 20px 70px rgba(232,180,196,.2); transform:translateY(-6px); }
.review-stars { display:flex; gap:6px; margin-bottom:24px; }
.star { color:var(--gold); font-size:22px; }
.review-text {
  font-family:var(--font-body); font-size:clamp(1.1rem,1.4vw,1.4rem);
  font-style:italic; line-height:1.85; color:#1a1a1a;
  position:relative; z-index:1; margin-bottom:32px;
}
.review-author { display:flex; align-items:center; gap:16px; }
.review-avatar {
  width:50px; height:50px; background:var(--pink-lt); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:20px; color:var(--pink-dk); font-weight:500;
}
.review-name { font-family:var(--font-ui); font-size:.9rem; font-weight:600; letter-spacing:.08em; color:var(--black); }
.review-source { font-family:var(--font-ui); font-size:.78rem; letter-spacing:.1em; color:#888; text-transform:uppercase; }
 
/* ══════════════════════
   MAP SECTION
══════════════════════ */
.map-section {
  display:grid; grid-template-columns:1fr 1fr; min-height:520px;
}
.map-content {
  background:var(--black); padding:80px;
  display:flex; flex-direction:column; justify-content:center;
  position:relative; overflow:hidden;
}
.map-content::before {
  content:''; position:absolute; top:0; right:0; bottom:0; width:3px;
  background:linear-gradient(to bottom,transparent,var(--gold),transparent);
}
.map-floral-l {
  position:absolute; bottom:-40px; left:-40px; width:280px;
  opacity:.12; pointer-events:none; mix-blend-mode:screen;
  animation:floatC 12s ease-in-out infinite;
}
.map-content h2 {
  font-family:var(--font-display); font-size:clamp(28px,3vw,44px);
  font-weight:400; color:var(--white); line-height:1.2; margin-bottom:20px;
}
.map-content h2 em { font-style:italic; color:var(--pink); }
.map-details {
  margin-bottom:40px; display:flex; flex-direction:column; gap:18px;
}
.map-detail {
  display:flex; align-items:flex-start; gap:14px;
  font-family:var(--font-body); font-size:21px;
  color:rgba(255,255,255,.75); font-weight:300; font-style:italic;
}
.map-detail-icon { color:var(--pink-dk); font-size:14px; flex-shrink:0; margin-top:5px; }
 
.map-embed {
  position:relative; overflow:hidden;
}
.map-embed iframe {
  width:100%; height:100%; display:block; min-height:400px;
  filter:sepia(15%) contrast(1.05);
}
/* decorative gold line on left edge of map */
.map-embed::before {
  content:''; position:absolute; top:0; left:0; bottom:0; width:3px;
  background:linear-gradient(to bottom,transparent,var(--gold),transparent);
  z-index:1;
}
 
/* ══════════════════════
   RESPONSIVE
══════════════════════ */
@media(max-width:1100px){
  .hero { grid-template-columns:1fr; }
  .hero-right { height:360px; }
  .hero-left { padding:60px 40px; }
  .welcome { grid-template-columns:1fr; }
  .welcome-photo { height:380px; }
  .welcome-content { padding:60px 40px; }
  .info-band { padding:80px 40px; }
  .info-cards { grid-template-columns:1fr; }
  .reviews { padding:80px 40px; }
  .reviews-grid { grid-template-columns:1fr 1fr; }
  .map-section { grid-template-columns:1fr; }
  .map-content { padding:60px 40px; }
  .map-embed iframe { min-height:340px; }
}
@media(max-width:700px){
  .hero-left { padding:48px 24px; }
  .hero-box { padding:36px 24px; }
  .welcome-content { padding:48px 24px; }
  .info-band { padding:60px 24px; }
  .info-card { padding:40px 28px; }
  .reviews { padding:60px 24px; }
  .reviews-grid { grid-template-columns:1fr; }
  .map-content { padding:48px 24px; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-887a924 */:root {
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Cormorant Garamond', Georgia, serif;
  --font-ui:      'Montserrat', sans-serif;
  --black:    #080808;
  --white:    #fdf8f3;
  --cream:    #fafaf8;
  --gold:     #b8964e;
  --gold-lt:  #d4b07a;
  --pink:     #e8b4c4;
  --pink-lt:  #fce8ef;
  --pink-dk:  #c47a96;
  --taupe:    #b5a99a;
  --dark:     #1a1410;
}
 
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--cream);
  color: var(--black);
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
 
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes lineGrow {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
 
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.85s ease, transform 0.85s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
 
/* ── SHARED ── */
.label {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: clamp(0.58rem, 1.1vw, 0.7rem);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1rem;
}
.label::before {
  content: '';
  display: inline-block;
  width: 2rem;
  height: 1px;
  background: var(--gold);
  vertical-align: middle;
  margin-right: 0.75rem;
  transform-origin: left;
  animation: lineGrow 0.6s ease forwards;
}
.btn {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 1rem 2.2rem;
  border: 1px solid currentColor;
  transition: background 0.3s, color 0.3s, border-color 0.3s;
  cursor: pointer;
}
.btn-dark  { background: var(--dark); color: var(--white); border-color: var(--dark); }
.btn-dark:hover  { background: var(--gold); border-color: var(--gold); }
.btn-gold  { background: var(--gold); color: var(--white); border-color: var(--gold); }
.btn-gold:hover  { background: #e8b4c4; border-color: var(--dark); color: black!important;}
.btn-ghost { background: transparent; color: var(--white); border-color: rgba(253,248,243,0.4); }
.btn-ghost:hover { background: rgba(253,248,243,0.1); border-color: var(--white); }
 


/* ══ HERO ══ */
.contact-hero {
  min-height: 95vh;
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
 
/* sign photo — fills the whole hero */
.hero-sign {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
 
/* dark overlay on top of sign */
.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    160deg,
    rgba(8,8,8,0.72) 0%,
    rgba(26,20,16,0.55) 40%,
    rgba(8,8,8,0.85) 100%
  );
}
 
/* subtle gold vignette at bottom */
.hero-overlay::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 45%;
  background: linear-gradient(to top, rgba(8,8,8,0.9) 0%, transparent 100%);
}
 
.contact-hero-content {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  padding: 0 3rem 5rem;
  animation: fadeUp 1.1s ease forwards;
}
.contact-hero .label { color: var(--gold-lt); }
.contact-hero .label::before { background: var(--gold-lt); }
.contact-hero h1 {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 8vw, 7rem);
  font-weight: 300;
  color: var(--white);
  line-height: 1.0;
  margin-bottom: 1.5rem;
  letter-spacing: -0.01em;
}
.contact-hero h1 em { font-style: italic; color: var(--pink); }
.contact-hero-sub {
  font-family: var(--font-ui);
  font-size: clamp(0.62rem, 1.1vw, 0.72rem);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(253,248,243,0.55);
  margin-bottom: 2.5rem;
}
.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
 
/* ══ WELCOME BANNER — full width ══ */
.welcome {
  background: var(--dark);
  position: relative;
  overflow: hidden;
}
.welcome::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--gold), transparent);
}
.welcome::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(184,150,78,0.3), transparent);
}
.welcome-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 560px;
}
.welcome-photo {
  position: relative;
  overflow: hidden;
}
.welcome-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 8s ease;
}
.welcome-photo:hover img { transform: scale(1.04); }
.welcome-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 60%, var(--dark) 100%);
}
.welcome-text {
  padding: 5rem 4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.welcome-text .label { color: var(--gold-lt); }
.welcome-text .label::before { background: var(--gold-lt); }
.welcome-text h2 {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 4vw, 3.5rem);
  font-weight: 300;
  color: var(--white);
  line-height: 1.1;
  margin-bottom: 1.5rem;
}
.welcome-text h2 em { font-style: italic; color: var(--pink); }
.welcome-text p {
  color: rgba(253,248,243,0.65);
  font-size: clamp(1rem, 1.7vw, 1.15rem);
  line-height: 1.8;
  margin-bottom: 1.2rem;
}
.welcome-text p:last-of-type { margin-bottom: 2.5rem; }
 
/* ══ CONTACT INFO — horizontal strip ══ */
.contact-strip {
  background: var(--cream);
  padding: 5rem 3rem;
}
.contact-strip-inner {
  max-width: 1200px;
  margin: 0 auto;
}
.contact-strip-header {
  text-align: center;
  margin-bottom: 4rem;
}
.contact-strip-header h2 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 300;
  line-height: 1.15;
}
.contact-strip-header h2 em { font-style: italic; color: var(--gold); }
 
.info-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid rgba(0,0,0,0.08);
}
.info-card {
  padding: 2.8rem 2rem;
  text-align: center;
  border-right: 1px solid rgba(0,0,0,0.08);
  transition: background 0.3s;
}
.info-card:last-child { border-right: none; }
.info-card:hover { background: var(--white); }
.info-card-icon {
  font-size: 1.6rem;
  margin-bottom: 1.2rem;
  display: block;
}
.info-card h3 {
  font-family: var(--font-ui);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--taupe);
  margin-bottom: 0.75rem;
}
.info-card p,
.info-card a {
  font-size: clamp(0.95rem, 1.6vw, 1.1rem);
  color: var(--dark);
  text-decoration: none;
  line-height: 1.65;
  display: block;
}
.info-card a:hover { color: var(--gold); }
.info-card .hours-note {
  font-family: var(--font-ui);
  font-size: 0.58rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--taupe);
  margin-top: 0.5rem;
}
 
/* ══ TESTIMONIALS ══ */
.testimonials {
  background: var(--white);
  padding: 6rem 3rem;
  position: relative;
  overflow: hidden;
}
.testimonials::before {
  content: '';
  position: absolute;
  top: -80px; right: -60px;
  width: 420px; height: 420px;
  background: url('https://michelessalonandspanm.com/wp-content/uploads/2026/06/5-1.png') center/contain no-repeat;
  opacity: 0.04;
  pointer-events: none;
}
.testimonials-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.testimonials-header {
  text-align: center;
  margin-bottom: 4rem;
}
.testimonials-header h2 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 300;
  line-height: 1.15;
}
.testimonials-header h2 em { font-style: italic; color: var(--gold); }
.testimonials-header p {
  color: var(--taupe);
  font-size: 1.05rem;
  margin-top: 0.75rem;
}
 
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
.review-card {
  background: var(--cream);
  padding: 2.5rem 2rem;
  position: relative;
  border-bottom: 2px solid transparent;
  transition: border-color 0.3s, transform 0.3s;
}
.review-card:hover {
  border-bottom-color: var(--gold);
  transform: translateY(-4px);
}
.review-quote {
  font-family: var(--font-display);
  font-size: 4rem;
  color: var(--gold);
  opacity: 0.25;
  line-height: 1;
  margin-bottom: -1rem;
  font-style: italic;
}
.review-text {
  font-family: var(--font-body);
  font-size: clamp(1.05rem, 1.7vw, 1.2rem);
  font-style: italic;
  line-height: 1.75;
  color: var(--dark);
  margin-bottom: 1.8rem;
}
.review-stars {
  color: var(--gold);
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  margin-bottom: 1rem;
}
.review-footer {
  display: flex;
  align-items: center;
  gap: 0.9rem;
}
.review-avatar {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--pink-lt);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 1rem;
  color: var(--pink-dk);
  flex-shrink: 0;
}
.review-name {
  font-family: var(--font-ui);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--dark);
}
.review-source {
  font-family: var(--font-ui);
  font-size: 0.58rem;
  letter-spacing: 0.1em;
  color: var(--taupe);
  margin-top: 0.15rem;
}
 
/* ══ MAP ══ */
.map-section {
  background: var(--dark);
  position: relative;
  overflow: hidden;
}
.map-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--gold), transparent);
}
.map-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 4.5rem 3rem;
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 4rem;
  align-items: center;
}
.map-text .label { color: var(--gold-lt); }
.map-text .label::before { background: var(--gold-lt); }
.map-text h2 {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 300;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 1.2rem;
}
.map-text h2 em { font-style: italic; color: var(--pink); }
.map-text p {
  color: rgba(253,248,243,0.6);
  font-size: 1.05rem;
  line-height: 1.8;
  margin-bottom: 2rem;
}
.map-embed { overflow: hidden; border: 1px solid rgba(255,255,255,0.08); }
.map-embed iframe { width: 100%; height: 370px; display: block; filter: grayscale(20%); }
 
/* ══ FOOTER ══ */
.footer { background: var(--black); padding: 4rem 3rem 2rem; text-align: center; }
.footer-logo { font-family: var(--font-display); font-size: 2rem; font-style: italic; color: var(--white); margin-bottom: 0.5rem; }
.footer-logo em { color: var(--gold); font-style: normal; }
.footer-tagline { font-family: var(--font-ui); font-size: 0.6rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--taupe); margin-bottom: 2.5rem; }
.footer-nav { display: flex; justify-content: center; gap: 2.5rem; flex-wrap: wrap; margin-bottom: 2.5rem; }
.footer-nav a { font-family: var(--font-ui); font-size: 0.62rem; letter-spacing: 0.15em; text-transform: uppercase; color: rgba(253,248,243,0.5); text-decoration: none; transition: color 0.2s; }
.footer-nav a:hover { color: var(--gold); }
.footer-divider { width: 3rem; height: 1px; background: rgba(255,255,255,0.1); margin: 0 auto 2rem; }
.footer-copy { font-family: var(--font-ui); font-size: 0.6rem; letter-spacing: 0.1em; color: rgba(253,248,243,0.3); }
 
/* ══ RESPONSIVE ══ */
@media (max-width: 1000px) {
  .welcome-inner { grid-template-columns: 1fr; }
  .welcome-photo { height: 320px; }
  .welcome-photo::after { background: linear-gradient(to top, var(--dark) 0%, transparent 60%); }
  .welcome-text { padding: 3rem 2rem 4rem; }
  .info-grid { grid-template-columns: 1fr 1fr; }
  .info-card:nth-child(2) { border-right: none; }
  .info-card:nth-child(3) { border-top: 1px solid rgba(0,0,0,0.08); }
  .reviews-grid { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; }
  .map-inner { grid-template-columns: 1fr; gap: 2.5rem; padding: 3rem 2rem; }
}
@media (max-width: 700px) {
  .nav { padding: 1.2rem 1.5rem; }
  .nav-links, .nav-book { display: none; }
  .nav-logo { color: var(--dark); }
  .nav { background: rgba(250,250,248,0.97); }
  .contact-hero { min-height: 80vh; }
  .contact-hero-content { padding: 0 1.5rem 3.5rem; }
  .contact-strip { padding: 4rem 1.5rem; }
  .info-grid { grid-template-columns: 1fr; }
  .info-card { border-right: none; border-bottom: 1px solid rgba(0,0,0,0.08); }
  .info-card:last-child { border-bottom: none; }
  .testimonials { padding: 4rem 1.5rem; }
  .footer { padding: 3rem 1.5rem 2rem; }
}/* End custom CSS */