:root {
  --white: #fff;
  --black: #000;
  --charcoal: #1a1a1a;
  --grey: #f5f5f5;
  --muted: #6f6f6f;
  --line: rgba(0, 0, 0, 0.1);
  --serif: "Cormorant Garamond", "Bodoni 72", "Didot", Georgia, serif;
  --sans: Inter, "Helvetica Neue", Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--white);
  color: var(--black);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  text-rendering: geometricPrecision;
}

body.is-loading {
  overflow: hidden;
}

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

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

button {
  border: 0;
  padding: 0;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

:focus-visible {
  outline: 3px solid #a9782a;
  outline-offset: 4px;
}

button:disabled,
.button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.58;
}

.loader {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  background: var(--black);
  color: var(--white);
  transition: opacity 900ms ease, visibility 900ms ease;
}

.loader.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.loader__mark {
  width: min(460px, 70vw);
  height: auto;
}

.loader__line {
  position: absolute;
  bottom: 14vh;
  width: min(280px, 64vw);
  height: 1px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.22);
}

.loader__line::after {
  content: "";
  display: block;
  width: 45%;
  height: 100%;
  background: var(--white);
  animation: loadLine 1.5s ease-in-out infinite;
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  min-height: 82px;
  padding: 1rem clamp(1.25rem, 4vw, 4rem);
  color: var(--white);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0));
  transition: background 350ms ease, min-height 350ms ease, border-color 350ms ease;
}

.site-header.is-scrolled {
  min-height: 68px;
  background: rgba(0, 0, 0, 0.82);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(16px);
}

.brand {
  display: flex;
  align-items: center;
  width: 440px;
  height: 84px;
}

.brand img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
}

.nav {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 3vw, 2.5rem);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.nav a:not(.nav__button) {
  opacity: 0.82;
  transition: opacity 220ms ease;
}

.nav a:hover {
  opacity: 1;
}

.nav-services {
  position: relative;
}

.nav-services__trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  opacity: 0.82;
  transition: opacity 220ms ease;
}

.nav-services__trigger span {
  font-size: 1rem;
  font-weight: 400;
  line-height: 0.8;
  transition: transform 220ms ease;
}

.nav-services:hover .nav-services__trigger,
.nav-services:focus-within .nav-services__trigger,
.nav-services.is-open .nav-services__trigger {
  opacity: 1;
}

.nav-services:hover .nav-services__trigger span,
.nav-services:focus-within .nav-services__trigger span,
.nav-services.is-open .nav-services__trigger span {
  transform: rotate(45deg);
}

.nav-services__menu {
  position: absolute;
  top: calc(100% + 1.15rem);
  right: -1rem;
  display: grid;
  width: 212px;
  padding: 0.45rem;
  background: rgba(10, 10, 10, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.24);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity 220ms ease, visibility 220ms ease, transform 220ms ease;
}

.nav-services:hover .nav-services__menu,
.nav-services:focus-within .nav-services__menu,
.nav-services.is-open .nav-services__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.nav-services__menu a {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.55rem;
  color: var(--white);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: background 220ms ease;
}

.nav-services__menu a:hover {
  background: rgba(255, 255, 255, 0.11);
}

.nav-services__menu img,
.nav-services__placeholder {
  width: 38px;
  height: 32px;
  flex: 0 0 auto;
  object-fit: cover;
}

.nav-services__placeholder {
  display: block;
  background: linear-gradient(135deg, #2c2c2c, #111);
}

.nav__button,
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0.85rem 1.35rem;
  border: 1px solid currentColor;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  line-height: 1;
  text-transform: uppercase;
  transition: background 240ms ease, color 240ms ease, transform 240ms ease, border-color 240ms ease;
}

.nav__button:hover,
.button:hover {
  transform: translateY(-2px);
}

.button:active,
.nav__button:active,
.admin-button:active,
.booking-calendar__nav:active {
  transform: translateY(0);
}

.button--light {
  background: var(--white);
  color: var(--black);
  border-color: var(--white);
}

.button--ghost-light {
  color: var(--white);
  background: transparent;
}

.button--ghost-light:hover {
  background: var(--white);
  color: var(--black);
}

.nav-toggle {
  display: none;
  width: 44px;
  height: 44px;
}

.nav-toggle span {
  display: block;
  width: 24px;
  height: 1px;
  margin: 7px auto;
  background: currentColor;
  transition: transform 240ms ease;
}

/* Admin portal: quotation & invoice management */
.sales-app { min-height: 100vh; display: grid; grid-template-columns: 254px minmax(0, 1fr); background: #f6f6f4; }
.sales-sidebar { display:flex; flex-direction:column; padding:2rem 1.15rem; color:#fff; background:#141414; }
.sales-brand { padding:.2rem .75rem; font-family:var(--serif); font-size:1.4rem; font-weight:700; letter-spacing:.12em; }.sales-brand em{font-weight:400}.sales-caption{margin:2.8rem .75rem 1rem;color:#888;font-size:.65rem;font-weight:700;letter-spacing:.16em}.sales-nav{display:grid;gap:.35rem}.sales-nav button{padding:.75rem;text-align:left;color:#c9c9c9;font-size:.84rem;border-left:2px solid transparent}.sales-nav button:hover,.sales-nav button.is-active{color:#fff;background:#252525;border-left-color:#fff}.sales-logout{margin-top:auto;padding:.8rem .75rem;text-align:left;color:#aaa;font-size:.8rem}.sales-main{min-width:0;padding:clamp(1.25rem,4vw,3.5rem)}.sales-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2.4rem}.sales-header h1{font-size:clamp(2rem,4vw,3.5rem)}.sales-header .eyebrow{margin-bottom:.25rem}.sales-primary{white-space:nowrap}.sales-notice{position:fixed;right:2rem;bottom:2rem;z-index:20;max-width:360px;padding:.85rem 1rem;color:#fff;background:#171717;opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s}.sales-notice.is-visible{opacity:1;transform:none}.sales-notice.is-error{background:#9e2d2d}.sales-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.sales-card{min-height:190px;padding:1.4rem;text-align:left;background:#fff;border:1px solid #e2e2df;box-shadow:0 7px 20px rgba(0,0,0,.05);transition:transform .2s,box-shadow .2s}.sales-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.1)}.sales-card span{display:grid;place-items:center;width:42px;height:42px;margin-bottom:2.3rem;color:#fff;background:#111;border-radius:50%;font-size:1.5rem}.sales-card strong,.sales-card small{display:block}.sales-card strong{font-family:var(--serif);font-size:1.4rem}.sales-card small{margin-top:.3rem;color:#858585}.sales-section{margin-top:2.5rem;padding:1.6rem;background:#fff;border:1px solid #e5e5e1}.section-title{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:1.1rem}.section-title h2,.sales-section h2{font-size:1.65rem}.section-title p{margin:0;color:#777;font-size:.82rem}.sales-tools{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}.sales-search{width:min(380px,100%);padding:.7rem .85rem;background:#fff;border:1px solid #d7d7d3;font:inherit}.sales-table-wrap{overflow:auto;background:#fff;border:1px solid #e3e3df}.sales-table{width:100%;border-collapse:collapse;font-size:.86rem}.sales-table th{padding:.75rem 1rem;color:#777;text-align:left;font-size:.67rem;letter-spacing:.12em;text-transform:uppercase;background:#f5f5f2}.sales-table td{padding:.9rem 1rem;border-top:1px solid #eee}.sales-table small{display:block;margin-top:.2rem;color:#8d8d8d}.status{display:inline-block;padding:.22rem .45rem;font-size:.65rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:#eee}.status--draft,.status--hidden,.status--rejected,.status--cancelled{background:#ededed;color:#666}.status--sent,.status--pending,.status--partially\ paid{background:#fff1c9;color:#896300}.status--accepted,.status--active,.status--paid{background:#dcefe2;color:#276237}.row-actions{display:flex;flex-wrap:wrap;gap:.55rem}.row-actions button{font-size:.74rem;text-decoration:underline}.row-actions .danger,.danger{color:#a12626}.empty-state{padding:3rem;background:#fff;color:#777;text-align:center;border:1px dashed #ccc}.term-list{display:grid;gap:.75rem}.term-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:1rem;align-items:center;padding:1rem;background:#fff;border:1px solid #e3e3df}.term-card p{margin:.3rem 0 0;white-space:pre-line}.drag{color:#999;cursor:grab}.term-type{font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#777}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.form-grid .admin-label:has(textarea){grid-column:span 2}.settings-form .sales-section{margin-top:0}.check-label{display:flex;align-items:center;gap:.55rem}.sales-dialog{width:min(900px,calc(100vw - 2rem));max-height:calc(100vh - 2rem);padding:0;border:0;box-shadow:0 22px 80px rgba(0,0,0,.32)}.sales-dialog::backdrop{background:rgba(0,0,0,.45)}.sales-dialog>div{padding:1.5rem;overflow:auto;max-height:calc(100vh - 2rem);background:#fff}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}.dialog-head h2{font-size:2rem}.dialog-head .eyebrow{margin-bottom:.1rem}.dialog-head button{font-size:2rem;line-height:1}.dialog-actions{display:flex;justify-content:flex-end;gap:.7rem;margin-top:1.5rem}.wizard-steps{display:flex;gap:.4rem;margin-bottom:1.5rem;overflow:auto}.wizard-steps i{flex:1;min-width:92px;padding:.55rem;color:#999;font-style:normal;font-size:.7rem;text-align:center;border-bottom:2px solid #ddd}.wizard-steps i.active{color:#111;border-color:#111}.line-editor{display:grid;gap:.8rem}.line-title{display:flex;align-items:center;justify-content:space-between}.line-title h3{font-size:1.5rem}.small-button{padding:.4rem .6rem;color:#fff;background:#161616;font-size:.75rem}.line-row{display:grid;grid-template-columns:2fr repeat(4,1fr) auto;gap:.55rem;align-items:end;padding:.7rem;background:#f6f6f4}.line-row label{display:grid;gap:.2rem;color:#777;font-size:.68rem;text-transform:uppercase}.line-row input{width:100%;padding:.5rem;border:1px solid #d5d5d0;background:#fff;font:inherit}.charge-row{grid-template-columns:3fr 1fr auto}.danger-icon{width:28px;height:28px;color:#a12626;font-size:1.4rem}.terms-picker{display:grid;gap:.7rem}.terms-picker label{padding:.8rem;background:#f7f7f5;border:1px solid #e5e5e0}.doc-preview{padding:1.3rem;border:1px solid #ddd}.doc-preview table{width:100%;border-collapse:collapse}.doc-preview td{padding:.5rem;border-bottom:1px solid #ddd}.doc-preview td:last-child{text-align:right}.doc-preview .grand td{font-weight:700;border-top:2px solid #111}.muted{color:#777}
@media (max-width: 900px){.sales-app{grid-template-columns:1fr}.sales-sidebar{position:sticky;top:0;z-index:10;display:flex;flex-direction:row;align-items:center;padding:.8rem;background:#141414}.sales-caption{display:none}.sales-nav{display:flex;gap:0;overflow:auto;margin-left:1rem}.sales-nav button{white-space:nowrap;padding:.6rem .65rem;border-left:0;border-bottom:2px solid transparent}.sales-nav button.is-active{border-bottom-color:#fff}.sales-logout{margin:0 0 0 auto}.sales-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.sales-card{min-height:150px}.sales-card span{margin-bottom:1rem}.sales-main{padding:1.25rem}.sales-header{margin-bottom:1.5rem}}
@media (max-width: 560px){.sales-brand{font-size:1rem;padding:0}.sales-nav{margin-left:.5rem}.sales-nav button{font-size:.7rem}.sales-logout{font-size:.7rem;padding:.4rem}.sales-cards{grid-template-columns:1fr}.sales-header{align-items:flex-end}.sales-header .admin-button{font-size:.65rem;padding:.7rem}.sales-tools{flex-direction:column}.form-grid{grid-template-columns:1fr}.form-grid .admin-label:has(textarea){grid-column:auto}.line-row,.charge-row{grid-template-columns:repeat(2,1fr)}.line-row .danger-icon{grid-column:2}.sales-dialog>div{padding:1rem}.sales-table th,.sales-table td{padding:.65rem}.section-title{display:block}.section-title p{margin-top:.25rem}}
.public-document-body{padding:2rem;background:#ececea;font-family:Arial,sans-serif;color:#16253c}.public-document{width:min(920px,100%);min-height:1000px;margin:0 auto;padding:3rem;background:#fff;box-shadow:0 5px 20px rgba(0,0,0,.12)}.public-doc-header,.public-customer,.public-footer{display:flex;justify-content:space-between;gap:2rem}.public-doc-header{padding-bottom:1.5rem;border-bottom:2px solid #8c99a8}.public-doc-header h1{font-family:Arial,sans-serif;font-size:1.55rem;font-weight:700}.public-doc-header h2{font-family:Arial,sans-serif;font-size:1.4rem;font-weight:700}.public-doc-header p,.public-customer p,.public-footer p{margin:.2rem 0;font-size:.86rem;line-height:1.4}.public-doc-header img{max-width:140px;max-height:70px;object-fit:contain}.doc-kind{font-size:1.4rem!important;font-weight:700;text-align:right}.public-customer{padding:1.35rem 0}.public-customer h3,.public-terms h3,.public-footer h3{margin:.2rem 0;font-family:Arial,sans-serif;font-size:.9rem;font-weight:700}.public-customer b{font-size:.75rem}.public-items{width:100%;border-collapse:collapse;font-size:.8rem}.public-items th{padding:.55rem;text-align:left;background:#e6e9ed;border-top:1px solid #8893a0;border-bottom:1px solid #8893a0}.public-items td{padding:.6rem .55rem;vertical-align:top;border-bottom:1px solid #d5d9dd}.public-items td:not(:nth-child(2)){text-align:right}.public-items small{display:block;margin-top:.25rem;color:#555}.public-total{width:min(390px,100%);margin:1rem 0 1rem auto}.public-total p{display:flex;justify-content:space-between;margin:0;padding:.35rem;border-bottom:1px solid #ddd}.public-total .grand-total{font-weight:700;background:#e6e9ed;border-top:2px solid #7d8995}.public-terms{margin-top:2rem;padding-top:1rem;border-top:1px solid #aab2bb}.public-terms ol{padding-left:1.2rem;font-size:.83rem}.public-terms li{margin:.3rem 0}.public-footer{margin-top:3rem;font-size:.86rem}.public-footer>div:last-child{text-align:right}.public-actions{position:fixed;right:2rem;bottom:2rem;display:flex;gap:.5rem}.public-actions button{padding:.8rem 1rem;color:#fff;background:#111;font-weight:700}.public-actions button+button{background:#307a42}@media(max-width:600px){.public-document-body{padding:0;background:#fff}.public-document{padding:1.2rem;box-shadow:none}.public-doc-header,.public-customer,.public-footer{display:block}.public-doc-header>div+div{margin-top:1rem}.public-items{font-size:.68rem}.public-items th,.public-items td{padding:.35rem}.public-actions{right:1rem;bottom:1rem}}@media print{.public-document-body{padding:0;background:#fff}.public-document{width:100%;min-height:0;padding:0;box-shadow:none}.public-actions{display:none}}

.hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  color: var(--white);
  background: var(--black);
}

.hero__slides,
.hero__slide,
.hero__overlay {
  position: absolute;
  inset: 0;
}

.hero__slide {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.05);
  transition: opacity 1400ms ease, transform 6200ms ease;
}

.hero__slide.is-active {
  opacity: 1;
  transform: scale(1.12);
}

.hero__overlay {
  z-index: 1;
  background:
    radial-gradient(circle at center, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.62)),
    linear-gradient(to bottom, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.72));
}

.hero__content {
  position: relative;
  z-index: 2;
  width: min(940px, calc(100% - 2rem));
  padding: 7rem 0 5rem;
  text-align: center;
}

.hero__mark {
  width: min(390px, 68vw);
  height: auto;
  margin: 0 auto 1rem;
}

.eyebrow {
  margin: 0 0 1rem;
  color: currentColor;
  font-size: 0.73rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.72;
}

h1,
h2,
h3 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  line-height: 0.98;
}

h1 {
  max-width: 700px;
  margin-inline: auto;
  font-size: clamp(2rem, 4.5vw, 4.5rem);
  line-height: 1;
}

h2 {
  font-size: clamp(2rem, 4.5vw, 4.5rem);
  line-height: 1.05;
}

h3 {
  font-size: clamp(1.65rem, 3vw, 2.35rem);
}

.hero__content p:not(.eyebrow) {
  max-width: 680px;
  margin: 1.35rem auto 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: clamp(1rem, 1.7vw, 1.22rem);
}

.hero__actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.85rem;
  margin-top: 2.2rem;
}

.scroll-cue {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 2rem;
  width: 28px;
  height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  transform: translateX(-50%);
}

.scroll-cue span {
  display: block;
  width: 3px;
  height: 8px;
  margin: 9px auto 0;
  background: var(--white);
  animation: scrollDot 1.8s ease infinite;
}

.section {
  padding: clamp(5rem, 11vw, 10rem) clamp(1.25rem, 4vw, 4rem);
}

.section__intro {
  width: min(780px, 100%);
  margin-bottom: clamp(2.8rem, 6vw, 5rem);
}

.section__intro p:not(.eyebrow) {
  max-width: 600px;
  margin: 1.2rem 0 0;
  color: var(--muted);
}

.portfolio {
  background: var(--grey);
  padding-left: 0;
  padding-right: 0;
}

.portfolio .section__intro {
  padding-inline: clamp(1.25rem, 4vw, 4rem);
}

.gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(0.7rem, 1.15vw, 1.15rem);
  width: 100%;
}

.gallery__item {
  position: relative;
  aspect-ratio: 5 / 4;
  overflow: hidden;
  background: var(--charcoal);
}

.gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 800ms ease, opacity 800ms ease;
}

.gallery__item:hover img {
  transform: scale(1.045);
  opacity: 0.86;
}

.about {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: clamp(2rem, 6vw, 7rem);
  align-items: center;
}

.about__image {
  min-height: 72vh;
  overflow: hidden;
  background: var(--charcoal);
}

.about__image img {
  width: 100%;
  height: 72vh;
  object-fit: cover;
}

.about__copy p:not(.eyebrow) {
  margin: 1.25rem 0 0;
  color: var(--charcoal);
}
.about-subheading {
  margin-top: 2rem;
  margin-bottom: 0.75rem;
  font-family: var(--sans);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.about__copy .note {
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.94rem;
}

.packages {
  background: var(--black);
  color: var(--white);
}

.packages .section__intro p:not(.eyebrow) {
  color: rgba(255, 255, 255, 0.68);
}

.package-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.package-card {
  display: flex;
  min-height: 520px;
  flex-direction: column;
  padding: clamp(1.35rem, 2.4vw, 2.5rem);
  border-right: 1px solid rgba(255, 255, 255, 0.18);
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.package-card__label {
  margin: 0 0 1rem;
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.package-card p {
  color: rgba(255, 255, 255, 0.72);
}

.package-card ul {
  display: grid;
  gap: 0.75rem;
  margin: 1.6rem 0;
  padding: 0;
  color: rgba(255, 255, 255, 0.78);
  list-style: none;
}

.package-card li {
  padding-top: 0.75rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.package-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
}

.package-card__footer span {
  font-family: var(--serif);
  font-size: 2.2rem;
}

.package-card__footer a {
  white-space: nowrap;
  border-bottom: 1px solid currentColor;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.why {
  background: var(--white);
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}

.feature-card {
  min-height: 280px;
  padding: clamp(1.25rem, 2.4vw, 2.25rem);
  background: var(--white);
}

.feature-card svg,
.socials svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.feature-card h3 {
  margin-top: 2.2rem;
  font-size: clamp(1.45rem, 2.3vw, 2rem);
}

.feature-card p {
  color: var(--muted);
}

.cta {
  position: relative;
  min-height: 78vh;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: var(--white);
  text-align: center;
  isolation: isolate;
}

.cta img,
.cta__overlay {
  position: absolute;
  inset: 0;
}

.cta img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1) contrast(1.08);
}

.cta__overlay {
  z-index: 1;
  background: rgba(0, 0, 0, 0.62);
}

.cta__content {
  position: relative;
  z-index: 2;
  width: min(760px, calc(100% - 2rem));
}

.cta__content p:not(.eyebrow) {
  max-width: 540px;
  margin: 1.25rem auto 2rem;
  color: rgba(255, 255, 255, 0.78);
}

.footer {
  display: grid;
  grid-template-columns: 1.2fr auto auto;
  align-items: center;
  gap: 2rem;
  padding: 3rem clamp(1.25rem, 4vw, 4rem);
  background: var(--black);
  color: var(--white);
}

.footer img {
  width: 190px;
  height: 42px;
  object-fit: contain;
  object-position: left center;
}

.footer p {
  margin: 0.65rem 0 0;
  color: rgba(255, 255, 255, 0.58);
}

.footer nav,
.socials {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}

.footer nav {
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.socials a {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.copyright {
  grid-column: 1 / -1;
  padding-top: 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 0.85rem;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 4rem 1.25rem 1.25rem;
  background: rgba(0, 0, 0, 0.94);
  opacity: 0;
  visibility: hidden;
  transition: opacity 250ms ease, visibility 250ms ease;
}

.lightbox.is-open {
  opacity: 1;
  visibility: visible;
}

.lightbox img {
  max-width: min(1180px, 100%);
  max-height: 86vh;
  object-fit: contain;
}

.lightbox__close {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  min-height: 42px;
  padding: 0 1rem;
  border: 1px solid rgba(255, 255, 255, 0.34);
  color: var(--white);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

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

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

@keyframes loadLine {
  0% {
    transform: translateX(-110%);
  }
  100% {
    transform: translateX(235%);
  }
}

@keyframes scrollDot {
  0%,
  100% {
    opacity: 0;
    transform: translateY(0);
  }
  40% {
    opacity: 1;
  }
  80% {
    opacity: 0;
    transform: translateY(18px);
  }
}

@media (max-width: 1080px) {
  .package-grid,
  .feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about {
    grid-template-columns: 1fr;
  }

  .about__image,
  .about__image img {
    min-height: 58vh;
    height: 58vh;
  }
}

@media (max-width: 760px) {
  .site-header {
    min-height: 72px;
  }

  .nav-toggle {
    display: block;
    position: relative;
    z-index: 22;
  }

  .nav-toggle.is-open span:first-child {
    transform: translateY(4px) rotate(42deg);
  }

  .nav-toggle.is-open span:last-child {
    transform: translateY(-4px) rotate(-42deg);
  }

  .nav {
    position: fixed;
    inset: 0;
    z-index: 21;
    flex-direction: column;
    justify-content: center;
    background: rgba(0, 0, 0, 0.96);
    opacity: 0;
    visibility: hidden;
    transition: opacity 260ms ease, visibility 260ms ease;
  }

  .nav-services {
    position: static;
  }

  .nav-services__trigger {
    padding: 0.5rem;
    font-size: 0.78rem;
  }

  .nav-services__menu {
    position: static;
    width: min(300px, 78vw);
    margin: 0.35rem auto 0;
    opacity: 1;
    visibility: visible;
    transform: none;
    background: rgba(255, 255, 255, 0.08);
    display: none;
  }

  .nav-services.is-open .nav-services__menu {
    display: grid;
  }

  .nav.is-open {
    opacity: 1;
    visibility: visible;
  }

  .brand {
    position: relative;
    z-index: 22;
    width: 148px;
  }

  .hero__actions,
  .package-card__footer,
  .footer,
  .footer nav {
    align-items: stretch;
    flex-direction: column;
  }

  .button,
  .nav__button {
    width: 100%;
  }

  .gallery {
    grid-template-columns: 1fr;
  }

  .gallery__item {
    aspect-ratio: 5 / 4;
  }

  .package-grid,
  .feature-grid,
  .footer {
    grid-template-columns: 1fr;
  }

  .package-card {
    min-height: auto;
  }

  .package-card__footer {
    gap: 0.75rem;
  }

  .footer nav,
  .socials {
    align-items: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

.term-card.is-dragging {
  opacity: 0.45;
  border-style: dashed;
}

/* Mobile navigation: a stable full-screen panel that never overlaps links. */
@media (max-width: 760px) {
  body.nav-open { overflow: hidden; }

  .site-header:has(.nav.is-open) {
    background: transparent;
  }

  .nav {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 108px 1.5rem 2rem;
    overflow-y: auto;
  }

  .nav > a,
  .nav-services__trigger {
    width: 100%;
    padding: 1rem 0;
    color: var(--white);
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-align: center;
    text-transform: uppercase;
  }

  .nav-services { width: 100%; }

  .nav-services__trigger {
    display: flex;
    justify-content: center;
  }

  .nav-services__menu {
    width: 100%;
    margin: 0 0 .6rem;
    border: 1px solid rgba(255,255,255,.18);
  }

  .nav-services__menu a {
    justify-content: center;
    padding: .75rem;
  }

  .nav__button {
    width: 100%;
    margin-top: .6rem;
  }

  .brand { transition: opacity .2s ease; }
  .nav.is-open ~ * { pointer-events: none; }
}

/* A phone held sideways has very little vertical space. Keep every link clear. */
@media (max-width: 760px) and (max-height: 520px) {
  .nav {
    padding: 68px 1.25rem 1rem;
  }

  .nav > a,
  .nav-services__trigger {
    padding: .58rem 0;
    font-size: .72rem;
  }

  .nav-services__menu {
    margin: 0 0 .25rem;
  }

  .nav-services__menu a {
    padding: .45rem;
    font-size: .58rem;
  }

  .nav-services__menu img,
  .nav-services__placeholder {
    width: 28px;
    height: 24px;
  }
}

/* `backdrop-filter` on the header can otherwise constrain a fixed child in Safari. */
@media (max-width: 760px) {
  .nav {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 100svh;
    min-height: 100dvh;
    box-sizing: border-box;
  }

  .nav.is-open {
    display: flex !important;
  }
}