@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Instrument+Serif:ital@0;1&display=swap');

:root {--bg:#f6f0e8;--ink:#2e211b;--panel:#ead9ca;--accent:#75392e;--line:#d1b8a9;--white:#fffaf5;--display:"Instrument Serif",Georgia,serif;--sans:"DM Sans",Arial,sans-serif}
*,*::before,*::after {box-sizing:border-box}
body {margin:0;background:var(--bg);color:var(--ink);font:400 1rem/1.58 var(--sans)}
body.lash {--bg:#fff8f8;--ink:#2b1622;--panel:#f6d7e1;--accent:#84254b;--line:#d7b2c2;--white:#fffdfd}
body.cuts {--bg:#f8f6ef;--ink:#222720;--panel:#e6e7da;--accent:#395346;--line:#c4cabc;--white:#fffdfa}
img {display:block;width:100%;height:auto}
p,h1,h2,h3,figure,dd,dl {margin:0}
a {color:inherit}
a:hover {text-underline-offset:4px}
:focus-visible {outline:3px solid var(--accent);outline-offset:4px}
h1,h2 {font:400 clamp(3.1rem,7.6vw,7.7rem)/.98 var(--display);letter-spacing:-.04em}
h2 {font-size:clamp(2.6rem,5.6vw,5rem)}
h3 {font:750 clamp(1.2rem,2.2vw,1.7rem)/1.18 var(--sans);letter-spacing:-.045em}
p {max-width:65ch}
.eyebrow {text-transform:uppercase;font-weight:800;letter-spacing:.14em;font-size:.71rem}
.wrap {width:min(calc(100% - 74px),1160px);margin-inline:auto}
.notice {padding:9px 15px;background:var(--ink);color:white;text-align:center;font-size:.8rem}
.notice a {font-weight:800;text-underline-offset:3px}
header {border-bottom:1px solid var(--line)}
.nav {display:flex;align-items:center;justify-content:space-between;gap:13px;min-height:75px}
.logo {font:400 clamp(1.65rem,3.4vw,2.25rem)/1 var(--display);text-decoration:none;white-space:nowrap}
nav {display:flex;align-items:center;gap:14px;flex-wrap:wrap}
nav a {min-height:44px;display:inline-flex;align-items:center;font-weight:750;font-size:.89rem;text-decoration:none}
nav a[aria-current] {text-decoration:underline;text-underline-offset:4px}
.button {display:inline-flex;align-items:center;justify-content:center;min-height:45px;padding:9px 16px;background:var(--ink);color:white;font-weight:750;font-size:.89rem;text-decoration:none}
.button:hover {background:var(--accent)}
nav .button[aria-current] {text-decoration:none;background:var(--accent)}
.textlink {color:var(--accent);font-weight:800;text-underline-offset:4px;display:inline-flex;align-items:center;min-height:44px}
.hero {background:var(--panel);display:grid;grid-template-columns:.9fr 1.1fr}
.hero-copy {padding:clamp(30px,6vw,89px);display:flex;flex-direction:column;align-items:start;justify-content:center}
.hero h1,.intro h1 {margin:10px 0 16px}
.hero-copy .button {margin-top:18px}
.hero img {height:100%;min-height:470px;object-fit:cover;object-position:center 43%}
.lash .hero {display:block;position:relative;isolation:isolate;background:#4a2735;color:white}
.lash .hero-copy {position:relative;z-index:2;min-height:510px}
.lash .hero img {position:absolute;inset:0;height:100%;min-height:0;object-position:50% 58%}
.lash .hero::after {content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(36,15,25,.87),rgba(36,15,25,.5) 48%,rgba(36,15,25,.04));pointer-events:none;z-index:1}
.lash .hero .button {background:#fff2f6;color:var(--ink)}
.lash .hero .button:hover {background:#f0bfce}
.section {padding:clamp(38px,6vw,80px) 0}
.section-head {margin-bottom:22px}
.section-head p,.section h2+p,.intro p:not(.eyebrow) {margin-top:13px}
.intro {padding:clamp(37px,6vw,78px) 0 27px}
.service-list {border-top:1px solid var(--line)}
.service {display:grid;grid-template-columns:1fr auto;gap:6px 20px;border-bottom:1px solid var(--line);padding:17px 0}
.service p {grid-column:1}
.service .rate {grid-column:2;grid-row:1/3;white-space:nowrap;font-weight:800;color:var(--accent)}
.gallery {display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.gallery img {aspect-ratio:4/5;object-fit:cover}
figcaption {font-size:.88rem;font-weight:750;margin-top:7px}
.slab {background:var(--panel)}
.two {display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,6vw,90px);align-items:start}
.policies {display:grid;gap:15px;margin:0}
.policies dt {font-weight:800}
.policies dd {margin-top:3px}
.cta-box {padding:clamp(20px,4vw,42px);background:var(--white);border:1px solid var(--line)}
.cta-box h2 {font-size:clamp(2.25rem,5vw,3.8rem)}
.cta-box details,.cta-box .button {margin-top:14px}
.cta-box summary {font-weight:750;cursor:pointer;min-height:44px;display:list-item}
.cta-box details p {margin-top:8px}
.lash-menu {display:grid;grid-template-columns:1fr 1fr;gap:17px}
.lash-menu article {background:var(--panel);padding:23px;display:flex;flex-direction:column;justify-content:space-between;gap:15px;min-height:170px}
.lash-menu article p {margin-top:8px}
.lash-menu article .rate {font-weight:800;color:var(--accent)}
.calculator {background:var(--white);border:1px solid var(--line);padding:clamp(18px,4vw,43px)}
.calc-fields {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:16px}
.calc-field {display:grid;gap:5px;font-weight:750}
.calc-field select {width:100%;padding:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);min-height:45px;font:inherit}
.calc-result {display:block;background:var(--panel);margin-top:19px;padding:16px 18px}
.calc-result strong {font-size:1.5rem;display:block}
footer {background:var(--ink);color:white;padding:24px 0}
footer .wrap {display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
footer a {text-underline-offset:4px}
.skip {position:absolute;left:10px;top:10px;z-index:5;background:var(--white);padding:8px;transform:translateY(-150%)}
.skip:focus {transform:translateY(0)}
@media (max-width:760px) {
  .wrap {width:calc(100% - 34px)}
  .nav {padding-block:9px;flex-wrap:wrap}
  nav {gap:9px}
  nav a {font-size:.81rem}
  .hero,.two {grid-template-columns:1fr}
  .hero-copy {padding:30px 19px}
  .hero img {min-height:0;max-height:390px;aspect-ratio:1.25}
  .lash .hero-copy {min-height:380px}
  .lash .hero img {max-height:none;aspect-ratio:auto;object-position:56% 58%}
  .gallery {grid-template-columns:repeat(2,1fr)}
  .calc-fields {grid-template-columns:1fr}
}
@media (max-width:440px) {
  .lash-menu {grid-template-columns:1fr}
  .nav .logo {width:100%}
  .service .rate {white-space:normal;text-align:right}
}
