/* =========================================================
   /giftcards-information — Gift Cards notice page
   ---------------------------------------------------------
   Short, dignified page for guests who hold existing Arden
   Hills gift cards.

   Rewritten 2026-11 after the sale of Villa Arden Hills. The
   page previously ran four sections (hero, notice, a
   two-step "redeem at the Villa" explainer, and a closing
   thank-you band). The redeem and thanks sections described
   a redemption path that no longer exists, so they were
   removed along with their styles rather than left to rot.

   Sections now:
     1. Hero — emblem
     2. Notice — the whole message + "Visit the Shop"

   All styles scoped under .giftcards-page.
   ========================================================= */

.giftcards-page {
  background: var(--surface-0);
  color: var(--text-primary);
  font-family: var(--font-sans);
}

/* Shared inner-container */
.giftcards-hero__inner,
.giftcards-notice__inner {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  padding-left: var(--s-5);
  padding-right: var(--s-5);
}
@media (min-width: 900px) {
  .giftcards-hero__inner,
  .giftcards-notice__inner {
    padding-left: var(--s-7);
    padding-right: var(--s-7);
  }
}

/* =========================================================
   1. Hero — emblem
   ========================================================= */
.giftcards-hero {
  padding: var(--s-10) 0 var(--s-8);
  background:
    radial-gradient(ellipse at 50% 30%, rgba(160, 122, 68, 0.12), transparent 60%),
    linear-gradient(180deg, var(--surface-1) 0%, var(--surface-0) 100%);
  text-align: center;
}
.giftcards-hero__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-4);
}
.giftcards-hero__emblem {
  width: clamp(140px, 24vw, 200px);
  height: auto;
  filter: drop-shadow(0 6px 24px rgba(0, 0, 0, 0.55));
}

/* =========================================================
   2. Notice band — the message
   ========================================================= */
.giftcards-notice {
  padding: var(--s-8) 0 var(--s-10);
  background: var(--surface-0);
  border-top: 1px solid rgba(160, 122, 68, 0.18);
  text-align: center;
}
.giftcards-notice__heading {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.2;
  letter-spacing: 0.005em;
  color: var(--color-bronze-bright);
  margin: 0 0 var(--s-6);
}
.giftcards-notice__body {
  font-family: var(--font-editorial);
  font-size: 17px;
  line-height: 1.85;
  color: var(--text-secondary);
  text-align: left;
  max-width: 58ch;
  margin: 0 auto;
}
@media (min-width: 720px) {
  .giftcards-notice__body {
    text-align: center;
  }
}
.giftcards-notice__body p {
  margin: 0 0 var(--s-5);
}
.giftcards-notice__body p:last-child {
  margin-bottom: 0;
}
.giftcards-notice__body strong {
  color: var(--text-primary);
  font-weight: 500;
}

/* Inline mailto — bronze, underlined so it reads as a link
   without relying on colour alone (WCAG 1.4.1). */
.giftcards-notice__body a {
  color: var(--color-bronze-bright);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: color var(--dur-fast) var(--ease-out);
}
.giftcards-notice__body a:hover {
  color: var(--text-primary);
}
.giftcards-notice__body a:focus-visible {
  outline: 2px solid var(--color-bronze-bright);
  outline-offset: 3px;
  border-radius: 2px;
}

.giftcards-notice__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3);
  justify-content: center;
  margin-top: var(--s-8);
}