.gift-promo {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-sizing: border-box;
  width: min(1160px, calc(100% - 36px));
  margin: 30px auto 0;
  padding: clamp(20px, 4vw, 44px);
  border: 1px solid #e4c58d;
  border-radius: 24px;
  color: #173c48;
  background: #fff0d3;
  box-shadow: 0 12px 28px #152b4b16;
}

.gift-promo::before {
  position: absolute;
  z-index: -1;
  inset: 0 0 0 43%;
  background: url("/media-images/2026/11/bon-cadeau-coffre-nice-640.webp") center 54% / cover no-repeat;
  mask-image: linear-gradient(to right, transparent, black 35%);
  content: "";
}

.gift-promo__copy { max-width: 55%; }
.gift-promo__eyebrow { color: #813b27; font-weight: 850; font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; }
.gift-promo .gift-promo__title {
  margin: .12em 0;
  color: #173c48;
  font: 700 clamp(2rem, 5vw, 4rem)/.99 Georgia, serif;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.gift-promo__details { margin: .6em 0 1em; font-weight: 650; }
.gift-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 16px;
  border: 1px solid #8f3022;
  border-radius: 8px;
  color: #fff8eb;
  background: #a83424;
  font-weight: 800;
  text-decoration: none;
}
.gift-link:hover { color: #fff8eb; background: #872a1e; }
.gift-link:focus-visible { outline: 3px solid #173c48; outline-offset: 3px; }

.gift-page { margin: 0; background: #fffaf0; color: #173c48; font: 500 1rem/1.55 system-ui, sans-serif; }
.gift-page *, .gift-page *::before, .gift-page *::after { box-sizing: border-box; }
.gift-page__buy, .gift-page__use, .gift-page__footer { width: min(1110px, calc(100% - 36px)); margin-inline: auto; }
.gift-page__footer a { color: inherit; text-underline-offset: 3px; }

.gift-page__hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 108px 18px 28px;
  background: #ffedcc;
  text-align: center;
}

.gift-page__hero::before {
  --panorama: url("/media-images/2026/11/bon-cadeau-panorama-vieux-nice-1680.webp");
  position: absolute;
  z-index: -2;
  inset: 0;
  background: var(--panorama) center 44% / cover no-repeat;
  content: "";
}

.gift-page__hero::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, #fffaf02b, #fffaf02b 42%, #fffaf0 100%),
    radial-gradient(ellipse at 50% 43%, #fffaf0cf, #fffaf000 65%);
  content: "";
}

.gift-page__hero-copy { max-width: 650px; margin-inline: auto; }

.gift-page__hero h1 {
  margin: 0;
  font: 700 clamp(2.65rem, 6.7vw, 4.75rem)/.98 Georgia, serif;
  letter-spacing: -.055em;
}

.gift-page__intro {
  max-width: 480px;
  margin: 12px auto 23px;
  font-size: 1rem;
  text-wrap: pretty;
}

.gift-ticket {
  width: min(100%, 432px);
  margin-inline: auto;
  filter: drop-shadow(0 12px 14px #65412f3d) drop-shadow(0 2px 2px #65412f28);
}

.gift-ticket__face {
  --ticket-art-width: 43%;
  position: relative;
  display: grid;
  grid-template-columns: var(--ticket-art-width) minmax(0, 1fr);
  overflow: hidden;
  min-height: 177px;
  margin: 0;
  border-radius: 11px;
  background: #fff4d8;
  mask: radial-gradient(circle at var(--ticket-art-width) top, transparent 7px, black 7.75px) intersect,
    radial-gradient(circle at var(--ticket-art-width) bottom, transparent 7px, black 7.75px);
}

.gift-ticket__face img {
  position: absolute;
  inset: 0 auto 0 0;
  display: block;
  width: var(--ticket-art-width);
  height: 100%;
  object-fit: cover;
  object-position: center 61%;
}

.gift-ticket__face figcaption {
  position: relative;
  grid-column: 2;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 19px clamp(16px, 3.5vw, 27px);
  border-left: 1px dashed #a16c39;
  background: radial-gradient(ellipse at 28% 28%, #fff8e9, #f6e3b9);
  text-align: left;
}

.gift-ticket__face figcaption::before {
  position: absolute;
  inset: 8px 8px 8px 7px;
  border: 1px solid #b2834b78;
  border-radius: 0 5px 5px 0;
  pointer-events: none;
  content: "";
}

.gift-ticket__issuer {
  color: #833529;
  font: 800 .64rem/1.15 "Gabarito", system-ui, sans-serif;
  letter-spacing: .17em;
  text-transform: uppercase;
}

.gift-ticket__face strong {
  max-width: 9ch;
  font: 700 clamp(1.25rem, 5.2vw, 2rem)/.98 Georgia, serif;
  letter-spacing: -.045em;
}

.gift-ticket__place {
  font-size: clamp(.68rem, 2.6vw, .77rem);
  font-weight: 650;
  line-height: 1.2;
}

.gift-page__facts {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 8px;
  padding: 0;
  margin: 20px 0 14px;
  list-style: none;
}

.gift-page__facts li {
  padding: 4px 9px;
  border: 1px solid #cda4678c;
  border-radius: 999px;
  background: #fffaf0dc;
  font-size: .82rem;
  font-weight: 700;
}

.gift-page__hero .gift-link { gap: 9px; }
.gift-page__buy, .gift-page__use { margin-block: 28px 36px; scroll-margin-top: 96px; }
.gift-page h2 { margin: 0 0 .25em; font: 700 clamp(1.7rem, 3.5vw, 2.6rem)/1.1 Georgia, serif; }
.gift-page__buy > p, .gift-page__use p { margin-top: 6px; }
.gift-page__widget { position: relative; min-height: 110px; }
.gift-page__widget product-details-widget { display: block; }
.gift-page__widget product-details-widget:not([data-gift-ready]) {
  position: absolute;
  inset: 0;
  visibility: hidden;
  pointer-events: none;
}
.gift-page__use { padding: clamp(18px, 4vw, 36px); border: 1px solid #e4c58d; border-radius: 18px; background: #fff0d3; }
.gift-page__footer { display: flex; flex-wrap: wrap; gap: 14px 22px; padding-block: 20px; border-top: 1px solid #e4c58d; }

@media (max-width: 620px) {
  .gift-promo { margin-top: 20px; }
  .gift-promo::before { inset-inline-start: 34%; mask-image: linear-gradient(to right, transparent, black 60%); }
  .gift-promo__copy { max-width: 74%; }
  .gift-page__hero { padding-block: 88px 22px; }
  .gift-page__hero::before {
    --panorama: url("/media-images/2026/11/bon-cadeau-panorama-vieux-nice-960.webp");
    background-position: 76% center;
  }
  .gift-page__hero::after {
    background: linear-gradient(180deg, #fffaf04f, #fffaf0a6 58%, #fffaf0 100%),
      radial-gradient(ellipse at 48% 30%, #fffaf0bd, #fffaf000 83%);
  }
  .gift-page__intro { margin: 9px auto 18px; font-size: .9rem; }
  .gift-ticket__face { min-height: 139px; }
  .gift-ticket__face figcaption { gap: 5px; }
  .gift-page__facts { margin: 16px 0 12px; }
  .gift-page__facts li { font-size: .74rem; }
  .gift-page__buy, .gift-page__use { scroll-margin-top: 77px; }
}

@media (prefers-reduced-motion: no-preference) {
  .gift-page__hero::before { animation: gift-panorama-settle 4s ease-out both; }
}

@keyframes gift-panorama-settle {
  from { transform: scale(1.025) translateY(-3px); }
  to { transform: scale(1); }
}
