.gallery-page {
  background: var(--color-obsidian-950);
}

.gallery-page .section {
  position: relative;
}

.gallery-page .gallery-hero {
  padding-block: var(--space-11) var(--space-10);
}

.gallery-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: center;
  gap: var(--space-6);
}

.gallery-hero__copy,
.gallery-hero__media,
.gallery-structure__heading,
.gallery-structure__list,
.gallery-occasions__heading,
.gallery-culinary__heading,
.gallery-culinary__copy,
.gallery-culinary__media,
.gallery-cocktail-panel,
.gallery-timeline__heading,
.gallery-timeline__stream,
.gallery-salon__heading,
.gallery-salon__panel,
.gallery-salon__media,
.gallery-principles__heading,
.gallery-principle,
.gallery-process__heading,
.gallery-step,
.gallery-faq__heading,
.gallery-faq__list,
.gallery-cta__outer {
  min-width: 0;
}

.gallery-hero__copy {
  grid-column: 1 / span 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
}

.gallery-hero__copy .eyebrow,
.gallery-hero__copy h1,
.gallery-hero__copy p {
  margin: 0;
}

.gallery-hero__copy h1 {
  max-width: 42.5rem;
  font-size: clamp(3rem, 5.6vw, 4.5rem);
  line-height: 0.97;
}

.gallery-hero__lead {
  max-width: 35rem;
  color: var(--color-mist);
  font-size: var(--text-lead);
  line-height: var(--leading-lead);
}

.gallery-hero__location {
  width: 100%;
  padding-top: var(--space-3);
  border-top: var(--border-quiet);
  color: var(--color-brass);
  font-size: var(--text-utility);
  letter-spacing: 0.08em;
}

.gallery-hero__action {
  width: auto;
}

.gallery-hero__media {
  grid-column: 2 / span 1;
  width: 100%;
  margin-top: var(--space-7);
  aspect-ratio: 16 / 10;
  border-radius: var(--radius-lg);
}

.gallery-hero__media img {
  object-position: 72% center;
}

.gallery-structure__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-6);
}

.gallery-structure__heading {
  grid-column: 1 / span 7;
  max-width: 37.5rem;
}

.gallery-structure__heading .lead,
.gallery-occasions__heading .lead,
.gallery-process__heading .lead,
.gallery-timeline__heading .lead {
  margin-bottom: 0;
}

.gallery-structure__list {
  grid-column: 1 / span 8;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.gallery-layer {
  display: grid;
  grid-template-columns: minmax(3.5rem, 0.8fr) minmax(0, 7.2fr);
  gap: var(--space-4);
  padding-bottom: var(--space-5);
  border-bottom: var(--border-quiet);
}

.gallery-layer__index {
  color: var(--color-brass);
  font-size: var(--text-meta);
  font-weight: 600;
  letter-spacing: 0.14em;
}

.gallery-layer__body {
  max-width: 40rem;
}

.gallery-layer__body h3,
.gallery-layer__body p {
  margin-top: 0;
}

.gallery-layer__body p {
  margin-bottom: 0;
}

.gallery-layer__label {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--color-copper);
  font-size: var(--text-meta);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gallery-layer--copper .gallery-layer__index {
  color: var(--color-copper);
}

.gallery-layer--felt {
  border-left: 2px solid var(--color-felt-green);
  padding-left: var(--space-4);
}

.gallery-layer--felt .gallery-layer__index {
  color: var(--color-brass-bright);
}

.gallery-text-link {
  color: var(--color-white);
  font-weight: 600;
  text-decoration-color: var(--color-brass);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.24em;
  transition: color var(--transition-fast), text-decoration-thickness var(--transition-fast);
}

.gallery-text-link:hover,
.gallery-text-link:focus-visible {
  color: var(--color-brass-bright);
  text-decoration-thickness: 2px;
}

.gallery-occasions__heading {
  max-width: 36.25rem;
  margin-bottom: var(--space-7);
}

.gallery-occasion-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.gallery-occasion-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-5);
}

.gallery-occasion-card h3,
.gallery-occasion-card p {
  margin: 0;
}

.gallery-occasion-card p {
  font-size: var(--text-small);
  line-height: var(--leading-small);
}

.gallery-card-rule {
  width: 3rem;
  height: 1px;
  background: var(--color-brass);
}

.gallery-occasion-card--copper .gallery-card-rule {
  background: var(--color-copper);
}

.gallery-occasion-card--felt {
  border-left: 3px solid var(--color-felt-green);
}

.gallery-culinary__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-6);
  align-items: start;
}

.gallery-culinary__heading {
  grid-column: 1 / span 12;
  max-width: 37rem;
}

.gallery-culinary__copy {
  grid-column: 1 / span 5;
  max-width: 36.875rem;
}

.gallery-culinary__copy p {
  margin-bottom: 0;
}

.gallery-number {
  display: block;
  margin-bottom: var(--space-3);
  color: var(--color-brass);
  font-size: var(--text-meta);
  font-weight: 600;
  letter-spacing: 0.14em;
}

.gallery-culinary__media {
  grid-column: 6 / span 7;
  width: 100%;
  aspect-ratio: 3 / 2;
}

.gallery-culinary__media img {
  object-position: center center;
}

.gallery-cocktail-panel {
  grid-column: 8 / span 5;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-5);
  margin-top: var(--space-5);
}

.gallery-cocktail-panel h3,
.gallery-cocktail-panel p {
  margin: 0;
}

.gallery-cocktail-panel p {
  max-width: 36.875rem;
}

.gallery-cocktail-panel__label {
  color: var(--color-copper);
  font-size: var(--text-meta);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gallery-timeline__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-6);
}

.gallery-timeline__heading {
  grid-column: 1 / span 6;
  max-width: 36.25rem;
}

.gallery-timeline__stream {
  grid-column: 1 / span 8;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.gallery-timeline-item {
  display: grid;
  grid-template-columns: minmax(3.5rem, 1fr) minmax(0, 7fr);
  gap: var(--space-4);
}

.gallery-timeline-item__marker {
  position: relative;
  min-width: 0;
  border-right: 1px solid var(--color-line-brass);
}

.gallery-timeline-item__marker::after {
  position: absolute;
  top: 0;
  right: -0.35rem;
  width: 0.625rem;
  height: 0.625rem;
  border: 1px solid var(--color-brass);
  border-radius: 50%;
  background: var(--color-obsidian-950);
  content: "";
}

.gallery-timeline-item__marker span {
  display: block;
  color: var(--color-brass);
  font-size: var(--text-meta);
  font-weight: 600;
  letter-spacing: 0.1em;
}

.gallery-timeline-item__content {
  max-width: 32.5rem;
  padding-bottom: var(--space-2);
}

.gallery-timeline-item__content h3 {
  margin-top: var(--space-2);
}

.gallery-timeline-item__content p {
  margin-bottom: 0;
  font-size: var(--text-small);
  line-height: var(--leading-small);
}

.gallery-timeline-item--copper .gallery-timeline-item__marker::after {
  border-color: var(--color-copper);
}

.gallery-timeline-item--copper .gallery-timeline-item__marker span {
  color: var(--color-copper);
}

.gallery-timeline-item--felt .gallery-timeline-item__content {
  padding: var(--space-5);
  border: var(--border-accent);
  border-radius: var(--radius-md);
  background: var(--color-felt-green-deep);
}

.gallery-timeline-item--felt .gallery-timeline-item__marker::after {
  border-color: var(--color-felt-green);
  background: var(--color-felt-green);
}

.gallery-salon__outer {
  padding: 0.625rem;
  border: var(--border-accent);
}

.gallery-salon__inner {
  padding: var(--space-6);
  background: var(--color-obsidian-950);
}

.gallery-salon__heading {
  max-width: 37.5rem;
  margin-bottom: var(--space-6);
}

.gallery-salon__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: var(--space-6);
  align-items: stretch;
}

.gallery-salon__panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.gallery-salon__panel h3,
.gallery-salon__panel p,
.gallery-salon__panel h4,
.gallery-salon__panel dl {
  margin: 0;
}

.gallery-salon__panel > p {
  font-size: var(--text-small);
  line-height: var(--leading-small);
}

.gallery-salon__meta {
  color: var(--color-brass-bright);
}

.gallery-terminology {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4);
  border: var(--border-quiet);
  border-radius: var(--radius-md);
  background: var(--color-plum-850);
}

.gallery-terminology h4 {
  font-size: clamp(1.55rem, 2vw, 1.9rem);
}

.gallery-terminology p {
  font-size: var(--text-small);
  line-height: var(--leading-small);
}

.gallery-terminology dl {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.gallery-terminology dl > div {
  min-width: 0;
}

.gallery-terminology dt {
  margin: 0;
  color: var(--color-brass);
  font-size: var(--text-meta);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gallery-terminology dd {
  margin: var(--space-1) 0 0;
  font-size: var(--text-small);
}

.gallery-salon__link {
  margin-top: var(--space-1);
}

.gallery-salon__media {
  width: 100%;
  aspect-ratio: 4 / 3;
}

.gallery-salon__media img {
  object-position: center center;
}

.gallery-principles__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-6);
  align-items: start;
}

.gallery-principles__heading {
  grid-column: 1 / span 5;
  max-width: 32.5rem;
}

.gallery-principle {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.gallery-principle h3,
.gallery-principle p {
  margin: 0;
}

.gallery-principle p {
  max-width: 33.125rem;
}

.gallery-principle__rule {
  width: 3rem;
  height: 1px;
  background: var(--color-brass);
}

.gallery-principle--one {
  grid-column: 1 / span 6;
}

.gallery-principle--two {
  grid-column: 8 / span 5;
  padding: var(--space-5);
  margin-top: var(--space-8);
}

.gallery-principle--three {
  grid-column: 1 / span 6;
}

.gallery-process__heading {
  max-width: 36.875rem;
  margin-bottom: var(--space-7);
}

.gallery-process__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.gallery-step {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-5);
}

.gallery-step h3,
.gallery-step p {
  margin: 0;
}

.gallery-step p {
  font-size: var(--text-small);
  line-height: var(--leading-small);
}

.gallery-step__number {
  color: var(--color-brass);
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
}

.gallery-step--featured {
  border-color: var(--color-brass);
}

.gallery-step--felt {
  border-left: 3px solid var(--color-felt-green);
}

.gallery-faq__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-6);
}

.gallery-faq__heading {
  grid-column: 1 / span 6;
  max-width: 37.5rem;
}

.gallery-faq__list {
  grid-column: 1 / span 8;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.gallery-disclosure {
  min-width: 0;
  border: var(--border-quiet);
  border-radius: var(--radius-md);
  background: var(--color-plum-850);
}

.gallery-disclosure h3 {
  margin: 0;
  font-family: var(--font-body);
  font-size: inherit;
  font-weight: 600;
  letter-spacing: 0;
  line-height: inherit;
}

.gallery-disclosure__button {
  display: flex;
  width: 100%;
  min-height: 3.5rem;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4);
  color: var(--color-white);
  font-size: var(--text-body);
  font-weight: 600;
  line-height: 1.4;
  text-align: left;
}

.gallery-disclosure__button[aria-expanded="true"] {
  color: var(--color-brass-bright);
}

.gallery-disclosure__icon {
  position: relative;
  width: 1rem;
  min-width: 1rem;
  height: 1rem;
}

.gallery-disclosure__icon::before,
.gallery-disclosure__icon::after {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--color-brass);
  content: "";
  transition: transform var(--transition-fast);
}

.gallery-disclosure__icon::after {
  transform: rotate(90deg);
}

.gallery-disclosure__button[aria-expanded="true"] .gallery-disclosure__icon::after {
  transform: rotate(0deg);
}

.gallery-disclosure__panel {
  padding: 0 var(--space-4) var(--space-4);
}

.gallery-disclosure__answer {
  max-width: 38.75rem;
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-brass);
}

.gallery-disclosure__answer p {
  margin-top: 0;
  font-size: var(--text-small);
  line-height: var(--leading-small);
}

.gallery-disclosure__answer--felt {
  padding-left: var(--space-4);
  border-left: 3px solid var(--color-felt-green);
}

.gallery-cta__outer {
  width: calc((100% - (var(--space-6) * 4)) / 12 * 8 + (var(--space-6) * 7));
  padding: 0.625rem;
  border: var(--border-accent);
}

.gallery-cta__inner {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
  padding: var(--space-7);
  background: var(--color-plum-850);
}

.gallery-cta__inner .eyebrow,
.gallery-cta__inner h2,
.gallery-cta__inner p {
  margin: 0;
}

.gallery-cta__inner h2 {
  max-width: 35rem;
}

.gallery-cta__lead {
  max-width: 32.5rem;
  color: var(--color-mist);
}

.gallery-cta__button {
  width: auto;
}

.gallery-cta__location {
  max-width: 32.5rem;
  padding-top: var(--space-3);
  border-top: var(--border-quiet);
  color: var(--color-brass);
  font-size: var(--text-utility);
  letter-spacing: 0.08em;
}

@media (max-width: 61.1875rem) {
  .gallery-occasion-grid,
  .gallery-process__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gallery-occasion-card:nth-child(3),
  .gallery-step:nth-child(3) {
    grid-column: 1 / span 2;
  }
}

@media (max-width: 56.1875rem) {
  .gallery-page .gallery-hero {
    padding-top: var(--space-10);
  }

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

  .gallery-hero__copy,
  .gallery-hero__media,
  .gallery-salon__panel,
  .gallery-salon__media {
    grid-column: 1;
  }

  .gallery-hero__media {
    margin-top: 0;
    aspect-ratio: 4 / 3;
  }

  .gallery-culinary__copy,
  .gallery-culinary__media,
  .gallery-cocktail-panel {
    grid-column: 1 / span 12;
  }

  .gallery-culinary__copy {
    max-width: 36.875rem;
  }

  .gallery-culinary__media {
    aspect-ratio: 4 / 3;
  }

  .gallery-cocktail-panel {
    max-width: 36.875rem;
    margin-top: 0;
  }

  .gallery-salon__inner {
    padding: var(--space-5);
  }

  .gallery-principles__heading,
  .gallery-principle--one,
  .gallery-principle--two,
  .gallery-principle--three {
    grid-column: 1 / span 12;
  }

  .gallery-principle--two {
    max-width: 33.125rem;
    margin-top: 0;
  }

  .gallery-cta__outer {
    width: 100%;
  }
}

@media (max-width: 53.75rem) {
  .gallery-structure__heading,
  .gallery-structure__list,
  .gallery-timeline__heading,
  .gallery-timeline__stream,
  .gallery-faq__heading,
  .gallery-faq__list {
    grid-column: 1 / span 12;
  }
}

@media (max-width: 44.9375rem) {
  .gallery-page .gallery-hero {
    padding-block: var(--space-9) var(--space-8);
  }

  .gallery-hero__grid,
  .gallery-structure__grid,
  .gallery-culinary__grid,
  .gallery-timeline__grid,
  .gallery-principles__grid,
  .gallery-faq__grid {
    gap: var(--space-5);
  }

  .gallery-hero__copy {
    gap: var(--space-4);
  }

  .gallery-hero__copy h1 {
    font-size: 2.5rem;
    line-height: 1.05;
  }

  .gallery-hero__lead {
    max-width: 34em;
    font-size: var(--text-body);
    line-height: var(--leading-body);
  }

  .gallery-hero__location,
  .gallery-cta__location {
    line-height: var(--leading-utility);
  }

  .gallery-hero__action {
    width: auto;
  }

  .gallery-layer {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
  }

  .gallery-layer__body {
    max-width: none;
  }

  .gallery-layer--felt {
    padding-left: var(--space-3);
  }

  .gallery-occasion-grid,
  .gallery-process__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
  }

  .gallery-occasion-card:nth-child(3),
  .gallery-step:nth-child(3) {
    grid-column: 1;
  }

  .gallery-occasion-card,
  .gallery-step,
  .gallery-cocktail-panel {
    padding: var(--space-5);
  }

  .gallery-occasion-card h3,
  .gallery-step h3 {
    font-size: 1.6875rem;
    line-height: 1.15;
  }

  .gallery-occasion-card p,
  .gallery-step p {
    font-size: 1rem;
    line-height: 1.56;
  }

  .gallery-culinary__heading,
  .gallery-culinary__copy,
  .gallery-culinary__media,
  .gallery-cocktail-panel {
    grid-column: 1;
  }

  .gallery-culinary__heading h2,
  .gallery-salon__heading h2,
  .gallery-timeline__heading h2,
  .gallery-principles__heading h2,
  .gallery-process__heading h2,
  .gallery-faq__heading h2,
  .gallery-cta__inner h2 {
    font-size: 2.125rem;
    line-height: 1.08;
  }

  .gallery-timeline-item {
    grid-template-columns: 1rem minmax(0, 1fr);
    gap: var(--space-3);
  }

  .gallery-timeline-item__marker {
    border-right: 0;
    border-left: 1px solid var(--color-line-brass);
  }

  .gallery-timeline-item__marker::after {
    top: 0.1rem;
    right: auto;
    left: -0.35rem;
  }

  .gallery-timeline-item__marker span {
    display: none;
  }

  .gallery-timeline-item__content {
    max-width: none;
  }

  .gallery-timeline-item--felt .gallery-timeline-item__content {
    padding: var(--space-5);
  }

  .gallery-salon__outer {
    padding: var(--space-2);
  }

  .gallery-salon__inner {
    padding: var(--space-5);
  }

  .gallery-salon__panel {
    padding: var(--space-5);
  }

  .gallery-salon__panel h3 {
    font-size: 1.9375rem;
    line-height: 1.08;
  }

  .gallery-salon__panel > p,
  .gallery-terminology p {
    font-size: 1rem;
    line-height: 1.625;
  }

  .gallery-principle--two {
    padding: var(--space-5);
  }

  .gallery-disclosure__button {
    min-height: 3.5rem;
    padding: var(--space-4);
    font-size: 1rem;
  }

  .gallery-disclosure__answer p {
    font-size: 1rem;
    line-height: 1.625;
  }

  .gallery-cta__inner {
    padding: var(--space-5);
  }

  .gallery-cta__button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-page .interactive-card:hover {
    transform: none;
  }
}

ul { list-style: none !important; }
.nav-toggle { flex-direction: column; }