.decoration-page {
  overflow: clip;
}

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

.decoration-hero__panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
  padding: var(--space-5);
  border: 1px solid var(--color-glass-border);
  border-radius: var(--radius-hero);
  background: linear-gradient(135deg, rgba(255, 245, 231, 0.94), rgba(255, 236, 203, 0.62));
  box-shadow: var(--shadow-card);
}

.decoration-hero__copy,
.decoration-hero__action,
.decoration-path__header,
.decoration-families__header,
.decoration-orders__header,
.decoration-interior__copy,
.decoration-moods__header,
.decoration-gallery__header,
.decoration-tips__content,
.decoration-transparency__header,
.decoration-final__panel {
  min-width: 0;
}

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

.decoration-hero__copy > * {
  margin: 0;
}

.decoration-hero__copy h1 {
  max-width: 38rem;
  font-size: clamp(2.125rem, 6vw, 2.75rem);
  line-height: 1.1;
}

.decoration-hero__copy .lead {
  max-width: 38rem;
}

.decoration-hero__facts {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.decoration-hero__facts > * {
  min-width: 0;
}

.decoration-hero__action {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
}

.decoration-hero__action .button {
  width: 100%;
  min-height: 3rem;
}

.decoration-hero__note {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--font-size-meta);
  line-height: var(--line-height-meta);
}

.decoration-hero__media {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
}

.decoration-hero__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-xl);
  object-fit: cover;
  object-position: right center;
}

.decoration-hero__media figcaption {
  margin: 0;
}

.decoration-path__header,
.decoration-families__header,
.decoration-moods__header {
  width: min(100%, 40rem);
  margin-inline: auto;
  text-align: center;
}

.decoration-path__header .lead,
.decoration-families__header .lead,
.decoration-moods__header .lead {
  margin-bottom: 0;
}

.decoration-path__steps {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.decoration-step {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: rgba(255, 253, 252, 0.82);
  box-shadow: var(--shadow-card);
}

.decoration-step--merge {
  background: rgba(255, 236, 203, 0.8);
}

.decoration-step--serve {
  background: rgba(168, 216, 190, 0.3);
}

.decoration-step__number,
.decoration-order-block__number {
  display: flex;
  width: 2.25rem;
  height: 2.25rem;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(214, 164, 75, 0.52);
  border-radius: 50%;
  background: rgba(255, 253, 252, 0.76);
  color: #765311;
  font-family: var(--font-heading);
  font-size: var(--font-size-caption);
  font-weight: 800;
}

.decoration-step__content {
  min-width: 0;
}

.decoration-step__content h3,
.decoration-step__content p {
  margin: 0;
}

.decoration-step__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.decoration-families__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.decoration-family {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}

.decoration-family > * {
  margin: 0;
}

.decoration-family--pastry,
.decoration-family--sweet {
  background: rgba(255, 236, 203, 0.86);
}

.decoration-family--coffee {
  background: rgba(255, 253, 252, 0.8);
}

.decoration-family--ice {
  background: rgba(168, 216, 190, 0.35);
}

.decoration-family__icon {
  position: relative;
  width: 3rem;
  height: 3rem;
  flex: 0 0 3rem;
  border-radius: var(--radius-md);
  background: rgba(255, 253, 252, 0.7);
}

.decoration-family__icon--cloche::before {
  position: absolute;
  top: 0.7rem;
  left: 0.6rem;
  width: 1.8rem;
  height: 1.25rem;
  border: 0.16rem solid var(--color-primary);
  border-bottom: 0;
  border-radius: 1rem 1rem 0 0;
  content: "";
}

.decoration-family__icon--cloche::after {
  position: absolute;
  right: 0.45rem;
  bottom: 0.6rem;
  left: 0.45rem;
  height: 0.18rem;
  border-radius: 1rem;
  background: var(--color-primary);
  content: "";
}

.decoration-family__icon--cup::before {
  position: absolute;
  top: 0.8rem;
  left: 0.7rem;
  width: 1.4rem;
  height: 1.15rem;
  border: 0.16rem solid var(--color-primary);
  border-radius: 0.2rem 0.2rem 0.55rem 0.55rem;
  content: "";
}

.decoration-family__icon--cup::after {
  position: absolute;
  top: 1rem;
  right: 0.5rem;
  width: 0.62rem;
  height: 0.72rem;
  border: 0.15rem solid var(--color-primary);
  border-left: 0;
  border-radius: 0 0.6rem 0.6rem 0;
  content: "";
}

.decoration-family__icon--ice::before {
  position: absolute;
  top: 0.5rem;
  left: 0.85rem;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 50% 50% 44% 44%;
  background: var(--color-peach);
  box-shadow: 0 0.82rem 0 0.02rem var(--color-mint);
  content: "";
}

.decoration-family__icon--ice::after {
  position: absolute;
  bottom: 0.55rem;
  left: 1.42rem;
  width: 0.18rem;
  height: 0.72rem;
  border-radius: 1rem;
  background: var(--color-primary);
  content: "";
}

.decoration-family__icon--sweet::before {
  position: absolute;
  top: 0.75rem;
  left: 0.8rem;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50%;
  background: var(--color-gold);
  box-shadow: 0.48rem 0.48rem 0 -0.13rem var(--color-peach);
  content: "";
}

.decoration-family__icon--sweet::after {
  position: absolute;
  bottom: 0.58rem;
  left: 0.63rem;
  width: 1.8rem;
  height: 0.17rem;
  border-radius: 1rem;
  background: var(--color-primary);
  content: "";
}

.decoration-family h3 {
  font-size: 1.35rem;
}

.decoration-family p {
  max-width: 18rem;
}

.decoration-orders__panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding: var(--space-5);
  border: 1px solid var(--color-glass-border);
  border-radius: var(--radius-xl);
  background: rgba(255, 253, 252, 0.72);
  box-shadow: var(--shadow-card);
}

.decoration-orders__header h2 {
  margin-bottom: 0;
}

.decoration-orders__blocks {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
}

.decoration-order-block {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-background);
}

.decoration-order-block--warm {
  background: var(--color-background-warm);
}

.decoration-order-block > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-3);
}

.decoration-order-block h3,
.decoration-order-block p {
  margin: 0;
}

.decoration-orders__notice {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid rgba(33, 96, 71, 0.16);
  border-radius: var(--radius-lg);
  background: rgba(168, 216, 190, 0.34);
}

.decoration-orders__leaf {
  display: flex;
  width: 2.25rem;
  height: 2.25rem;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 253, 252, 0.72);
  color: var(--color-mint-deep);
}

.decoration-orders__notice > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-2);
}

.decoration-orders__notice h3,
.decoration-orders__notice p {
  margin: 0;
}

.decoration-orders__notice p {
  max-width: 47.5rem;
}

.decoration-interior__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

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

.decoration-interior__copy > * {
  margin: 0;
}

.decoration-interior__copy p {
  max-width: 35rem;
}

.decoration-interior__divider {
  width: 5rem;
  height: 1px;
  background: var(--color-gold);
}

.decoration-interior__gallery-link {
  font-weight: 700;
}

.decoration-interior__media {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
}

.decoration-interior__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-xl);
  object-fit: cover;
  object-position: center;
}

.decoration-interior__media figcaption {
  margin: 0;
}

.decoration-moods__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.decoration-mood {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: rgba(255, 253, 252, 0.8);
  box-shadow: var(--shadow-card);
}

.decoration-mood > * {
  margin: 0;
}

.decoration-mood--pastry {
  background: linear-gradient(180deg, rgba(244, 178, 155, 0.28), rgba(255, 253, 252, 0.88) 34%);
}

.decoration-mood--fresh {
  background: linear-gradient(180deg, rgba(168, 216, 190, 0.34), rgba(255, 253, 252, 0.88) 34%);
}

.decoration-mood__line {
  width: 3rem;
  height: 0.24rem;
  border-radius: 1rem;
  background: var(--color-gold);
}

.decoration-mood p {
  max-width: 18rem;
}

.decoration-gallery__header {
  width: min(100%, 38.75rem);
}

.decoration-gallery__header .tag {
  margin-bottom: var(--space-3);
}

.decoration-gallery__header p {
  margin-bottom: 0;
}

.decoration-gallery__mosaic {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.decoration-gallery__figure {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
}

.decoration-gallery__open {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-xl);
  background: transparent;
}

.decoration-gallery__open img {
  width: 100%;
  transition: transform var(--transition-base);
}

.decoration-gallery__figure--sweet img,
.decoration-gallery__figure--details img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.decoration-gallery__open span {
  position: absolute;
  right: var(--space-3);
  bottom: var(--space-3);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  background: rgba(59, 41, 35, 0.82);
  color: #fff;
  font-size: var(--font-size-caption);
  font-weight: 700;
}

.decoration-gallery__open:hover img {
  transform: scale(1.025);
}

.decoration-gallery__figure figcaption {
  margin: 0;
}

.decoration-gallery__link {
  display: inline-block;
  margin-top: var(--space-5);
  font-weight: 700;
}

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

.decoration-tips__content {
  width: min(100%, 45rem);
}

.decoration-tips__content .lead {
  max-width: 40rem;
}

.decoration-tips__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: 0;
  list-style: none;
}

.decoration-tips__list li {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: var(--space-3);
  min-width: 0;
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-border);
  counter-increment: advice;
}

.decoration-tips__list {
  counter-reset: advice;
}

.decoration-tips__list li::before {
  display: flex;
  width: 2.25rem;
  height: 2.25rem;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(214, 164, 75, 0.52);
  border-radius: 50%;
  color: #765311;
  content: counter(advice, decimal-leading-zero);
  font-family: var(--font-heading);
  font-size: var(--font-size-caption);
  font-weight: 800;
}

.decoration-tips__list li > * {
  grid-column: 2;
}

.decoration-tips__list h3 {
  margin: 0 0 var(--space-2);
  font-size: 1.28rem;
}

.decoration-tips__list p {
  margin: 0;
  max-width: 40rem;
}

.decoration-tips__offline {
  padding: var(--space-3) var(--space-4);
  border: 1px solid rgba(33, 96, 71, 0.16);
  border-radius: var(--radius-md);
  background: rgba(168, 216, 190, 0.34);
  color: var(--color-mint-deep);
  font-weight: 700;
}

.decoration-tips__ornament {
  display: none;
}

.decoration-transparency__cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-5);
}

.decoration-transparency__card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.decoration-transparency__card > * {
  margin: 0;
}

.decoration-transparency__card--purchases {
  background: rgba(255, 236, 203, 0.82);
}

.decoration-transparency__card--offline {
  background: rgba(168, 216, 190, 0.34);
}

.decoration-transparency__symbol {
  display: flex;
  width: 2.5rem;
  height: 2.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 253, 252, 0.75);
  color: var(--color-primary-hover);
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 800;
}

.decoration-transparency__card--offline .decoration-transparency__symbol {
  color: var(--color-mint-deep);
}

.decoration-transparency__card p {
  max-width: 26.875rem;
}

.decoration-transparency__independent {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
  margin-top: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: rgba(255, 253, 252, 0.82);
}

.decoration-transparency__independent > * {
  margin: 0;
}

.decoration-transparency__independent p {
  max-width: 48.75rem;
}

.decoration-final__panel {
  display: flex;
  width: min(100%, 61.5rem);
  margin-inline: auto;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-6) var(--space-5);
  border: 1px solid var(--color-glass-border);
  border-radius: var(--radius-hero);
  background: linear-gradient(135deg, rgba(255, 245, 231, 0.96), rgba(244, 178, 155, 0.32));
  box-shadow: var(--shadow-card);
  text-align: center;
}

.decoration-final__panel > * {
  margin: 0;
}

.decoration-final__panel > p:not(.eyebrow) {
  width: min(100%, 38.75rem);
}

.decoration-final__action {
  display: flex;
  width: min(100%, 26.25rem);
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
}

.decoration-final__action .button {
  width: 100%;
  min-height: 3rem;
}

.decoration-final__action p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--font-size-meta);
  line-height: var(--line-height-meta);
}

.decoration-lightbox[hidden] {
  display: none;
}

.decoration-lightbox {
  position: fixed;
  z-index: 1100;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--space-4);
}

.decoration-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(59, 41, 35, 0.78);
}

.decoration-lightbox__dialog {
  position: relative;
  width: min(100%, 62rem);
  max-height: calc(100vh - 2rem);
  padding: var(--space-5);
  border-radius: var(--radius-xl);
  background: var(--color-background);
  box-shadow: var(--shadow-floating);
}

.decoration-lightbox__dialog img {
  width: 100%;
  max-height: calc(100vh - 7rem);
  border-radius: var(--radius-md);
  object-fit: contain;
}

.decoration-lightbox__close {
  position: absolute;
  z-index: 1;
  top: var(--space-2);
  right: var(--space-2);
  display: flex;
  width: 2.75rem;
  height: 2.75rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: var(--color-background);
  color: var(--color-text);
  font-size: 1.6rem;
  line-height: 1;
}

@media (min-width: 48rem) {
  .decoration-hero__panel {
    grid-template-columns: minmax(0, 1fr) minmax(22.5rem, 1fr);
    align-items: center;
    padding: var(--space-6);
  }

  .decoration-hero__action .button {
    width: auto;
  }

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

  .decoration-path__steps > :nth-child(3) {
    grid-column: 1 / -1;
  }

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

  .decoration-orders__blocks,
  .decoration-transparency__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .decoration-interior__layout {
    grid-template-columns: minmax(0, 0.9fr) minmax(21.25rem, 1.1fr);
    align-items: end;
  }

  .decoration-interior__media img {
    aspect-ratio: 4 / 5;
  }

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

  .decoration-moods__grid > :nth-child(3) {
    grid-column: 1 / -1;
  }

  .decoration-gallery__mosaic {
    grid-template-columns: minmax(0, 7fr) minmax(20.625rem, 5fr);
    align-items: start;
  }

  .decoration-gallery__figure--sweet img {
    aspect-ratio: 16 / 10;
  }

  .decoration-gallery__figure--details img {
    aspect-ratio: 4 / 5;
  }
}

@media (min-width: 68.75rem) {
  .decoration-hero__panel {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: 8.333%;
  }

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

  .decoration-path__steps > :nth-child(3) {
    grid-column: auto;
  }

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

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

  .decoration-moods__grid > :nth-child(3) {
    grid-column: auto;
  }

  .decoration-tips__layout {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
  }

  .decoration-tips__ornament {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    opacity: 0.42;
  }

  .decoration-tips__ornament span {
    display: block;
    border-radius: 50%;
  }

  .decoration-tips__ornament span:nth-child(1) {
    width: 5rem;
    height: 5rem;
    background: var(--color-peach);
  }

  .decoration-tips__ornament span:nth-child(2) {
    width: 3.5rem;
    height: 3.5rem;
    background: var(--color-mint);
  }

  .decoration-tips__ornament span:nth-child(3) {
    width: 1.75rem;
    height: 1.75rem;
    background: var(--color-gold);
  }
}

@media (max-width: 51.1875rem) {
  .decoration-orders__blocks {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 30rem) {
  .decoration-hero__panel,
  .decoration-orders__panel,
  .decoration-final__panel {
    padding: var(--space-4);
  }

  .decoration-hero__copy h1 {
    font-size: 2.125rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .decoration-gallery__open:hover img {
    transform: none;
  }
}