/* =========================================================================
   THE FINE LINE — homepage styles · Direction v2
   Palette: pine + oxblood grounds (no black), bone type, dusty-rose accent,
   antique gold hairline. Fonts: Ogg (display) · Cormorant (serif/editorial) ·
   Archivo (utility only). Mobile-first.
   ========================================================================= */

/* ---------- FONTS ---------- */
@font-face{font-family:"Ogg";src:url("../fonts/Ogg-Light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Ogg";src:url("../fonts/Ogg-LightItalic.woff2") format("woff2");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"Ogg";src:url("../fonts/Ogg-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Ogg";src:url("../fonts/Ogg-RegularItalic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Cormorant";src:url("../fonts/Cormorant-VF.woff2") format("woff2-variations");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant";src:url("../fonts/Cormorant-Italic-VF.woff2") format("woff2-variations");font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:"Archivo";src:url("../fonts/Archivo-VF.woff2") format("woff2-variations");font-weight:300 700;font-style:normal;font-display:swap}

/* ---------- TOKENS ---------- */
:root{
  --pine:#162C1C; --pine-2:#1d3a28; --pine-deep:#0f2016;
  --oxblood:#401C25; --ox-2:#511f2d; --ox-deep:#2c121a;
  --bone:#EAE6E1;
  --bone-dim:rgba(234,230,225,.74);
  --muted:rgba(234,230,225,.55);
  --faint:rgba(234,230,225,.38);
  --rose:#C4879C; --rose-bright:#d9a7ba;
  --gold:#B0903D; --gold-bright:#c9a856;
  --line:rgba(176,144,61,.42);
  --line-soft:rgba(234,230,225,.14);
  --focus:#d9a7ba;

  --font-display:"Ogg","Cormorant",Georgia,serif;
  --font-serif:"Cormorant",Georgia,"Times New Roman",serif;
  --font-sans:"Archivo",system-ui,"Helvetica Neue",Arial,sans-serif;

  --text-sm:.82rem; --text-base:1.1rem; --text-lg:1.3rem;

  --space-3:1rem; --space-4:1.5rem; --space-6:2.5rem; --space-8:4rem; --space-12:6rem;
  --radius:3px;
  --shadow:0 24px 60px -24px rgba(0,0,0,.7);
  --dur-fast:180ms; --dur:420ms; --dur-slow:880ms;
  --ease:cubic-bezier(.22,.61,.36,1);
  --maxw:1200px;
  --nav-h:64px;
}

/* ---------- RESET / BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;color:var(--bone);
  background:var(--pine);
  font-family:var(--font-serif);font-size:var(--text-base);line-height:1.6;font-weight:400;
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}
img{max-width:100%;display:block}
picture{display:contents}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:none}
h1,h2,h3{margin:0;font-weight:400;line-height:1.02}
address{font-style:normal}
::selection{background:var(--rose);color:var(--pine-deep)}

:where(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}

/* ---------- HELPERS ---------- */
.wrap{width:min(100% - 2.4rem,var(--maxw));margin-inline:auto}
.kicker{font-family:var(--font-sans);font-weight:600;font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--rose)}
.eyebrow-line{display:inline-flex;align-items:center;gap:.7rem}
.eyebrow-line::before,.eyebrow-line::after{content:"";height:1px;width:32px;background:var(--line)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:50%;top:-60px;transform:translateX(-50%);z-index:200;background:var(--rose);color:var(--pine-deep);padding:.6rem 1.1rem;border-radius:0 0 var(--radius) var(--radius);font-family:var(--font-sans);font-weight:600;font-size:var(--text-sm);transition:top var(--dur-fast)}
.skip-link:focus{top:0}

.pending{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-sans);font-weight:600;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--rose-bright);border:1px dashed var(--line);border-radius:99px;padding:.28rem .6rem;background:rgba(176,144,61,.08)}
.pending::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--rose);box-shadow:0 0 8px var(--rose)}

/* ---------- BUTTONS ---------- */
/* frame drawn with an inset shadow (not a border) + a whole-number height, so all four
   edges rasterize identically on iOS Retina — a 1px border on a fractional-height box
   anti-aliases the bottom/right edges thinner. hover fills via animated background. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-family:var(--font-sans);font-weight:600;font-size:var(--text-sm);letter-spacing:.13em;text-transform:uppercase;padding:0 1.5rem;height:48px;color:var(--bone);border-radius:2px;box-shadow:inset 0 0 0 1px var(--rose);background-image:linear-gradient(var(--rose),var(--rose));background-repeat:no-repeat;background-position:50% 100%;background-size:100% 0%;transition:background-size var(--dur) var(--ease),color var(--dur) var(--ease)}
.btn:hover{color:var(--pine-deep);background-size:100% 100%}
.btn--solid{background-color:var(--rose);color:var(--pine-deep);box-shadow:inset 0 0 0 1px var(--rose);background-image:linear-gradient(var(--rose-bright),var(--rose-bright))}
.btn--solid:hover{color:var(--pine-deep)}
/* Book Now CTA — elegant Ogg-italic pill */
.book-cta{display:inline-flex;align-items:center;font-family:var(--font-display);font-style:italic;font-weight:400;font-size:1.05rem;line-height:1;height:38px;color:var(--bone);padding:0 .9rem;border-radius:2px;box-shadow:inset 0 0 0 1px var(--rose);background-color:rgba(40,16,22,.3);background-image:linear-gradient(var(--rose),var(--rose));background-repeat:no-repeat;background-position:50% 100%;background-size:100% 0%;transition:background-size var(--dur) var(--ease),color var(--dur) var(--ease)}
.book-cta:hover,.book-menu[data-open="true"] .book-cta{color:var(--pine-deep);background-size:100% 100%}

/* =========================================================================
   HEADER / NAV — thin bar, large overhanging logo
   ========================================================================= */
/* non-sticky: the nav overlays the top of the hero and scrolls away with the page */
.site-header{position:absolute;top:0;left:0;right:0;z-index:100;height:var(--nav-h);display:flex;align-items:center;overflow:visible}
.nav{position:relative;width:min(100% - 1.6rem,var(--maxw));margin-inline:auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem}

/* logo is absolutely centered + top-anchored, so it overhangs downward
   without stretching the nav row or clipping its top */
.nav__logo{position:absolute;left:50%;top:6px;transform:translateX(-50%);z-index:3}
.nav__logo img{height:86px;width:auto;filter:drop-shadow(0 4px 14px rgba(0,0,0,.55))}

.nav__left{grid-column:1;display:flex;align-items:center;justify-self:start}
.nav__links{display:none;list-style:none;margin:0;padding:0}
.nav__right{grid-column:3;justify-self:end;display:flex;align-items:center;gap:.9rem}
.nav__findus{display:none;font-family:var(--font-sans);font-weight:600;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--bone);position:relative;padding:.4rem 0;transition:color var(--dur-fast)}
.nav__findus::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--rose);transform:scaleX(0);transform-origin:left;transition:transform var(--dur) var(--ease)}
.nav__findus:hover{color:var(--rose-bright)}
.nav__findus:hover::after{transform:scaleX(1)}

.nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:10px}
.nav-toggle span{height:1.5px;width:100%;background:var(--bone);transition:transform var(--dur) var(--ease),opacity var(--dur)}
.nav-open .nav-toggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav-open .nav-toggle span:nth-child(2){opacity:0}
.nav-open .nav-toggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.nav__right .btn{padding:.6rem .9rem;font-size:.68rem;letter-spacing:.1em;min-height:40px}
.nav__right .btn--book{padding:.72rem 1.25rem;font-size:.72rem;min-height:44px}
/* mobile: the hamburger's lines sit ~15px down inside its 44px tap box, so a vertically-centered Book Now button reads as floating too high. Nudge it down so its top edge aligns with the hamburger's top line. */
@media (max-width:959px){.book-menu{transform:translateY(12px)}}

/* Book Now dropdown */
.book-menu{position:relative;z-index:20}
.book-menu__panel{position:absolute;top:calc(100% + 10px);right:0;min-width:220px;background:var(--ox-deep);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:.4rem;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity var(--dur-fast),transform var(--dur-fast),visibility var(--dur-fast)}
.book-menu[data-open="true"] .book-menu__panel{opacity:1;visibility:visible;transform:translateY(0)}
.book-menu__panel a{display:block;padding:.75rem 1rem;transition:background var(--dur-fast)}
.book-menu__panel a + a{border-top:1px solid var(--line-soft)}
.book-btn__name{display:block;font-family:var(--font-display);font-weight:300;font-size:1.25rem;line-height:1.1;color:var(--bone)}
.book-btn__sub{display:block;font-family:var(--font-serif);font-style:italic;font-size:.88rem;color:var(--rose);margin-top:.05rem}
.book-menu__panel a:hover{background:var(--oxblood)}
.book-menu__panel a:hover .book-btn__name{color:var(--rose-bright)}

/* Mobile overlay menu */
.mobile-menu{position:fixed;inset:0;z-index:99;background:linear-gradient(180deg,var(--pine) 0%,var(--ox-deep) 100%);display:flex;flex-direction:column;justify-content:flex-start;padding:calc(var(--nav-h) + 3.5rem) 1.8rem 2rem;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity var(--dur) var(--ease),visibility var(--dur)}
.nav-open .mobile-menu{opacity:1;visibility:visible}
.mobile-menu::before{content:"";position:absolute;inset:0;background:url("../img/graphics/roses-bones.webp") center/cover;opacity:.16;pointer-events:none}
.mobile-menu ul{list-style:none;margin:0 0 auto;padding:0;position:relative}
.mobile-menu li{overflow:hidden}
.mobile-menu ul a{display:block;font-family:var(--font-display);font-weight:300;font-size:clamp(1.9rem,8.5vw,2.8rem);line-height:1.16;padding:.28rem 0;color:var(--bone);transform:translateY(110%);transition:transform var(--dur) var(--ease),color var(--dur-fast)}
.nav-open .mobile-menu ul a{transform:translateY(0)}
.nav-open .mobile-menu li:nth-child(1) a{transition-delay:.08s}
.nav-open .mobile-menu li:nth-child(2) a{transition-delay:.14s}
.nav-open .mobile-menu li:nth-child(3) a{transition-delay:.20s}
.nav-open .mobile-menu li:nth-child(4) a{transition-delay:.26s}
.mobile-menu ul a:hover,.mobile-menu ul a:focus-visible{color:var(--rose-bright);font-style:italic}
.mobile-menu__foot{margin-top:2.2rem;position:relative;display:flex;flex-direction:column;gap:.8rem}
.mobile-menu__foot .kicker{margin-bottom:.2rem}
.mobile-menu__foot .btn{width:100%}

/* =========================================================================
   HERO
   ========================================================================= */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--oxblood);isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 34%}
.hero__media::after{content:"";position:absolute;inset:0;background:
  radial-gradient(120% 85% at 50% 18%,transparent 42%,rgba(64,28,37,.3) 78%,var(--oxblood) 100%),
  linear-gradient(180deg,rgba(28,11,16,.85) 0%,rgba(28,11,16,.3) 13%,rgba(44,18,26,.04) 32%,rgba(64,28,37,.66) 76%,var(--oxblood) 100%)}
.hero__inner{position:relative;z-index:2;width:min(100% - 2.4rem,var(--maxw));margin-inline:auto;padding-bottom:clamp(3rem,9vh,6rem);padding-top:var(--nav-h)}
.hero__inner *{text-shadow:0 2px 30px rgba(10,14,10,.5),0 1px 4px rgba(10,14,10,.4)}
.hero h1{font-family:var(--font-display);font-weight:300;font-size:clamp(3.6rem,17vw,10rem);line-height:.94;letter-spacing:-.01em;text-wrap:balance}
.hero h1 .l1{display:block}
.hero h1 .l2{display:block}
.hero h1 em{font-style:italic;color:var(--rose-bright)}
.hero__sub{margin-top:1.5rem;max-width:none;color:var(--bone-dim);font-family:var(--font-serif);font-style:italic;font-size:1.35rem;line-height:1.45}
.hero__scroll{position:absolute;bottom:1.2rem;left:50%;transform:translateX(-50%);z-index:2;font-family:var(--font-sans);font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--faint);display:flex;flex-direction:column;align-items:center;gap:.5rem}
.hero__scroll span{width:1px;height:32px;background:linear-gradient(var(--rose),transparent);animation:scrollpulse 2.4s var(--ease) infinite}
@keyframes scrollpulse{0%,100%{transform:scaleY(.3);opacity:.3;transform-origin:top}50%{transform:scaleY(1);opacity:1;transform-origin:top}}

.reveal-word{display:inline-block;overflow:hidden;vertical-align:top}
.reveal-word>*{display:inline-block;transform:translateY(105%);opacity:0;transition:transform var(--dur-slow) var(--ease),opacity var(--dur-slow)}
.hero.in .reveal-word>*{transform:translateY(0);opacity:1}
.hero.in .reveal-word:nth-child(2)>*{transition-delay:.12s}

/* =========================================================================
   MARQUEE
   ========================================================================= */
.marquee{position:relative;background:var(--rose);border-block:1px solid var(--gold);padding:.85rem 0;overflow:hidden;white-space:nowrap;z-index:2}
.marquee__track{display:inline-flex;will-change:transform;animation:marquee 34s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee span{font-family:var(--font-display);font-style:italic;font-weight:300;font-size:1.5rem;color:var(--ox-deep);padding-inline:1.5rem;display:inline-flex;align-items:center;gap:3rem}
.marquee span::after{content:"✶";font-size:.7rem;color:var(--oxblood);font-style:normal}
@keyframes marquee{to{transform:translateX(-50%)}}

/* =========================================================================
   SECTION SHELL + BOTANICAL GROUNDS
   ========================================================================= */
.section{position:relative;overflow:hidden;padding-block:var(--space-12);z-index:1}
.section>.wrap{position:relative;z-index:2}
.section__bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.section__bg img{width:100%;height:100%;object-fit:cover}

/* Services ground — monstera bleeds from the right into pine */
.section--services{background:var(--pine)}
.section--services .section__bg img{object-position:right center}
.section--services .section__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,var(--pine) 6%,rgba(22,44,28,.72) 46%,rgba(22,44,28,.35) 100%),
  linear-gradient(180deg,var(--pine) 0%,transparent 22%,transparent 72%,var(--pine) 100%)}

/* Meet ground — roses & bones bleeds from the right into oxblood */
.section--meet{background:var(--ox-deep)}
.section--meet .section__bg img{object-position:right center}
.section--meet .section__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,var(--ox-deep) 8%,rgba(44,18,26,.7) 48%,rgba(44,18,26,.3) 100%),
  linear-gradient(180deg,var(--ox-deep) 0%,transparent 20%,transparent 74%,var(--ox-deep) 100%)}

/* The Latest ground — rich moth duotone */
.section--latest{background:var(--pine)}
.section--latest .section__bg img{object-position:center}
.section--latest .section__bg::after{content:"";position:absolute;inset:0;background:
  radial-gradient(120% 90% at 50% 50%,rgba(16,34,23,.5),rgba(16,34,23,.82)),
  linear-gradient(180deg,var(--pine) 0%,transparent 16%,transparent 82%,var(--pine) 100%)}

.section__head{margin-bottom:var(--space-6);display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem}
.section__head h2{font-family:var(--font-display);font-weight:300;font-size:clamp(2.6rem,10vw,4.2rem);letter-spacing:-.01em}
.section__head h2 em{font-style:italic;color:var(--rose-bright)}
.section__head--center{align-items:center;text-align:center}

/* =========================================================================
   CORNER LEAF ORNAMENT (masked SVG so it can be tinted gold)
   ========================================================================= */
/* base SVG is the BOTTOM-LEFT corner; reflect it into the other three */
.corner{position:absolute;width:26px;height:26px;z-index:6;pointer-events:none;background:var(--gold);
  -webkit-mask:url("../img/graphics/corner-leaf.svg") no-repeat center/contain;mask:url("../img/graphics/corner-leaf.svg") no-repeat center/contain;opacity:.95}
.corner.bl{bottom:8px;left:8px}
.corner.br{bottom:8px;right:8px;transform:scaleX(-1)}
.corner.tl{top:8px;left:8px;transform:scaleY(-1)}
.corner.tr{top:8px;right:8px;transform:scale(-1,-1)}

/* =========================================================================
   SERVICES CARDS  (image + solid oxblood caption block)
   ========================================================================= */
.services__grid{display:grid;grid-template-columns:1fr;gap:1.3rem}
.svc{position:relative;display:block;overflow:hidden;background:var(--ox-deep);border:1px solid var(--line-soft);isolation:isolate}
.svc__img{display:block;aspect-ratio:5/4;overflow:hidden}
.svc__img img{width:100%;height:100%;object-fit:cover;filter:brightness(1.03) saturate(1.03);transition:transform var(--dur-slow) var(--ease)}
.svc:hover .svc__img img,.svc:focus-visible .svc__img img{transform:scale(1.05)}
.svc__cap{display:block;text-align:center;background:var(--oxblood);border-top:1px solid var(--gold);padding:1.4rem 2.4rem 1.6rem}
.svc__num{display:block;font-family:var(--font-sans);font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--rose)}
.svc h3{font-family:var(--font-display);font-weight:300;font-size:2.1rem;line-height:1.02;margin:.3rem 0 .25rem}
.svc__go{display:inline-flex;margin-top:.2rem;align-items:center;gap:.5rem;font-family:var(--font-sans);font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);transition:color var(--dur-fast),gap var(--dur-fast)}
.svc__go::after{content:"→";transition:transform var(--dur-fast)}
.svc:hover .svc__go{color:var(--rose-bright);gap:.8rem}

/* =========================================================================
   MEET (artists)
   ========================================================================= */
.meet__grid{display:grid;grid-template-columns:1fr;gap:1.6rem}
.person{position:relative;display:block;overflow:hidden;isolation:isolate;background:var(--ox-deep);border:1px solid var(--line-soft)}
.person__img{display:block;aspect-ratio:3/4;overflow:hidden}
.person__img img{width:100%;height:100%;object-fit:cover;object-position:center 20%;transition:transform var(--dur-slow) var(--ease)}
.person:hover .person__img img,.person:focus-visible .person__img img{transform:scale(1.05)}
.person__cap{background:var(--oxblood);border-top:1px solid var(--gold);padding:1.15rem 1.6rem 1.3rem;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem}
.person__tag{display:block;font-family:var(--font-sans);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--rose)}
.person__name{display:block;font-family:var(--font-display);font-weight:300;font-size:2rem;line-height:.98;margin-top:.15rem}
.person__name em{font-style:italic}
.person__arrow{display:inline-block;color:var(--rose-bright);transition:transform var(--dur-fast) var(--ease)}
.person:hover .person__arrow{transform:translateX(5px)}

/* =========================================================================
   THE LATEST (instagram placeholder)
   ========================================================================= */
.latest__handles{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;margin-bottom:2rem}
.ig-handle{display:inline-flex;align-items:center;gap:.55rem;padding:.6rem 1rem;border:1px solid var(--line-soft);border-radius:99px;font-family:var(--font-sans);font-weight:500;font-size:var(--text-sm);letter-spacing:.02em;color:var(--bone);transition:border-color var(--dur-fast),color var(--dur-fast)}
.ig-handle:hover{border-color:var(--rose);color:var(--rose-bright)}
.ig-handle svg{width:16px;height:16px;flex:none}
.latest__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.ig-tile{position:relative;aspect-ratio:1;background:linear-gradient(135deg,rgba(64,28,37,.6),rgba(44,18,26,.6));border:1px solid var(--line-soft);display:flex;align-items:center;justify-content:center;overflow:hidden}
.ig-tile::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(196,135,156,.1) 50%,transparent 70%);background-size:220% 100%;animation:shimmer 3.4s linear infinite}
@keyframes shimmer{to{background-position:-220% 0}}
.ig-tile svg{width:26px;height:26px;color:var(--faint);position:relative}
.ig-tile--photo::before{display:none}
.ig-tile--photo picture,.ig-tile--photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ig-tile--photo img{transition:transform .6s ease}
.ig-tile--photo:hover img{transform:scale(1.04)}
.latest__note{margin-top:1.5rem;text-align:center;color:var(--bone-dim);font-family:var(--font-serif);font-size:var(--text-base)}
.latest__note .pending{margin-bottom:.7rem}

/* =========================================================================
   VISIT / FOOTER
   ========================================================================= */
.visit{position:relative;overflow:hidden;background:var(--oxblood);padding-block:var(--space-12) var(--space-8);z-index:2;border-top:1px solid var(--line-soft)}
.visit .section__bg img{object-position:center}
.visit .section__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--oxblood) 0%,rgba(64,28,37,.8) 42%,rgba(44,18,26,.92) 100%)}
.visit>.wrap{position:relative;z-index:2}
.visit__grid{display:grid;grid-template-columns:1fr;gap:var(--space-6)}
.visit__col{text-align:center}
.visit__col h3{font-family:var(--font-sans);font-weight:600;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--rose);margin-bottom:1rem}
.visit address{font-family:var(--font-serif);font-size:var(--text-lg);line-height:1.7;color:var(--bone)}
.visit address a{border-bottom:1px solid var(--line-soft);transition:border-color var(--dur-fast),color var(--dur-fast)}
.visit address a:hover{color:var(--rose-bright);border-color:var(--rose)}
.finding{color:var(--bone-dim);font-family:var(--font-serif);font-size:var(--text-base);line-height:1.7;margin-top:1.4rem}
.finding__label{font-family:var(--font-sans);font-weight:600;font-style:normal;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose)}

.hours-row{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.7rem}
.hours-appt{font-family:var(--font-serif);font-style:italic;font-size:var(--text-base);color:var(--bone-dim);margin:0 0 .4rem}
.hours{font-family:var(--font-serif);font-size:var(--text-base);line-height:1.9;color:var(--bone);list-style:none;margin:.4rem 0 0;padding:0}
.hours li{display:flex;justify-content:space-between;gap:2rem;border-bottom:1px solid var(--line-soft);padding:.2rem 0;max-width:none}
.hours li span:last-child{color:var(--bone-dim)}
.hours-pending{color:var(--faint);font-family:var(--font-sans);font-size:.7rem;margin-top:.8rem}

.socials{display:flex;flex-direction:column;align-items:center;gap:.55rem;font-family:var(--font-serif);font-size:var(--text-base);margin-top:1.8rem}
.socials-label{font-family:var(--font-sans);font-weight:600;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--rose);margin-bottom:.3rem}
.socials a{display:inline-flex;align-items:center;gap:.6rem;color:var(--bone-dim);transition:color var(--dur-fast)}
.socials a:hover{color:var(--rose-bright)}
.socials svg{width:16px;height:16px;flex:none}

.map{position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.map img{width:100%;height:auto;display:block}
.map__attr{position:absolute;bottom:0;right:0;font-family:var(--font-sans);font-size:.52rem;letter-spacing:.02em;color:var(--muted);background:rgba(44,18,26,.7);padding:.15rem .4rem;border-top-left-radius:3px}
.map__attr a{text-decoration:underline}
.map__btn{margin-top:.9rem;width:100%}

.colophon{border-top:1px solid var(--line-soft);margin-top:var(--space-6);padding-top:var(--space-4);display:flex;flex-wrap:wrap;gap:.8rem 2rem;align-items:center;justify-content:center;text-align:center}
.colophon__meta{font-family:var(--font-serif);font-style:italic;font-size:.78rem;letter-spacing:.01em;color:var(--bone-dim)}
.colophon__links{display:flex;gap:1.6rem;flex-wrap:wrap;justify-content:center;font-family:var(--font-sans);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
.colophon__links button,.colophon__links a{font:inherit;letter-spacing:inherit;text-transform:uppercase;color:var(--bone-dim);transition:color var(--dur-fast)}
.colophon__links button:hover,.colophon__links a:hover{color:var(--rose-bright)}

/* =========================================================================
   POLICIES MODAL
   ========================================================================= */
.modal{border:none;padding:0;background:transparent;max-width:min(640px,92vw);width:100%;color:var(--bone)}
.modal::backdrop{background:rgba(11,16,11,.72);backdrop-filter:blur(6px)}
.modal[open]{animation:modalin var(--dur) var(--ease)}
@keyframes modalin{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.modal__inner{background:var(--ox-deep);border:1px solid var(--line);box-shadow:var(--shadow);max-height:86vh;overflow:auto;padding:2rem 1.6rem 2.2rem;position:relative}
.modal__inner::before{content:"";position:absolute;inset:0;background:url("../img/graphics/roses-bones.webp") center/cover;opacity:.08;pointer-events:none}
.modal__close{position:sticky;top:0;float:right;margin:-.6rem -.4rem 0 0;width:44px;height:44px;font-size:1.5rem;line-height:1;color:var(--bone-dim);z-index:2}
.modal__close:hover{color:var(--rose-bright)}
.modal h2{font-family:var(--font-display);font-weight:300;font-size:2rem;margin-bottom:.4rem;position:relative}
.modal .kicker{margin-bottom:1rem;display:block}
.modal p{color:var(--bone-dim);font-family:var(--font-serif);font-size:var(--text-base);line-height:1.7;margin:.7rem 0;position:relative}
.modal .pending{margin-top:1rem}
.modal h3{font-family:var(--font-sans);font-weight:600;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--rose);margin:1.7rem 0 .1rem;position:relative}

/* =========================================================================
   SCROLL REVEAL + TOAST
   ========================================================================= */
[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal][data-delay="1"]{transition-delay:.1s}
[data-reveal][data-delay="2"]{transition-delay:.2s}

.toast{position:fixed;left:50%;bottom:1.6rem;transform:translate(-50%,180%);z-index:300;background:var(--ox-deep);border:1px solid var(--line);color:var(--bone);font-family:var(--font-serif);font-size:var(--text-base);padding:.85rem 1.3rem;border-radius:var(--radius);box-shadow:var(--shadow);transition:transform var(--dur) var(--ease),visibility var(--dur);max-width:88vw;text-align:center;visibility:hidden}
.toast.show{transform:translate(-50%,0);visibility:visible}

/* back-to-top / jump-to-menu button (appears after scrolling) */
.to-top{position:fixed;right:1.1rem;bottom:1.1rem;z-index:95;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:transparent;color:var(--rose);box-shadow:inset 0 0 0 1px var(--rose);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity var(--dur) var(--ease),visibility var(--dur),transform var(--dur) var(--ease),color var(--dur-fast),box-shadow var(--dur-fast),background-color var(--dur-fast)}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{color:var(--rose-bright);box-shadow:inset 0 0 0 1px var(--rose-bright);background-color:rgba(196,135,156,.12)}
.to-top svg{width:17px;height:17px}
@media (min-width:960px){.to-top{right:1.6rem;bottom:1.6rem;width:48px;height:48px}}

/* =========================================================================
   BREAKPOINTS
   ========================================================================= */
@media (min-width:600px){
  .services__grid{grid-template-columns:repeat(3,1fr)}
  .meet__grid{grid-template-columns:1fr 1fr}
  .latest__grid{grid-template-columns:repeat(3,1fr)}
  .visit__grid{grid-template-columns:1.1fr 1fr;gap:var(--space-8)}
  .hours li{max-width:none}
}
@media (min-width:960px){
  :root{--nav-h:74px}
  .nav-toggle{display:none}
  .nav__logo img{height:116px}
  .nav__links{display:flex;align-items:center;gap:0}
  .nav__links li{display:flex;align-items:center}
  .nav__links li:not(:last-child)::after{content:"—";margin:0 1.05rem;color:var(--bone);font-family:var(--font-serif);font-weight:300;font-size:1rem;line-height:1}
  .nav__links a{font-family:var(--font-sans);font-weight:600;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--bone);position:relative;padding:.4rem 0;transition:color var(--dur-fast)}
  .nav__links a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--rose);transform:scaleX(0);transform-origin:left;transition:transform var(--dur) var(--ease)}
  .nav__links a:hover{color:var(--rose-bright)}
  .nav__links a:hover::after{transform:scaleX(1)}
  .nav__right .btn{padding:.75rem 1.3rem;font-size:.7rem;min-height:44px}
  .nav__findus{display:inline-block}
  .book-cta{font-size:1.4rem;padding:0 1.3rem;height:46px}
  .mobile-menu{display:none}
  .visit__grid{grid-template-columns:1.2fr 1fr 1fr;gap:var(--space-8)}
  .hero__sub{font-size:1.4rem;max-width:none}
  /* footer reverts to left-aligned, spread-out on desktop */
  .visit__col{text-align:left}
  .hours-row{justify-content:flex-start}
  .socials{align-items:flex-start}
  .colophon{justify-content:space-between;text-align:left}
  .colophon__links{justify-content:flex-start}
}
@media (min-width:1200px){.marquee span{font-size:1.7rem}}

/* =========================================================================
   REDUCED MOTION
   ========================================================================= */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  [data-reveal]{opacity:1;transform:none}
  .reveal-word>*{transform:none;opacity:1}
  .marquee__track{animation:none;transform:none}
  .hero__scroll span{animation:none}
}

/* =========================================================================
   SUB-PAGES (Permanent Makeup / Tattoo / Piercing)
   ========================================================================= */

/* current page marker in the main nav */
.nav__links a[aria-current="page"]{color:var(--rose-bright)}
.nav__links a[aria-current="page"]::after{transform:scaleX(1)}

/* ---- sub-page hero ---- */
.subhero{position:relative;min-height:60svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--oxblood);isolation:isolate}
.subhero__media{position:absolute;inset:0;z-index:-2}
.subhero__media img{width:100%;height:100%;object-fit:cover;object-position:center 32%}
.subhero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,11,16,.82) 0%,rgba(28,11,16,.28) 24%,rgba(44,18,26,.45) 62%,var(--oxblood) 100%)}
.subhero__inner{position:relative;z-index:2;width:min(100% - 2.4rem,var(--maxw));margin-inline:auto;padding:calc(var(--nav-h) + 2rem) 0 clamp(2.4rem,6vh,4rem);text-align:center;display:flex;flex-direction:column;align-items:center}
.subhero__inner *{text-shadow:0 2px 26px rgba(10,8,8,.5)}
.subhero h1{font-family:var(--font-display);font-weight:300;font-size:clamp(3rem,12vw,6.2rem);line-height:.95;letter-spacing:-.01em}
.subhero h1 em{font-style:italic;color:var(--rose-bright)}
.subhero__sub{margin-top:1rem;max-width:46ch;font-family:var(--font-serif);font-style:italic;font-weight:500;font-size:1.2rem;line-height:1.4;color:#F4F0EA}
.subhero__cta{margin-top:1.7rem}
.subhero .pending{margin-top:1.2rem}
/* PMU hero: on phones the loose crop lands the busy ink caps behind the title;
   zoom into the glove so the text sits over the smoother pink (desktop is untouched) */
@media (max-width:700px){
  /* stronger scrim on phones so the subcopy stays legible over the busy crop */
  .subhero__media::after{background:linear-gradient(180deg,rgba(24,10,14,.8) 0%,rgba(24,10,14,.26) 20%,rgba(40,16,22,.32) 42%,rgba(40,16,22,.74) 68%,var(--oxblood) 100%)}
  .subhero--pmu .subhero__media img{object-position:center 30%;transform:scale(1.7);transform-origin:30% 34%}
  .subhero--tattoo .subhero__media img{object-position:50% 46%;transform:scale(1.55);transform-origin:50% 20%}
  .subhero--piercing .subhero__media img{object-position:72% 38%;transform:scale(1.4);transform-origin:75% 40%}
}
@media (min-width:701px){
  /* desktop: shift each crop so the busy focal point sits off the centered title */
  .subhero--pmu .subhero__media img{object-position:center 46%}
  .subhero--tattoo .subhero__media img{object-position:center 30%;transform:scale(1.12);transform-origin:center 46%}
  .subhero--piercing .subhero__media img{object-position:64% 28%}
}

/* ---- in-page anchor nav ---- */
.anchor-nav{background:var(--ox-deep);border-block:1px solid var(--line);position:relative;z-index:3}
/* mobile: 3x2 grid with hairline dividers (the 1px gap reveals the tint behind) */
.anchor-nav ul{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-soft);list-style:none;margin:0 auto;padding:0;width:min(100% - 1.2rem,var(--maxw))}
.anchor-nav li{text-align:center;background:var(--ox-deep)}
.anchor-nav--4 ul{grid-template-columns:repeat(2,1fr)}
@media (min-width:600px){
  .anchor-nav ul{display:flex;justify-content:center;gap:0;background:transparent}
  .anchor-nav li{background:transparent}
}
.anchor-nav a{display:inline-block;padding:1rem .95rem;font-family:var(--font-sans);font-weight:600;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);white-space:nowrap;transition:color var(--dur-fast)}
.anchor-nav a:hover{color:var(--rose-bright)}
.anchor-nav a.is-cta{color:var(--rose)}
.anchor-nav a.is-active{color:var(--rose-bright)}

/* ---- generic content section ---- */
.page-section{position:relative;overflow:hidden;padding-block:clamp(3.25rem,7vw,4.5rem);z-index:1}
.page-section>.wrap{position:relative;z-index:2}
.bg-oxblood{background:var(--oxblood)}
.bg-pine{background:var(--pine)}
.bg-oxdeep{background:var(--ox-deep)}

/* textural botanical grounds behind sub-page sections.
   default = full texture (lighter sections); .ground-soft = whisper (dense text) */
.bg-pine.has-texture>.section__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,var(--pine) 0%,transparent 16%,transparent 84%,var(--pine) 100%),
  linear-gradient(rgba(22,44,28,.64),rgba(22,44,28,.64))}
.bg-oxblood.has-texture>.section__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,var(--oxblood) 0%,transparent 16%,transparent 84%,var(--oxblood) 100%),
  linear-gradient(rgba(64,28,37,.64),rgba(64,28,37,.64))}
.ground-soft.bg-pine.has-texture>.section__bg::after{background:
  linear-gradient(180deg,var(--pine) 0%,transparent 22%,transparent 78%,var(--pine) 100%),
  linear-gradient(rgba(22,44,28,.9),rgba(22,44,28,.9))}
.ground-soft.bg-oxblood.has-texture>.section__bg::after{background:
  linear-gradient(180deg,var(--oxblood) 0%,transparent 22%,transparent 78%,var(--oxblood) 100%),
  linear-gradient(rgba(64,28,37,.9),rgba(64,28,37,.9))}
/* About: the monstera is a busy image — blur it to a soft wash + heavier veil */
#about .section__bg img{filter:blur(3px) saturate(.95)}
#about.bg-pine.has-texture>.section__bg::after{background:
  linear-gradient(180deg,var(--pine) 0%,transparent 20%,transparent 80%,var(--pine) 100%),
  linear-gradient(rgba(20,40,26,.87),rgba(20,40,26,.87))}
.page-head{text-align:center;margin-bottom:var(--space-6)}
.page-head h2{font-family:var(--font-display);font-weight:300;font-size:clamp(2.4rem,8vw,3.6rem);letter-spacing:-.01em}
.page-head h2 em{font-style:italic;color:var(--rose-bright)}
.page-head p{margin-top:1rem;color:var(--bone-dim);font-family:var(--font-serif);font-size:var(--text-lg);max-width:46ch;margin-inline:auto}

/* ---- about ---- */
.about__grid{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center}
.about__media{position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--line-soft)}
.about__media img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center 20%}
/* Lindsey's portrait: drop to lower framing + a slight right-anchored crop to clear the stray red at the bottom-left edge */
.about__media--lindsey img{object-position:center 90%;transform:scale(1.11);transform-origin:100% 100%}
.about__body h2{font-family:var(--font-display);font-weight:300;font-size:clamp(2.2rem,7vw,3.2rem);margin-bottom:1.2rem}
.about__body h2 em{font-style:italic;color:var(--rose-bright)}
.about__body p{font-family:var(--font-serif);font-size:var(--text-base);line-height:1.5;color:var(--bone-dim);margin-bottom:1rem}
.about__body p:first-of-type::first-letter{font-family:var(--font-display);font-style:italic;font-size:3.2em;line-height:.8;float:left;margin:.02em .1em 0 0;color:var(--rose-bright)}
@media (max-width:899px){.about__body{padding-inline:.7rem}}

/* ---- priced service cards ---- */
.deposit-note{max-width:60ch;margin:0 auto var(--space-6);text-align:center;font-family:var(--font-serif);font-style:italic;font-size:var(--text-lg);line-height:1.6;color:var(--bone-dim);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.2rem 1rem}
.deposit-note b{color:var(--rose-bright);font-style:normal;font-family:var(--font-sans);font-weight:600;font-size:.9em}
.svc-list{display:grid;grid-template-columns:1fr;gap:1.2rem}
.svc-card{position:relative;background:var(--ox-deep);border:1px solid var(--line-soft);padding:2.2rem 2rem;text-align:center}
.svc-card h3{font-family:var(--font-display);font-weight:300;font-size:1.9rem;line-height:1.05}
.svc-card__desc{font-family:var(--font-serif);font-size:var(--text-base);line-height:1.55;color:var(--bone-dim);margin:.6rem auto 1rem;max-width:34ch}
.svc-card__price{font-family:var(--font-sans);font-weight:500;font-size:.82rem;letter-spacing:.06em;color:var(--bone);border-top:1px solid var(--line-soft);padding-top:1rem;display:inline-block}
.svc-card__price .amt{color:var(--rose-bright)}

/* ---- gallery (placeholder) ---- */
.gallery__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.gallery__tile{position:relative;aspect-ratio:1;background:linear-gradient(135deg,rgba(64,28,37,.55),rgba(44,18,26,.55));border:1px solid var(--line-soft);display:flex;align-items:center;justify-content:center;overflow:hidden}
.gallery__tile::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(196,135,156,.09) 50%,transparent 70%);background-size:220% 100%;animation:shimmer 3.4s linear infinite}
.gallery__tile svg{width:26px;height:26px;color:var(--faint);position:relative}
.gallery__note{margin-top:1.5rem;text-align:center;color:var(--bone-dim);font-family:var(--font-serif)}
.gallery__note .pending{margin-bottom:.7rem}

/* ---- FAQ accordion ---- */
.faq{max-width:820px;margin-inline:auto}
.faq-group{margin-bottom:2.6rem}
.faq-group__label{text-align:center;font-family:var(--font-sans);font-weight:600;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--rose);margin-bottom:1rem}
.faq-item{border-bottom:1px solid var(--line-soft)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:1.2rem;padding:1.1rem .2rem;font-family:var(--font-serif);font-weight:500;font-size:var(--text-lg);color:var(--bone);transition:color var(--dur-fast)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--rose-bright)}
.faq-item summary .faq-icon{flex:0 0 auto;position:relative;width:16px;height:16px;margin-top:.35em}
.faq-item summary .faq-icon::before,.faq-item summary .faq-icon::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--rose);transition:transform var(--dur) var(--ease),opacity var(--dur)}
.faq-item summary .faq-icon::before{width:14px;height:1.5px}
.faq-item summary .faq-icon::after{width:1.5px;height:14px}
.faq-item[open] summary .faq-icon::after{transform:translate(-50%,-50%) scaleY(0)}
.faq-item[open] summary{color:var(--rose-bright)}
.faq-a{padding:0 .2rem 1.3rem;font-family:var(--font-serif);font-size:var(--text-base);line-height:1.7;color:var(--bone-dim)}
.faq-a p{margin:0 0 .7rem}
.faq-a ul{margin:.4rem 0 .7rem;padding-left:1.1rem}
.faq-a li{margin-bottom:.25rem}
.faq-a .amt{color:var(--rose-bright)}
.faq-item[open] .faq-a{animation:faqopen var(--dur) var(--ease)}
@keyframes faqopen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---- contact block ---- */
.contact-block{text-align:center;max-width:560px;margin-inline:auto}
.contact-block p{font-family:var(--font-serif);font-size:var(--text-lg);line-height:1.9;color:var(--bone)}
.contact-block a{border-bottom:1px solid var(--line-soft);transition:border-color var(--dur-fast),color var(--dur-fast)}
.contact-block a:hover{color:var(--rose-bright);border-color:var(--rose)}
.contact-block .socials-inline{display:flex;gap:1.4rem;justify-content:center;margin:1.4rem 0;font-family:var(--font-sans);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
.contact-block .socials-inline a{border:none;color:var(--bone-dim)}
.contact-block .socials-inline a:hover{color:var(--rose-bright)}
.contact-block .btn,.contact-block .book-cta{margin-top:1.6rem}

/* centered single-button rows */
.btn-row{display:flex;justify-content:center;margin-top:var(--space-6)}

@media (min-width:700px){
  .svc-list{grid-template-columns:1fr 1fr}
  .gallery__grid{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:900px){
  .about__grid{grid-template-columns:1fr 1fr;gap:5.5rem}
  .about--reverse .about__media{order:2}
}
@media (min-width:960px){
  .anchor-nav ul{justify-content:center}
}

/* ---- placeholder panel (for pending sub-page content) ---- */
.placeholder-panel{max-width:560px;margin-inline:auto;text-align:center;border:1px dashed var(--line);border-radius:var(--radius);padding:2.6rem 1.8rem;background:rgba(176,144,61,.05)}
.placeholder-panel .pending{margin-bottom:1rem}
.placeholder-panel p{font-family:var(--font-serif);font-style:italic;font-size:var(--text-lg);color:var(--bone-dim);line-height:1.6}

/* ---- piercing price list ---- */
.price-block{max-width:720px;margin-inline:auto}
.price-group{margin-bottom:2rem}
.price-group__label{font-family:var(--font-sans);font-weight:600;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--rose);margin-bottom:.6rem;text-align:center}
.price-row{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:1rem;padding:.85rem .2rem;border-bottom:1px solid var(--line-soft)}
.price-row__name{font-family:var(--font-serif);font-size:var(--text-lg);color:var(--bone)}
.price-row__price{font-family:var(--font-sans);font-weight:600;font-size:.85rem;letter-spacing:.04em;color:var(--rose-bright);white-space:nowrap}

/* ---- choose-your-piercer (piercing page) ---- */
.piercer-choice{max-width:720px;margin:var(--space-6) auto 0;text-align:center}
.piercer-choice__note{font-family:var(--font-serif);font-size:var(--text-lg);color:var(--bone-dim);margin-bottom:1.4rem}
.piercer-cards{display:grid;grid-template-columns:1fr;gap:1.2rem}
@media (min-width:600px){.piercer-cards{grid-template-columns:1fr 1fr}}
.piercer-card{position:relative;background:var(--ox-deep);border:1px solid var(--line-soft);padding:2.2rem 1.6rem;display:flex;flex-direction:column;align-items:center;gap:.9rem}
.piercer-card h3{font-family:var(--font-display);font-weight:300;font-size:1.9rem;line-height:1}
.piercer-card p{font-family:var(--font-serif);font-size:var(--text-base);color:var(--bone-dim)}
.piercer-card .btn{width:100%;max-width:280px}
.piercer-card__alt{font-family:var(--font-sans);font-weight:500;font-size:.72rem;letter-spacing:.05em;color:var(--bone-dim);border-bottom:1px solid var(--line-soft);padding-bottom:1px;transition:color var(--dur-fast),border-color var(--dur-fast)}
.piercer-card__alt:hover{color:var(--rose-bright);border-color:var(--rose)}
.piercer-choice__specialty{margin-top:1.6rem;font-family:var(--font-serif);font-style:italic;font-size:var(--text-base);color:var(--bone-dim)}
.piercer-choice__specialty a{color:var(--rose-bright);border-bottom:1px solid var(--line-soft);transition:border-color var(--dur-fast)}
.piercer-choice__specialty a:hover{border-color:var(--rose)}