/* Minis Terrios — «Covorul». A Basarabian wall carpet still on the loom.
   Everything snaps to one weave cell (--cell); motion counts in picks (--pick). */

/* ---------------------------------------------------------------- fonts */

@font-face { font-family: 'Handjet'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/handjet-latin.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: 'Handjet'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/handjet-latin-ext.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: 'Handjet'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/handjet-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Handjet'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/handjet-cyrillic-ext.woff2') format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/onest-latin.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: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/onest-latin-ext.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: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/onest-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/onest-cyrillic-ext.woff2') format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }

/* --------------------------------------------------------------- tokens */

@property --dye { syntax: '<color>'; inherits: true; initial-value: #c13c32; }
@property --dye-ink { syntax: '<color>'; inherits: true; initial-value: #fff4ee; }
@property --dye-line { syntax: '<color>'; inherits: true; initial-value: #c13c32; }

:root {
  --cell: 5px;
  --pick: 42ms;
  --vh: 1vh;

  --black: #15110f;
  --black-2: #1d1814;
  --black-3: #2c251f;
  --wool: #dcd6cd;
  --wool-2: #aaa298;
  --wool-3: #6f675e;
  --error: #f0907f;

  --dye: #c13c32;
  --dye-ink: #fff4ee;
  --dye-line: #c13c32;
  --field: var(--black);

  --side: calc(var(--cell) * 2);
  --gutter: max(16px, calc(var(--cell) * 3));
  --bar-h: max(56px, calc(var(--cell) * 8));
  --fringe-h: calc(var(--cell) * 30);
  --edge-h: calc(var(--cell) * 18);
  --tex: var(--weave-tex, none) left top / calc(var(--cell) * 2) calc(var(--cell) * 40) repeat;

  --hj: 'Handjet', 'Onest', sans-serif;
  --tx: 'Onest', 'Helvetica Neue', Arial, sans-serif;

  /* cell-lattice motifs (one unit = one weave cell) */
  --m-teeth: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%208%205'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M0%200h8v1h-8zM0%201h7v1h-7zM1%202h5v1h-5zM2%203h3v1h-3zM3%204h1v1h-1z'/%3E%3C/svg%3E"); /* 8x5 cells */
  --m-teeth-up: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%208%205'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M3%200h1v1h-1zM2%201h3v1h-3zM1%202h5v1h-5zM0%203h7v1h-7zM0%204h8v1h-8z'/%3E%3C/svg%3E"); /* 8x5 cells */
  --m-fang: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%208%204'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M0%200h7v1h-7zM1%201h5v1h-5zM2%202h3v1h-3zM3%203h1v1h-1z'/%3E%3C/svg%3E"); /* 8x4 cells */
  --m-romb: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M5%200h2v1h-2zM4%201h4v1h-4zM3%202h2v1h-2zM7%202h2v1h-2zM0%203h4v1h-4zM5%203h2v1h-2zM8%203h4v1h-4zM3%204h2v1h-2zM7%204h2v1h-2zM4%205h4v1h-4zM5%206h2v1h-2z'/%3E%3C/svg%3E"); /* 12x7 cells */
  --m-chain-v: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%205%206'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M2%200h1v1h-1zM1%201h3v1h-3zM0%202h2v1h-2zM3%202h2v1h-2zM1%203h3v1h-3zM2%204h1v1h-1zM2%205h1v1h-1z'/%3E%3C/svg%3E"); /* 5x6 cells */
  --m-cross: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%203%204'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M1%200h1v1h-1zM0%201h3v1h-3zM1%202h1v1h-1z'/%3E%3C/svg%3E"); /* 3x4 cells */
  --m-checker: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202%202'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M0%200h1v1h-1zM1%201h1v1h-1z'/%3E%3C/svg%3E"); /* 2x2 cells */
  --m-stitch: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202%201'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M0%200h1v1h-1z'/%3E%3C/svg%3E"); /* 2x1 cells */
  --m-star: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%207%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M3%200h1v1h-1zM2%201h3v1h-3zM1%202h2v1h-2zM4%202h2v1h-2zM0%203h3v1h-3zM4%203h3v1h-3zM1%204h2v1h-2zM4%204h2v1h-2zM2%205h3v1h-3zM3%206h1v1h-1z'/%3E%3C/svg%3E"); /* 7x7 cells */
  --m-solid: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201%201'%20preserveAspectRatio='none'%3E%3Crect%20width='1'%20height='1'/%3E%3C/svg%3E");
  --m-warp: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2020%201'%20preserveAspectRatio='none'%3E%3Crect%20x='9'%20width='2.4'%20height='1'/%3E%3C/svg%3E");
  --m-rule: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202%201'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Crect%20width='1'%20height='1'%20fill='%23dcd6cd'%20fill-opacity='0.34'/%3E%3C/svg%3E");
  --m-band-0: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M5%200h2v1h-2zM4%201h4v1h-4zM3%202h2v1h-2zM7%202h2v1h-2zM0%203h4v1h-4zM5%203h2v1h-2zM8%203h4v1h-4zM3%204h2v1h-2zM7%204h2v1h-2zM4%205h4v1h-4zM5%206h2v1h-2z'/%3E%3C/svg%3E"); /* 12x7 */
  --m-band-1: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2010%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M4%200h2v1h-2zM3%201h4v1h-4zM2%202h6v1h-6zM4%203h2v1h-2zM1%204h8v1h-8zM4%205h2v1h-2zM0%206h10v1h-10z'/%3E%3C/svg%3E"); /* 10x7 */
  --m-band-2: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2010%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M0%200h2v1h-2zM8%200h2v1h-2zM1%201h2v1h-2zM7%201h2v1h-2zM2%202h2v1h-2zM6%202h2v1h-2zM3%203h4v1h-4zM4%204h2v1h-2zM0%206h1v1h-1zM2%206h1v1h-1zM4%206h1v1h-1zM6%206h1v1h-1zM8%206h1v1h-1z'/%3E%3C/svg%3E"); /* 10x7 */
  --m-band-3: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%208%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M0%200h7v1h-7zM1%201h5v1h-5zM2%202h3v1h-3zM3%203h1v1h-1zM7%203h1v1h-1zM0%204h1v1h-1zM6%204h2v1h-2zM0%205h2v1h-2zM5%205h3v1h-3zM0%206h3v1h-3zM4%206h4v1h-4z'/%3E%3C/svg%3E"); /* 8x7 */
  --m-band-4: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M5%200h1v1h-1zM3%201h1v1h-1zM5%201h1v1h-1zM7%201h1v1h-1zM4%202h3v1h-3zM1%203h9v1h-9zM4%204h3v1h-3zM3%205h1v1h-1zM5%205h1v1h-1zM7%205h1v1h-1zM5%206h1v1h-1z'/%3E%3C/svg%3E"); /* 12x7 */
  --m-band-5: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%208%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M3%200h1v1h-1zM2%201h3v1h-3zM3%202h1v1h-1zM0%203h8v1h-8zM3%204h1v1h-1zM2%205h3v1h-3zM3%206h1v1h-1z'/%3E%3C/svg%3E"); /* 8x7 */
  --m-band-6: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2010%207'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cpath%20d='M2%200h6v1h-6zM1%201h1v1h-1zM8%201h1v1h-1zM0%202h1v1h-1zM3%202h4v1h-4zM9%202h1v1h-1zM0%203h1v1h-1zM3%203h1v1h-1zM6%203h1v1h-1zM9%203h1v1h-1zM0%204h1v1h-1zM3%204h4v1h-4zM9%204h1v1h-1zM1%205h1v1h-1zM8%205h1v1h-1zM2%206h6v1h-6z'/%3E%3C/svg%3E"); /* 10x7 */
  --m-rule-in: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202%201'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Crect%20width='1'%20height='1'%20fill='%23dcd6cd'%20fill-opacity='0.72'/%3E%3C/svg%3E");
  --m-select: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%207%204'%20shape-rendering='crispEdges'%3E%3Cpath%20fill='%23dcd6cd'%20d='M0%200h1v1h-1zM6%200h1v1h-1zM0%201h2v1h-2zM5%201h2v1h-2zM1%202h2v1h-2zM4%202h2v1h-2zM2%203h3v1h-3z'/%3E%3C/svg%3E");

  color-scheme: dark;
  transition:
    --dye calc(var(--pick) * 6) steps(6, end),
    --dye-ink calc(var(--pick) * 6) steps(6, end),
    --dye-line calc(var(--pick) * 6) steps(6, end);
}

@supports (height: 1svh) { :root { --vh: 1svh; } }
@media (min-width: 1100px) { :root { --cell: 8px; } }

/* The lattice: phones scale the cell so a medallion row never breaks; desktops size it to the viewport. */
@supports (width: round(1px, 1px)) {
  :root { --cell: clamp(4px, round(nearest, (100vw - 2.5rem) / 64, 1px), 8px); }
  @media (min-width: 1100px) { :root { --cell: clamp(6px, round(down, min(0.625vw, var(--vh) * 0.96), 1px), 11px); } }
}

@media (min-width: 1000px) {
  :root { --side: calc(var(--cell) * 7); --gutter: calc(var(--cell) * 6); --bar-h: calc(var(--cell) * 8); }
}

@media (prefers-reduced-motion: reduce) { :root { --pick: 0.01ms; } }

/* ----------------------------------------------------------------- base */

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html {
  background: var(--black);
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--bar-h) + var(--cell) * 2);
  scrollbar-color: var(--dye-line) var(--black);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html.is-static { scroll-behavior: auto; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
html.is-gated { overflow: hidden; }

body {
  margin: 0;
  background: var(--black) var(--tex);
  color: var(--wool);
  font-family: var(--tx);
  font-size: 1.0625rem;
  line-height: 1.6;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  caret-color: var(--dye-line);
}

h1, h2, h3, h4, p, figure, ul, ol, dl, dd { margin: 0; }
img, svg, canvas { display: block; max-width: 100%; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.24em; }
button, input, select { font: inherit; color: inherit; }

::selection { background: var(--dye); color: var(--dye-ink); }
.chapter ::selection, .pick--court ::selection { background: var(--ink); color: var(--c); }

::-webkit-scrollbar { width: 12px; height: 10px; background: var(--black); }
::-webkit-scrollbar-thumb { background: var(--dye-line); border: 3px solid var(--black); }

:focus-visible { outline: 2px solid var(--wool); outline-offset: 3px; }
.chapter :focus-visible, .pick--court :focus-visible { outline-color: var(--ink); }

.sr {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.num { font-variant-numeric: tabular-nums lining-nums; }
.nowrap { white-space: nowrap; }

q { quotes: '\201C' '\201D' '\2018' '\2019'; }
:lang(ro) q { quotes: '\201E' '\201D' '\00AB' '\00BB'; }
:lang(ru) q { quotes: '\00AB' '\00BB' '\201E' '\201C'; }

.skip {
  position: fixed; left: var(--gutter); top: 8px; z-index: 100;
  transform: translateY(-200%);
  padding: 10px 16px;
  background: var(--wool); color: var(--black);
  font-family: var(--hj); font-weight: 600; font-size: 1.25rem; line-height: 1;
  text-decoration: none;
}
.skip:focus { transform: none; }

.wrap { width: 100%; max-width: calc(var(--cell) * 150); margin-inline: auto; padding-inline: var(--gutter); }

/* Pixel icons drawn on the stitch grid */
.ico { width: calc(var(--iu, 2px) * var(--w)); height: calc(var(--iu, 2px) * var(--h)); fill: currentColor; flex: none; }

/* --------------------------------------------------------- stepped shapes */

.btn::before, .btn::after, .chip__face, .frame::before {
  clip-path: polygon(var(--s) 0, calc(100% - var(--s)) 0, calc(100% - var(--s)) var(--s), 100% var(--s), 100% calc(100% - var(--s)), calc(100% - var(--s)) calc(100% - var(--s)), calc(100% - var(--s)) 100%, var(--s) 100%, var(--s) calc(100% - var(--s)), 0 calc(100% - var(--s)), 0 var(--s), var(--s) var(--s));
}
.pick {
  clip-path: polygon(0 calc(var(--s) * 2), var(--s) calc(var(--s) * 2), var(--s) var(--s), calc(var(--s) * 2) var(--s), calc(var(--s) * 2) 0, calc(100% - var(--s) * 2) 0, calc(100% - var(--s) * 2) var(--s), calc(100% - var(--s)) var(--s), calc(100% - var(--s)) calc(var(--s) * 2), 100% calc(var(--s) * 2), 100% calc(100% - var(--s) * 2), calc(100% - var(--s)) calc(100% - var(--s) * 2), calc(100% - var(--s)) calc(100% - var(--s)), calc(100% - var(--s) * 2) calc(100% - var(--s)), calc(100% - var(--s) * 2) 100%, calc(var(--s) * 2) 100%, calc(var(--s) * 2) calc(100% - var(--s)), var(--s) calc(100% - var(--s)), var(--s) calc(100% - var(--s) * 2), 0 calc(100% - var(--s) * 2));
}

.frame { --s: var(--cell); position: relative; isolation: isolate; padding: calc(var(--cell) * 2); }
.frame::before {
  content: '';
  position: absolute; inset: 0; z-index: -1;
  padding: var(--cell);
  background: var(--frame-c, var(--wool-3));
  -webkit-mask: var(--m-solid) content-box, var(--m-solid);
  -webkit-mask-composite: xor;
  mask: var(--m-solid) content-box exclude, var(--m-solid);
}
.frame__in { display: block; }
.frame__in > img {
  --s: var(--cell);
  clip-path: polygon(var(--s) 0, calc(100% - var(--s)) 0, calc(100% - var(--s)) var(--s), 100% var(--s), 100% calc(100% - var(--s)), calc(100% - var(--s)) calc(100% - var(--s)), calc(100% - var(--s)) 100%, var(--s) 100%, var(--s) calc(100% - var(--s)), 0 calc(100% - var(--s)), 0 var(--s), var(--s) var(--s));
}
.frame--ink { --frame-c: var(--ink); }
.frame--wool { --frame-c: var(--wool-3); }

/* stitched rules: one cell of thread, one cell of gap */
.stitch-rule, .facts > div, .shoplist a, .offer, .rating a, .country__name, .end__legal { position: relative; }
.facts > div::after, .shoplist a::after, .offer::after, .rating a::after, .country__name::after, .end__legal::before, .link-stitch::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 2px;
  background: currentColor;
  opacity: 0.45;
  -webkit-mask: var(--m-stitch) repeat-x left top / calc(var(--cell) * 2) 100%;
  mask: var(--m-stitch) repeat-x left top / calc(var(--cell) * 2) 100%;
}

/* ---------------------------------------------------------------- bands */

.band {
  --rows: 5; --tw: 8; --th: 5; --m: var(--m-teeth);
  height: calc(var(--cell) * var(--rows));
  background: var(--band-c, var(--dye-line));
  -webkit-mask: var(--m) repeat center top / calc(var(--cell) * var(--tw)) calc(var(--cell) * var(--th));
  mask: var(--m) repeat center top / calc(var(--cell) * var(--tw)) calc(var(--cell) * var(--th));
}
.band--romb { --m: var(--m-romb); --tw: 12; --th: 7; --rows: 7; }
.band--teeth { --m: var(--m-teeth); --tw: 8; --th: 5; --rows: 5; }
.band--teeth-up { --m: var(--m-teeth-up); --tw: 8; --th: 5; --rows: 5; }
.band--checker { --m: var(--m-checker); --tw: 2; --th: 2; --rows: 4; }

/* the loom: rows of weft appear top to bottom, one row per pick */
.band.is-pending, .more__fang.is-pending { clip-path: inset(0 0 100% 0); }
.band.is-woven, .more__fang.is-woven { animation: weave-down calc(var(--pick) * var(--rows, 4)) steps(var(--rows, 4), end) both; }
@keyframes weave-down { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes shuttle { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes shuttle-back { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0 0 0 0); } }

/* --------------------------------------------------------------- carpet */

.carpet { position: relative; padding-inline: var(--side); overflow-x: clip; }
.carpet::before, .carpet::after {
  content: '';
  position: absolute; top: 0; bottom: var(--fringe-h);
  width: var(--side);
  background: var(--dye-line);
  pointer-events: none;
  -webkit-mask: var(--m-checker) repeat left top / calc(var(--cell) * 2) calc(var(--cell) * 2);
  mask: var(--m-checker) repeat left top / calc(var(--cell) * 2) calc(var(--cell) * 2);
}
.carpet::before { left: 0; }
.carpet::after { right: 0; }
@media (min-width: 1000px) {
  .carpet::before {
    -webkit-mask: var(--m-chain-v) repeat-y var(--cell) top / calc(var(--cell) * 5) calc(var(--cell) * 6), var(--m-solid) no-repeat right top / var(--cell) 100%;
    mask: var(--m-chain-v) repeat-y var(--cell) top / calc(var(--cell) * 5) calc(var(--cell) * 6), var(--m-solid) no-repeat right top / var(--cell) 100%;
  }
  .carpet::after {
    -webkit-mask: var(--m-chain-v) repeat-y calc(100% - var(--cell)) top / calc(var(--cell) * 5) calc(var(--cell) * 6), var(--m-solid) no-repeat left top / var(--cell) 100%;
    mask: var(--m-chain-v) repeat-y calc(100% - var(--cell)) top / calc(var(--cell) * 5) calc(var(--cell) * 6), var(--m-solid) no-repeat left top / var(--cell) 100%;
  }
}

.selvedge {
  height: calc(var(--cell) * 5);
  background: var(--dye-line);
  -webkit-mask: var(--m-teeth) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 5);
  mask: var(--m-teeth) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 5);
}

/* --------------------------------------------------------------- header */

.bar { position: sticky; top: 0; z-index: 20; background: var(--black) var(--tex); }
.bar__row {
  display: flex; align-items: center;
  gap: calc(var(--cell) * 2);
  min-height: calc(var(--bar-h) - var(--cell));
  padding-inline: var(--gutter);
}
.bar__stitch {
  display: block;
  height: var(--cell);
  background: var(--dye-line);
  -webkit-mask: var(--m-stitch) repeat-x left top / calc(var(--cell) * 2) var(--cell);
  mask: var(--m-stitch) repeat-x left top / calc(var(--cell) * 2) var(--cell);
}

.brand { display: inline-flex; align-items: center; gap: calc(var(--cell) * 1.5); margin-right: auto; color: var(--wool); text-decoration: none; min-height: 44px; }
.mono {
  display: inline-block;
  aspect-ratio: 166 / 167;
  background: currentColor;
  -webkit-mask: url('shared/img/mt-monogram.png') center / contain no-repeat;
  mask: url('shared/img/mt-monogram.png') center / contain no-repeat;
}
.brand__mono { width: max(30px, calc(var(--cell) * 5)); }
.brand__word { display: none; font-family: var(--tx); font-weight: 500; font-size: 0.875rem; line-height: 1; letter-spacing: 0.34em; text-transform: uppercase; white-space: nowrap; }
@media (min-width: 700px) { .brand__word { display: inline-block; } }
.logo {
  display: inline-block;
  aspect-ratio: 166 / 250;
  background: currentColor;
  -webkit-mask: url('shared/img/mt-logo.png') center / contain no-repeat;
  mask: url('shared/img/mt-logo.png') center / contain no-repeat;
}

.nav { display: none; }
.nav__list { list-style: none; display: flex; gap: calc(var(--cell) * 3); padding: 0; }
.nav a {
  position: relative;
  display: inline-block;
  padding-block: 8px;
  color: var(--wool);
  font-family: var(--hj); font-weight: 500; font-size: 1.375rem; line-height: 1;
  letter-spacing: 0.03em;
  text-decoration: none;
}
.nav a::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: 2px;
  height: 2px;
  background: var(--dye-line);
  clip-path: inset(0 100% 0 0);
  transition: clip-path calc(var(--pick) * 6) steps(6, end);
}
.nav a:hover::after, .nav a:focus-visible::after { clip-path: inset(0 0 0 0); }
.nav.is-open {
  display: block;
  position: absolute; top: 100%; left: 0; right: 0;
  padding: calc(var(--cell) * 4) var(--gutter) calc(var(--cell) * 5);
  background: var(--black);
  border-bottom: var(--cell) solid var(--dye-line);
}
.nav.is-open .nav__list { flex-direction: column; gap: calc(var(--cell) * 2); }
.nav.is-open a { font-size: 2rem; }

.langs { display: inline-flex; gap: 2px; }
.langs button {
  min-width: 36px; min-height: 36px;
  padding: 0 6px;
  border: 0;
  background: transparent;
  color: var(--wool-2);
  font-family: var(--hj); font-weight: 600; font-size: 1.125rem; line-height: 1;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: background-color calc(var(--pick) * 3) steps(3, end), color calc(var(--pick) * 3) steps(3, end);
}
.langs button:hover { color: var(--wool); }
.langs button[aria-pressed="true"] { background: var(--wool); color: var(--black); }

.menu-btn {
  display: inline-grid; place-items: center;
  width: 44px; height: 44px;
  padding: 0; border: 0;
  background: none; color: var(--wool);
  cursor: pointer;
  --iu: 2.5px;
}
.bar__buy { font-size: 1.25rem; padding-inline: calc(var(--cell) * 2); }

@media (min-width: 900px) {
  .nav, .nav.is-open { display: block; position: static; padding: 0; background: none; border: 0; margin-right: calc(var(--cell) * 2); }
  .nav.is-open .nav__list { flex-direction: row; gap: calc(var(--cell) * 3); }
  .nav.is-open a { font-size: 1.375rem; }
  .menu-btn { display: none; }
  .bar__buy { font-size: 1.375rem; padding-inline: calc(var(--cell) * 2.5); }
}

/* -------------------------------------------------------------- buttons */

.btn {
  --s: var(--cell);
  --btn-bg: var(--wool);
  --btn-ink: var(--black);
  --btn-ring: var(--btn-bg);
  position: relative;
  isolation: isolate;
  display: inline-flex; align-items: center; justify-content: center;
  gap: calc(var(--cell) * 1.5);
  min-height: max(44px, calc(var(--cell) * 6));
  padding: 0 calc(var(--cell) * 2.5);
  border: 0;
  background: none;
  color: var(--btn-ink);
  font-family: var(--hj); font-weight: 600; font-size: 1.375rem; line-height: 1;
  letter-spacing: 0.03em;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: color calc(var(--pick) * 4) steps(4, end);
}
.btn::before, .btn::after {
  content: '';
  position: absolute;
  transition: background-color calc(var(--pick) * 4) steps(4, end);
}
.btn::after { inset: 0; z-index: -2; background: var(--btn-ring); }
.btn::before { inset: 2px; z-index: -1; background: var(--btn-bg); }
.btn .ico--arrow { transition: transform calc(var(--pick) * 2) steps(2, end); }
.btn:hover .ico--arrow, .link-stitch:hover .ico--arrow { transform: translateX(var(--cell)); }

.btn--fill:hover { --btn-bg: var(--field); --btn-ink: var(--wool); --btn-ring: var(--wool); }
.btn--dye { --btn-bg: var(--dye); --btn-ink: var(--dye-ink); --btn-ring: var(--dye-line); }
.btn--dye:hover { --btn-bg: var(--field); --btn-ink: var(--wool); --btn-ring: var(--dye-line); }
.btn--line { --btn-bg: var(--field); --btn-ink: var(--line-c, var(--wool)); --btn-ring: var(--line-c, var(--wool)); }
.btn--line:hover { --btn-bg: var(--line-c, var(--wool)); --btn-ink: var(--field); }
.btn--ink { --btn-bg: var(--ink); --btn-ink: var(--c); --btn-ring: var(--ink); }
.btn--ink:hover, .btn--ink[aria-expanded="true"] { --btn-bg: var(--c); --btn-ink: var(--ink); }
.btn--big { font-size: 1.625rem; min-height: max(52px, calc(var(--cell) * 7)); padding-inline: calc(var(--cell) * 3); }
.btn__chev { transition: transform calc(var(--pick) * 2) steps(2, end); }
[aria-expanded="true"] > .btn__chev { transform: scaleY(-1); }

.link-stitch {
  position: relative;
  display: inline-flex; align-items: center;
  gap: calc(var(--cell) * 1.25);
  min-height: 40px;
  padding-bottom: 4px;
  color: inherit;
  font-family: var(--hj); font-weight: 500; font-size: 1.375rem; line-height: 1.1;
  letter-spacing: 0.02em;
  text-decoration: none;
}
.link-stitch:hover::after { opacity: 1; }

/* ----------------------------------------------------------------- hero */

.hero__stage {
  display: grid;
  justify-items: center;
  row-gap: calc(var(--cell) * 4);
  padding: calc(var(--cell) * 6) var(--gutter) calc(var(--cell) * 5);
}
.hero__title {
  font-family: var(--hj); font-weight: 800;
  font-size: clamp(2.5rem, 10.5vw, 4.25rem);
  line-height: 0.92;
  font-variation-settings: 'ELSH' 12, 'ELGR' 1;
  text-align: center;
  text-wrap: balance;
}
.hero__a, .hero__b { display: block; }
.hero__b { color: var(--dye-line); }

.medallion { position: relative; width: calc(var(--cell) * 64); height: calc(var(--cell) * 76); }
.medallion__svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.m-field { fill: var(--black-2); }
.m-line { fill: var(--dye-line); }
.m-warp-thread { fill: rgba(220, 214, 205, 0.34); }
.medallion__slots { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; }
.slot {
  --pw: 14; --ph: 18;
  position: absolute;
  left: calc(var(--cell) * var(--x));
  top: calc(var(--cell) * var(--y));
  width: calc(var(--cell) * 14);
  height: calc(var(--cell) * 18);
}
.slot__link { position: absolute; inset: 0; display: block; color: var(--wool); }
.slot__link::after {
  content: '';
  position: absolute; inset: calc(var(--cell) * -1);
  border: var(--cell) solid transparent;
  pointer-events: none;
  transition: border-color calc(var(--pick) * 3) steps(3, end);
}
.slot__link:hover::after, .slot__link:focus-visible::after { border-color: var(--sc); }
.slot__link:focus-visible { outline-offset: calc(var(--cell) + 3px); }

.weave-slot { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; }
.weave, .weave__fallback { grid-area: 1 / 1; }
.weave__fallback { width: 100%; height: 100%; object-fit: cover; }
.js .weave__fallback { visibility: hidden; }
.js .is-failed .weave__fallback { visibility: visible; }
.js .is-failed .weave { display: none; }

.hero__pick { display: grid; gap: 4px; min-height: 3.6em; text-align: center; }
.hero__pick-name { font-family: var(--hj); font-weight: 600; font-size: 1.75rem; line-height: 1; }
.hero__pick-role { color: var(--wool-2); font-size: 1rem; line-height: 1.3; }
.hero__cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: calc(var(--cell) * 2) calc(var(--cell) * 4); }

@media (min-width: 1100px) {
  .hero__stage {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-template-rows: 1fr auto auto 1fr;
    column-gap: calc(var(--cell) * 4);
    row-gap: calc(var(--cell) * 3);
    align-items: center;
    min-height: calc(var(--vh) * 100 - var(--bar-h) - var(--cell) * 5 - var(--edge-h));
    padding-block: calc(var(--cell) * 2);
  }
  .medallion { grid-column: 2; grid-row: 1 / -1; }
  .hero__title {
    grid-column: 1 / -1; grid-row: 2;
    display: grid;
    grid-template-columns: subgrid;
    align-items: end;
    font-size: clamp(3.5rem, 0.75rem + 4.4vw, 6rem);
    text-align: start;
    pointer-events: none;
  }
  .hero__a { grid-column: 1; text-align: right; }
  .hero__b { grid-column: 3; text-align: left; }
  .hero__pick { grid-column: 1; grid-row: 3; justify-self: end; align-self: start; text-align: right; }
  .hero__cta { grid-column: 3; grid-row: 3; justify-self: start; align-self: start; justify-content: flex-start; }
}

/* the edge of the weaving: last weft rows, then bare warp */
.loom-edge { position: relative; height: var(--edge-h); }
.loom-edge__warp {
  position: absolute; inset: 0;
  background: rgba(220, 214, 205, 0.5);
  -webkit-mask: var(--m-warp) repeat left top / var(--cell) var(--cell);
  mask: var(--m-warp) repeat left top / var(--cell) var(--cell);
}
.js .loom-edge__warp:has(svg) { background: none; -webkit-mask: none; mask: none; }
.loom-edge__svg { display: block; width: 100%; height: 100%; overflow: visible; }
.loom-edge__svg path { fill: none; stroke: rgba(226, 220, 211, 0.68); stroke-width: max(1.25px, calc(var(--cell) * 0.2)); stroke-linecap: round; }
.loom-edge .year-next { top: calc(var(--cell) * 8); bottom: auto; right: calc(var(--gutter) + var(--cell) * 2); }
.loom-edge__weft {
  position: relative;
  height: calc(var(--cell) * 4);
  background: var(--dye-line);
  -webkit-mask: var(--m-fang) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 4);
  mask: var(--m-fang) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 4);
}
.year-next {
  position: absolute; right: var(--gutter); bottom: var(--cell);
  display: inline-flex; align-items: center;
  gap: calc(var(--cell) * 1.25);
  padding: 4px calc(var(--cell) * 1.5);
  background: var(--black);
  color: var(--wool);
  font-family: var(--hj); font-weight: 600; font-size: 1.75rem; line-height: 1;
  --iu: 3px;
}

/* ---------------------------------------------------------------- story */

.story__open { display: grid; gap: calc(var(--cell) * 5); padding-block: calc(var(--cell) * 12) calc(var(--cell) * 10); }
.story__title {
  font-family: var(--hj); font-weight: 800;
  font-size: clamp(2.5rem, 1.25rem + 4vw, 5.5rem);
  line-height: 0.98;
  max-width: 13ch;
  text-wrap: balance;
}
.story__lead { display: grid; gap: calc(var(--cell) * 3); align-content: start; }
.story__manifesto { font-size: clamp(1.25rem, 1.05rem + 0.75vw, 1.75rem); font-weight: 500; line-height: 1.42; max-width: 32ch; text-wrap: pretty; }
.story__names { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; color: var(--wool-2); font-family: var(--hj); font-weight: 500; font-size: 1.25rem; line-height: 1.3; letter-spacing: 0.03em; }
.dot { width: var(--cell); height: var(--cell); min-width: 6px; min-height: 6px; background: var(--dye-line); }
.story__photo img { width: 100%; height: auto; filter: saturate(0.82) contrast(1.04); }
.story__photo figcaption { margin-top: calc(var(--cell) * 1.5); color: var(--wool-2); font-family: var(--hj); font-weight: 500; font-size: 1.1875rem; line-height: 1.3; letter-spacing: 0.03em; }
@media (min-width: 1000px) {
  .story__open { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "title photo" "lead photo"; column-gap: calc(var(--cell) * 9); align-items: start; }
  .story__title { grid-area: title; }
  .story__lead { grid-area: lead; }
  .story__photo--family { grid-area: photo; align-self: end; }
}

.story__loom { padding-bottom: calc(var(--cell) * 10); }
.story__sub { font-family: var(--hj); font-weight: 600; font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); line-height: 1.05; margin-bottom: calc(var(--cell) * 3); }
.beats { list-style: none; padding: 0; max-width: calc(var(--cell) * 124); }
.beat {
  position: relative;
  display: grid;
  grid-template-columns: calc(var(--cell) * 15) minmax(0, 1fr);
  column-gap: calc(var(--cell) * 3);
  align-items: baseline;
  padding-block: calc(var(--cell) * 5) calc(var(--cell) * 3);
}
.beat__weft {
  position: absolute; left: 0; right: 0; top: 0;
  height: calc(var(--cell) * 2);
  background: var(--wool-3);
  -webkit-mask: var(--m-checker) repeat left top / calc(var(--cell) * 2) calc(var(--cell) * 2);
  mask: var(--m-checker) repeat left top / calc(var(--cell) * 2) calc(var(--cell) * 2);
}
.beat__year { font-family: var(--hj); font-weight: 700; font-size: clamp(2rem, 1.5rem + 2vw, 3.75rem); line-height: 1; color: var(--dye-line); }
.beat__text { font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.3125rem); line-height: 1.5; max-width: 52ch; }
.beats.is-pending .beat__weft { clip-path: inset(0 100% 0 0); }
.beats.is-woven .beat__weft { animation: shuttle calc(var(--pick) * 16) steps(16, end) both; animation-delay: calc(var(--pick) * 16 * var(--i)); }
.beats.is-woven .beat:nth-child(even) .beat__weft { animation-name: shuttle-back; }
@media (min-width: 1000px) { .beat { grid-template-columns: calc(var(--cell) * 26) minmax(0, 1fr); } }

.story__craft { display: grid; gap: calc(var(--cell) * 7); padding-block: calc(var(--cell) * 4) calc(var(--cell) * 14); align-items: center; }
.story__photo--dan { max-width: calc(var(--cell) * 46); width: 100%; }
.plaque { font-family: var(--hj); font-weight: 600; font-size: clamp(1.75rem, 1.2rem + 1.8vw, 3rem); line-height: 1.4; max-width: 18ch; margin-bottom: calc(var(--cell) * 5); text-wrap: balance; }
.craft { list-style: none; padding: 0; display: grid; gap: calc(var(--cell) * 4); max-width: 62ch; }
.craft__row { display: grid; grid-template-columns: calc(var(--cell) * 8) minmax(0, 1fr); gap: calc(var(--cell) * 2); align-items: start; font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); }
.craft__mark { --iu: max(3px, calc(var(--cell) * 0.5)); color: var(--dye-line); margin-top: 4px; }
.story__cellar { margin-top: calc(var(--cell) * 5); color: var(--wool-2); font-family: var(--hj); font-weight: 500; font-size: 1.3125rem; line-height: 1.3; letter-spacing: 0.03em; }
@media (min-width: 1000px) {
  .story__craft { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); column-gap: calc(var(--cell) * 11); }
}

/* ---------------------------------------------------------------- court */

.court__intro { display: grid; gap: calc(var(--cell) * 3); padding-block: calc(var(--cell) * 12) calc(var(--cell) * 10); }
.court__title { font-family: var(--hj); font-weight: 800; font-size: clamp(3rem, 2rem + 4vw, 6rem); line-height: 0.9; }
.court__lede { font-size: clamp(1.25rem, 1.05rem + 0.6vw, 1.625rem); font-weight: 500; line-height: 1.4; max-width: 36ch; }
@media (min-width: 1000px) { .court__intro { grid-template-columns: auto minmax(0, 1fr); align-items: end; column-gap: calc(var(--cell) * 10); } }

.chapter { position: relative; background: var(--c); color: var(--ink); --field: var(--c); --line-c: var(--ink); }
.chapter::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: calc(var(--cell) * 4);
  background: var(--prev);
  -webkit-mask: var(--m-fang) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 4);
  mask: var(--m-fang) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 4);
}
.chapter__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "head head" "portrait bottle" "facts facts" "buy buy";
  align-items: end;
  column-gap: calc(var(--cell) * 3);
  row-gap: calc(var(--cell) * 5);
  max-width: calc(var(--cell) * 150);
  margin-inline: auto;
  padding: calc(var(--cell) * 11) var(--gutter) 0;
}
.chapter__portrait { grid-area: portrait; justify-self: center; }
.chapter__weave.weave-slot { --pw: 40; --ph: 54; position: relative; inset: auto; width: calc(var(--cell) * var(--pw)); height: calc(var(--cell) * var(--ph)); }
.chapter__head { grid-area: head; display: grid; gap: calc(var(--cell) * 1.5); align-content: start; }
.chapter__name { font-family: var(--hj); font-weight: 800; font-size: clamp(3rem, 1.75rem + 4.2vw, 5.75rem); line-height: 0.92; }
.chapter__role { font-family: var(--hj); font-weight: 500; font-size: clamp(1.3125rem, 1.1rem + 0.5vw, 1.625rem); line-height: 1.1; letter-spacing: 0.05em; }
.chapter__persona { margin-top: calc(var(--cell) * 2); font-size: clamp(1.3125rem, 1.1rem + 0.8vw, 1.875rem); font-weight: 500; line-height: 1.34; max-width: 26ch; text-wrap: pretty; }
.chapter__facts { grid-area: facts; display: grid; gap: calc(var(--cell) * 4); align-content: start; }
.facts { display: grid; max-width: 60ch; }
.facts > div { display: grid; grid-template-columns: calc(var(--cell) * 18) minmax(0, 1fr); gap: calc(var(--cell) * 2); padding-block: calc(var(--cell) * 1.25); }
.facts dt { font-family: var(--hj); font-weight: 500; font-size: 1.1875rem; line-height: 1.35; letter-spacing: 0.04em; }
.facts dd { font-size: 1.0625rem; font-weight: 500; line-height: 1.45; }

.medals { list-style: none; padding: 0; display: grid; gap: calc(var(--cell) * 1.25); }
.medal { display: flex; align-items: center; gap: calc(var(--cell) * 1.25); font-size: 0.9375rem; line-height: 1.35; }
.medal b { font-weight: 600; }
.medals--small .medal { align-items: flex-start; font-size: 0.8125rem; }
.medals--small .medal .ico { margin-top: 2px; }

.chapter__buy { grid-area: buy; align-self: end; display: grid; gap: calc(var(--cell) * 2); justify-items: start; padding-bottom: calc(var(--cell) * 8); min-width: 0; }
.chapter__shops { display: grid; gap: calc(var(--cell) * 2); width: min(100%, calc(var(--cell) * 62)); }
.shoplist { list-style: none; padding: 0; }
.shoplist a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: calc(var(--cell) * 2);
  min-height: 44px;
  padding-block: calc(var(--cell) * 1.25);
  color: inherit;
  text-decoration: none;
}
.shoplist__name { font-family: var(--hj); font-weight: 600; font-size: 1.375rem; line-height: 1; }
.shoplist__price { font-weight: 600; font-size: 1.0625rem; line-height: 1; }
.shoplist a:hover .shoplist__name { text-decoration: underline; text-underline-offset: 0.2em; }
.chapter__shops:not([hidden]) li { animation: weave-down calc(var(--pick) * 3) steps(3, end) both; animation-delay: calc(var(--pick) * 3 * var(--i)); }

.chapter__bottle { grid-area: bottle; align-self: end; justify-self: end; position: relative; z-index: 1; padding-bottom: var(--cell); }
.chapter__bottle img { position: relative; height: calc(var(--cell) * 46); width: auto; max-width: none; }
.chapter__bottle::before, .chapter__bottle::after {
  content: '';
  position: absolute; left: calc(var(--cell) * -1); right: calc(var(--cell) * -1); bottom: 0;
  height: calc(var(--cell) * 3);
  z-index: 1;
}
.chapter__bottle::after { background: var(--deep); }
.chapter__bottle::before {
  z-index: 2;
  background: var(--ledge-c);
  -webkit-mask: var(--m-checker) repeat left top / calc(var(--cell) * 2) calc(var(--cell) * 2);
  mask: var(--m-checker) repeat left top / calc(var(--cell) * 2) calc(var(--cell) * 2);
}
.chapter__ledge { position: relative; z-index: 2; height: calc(var(--cell) * 7); background: var(--deep); }
.chapter__ledge::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--ledge-c);
  -webkit-mask: var(--ledge-m, var(--m-band-0)) repeat-x center top / calc(var(--cell) * var(--ledge-tw, 12)) calc(var(--cell) * 7);
  mask: var(--ledge-m, var(--m-band-0)) repeat-x center top / calc(var(--cell) * var(--ledge-tw, 12)) calc(var(--cell) * 7);
}

@media (min-width: 1000px) {
  .chapter__body {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-rows: auto auto 1fr;
    grid-template-areas: "portrait head bottle" "portrait facts bottle" "portrait buy bottle";
    column-gap: calc(var(--cell) * 7);
    row-gap: calc(var(--cell) * 4);
    padding-top: calc(var(--cell) * 13);
  }
  .chapter--r .chapter__body { grid-template-areas: "bottle head portrait" "bottle facts portrait" "bottle buy portrait"; }
  .chapter--r .chapter__bottle { justify-self: start; }
  .chapter__portrait { align-self: start; padding-bottom: calc(var(--cell) * 9); }
  .chapter__weave.weave-slot { --pw: 32; --ph: 44; }
  .chapter__bottle { margin-bottom: calc(var(--cell) * -2); padding-bottom: 0; }
  .chapter__bottle::before, .chapter__bottle::after { display: none; }
  .chapter__bottle img { height: calc(var(--cell) * 56); }
  .chapter__body { align-items: stretch; }
}

/* ----------------------------------------------------------------- more */

.more { padding-bottom: calc(var(--cell) * 12); }
.more__fang {
  --rows: 4;
  height: calc(var(--cell) * 4);
  background: var(--prev);
  -webkit-mask: var(--m-fang) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 4);
  mask: var(--m-fang) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 4);
}
.more__head { display: grid; gap: calc(var(--cell) * 3); padding-block: calc(var(--cell) * 11) calc(var(--cell) * 7); }
.more__title { font-family: var(--hj); font-weight: 800; font-size: clamp(2.5rem, 1.4rem + 3.6vw, 5.25rem); line-height: 0.98; max-width: 15ch; text-wrap: balance; }
.more__lede { color: var(--wool-2); font-size: clamp(1.125rem, 1rem + 0.5vw, 1.4375rem); font-weight: 500; line-height: 1.45; max-width: 44ch; }
@media (min-width: 1000px) { .more__head { grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: calc(var(--cell) * 8); } }

.shelf { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: calc(var(--cell) * 9); }
@media (min-width: 760px) { .shelf { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .shelf { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.shelf__item { display: grid; grid-template-rows: calc(var(--cell) * 40) calc(var(--cell) * 5) auto; min-width: 0; }
.shelf__stage { display: flex; align-items: flex-end; justify-content: center; }
.shelf__stage img { position: relative; z-index: 1; height: calc(var(--cell) * 42); width: auto; max-width: none; margin-bottom: calc(var(--cell) * -2); }
.shelf__ledge { position: relative; z-index: 2; background: var(--black) var(--tex); }
.shelf__ledge::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--dye-line);
  -webkit-mask: var(--m-teeth-up) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 5);
  mask: var(--m-teeth-up) repeat-x center top / calc(var(--cell) * 8) calc(var(--cell) * 5);
}
.shelf__info { display: grid; gap: calc(var(--cell) * 1.25); align-content: start; justify-items: start; padding: calc(var(--cell) * 3) calc(var(--cell) * 1.5) 0; }
.shelf__name { font-family: var(--hj); font-weight: 700; font-size: 1.875rem; line-height: 1; }
.shelf__name .num { color: var(--wool-2); font-weight: 500; }
.shelf__grapes { color: var(--wool-2); font-size: 0.9375rem; line-height: 1.4; }
.shelf__note { color: var(--wool-2); font-size: 0.875rem; line-height: 1.4; }
.shelf__buy { font-size: 1.1875rem; }
.score { display: inline-flex; align-items: center; gap: 8px; color: var(--wool); font-family: var(--hj); font-weight: 500; font-size: 1.125rem; line-height: 1; text-decoration: none; min-height: 32px; }
.score b { font-weight: 700; font-size: 1.75rem; color: var(--dye-line); }
.score:hover span { text-decoration: underline; text-underline-offset: 0.2em; }

/* ---------------------------------------------------------------- proof */

.proof__grid { display: grid; gap: calc(var(--cell) * 7); padding-block: calc(var(--cell) * 12); }
.proof__side { display: grid; gap: calc(var(--cell) * 3); align-content: start; justify-items: start; }
.proof__title { font-family: var(--hj); font-weight: 800; font-size: clamp(2.5rem, 1.5rem + 3.2vw, 4.75rem); line-height: 0.95; max-width: 10ch; }
.proof__lede { max-width: 40ch; }
.proof__sub { margin-top: calc(var(--cell) * 5); font-family: var(--hj); font-weight: 600; font-size: 1.625rem; line-height: 1.1; }
.ratings { list-style: none; padding: 0; width: 100%; max-width: 52ch; }
.rating a {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: baseline;
  gap: calc(var(--cell) * 2);
  padding-block: calc(var(--cell) * 2);
  color: var(--wool);
  text-decoration: none;
}
.rating__label { font-family: var(--hj); font-weight: 600; font-size: 1.375rem; line-height: 1; }
.rating__value { font-family: var(--hj); font-weight: 700; font-size: 2.25rem; line-height: 1; color: var(--dye-line); }
.rating__count { color: var(--wool-2); font-size: 0.9375rem; line-height: 1.3; }
.rating a:hover .rating__count { text-decoration: underline; text-underline-offset: 0.2em; }
@media (min-width: 1000px) { .proof__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: calc(var(--cell) * 10); align-items: start; } }

.register-wrap { min-width: 0; overflow-x: auto; }
.register { width: 100%; border-collapse: collapse; font-size: 1rem; line-height: 1.35; }
.register th, .register td {
  text-align: left;
  vertical-align: baseline;
  padding: calc(var(--cell) * 1.75) calc(var(--cell) * 2) calc(var(--cell) * 1.75) 0;
  background: var(--m-rule) repeat-x left bottom / calc(var(--cell) * 2) 2px;
}
.register th:last-child, .register td:last-child { padding-right: 0; }
.register thead th { padding-top: 0; color: var(--wool-2); font-family: var(--hj); font-weight: 500; font-size: 1.125rem; letter-spacing: 0.06em; }
.register tbody th { font-weight: 500; }
.register__year { font-family: var(--hj); font-weight: 700; font-size: 1.75rem; line-height: 1; color: var(--dye-line); }
.register .medal { font-size: 1rem; }
.register__unit { display: none; color: var(--wool-2); }

/* ------------------------------------------------------------------ buy */

.buy__head { display: grid; gap: calc(var(--cell) * 3); padding-block: calc(var(--cell) * 12) calc(var(--cell) * 6); }
.buy__title { font-family: var(--hj); font-weight: 800; font-size: clamp(3rem, 1.75rem + 4.6vw, 6rem); line-height: 0.9; }
.buy__lede { font-size: clamp(1.125rem, 1rem + 0.5vw, 1.4375rem); font-weight: 500; line-height: 1.45; max-width: 48ch; }
@media (min-width: 1000px) { .buy__head { grid-template-columns: auto minmax(0, 1fr); align-items: end; column-gap: calc(var(--cell) * 10); } }

.buy__body { display: grid; gap: calc(var(--cell) * 4); padding-bottom: calc(var(--cell) * 8); }
.chips { min-width: 0; margin: 0; padding: 0; border: 0; }
.chips__legend { padding: 0; margin-bottom: calc(var(--cell) * 2); font-family: var(--hj); font-weight: 600; font-size: 1.375rem; line-height: 1; }
.chips__row { display: flex; flex-wrap: wrap; gap: var(--cell); }
.chip { position: relative; display: inline-flex; }
.chip input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.chip__face {
  --s: var(--cell);
  display: inline-flex; align-items: center;
  gap: calc(var(--cell) * 1.25);
  min-height: max(40px, calc(var(--cell) * 5.5));
  padding: 0 calc(var(--cell) * 2);
  border: 2px solid transparent;
  background: var(--black-2);
  color: var(--wool);
  font-family: var(--hj); font-weight: 500; font-size: 1.1875rem; line-height: 1;
  white-space: nowrap;
  transition: background-color calc(var(--pick) * 3) steps(3, end), color calc(var(--pick) * 3) steps(3, end);
}
.chip:hover .chip__face { background: var(--black-3); }
.chip input:checked + .chip__face { background: var(--chip-c, var(--wool)); color: var(--chip-ink, var(--black)); border-color: var(--chip-ring, transparent); }
.chip:has(input:focus-visible) { outline: 2px solid var(--wool); outline-offset: 3px; }
.swatch { flex: none; width: max(8px, calc(var(--cell) * 1.5)); height: max(8px, calc(var(--cell) * 1.5)); background: var(--c, transparent); outline: 1px solid rgba(220, 214, 205, 0.45); outline-offset: -1px; }
@media (max-width: 699px) {
  .chips__row { gap: 6px; }
  .chip__face { gap: 6px; min-height: 40px; padding: 0 10px; font-size: 1.0625rem; }
}

.buy__status { min-height: 1.3em; font-family: var(--hj); font-weight: 600; font-size: 1.5rem; line-height: 1.3; }

.register--shops thead th:not(:first-child), .register--shops td { text-align: right; }
.register--shops thead a { display: inline-flex; align-items: center; gap: 6px; color: var(--wool); font-family: var(--hj); font-weight: 600; font-size: 1.3125rem; letter-spacing: 0.02em; text-decoration: none; }
.register--shops thead a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.wine-pick {
  display: inline-flex; align-items: center;
  gap: calc(var(--cell) * 1.25);
  min-height: 36px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--wool);
  font-family: var(--hj); font-weight: 600; font-size: 1.375rem; line-height: 1.05;
  text-align: left;
  cursor: pointer;
}
.wine-pick:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.price { color: var(--wool); font-size: 1.0625rem; font-weight: 500; font-variant-numeric: tabular-nums lining-nums; text-decoration: none; white-space: nowrap; }
a.price:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.price__unit { color: var(--wool-2); font-size: 0.8125rem; }
.price--none { color: var(--wool-3); }
@media (max-width: 699px) {
  .register--shops { font-size: 0.9375rem; }
  .register--shops thead a { font-size: 1.0625rem; }
  .register--shops thead a .ico, .price__unit { display: none; }
  .register--shops th, .register--shops td { padding-right: calc(var(--cell) * 1.5); }
  .wine-pick { font-size: 1.1875rem; }
  .register__unit { display: inline; }
}

.pick { --s: var(--cell); --field: var(--black-2); display: grid; gap: calc(var(--cell) * 3); padding: calc(var(--cell) * 4) calc(var(--cell) * 3); background: var(--black-2); color: var(--wool); }
.pick--court { --field: var(--c); --line-c: var(--ink); background: var(--c); color: var(--ink); }
.pick__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: calc(var(--cell) * 2); }
.pick__name { font-family: var(--hj); font-weight: 800; font-size: clamp(2.25rem, 1.5rem + 2.6vw, 4rem); line-height: 0.95; }
.offers { list-style: none; padding: 0; }
.offer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "shop price" "go go";
  align-items: center;
  gap: calc(var(--cell) * 1.5) calc(var(--cell) * 2);
  padding-block: calc(var(--cell) * 2);
  animation: weave-down calc(var(--pick) * 3) steps(3, end) both;
  animation-delay: calc(var(--pick) * 3 * var(--i));
}
.offer__shop { grid-area: shop; font-family: var(--hj); font-weight: 600; font-size: clamp(1.5rem, 1.25rem + 1vw, 2.25rem); line-height: 1; }
.offer__price { grid-area: price; font-weight: 600; font-size: clamp(1.125rem, 1rem + 0.5vw, 1.5rem); line-height: 1; font-variant-numeric: tabular-nums lining-nums; }
.offer--none .offer__price { font-weight: 400; font-style: italic; }
.offer__go, .offer__all { grid-area: go; justify-self: start; }
.offer__all { font-size: 1.1875rem; }
@media (min-width: 700px) {
  .pick { padding: calc(var(--cell) * 5); }
  .offer { grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "shop price go"; column-gap: calc(var(--cell) * 4); }
  .offer__go, .offer__all { justify-self: end; }
}

.note { color: var(--wool-2); font-size: 0.9375rem; }

.abroad { display: grid; gap: calc(var(--cell) * 5); padding-block: calc(var(--cell) * 6) calc(var(--cell) * 14); }
.abroad__head { display: grid; gap: calc(var(--cell) * 2); }
.abroad__title { font-family: var(--hj); font-weight: 700; font-size: clamp(2rem, 1.5rem + 1.8vw, 3.25rem); line-height: 1; }
.abroad__lede { color: var(--wool-2); max-width: 52ch; }
.abroad__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: calc(var(--cell) * 4) calc(var(--cell) * 5); }
.country__name { display: flex; align-items: baseline; gap: calc(var(--cell) * 1.5); padding-bottom: calc(var(--cell) * 1.5); font-family: var(--hj); font-weight: 600; font-size: 1.625rem; line-height: 1; }
.country__name::after { background: var(--dye-line); opacity: 1; }
.country__code { padding: 3px 6px; background: var(--wool); color: var(--black); font-size: 1rem; font-weight: 700; letter-spacing: 0.06em; }
.country__shops { list-style: none; padding: 0; }
.country__shops a { display: flex; align-items: center; justify-content: space-between; gap: calc(var(--cell) * 2); min-height: 44px; padding-block: calc(var(--cell) * 1.25); color: var(--wool); text-decoration: none; }
.country__label { min-width: 0; }
.country__shop { font-weight: 500; }
.country__city { color: var(--wool-2); font-size: 0.9375rem; }
.country__shops a:hover .country__shop { text-decoration: underline; text-underline-offset: 0.2em; }

/* -------------------------------------------------------------- tasting */

.tasting__grid { display: grid; gap: calc(var(--cell) * 7); padding-block: calc(var(--cell) * 12); }
.tasting__title { font-family: var(--hj); font-weight: 800; font-size: clamp(2.5rem, 1.5rem + 3.2vw, 4.75rem); line-height: 0.95; max-width: 11ch; }
.tasting__visits { margin-top: calc(var(--cell) * 4); font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem); font-weight: 500; line-height: 1.5; max-width: 40ch; }
.contact-lines { list-style: none; padding: 0; margin-top: calc(var(--cell) * 5); display: grid; gap: calc(var(--cell) * 1.5); }
.contact-lines a { display: inline-flex; align-items: center; gap: calc(var(--cell) * 1.5); min-height: 44px; color: var(--wool); font-family: var(--hj); font-weight: 600; font-size: 1.375rem; line-height: 1.1; text-decoration: none; }
.contact-lines a:hover span:last-child { text-decoration: underline; text-underline-offset: 0.2em; }
@media (min-width: 1000px) { .tasting__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: calc(var(--cell) * 10); align-items: start; } }

.booking { position: relative; padding-top: calc(var(--cell) * 5); }
.booking::before {
  content: '';
  position: absolute; left: 0; right: 0; top: 0;
  height: 2px;
  background: var(--wool);
  opacity: 0.45;
  -webkit-mask: var(--m-stitch) repeat-x left top / calc(var(--cell) * 2) 100%;
  mask: var(--m-stitch) repeat-x left top / calc(var(--cell) * 2) 100%;
}
.booking__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: calc(var(--cell) * 3) calc(var(--cell) * 3); }
.field, .booking__send { grid-column: 1 / -1; }
.field--half { grid-column: auto; }
.field { display: grid; gap: var(--cell); align-content: start; }
.field label { font-family: var(--hj); font-weight: 600; font-size: 1.25rem; line-height: 1.1; letter-spacing: 0.03em; }
.field input, .field select {
  width: 100%;
  min-height: max(48px, calc(var(--cell) * 6.5));
  padding: 0 calc(var(--cell) * 1.75);
  border: 0;
  border-radius: 0;
  background: var(--black-2) var(--m-rule-in) repeat-x left bottom / calc(var(--cell) * 2) 2px;
  color: var(--wool);
  font-size: 1.0625rem; font-weight: 500; line-height: 1.3;
  caret-color: var(--dye-line);
  -webkit-appearance: none;
  appearance: none;
}
.field select { padding-right: 44px; background: var(--m-select) no-repeat right calc(var(--cell) * 1.75) center / 14px 8px, var(--m-rule-in) repeat-x left bottom / calc(var(--cell) * 2) 2px, var(--black-2); cursor: pointer; }
.field input:focus-visible, .field select:focus-visible { outline: 2px solid var(--dye-line); outline-offset: 0; }
.field input[aria-invalid="true"] { box-shadow: inset 0 -2px 0 var(--error); }
.field__err { color: var(--error); font-size: 0.9375rem; line-height: 1.4; }
.booking__send { display: grid; gap: calc(var(--cell) * 2); justify-items: start; margin-top: var(--cell); }
.booking__note { color: var(--wool-2); font-size: 0.9375rem; max-width: 46ch; }
@media (min-width: 560px) { .booking__in { column-gap: calc(var(--cell) * 4); } }

/* ------------------------------------------------------------- partners */

.partners__row { display: grid; gap: calc(var(--cell) * 3); justify-items: start; padding-block: calc(var(--cell) * 8) calc(var(--cell) * 9); }
.partners__title { font-family: var(--hj); font-weight: 700; font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.75rem); line-height: 1; }
.partners__line { max-width: 46ch; font-size: 1.125rem; }
@media (min-width: 1000px) { .partners__row { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: calc(var(--cell) * 6); } }

/* --------------------------------------------------------------- footer */

.end__grid { display: grid; gap: calc(var(--cell) * 6); padding-block: calc(var(--cell) * 11) calc(var(--cell) * 8); }
.end__brand { display: grid; gap: calc(var(--cell) * 2); justify-items: start; }
.end__mono { width: max(52px, calc(var(--cell) * 9)); color: var(--dye-line); }
.end__title { font-family: var(--hj); font-weight: 600; font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); line-height: 1; letter-spacing: 0.18em; text-transform: uppercase; }
.end__line { color: var(--wool-2); max-width: 36ch; }
.end__contact { display: grid; gap: calc(var(--cell) * 1.25); align-content: start; font-style: normal; }
.end__contact a, .end__social a { display: inline-flex; align-items: center; gap: calc(var(--cell) * 1.5); min-height: 44px; color: var(--wool); text-decoration: none; }
.end__contact a:hover span:last-child, .end__social a:hover span:last-child { text-decoration: underline; text-underline-offset: 0.22em; }
.end__social { list-style: none; padding: 0; display: grid; gap: calc(var(--cell) * 1.25); align-content: start; }
.end__legal { display: grid; gap: var(--cell); padding-top: calc(var(--cell) * 4); color: var(--wool-2); font-size: 0.875rem; line-height: 1.5; }
.end__legal::before { top: 0; bottom: auto; }
.end__health { color: var(--wool); font-size: 0.9375rem; }
@media (min-width: 1000px) {
  .end__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr); grid-template-areas: "brand contact social" "legal legal legal"; column-gap: calc(var(--cell) * 8); }
  .end__brand { grid-area: brand; }
  .end__contact { grid-area: contact; }
  .end__social { grid-area: social; }
  .end__legal { grid-area: legal; }
}

/* the unwoven warp: the carpet is not finished */
.end__border { margin-top: calc(var(--cell) * 2); }
.fringe { position: relative; height: var(--fringe-h); margin-inline: calc(var(--side) * -1); }
.fringe__threads { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.fringe__t { fill: none; stroke: rgba(220, 214, 205, 0.62); stroke-width: max(1px, calc(var(--cell) * 0.18)); stroke-linecap: round; }
.fringe__k { fill: var(--wool-2); }
.fringe__end { position: absolute; right: calc(var(--side) + var(--gutter)); bottom: calc(var(--cell) * 3); display: grid; justify-items: end; gap: var(--cell); text-align: right; }
.fringe__end .year-next { position: static; }
.fringe__head { padding: 2px 8px; background: var(--black); color: var(--wool-2); font-family: var(--hj); font-weight: 600; font-size: 1.3125rem; line-height: 1.3; }

/* ----------------------------------------------------------------- gate */

.gate {
  position: fixed; inset: 0;
  width: 100%; height: 100%;
  max-width: none; max-height: none;
  margin: 0; padding: 0;
  border: 0;
  overflow: auto;
  background: var(--black);
  color: var(--wool);
}
.gate::backdrop { background: var(--black); }
.gate__field { position: relative; display: grid; place-items: center; min-height: 100%; padding: calc(var(--cell) * 6) var(--gutter); }
.gate__field::before {
  content: '';
  position: absolute; inset: 0;
  background: rgba(220, 214, 205, 0.16);
  pointer-events: none;
  -webkit-mask: var(--m-warp) repeat center top / var(--cell) var(--cell);
  mask: var(--m-warp) repeat center top / var(--cell) var(--cell);
}
.gate__frame { position: relative; width: min(100%, 560px); --frame-c: var(--dye-line); --field: var(--black); }
.gate__in { display: grid; justify-items: center; gap: calc(var(--cell) * 3); padding: calc(var(--cell) * 7) calc(var(--cell) * 4); background: var(--black); text-align: center; }
.gate__logo { width: max(84px, calc(var(--cell) * 13)); color: var(--dye-line); }
.gate__q { font-family: var(--hj); font-weight: 800; font-size: clamp(2.5rem, 1.75rem + 3vw, 4rem); line-height: 1; font-variation-settings: 'ELSH' 12, 'ELGR' 1; }
.gate__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: calc(var(--cell) * 2); }
.gate__denied { max-width: 30ch; font-size: 1.25rem; font-weight: 500; line-height: 1.45; }
.gate__warn { max-width: 40ch; color: var(--wool-2); font-size: 0.875rem; }

/* ------------------------------------------------------- phone rhythm */
/* On phones the carpet is woven tighter: same lattice, fewer empty rows. */
@media (max-width: 999px) {
  .story__open { padding-block: calc(var(--cell) * 9) calc(var(--cell) * 7); }
  .beat { padding-block: calc(var(--cell) * 4) calc(var(--cell) * 2); }
  .story__loom { padding-bottom: calc(var(--cell) * 7); }
  .story__craft { gap: calc(var(--cell) * 5); padding-block: calc(var(--cell) * 2) calc(var(--cell) * 10); }
  .court__intro, .more__head, .buy__head { padding-top: calc(var(--cell) * 9); }
  .court__intro { padding-bottom: calc(var(--cell) * 7); }
  .chapter__body { padding-top: calc(var(--cell) * 9); row-gap: calc(var(--cell) * 4); }
  .chapter__weave.weave-slot { --pw: 36; --ph: 48; }
  .chapter__bottle img { height: calc(var(--cell) * 42); }
  .chapter__buy { padding-bottom: calc(var(--cell) * 6); }
  .shelf { row-gap: calc(var(--cell) * 6); }
  .shelf__item { grid-template-rows: calc(var(--cell) * 34) calc(var(--cell) * 5) auto; }
  .shelf__stage img { height: calc(var(--cell) * 36); }
  .more { padding-bottom: calc(var(--cell) * 8); }
  .proof__grid { gap: calc(var(--cell) * 5); padding-block: calc(var(--cell) * 9); }
  #medal-table { font-size: 0.9375rem; }
  #medal-table th, #medal-table td { padding-block: calc(var(--cell) * 1.25); padding-right: calc(var(--cell) * 1.5); }
  #medal-table .medal > span { font-size: 0.8125rem; white-space: nowrap; }
  .register--shops th, .register--shops td { padding-block: calc(var(--cell) * 1.25); }
  .abroad { padding-block: calc(var(--cell) * 4) calc(var(--cell) * 10); }
  .tasting__grid { gap: calc(var(--cell) * 5); padding-block: calc(var(--cell) * 9); }
  .end__grid { gap: calc(var(--cell) * 4); padding-block: calc(var(--cell) * 9) calc(var(--cell) * 6); }
  .end__social { grid-auto-flow: column; justify-content: start; column-gap: calc(var(--cell) * 5); }
  .story__photo--dan { max-width: calc(var(--cell) * 38); }
  :root { --fringe-h: calc(var(--cell) * 24); }
}

/* ------------------------------------------------------- woven lettering */
/* The display voice: Handjet with its loop element — every letter built from packed weft loops. */
.hj-loop.hj-loop { font-variation-settings: 'ELSH' 12, 'ELGR' 1; }

/* ---------------------------------------------------------------- still */

.is-static, .is-static *, .is-static *::before, .is-static *::after { animation: none !important; transition: none !important; }