/* Paper Delivery — isolated presentation and motion. */
.delivery-page {
  max-width: none;
  padding: 0 0 5rem;
  overflow: hidden;
  background: #fff8ef;
}

.delivery-hero {
  position: relative;
  display: grid;
  min-height: 30rem;
  grid-template-columns: minmax(0, 1.05fr) minmax(22rem, .95fr);
  gap: clamp(3rem, 7vw, 7rem);
  align-items: center;
  padding: clamp(4rem, 8vw, 7rem) max(1.5rem, calc((100% - var(--content-wide)) / 2));
  overflow: hidden;
  color: #fff8f2;
  background:
    radial-gradient(circle at 85% 15%, rgb(255 175 1 / 22%), transparent 28%),
    linear-gradient(135deg, #28150d, #4e1d09 62%, #8c2b07);
}

.delivery-hero::after {
  content: "";
  position: absolute;
  right: -7rem;
  bottom: -11rem;
  width: 28rem;
  aspect-ratio: 1;
  border: 1px solid rgb(255 255 255 / 11%);
  border-radius: 50%;
  box-shadow: 0 0 0 4rem rgb(255 255 255 / 3%), 0 0 0 9rem rgb(255 255 255 / 2%);
}

.delivery-hero__copy { position: relative; z-index: 2; }
.delivery-hero__eyebrow { margin: 0 0 1rem; color: #ffb27f !important; font-size: .75rem !important; font-weight: 800; letter-spacing: .17em; }
.delivery-page .delivery-hero h1 { margin: 0; color: #fff; font-size: clamp(3.2rem, 6vw, 6rem); font-weight: 500; line-height: .98; letter-spacing: -.055em; }
.delivery-hero__copy > p:last-child { max-width: 43rem; margin: 1.5rem 0 0; color: #ebd4ca; font-size: var(--text-page-copy); line-height: 1.65; }

.delivery-hero__route { position: relative; z-index: 2; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; }
.delivery-hero__warehouse, .delivery-hero__destination { padding: .75rem 1rem; border: 1px solid rgb(255 255 255 / 24%); border-radius: 999rem; background: rgb(255 255 255 / 8%); font-size: .75rem; font-weight: 700; white-space: nowrap; backdrop-filter: blur(.6rem); }
.delivery-hero__line { position: relative; display: block; height: .16rem; overflow: hidden; border-radius: 999rem; background: rgb(255 255 255 / 18%); }
.delivery-hero__line i { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(90deg, #fe5500, #ffaf01); transform-origin: left; }
.delivery-hero__line i::after { content: ""; position: absolute; top: 50%; right: 0; width: .65rem; aspect-ratio: 1; border: .18rem solid #fff; border-radius: 50%; background: #fe5500; transform: translateY(-50%); box-shadow: 0 0 0 .3rem rgb(255 175 1 / 18%); }

.delivery-body { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; width: min(100% - 3rem, var(--content-wide)); margin: 0 auto; padding: 6rem 0; }
.delivery-body > h2, .delivery-body > p { grid-column: 1 / -1; max-width: 52rem; text-align: center; justify-self: center; }
.delivery-page .delivery-body > h2 { margin: 0; color: #26150d; font-size: clamp(2.4rem, 4vw, 4rem); font-weight: 500; }
.delivery-page .delivery-body > p { margin: .7rem 0 2.5rem; color: #6b554a; font-size: var(--text-page-copy); }

.delivery-card { position: relative; padding: clamp(1.7rem, 3vw, 2.5rem); border: 1px solid #eadfd7; border-radius: 1.2rem; background: #fff; box-shadow: 0 1rem 2.5rem rgb(86 49 24 / 7%); }
.delivery-card--option::before { content: ""; position: absolute; top: 0; left: 2rem; width: 4rem; height: .25rem; background: linear-gradient(90deg, #fe5500, #ffaf01); }
.delivery-page .delivery-card h3 { margin: 0 0 1.2rem; color: #fe5500; font-size: 1.75rem; font-weight: 600; }
.delivery-page .delivery-card ul, .delivery-page .delivery-card ol { margin: 0; padding: 0; list-style: none; }
.delivery-page .delivery-card li { position: relative; margin: 0; padding: .8rem 0 .8rem 1.8rem; border-bottom: 1px solid #f0e6de; color: #5f4c43; font-size: 1rem; line-height: 1.55; }
.delivery-page .delivery-card li:last-child { border-bottom: 0; }
.delivery-card--option li::before { content: "✓"; position: absolute; left: 0; color: #fe5500; font-weight: 800; }
.delivery-card--process { grid-column: 1 / -1; margin-top: .5rem; padding-bottom: 2rem; background: #28150d; }
.delivery-page .delivery-card--process h3 { color: #ff9a60; }
.delivery-card--process ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); counter-reset: delivery-step; }
.delivery-card--process li { counter-increment: delivery-step; padding: 3.2rem 1.2rem 0; border: 0; color: #e0c7bd; text-align: center; }
.delivery-card--process li::before { content: counter(delivery-step, decimal-leading-zero); position: absolute; top: 0; left: 50%; display: grid; width: 2.35rem; aspect-ratio: 1; place-items: center; border: 1px solid rgb(255 255 255 / 25%); border-radius: 50%; color: #fff; background: #fe5500; font-size: .7rem; font-weight: 800; transform: translateX(-50%); }
.delivery-card--process li:not(:last-child)::after { content: ""; position: absolute; top: 1.1rem; left: calc(50% + 1.2rem); width: calc(100% - 2.4rem); height: 1px; background: linear-gradient(90deg, #fe5500, rgb(255 255 255 / 18%)); }

.delivery-cta { display: flex; width: min(100% - 3rem, var(--content-wide)); align-items: center; justify-content: space-between; gap: 2rem; margin: 0 auto; padding: clamp(2rem, 4vw, 3.5rem); border-radius: 1.2rem; color: #28150d; background: linear-gradient(135deg, #ffaf01, #ffcb60); box-shadow: 0 1.4rem 3rem rgb(133 63 9 / 14%); }
.delivery-cta span { color: #8f380d; font-size: .72rem; font-weight: 800; letter-spacing: .14em; }
.delivery-page .delivery-cta h2 { max-width: 47rem; margin: .7rem 0 0; font-size: clamp(2rem, 3vw, 3.2rem); font-weight: 500; line-height: 1.08; }
.delivery-cta__actions { display: flex; flex: 0 0 auto; gap: .75rem; }
.delivery-cta__actions a { padding: .9rem 1.2rem; border: 1px solid #28150d; border-radius: 999rem; color: #28150d; font-size: .8rem; font-weight: 800; text-transform: uppercase; }
.delivery-cta__actions a:last-child { color: #fff; background: #28150d; }

.js .delivery-page.delivery-motion-ready [data-delivery-reveal] { opacity: 0; will-change: opacity, transform; }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal="hero"] { transform: translateY(2rem); transition: opacity .9s ease, transform 1.15s cubic-bezier(.16, 1, .3, 1); }
.js .delivery-page.delivery-motion-ready .delivery-hero__copy { transform: translateX(-2.5rem); transition: transform 1.1s .15s cubic-bezier(.16, 1, .3, 1); }
.js .delivery-page.delivery-motion-ready .delivery-hero__line i { transform: scaleX(0); transition: transform 1.25s .65s cubic-bezier(.16, 1, .3, 1); }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal="heading"] { transform: translateY(1.7rem); transition: opacity .7s ease, transform .95s cubic-bezier(.16, 1, .3, 1); }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal="card"] { transform: perspective(55rem) translateY(2.5rem) rotateX(6deg); transform-origin: bottom; transition: opacity .7s ease, transform 1s cubic-bezier(.16, 1, .3, 1), box-shadow .25s ease; transition-delay: var(--delivery-delay, 0ms); }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal="process"] { transform: translateY(2rem) scale(.98); transition: opacity .75s ease, transform 1.05s cubic-bezier(.16, 1, .3, 1); }
.js .delivery-page.delivery-motion-ready .delivery-card--process li { opacity: 0; transform: translateY(1rem); transition: opacity .55s ease, transform .75s cubic-bezier(.16, 1, .3, 1); }
.js .delivery-page.delivery-motion-ready .delivery-card--process.delivery-is-visible li { opacity: 1; transform: none; }
.js .delivery-page.delivery-motion-ready .delivery-card--process.delivery-is-visible li:nth-child(1) { transition-delay: .2s; }
.js .delivery-page.delivery-motion-ready .delivery-card--process.delivery-is-visible li:nth-child(2) { transition-delay: .32s; }
.js .delivery-page.delivery-motion-ready .delivery-card--process.delivery-is-visible li:nth-child(3) { transition-delay: .44s; }
.js .delivery-page.delivery-motion-ready .delivery-card--process.delivery-is-visible li:nth-child(4) { transition-delay: .56s; }
.js .delivery-page.delivery-motion-ready .delivery-card--process.delivery-is-visible li:nth-child(5) { transition-delay: .68s; }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal="cta"] { transform: translateY(2rem) scale(.97); transition: opacity .75s ease, transform 1s cubic-bezier(.16, 1, .3, 1); }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal].delivery-is-visible { opacity: 1; transform: none; will-change: auto; }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal="hero"].delivery-is-visible .delivery-hero__copy { transform: none; }
.js .delivery-page.delivery-motion-ready [data-delivery-reveal="hero"].delivery-is-visible .delivery-hero__line i { transform: scaleX(1); }

@media (max-width: 64rem) {
  .delivery-hero { grid-template-columns: 1fr; min-height: 0; }
  .delivery-body { grid-template-columns: 1fr; }
  .delivery-card--process { grid-column: auto; }
  .delivery-card--process ol { grid-template-columns: 1fr; }
  .delivery-card--process li { min-height: 4rem; padding: .4rem 0 1.4rem 4rem; text-align: left; }
  .delivery-card--process li::before { top: 0; left: 0; transform: none; }
  .delivery-card--process li:not(:last-child)::after { top: 2.35rem; bottom: 0; left: 1.15rem; width: 1px; height: calc(100% - 1.8rem); }
  .delivery-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 36rem) {
  .delivery-hero { padding-inline: 1rem; }
  .delivery-hero__route { grid-template-columns: 1fr; gap: .65rem; }
  .delivery-hero__warehouse { justify-self: start; }
  .delivery-hero__destination { justify-self: end; }
  .delivery-hero__line { width: 100%; }
  .delivery-body, .delivery-cta { width: min(100% - 2rem, var(--content-wide)); }
  .delivery-cta__actions { width: 100%; flex-direction: column; }
  .delivery-cta__actions a { text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .js .delivery-page.delivery-motion-ready [data-delivery-reveal],
  .js .delivery-page.delivery-motion-ready [data-delivery-reveal] *,
  .js .delivery-page.delivery-motion-ready .delivery-card--process li {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}