:root{
  --bg: #fbf8f3;
  --bg-alt: #f3efe8;
  --surface: rgba(255, 255, 255, 0.84);
  --surface-strong: #ffffff;
  --ink: #111111;
  --muted: #67605a;
  --line: rgba(17, 17, 17, 0.12);
  --line-strong: rgba(17, 17, 17, 0.22);
  --accent: #b58c61;
  --accent-soft: #d8c4aa;
  --accent-cool: #7d8b86;
  --shadow: 0 24px 80px rgba(27, 20, 14, 0.09);
  --max: 1360px;
}

*,
*::before,
*::after{
  box-sizing: border-box;
}

html{
  scroll-behavior: smooth;
  scroll-padding-top: 24px;
  scrollbar-gutter: stable;
}

@media (prefers-reduced-motion: reduce){
  html{
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Do not spend CPU/GPU time animating a page that is not visible. */
body.is-page-hidden *,
body.is-page-hidden *::before,
body.is-page-hidden *::after{
  animation-play-state: paused !important;
}

body{
  margin: 0;
  color: var(--ink);
  font-family: "Manrope", system-ui, sans-serif;
  color-scheme: light;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.72)),
    radial-gradient(circle at top left, rgba(181, 140, 97, 0.12), transparent 30%),
    radial-gradient(circle at 84% 10%, rgba(125, 139, 134, 0.08), transparent 24%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-alt) 100%);
  min-height: 100vh;
  overflow-x: hidden;
  overscroll-behavior-y: none;
  -webkit-text-size-adjust: 100%;
}

.demo-notice{
  position:fixed;
  inset:0;
  z-index:2200;
  display:grid;
  place-items:center;
  padding:24px;
}

.demo-notice__backdrop{
  position:absolute;
  inset:0;
  background:rgba(25,22,19,.52);
  backdrop-filter:blur(8px);
  animation:demo-notice-fade .22s ease both;
}

.demo-notice__card{
  position:relative;
  z-index:1;
  width:min(100%,520px);
  padding:38px 48px 42px;
  border:1px solid rgba(181,140,97,.35);
  background:linear-gradient(145deg,#fffdf9,#f7f0e6);
  box-shadow:0 28px 90px rgba(22,17,12,.28);
  text-align:center;
  animation:demo-notice-rise .32s cubic-bezier(.2,.8,.2,1) both;
}

.demo-notice__logo{
  display:block;
  width:auto;
  max-width:190px;
  height:58px;
  margin:0 auto 26px;
  object-fit:contain;
}

.demo-notice__wordmark{
  margin:0 auto 26px;
  color:var(--ink);
  font:600 1.05rem/1 Fraunces,Georgia,serif;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.demo-notice__close{
  position:absolute;
  top:16px;
  right:16px;
  width:34px;
  height:34px;
  border:1px solid var(--line);
  color:var(--ink);
  background:transparent;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}

.demo-notice__eyebrow{
  color:var(--accent);
  font-size:11px;
  font-weight:800;
  letter-spacing:.22em;
  text-transform:uppercase;
}

.demo-notice__mark{
  position:relative;
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  margin:22px auto 20px;
  border:1px solid var(--accent);
  border-radius:0;
  overflow:hidden;
}

.demo-notice__mark::before,
.demo-notice__mark::after{
  content:"";
  position:absolute;
  border:1px solid var(--accent);
}

.demo-notice__mark::before{
  width:28px;
  height:28px;
}

.demo-notice__mark::after{
  width:15px;
  height:15px;
}

.demo-notice__card h2{
  margin:0 0 16px;
  font:600 clamp(1.9rem,4vw,2.7rem)/1 Fraunces,Georgia,serif;
  letter-spacing:-.035em;
  white-space:nowrap;
}

.demo-notice__card p{
  max-width:390px;
  margin:0 auto 28px;
  color:var(--muted);
  font-size:.88rem;
  line-height:1.75;
}

.demo-notice__button{
  border:0;
  padding:14px 22px;
  color:#fff;
  background:var(--ink);
  font:800 .7rem/1 Manrope,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
}

.demo-notice.is-closing .demo-notice__backdrop{animation:demo-notice-fade-out .22s ease both}
.demo-notice.is-closing .demo-notice__card{animation:demo-notice-drop .22s ease both}

@keyframes demo-notice-fade{from{opacity:0}to{opacity:1}}
@keyframes demo-notice-fade-out{from{opacity:1}to{opacity:0}}
@keyframes demo-notice-rise{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes demo-notice-drop{from{opacity:1;transform:none}to{opacity:0;transform:translateY(10px) scale(.98)}}

@media (max-width:560px){
  .demo-notice{padding:16px}
  .demo-notice__card{padding:38px 24px 30px}
  .demo-notice__card h2{font-size:2.3rem;white-space:normal}
}

body.has-admin-toolbar{
  padding-top: 48px;
}

body.has-admin-toolbar .topbar{
  top: 48px;
}

.public-admin-toolbar{
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000;
  color: #fff;
  background: #171411;
  box-shadow: 0 5px 18px rgba(17, 13, 10, .18);
}

.public-admin-toolbar__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: min(calc(100% - 32px), var(--max));
  min-height: 48px;
  margin: 0 auto;
  font-size: .72rem;
}

.public-admin-toolbar__left,
.public-admin-toolbar__right{
  display: flex;
  align-items: center;
  gap: 16px;
}

.public-admin-toolbar a{
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.public-admin-toolbar a:hover{color: var(--accent-soft);}

.public-admin-toolbar__right span{
  color: rgba(255,255,255,.68);
}

.public-admin-toolbar__preview{
  color: #e4c39c;
  font-size: .66rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Keep the signed-in preview bar full-width and readable on narrow screens. */
.public-admin-toolbar{
  width: 100%;
  max-width: none;
  left: 0;
  right: 0;
}

@media (max-width: 860px){
  body.has-admin-toolbar{
    padding-top: 68px;
  }

  body.has-admin-toolbar .topbar{
    top: 68px;
  }

  .public-admin-toolbar__inner{
    width: calc(100% - 28px);
    min-height: 68px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px 14px;
    padding: 10px 0;
    font-size: .68rem;
  }

  .public-admin-toolbar__left,
  .public-admin-toolbar__right{
    min-width: 0;
    gap: 12px;
  }

  .public-admin-toolbar__left{
    grid-column: 1 / -1;
  }

  .public-admin-toolbar__right{
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .public-admin-toolbar__preview{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (max-width: 420px){
  body.has-admin-toolbar{
    padding-top: 78px;
  }

  body.has-admin-toolbar .topbar{
    top: 78px;
  }

  .public-admin-toolbar__inner{
    min-height: 78px;
    width: calc(100% - 20px);
    gap: 7px;
    padding-block: 9px;
  }

  .public-admin-toolbar__left,
  .public-admin-toolbar__right{
    flex-wrap: wrap;
  }
}

html{
  color-scheme: light;
  background: var(--bg);
}

body.is-loading{
  overflow: hidden;
}

body.is-loading .topbar,
body.is-loading .page,
body.is-loading .footer{
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
}

body.is-loaded .topbar,
body.is-loaded .page,
body.is-loaded .footer{
  transition:
    opacity 420ms ease,
    transform 420ms ease;
}

body::before{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0 49.9%, rgba(17, 17, 17, 0.05) 50%, transparent 50.1%),
    linear-gradient(180deg, transparent 0 49.9%, rgba(17, 17, 17, 0.05) 50%, transparent 50.1%);
  background-size: 68px 68px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.28), transparent 80%);
  z-index: -2;
}

body::after{
  content: "";
  position: fixed;
  right: -12rem;
  top: 8rem;
  width: 28rem;
  height: 28rem;
  border: 1px solid rgba(181, 140, 97, 0.18);
  pointer-events: none;
  transform: rotate(8deg);
  z-index: -1;
}

a{
  color: inherit;
  text-decoration: none;
}

img{
  max-width: 100%;
  display: block;
}

button,
input,
textarea,
select{
  font: inherit;
}

textarea{
  resize: none;
}

button{
  color: inherit;
  background: none;
  border: 0;
}

::selection{
  background: rgba(181, 140, 97, 0.2);
}

.page{
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
}

body.maintenance-page{
  display: grid;
  place-items: center;
  padding: 24px;
}

body.maintenance-page .maintenance-shell{
  width: min(calc(100% - 0px), var(--max));
  min-height: calc(100vh - 48px);
  display: grid;
  gap: 18px;
  align-content: center;
}

body.maintenance-page .maintenance-brand{
  width: fit-content;
}

body.maintenance-page .maintenance-panel{
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(220px, 0.82fr);
  gap: 24px;
  align-items: center;
  padding: 42px;
  min-height: min(72vh, 760px);
  border: 1px solid rgba(17, 17, 17, 0.16);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.76)),
    radial-gradient(circle at 14% 18%, rgba(181, 140, 97, 0.11), transparent 24%),
    radial-gradient(circle at 82% 24%, rgba(125, 139, 134, 0.07), transparent 20%),
    linear-gradient(135deg, rgba(181, 140, 97, 0.05), transparent 42%);
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}

body.maintenance-page .maintenance-panel::before{
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(181, 140, 97, 0.11);
  pointer-events: none;
}

body.maintenance-page .maintenance-copy{
  display: grid;
  gap: 16px;
  align-content: start;
  max-width: 46rem;
  z-index: 1;
}

body.maintenance-page .maintenance-copy .section-title{
  max-width: 11ch;
}

body.maintenance-page .maintenance-copy .section-copy{
  max-width: 34ch;
}

body.maintenance-page .maintenance-status{
  width: fit-content;
  padding: 14px 20px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.8rem;
  line-height: 1.2;
  color: var(--accent);
}

body.maintenance-page .maintenance-visual{
  min-height: 100%;
  display: grid;
  place-items: center;
  padding-left: 24px;
  border-left: 1px solid var(--line);
  z-index: 1;
}

body.maintenance-page .maintenance-plate{
  width: min(430px, 100%);
  aspect-ratio: 0.95;
  display: grid;
  place-items: stretch;
  border: 1px solid var(--line);
  background: #fffaf5;
  box-shadow: 0 22px 50px rgba(27, 20, 14, 0.05);
  position: relative;
  overflow: hidden;
}

body.maintenance-page .maintenance-mosaic{
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: 1.12fr 0.78fr 1.06fr;
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas:
    "a b c"
    "d b e";
  gap: 8px;
  padding: 12px;
  box-sizing: border-box;
}

body.maintenance-page .maintenance-shot{
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(181, 140, 97, 0.16);
  background: #f6efe7;
}

body.maintenance-page .maintenance-shot img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

body.maintenance-page .maintenance-shot--hero{
  grid-area: a;
}

body.maintenance-page .maintenance-shot--tall{
  grid-area: b;
}

body.maintenance-page .maintenance-shot--featured{
  grid-area: c;
}

body.maintenance-page .maintenance-shot--wide{
  grid-area: d;
}

body.maintenance-page .maintenance-shot--soft{
  grid-area: e;
}

body.maintenance-page .maintenance-plate::after{
  content: "";
  position: absolute;
  inset: auto 18px 18px 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(181, 140, 97, 0.22), transparent);
}

body.maintenance-page .maintenance-illustration{
  width: 100%;
  height: 100%;
  display: block;
}

body.maintenance-page .maintenance-number{
  font-family: "Fraunces", serif;
  font-size: clamp(5rem, 12vw, 8rem);
  line-height: 0.9;
  letter-spacing: -0.1em;
  color: var(--accent);
  z-index: 1;
}

body.maintenance-page .maintenance-plate p{
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.68rem;
  color: var(--muted);
  z-index: 1;
}

body.maintenance-page .card-actions{
  margin-top: 2px;
}

@media (max-width: 960px) {
  body.maintenance-page .maintenance-panel{
    grid-template-columns: 1fr;
    min-height: auto;
    padding: 28px 22px;
  }

  body.maintenance-page .maintenance-visual{
    padding-left: 0;
    padding-top: 10px;
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  body.maintenance-page .maintenance-plate{
    width: min(100%, 380px);
  }

  body.maintenance-page .maintenance-mosaic{
    grid-template-columns: 1.08fr 0.74fr 1.02fr;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  body.maintenance-page{
    padding: 16px;
  }

  body.maintenance-page .maintenance-shell{
    min-height: calc(100vh - 32px);
  }

  body.maintenance-page .maintenance-copy .section-title{
    max-width: 100%;
  }

  body.maintenance-page .maintenance-copy .section-copy{
    max-width: 100%;
  }

  body.maintenance-page .maintenance-plate{
    aspect-ratio: 1;
  }

  body.maintenance-page .maintenance-mosaic{
    grid-template-columns: 1fr 0.72fr 1fr;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  }
}

.site-loader{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  background: var(--bg);
  transition: opacity 360ms ease, visibility 360ms ease;
}

.site-loader.is-hidden{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.site-loader__frame{
  display: grid;
  justify-items: center;
  gap: 18px;
}

.site-loader__mark{
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(181, 140, 97, 0.32);
  border-radius: 50%;
  animation: loader-rotate 1.1s linear infinite;
}

.site-loader__mark::before,
.site-loader__mark::after,
.site-loader__mark span{
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid var(--accent);
  transform: rotate(45deg);
}

.site-loader__mark::after{
  inset: 15px;
  border-color: rgba(17, 17, 17, 0.24);
  transform: rotate(0deg);
}

.site-loader__mark span{
  inset: 20px;
  border: 0;
  background: var(--ink);
  transform: rotate(45deg);
}

.site-loader__copy{
  display: grid;
  justify-items: center;
  gap: 8px;
}

.site-loader__copy .eyebrow::before{
  display: none;
}

.site-loader__copy strong{
  font-family: "Fraunces", serif;
  font-size: clamp(1.6rem, 4vw, 2.5rem);
  line-height: 0.95;
}

.site-loader__line{
  display: block;
  position: relative;
  width: 110px;
  height: 1px;
  overflow: hidden;
  background: rgba(17, 17, 17, 0.14);
}

.site-loader__line span{
  display: block;
  width: 38px;
  height: 1px;
  background: var(--accent);
  animation: loader-line 1.25s ease-in-out infinite;
}

@keyframes loader-rotate {
  to{
    transform: rotate(360deg);
  }
}

@keyframes loader-line {
  0%{
    transform: translateX(-40px);
  }
  100%{
    transform: translateX(110px);
  }
}

.topbar{
  position: sticky;
  top: 0;
  z-index: 50;
  padding-top: 16px;
  transition: none;
}

.topbar.is-scrolled{
  padding-top: 16px;
}

.topbar-inner{
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 12px 16px;
  border: 1px solid rgba(17, 17, 17, 0.08);
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 10px 38px rgba(22, 18, 14, 0.08);
  transform: translateY(0);
  transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.topbar.is-scrolled .topbar-inner{
  transform: translateY(-16px);
}

.brand{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: max-content;
}

.brand-mark{
  width: 42px;
  height: 42px;
  border: 1px solid var(--line-strong);
  border-radius: 2px;
  position: relative;
  background:
    linear-gradient(135deg, rgba(181, 140, 97, 0.24), transparent 42%),
    linear-gradient(180deg, #ffffff, #f0e8dd);
}

.brand-mark::before,
.brand-mark::after{
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(17, 17, 17, 0.16);
}

.brand-mark::after{
  inset: 13px;
  border-color: rgba(181, 140, 97, 0.26);
}

.brand-copy{
  display: grid;
  line-height: 1.05;
  margin-left: -2px;
}

.brand-copy strong{
  font-family: "Fraunces", serif;
  font-size: 1.08rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.brand-copy span{
  color: var(--muted);
  font-size: 0.76rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  margin-top: 3px;
}

.nav-toggle{
  display: none;
  width: 48px;
  height: 48px;
  border: 1px solid var(--line);
  border-radius: 2px;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.65);
}

.nav-toggle span{
  position: relative;
  display: block;
  width: 18px;
  height: 1.5px;
  background: var(--ink);
  transition: background-color 260ms ease;
}

.nav-toggle span::before,
.nav-toggle span::after{
  content: "";
  position: absolute;
  left: 0;
  width: 18px;
  height: 1.5px;
  background: var(--ink);
  transition: top 260ms ease, transform 260ms ease, background-color 260ms ease;
}

.nav-toggle span::before{
  top: -6px;
}

.nav-toggle span::after{
  top: 6px;
}

body.menu-open .nav-toggle span{
  background: transparent;
}

body.menu-open .nav-toggle span::before{
  top: 0;
  transform: rotate(45deg);
}

body.menu-open .nav-toggle span::after{
  top: 0;
  transform: rotate(-45deg);
}

.nav{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0;
  flex-wrap: wrap;
}

.nav a{
  padding: 10px 14px;
  border-left: 1px solid var(--line);
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--muted);
  transition: 180ms ease;
}

.nav a:last-child{
  border-right: 1px solid var(--line);
}

.nav a:hover,
.nav a.is-active{
  color: var(--ink);
  background: rgba(181, 140, 97, 0.07);
}

.nav-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 16px !important;
  background: var(--ink);
  color: #f8f3ed !important;
  border-left: 0 !important;
}

.nav a.nav-cta{
  background: var(--ink);
  color: #f8f3ed;
  border-left: 0;
}

.nav a.nav-cta:hover,
.nav a.nav-cta.is-active{
  background: #27211d;
  color: #f8f3ed;
}

.hero,
.section{
  padding: 24px 0;
}

.frame{
  position: relative;
  border: 1px solid rgba(17, 17, 17, 0.08);
  background: rgba(255, 255, 255, 0.6);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.frame::before,
.frame::after{
  content: "";
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(17, 17, 17, 0.06);
  pointer-events: none;
}

.frame::after{
  inset: 20px 20px auto auto;
  width: 34%;
  height: 34%;
  border-left: 1px solid rgba(181, 140, 97, 0.14);
  border-bottom: 1px solid rgba(181, 140, 97, 0.14);
}

.hero-frame{
  min-height: 0;
}

.hero-grid{
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.94fr);
  gap: 0;
  align-items: stretch;
  min-height: 580px;
}

.hero-copy{
  padding: 38px 30px 26px;
  display: grid;
  align-content: center;
  gap: 18px;
  min-height: 0;
}

.eyebrow{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-size: 0.7rem;
  color: var(--accent);
}

.eyebrow::before{
  content: "";
  width: 44px;
  height: 1px;
  background: currentColor;
}

.hero h1,
.section-title{
  margin: 0;
  font-family: "Fraunces", serif;
  font-weight: 500;
  letter-spacing: -0.05em;
  line-height: 0.9;
}

.hero h1{
  max-width: 8.6ch;
  font-size: clamp(3rem, 5.2vw, 4.8rem);
  line-height: 0.86;
}

.lead{
  max-width: 28rem;
  margin: 0;
  color: var(--muted);
  font-size: 0.96rem;
  line-height: 1.72;
}

.hero-actions,
.section-actions,
.card-actions{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 18px;
  border: 1px solid var(--line-strong);
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.74);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.71rem;
  transition: 180ms ease;
}

.btn:hover{
  transform: translateY(-1px);
  border-color: rgba(181, 140, 97, 0.34);
}

.btn:disabled{
  opacity: 0.45;
  cursor: not-allowed;
  transform: none;
}

.btn-primary{
  background: var(--ink);
  color: #f8f3ed;
  border-color: var(--ink);
}

.btn-ghost{
  background: transparent;
}

.hero-stats{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 0;
}

.stat{
  padding: 14px 14px 13px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.65);
  display: grid;
  gap: 6px;
}

.stat strong{
  font-family: "Fraunces", serif;
  font-size: 1.65rem;
  line-height: 1;
}

.stat span{
  color: var(--muted);
  font-size: 0.8rem;
}

.hero-visual{
  border-left: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(17, 17, 17, 0.04), transparent 24%),
    linear-gradient(135deg, rgba(181, 140, 97, 0.08), transparent 36%),
    linear-gradient(180deg, #faf6ef, #f0e7dc 100%);
  height: auto;
  min-height: 0;
  position: relative;
  overflow: hidden;
  display: grid;
  align-items: stretch;
  padding: 12px;
  align-self: stretch;
}

body:not(.home) .hero-frame{
  min-height: auto;
}

body:not(.home) .hero-grid{
  grid-template-columns: 1fr;
}

body:not(.home) .hero{
  padding: 10px 0 8px;
}

body:not(.home) .hero-copy{
  min-height: auto;
  padding: 16px 18px 14px;
  gap: 10px;
}

body:not(.home) .hero-copy > div:first-child{
  display: grid;
  gap: 10px;
}

body:not(.home) .hero h1{
  max-width: 14ch;
  font-size: clamp(1.75rem, 3vw, 2.4rem);
}

body:not(.home) .hero-stats{
  display: none;
}

body:not(.home) .hero-visual{
  display: none;
}

body:not(.home) .hero-actions{
  margin-top: 6px !important;
}

body:not(.home) .hero .lead{
  max-width: 34rem;
  font-size: 0.88rem;
}

.hero-visual::before,
.hero-visual::after{
  content: none;
}

.hero-gallery{
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  gap: 0;
  min-height: 0;
  height: 100%;
  align-content: stretch;
}

.hero-shot{
  position: relative;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(17, 17, 17, 0.11);
  box-shadow: 0 22px 44px rgba(23, 17, 12, 0.12);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.2));
}

.hero-shot img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(0.97) contrast(1.02);
  transform: scale(1.001);
}

.hero-shot::after{
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 30%),
    linear-gradient(135deg, rgba(17, 17, 17, 0.04), transparent 40%);
  pointer-events: none;
}

.hero-shot.is-placeholder{
  background:
    radial-gradient(circle at 50% 32%, rgba(255, 255, 255, 0.12), transparent 38%),
    linear-gradient(180deg, #4c4c4f, #2b2928 100%);
}

.hero-shot.is-placeholder img{
  opacity: 0;
}

.hero-shot.is-placeholder::before{
  content: "Kép helye";
  position: absolute;
  inset: 14px;
  z-index: 0;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(255, 255, 255, 0.16);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.06), transparent 45%),
    linear-gradient(180deg, rgba(74, 74, 78, 0.94), rgba(29, 28, 28, 0.98));
  color: rgba(255, 255, 255, 0.74);
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.64rem;
}

.hero-shot.is-placeholder::after{
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent 35%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.03), transparent 42%);
}

.hero-shot.is-placeholder figcaption{
  background: rgba(33, 33, 35, 0.78);
  border-color: rgba(255, 255, 255, 0.08);
}

.hero-shot.is-placeholder figcaption span{
  color: rgba(216, 196, 170, 0.86);
}

.hero-shot.is-placeholder figcaption strong{
  color: #f5f0ea;
}

.hero-shot figcaption{
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 10px;
  z-index: 1;
  display: grid;
  gap: 4px;
  padding: 12px 12px 11px;
  border: 1px solid rgba(17, 17, 17, 0.08);
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(8px);
}

.hero-shot figcaption span{
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.64rem;
  color: var(--accent);
}

.hero-shot figcaption strong{
  font-family: "Fraunces", serif;
  font-size: 1rem;
  font-weight: 500;
  line-height: 0.95;
}

.hero-shot--wide{
  grid-column: 1 / -1;
  grid-row: 1 / -1;
}

.hair-strip{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.hair-pill{
  padding: 10px 14px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.76);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.68rem;
}

.section-frame{
  padding: 28px;
}

.section-head{
  display: grid;
  gap: 10px;
  margin-bottom: 22px;
}

.section-title{
  font-size: clamp(2rem, 4.5vw, 4rem);
}

.section-copy{
  margin: 0;
  max-width: 46rem;
  color: var(--muted);
}

.error-panel{
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(220px, 0.8fr);
  gap: 24px;
  align-items: center;
  margin-top: 10px;
}

.error-copy{
  display: grid;
  gap: 14px;
  align-content: start;
}

.error-copy .section-title{
  max-width: 10ch;
}

.error-copy .section-copy{
  max-width: 36ch;
}

.error-mark{
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  padding: 28px 18px;
  border: 1px solid var(--line);
  background:
    radial-gradient(circle at 50% 18%, rgba(181, 140, 97, 0.14), transparent 34%),
    rgba(255, 255, 255, 0.74);
}

.error-mark span{
  font-family: "Fraunces", serif;
  font-size: clamp(4.4rem, 12vw, 7.5rem);
  line-height: 0.9;
  letter-spacing: -0.08em;
  color: var(--accent);
}

.error-mark small{
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--muted);
  font-size: 0.68rem;
  text-align: center;
}

.grid-3,
.grid-4,
.split-grid,
.product-grid{
  display: grid;
  gap: 16px;
}

.grid-3{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-4{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.split-grid{
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.card{
  padding: 22px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.76);
  border-radius: 0;
  display: grid;
  gap: 12px;
  min-height: 100%;
}

.card h3,
.card h4,
.panel-title{
  margin: 0;
  font-family: "Fraunces", serif;
  line-height: 0.95;
  font-weight: 500;
}

.card h3{
  font-size: 1.9rem;
}

.card p,
.muted,
.list li{
  color: var(--muted);
}

.section-head--compact{
  margin-bottom: 16px;
}

.kicker{
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.7rem;
  color: var(--accent);
}

.line-list,
.list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

.line-list li,
.list li{
  display: flex;
  gap: 10px;
  align-items: start;
}

.line-list li::before,
.list li::before{
  content: "";
  width: 14px;
  height: 1px;
  background: var(--accent);
  margin-top: 0.7em;
  flex: 0 0 auto;
}

.feature-band{
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: 16px;
}

.feature-block{
  padding: 28px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.78);
  min-height: 100%;
  position: relative;
  overflow: hidden;
}

.feature-block::before{
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(17, 17, 17, 0.06);
  pointer-events: none;
}

.feature-block h3{
  margin: 12px 0 10px;
  font-family: "Fraunces", serif;
  font-size: clamp(2rem, 4vw, 3.8rem);
  line-height: 0.9;
  max-width: 11ch;
}

.feature-block p{
  margin: 0;
  color: var(--muted);
  max-width: 32rem;
}

.feature-side{
  padding: 28px;
  border: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(17, 17, 17, 0.96), rgba(39, 31, 24, 0.94)),
    linear-gradient(135deg, rgba(181, 140, 97, 0.22), transparent 24%);
  color: #f7f2eb;
  display: grid;
  align-content: end;
  min-height: 100%;
}

.feature-side h3{
  margin: 0 0 10px;
  font-family: "Fraunces", serif;
  font-size: 2.35rem;
  line-height: 0.9;
}

.feature-side p{
  margin: 0;
  color: rgba(247, 242, 235, 0.78);
}

.story-card,
.product-card{
  padding: 22px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.76);
}

body.modal-open{
  overflow: hidden;
}

.price{
  font-family: "Fraunces", serif;
  line-height: 1;
  font-size: 2rem;
  color: var(--accent);
}

.chip{
  padding: 11px 14px;
  border: 1px solid var(--line-strong);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.78);
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.7rem;
  transition: 180ms ease;
}

.chip:hover,
.chip.is-active{
  color: var(--ink);
  border-color: rgba(181, 140, 97, 0.36);
  background: rgba(181, 140, 97, 0.08);
}

.metric{
  min-width: 8.75rem;
  padding: 14px 16px;
  border: 1px solid rgba(181, 140, 97, 0.18);
  background: rgba(255, 255, 255, 0.82);
  display: grid;
  gap: 6px;
  box-shadow: 0 8px 18px rgba(181, 140, 97, 0.05);
  transition:
    transform 240ms ease,
    box-shadow 240ms ease,
    border-color 240ms ease;
  animation: metric-float 5.5s ease-in-out infinite;
}

.metric:nth-child(2){
  animation-delay: 280ms;
}

.metric:hover{
  transform: translateY(-3px);
  border-color: rgba(181, 140, 97, 0.3);
  box-shadow: 0 14px 26px rgba(181, 140, 97, 0.11);
}

.metric strong{
  font-family: "Fraunces", serif;
  font-size: 2rem;
  line-height: 0.9;
}

.metric span{
  color: var(--muted);
  font-size: 0.82rem;
}

.metric .rating-star{
  color: var(--accent);
  font-size: 0.9em;
  line-height: 0;
  vertical-align: 0.04em;
}

.quote{
  font-family: "Fraunces", serif;
  font-size: 1.1rem;
  line-height: 1.05;
  transition: transform 220ms ease, color 220ms ease;
}

.person{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
}

.avatar{
  width: 50px;
  height: 50px;
  border-radius: 0;
  border: 1px solid var(--line);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.12)),
    linear-gradient(180deg, #d9c1a3, #8f6851);
}

.avatar.alt{
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.12)),
    linear-gradient(180deg, #dbcbb3, #6d5a49);
}

.avatar.third{
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.12)),
    linear-gradient(180deg, #e7c9ba, #a67d68);
}

.person strong{
  display: block;
  margin-bottom: 2px;
}

.person span{
  color: var(--muted);
  font-size: 0.84rem;
}

.product-card{
  display: grid;
  gap: 14px;
  min-height: 100%;
}

.product-art{
  height: 220px;
  border: 1px solid var(--line);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.16)),
    linear-gradient(135deg, #ece1cf, #c3a17f 58%, #7c5e46);
  position: relative;
  overflow: hidden;
}

.product-art::before,
.product-art::after{
  content: "";
  position: absolute;
}

.product-art::before{
  inset: 18px;
  border: 1px solid rgba(17, 17, 17, 0.08);
}

.product-art::after{
  right: 18px;
  bottom: 18px;
  width: 58%;
  height: 1px;
  background: rgba(255, 255, 255, 0.34);
  box-shadow: 0 -24px 0 rgba(255, 255, 255, 0.18), 0 -48px 0 rgba(255, 255, 255, 0.12);
}

.price{
  color: var(--ink);
}

.field label span{
  color: #9f3a3a;
  margin-left: 4px;
}

.section{
  margin-top: 22px;
  margin-bottom: 22px;
}

.form-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.field{
  display: grid;
  gap: 8px;
}

.field.full{
  grid-column: 1 / -1;
}

.footer{
  padding: 16px 0 28px;
}

.footer-card{
  padding: 22px 24px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.68);
}

.footer-card--extended{
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(150px, 0.72fr) minmax(180px, 0.78fr) minmax(170px, 0.72fr);
  gap: 24px 28px;
  align-items: start;
}

.footer-column{
  display: grid;
  gap: 10px;
  align-content: start;
}

.footer-stack{
  justify-items: start;
}

.footer-branding{
  gap: 12px;
}

.footer-brand{
  width: fit-content;
}

.footer-branding p{
  margin: 0;
  max-width: 34ch;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}

.footer-socials{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.footer-social-link{
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--accent);
  background: rgba(255, 255, 255, 0.72);
  transition: transform 180ms ease, border-color 180ms ease, color 180ms ease, background 180ms ease;
}

.footer-social-link i{
  font-size: 15px;
  line-height: 1;
}

.footer-social-link:hover{
  transform: translateY(-1px);
  border-color: rgba(181, 140, 97, 0.4);
  color: var(--ink);
  background: #fff;
}

.footer-social-link--disabled{
  opacity: 0.68;
  background: rgba(255, 255, 255, 0.9);
}

.footer-social-link--disabled:hover{
  transform: none;
  border-color: var(--line);
  color: var(--accent);
  background: rgba(255, 255, 255, 0.9);
}

.footer-pages,
.footer-contact,
.footer-hours{
  gap: 9px;
}

.footer-list{
  display: grid;
  gap: 6px;
  justify-items: start;
}

.footer-pages .footer-label{
  margin-bottom: 2px;
}

.footer-pages .footer-label,
.footer-contact .footer-label,
.footer-hours .footer-label{
  display: block;
  margin-bottom: 2px;
  color: var(--accent);
  opacity: 1;
}

.footer-pages a,
.footer-contact a,
.footer-list span,
.footer-hours span{
  color: var(--ink);
  display: block;
  font-size: 0.92rem;
  line-height: 1.45;
  font-weight: 400;
  letter-spacing: 0;
  opacity: 0.7;
}

.footer-hours .footer-hours__exception{
  color: var(--accent);
  font-weight: 700;
  opacity: 1;
}

.footer-pages a:hover,
.footer-contact a:hover{
  opacity: 1;
}

.footer-label{
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--accent);
  font-size: 0.74rem;
  line-height: 1.2;
}

.footer-nav{
  display: none;
}

.footer-bottom{
  grid-area: bottom;
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.footer-bottom a{
  color: inherit;
}

.footer-bottom a:hover{
  color: var(--ink);
}

.footer-legal{
  margin-top: 12px;
  padding: 12px 22px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.68);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.footer-legal-copy{
  display: grid;
  gap: 3px;
  font-size: 0.8rem;
}

.footer-legal-links{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.footer-legal-links a{
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.74rem;
}

.footer-legal-copy a{
  color: var(--accent) !important;
  font-weight: 700;
  text-decoration: none;
}

.footer-legal-copy a:hover{
  color: #8d623a !important;
}

.footer-legal a{
  color: inherit;
}

.footer-legal a:hover{
  color: var(--ink);
}

.footer small{
  color: var(--muted);
  font-size: 0.8rem;
}

@media (max-width: 1100px) {
  .footer-card--extended{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px 22px;
  }

  .footer-branding{
    grid-column: 1 / -1;
  }
}

.error-page{
  display: grid;
  place-items: center;
  width: 100%;
  padding: 16px 0 24px;
}

.error-document{
  position: relative;
  width: 100%;
  display: grid;
  gap: 0;
  padding: 0;
  border: 1px solid var(--line);
  background:
    radial-gradient(circle at 18% 30%, rgba(181, 140, 97, 0.18), transparent 18%),
    radial-gradient(circle at 84% 18%, rgba(125, 139, 134, 0.14), transparent 16%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.8));
  box-shadow: 0 28px 80px rgba(27, 20, 14, 0.08);
  overflow: hidden;
  animation: error-document-in 650ms cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

.error-document::after{
  content: "";
  position: absolute;
  inset: -35% -20% auto auto;
  width: 22rem;
  height: 22rem;
  background: radial-gradient(circle, rgba(181, 140, 97, 0.18), transparent 68%);
  filter: blur(6px);
  pointer-events: none;
  animation: error-glow-drift 12s ease-in-out infinite alternate;
}

.error-ornament{
  position: absolute;
  inset: auto -10% 12% auto;
  width: 18rem;
  height: 18rem;
  border: 1px solid rgba(181, 140, 97, 0.18);
  transform: rotate(11deg);
  pointer-events: none;
  animation: error-ornament-drift 10s ease-in-out infinite alternate;
}

.error-grid{
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, 0.85fr) minmax(0, 1.15fr);
  align-items: stretch;
}

.error-figure{
  display: grid;
  align-content: center;
  gap: 10px;
  padding: 42px 34px;
  background: linear-gradient(180deg, rgba(17, 17, 17, 0.94), rgba(17, 17, 17, 0.88));
  color: #f8f3eb;
  animation: error-figure-slide 700ms cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

.error-figure__eyebrow{
  text-transform: uppercase;
  letter-spacing: 0.26em;
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.72);
}

.error-figure__code{
  font-family: "Fraunces", Georgia, serif;
  font-size: clamp(5rem, 14vw, 9rem);
  line-height: 0.88;
  letter-spacing: -0.06em;
  animation: error-code-breathe 3.8s ease-in-out infinite;
  transform-origin: center;
}

.error-figure__line{
  width: 5.5rem;
  height: 2px;
  background: var(--accent);
  margin-top: 8px;
}

.error-copy{
  display: grid;
  gap: 14px;
  align-content: center;
  padding: 38px 34px 34px;
  animation: error-copy-rise 700ms cubic-bezier(0.2, 0.9, 0.2, 1) 80ms both;
}

.error-code{
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.72rem;
  color: var(--accent);
}

.error-title{
  margin: 0;
  font-family: "Fraunces", Georgia, serif;
  font-size: clamp(2.4rem, 4.6vw, 4.8rem);
  line-height: 0.96;
  letter-spacing: -0.04em;
  max-width: 10ch;
}

.error-lead,
.error-note{
  margin: 0;
  max-width: 48ch;
  color: var(--muted);
  line-height: 1.8;
  font-size: 1rem;
}

.error-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding-top: 10px;
}

@keyframes error-document-in {
  from{
    opacity: 0;
    transform: translateY(18px) scale(0.985);
  }
  to{
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes error-figure-slide {
  from{
    opacity: 0;
    transform: translateX(-18px);
  }
  to{
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes error-copy-rise {
  from{
    opacity: 0;
    transform: translateY(16px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes error-ornament-drift {
  from{
    transform: rotate(10deg) translate3d(0, 0, 0);
  }
  to{
    transform: rotate(14deg) translate3d(10px, -8px, 0);
  }
}

@keyframes error-code-breathe {
  0%,
100%{
    transform: scale(1);
    filter: drop-shadow(0 0 0 rgba(0, 0, 0, 0));
  }
  50%{
    transform: scale(1.03);
    filter: drop-shadow(0 10px 20px rgba(181, 140, 97, 0.18));
  }
}

@keyframes error-glow-drift {
  from{
    transform: translate3d(-6px, -8px, 0) scale(1);
    opacity: 0.75;
  }
  to{
    transform: translate3d(10px, 12px, 0) scale(1.08);
    opacity: 1;
  }
}

.error-actions .btn{
  transition: transform 200ms ease, box-shadow 200ms ease, background-color 200ms ease, border-color 200ms ease;
}

.error-actions .btn:hover{
  transform: translateY(-2px);
}

@media (max-width: 900px) {
  .error-grid{
    grid-template-columns: 1fr;
  }

  .error-figure,
.error-copy{
    padding: 28px 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .error-document,
.error-ornament,
.error-figure,
.error-copy,
.error-document::after,
.error-figure__code,
.error-actions .btn{
    animation: none;
  }

  .error-actions .btn:hover{
    transform: none;
  }
}

.reveal{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 700ms ease, transform 700ms ease;
}

body.home .reveal{
  transition-duration: 440ms;
}

.reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}

@keyframes metric-float {
  0%,
100%{
    transform: translateY(0);
  }

  50%{
    transform: translateY(-4px);
  }
}

@keyframes star-pop {
  0%{
    opacity: 0;
    transform: scale(0.72) translateY(2px);
  }

  100%{
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

@media (max-width: 1160px) {
  .hero-grid,
.feature-band,
.split-grid{
    grid-template-columns: 1fr;
  }

  .hero-copy,
.hero-visual{
    min-height: 480px;
  }

  .grid-3,
.grid-4{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .page{
    width: min(calc(100% - 20px), var(--max));
  }

  .topbar-inner{
    grid-template-columns: 1fr auto;
  }

  .nav-toggle{
    display: inline-flex;
    justify-self: end;
  }

  .nav{
    position: fixed;
    left: 8px;
    right: 8px;
    top: 78px;
    padding: 14px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: var(--shadow);
    display: grid;
    gap: 0;
    width: auto;
    max-width: none;
    grid-template-columns: 1fr;
    justify-items: stretch;
    transform: translateY(-14px);
    opacity: 0;
    pointer-events: none;
    transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), opacity 300ms ease, visibility 300ms ease;
  }

  body.menu-open .nav{
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }

  .nav a{
    display: flex;
    width: 100%;
    min-width: 0;
    justify-content: center;
    align-items: center;
    border: 0;
    border-top: 1px solid var(--line);
    text-align: center;
  }

  .nav a:last-child{
    border-right: 0;
  }

  .nav-cta{
    margin-top: 8px;
    display: flex !important;
    width: 100% !important;
  }

  .hero,
.section{
    padding: 18px 0;
  }

  .hero-frame{
    min-height: auto;
  }

  .hero-grid{
    min-height: auto;
  }

  .hero-copy,
.hero-visual{
    min-height: 400px;
    padding: 20px 18px;
  }

  .hero h1{
    max-width: 100%;
  }

  .error-panel{
    grid-template-columns: 1fr;
  }

  .error-mark{
    order: -1;
  }

  .hero-visual{
    min-height: 420px;
    padding: 12px;
  }

  .hero-gallery{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    grid-auto-rows: 130px;
    gap: 8px;
  }

  .hero-shot--wide,
.hero-shot--tall,
.hero-shot--small-top,
.hero-shot--small-bottom,
.hero-shot--wide-bottom{
    grid-column: auto;
    grid-row: auto;
  }

  .hero-shot--wide,
.hero-shot--tall{
    grid-row: span 2;
    min-height: 260px;
  }

  .hero-shot--small-top,
.hero-shot--small-bottom{
    min-height: 130px;
  }

  .section-frame{
    padding: 20px;
  }

  .footer-legal{
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 535px) {
  body.has-admin-toolbar{padding-top: 76px;}

  body.has-admin-toolbar .topbar{top: 76px;}

  .public-admin-toolbar__inner{
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-height: 76px;
    padding-block: 8px;
  }

  .footer-card--extended{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .footer-branding{
    grid-column: auto;
  }
}

/* Final responsive override for the public admin toolbar. */
@media (max-width: 860px){
  body.has-admin-toolbar{padding-top:68px;}
  body.has-admin-toolbar .topbar{top:68px;}
  .public-admin-toolbar{width:100%;max-width:none;left:0;right:0;}
  .public-admin-toolbar__inner{width:calc(100% - 28px);min-height:68px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 14px;padding:10px 0;font-size:.68rem;}
  .public-admin-toolbar__left,.public-admin-toolbar__right{min-width:0;display:flex;align-items:center;gap:12px;}
  .public-admin-toolbar__left{grid-column:1 / -1;}
  .public-admin-toolbar__right{grid-column:1 / -1;justify-content:flex-start;}
  .public-admin-toolbar__preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
}

@media (max-width:420px){
  body.has-admin-toolbar{padding-top:78px;}
  body.has-admin-toolbar .topbar{top:78px;}
  .public-admin-toolbar__inner{width:calc(100% - 20px);min-height:78px;gap:7px;padding-block:9px;}
  .public-admin-toolbar__left,.public-admin-toolbar__right{flex-wrap:wrap;}
}

/* Compact preview bar on phones: keep it useful without taking over the page. */
@media (max-width:860px){
  body.has-admin-toolbar{padding-top:46px;}
  body.has-admin-toolbar .topbar{top:46px;}
  .public-admin-toolbar__inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    min-height:46px;
    gap:10px;
    margin:0;
    padding:8px 12px;
    font-size:.62rem;
  }
  .public-admin-toolbar__left,
  .public-admin-toolbar__right{
    display:flex;
    align-items:center;
    flex:0 1 auto;
    gap:9px;
    min-width:0;
  }
  .public-admin-toolbar__right{margin-left:auto;}
  .public-admin-toolbar__preview{display:none;}
}

@media (max-width:420px){
  body.has-admin-toolbar{padding-top:42px;}
  body.has-admin-toolbar .topbar{top:42px;}
  .public-admin-toolbar__inner{
    width:100%;
    min-height:42px;
    gap:8px;
    margin:0;
    padding:7px 10px;
    font-size:.58rem;
  }
  .public-admin-toolbar__left,
  .public-admin-toolbar__right{gap:7px;}
}

@media (max-width:860px){
  .public-admin-toolbar{
    width:100vw;
    max-width:none;
    left:0;
    right:auto;
  }

  .public-admin-toolbar__inner{
    position:relative;
    display:block;
    width:100%;
    min-height:42px;
    margin:0;
    padding:7px 12px;
  }

  .public-admin-toolbar__left,
  .public-admin-toolbar__right{
    position:absolute;
    top:50%;
    display:flex;
    align-items:center;
    gap:8px;
    margin:0;
    transform:translateY(-50%);
    white-space:nowrap;
  }

  .public-admin-toolbar__left{
    left:12px;
  }

  .public-admin-toolbar__right{
    right:12px;
  }
}

/* Shared page rhythm: every public page uses the same shells and spacing. */
:root{
  --page-gutter: clamp(16px, 2.2vw, 32px);
  --section-space: clamp(20px, 2.4vw, 34px);
  --frame-space: clamp(22px, 2.2vw, 30px);
  --card-space: clamp(18px, 1.8vw, 24px);
  --content-gap: clamp(12px, 1.4vw, 18px);
}

.page,
.topbar.page,
.footer.page{
  width: min(calc(100% - (var(--page-gutter) * 2)), var(--max));
}

.hero,
.section{
  padding-block: var(--section-space);
}

.frame{
  border-color: rgba(17, 17, 17, 0.1);
  box-shadow: 0 18px 56px rgba(27, 20, 14, 0.07);
}

.section-frame{
  padding: var(--frame-space);
}

.section-head{
  gap: 8px;
  margin-bottom: var(--content-gap);
}

.section-title{
  margin-block: 0;
  font-size: clamp(1.9rem, 3.8vw, 3.4rem);
  line-height: 0.98;
}

.section-copy{
  font-size: 0.94rem;
  line-height: 1.65;
}

.grid-3,
.grid-4,
.split-grid,
.product-grid{
  gap: var(--content-gap);
}

.card{
  padding: var(--card-space);
}

@media (max-width: 860px) {
  .section-frame{
    padding: 20px;
  }
}

@media (max-width: 640px) {
  :root{
    --page-gutter: 14px;
    --section-space: 16px;
    --frame-space: 16px;
    --card-space: 16px;
    --content-gap: 12px;
  }

  .section-title{
    font-size: clamp(1.8rem, 8vw, 2.6rem);
  }

}

/* Use one predictable cursor and prevent accidental page-text selection. */
html,
body{
  cursor: default;
  user-select: none;
  -webkit-user-select: none;
}

a,
button,
[role="button"],
label,
summary,
select,
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="checkbox"],
input[type="radio"]{
  cursor: pointer;
}

input,
textarea,
[contenteditable="true"]{
  cursor: text;
  user-select: text;
  -webkit-user-select: text;
}

input[type="file"]{
  cursor: pointer;
}
/* Shared form status used by booking and upload flows. */
.booking-submit-status {
  min-height: 54px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.72);
  display: flex;
  align-items: center;
  gap: 12px;
  overflow: hidden;
}

.booking-submit-status:empty {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.booking-submit-status__copy {
  display: grid;
  gap: 2px;
}

.booking-submit-status__copy strong {
  font-family: "Fraunces", serif;
  font-size: 1.02rem;
  line-height: 1;
}

.booking-submit-status__copy span {
  color: var(--muted);
  font-size: 0.82rem;
}