/* css/wc-promos.css - seasonal promo pages (/promos/...) and Coffee's on us (/coffee). w3-promos, 9 Oct 2026.
 * House identity: Cormorant Garamond display, Inter body, sage spine, restrained gold. Every value is a token:
 * the house tokens come from css/wc-surfaces.css (--wcs-*), the few this page family adds are below (--wp-*).
 * Scoped under .wp-page / .cf-page so nothing leaks into the nav, the footer or any other page. */

:root {
  --wp-night: #1E2520;
  --wp-night-veil: rgba(24, 30, 25, .62);
  --wp-night-veil-strong: rgba(24, 30, 25, .86);
  --wp-night-veil-soft: rgba(24, 30, 25, .30);
  --wp-glass: rgba(255, 255, 255, .06);
  --wp-mask-solid: #000;
  --wp-cream: #FBF7F0;
  --wp-on-dark: #FFFFFF;
  --wp-on-dark-2: rgba(255, 255, 255, .80);
  --wp-on-dark-line: rgba(255, 255, 255, .22);
  --wp-gold-light: #E3C766;
  --wp-gold-glow: rgba(201, 162, 39, .22);
  --wp-sage-glow: rgba(94, 114, 89, .16);
  --wp-space-1: 4px;
  --wp-space-2: 8px;
  --wp-space-3: 12px;
  --wp-space-4: 16px;
  --wp-space-5: 24px;
  --wp-space-6: 32px;
  --wp-space-7: 48px;
  --wp-space-8: 64px;
  --wp-space-9: 96px;
  --wp-wrap: 1180px;
  --wp-wrap-narrow: 860px;
  --wp-radius-lg: 22px;
  --wp-radius-pill: 999px;
  --wp-hairline: 1px;
  --wp-dur: 240ms;
  --wp-dur-slow: 1600ms;
  --wp-display: clamp(2.5rem, 5.4vw, 4.5rem);
  --wp-h2: clamp(1.9rem, 3.2vw, 2.6rem);
  --wp-h3: 1.35rem;
  --wp-body: 1.0625rem;
  --wp-small: .9375rem;
  --wp-caption: .78rem;
  --wp-track: .16em;
  --wp-tap: 44px;
  --wp-anchor-offset: 96px;
}
.wp-page [id], .cf-page [id] { scroll-margin-top: var(--wp-anchor-offset); }

.wp-page, .cf-page { font-family: var(--wcs-sans); color: var(--wcs-ink); background: var(--wcs-ground); }
.wp-page *, .cf-page * { box-sizing: border-box; }
.wp-wrap { width: 100%; max-width: var(--wp-wrap); margin: 0 auto; padding: 0 var(--wp-space-4); }
.wp-wrap--narrow { max-width: var(--wp-wrap-narrow); }
.wp-section { padding: var(--wp-space-8) 0; }
.wp-section--raised { background: var(--wcs-raised); }
.wp-section--wash { background: var(--wcs-sage-wash); }
.wp-section--night { background: var(--wp-night); color: var(--wp-on-dark); }

.wp-eyebrow { display: inline-flex; align-items: center; gap: var(--wp-space-3); margin: 0 0 var(--wp-space-4); font: 600 var(--wp-caption)/1.3 var(--wcs-sans); letter-spacing: var(--wp-track); text-transform: uppercase; color: var(--wcs-sage-deep); }
.wp-eyebrow::before { content: ""; width: var(--wp-space-6); height: var(--wp-hairline); background: var(--wcs-gold); }
.wp-on-dark .wp-eyebrow { color: var(--wp-gold-light); }
.wp-display { margin: 0; font: 500 var(--wp-display)/1.02 var(--wcs-serif); letter-spacing: -.01em; }
.wp-display em { display: block; font-style: italic; font-weight: 400; color: var(--wcs-sage-deep); }
.wp-on-dark .wp-display em { color: var(--wp-gold-light); }
.wp-h2 { margin: 0 0 var(--wp-space-4); font: 500 var(--wp-h2)/1.1 var(--wcs-serif); }
.wp-h3 { margin: 0 0 var(--wp-space-2); font: 600 var(--wp-h3)/1.2 var(--wcs-serif); }
.wp-lede { margin: var(--wp-space-5) 0 0; max-width: 58ch; font: 400 var(--wp-body)/1.65 var(--wcs-sans); color: var(--wcs-ink-2); }
.wp-on-dark .wp-lede { color: var(--wp-on-dark-2); }
.wp-muted { color: var(--wcs-muted); }
.wp-small { font-size: var(--wp-small); line-height: 1.6; }

/* buttons */
.wp-actions { display: flex; flex-wrap: wrap; gap: var(--wp-space-3); margin-top: var(--wp-space-6); }
.wp-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--wp-space-2); min-height: var(--wp-tap); padding: var(--wp-space-3) var(--wp-space-5); border-radius: var(--wp-radius-pill); border: var(--wp-hairline) solid transparent; font: 600 var(--wp-small)/1 var(--wcs-sans); text-decoration: none; cursor: pointer; transition: background-color var(--wp-dur) var(--wcs-ease), color var(--wp-dur) var(--wcs-ease), border-color var(--wp-dur) var(--wcs-ease), transform var(--wp-dur) var(--wcs-ease); }
.wp-btn svg { width: 1em; height: 1em; flex: none; }
.wp-btn--primary { background: var(--wcs-sage-deep); color: var(--wp-on-dark); }
.wp-btn--primary:hover { background: var(--wcs-ink); color: var(--wp-on-dark); }
.wp-btn--ghost { background: transparent; color: var(--wcs-ink); border-color: var(--wcs-line-strong); }
.wp-btn--ghost:hover { border-color: var(--wcs-sage); background: var(--wcs-sage-wash); }
.wp-on-dark .wp-btn--primary { background: var(--wp-cream); color: var(--wcs-ink); }
.wp-on-dark .wp-btn--primary:hover { background: var(--wp-gold-light); color: var(--wcs-ink); }
.wp-on-dark .wp-btn--ghost { color: var(--wp-on-dark); border-color: var(--wp-on-dark-line); }
.wp-on-dark .wp-btn--ghost:hover { border-color: var(--wp-on-dark); background: transparent; }
.wp-btn:focus-visible, .wp-link:focus-visible, .wp-stop a:focus-visible, .cf-page button:focus-visible, .cf-page a:focus-visible, .cf-page input:focus-visible { outline: 3px solid var(--wcs-gold); outline-offset: 3px; }
.wp-link { color: var(--wcs-sage-deep); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.wp-link:hover { color: var(--wcs-ink); }

/* hero */
.wp-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--wp-night); color: var(--wp-on-dark); }
.wp-hero__img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.wp-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, var(--wp-night-veil-strong) 0%, var(--wp-night-veil) 55%, var(--wp-night-veil-soft) 100%); }
.wp-hero__inner { padding-top: clamp(56px, 9vw, 120px); padding-bottom: clamp(56px, 8vw, 104px); }
.wp-hero__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: var(--wp-space-7); align-items: end; }
.wp-hero__aside { padding: var(--wp-space-5); border: var(--wp-hairline) solid var(--wp-on-dark-line); border-radius: var(--wp-radius-lg); background: var(--wp-glass); backdrop-filter: blur(6px); }
.wp-hero__aside h2 { margin: 0 0 var(--wp-space-3); font: 600 var(--wp-caption)/1.3 var(--wcs-sans); letter-spacing: var(--wp-track); text-transform: uppercase; color: var(--wp-gold-light); }

/* price rows */
.wp-prices { list-style: none; margin: 0; padding: 0; display: grid; }
.wp-prices li { display: flex; justify-content: space-between; align-items: baseline; gap: var(--wp-space-4); padding: var(--wp-space-3) 0; border-bottom: var(--wp-hairline) solid var(--wp-on-dark-line); font-size: var(--wp-small); }
.wp-prices li:last-child { border-bottom: 0; }
.wp-prices b { font: 600 1.5rem/1 var(--wcs-serif); font-variant-numeric: tabular-nums; white-space: nowrap; }
.wp-focus { display: flex; align-items: baseline; gap: var(--wp-space-3); margin: var(--wp-space-4) 0 var(--wp-space-2); padding: var(--wp-space-4) 0; border-top: var(--wp-hairline) solid var(--wcs-line-soft); border-bottom: var(--wp-hairline) solid var(--wcs-line-soft); }
.wp-focus b { font: 500 2.6rem/1 var(--wcs-serif); color: var(--wcs-ink); font-variant-numeric: tabular-nums; }
.wp-focus span { font-size: var(--wp-small); color: var(--wcs-muted); }
.wp-steps-mini { list-style: none; margin: var(--wp-space-3) 0 0; padding: 0; display: grid; gap: var(--wp-space-2); font-size: var(--wp-small); color: var(--wcs-ink-2); }
.wp-steps-mini li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--wp-space-3); }
.wp-steps-mini svg { width: 20px; height: 20px; color: var(--wcs-sage); }
.wp-prices small { display: block; font-size: var(--wp-caption); opacity: .75; }

/* signature: the season ribbon */
.wp-ribbon { padding: var(--wp-space-7) 0 var(--wp-space-6); background: var(--wcs-raised); border-bottom: var(--wp-hairline) solid var(--wcs-line); }
.wp-ribbon__title { margin: 0 0 var(--wp-space-5); text-align: center; }
.wp-stops { position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--wp-space-3); }
.wp-stops::before { content: ""; position: absolute; left: 10%; right: 10%; top: 9px; height: var(--wp-hairline); background: linear-gradient(90deg, var(--wcs-sage-line), var(--wcs-gold), var(--wcs-sage-line)); }
.wp-stop { position: relative; text-align: center; }
.wp-stop a { display: grid; justify-items: center; gap: var(--wp-space-2); padding: 0 var(--wp-space-1) var(--wp-space-2); border-radius: var(--wcs-radius-sm); color: inherit; text-decoration: none; }
.wp-stop__dot { position: relative; width: 19px; height: 19px; border-radius: 50%; background: var(--wcs-raised); border: 2px solid var(--wcs-sage-line); transition: transform var(--wp-dur) var(--wcs-ease), border-color var(--wp-dur) var(--wcs-ease); }
.wp-stop a:hover .wp-stop__dot { border-color: var(--wcs-gold); transform: scale(1.12); }
.wp-stop__name { font: 600 1.15rem/1.15 var(--wcs-serif); color: var(--wcs-ink); }
.wp-stop__dates { font-size: var(--wp-caption); color: var(--wcs-muted); letter-spacing: .02em; }
.wp-stop__tag { display: inline-block; min-height: 20px; padding: 2px var(--wp-space-2); border-radius: var(--wp-radius-pill); font: 700 10px/16px var(--wcs-sans); letter-spacing: .12em; text-transform: uppercase; color: transparent; }
.wp-stop.is-past .wp-stop__dot { background: var(--wcs-sage-line); border-color: var(--wcs-sage-line); }
.wp-stop.is-past .wp-stop__name { color: var(--wcs-muted); }
.wp-stop.is-now .wp-stop__dot { background: var(--wcs-gold); border-color: var(--wcs-gold); box-shadow: 0 0 0 6px var(--wp-gold-glow); }
.wp-stop.is-now .wp-stop__tag { background: var(--wcs-gold-wash); color: var(--wcs-gold-ink); }
.wp-stop.is-here .wp-stop__name { text-decoration: underline; text-decoration-color: var(--wcs-gold); text-underline-offset: 5px; }

/* offer / plan card */
.wp-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--wp-space-7); align-items: start; }
.wp-card { position: relative; padding: var(--wp-space-6); background: var(--wcs-raised); border: var(--wp-hairline) solid var(--wcs-line); border-radius: var(--wp-radius-lg); box-shadow: var(--wcs-shadow); }
.wp-card--offer { border-color: var(--wcs-gold); box-shadow: var(--wcs-shadow-lifted); }
.wp-card--offer::before { content: ""; position: absolute; left: var(--wp-space-6); right: var(--wp-space-6); top: -1px; height: 3px; border-radius: 0 0 3px 3px; background: var(--wcs-gold); }
.wp-card__kicker { margin: 0 0 var(--wp-space-2); font: 700 var(--wp-caption)/1.2 var(--wcs-sans); letter-spacing: var(--wp-track); text-transform: uppercase; color: var(--wcs-gold-ink); }
.wp-card p { margin: 0 0 var(--wp-space-3); font-size: var(--wp-small); line-height: 1.6; color: var(--wcs-ink-2); }
.wp-card .wp-prices li { border-bottom-color: var(--wcs-line-soft); }

/* checklist */
.wp-covers { list-style: none; margin: var(--wp-space-5) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp-space-4) var(--wp-space-6); }
.wp-covers li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--wp-space-3); font-size: var(--wp-small); line-height: 1.55; color: var(--wcs-ink-2); }
.wp-covers svg { width: 22px; height: 22px; color: var(--wcs-sage); }
.wp-note { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--wp-space-3); margin: var(--wp-space-6) 0 0; padding: var(--wp-space-4) var(--wp-space-5); border: var(--wp-hairline) solid var(--wcs-gold); background: var(--wcs-gold-wash); border-radius: var(--wcs-radius-sm); font-size: var(--wp-small); line-height: 1.6; }
.wp-note svg { width: 22px; height: 22px; color: var(--wcs-gold-ink); }

/* add-ons */
.wp-addons { list-style: none; margin: var(--wp-space-5) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--wp-space-3); }
.wp-addons li { display: flex; justify-content: space-between; align-items: baseline; gap: var(--wp-space-3); padding: var(--wp-space-4); background: var(--wcs-inset); border: var(--wp-hairline) solid var(--wcs-line-soft); border-radius: var(--wcs-radius-sm); font-size: var(--wp-small); }
.wp-addons b { font: 600 1.2rem/1 var(--wcs-serif); white-space: nowrap; }

/* proof band */
.wp-proof { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--wp-space-5); }
.wp-proof li { display: grid; gap: var(--wp-space-2); align-content: start; padding-top: var(--wp-space-4); border-top: var(--wp-hairline) solid var(--wp-on-dark-line); font-size: var(--wp-small); line-height: 1.5; color: var(--wp-on-dark-2); }
.wp-proof b { font: 600 1.2rem/1.2 var(--wcs-serif); color: var(--wp-on-dark); }

/* index cards */
.wp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--wp-space-5); }
.wp-tile { display: grid; grid-template-rows: auto 1fr; overflow: hidden; border-radius: var(--wp-radius-lg); background: var(--wcs-raised); border: var(--wp-hairline) solid var(--wcs-line); box-shadow: var(--wcs-shadow); color: inherit; text-decoration: none; transition: transform var(--wp-dur) var(--wcs-ease), box-shadow var(--wp-dur) var(--wcs-ease); }
.wp-tile:hover { transform: translateY(-3px); box-shadow: var(--wcs-shadow-hover); }
.wp-tile img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.wp-tile__body { padding: var(--wp-space-5); }
.wp-tile__body p { margin: var(--wp-space-2) 0 0; font-size: var(--wp-small); line-height: 1.55; color: var(--wcs-ink-2); }
.wp-tile:focus-visible { outline: 3px solid var(--wcs-gold); outline-offset: 3px; }

/* coffee teaser on promo pages */
.wp-teaser { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--wp-space-5); align-items: center; padding: var(--wp-space-5) var(--wp-space-6); border-radius: var(--wp-radius-lg); background: var(--wcs-raised); border: var(--wp-hairline) dashed var(--wcs-line-strong); }
.wp-teaser > svg { width: 48px; height: 48px; color: var(--wcs-sage-deep); }
.wp-teaser p { margin: var(--wp-space-1) 0 0; font-size: var(--wp-small); color: var(--wcs-ink-2); }

/* ============================== Coffee's on us ============================== */
.cf-hero { position: relative; overflow: hidden; padding: clamp(48px, 8vw, 104px) 0 clamp(40px, 6vw, 80px); background: radial-gradient(1200px 520px at 85% 10%, var(--wp-gold-glow), transparent 60%), radial-gradient(900px 480px at 0% 100%, var(--wp-sage-glow), transparent 60%), var(--wp-cream); }
.cf-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr); gap: var(--wp-space-7); align-items: center; }
.cf-cup { width: 100%; max-width: 360px; justify-self: center; color: var(--wcs-sage-deep); }
.cf-cup .cf-steam { stroke-dasharray: 60; stroke-dashoffset: 60; animation: cf-rise var(--wp-dur-slow) var(--wcs-ease) forwards; }
.cf-cup .cf-steam:nth-of-type(2) { animation-delay: 200ms; }
.cf-cup .cf-steam:nth-of-type(3) { animation-delay: 400ms; }
.cf-cup .cf-sleeve { fill: var(--wcs-gold); opacity: .9; }
@keyframes cf-rise { to { stroke-dashoffset: 0; } }

/* signature: the cafe receipt */
.cf-receipt { position: relative; max-width: 420px; padding: var(--wp-space-6) var(--wp-space-6) var(--wp-space-5); background: var(--wcs-raised); color: var(--wcs-ink); box-shadow: var(--wcs-shadow-lifted); font-variant-numeric: tabular-nums;
  -webkit-mask: radial-gradient(circle 7px at 50% 0, transparent 98%, var(--wp-mask-solid)) top / 22px 51% repeat-x, radial-gradient(circle 7px at 50% 100%, transparent 98%, var(--wp-mask-solid)) bottom / 22px 51% repeat-x;
          mask: radial-gradient(circle 7px at 50% 0, transparent 98%, var(--wp-mask-solid)) top / 22px 51% repeat-x, radial-gradient(circle 7px at 50% 100%, transparent 98%, var(--wp-mask-solid)) bottom / 22px 51% repeat-x; }
.cf-receipt__head { margin: 0 0 var(--wp-space-4); text-align: center; font: 600 var(--wp-caption)/1.4 var(--wcs-sans); letter-spacing: var(--wp-track); text-transform: uppercase; color: var(--wcs-muted); }
.cf-receipt dl { margin: 0; display: grid; gap: 0; }
.cf-receipt dl div { display: flex; justify-content: space-between; gap: var(--wp-space-4); padding: var(--wp-space-3) 0; border-bottom: var(--wp-hairline) dashed var(--wcs-line); font-size: var(--wp-small); }
.cf-receipt dt { color: var(--wcs-ink-2); }
.cf-receipt dd { margin: 0; font-weight: 600; text-align: right; }
.cf-receipt__total { display: flex; justify-content: space-between; align-items: baseline; padding-top: var(--wp-space-4); font: 600 1.6rem/1 var(--wcs-serif); }
.cf-receipt__foot { margin: var(--wp-space-4) 0 0; text-align: center; font-size: var(--wp-caption); color: var(--wcs-muted); }

.cf-steps { list-style: none; margin: var(--wp-space-6) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp-space-5); counter-reset: cf; }
.cf-steps li { counter-increment: cf; position: relative; padding: var(--wp-space-6) var(--wp-space-5) var(--wp-space-5); background: var(--wcs-raised); border: var(--wp-hairline) solid var(--wcs-line); border-radius: var(--wp-radius-lg); }
.cf-steps li::before { content: counter(cf); position: absolute; top: calc(var(--wp-space-4) * -1); left: var(--wp-space-5); width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--wcs-sage-deep); color: var(--wp-on-dark); font: 600 .95rem/1 var(--wcs-sans); font-variant-numeric: tabular-nums; }
.cf-steps p { margin: var(--wp-space-2) 0 0; font-size: var(--wp-small); line-height: 1.6; color: var(--wcs-ink-2); }

.cf-form { display: grid; gap: var(--wp-space-4); }
.cf-field { display: grid; gap: var(--wp-space-2); font-size: var(--wp-small); font-weight: 600; color: var(--wcs-ink); }
.cf-field small { font-weight: 400; color: var(--wcs-muted); }
.cf-input { width: 100%; min-height: var(--wp-tap); padding: var(--wp-space-3) var(--wp-space-4); border: var(--wp-hairline) solid var(--wcs-line-strong); border-radius: var(--wcs-radius-sm); background: var(--wcs-raised); font: 400 1rem/1.4 var(--wcs-sans); color: var(--wcs-ink); }
.cf-input:focus { border-color: var(--wcs-sage); box-shadow: var(--wcs-focus); outline: none; }
.cf-row2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp-space-4); }
.cf-check { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--wp-space-3); align-items: start; font-size: var(--wp-caption); line-height: 1.55; color: var(--wcs-ink-2); }
.cf-check input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--wcs-sage-deep); }
.cf-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cf-alert { margin: 0 0 var(--wp-space-4); padding: var(--wp-space-3) var(--wp-space-4); border-radius: var(--wcs-radius-sm); background: var(--wcs-gold-wash); border: var(--wp-hairline) solid var(--wcs-gold); font-size: var(--wp-small); }

.cf-link { display: grid; gap: var(--wp-space-4); }
.cf-link__url { display: block; padding: var(--wp-space-4); border-radius: var(--wcs-radius-sm); background: var(--wcs-inset); border: var(--wp-hairline) dashed var(--wcs-line-strong); font: 600 1.05rem/1.4 var(--wcs-sans); word-break: break-all; color: var(--wcs-ink); }
.cf-share { display: flex; flex-wrap: wrap; gap: var(--wp-space-3); }
.cf-fine { margin: var(--wp-space-6) 0 0; font-size: var(--wp-caption); line-height: 1.7; color: var(--wcs-muted); }
.cf-fine h2 { margin: 0 0 var(--wp-space-2); font: 600 var(--wp-caption)/1.3 var(--wcs-sans); letter-spacing: var(--wp-track); text-transform: uppercase; color: var(--wcs-ink-2); }
.cf-fine ul { margin: 0; padding-left: var(--wp-space-5); display: grid; gap: var(--wp-space-1); }

@media (max-width: 960px) {
  .wp-hero__grid, .cf-hero__grid, .wp-split { grid-template-columns: minmax(0, 1fr); }
  .wp-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cf-cup { max-width: 240px; }
}
@media (max-width: 760px) {
  .wp-stops { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .wp-stops::before { left: 9px; right: auto; top: 10px; bottom: 10px; width: var(--wp-hairline); height: auto; background: linear-gradient(180deg, var(--wcs-sage-line), var(--wcs-gold), var(--wcs-sage-line)); }
  .wp-stop { text-align: left; }
  .wp-stop a { grid-template-columns: 19px minmax(0, 1fr) auto; justify-items: start; align-items: center; gap: var(--wp-space-1) var(--wp-space-4); padding: var(--wp-space-3) 0; }
  .wp-stop__name { grid-column: 2; }
  .wp-stop__dates { grid-column: 2; }
  .wp-stop__tag { grid-column: 3; grid-row: 1 / span 2; }
  .wp-stop__dot { grid-row: 1 / span 2; }
  .wp-covers, .cf-steps, .cf-row2 { grid-template-columns: minmax(0, 1fr); }
  .cf-steps { gap: var(--wp-space-6); }
  .cf-cup { max-width: 168px; }
  .wp-teaser { grid-template-columns: minmax(0, 1fr); text-align: left; }
  .wp-section { padding: var(--wp-space-7) 0; }
  .wp-card { padding: var(--wp-space-5); }
  .cf-receipt { padding: var(--wp-space-5) var(--wp-space-5) var(--wp-space-4); }
}
@media (prefers-reduced-motion: reduce) {
  .cf-cup .cf-steam { animation: none; stroke-dashoffset: 0; }
  .wp-tile, .wp-btn, .wp-stop__dot { transition: none; }
  .wp-tile:hover { transform: none; }
}