:root {
  --ink-950: #1d1b19;
  --ink-700: #4c4740;
  --paper-50: #fffdf8;
  --paper-100: #f8f2e7;
  --paper-200: #eee4d3;
  --tomato-500: #ed412b;
  --tomato-300: #ff896f;
  --tomato-700: #ad2c1e;
  --sage-500: #80927d;
  --sun-400: #eab735;
  --line-soft: color-mix(in srgb, var(--ink-950) 15%, transparent);
  --shadow-soft: 0 18px 50px rgb(29 27 25 / 12%);
  --shadow-lift: 0 28px 70px rgb(29 27 25 / 20%);
  --font-display: Arial, Helvetica, sans-serif;
  --font-text: Georgia, 'Times New Roman', serif;
  --space-1: .5rem;
  --space-2: .75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
  --space-8: 7rem;
  --radius-sm: .6rem;
  --radius-md: 1.1rem;
  --radius-lg: 1.8rem;
  --ease-out: cubic-bezier(.2, .75, .25, 1);
  --duration-fast: 160ms;
  --duration-base: 280ms;
  --page-gutter: clamp(1.15rem, 4vw, 4.5rem);
  --hero-height: 86svh;
  --hero-copy-measure: 39rem;
  --menu-icon-size: 1.75rem;
  --panel-pad: clamp(1.75rem, 5vw, 4.5rem);
  --bookmark-width: clamp(2.4rem, 3.4vw, 3.35rem);
  --back-to-top-size: 3.25rem;
  --floating-control-offset: clamp(1rem, 3vw, 2rem);
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: var(--tomato-500) var(--paper-100); scrollbar-width: thin; background: var(--paper-100); }
body { margin: 0; background: var(--paper-50); color: var(--ink-950); font-family: var(--font-text); font-size: 1rem; line-height: 1.55; }
p { text-wrap: pretty; }
::-webkit-scrollbar { width: .8rem; }
::-webkit-scrollbar-track { background: var(--paper-100); }
::-webkit-scrollbar-thumb { border: .2rem solid var(--paper-100); border-radius: 999px; background: var(--tomato-500); }
::-webkit-scrollbar-thumb:hover { background: #cf301e; }
img { display: block; max-width: 100%; }
figure { margin: 0; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .2em; }
button { font: inherit; }

.skip-link { position: fixed; z-index: 20; top: var(--space-2); left: var(--space-2); padding: var(--space-2) var(--space-3); background: var(--paper-50); color: var(--ink-950); transform: translateY(-180%); transition: transform var(--duration-fast) var(--ease-out); }
.skip-link:focus { transform: translateY(0); }
.site-shell { overflow: clip; transform: translateY(.75rem); transition: transform 460ms var(--ease-out); }
.is-ready .site-shell { transform: translateY(0); }
.smooth-scroll-content { position: relative; }

.site-header { position: relative; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); max-width: 100rem; margin: 0 auto; padding: 1.25rem var(--page-gutter); }
.brand { display: inline-flex; width: clamp(8.7rem, 15vw, 10.2rem); border-radius: .45rem; transition: transform var(--duration-fast) var(--ease-out); }
.brand:hover { transform: translateY(-2px); }
.brand img { width: 100%; height: auto; }
.site-nav { display: flex; align-items: center; gap: clamp(1rem, 2.8vw, 2.75rem); font-family: var(--font-display); font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.site-nav a { position: relative; text-decoration: none; }
.site-nav a::after { position: absolute; right: 0; bottom: -.4rem; left: 0; height: 2px; background: var(--tomato-500); content: ''; transform: scaleX(0); transform-origin: right; transition: transform var(--duration-fast) var(--ease-out); }
.site-nav a:hover::after, .site-nav a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.menu-button { display: none; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; background: transparent; color: var(--ink-950); cursor: pointer; }
.menu-button svg, .icon { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }

.hero { max-width: 100rem; margin: 0 auto; padding: var(--space-2) var(--page-gutter) var(--space-8); }
.hero-media { position: relative; height: var(--hero-height); overflow: hidden; border-radius: var(--radius-lg); background: var(--ink-950); isolation: isolate; }
.hero-media::after { position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgb(16 14 13 / 84%) 0%, rgb(16 14 13 / 52%) 48%, rgb(16 14 13 / 14%) 100%), linear-gradient(0deg, rgb(16 14 13 / 32%) 0%, transparent 68%); content: ''; }
.hero-media img { width: 100%; height: 100%; min-height: inherit; object-fit: cover; object-position: center 54%; transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.06); transition: transform .42s var(--ease-out); will-change: transform; }
.hero-content { position: absolute; z-index: 2; bottom: clamp(1.5rem, 5vw, 4rem); left: clamp(1.5rem, 5vw, 4.25rem); max-width: 49rem; color: var(--paper-50); }
.eyebrow { margin: 0 0 var(--space-3); font-family: var(--font-display); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hero h1, .section-title { max-width: 14ch; margin: 0; font-family: var(--font-display); font-size: clamp(3.35rem, 7.9vw, 7.9rem); font-weight: 900; letter-spacing: -.07em; line-height: .88; text-wrap: balance; }
.hero-copy { max-width: var(--hero-copy-measure); margin: var(--space-4) 0 var(--space-5); font-size: clamp(1.05rem, 1.4vw, 1.3rem); }
.button-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 3.25rem; padding: .75rem 1.1rem; border: 1px solid transparent; border-radius: var(--radius-sm); font-family: var(--font-display); font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; transition: background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out); }
.button:hover { box-shadow: var(--shadow-soft); transform: translateY(-3px); }
.button:active { transform: translateY(-1px); }
.button-primary { background: var(--tomato-500); color: var(--paper-50); }
.button-primary:hover { background: #cf301e; }
.button-quiet { border-color: rgb(255 253 248 / 68%); color: var(--paper-50); }
.button-quiet:hover { background: var(--paper-50); color: var(--ink-950); }

.intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, .72fr); gap: var(--space-6); max-width: 84rem; margin: 0 auto; padding: 0 var(--page-gutter) var(--space-8); }
.intro-lead { margin: 0; font-family: var(--font-text); font-size: clamp(1.8rem, 3vw, 3.2rem); line-height: 1.08; text-wrap: balance; }
.intro-aside { align-self: end; padding-left: var(--space-4); border-left: 3px solid var(--tomato-500); color: var(--ink-700); }
.intro-aside p { margin: 0; }

.ink-section { background: var(--ink-950); color: var(--paper-50); }
.services { display: grid; grid-template-columns: 1.05fr .95fr; gap: var(--space-7); max-width: 100rem; margin: 0 auto; padding: var(--space-8) var(--page-gutter); }
.section-kicker { margin: 0 0 var(--space-3); color: var(--tomato-700); font-family: var(--font-display); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.ink-section .section-kicker, .hours .section-kicker { color: var(--tomato-300); }
.section-title { font-size: clamp(2.8rem, 5.8vw, 6.1rem); }
.section-text { max-width: 36rem; margin: var(--space-4) 0 0; font-size: 1.13rem; }
.service-list { display: grid; align-content: center; gap: 0; margin: 0; padding: 0; list-style: none; }
.service-list li { display: grid; grid-template-columns: 2.5rem 1fr; gap: var(--space-3); padding: var(--space-4) 0; border-top: 1px solid rgb(255 253 248 / 21%); }
.service-list li:last-child { border-bottom: 1px solid rgb(255 253 248 / 21%); }
.service-number { color: var(--sun-400); font-family: var(--font-display); font-size: .88rem; font-weight: 800; }
.service-list h3 { margin: 0 0 .15rem; font-family: var(--font-display); font-size: 1.1rem; }
.service-list p { margin: 0; color: #dfd8cc; }

.gallery { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(16rem, .9fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; max-width: 100rem; margin: 0 auto; padding: var(--space-8) var(--page-gutter); }
.gallery-photo { overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); }
.gallery-photo img { aspect-ratio: 1.18; width: 100%; object-fit: cover; transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.05); transition: transform .42s var(--ease-out); will-change: transform; }
.gallery-content .section-title { max-width: 10ch; }
.gallery-content p:not(.section-kicker) { max-width: 32rem; margin: var(--space-4) 0 0; font-size: 1.15rem; }
.source-note { margin-top: var(--space-4) !important; color: var(--ink-700); font-family: var(--font-display); font-size: .75rem !important; font-weight: 700; letter-spacing: .04em; }

.visit-panel { display: grid; grid-template-columns: minmax(18rem, .8fr) minmax(0, 1.2fr); gap: var(--space-6); max-width: 100rem; margin: 0 auto; padding: 0 var(--page-gutter) var(--space-8); }
.visit-card { padding: clamp(1.5rem, 4vw, 3rem); border-radius: var(--radius-lg); background: var(--paper-100); }
.visit-card h2, .hours h2 { margin: 0; font-family: var(--font-display); font-size: clamp(2.25rem, 4vw, 4.25rem); letter-spacing: -.06em; line-height: .93; }
.address { margin: var(--space-4) 0; font-size: 1.15rem; font-style: normal; }
.text-link { display: inline-flex; align-items: center; gap: .55rem; font-family: var(--font-display); font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.text-link:hover { color: var(--tomato-500); }
.hours { padding: clamp(1.5rem, 4vw, 3rem); border-radius: var(--radius-lg); background: var(--ink-950); color: var(--paper-50); }
.hours-list { display: grid; grid-template-columns: 1fr auto; gap: 0 var(--space-4); margin: var(--space-4) 0 0; font-family: var(--font-display); }
.hours-list dt, .hours-list dd { padding: .55rem 0; border-top: 1px solid rgb(255 253 248 / 20%); }
.hours-list dd { margin: 0; font-weight: 700; text-align: right; }
.hours-list .closed { color: #c9c0b2; }
.hours-source { margin: var(--space-4) 0 0; color: #dfd8cc; font-size: .9rem; }
.hours-source a { color: var(--paper-50); }

.online { position: relative; max-width: 100rem; margin: 0 auto var(--space-8); padding: 0 var(--page-gutter); }
.online-inner { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(15rem, .9fr) auto; gap: var(--space-6); align-items: end; padding: var(--panel-pad); overflow: hidden; border-radius: var(--radius-lg); background: var(--sun-400); }
.panel-bookmark { align-self: start; justify-self: end; width: var(--bookmark-width); aspect-ratio: 25 / 72; margin-top: calc(-1 * var(--panel-pad)); background: var(--tomato-500); clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 83.34%, 0 100%); }
.online h2 { position: relative; z-index: 1; max-width: 10ch; margin: 0; font-family: var(--font-display); font-size: clamp(2.8rem, 5vw, 5.5rem); letter-spacing: -.07em; line-height: .88; }
.online .section-kicker { color: var(--ink-950); }
.online-copy { position: relative; z-index: 1; max-width: 31rem; margin: 0; font-size: 1.18rem; }
.online .button { position: relative; z-index: 1; margin-top: var(--space-4); background: var(--ink-950); color: var(--paper-50); }
.online .button:hover { background: #000; }

.site-footer { display: grid; grid-template-columns: 1fr auto; gap: var(--space-4); align-items: center; max-width: 100rem; margin: 0 auto; padding: var(--space-5) var(--page-gutter) var(--space-6); border-top: 1px solid var(--line-soft); color: var(--ink-700); font-size: .88rem; }
.site-footer p { margin: 0; }
.footer-nav { display: flex; flex-wrap: wrap; justify-content: end; gap: var(--space-3); }
.footer-nav a:hover { color: var(--tomato-500); }
.back-to-top { position: fixed; z-index: 9; right: var(--floating-control-offset); bottom: calc(var(--floating-control-offset) + env(safe-area-inset-bottom)); display: inline-grid; width: var(--back-to-top-size); height: var(--back-to-top-size); place-items: center; border-radius: 50%; background: var(--tomato-500); box-shadow: var(--shadow-soft); color: var(--paper-50); opacity: 0; pointer-events: none; text-decoration: none; transform: translate3d(0, var(--space-2), 0) scale(.92); visibility: hidden; transition: background var(--duration-fast) var(--ease-out), opacity var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out), visibility var(--duration-base) var(--ease-out); }
.back-to-top[data-visible='true'] { opacity: 1; pointer-events: auto; transform: translate3d(0, 0, 0) scale(1); visibility: visible; }
.back-to-top[data-visible='true']:hover { background: var(--tomato-700); transform: translate3d(0, -3px, 0) scale(1); }
.back-to-top[data-visible='true']:active { transform: translate3d(0, -1px, 0) scale(1); }

:focus-visible { outline: 3px solid var(--tomato-500); outline-offset: 4px; }
@media (min-width: 48.0625rem) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.has-smooth-scroll { scroll-behavior: auto; }
  html.has-smooth-scroll .site-shell { overflow: visible; transform: none; transition: none; }
  html.has-smooth-scroll .site-header { position: fixed; z-index: 20; top: 0; right: 0; left: 0; width: 100%; background: var(--paper-50); }
  html.has-smooth-scroll .smooth-scroll-content { position: fixed; top: 0; left: 0; width: 100%; padding-top: var(--smooth-header-height, 6rem); transform: translate3d(0, 0, 0); will-change: transform; }
}
@media (max-width: 44rem) {
  .site-header { padding-top: .9rem; }
  .menu-button { display: inline-grid; place-items: center; }
  .menu-button svg { width: var(--menu-icon-size); height: var(--menu-icon-size); }
  .site-nav { position: absolute; top: calc(100% - .25rem); right: var(--page-gutter); left: var(--page-gutter); display: grid; gap: 0; overflow: hidden; border-radius: var(--radius-md); background: var(--ink-950); box-shadow: var(--shadow-lift); opacity: 0; pointer-events: none; transform: translateY(-.75rem); visibility: hidden; transition: opacity var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out), visibility var(--duration-fast) var(--ease-out); }
  .site-nav[data-open='true'] { opacity: 1; pointer-events: auto; transform: translateY(0); visibility: visible; }
  .site-nav a { padding: 1rem 1.25rem; color: var(--paper-50); }
  .site-nav a::after { right: auto; bottom: .5rem; left: 1.25rem; width: 2rem; }
  .hero { padding-bottom: var(--space-7); }
  .hero-media::after { background: linear-gradient(0deg, rgb(16 14 13 / 88%) 0%, rgb(16 14 13 / 48%) 58%, rgb(16 14 13 / 12%) 100%); }
  .hero-content { right: 1.5rem; }
  .intro, .services, .gallery, .visit-panel, .online-inner { grid-template-columns: 1fr; gap: var(--space-5); }
  .intro { padding-bottom: var(--space-7); }
  .services, .gallery { padding-block: var(--space-7); }
  .gallery-photo { order: 2; }
  .online-inner { row-gap: var(--space-4); }
  .panel-bookmark { order: -1; width: 2.4rem; }
  .hours-list { gap: 0; margin-top: var(--space-3); border-top: 1px solid rgb(255 253 248 / 20%); }
  .hours-list dt, .hours-list dd { padding: .42rem var(--space-3) .42rem 0; border-top: 0; }
  .hours-list dd { padding-right: 0; }
  .site-footer { grid-template-columns: 1fr; }
  .footer-nav { justify-content: start; }
}
@media (max-width: 27rem) {
  .hero h1 { font-size: clamp(3rem, 17vw, 4.5rem); }
  .button-row { display: grid; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .hero-media img, .gallery-photo img { transform: scale(1.03); }
}