/* VOUCH v15. Receipt-led homepage system. Shared page styles stay independent. */
:root {
  --paper:#FAFAF6; --white:#FFFFFF; --ink:#16170F; --muted:#56574D;
  --yellow:#FFFD38; --line:#DADBD3; --wash:#F0F1E9;
  --display:"Archivo","Bahnschrift Condensed","Arial Narrow",Impact,sans-serif;
  --text:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --h1:clamp(3rem,6.111vw,5.5rem); --h2:clamp(2.25rem,4.167vw,3.75rem);
  --h3:clamp(1.625rem,2.222vw,2rem); --body:1rem; --small:.875rem; --label:.75rem;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px;
  --r1:12px; --r2:24px; --pill:999px;
  --e1:0 8px 24px rgb(22 23 15 / .08); --e2:0 20px 48px rgb(22 23 15 / .10);
  --ease:cubic-bezier(.2,.7,.2,1); --gut:20px;
}
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-padding-top:24px; }
body { margin:0; background:var(--paper); color:var(--ink); font:400 var(--body)/1.5 var(--text); }
[hidden] { display:none !important; }
::selection { background:var(--yellow); color:var(--ink); }
a { color:inherit; text-underline-offset:4px; }
button,summary { -webkit-tap-highlight-color:transparent; }
button { font:inherit; color:inherit; }
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex="0"]:focus-visible { outline:2px solid var(--ink); outline-offset:4px; box-shadow:0 0 0 4px var(--white); }
#main:focus { outline:none; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { font-family:var(--display); font-stretch:70%; text-transform:uppercase; letter-spacing:-.025em; }
h1 { font-size:var(--h1); font-stretch:62%; font-weight:900; line-height:.93; }
h2 { font-size:var(--h2); font-weight:800; line-height:1; }
h3 { font-size:var(--h3); font-weight:800; line-height:1.08; }
img { display:block; max-width:100%; }
svg { display:block; }
.skip { position:fixed; top:8px; left:16px; z-index:100; padding:12px 20px; border-radius:var(--pill); background:var(--ink); color:var(--white); transform:translateY(-150%); }
.skip:focus { transform:none; }
.pill { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:52px; padding:12px 24px; border:1px solid transparent; border-radius:var(--pill); font-size:.9375rem; font-weight:600; text-decoration:none; white-space:nowrap; transition:transform 180ms var(--ease); }
.pill svg { width:20px; height:20px; flex:none; transition:transform 180ms var(--ease); }
.pill--accent { background:var(--yellow); color:var(--ink); }
.pill--line { border-color:var(--ink); background:transparent; }
.pill:active { transform:scale(.98); }
@media (hover:hover) { .pill:hover { transform:translateY(-2px); } .pill:hover svg { transform:translateX(3px); } }
.chip { display:inline-flex; align-items:center; justify-content:center; border:1px solid currentColor; padding:3px 8px; border-radius:var(--pill); font:600 11px/1.2 var(--text); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }
.thumb { width:48px; height:48px; }

/* Navigation is part of the page, with a native no-script menu on phones. */
.masthead { position:relative; z-index:10; border-bottom:1px solid var(--line); }
.bar { max-width:1440px; min-height:80px; margin:auto; padding:12px var(--gut); display:flex; gap:24px; align-items:center; }
.bar__mark { display:inline-flex; align-items:center; gap:8px; min-height:44px; text-decoration:none; flex:none; }
.bar__thumb { width:30px; height:30px; }
.bar__word { width:95px; height:auto; }
.bar__tabs { display:flex; align-items:center; justify-content:center; gap:8px; margin:auto; }
.bar__tabs a { display:flex; min-height:44px; align-items:center; padding:8px 16px; border-radius:var(--pill); font-size:var(--small); text-decoration:none; }
.bar__tabs a[aria-current] { background:var(--wash); }
.bar__tabs a:hover { text-decoration:underline; }
.bar__status { font-size:var(--label); color:var(--muted); white-space:nowrap; }
.bar__cta { min-height:44px; padding:10px 20px; font-size:var(--small); }
.menu { display:none; }

/* The hero pairs a typographic promise with a compact receipt of brands. */
.open { max-width:1344px; margin:auto; padding:48px var(--gut) 48px; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.95fr); gap:64px; align-items:center; }
.open__copy { display:grid; gap:24px; min-width:0; }
.open h1 > span { display:block; }
.open h1 em { font-style:normal; background:linear-gradient(transparent 57%,var(--yellow) 57%,var(--yellow) 94%,transparent 94%); }
.lede { max-width:52ch; color:var(--muted); font-size:1.0625rem; line-height:1.55; }
.h-row { display:flex; flex-wrap:wrap; gap:12px; }
.brandwall { --bw-row:76px; position:relative; margin-top:16px; background:var(--white); border:1px solid var(--line); border-radius:var(--r2) var(--r2) 0 0; padding:40px 24px 16px; box-shadow:var(--e2); }
.brandwall__head { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:36px; margin-bottom:12px; padding-bottom:16px; border-bottom:1px dashed var(--line); }
.brandwall__head > span:first-child { max-width:26ch; font:600 var(--label)/1.4 var(--text); }
.brandwall__head .chip { background:var(--ink); color:var(--white); border-color:var(--ink); }
.brandwall__cols { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.brandwall__grid { list-style:none; margin:0; padding:0; }
.brandwall__grid li { min-width:0; height:var(--bw-row); display:grid; place-items:center; border-bottom:1px solid var(--line); padding:12px; }
.brandwall__col--a li { border-right:1px solid var(--line); }
.brandwall__grid li:last-child { border-bottom:0; }
.brandwall__grid img { width:100%; height:auto; max-width:150px; max-height:42px; object-fit:contain; }
.brandwall__grid img[alt="The Warehouse"] { max-width:160px; }
.brandwall__grid img[alt="Whittaker's"] { max-width:116px; }
.brandwall__grid img[alt="Mitre 10"] { max-width:112px; }
.brandwall__grid img[alt="Air New Zealand"] { max-width:158px; }
.brandwall__grid img[alt="Noel Leeming"] { max-width:125px; }
.brandwall__grid img[alt="Spark"] { max-width:104px; }
.brandwall__grid img[alt="Rebel Sport"] { max-width:80px; }
.brandwall__grid img[alt="Fisher & Paykel"] { max-width:150px; }
.brandwall__grid img[alt="Torpedo7"] { max-width:118px; }
.brandwall__grid img[alt="Glassons"] { max-width:118px; }
.brandwall__grid img[alt="Number One Shoes"] { max-width:136px; }
.brandwall__grid img[alt="One NZ"] { max-width:96px; }
.brandwall__grid img[alt="2degrees"] { max-width:60px; }
.brandwall__you { padding:0 !important; }
.brandwall__you a { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; min-height:44px; gap:2px; text-decoration:none; }
.brandwall__you b { font:800 1.25rem/1.1 var(--display); font-stretch:70%; text-transform:uppercase; }
.brandwall__you span { font-size:var(--label); color:var(--muted); text-decoration:underline; }
.brandwall__edge { position:absolute; height:10px; left:-1px; right:-1px; bottom:-10px; background:linear-gradient(135deg,var(--white) 50%,transparent 50%) 0 0/16px 16px,linear-gradient(225deg,var(--white) 50%,transparent 50%) 0 0/16px 16px; }
.brandwall__sticker { position:absolute; z-index:1; right:24px; top:-52px; width:88px; height:88px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:3px; border-radius:var(--pill); background:var(--yellow); border:1px solid var(--ink); transform:rotate(12deg); box-shadow:0 0 0 5px var(--paper); }
.brandwall__sticker span { font:800 11px/1 var(--display); font-stretch:75%; text-transform:uppercase; letter-spacing:.03em; }
.brandwall__sticker .thumb { width:38px; height:38px; }

/* One row, edge to edge. The same people never appear twice in its source. */
.reel { --tile:clamp(260px,19.445vw,320px); --gap:16px; padding-top:8px; }
.reel__rail { overflow-x:auto; overflow-y:hidden; scrollbar-width:thin; scrollbar-color:var(--ink) var(--wash); }
.reel__rail:focus-visible { outline-offset:-3px; box-shadow:none; }
.reel__track { display:flex; gap:var(--gap); width:max-content; list-style:none; margin:0; padding:0; }
.reel__track li { width:var(--tile); aspect-ratio:9/16; position:relative; flex:none; overflow:hidden; border-radius:var(--r1); background:var(--wash); }
.reel__track img { width:100%; height:100%; object-fit:cover; }
.reel__track li:first-child img { object-position:50% 40%; }
.reel__track.is-loop { animation:rail-slide var(--rail-duration,160s) linear infinite; animation-delay:var(--rail-delay,0s); }
.reel.is-running .reel__rail { overflow-x:hidden; }
.reel.is-held .reel__track { animation-play-state:paused; }
.reel:not(.is-running) [data-clone] { display:none; }
@keyframes rail-slide { to { transform:translateX(calc(-50% - var(--gap)/2)); } }
.clip { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; pointer-events:none; transition:opacity 200ms var(--ease); }
.clip.is-on { opacity:1; }
.reel.is-reduced .clip { display:none; }

/* The quiet pause carries the purchase-first promise. */
.say { margin-top:48px; background:var(--ink); color:var(--white); }
.say__inner { max-width:1344px; margin:auto; padding:48px var(--gut); display:grid; grid-template-columns:1.4fr 1fr; gap:64px; align-items:center; }
.say__line { font:800 clamp(2.25rem,3.889vw,3.5rem)/1.06 var(--display); font-stretch:70%; letter-spacing:-.02em; text-transform:uppercase; max-width:22ch; }
.say__line span { display:inline-block; background:var(--yellow); color:var(--ink); padding:0 8px 3px; }
.say__sub { max-width:45ch; font-size:1.0625rem; color:#E6E7E0; }

/* Receipt, post, payout: one open sequence with perforated dividers. */
.how { max-width:1344px; margin:auto; padding:80px var(--gut) 0; }
.how h2,.how__sub { text-align:center; }
.how__sub { margin:16px auto 40px; max-width:55ch; color:var(--muted); }
.how__steps { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0; padding:0; }
.how__steps li { display:flex; flex-direction:column; padding:0 24px; min-width:0; border-right:1px dashed #B6B7AE; }
.how__steps li:first-child { padding-left:0; }
.how__steps li:last-child { padding-right:0; border:0; }
.how__steps h3 { margin:24px 0 12px; }
.how__steps li > p { color:var(--muted); max-width:46ch; }
.how__art { position:relative; display:grid; place-items:center; height:248px; border-radius:var(--r2); background:var(--wash); overflow:hidden; }
.rcpt { width:212px; padding:20px 20px 16px; background:var(--white); box-shadow:var(--e1); transform:rotate(-5deg); font-size:12px; position:relative; }
.rcpt::after { content:""; position:absolute; height:8px; inset:auto 0 -8px; background:linear-gradient(135deg,var(--white) 50%,transparent 50%) 0 0/12px 12px,linear-gradient(225deg,var(--white) 50%,transparent 50%) 0 0/12px 12px; }
.rcpt__h { font:800 16px/1 var(--display); font-stretch:70%; text-transform:uppercase; text-align:center; padding-bottom:12px; margin-bottom:8px; border-bottom:1px dashed var(--line); }
.rcpt__row,.rcpt__tot { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 4px; }
.rcpt__row i,.rcpt__tot i { display:block; width:20px; border-top:2px solid #B6B7AE; }
.rcpt__row--on { background:var(--yellow); font-weight:600; }
.rcpt__tot { border-top:1px dashed var(--line); margin-top:8px; font-weight:600; }
.rcpt__barcode { height:12px; width:110px; margin:12px auto 0; opacity:.6; background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 3px,var(--ink) 3px 5px,transparent 5px 7px); }
.receipt-stamp { position:absolute; right:calc(50% - 119px); bottom:24px; display:grid; place-items:center; width:56px; height:56px; border:1px solid var(--ink); background:var(--yellow); border-radius:var(--pill); transform:rotate(10deg); }
.receipt-stamp .thumb { width:32px; height:32px; }
.howphone { height:220px; width:140px; position:relative; overflow:hidden; border:5px solid var(--ink); border-radius:var(--r2); box-shadow:var(--e1); transform:rotate(4deg); background:var(--ink); }
.howphone img { width:100%; height:100%; object-fit:cover; object-position:50% 30%; }
.howphone figcaption { position:absolute; bottom:0; left:0; right:0; background:rgb(22 23 15 / .85); color:var(--white); padding:8px 4px; text-align:center; font-size:10px; }
.example-post { position:absolute; bottom:24px; left:calc(50% - 114px); padding:8px 12px; border-radius:var(--pill); background:var(--white); border:1px solid var(--line); font-size:12px; transform:rotate(-5deg); }
.paynote { width:calc(100% - 32px); max-width:272px; padding:20px; border:1px solid var(--line); border-radius:var(--r1); background:var(--white); box-shadow:var(--e1); transform:rotate(-2deg); }
.paynote__top { display:flex; align-items:center; gap:8px; margin-bottom:16px; }
.paynote__top > b { font:800 16px/1 var(--display); font-stretch:70%; text-transform:uppercase; }
.paynote__top .chip { margin-left:auto; font-size:9px; }
.paynote__icon { display:grid; place-items:center; width:28px; height:28px; background:var(--yellow); border-radius:var(--pill); }
.paynote__icon .thumb { width:18px; height:18px; }
.paynote__t { font-size:12px; color:var(--muted); }
.paynote__b strong { display:block; font:800 48px/1.1 var(--display); font-stretch:70%; letter-spacing:-.03em; margin:4px 0 8px; }
.paynote__b > span { display:block; max-width:24ch; color:var(--muted); font-size:12px; }
.how__brand { margin:40px auto 0; padding:24px 32px; max-width:74ch; border-block:1px dashed #B6B7AE; text-align:center; color:var(--muted); }
.how__brand b { color:var(--ink); }

/* Equal audience routes share one ink panel. */
.doors { max-width:1248px; margin:80px auto 64px; background:var(--ink); color:var(--white); border-radius:var(--r2); display:grid; grid-template-columns:1fr 1fr; }
.door { padding:48px; display:flex; flex-direction:column; align-items:flex-start; }
.door--brand { border-left:1px dashed #6D6E65; }
.door p { max-width:48ch; color:#E6E7E0; margin:20px 0 24px; }
.door .pill { margin-top:auto; }
.foot { max-width:1344px; padding:0 var(--gut) 32px; margin:auto; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px; font-size:var(--small); color:var(--muted); }
.foot__brand { display:flex; flex-direction:column; gap:8px; align-items:flex-start; }
.foot__mark { display:inline-flex; gap:8px; align-items:center; min-height:44px; color:var(--ink); text-decoration:none; }
.foot__mark svg { width:30px; height:30px; }
.foot__mark b { font:800 28px/1 var(--display); font-stretch:70%; }
.foot__col { display:flex; flex-direction:column; align-items:flex-start; }
.foot__h { font-weight:600; color:var(--ink); margin-bottom:8px; }
.foot__col a { display:flex; align-items:center; min-height:44px; text-decoration:none; }
.foot__col a:hover { text-decoration:underline; }
.foot__small > span { display:block; max-width:75ch; }
.foot__small { grid-column:1/-1; border-top:1px solid var(--line); padding-top:24px; max-width:none; font-size:12px; line-height:1.6; }

/* Endless vertical logo wall. JS clones the cells and adds .is-scrolling; without it the grid is a static list. */
.brandwall:not(.is-scrolling) [data-wall-clone] { display:none; }
.brandwall:not(.is-scrolling) .brandwall__you--b > * { visibility:hidden; }
.brandwall.is-scrolling .brandwall__window { height:calc(var(--bw-row)*3.5); overflow:hidden; overflow:clip; -webkit-mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent); mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent); }
.brandwall.is-scrolling .brandwall__grid li { border-bottom:1px solid var(--line); }
.brandwall.is-scrolling .brandwall__grid { animation:wall-up var(--wall-duration,12s) linear infinite; will-change:transform; }
.brandwall.is-scrolling .brandwall__col--b { animation-name:wall-down; }
.motion-off .brandwall__grid, .brandwall:focus-within .brandwall__grid { animation-play-state:paused; }
@media (hover:hover) { .brandwall:hover .brandwall__grid { animation-play-state:paused; } }
@keyframes wall-up { to { transform:translateY(-50%); } }
@keyframes wall-down { from { transform:translateY(-50%); } to { transform:translateY(0); } }
@media (min-width:768px) { :root { --gut:32px; } }
@media (min-width:1200px) { :root { --gut:48px; } }
@media (max-width:1199px) {
  .bar { gap:16px; }
  .bar__tabs { gap:0; }
  .bar__tabs a { padding-inline:12px; }
  .open { gap:40px; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); }
  .brandwall { padding:40px 16px 12px; }
  .brandwall__sticker { right:20px; top:-52px; width:88px; height:88px; }
  .brandwall { --bw-row:68px; }
  .brandwall__grid li { padding:12px; }
  .brandwall__head { gap:8px; }
  .doors { margin-inline:var(--gut); }
  .door { padding:32px; }
  .how__steps li { padding-inline:16px; }
  .say__inner { gap:40px; }
}
@media (max-width:899px) {
  .bar__tabs,.bar__status { display:none; }
  .bar__cta { margin-left:auto; }
  .menu { display:block; }
  .menu summary { width:44px; min-height:44px; border:1px solid var(--ink); border-radius:var(--pill); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:5px; cursor:pointer; list-style:none; }
  .menu summary::-webkit-details-marker { display:none; }
  .menu summary span { width:17px; height:1.5px; background:var(--ink); transition:transform 180ms var(--ease); }
  .menu[open] summary span:first-child { transform:translateY(3.25px) rotate(45deg); }
  .menu[open] summary span:last-child { transform:translateY(-3.25px) rotate(-45deg); }
  .menu__panel { position:absolute; top:calc(100% + 8px); left:var(--gut); right:var(--gut); padding:16px; background:var(--white); border:1px solid var(--ink); border-radius:var(--r2); box-shadow:var(--e2); }
  .menu__panel a { display:flex; align-items:center; min-height:48px; padding:8px 12px; text-decoration:none; border-radius:var(--r1); }
  .menu__panel a[aria-current] { background:var(--wash); }
  .menu__status { display:block; padding:12px; font-size:var(--label); color:var(--muted); border-top:1px dashed var(--line); margin-top:8px; }
  .open { gap:24px; padding-block:40px; }
  .open h1 { font-size:clamp(3rem,6.6vw,4rem); font-stretch:62%; }
  .brandwall__head > span:first-child { font-size:11px; }
  .brandwall__sticker { width:72px; height:72px; top:-40px; right:8px; gap:1px; }
  .brandwall__sticker span { font-size:9px; }
  .brandwall__sticker .thumb { width:28px; height:28px; }
  .brandwall { --bw-row:64px; }
  .brandwall__grid li { padding:8px; }
  .brandwall__you b { font-size:1.0625rem; }
  .brandwall__you span { font-size:11px; }
  .h-row { gap:8px; }
  .h-row .pill { gap:12px; padding-inline:16px; }
  .lede { font-size:1rem; }
  .how { padding-top:64px; }
  .how__steps { gap:32px; }
  .how__steps li { border:0; padding:0; }
  .how__art { height:208px; }
  .rcpt { width:174px; padding:16px 12px 12px; }
  .rcpt__row { font-size:11px; }
  .receipt-stamp { right:0; bottom:16px; }
  .howphone { width:120px; height:188px; }
  .example-post { left:0; bottom:16px; font-size:10px; padding:6px 8px; }
  .paynote { width:calc(100% - 8px); padding:12px; }
  .paynote__top { gap:4px; }
  .paynote__top > b { font-size:13px; }
  .paynote__top .chip { font-size:8px; padding:3px 4px; }
  .paynote__b strong { font-size:40px; }
  .say__inner { grid-template-columns:1.25fr 1fr; gap:32px; }
  .foot { gap:24px; }
}
@media (max-width:679px) {
  .bar { min-height:72px; padding-block:8px; gap:12px; }
  .bar__thumb { width:25px; height:25px; }
  .bar__word { width:78px; }
  .bar__mark { gap:5px; }
  .bar__cta { padding-inline:16px; font-size:12px; }
  .open { display:flex; flex-direction:column; gap:24px; padding-top:24px; padding-bottom:24px; }
  .open__copy { width:100%; gap:16px; }
  .open h1 { font-size:clamp(2.65rem,12.3vw,4.625rem); line-height:.94; font-stretch:62%; }
  .lede { max-width:55ch; font-size:1rem; line-height:1.5; }
  .h-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .h-row .pill { min-height:48px; justify-content:space-between; font-size:14px; padding:12px 16px; gap:8px; }
  .h-row .pill svg { width:18px; height:18px; }
  .brandwall { width:100%; margin-top:0; padding:12px 8px 8px; box-shadow:none; border-radius:var(--r1) var(--r1) 0 0; }
  .brandwall__sticker { display:none; }
  .brandwall__head { padding:0 4px 12px; margin-bottom:0; min-height:32px; }
  .brandwall__head > span:first-child { max-width:none; font-size:11px; }
  .brandwall__head .chip { font-size:9px; }
  .brandwall { --bw-row:44px; }
  .brandwall__grid li { padding:7px 16px; border:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
  .brandwall__col--b li { border-right:0; }
  .brandwall__grid li:last-child { border-bottom:0; }
  .brandwall__grid img { max-height:24px; max-width:126px; }
  .brandwall__you b { font-size:14px; }
  .brandwall__you span { font-size:10px; }
  .brandwall__edge { height:6px; bottom:-6px; background-size:12px 12px; }
  .reel { --tile:calc((100vw - 24px)/3); --gap:8px; padding-top:0; }
  .reel__track li { border-radius:var(--r1); }
  .say { margin-top:24px; }
  .say__inner { padding-block:40px; grid-template-columns:1fr; gap:20px; text-align:center; justify-items:center; }
  .say__line { font-size:clamp(2rem,9.2vw,3.25rem); max-width:22ch; }
  .say__sub { font-size:1rem; max-width:45ch; }
  .how { padding-top:48px; }
  .how__sub { margin:16px auto 32px; max-width:34ch; }
  .how__steps { grid-template-columns:1fr; gap:32px; }
  .how__steps li { display:grid; grid-template-columns:112px minmax(0,1fr); gap:8px 20px; border-bottom:1px dashed var(--line); padding:0 0 24px; align-content:center; }
  .how__steps li:last-child { padding-bottom:0; }
  .how__steps h3 { font-size:26px; margin:0; align-self:end; }
  .how__steps li > p { font-size:14px; line-height:1.5; }
  .how__art { grid-row:span 2; height:184px; width:112px; align-self:center; background:transparent; border-radius:0; overflow:visible; }
  .rcpt { width:112px; padding:12px 8px 8px; transform:rotate(-5deg); }
  .rcpt__h { font-size:12px; padding-bottom:8px; margin-bottom:4px; }
  .rcpt__row { font-size:8px; padding-block:5px; gap:2px; }
  .rcpt__row i,.rcpt__tot i { width:9px; border-width:1px; }
  .rcpt__tot { font-size:8px; margin-top:4px; padding:5px 4px; }
  .rcpt__barcode { width:64px; height:10px; margin-top:8px; }
  .receipt-stamp { width:36px; height:36px; right:-3px; bottom:14px; }
  .receipt-stamp .thumb { width:20px; height:20px; }
  .howphone { height:164px; width:106px; border-width:4px; border-radius:var(--r1); }
  .howphone figcaption { font-size:7px; padding:7px 3px; }
  .example-post { font-size:10px; bottom:4px; left:3px; padding:5px 8px; }
  .paynote { width:120px; max-width:none; padding:12px 8px; }
  .paynote__top { flex-wrap:wrap; margin-bottom:12px; }
  .paynote__top > b { font-size:12px; }
  .paynote__top .chip { margin-left:0; font-size:10px; }
  .paynote__icon { width:21px; height:21px; }
  .paynote__icon .thumb { width:14px; height:14px; }
  .paynote__t { font-size:9px; }
  .paynote__b strong { font-size:29px; margin:4px 0 8px; }
  .paynote__b > span { font-size:10px; }
  .how__brand { padding:24px 0; margin-top:32px; font-size:14px; }
  .doors { grid-template-columns:1fr; margin:48px var(--gut); }
  .door { padding:32px 24px; }
  .door h2 { font-size:36px; }
  .door p { font-size:16px; margin:16px 0 24px; }
  .door--brand { border-left:0; border-top:1px dashed #6D6E65; }
  .door .pill { width:100%; justify-content:space-between; }
  .foot { grid-template-columns:1fr 1fr; gap:24px 16px; padding-bottom:24px; }
  .foot__brand { grid-column:1/-1; }
  .foot__col a { font-size:13px; }
  .foot__small { font-size:12px; }
}
@media (max-width:359px) {
  :root { --gut:16px; }
  .bar { gap:8px; }
  .bar__word { width:68px; }
  .bar__thumb { width:22px; }
  .bar__cta { padding-inline:12px; }
  .h-row { gap:8px; }
  .h-row .pill { padding-inline:12px; font-size:13px; }
  .brandwall__grid li { padding:6px; }
  .brandwall__head > span:first-child { font-size:10px; }
  .how__steps li { grid-template-columns:100px minmax(0,1fr); gap:8px 16px; }
  .how__art { width:100px; }
  .how__steps h3 { font-size:24px; }
  .rcpt { width:100px; }
  .paynote { width:106px; padding-inline:6px; }
  .paynote__top .chip { font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .reel.is-running .reel__rail { overflow-x:auto; }
  .reel [data-clone],.clip { display:none !important; }
  .pill:hover,.pill:hover svg,.pill:active { transform:none; }
}

/* Static wall, 19 Oct 2026: one column, no scrolling clones. Categories, not brand logos. */
.brandwall--static .brandwall__cols { grid-template-columns:1fr; }
.brandwall--static .brandwall__col--a li { border-right:0; }
.brandwall__grid--kinds li { font:800 2rem/1 var(--display); font-stretch:70%; text-transform:uppercase; letter-spacing:-.01em; }
@media (max-width:679px) { .brandwall__grid--kinds li { font-size:1.25rem; } }