/* Look AU "Shelf": a shop's shelving seen straight on. The page is the back panel of the shelves (wall); a shelf board
   with a price channel (board, with a lighter top lip and a darker lower edge) runs under the hero photo and under the
   range, and every priced item is printed on a white shelf-edge label clipped into it: the item's name top left, a
   unit box bottom left and the price bottom right, the whole amount large in condensed Oswald with the cents (or ",–")
   small, raised and underlined in the label's one colour (tick). Everything that has no price sits on the wall with
   plain space around it. The one button is a piece of board (act), or label stock on a photo; mustard offer stock is
   kept for the tags of new items and the wobbler. Palettes (design.ts) only re-set the tokens below.
   Every class starts with au- (stylesheets are global; g- belongs to the gallery). */
@font-face{font-family:"Oswald AU";font-style:normal;font-weight:200 700;font-display:swap;src:url(fonts/oswald-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Oswald AU";font-style:normal;font-weight:200 700;font-display:swap;src:url(fonts/oswald-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Figtree AU";font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/figtree-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Figtree AU";font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/figtree-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Rubik AU";font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/rubik-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Rubik AU";font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/rubik-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{--wall:#f2ede5;--wall2:#e8e1d6;--board:#2e2620;--board-hi:#4b4038;--board-lo:#1b1612;--onboard:#f4efe7;
  --label:#fffdf9;--lab-ink:#1a1612;--lab-mute:#574d44;--lab-line:#ddd5ca;--offer:#f1c644;--shut:#ebe5dc;--tick:#b8322a;--act:var(--board);--onact:var(--onboard);
  --ink:#1a1612;--mute:#544a41;--line:#cdc2b3;--plinth:#1a1612;--onplinth:#ebe4d9;--onphoto:#fffaf2;
  --au-d:"Oswald AU",var(--fd);--au-t:"Figtree AU",var(--ft);
  --wmax:1320px;--pad:clamp(16px,4vw,48px);--gap:clamp(12px,1.4vw,18px);--chan:8px;--top:64px;--sec:clamp(80px,9vw,128px);
  --m-accent:var(--tick);--m-head-offset:var(--top);
  /* gallery sections (factory/sections/gallery) in the look's tokens */
  --g-bg:transparent;--g-paper:var(--wall);--g-surface:var(--wall2);--g-ink:var(--ink);--g-muted:var(--mute);--g-line:var(--line);
  --g-accent:var(--board);--g-on-accent:var(--onboard);--g-radius:0;--g-fw:600;--g-ls:0;--g-fd:var(--au-d);--g-ft:var(--au-t);--g-max:var(--wmax);
  --g-pad:var(--pad);--g-top:var(--top)}
body.f-corner{--au-t:"Rubik AU",var(--ft)}

*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:calc(var(--top) + 12px)}
body{margin:0;background:var(--wall);color:var(--ink);font:400 calc(17px*var(--tune-size,1))/1.55 var(--au-t);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
main{display:block;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
h1,h2,h3{font-family:var(--au-d);font-weight:600;letter-spacing:-.005em;margin:0;text-wrap:balance}
h2{font-size:calc(clamp(34px,4.4vw,64px)*var(--tune-size,1));line-height:1}
p{margin:0}
figure{margin:0}
ul,ol,dl,dd{margin:0;padding:0;list-style:none}
.au-w{width:min(100%,var(--wmax));margin-inline:auto;padding-inline:var(--pad)}
.au-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* a hidden heading keeps overflow visible (so it never counts as clipped text); its box clips it instead */
h3.au-sr{overflow:visible;margin:0}
.au-hrs{position:relative;overflow:clip}

.au-skip{position:absolute;left:12px;top:-60px;z-index:60;background:var(--act);color:var(--onact);padding:10px 14px;border-radius:0;font-weight:600}
.au-skip:focus{top:12px}

/* ---------- the board: a shelf edge across the whole page width (border-image outset never widens the page) ---------- */
.au-board{background-color:var(--board);border-image:linear-gradient(var(--board-hi) 0 3px,var(--board) 3px calc(100% - 5px),var(--board-lo) calc(100% - 5px)) 0 fill / 0 / 0 100vmax}
/* a rail: every child of .au-rail-l sits in the price channel of its own row's board (the price list on the range
   page, which can wrap) */
.au-rail-l{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:calc(2 * var(--chan) + clamp(20px,2.4vw,32px)) var(--gap);isolation:isolate}
.au-rail-l>*{position:relative;margin-block:var(--chan);min-width:0}
.au-rail-l>*::after{content:"";position:absolute;inset:calc(-1 * var(--chan)) calc(-1 * var(--gap) / 2 - 1px);z-index:-1;pointer-events:none;
  border-image:linear-gradient(var(--board-hi) 0 3px,var(--board) 3px calc(100% - 5px),var(--board-lo) calc(100% - 5px)) 0 fill / 0 / 0 100vmax}
.au-rail-l>li>.au-sel,.au-rail-l>li{height:100%}
.au-n1{--n:1}.au-n2{--n:2}.au-n3{--n:3}.au-n4{--n:4}.au-n5{--n:5}.au-n6{--n:6}.au-n7{--n:7}

/* ---------- the shelf-edge label ---------- */
.au-sel{background:var(--label);color:var(--lab-ink);border-radius:0;padding:14px 16px 12px;display:grid;grid-template-rows:1fr auto;gap:12px;
  box-shadow:0 1px 0 rgb(0 0 0/.14);min-width:0}
/* the clipped corner of a shelf ticket: labels, menu labels and the button lose their top-right corner. Labels that
   carry their own slice of board (a rail's direct children) keep theirs, as the clip would cut the board away. Focus
   rings sit inside, where the clip cannot cut them. */
.au-sel:not(.au-rail-l>*),.au-tab,.au-btn,.au-skip,.au-menu summary,.au-kicker{clip-path:polygon(0 0,calc(100% - var(--cut,10px)) 0,100% var(--cut,10px),100% 100%,0 100%)}
.au-tab,.au-btn,.au-skip,.au-menu summary,.au-kicker{--cut:8px}
.au-tab:focus-visible,.au-btn:focus-visible,.au-menu summary:focus-visible,.au-sel a:focus-visible{outline-offset:-5px}
.au-sel-o{background:var(--offer)}
.au-sel-t{min-width:0}
.au-sel-g{font:600 calc(13px*var(--tune-size,1))/1.2 var(--au-t);color:var(--lab-mute);margin:0 0 6px}
.au-sel-n{font:500 calc(clamp(20px,1.7vw,24px)*var(--tune-size,1))/1.12 var(--au-d);margin:0;letter-spacing:0;overflow-wrap:break-word;hyphens:auto}
.au-sel-n a{text-decoration:none}
.au-sel-n a:hover{text-decoration:underline}
.au-sel-x{font:400 calc(15px*var(--tune-size,1))/1.45 var(--au-t);color:var(--lab-mute);margin-top:6px}
.au-sel-o .au-sel-x,.au-sel-o .au-sel-g{color:var(--lab-ink)}
.au-sel-f{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;border-top:1px solid var(--lab-line);padding-top:10px}
.au-sel-o .au-sel-f{border-top-color:rgb(0 0 0/.2)}
.au-sel-u{font:500 13px/1 var(--au-t);color:var(--lab-ink);border:1px solid currentColor;border-radius:0;padding:6px 8px 5px;white-space:nowrap;max-width:60%;overflow:hidden;text-overflow:ellipsis}
/* the price: whole amount large, currency and cents small and raised, the cents underlined in the label's colour */
.au-pr{display:inline-grid;grid-template-columns:auto auto auto;grid-template-areas:"f f f" "c w d";align-items:start;font-family:var(--au-d);color:var(--lab-ink);line-height:1;margin-left:auto;white-space:nowrap}
.au-pr-f{grid-area:f;justify-self:end;font:500 calc(12px*var(--tune-size,1))/1 var(--au-t);margin-bottom:2px}
.au-pr-c{grid-area:c;font-weight:600;font-size:calc(clamp(17px,1.4vw,20px)*var(--tune-size,1));margin:.2em 2px 0 0}
.au-pr-w{grid-area:w;font-weight:700;font-size:calc(clamp(40px,3.5vw,50px)*var(--tune-size,1));line-height:.86;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.au-pr-d{grid-area:d;font-weight:600;font-size:calc(clamp(16px,1.3vw,19px)*var(--tune-size,1));line-height:1;margin:.12em 0 0 3px;padding-bottom:2px;border-bottom:2px solid var(--tick)}
.au-pr-d:empty{display:none}
.au-sel-sm{padding:10px 12px 9px;gap:8px}
.au-sel-sm .au-sel-n{font-size:calc(17px*var(--tune-size,1))}
.au-sel-sm .au-sel-f{padding-top:7px}
.au-sel-sm .au-pr-w{font-size:calc(32px*var(--tune-size,1))}
.au-sel-sm .au-pr-c,.au-sel-sm .au-pr-d{font-size:calc(15px*var(--tune-size,1))}
.au-sel-sm .au-sel-u{font-size:calc(12px*var(--tune-size,1));padding:5px 6px 4px}
@media (hover:hover){.au-sel{transition:transform .2s cubic-bezier(.2,.7,.2,1)}.au-sel:has(a:hover){transform:translateY(-2px)}}

/* ---------- actions ---------- */
.au-btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 30px;background:var(--act);color:var(--onact);
  font:600 calc(19px*var(--tune-size,1))/1 var(--au-d);letter-spacing:.01em;text-decoration:none;border:0;border-radius:0;box-shadow:none;cursor:pointer}
.au-btn:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.2em}
.au-btn-k{background:var(--lab-ink);color:var(--label)}
.au-btn-w,:is(.au-h-shelf,.au-h-stack,.au-end-o) .au-btn{background:var(--label);color:var(--lab-ink)}
.au-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px}
.au-ph{font:500 21px/1 var(--au-d);letter-spacing:.01em;white-space:nowrap}
.au-more{font:500 calc(19px*var(--tune-size,1))/1.2 var(--au-d);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--tick);text-underline-offset:.25em}
/* the kicker: a small paper ticket, the one label in the hero's words */
.au-kicker{display:inline-block;background:var(--label);color:var(--lab-ink);font:600 calc(15px*var(--tune-size,1))/1.2 var(--au-t);padding:7px 18px 6px 11px;border-radius:0}
.au-h1{font-size:calc(clamp(56px,8.6vw,132px)*var(--tune-size,1));line-height:.92;font-weight:600;letter-spacing:-.01em}
/* the typographic signature: the headline's second line in the light cut of the same face */
.au-h1-t{display:block;font-weight:300}
.au-lede{font-size:calc(clamp(17px,1.4vw,20px)*var(--tune-size,1));line-height:1.5;color:var(--mute);max-width:44ch}

/* ---------- header: the top board, pages as labels in its channel ---------- */
.au-top{position:sticky;top:0;z-index:40;height:var(--top);color:var(--onboard)}
.au-top-in{height:100%;display:flex;align-items:center;gap:clamp(12px,1.6vw,20px)}
.au-name{font:600 clamp(20px,1.9vw,26px)/1 var(--au-d);letter-spacing:.005em;text-decoration:none;margin-right:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;padding-bottom:1px}
.au-name:hover{text-decoration:underline}
/* the board's price channel: a recessed rail the labels are clipped into, its lips overlapping their edges */
.au-nav ul{display:flex;gap:6px;align-items:center;height:50px;padding:0 6px;background:var(--board-lo);
  box-shadow:inset 0 -2px 0 rgb(255 255 255/.1)}
/* a shelf-edge label: square paper strip, a rule along the top, the name */
.au-tab{display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;background:var(--label);color:var(--lab-ink);
  box-shadow:none;font:500 17px/1 var(--au-d);text-decoration:none;white-space:nowrap}
.au-tab:hover{text-decoration:underline;text-decoration-thickness:2px}
.au-tab[aria-current]{box-shadow:none}
.au-tab-o{box-shadow:none;font-weight:600}
.au-top .langs{gap:12px;font:500 calc(15px*var(--tune-size,1))/1 var(--au-t);color:var(--onboard)}
.au-top .langs a[aria-current]{text-decoration-thickness:2px}
.au-menu{display:none}
.au-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;height:40px;padding:0 16px;background:var(--label);color:var(--lab-ink);
  box-shadow:none;border-radius:0;font:600 calc(17px*var(--tune-size,1))/1 var(--au-d)}
.au-menu summary::-webkit-details-marker{display:none}
.au-menu>nav{position:absolute;left:0;right:0;top:var(--top);background:var(--wall2);padding:16px 0 20px;box-shadow:0 10px 24px rgb(0 0 0/.18)}
.au-menu>nav ul{display:grid;gap:10px}
.au-menu>nav .au-tab{height:48px;font-size:calc(19px*var(--tune-size,1));justify-content:space-between}
.au-menu-l{margin-top:14px}
.au-menu-l .langs{color:var(--ink);font-size:calc(16px*var(--tune-size,1))}
@media (max-width:900px){.au-nav,.au-top-in>.langs{display:none}.au-menu{display:block}}

/* ---------- hero: words on a photo (shelf, stack) ---------- */
.au-hero{position:relative}
.au-h-shelf .au-h1,.au-h-stack .au-h1{color:var(--onphoto);max-width:12ch}
.au-h-shelf .au-lede,.au-h-stack .au-lede{color:var(--onphoto);opacity:.9}
.au-hs-f img,.au-stk-f img,.au-sp-f img,.au-end-f img{width:100%;height:100%;object-fit:cover}
/* the shade that carries the words: darker towards the lower left, where they sit */
.au-hs-f::after,.au-stk-f::after,.au-end-f::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgb(16 12 9/.74),rgb(16 12 9/.42) 46%,rgb(16 12 9/.06) 78%),linear-gradient(0deg,rgb(16 12 9/.5),rgb(16 12 9/0) 46%)}

/* ---------- hero: shelf (reference) ---------- */
/* the photo fills the shelf above the board; the board below it is solid wood */
.au-h-shelf{min-height:calc(100svh - var(--top));display:grid;grid-template:minmax(0,1fr) auto/100%;isolation:isolate}
.au-hs-f{grid-area:1/1;position:relative;z-index:-1;overflow:hidden;margin:0}
.au-hs-f img{position:absolute;inset:0}
.au-hs-t{grid-area:1/1;align-self:end;display:grid;justify-items:start;gap:clamp(16px,1.6vw,22px);padding-top:calc(clamp(64px,10vh,120px)*var(--tune-space,1));padding-bottom:calc(clamp(36px,6vh,72px)*var(--tune-space,1))}
.au-hs-t .au-acts{margin-top:clamp(4px,.8vw,10px)}
/* the shelf edge along the foot of the photo: the first priced items as labels in its channel */
.au-hs-r{padding-block:12px}
.au-hs-l{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:var(--gap)}
.au-hs-l .au-sel{height:100%}

/* ---------- hero: stack (the photo as one shelf compartment) ---------- */
.au-stk{padding-top:clamp(16px,2vw,28px)}
.au-stk-top{height:14px}
.au-stk-c{position:relative;isolation:isolate;height:clamp(440px,calc(100svh - var(--top) - 190px),760px);display:grid;align-items:end}
.au-stk-f{position:absolute;inset:0;z-index:-1;overflow:hidden}
.au-stk-t{display:grid;justify-items:start;gap:clamp(14px,1.5vw,20px);padding:clamp(24px,3.4vw,56px)}
.au-stk-t .au-h1{font-size:calc(clamp(52px,7.6vw,118px)*var(--tune-size,1))}
.au-stk-low{display:flex;justify-content:flex-end;padding:12px clamp(24px,3.4vw,56px)}
.au-stk-p{width:min(100%,360px)}
.au-wob{position:absolute;top:0;right:clamp(24px,4vw,64px);z-index:2;display:grid;justify-items:center;transform-origin:50% 0}
.au-wob-d{width:clamp(120px,11vw,160px);aspect-ratio:1;border-radius:50%;background:var(--offer);color:var(--lab-ink);display:grid;place-items:center;text-align:center;
  padding:0 16px;font:600 calc(clamp(18px,1.6vw,23px)*var(--tune-size,1))/1.08 var(--au-d);text-wrap:balance;box-shadow:0 6px 16px -6px rgb(0 0 0/.4)}
.au-wob-s{display:block;width:3px;height:clamp(24px,2.6vw,40px);background:var(--board-hi)}

/* ---------- hero: label (a split: photo left to the bottom edge, words and the lead label on the wall) ---------- */
.au-h-label{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:calc(100svh - var(--top))}
.au-sp-f{position:relative;overflow:hidden}
.au-sp-f img{position:absolute;inset:0}
.au-sp-t{display:grid;grid-template-rows:minmax(0,1fr) auto;min-width:0}
.au-sp-in{align-self:center;display:grid;justify-items:start;gap:clamp(16px,1.6vw,22px);padding:calc(clamp(40px,5vw,72px)*var(--tune-space,1)) var(--pad) calc(clamp(32px,4vw,56px)*var(--tune-space,1)) clamp(28px,4.4vw,72px)}
.au-sp-in .au-h1{font-size:calc(clamp(52px,6.8vw,104px)*var(--tune-size,1))}
/* the board under the words only: it runs on to the right edge of the window, never across the photo */
.au-sp-r{border-image-outset:0 100vmax 0 0;padding:12px var(--pad) 12px clamp(28px,4.4vw,72px)}
.au-sp-p{width:min(100%,420px)}
.au-sp-p .au-pr-w{font-size:calc(clamp(48px,5vw,72px)*var(--tune-size,1))}

/* ---------- sections ---------- */
.au-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px 32px;margin-bottom:calc(clamp(28px,3.4vw,48px)*var(--tune-space,1))}
.au-head p{max-width:46ch;color:var(--mute)}
.au-range{padding-top:var(--sec)}
.au-range-m{margin-top:calc(clamp(24px,3vw,40px)*var(--tune-space,1))}
/* labels: the range on one board, rows of labels in its channel */
.au-range-r{padding-block:14px}
.au-range-r .au-rail-l{row-gap:14px}
.au-range-r .au-rail-l>*{margin-block:0}
.au-range-r .au-rail-l>*::after{display:none}
/* facings: each item's photo standing over its label, the labels in the board's channel */
.au-fg{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:clamp(36px,4vw,56px) var(--gap);isolation:isolate}
.au-fg-i{display:grid;grid-template-rows:auto 1fr;min-width:0}
.au-fg-f{aspect-ratio:4/5;overflow:hidden;border-radius:0;width:100%}
.au-fg-f img{width:100%;height:100%;object-fit:cover}
.au-fg-r{position:relative;padding-block:var(--chan);display:grid}
.au-fg-r::before{content:"";position:absolute;inset:0 calc(-1 * var(--gap) / 2 - 1px);z-index:-1;
  border-image:linear-gradient(var(--board-hi) 0 3px,var(--board) 3px calc(100% - 5px),var(--board-lo) calc(100% - 5px)) 0 fill / 0 / 0 100vmax}
.au-fg-r .au-sel{height:100%}
.au-fg.au-n5 .au-pr-w{font-size:calc(clamp(30px,2.6vw,38px)*var(--tune-size,1))}

/* new on the shelf: a ruled list on the wall, each with a small mustard tag */
.au-new{padding-top:var(--sec)}
.au-new h2{margin-bottom:calc(clamp(24px,3vw,40px)*var(--tune-space,1))}
.au-new-l{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:28px clamp(24px,3vw,48px)}
.au-new-l li{border-top:1px solid var(--line);padding-top:18px;display:grid;gap:10px;align-content:start}
.au-new-g{justify-self:start;background:var(--offer);color:var(--lab-ink);font:600 calc(14px*var(--tune-size,1))/1 var(--au-t);padding:6px 9px 5px}
.au-new-l h3{font-size:calc(clamp(24px,2.2vw,32px)*var(--tune-size,1));line-height:1.1;font-weight:500}
.au-new-x{color:var(--mute)}

.au-story{padding-top:var(--sec);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center}
.au-story-p{grid-column:1/8;position:relative;padding-bottom:calc(clamp(48px,6vw,88px)*var(--tune-space,1))}
.au-story-a{width:80%;aspect-ratio:4/3;overflow:hidden;border-radius:0}
.au-story-b{position:absolute;right:0;bottom:0;width:40%;aspect-ratio:4/5}
.au-story-a img,.au-story-b img{width:100%;height:100%;object-fit:cover}
.au-story-b img{border-radius:0;box-shadow:0 0 0 8px var(--wall)}
.au-story-t{grid-column:9/13;display:grid;gap:20px}
.au-story-t h2{font-size:calc(clamp(34px,3.6vw,52px)*var(--tune-size,1))}
.au-story-t p{color:var(--mute);font-size:calc(18px*var(--tune-size,1))}
.au-story-t .au-story-c{font:500 calc(19px*var(--tune-size,1))/1.3 var(--au-d);color:var(--ink);padding-left:14px;border-left:3px solid var(--tick)}
/* figures: bare, set large in the price face, a hairline above each */
.au-figs{padding-top:calc(clamp(64px,7vw,104px)*var(--tune-space,1))}
.au-figs-l{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:24px clamp(24px,3vw,48px)}
.au-figs-l>div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:18px}
.au-figs-l dd{font:700 calc(clamp(64px,6.6vw,96px)*var(--tune-size,1))/.9 var(--au-d);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.au-figs-l dt{color:var(--mute);font-size:calc(16px*var(--tune-size,1));max-width:26ch}

.au-gal{padding-top:var(--sec)}
/* shop fittings are square: the shared gallery's rounded cards, pills and round buttons are squared off here */
.au-gal .g-sec,.au-gal .g-sec *{border-radius:0}
/* the stage's type follows the wall (light or dark), and its price sits on label stock */
.au-gal .g-st{--st-ink:var(--ink)}
.au-gal .g-st-price{background:var(--label);color:var(--lab-ink);backdrop-filter:none}
.au-gal .g-st-pk:hover{background:color-mix(in srgb,var(--ink) 10%,transparent)}
.au-gal .g-st-pk[aria-current],.au-gal .g-st-ctl .g-btn{background:var(--label);color:var(--lab-ink);box-shadow:none}
.au-gal .g-st-ctl .g-pill{border-color:var(--line)}

/* reviews: plain large quotes */
.au-rv{padding-top:var(--sec)}
.au-rv h2{margin-bottom:calc(clamp(28px,3.4vw,48px)*var(--tune-space,1))}
.au-qs{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:36px clamp(28px,3.4vw,56px)}
.au-qs li{display:grid;gap:18px;align-content:start;border-top:1px solid var(--line);padding-top:22px}
.au-qs blockquote{margin:0}
.au-qs blockquote p{font:400 calc(clamp(19px,1.6vw,23px)*var(--tune-size,1))/1.45 var(--au-t)}
.au-rv-reference .au-qs{grid-template-columns:minmax(0,980px)}
.au-rv-reference .au-qs li{border-top:0;padding-top:0}
.au-rv-reference .au-qs blockquote p{font:400 calc(clamp(30px,3.4vw,50px)*var(--tune-size,1))/1.18 var(--au-d)}
.au-qs em{font-style:normal;font-weight:600}
.au-rv-reference .au-qs em{font-weight:600}
.au-cite{font:500 calc(17px*var(--tune-size,1))/1.2 var(--au-d);color:var(--mute)}

/* visit: the heading and address left, opening hours as ruled rows right */
.au-visit{padding-top:var(--sec);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px clamp(32px,5vw,96px);align-items:start}
.au-visit-h{display:grid;gap:20px}
.au-visit-a{display:grid;gap:8px;font:500 calc(20px*var(--tune-size,1))/1.3 var(--au-d)}
.au-visit-a a{justify-self:start}
.au-hrs-l>div{display:flex;justify-content:space-between;align-items:baseline;gap:24px;border-top:1px solid var(--line);padding-block:14px}
.au-hrs-l>div:last-child{border-bottom:1px solid var(--line)}
.au-hrs-l dt{font-size:calc(18px*var(--tune-size,1))}
.au-hrs-l dd{font:600 clamp(24px,2.2vw,32px)/1 var(--au-d);font-variant-numeric:tabular-nums;white-space:nowrap}
.au-shut dd{font-weight:400;color:var(--mute)}
.au-wk .wk ol{display:grid;gap:8px}
.au-wk .wk li{display:grid;grid-template-columns:5ch minmax(0,1fr) 13ch;gap:14px;align-items:center;font:500 calc(15px*var(--tune-size,1))/1.2 var(--au-t)}
.au-wk .wk-bar{position:relative;height:14px;background:var(--wall2);border-radius:0}
.au-wk .wk-bar i{position:absolute;top:0;bottom:0;background:color-mix(in srgb,var(--ink) 72%,var(--board));border-radius:0}
.au-wk .wk-t{font:600 calc(17px*var(--tune-size,1))/1 var(--au-d);text-align:right;font-variant-numeric:tabular-nums}
.au-wk .off .wk-t{color:var(--mute);font-weight:500}
.au-wk .wk-scale{display:flex;justify-content:space-between;margin:6px calc(13ch + 14px) 0 calc(5ch + 14px);font-size:calc(13px*var(--tune-size,1));color:var(--mute)}

/* closing */
.au-end{margin-top:var(--sec)}
.au-end-in h2{font-size:calc(clamp(38px,5vw,76px)*var(--tune-size,1))}
.au-end-in>p:not(.au-end-a){font-size:calc(19px*var(--tune-size,1));max-width:44ch}
.au-end-a{display:flex;flex-wrap:wrap;align-items:center;gap:14px 32px;margin-top:8px}
.au-end-p{font:700 clamp(32px,3.8vw,56px)/1 var(--au-d);text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.au-end-p:hover{text-decoration:underline}
/* offer: a full-bleed photo band */
.au-end-o{position:relative;isolation:isolate;display:grid;align-items:center;min-height:clamp(440px,48vw,640px);color:var(--onphoto)}
.au-end-f{position:absolute;inset:0;z-index:-1;overflow:hidden}
.au-end-o .au-end-in{display:grid;justify-items:start;gap:18px;padding-block:calc(clamp(56px,7vw,96px)*var(--tune-space,1))}
.au-end-o .au-end-in h2{max-width:14ch}
/* the closing band meets the kick plate */
main:has(>.au-end:last-child)+.au-foot{margin-top:0}
/* board: a deep board band */
.au-end-b{color:var(--onboard);padding-block:calc(clamp(56px,7vw,104px)*var(--tune-space,1))}
.au-end-b .au-end-in{display:grid;justify-items:center;text-align:center;gap:18px}
.au-end-b .au-end-a{justify-content:center}

/* ---------- inner pages ---------- */
.au-ph-h{padding-top:calc(clamp(28px,3.6vw,52px)*var(--tune-space,1))}
.au-ph-r{--n:1}
.au-ph-l{width:min(100%,780px);padding:clamp(20px,2.6vw,34px) clamp(20px,2.6vw,36px);grid-template-rows:auto;gap:12px}
.au-ph-l .au-sel-n{font:600 calc(clamp(40px,5.2vw,76px)*var(--tune-size,1))/1 var(--au-d)}
.au-ph-l .au-sel-x{font-size:calc(clamp(17px,1.4vw,19px)*var(--tune-size,1));max-width:52ch}
.au-bays{padding-top:var(--sec);display:grid;gap:var(--sec)}
.au-bay-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:end}
.au-bay-f{grid-column:1/6;aspect-ratio:5/4;overflow:hidden;border-radius:0}
.au-bay-f img{width:100%;height:100%;object-fit:cover}
.au-bay-l{grid-column:6/13;border-radius:0;padding:clamp(20px,2.4vw,32px);gap:18px}
.au-bay-r .au-bay-f{grid-column:8/13;grid-row:1}
.au-bay-r .au-bay-l{grid-column:1/8;grid-row:1}
.au-bay-l .au-sel-n{font-size:calc(clamp(28px,2.8vw,40px)*var(--tune-size,1));font-weight:600}
.au-bay-l .au-sel-x{font-size:calc(17px*var(--tune-size,1));max-width:60ch;margin-top:12px}
.au-bay-d{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
.au-bay-d dt{font:600 calc(13px*var(--tune-size,1))/1.2 var(--au-t);color:var(--lab-mute)}
.au-bay-d dd{font:500 calc(18px*var(--tune-size,1))/1.3 var(--au-d)}
.au-bay-l .au-pr-w{font-size:calc(clamp(52px,4.6vw,68px)*var(--tune-size,1))}
.au-bay-b{height:26px}
.au-rates{padding-top:var(--sec)}
.au-rates h2{margin-bottom:clamp(20px,2.4vw,32px)}
.au-faq{padding-top:var(--sec)}
.au-faq h2{margin-bottom:clamp(20px,2.4vw,32px)}
.au-faq-reference>div{display:grid;gap:10px;max-width:900px}
.au-faq details{grid-template-rows:auto;gap:0;padding:0}
.au-faq summary{cursor:pointer;list-style:none;padding:16px 56px 16px 18px;position:relative;font-size:calc(clamp(19px,1.6vw,22px)*var(--tune-size,1))}
.au-faq summary::-webkit-details-marker{display:none}
.au-faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font:600 calc(26px*var(--tune-size,1))/1 var(--au-d)}
.au-faq details[open] summary::after{content:"–"}
.au-faq details .au-sel-x{padding:0 18px 18px;margin:0;font-size:calc(16px*var(--tune-size,1));max-width:70ch}
.au-faq-open dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.au-faq-open .au-sel{grid-template-rows:auto 1fr}
.au-team{padding-top:var(--sec)}
.au-team h2{margin-bottom:clamp(20px,2.4vw,32px)}
.au-team .au-pr-w{font-size:calc(clamp(48px,4.4vw,64px)*var(--tune-size,1))}
.au-team .au-sel-u{max-width:70%}
.au-ct{padding-top:var(--sec)}
.au-ct-g{display:grid;grid-template-columns:5fr 7fr;gap:var(--gap);align-items:start;margin-bottom:calc(clamp(28px,3.4vw,48px)*var(--tune-space,1))}
.au-ct-nf{grid-template-columns:minmax(0,640px)}
/* the opening hours under the details, as wide as their column */
.au-ct-h>*{max-width:min(100%,560px)}
.au-ct-d{grid-template-rows:auto;gap:18px}
.au-ct-d dt{font:600 calc(13px*var(--tune-size,1))/1.2 var(--au-t);color:var(--lab-mute)}
.au-ct-d dd{font:500 calc(20px*var(--tune-size,1))/1.35 var(--au-d)}
.au-ct-c .au-sel{grid-template-rows:auto 1fr;align-content:start}
.au-ct-c .au-sel-n{font-size:calc(clamp(20px,1.8vw,24px)*var(--tune-size,1));overflow-wrap:anywhere}
.au-ct-card .au-rail{margin-bottom:0}
.au-ct .au-head{margin-bottom:calc(clamp(36px,4.4vw,64px)*var(--tune-space,1))}
.au-ct-card+*{margin-top:calc(clamp(24px,3vw,40px)*var(--tune-space,1))}
.au-ct{padding-top:calc(var(--sec) * 1.2)}
.au-form{grid-template-rows:auto;gap:16px;padding:clamp(20px,2.4vw,32px)}
.au-form label{display:grid;gap:6px;font:600 calc(14px*var(--tune-size,1))/1.2 var(--au-t);color:var(--lab-ink)}
.au-form input,.au-form textarea{font:400 calc(17px*var(--tune-size,1))/1.4 var(--au-t);color:var(--lab-ink);background:var(--label);border:1.5px solid var(--lab-mute);border-radius:0;padding:11px 12px;width:100%}
.au-form input:focus-visible,.au-form textarea:focus-visible{outline:3px solid var(--board);outline-offset:1px}
.au-form .au-btn{justify-self:start}
.au-form-n{font-size:calc(14px*var(--tune-size,1));color:var(--lab-mute)}
.au-reg{padding-top:calc(clamp(28px,3.4vw,40px)*var(--tune-space,1));font-size:calc(14px*var(--tune-size,1));color:var(--mute)}
.au-legal{padding-block:var(--sec)}
main>.au-ph-h+*{padding-top:calc(var(--sec) * .72)}
.au-legal h1{font-size:calc(clamp(36px,4.4vw,60px)*var(--tune-size,1));margin-bottom:24px}
.au-legal h2{font-size:calc(clamp(22px,2.2vw,30px)*var(--tune-size,1));margin:28px 0 10px}
.au-legal p,.au-legal li{max-width:72ch}

/* ---------- footer: the kick plate ---------- */
.au-foot{margin-top:calc(var(--sec) * .72);background:var(--plinth);color:var(--onplinth);font-size:calc(15px*var(--tune-size,1))}
.au-vents{height:34px;border-top:6px solid var(--board);background:radial-gradient(circle at 50% 50%,rgb(0 0 0/.55) 0 5px,transparent 5.5px) 0 50%/28px 34px repeat-x}
.au-foot-in{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px var(--gap);padding-block:calc(clamp(32px,4vw,56px)*var(--tune-space,1)) calc(clamp(36px,4.4vw,60px)*var(--tune-space,1))}
.au-foot-n{font:600 calc(24px*var(--tune-size,1))/1.1 var(--au-d);margin-bottom:10px}
.au-foot-b p+p{margin-top:6px}
.au-foot-k{font:600 calc(13px*var(--tune-size,1))/1.2 var(--au-t);margin-bottom:10px;opacity:.85}
.au-foot-h dl{display:grid;gap:6px}
.au-foot-h dl>div{display:flex;justify-content:space-between;gap:16px;max-width:280px;border-bottom:1px dashed rgb(255 255 255/.22);padding-bottom:6px}
.au-foot-h dd{font-variant-numeric:tabular-nums}
.au-legal-l{display:grid;gap:6px;margin-bottom:14px}
.au-foot .langs{color:var(--onplinth)}
.au-foot-f{margin-top:14px;font-size:calc(13px*var(--tune-size,1));opacity:.85}

/* ---------- tablet and phone ---------- */
@media (max-width:1000px){
  .au-range .au-rail-l.au-n3,.au-team .au-rail-l.au-n3,.au-fg.au-n3,.au-fg.au-n4,.au-rates .au-rail-l.au-n3,.au-rates .au-rail-l.au-n4{--n:2}
  .au-fg.au-n5{--n:3}
  .au-story-p{grid-column:1/-1}
  .au-story-t{grid-column:1/-1;margin-top:calc(clamp(36px,5vw,56px)*var(--tune-space,1))}
  .au-visit{grid-template-columns:1fr}
  .au-ct-g{grid-template-columns:1fr}
  .au-foot-in{grid-template-columns:1fr 1fr}
  .au-bay-f,.au-bay-r .au-bay-f{grid-column:1/-1;grid-row:1;aspect-ratio:16/9}
  .au-bay-l,.au-bay-r .au-bay-l{grid-column:1/-1;grid-row:2;border-radius:0}
  /* the split stacks: the photo on top, the words under it */
  .au-h-label{grid-template-columns:1fr;grid-template-rows:auto auto;min-height:0}
  .au-sp-f{height:clamp(300px,46svh,520px)}
  .au-sp-in{padding:calc(clamp(24px,4vw,40px)*var(--tune-space,1)) var(--pad) calc(clamp(28px,4vw,40px)*var(--tune-space,1))}
  .au-sp-r{padding-inline:var(--pad)}
}
/* sideways shelves on phones and tablets: one board, the labels (or facings) slide along it, about 1.3 in view */
@media (max-width:760px){
  .au-hs-l,.au-range-r .au-rail-l,.au-fg{grid-template-columns:none;grid-auto-flow:column;overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);scrollbar-width:none}
  .au-hs-l::-webkit-scrollbar,.au-range-r .au-rail-l::-webkit-scrollbar,.au-fg::-webkit-scrollbar{display:none}
  .au-hs-l>li,.au-range-r .au-rail-l>li,.au-fg>li{scroll-snap-align:start}
  .au-hs-l{grid-auto-columns:min(64%,240px)}
  .au-range-r .au-rail-l{grid-auto-columns:min(78%,300px)}
  .au-fg{grid-auto-columns:min(74%,280px);column-gap:var(--gap)}
  .au-fg-f{width:100%;aspect-ratio:4/5}
}
@media (max-width:700px){
  :root{--top:58px;--chan:6px}
  .au-rail-l,.au-faq-open dl,.au-qs,.au-figs-l{--n:1}
  .au-team .au-rail-l.au-n3,.au-rates .au-rail-l.au-n3,.au-rates .au-rail-l.au-n4{--n:1}
  .au-rail-l{row-gap:calc(2 * var(--chan) + 18px)}
  /* price-list labels read as one row on phones: name left, price right */
  .au-rates .au-sel{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto;align-items:center}
  .au-rates .au-sel-f{border-top:0;padding-top:0}
  .au-rates .au-sel-u{display:none}
  .au-hs-t{padding-top:calc(48px*var(--tune-space,1));padding-bottom:28px}
  /* on a narrow screen the words cover most of the photo's width: shade it from the foot up instead */
  .au-hs-f::after,.au-stk-f::after,.au-end-f::after{background:linear-gradient(0deg,rgb(16 12 9/.84),rgb(16 12 9/.62) 42%,rgb(16 12 9/.12) 78%)}
  .au-h-shelf .au-lede,.au-h-stack .au-lede{max-width:30ch}
  .au-stk-c{height:clamp(420px,calc(100svh - var(--top) - 170px),620px)}
  .au-stk-low{justify-content:stretch;padding-inline:0}
  .au-stk-p{width:100%}
  .au-wob{right:16px}
  .au-wob-d{width:104px;padding:0 10px;font-size:calc(16px*var(--tune-size,1))}
  .au-wob-s{height:12px}
  .au-sp-f{height:44svh}
  .au-figs-l{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .au-figs-l dd{font-size:calc(clamp(44px,13vw,64px)*var(--tune-size,1))}
  .au-figs-l dt{font-size:calc(14px*var(--tune-size,1))}
  .au-foot-in{grid-template-columns:1fr}
  .au-bay-d{grid-template-columns:1fr}
  .au-acts .au-btn,.au-end-a .au-btn{flex:1 1 100%}
  .au-story-a{width:86%}
  .au-story-b{width:46%}
}

/* ---------- Basic motion: the phone menu drops like a shelf ---------- */
@media (prefers-reduced-motion:no-preference){
  .au-menu[open]>nav{animation:au-drop .22s cubic-bezier(.2,.7,.2,1)}
  @keyframes au-drop{from{opacity:0;transform:translateY(-8px)}}
}

/* ---------- Advanced hero moment: the shelf is stocked ----------
   The photo settles, the words rise into place, then the labels click into the board's channel one after another
   (stack: the wobbler swings once on its stalk). Transform and opacity only; layers that follow the pointer
   (data-depth/data-tilt) animate their children or use fill-mode backwards. */
@media (prefers-reduced-motion:no-preference){
  .m-js .au-hs-f img,.m-js .au-stk-f img,.m-js .au-sp-f img{animation:au-settle 1.2s cubic-bezier(.2,.7,.2,1) both}
  .m-js :is(.au-hs-t,.au-stk-t,.au-sp-in)>*{animation:au-rise .7s cubic-bezier(.2,.7,.2,1) backwards}
  .m-js :is(.au-hs-t,.au-stk-t,.au-sp-in)>:nth-child(2){animation-delay:.08s}
  .m-js :is(.au-hs-t,.au-stk-t,.au-sp-in)>:nth-child(3){animation-delay:.16s}
  .m-js :is(.au-hs-t,.au-stk-t,.au-sp-in)>:nth-child(4){animation-delay:.24s}
  .m-js .au-hs-l>li,.m-js .au-stk-p,.m-js .au-sp-p{animation:au-click .46s cubic-bezier(.3,1,.5,1) .5s backwards}
  .m-js .au-hs-l>li:nth-child(2){animation-delay:.6s}.m-js .au-hs-l>li:nth-child(3){animation-delay:.7s}
  .m-js .au-wob{animation:au-swing 1.05s .55s cubic-bezier(.3,.6,.4,1) backwards}
  @keyframes au-settle{from{transform:scale(1.06)}to{transform:none}}
  @keyframes au-rise{from{opacity:0;transform:translateY(18px)}}
  @keyframes au-click{from{opacity:0;transform:translateY(12px)}}
  @keyframes au-swing{0%{transform:rotate(-16deg)}30%{transform:rotate(10deg)}55%{transform:rotate(-5deg)}78%{transform:rotate(2deg)}100%{transform:none}}
}

/* sales step 4 (photo-slice): on phones the first photo keeps more of the picture; the main button and the phone bar stay on the first screen */
@media (max-width:760px){.au-h-shelf{min-height:max(540px,calc(70svh - var(--top)))}}