/* Lavinia Cakes'n Buttons — stylesheet
   Fonts: Fraunces (display), Newsreader (body), Archivo (labels) */

@font-face { font-family:'Fraunces'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/fraunces-400-latinext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fraunces'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/fraunces-400-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fraunces'; font-style:normal; font-weight:600; font-display:swap; src:url('fonts/fraunces-600-latinext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fraunces'; font-style:normal; font-weight:600; font-display:swap; src:url('fonts/fraunces-600-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fraunces'; font-style:italic; font-weight:500; font-display:swap; src:url('fonts/fraunces-500i-latinext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fraunces'; font-style:italic; font-weight:500; font-display:swap; src:url('fonts/fraunces-500i-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Newsreader'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/newsreader-400-latinext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Newsreader'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/newsreader-400-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Newsreader'; font-style:normal; font-weight:500; font-display:swap; src:url('fonts/newsreader-500-latinext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Newsreader'; font-style:normal; font-weight:500; font-display:swap; src:url('fonts/newsreader-500-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Newsreader'; font-style:italic; font-weight:400; font-display:swap; src:url('fonts/newsreader-400i-latinext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Newsreader'; font-style:italic; font-weight:400; font-display:swap; src:url('fonts/newsreader-400i-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:600; font-display:swap; src:url('fonts/archivo-600-latinext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:600; font-display:swap; src:url('fonts/archivo-600-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root{
  --bg:#faf4e7;
  --bg-panel:#f1e7d2;
  --card:#fffbf2;
  --ink:#26201a;
  --ink-soft:#6b5f4f;
  --petrol:#173247;
  --petrol-deep:#0f2333;
  --petrol-2:#3d7593;
  --gold:#b6884f;
  --gold-soft:#dfc9a0;
  --rose:#93404a;
  --line:rgba(38,32,26,.14);
  --line-on-dark:rgba(241,230,211,.18);
  --shadow:0 30px 60px -32px rgba(23,50,71,.35);
}

@media (prefers-color-scheme: dark){
  :root{
    --bg:#171310;
    --bg-panel:#1f1a13;
    --card:#241d15;
    --ink:#f1e6d3;
    --ink-soft:#c2b39b;
    --petrol-2:#5a9ab8;
    --gold:#d9ac6c;
    --gold-soft:#8a6a3f;
    --rose:#cf8a92;
    --line:rgba(241,230,211,.16);
    --shadow:0 30px 60px -28px rgba(0,0,0,.55);
  }
}
:root[data-theme="dark"]{
  --bg:#171310; --bg-panel:#1f1a13; --card:#241d15; --ink:#f1e6d3; --ink-soft:#c2b39b;
  --petrol-2:#5a9ab8; --gold:#d9ac6c; --gold-soft:#8a6a3f; --rose:#cf8a92;
  --line:rgba(241,230,211,.16); --shadow:0 30px 60px -28px rgba(0,0,0,.55);
}
:root[data-theme="light"]{
  --bg:#faf4e7; --bg-panel:#f1e7d2; --card:#fffbf2; --ink:#26201a; --ink-soft:#6b5f4f;
  --petrol-2:#3d7593; --gold:#b6884f; --gold-soft:#dfc9a0; --rose:#93404a;
  --line:rgba(38,32,26,.14); --shadow:0 30px 60px -32px rgba(23,50,71,.35);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'Newsreader', Georgia, serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  transition:background .3s ease, color .3s ease;
}
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ animation-duration:.01ms !important; transition-duration:.01ms !important; } }

img{ max-width:100%; display:block; }
a{ color:inherit; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

.wrap{ max-width:1180px; margin-inline:auto; padding-inline:clamp(1.25rem,4vw,3rem); }

h1,h2,h3{ font-family:'Fraunces','Newsreader',serif; font-weight:600; text-wrap:balance; margin:0; color:var(--ink); }
p{ margin:0; }

.eyebrow{
  font-family:'Archivo',sans-serif; font-weight:600; font-size:.76rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gold);
  display:inline-flex; align-items:center; gap:.6em;
}
.eyebrow::before{ content:""; width:1.4em; height:1px; background:var(--gold); display:inline-block; }

/* ---------- topbar ---------- */
.topbar{
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-block:.9rem; }
.brand{ font-family:'Fraunces',serif; font-weight:600; font-size:clamp(1rem,3.6vw,1.15rem); letter-spacing:.01em; text-decoration:none; }
.brand span{ color:var(--gold); }
nav.primary{ display:flex; align-items:center; gap:1.6rem; }
nav.primary a{ font-family:'Archivo',sans-serif; font-size:.82rem; font-weight:600; letter-spacing:.04em; text-decoration:none; color:var(--ink-soft); }
nav.primary a:hover{ color:var(--gold); }

/* mobile nav toggle + drawer */
.navToggle{
  display:none; align-items:center; justify-content:center;
  width:2.6rem; height:2.6rem; flex:none; padding:0;
  border:1px solid var(--line); border-radius:2px; background:transparent; color:var(--ink); cursor:pointer;
}
.navToggle svg{ width:1.25rem; height:1.25rem; }
#mobileNav{
  display:none; flex-direction:column;
  position:absolute; top:100%; left:0; right:0;
  background:var(--bg); border-bottom:1px solid var(--line); box-shadow:var(--shadow);
  padding:.4rem clamp(1.25rem,4vw,3rem) 1.5rem;
}
#mobileNav.open{ display:flex; }
#mobileNav a{
  font-family:'Archivo',sans-serif; font-weight:600; font-size:.95rem; letter-spacing:.02em;
  text-decoration:none; color:var(--ink); padding:.9rem .1rem; border-bottom:1px solid var(--line);
}
#mobileNav .btn{ margin-top:1.1rem; justify-content:center; }
@media (min-width: 901px){ #mobileNav{ display:none !important; } }
.btn{
  font-family:'Archivo',sans-serif; font-weight:600; font-size:.82rem; letter-spacing:.03em;
  padding:.75rem 1.4rem; border-radius:2px; text-decoration:none; display:inline-flex; align-items:center; gap:.5rem;
  border:1px solid transparent; cursor:pointer;
}
.btn-gold{ background:var(--gold); color:#fffaf0; }
.btn-gold:hover{ background:var(--rose); }
.btn-line{ border-color:currentColor; color:var(--ink); background:transparent; }
.btn-line:hover{ border-color:var(--gold); color:var(--gold); }
.btn-line-invert{ border-color:var(--gold-soft); color:var(--gold-soft); background:transparent; }
.btn-line-invert:hover{ border-color:#fff; color:#fff; }

.lang-switch{ display:flex; align-items:center; gap:.35rem; font-family:'Archivo',sans-serif; font-weight:600; font-size:.76rem; letter-spacing:.04em; }
.lang-switch button{
  background:none; border:1px solid transparent; cursor:pointer; padding:.35rem .5rem; border-radius:2px;
  color:var(--ink-soft); font:inherit; letter-spacing:inherit;
}
.lang-switch button.active{ color:var(--ink); border-color:var(--line); }
.lang-switch button:hover{ color:var(--gold); }
.lang-switch .sep{ color:var(--line); }
.cta-band .lang-switch button{ color:#cdbf9e; }
.cta-band .lang-switch button.active{ color:#fbf3e2; border-color:var(--line-on-dark); }
#mobileNav .lang-switch{ padding:.9rem .1rem; }

/* ---------- hero ---------- */
.hero{
  position:relative; color:#f4ecdc; overflow:hidden;
  background:linear-gradient(180deg, rgba(15,35,51,.55), rgba(15,35,51,.86) 55%, var(--petrol-deep) 100%), var(--petrol);
}
.hero-bg{ position:absolute; inset:0; background-image:url('images/salon-interior.jpg'); background-size:cover; background-position:center 30%; opacity:.55; }
.hero .wrap{ position:relative; padding-block:clamp(5rem,14vw,8.5rem) clamp(4rem,10vw,6rem); }
.hero-frame{ max-width:640px; }
.hero-frame .eyebrow{ color:var(--gold-soft); }
.hero-frame .eyebrow::before{ background:var(--gold-soft); }
.hero h1{ color:#fbf3e2; font-size:clamp(2.7rem,3.4vw + 1.6rem,4.4rem); line-height:1.04; margin-top:.9rem; }
.hero .lede{ font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:clamp(1.1rem,1.1vw + .85rem,1.35rem); color:#e8dcc0; margin-top:1.3rem; max-width:34em; }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.4rem; }
.hero-meta{ margin-top:3.2rem; display:flex; flex-wrap:wrap; gap:2.2rem; font-family:'Archivo',sans-serif; font-size:.78rem; letter-spacing:.03em; color:#cdbf9e; }
.hero-meta strong{ display:block; font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:1rem; color:#f4ecdc; letter-spacing:0; }

/* ---------- section shells ---------- */
section{ padding-block:clamp(4.5rem,9vw,7rem); scroll-margin-top:5.5rem; }
.panel{ background:var(--bg-panel); }
.section-head{ max-width:640px; margin-bottom:clamp(2.2rem,5vw,3.2rem); }
.section-head h2{ font-size:clamp(1.9rem,1.6vw + 1.4rem,2.7rem); margin-top:.7rem; }
.section-head .sub{ margin-top:.9rem; color:var(--ink-soft); font-size:1.05rem; }

/* ---------- story ---------- */
.story-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2.5rem,5vw,5rem); align-items:center; }
.story-copy p + p{ margin-top:1.1rem; }
.story-copy{ color:var(--ink); font-size:1.08rem; }
blockquote.pull{
  margin:1.8rem 0 0; padding-left:1.3rem; border-left:2px solid var(--gold);
  font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:1.25rem; color:var(--petrol-2);
}
blockquote.pull cite{ display:block; margin-top:.6rem; font-family:'Archivo',sans-serif; font-style:normal; font-size:.78rem; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-soft); }
.story-media{ position:relative; }
.story-media img{ border-radius:2px; box-shadow:var(--shadow); }
.story-media .cap{ margin-top:.85rem; font-family:'Archivo',sans-serif; font-size:.76rem; letter-spacing:.03em; color:var(--ink-soft); }

/* ---------- offerings ---------- */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.card{
  background:var(--card); border:1px solid var(--line); border-radius:2px;
  padding:2.1rem 1.9rem; display:flex; flex-direction:column; gap:1rem;
}
.card .icon{ width:2.4rem; height:2.4rem; color:var(--gold); }
.card h3{ font-size:1.25rem; }
.card p{ color:var(--ink-soft); font-size:.98rem; }

/* ---------- gallery ---------- */
.gallery-grid{
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:12vw; gap:.6rem;
}
.gallery-grid figure{ margin:0; overflow:hidden; border-radius:2px; position:relative; }
.gallery-grid img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.gallery-grid figure:hover img{ transform:scale(1.05); }
.g-tall{ grid-row:span 2; }
.g-wide{ grid-column:span 2; }

/* ---------- reviews ---------- */
.rating{ display:flex; align-items:baseline; gap:.7rem; margin-bottom:2.2rem; }
.rating .num{ font-family:'Fraunces',serif; font-weight:600; font-size:2.6rem; color:var(--petrol-2); }
.rating .stars{ font-family:'Archivo',sans-serif; font-size:.85rem; letter-spacing:.03em; color:var(--ink-soft); }
.quote-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.quote{ background:var(--card); border:1px solid var(--line); padding:1.9rem; border-radius:2px; }
.quote p{ font-family:'Fraunces',serif; font-style:italic; font-size:1.1rem; color:var(--ink); }
.quote cite{ display:block; margin-top:1rem; font-family:'Archivo',sans-serif; font-style:normal; font-size:.75rem; letter-spacing:.04em; text-transform:uppercase; color:var(--gold); }

/* ---------- visit ---------- */
.visit-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2.5rem,5vw,5rem); }
table.hours{ width:100%; border-collapse:collapse; margin-top:1.4rem; }
table.hours td{ padding:.55rem 0; border-bottom:1px solid var(--line); font-size:1rem; }
table.hours td:first-child{ font-family:'Archivo',sans-serif; font-weight:600; font-size:.8rem; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-soft); }
table.hours td:last-child{ text-align:right; font-variant-numeric:tabular-nums; }
.note{ margin-top:1.2rem; font-size:.92rem; color:var(--ink-soft); font-style:italic; }
.addr{ margin-top:1.6rem; }
.addr strong{ display:block; font-family:'Fraunces',serif; font-size:1.15rem; font-weight:600; }
.map-frame{ border:1px solid var(--line); border-radius:2px; overflow:hidden; margin-top:1.6rem; box-shadow:var(--shadow); }
.map-frame iframe{ width:100%; height:280px; border:0; display:block; filter:saturate(.9); }

/* ---------- contact / cta band ---------- */
.cta-band{
  background:linear-gradient(155deg, var(--petrol-deep), var(--petrol) 65%);
  color:#f4ecdc; text-align:center;
}
.cta-band .wrap{ display:flex; flex-direction:column; align-items:center; gap:1.3rem; }
.cta-band h2{ color:#fbf3e2; font-size:clamp(1.9rem,1.6vw + 1.4rem,2.6rem); max-width:20em; }
.cta-band .sub{ color:#cdbf9e; max-width:34em; }
.contact-links{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.3rem 1.2rem; margin-top:.6rem; font-family:'Archivo',sans-serif; font-size:.85rem; letter-spacing:.02em; }
.contact-links a{ text-decoration:none; color:#e8dcc0; border-bottom:1px solid var(--gold-soft); padding:.85rem .2rem; line-height:1; }
.contact-links a:hover{ color:#fff; border-color:#fff; }

/* ---------- footer ---------- */
footer{ padding-block:2.4rem; border-top:1px solid var(--line); }
footer .wrap{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.5rem 1rem; font-family:'Archivo',sans-serif; font-size:.78rem; letter-spacing:.02em; color:var(--ink-soft); }
footer a{ text-decoration:none; color:var(--ink-soft); display:inline-block; padding:.5rem .1rem; }
footer a:hover{ color:var(--gold); }

/* ---------- responsive ---------- */
@media (max-width: 900px){
  nav.primary{ display:none; }
  .cta-desktop{ display:none; }
  .navToggle{ display:inline-flex; }
  .story-grid, .visit-grid{ grid-template-columns:1fr; }
  .story-media{ order:-1; }
  .cards{ grid-template-columns:1fr; }
  .quote-grid{ grid-template-columns:1fr; }
  .gallery-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:32vw; }
  .g-wide{ grid-column:span 2; }
}
@media (max-width: 560px){
  .hero-ctas{ flex-direction:column; align-items:flex-start; }
  .gallery-grid{ grid-auto-rows:48vw; }
}