@layer sections {
  .gift { overflow-x: clip; isolation: isolate; }
  .gift > *:not(.sunburst) { position: relative; z-index: 1; }
  .gift__inner { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: clamp(2.5rem, 5vw, 6rem); align-items: center; }
  .gift__title { max-width: 11ch; }
  .gift__includes { display: grid; gap: 0.9rem; padding: 1.4rem 1.5rem; border-radius: var(--radius-l); background: rgb(21 12 8 / 0.28); border: 1px solid var(--line); backdrop-filter: blur(6px); }
  .gift__includes-label { font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent); }
  .gift__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem 1.25rem; list-style: none; margin: 0; padding: 0; }
  .gift__item { display: flex; align-items: center; gap: 0.6rem; font-weight: 500; line-height: 1.3; }
  .gift__item .icon { width: 1.05rem; height: 1.05rem; flex: none; color: var(--accent); }

  .gift__buy { display: grid; gap: 1.25rem; justify-items: start; }
  .gift__sizes { display: flex; flex-wrap: wrap; gap: 0.75rem; list-style: none; margin: 0; padding: 0; }
  .gift__size { display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.4rem 0.45rem 0.4rem 1.2rem; border-radius: var(--radius-pill); border: 1px solid color-mix(in oklab, var(--c-cream) 40%, transparent); }
  .gift__size-name { font-weight: 600; }
  .gift__size-price { color: var(--accent); font-weight: 600; }
  .gift__size-add { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: var(--c-cream); color: var(--c-ink); transition: transform 0.6s var(--ease-spring), background var(--dur-s); }
  .gift__size-add .icon { width: 1.05rem; height: 1.05rem; }
  .gift__size-add:hover { background: var(--c-honey); transform: rotate(90deg) scale(1.08); }
  .gift__size-add.is-loading { opacity: 0.5; pointer-events: none; }

  /* collage of the real gift-box photography */
  .gift__collage { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: clamp(5rem, 8vw, 8rem); gap: clamp(0.6rem, 1.2vw, 1.1rem); }
  .gift__shot { margin: 0; }
  .gift__shot-frame { position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: var(--radius-l); box-shadow: 0 40px 60px -34px rgb(0 0 0 / 0.7); background: rgb(0 0 0 / 0.2); }
  .gift__img { position: absolute; inset: -8% 0; width: 100%; height: 116%; object-fit: cover; }
  .gift__shot--1 { grid-column: 1 / 4; grid-row: 1 / 5; }
  .gift__shot--2 { grid-column: 4 / 7; grid-row: 2 / 5; }
  .gift__shot--3 { grid-column: 1 / 3; grid-row: 5 / 8; }
  .gift__shot--4 { grid-column: 3 / 5; grid-row: 5 / 8; transform: translateY(1.5rem); }
  .gift__shot--5 { grid-column: 5 / 7; grid-row: 5 / 8; }
  @media (max-width: 989px) {
    .gift__inner { grid-template-columns: 1fr; }
    .gift__collage { order: -1; grid-auto-rows: 7vw; }
  }
  @media (max-width: 549px) { .gift__list { grid-template-columns: 1fr; } }
}
