/* tokens:website.root · edit tokens.json, not here */
:root{--calm:cubic-bezier(.22,.61,.36,1);
  --paper:#FFFFFF;
  --card:#FFFFFF;
  --ink:#111111;
  --muted:#757575;
  --accent:#111111;
  --accent-soft:#F1F1F1;
  --line:#E7E7E7;
  --soft:#F5F5F4;
  --btn:#000000;
  --btnText:#FFFFFF;
  --navbg:rgba(255,255,255,.82);
  --radius:18px;
  --serif:"Domine",Georgia,"Times New Roman",serif;
  --sans:"Quicksand",-apple-system,sans-serif;
  --logo-filter:none;
  --max:1680px;
  --display-weight:400;
}
/* /tokens:website.root */
/* Domine, the HACOY headline face since 11.10.2026 (Max), self hosted beside styles.css, SIL OFL 1.1 */
@font-face{font-family:'Domine';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/domine-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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Domine';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/domine-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:'Quicksand';font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/quicksand-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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/quicksand-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}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;
  letter-spacing:-.005em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background .4s,color .4s}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
.serif{font-family:var(--serif)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:var(--display-weight,300);line-height:1.06;letter-spacing:-.02em}
.display{font-size:clamp(40px,6.8vw,84px);font-weight:300}
h2{font-size:clamp(28px,3.8vw,46px)}
h3{font-size:clamp(20px,2.3vw,26px)}
.kick{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--muted)}
.lead{font-size:clamp(18px,1.6vw,21px)}
.muted{color:var(--muted)}
.small{font-size:14px}
.center{text-align:center}

.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-weight:600;font-size:15px;
  padding:13px 22px;border-radius:999px;cursor:pointer;border:1px solid transparent;white-space:nowrap;
  transition:background-color .6s var(--calm),color .6s var(--calm),border-color .6s var(--calm),opacity .6s var(--calm),transform .6s var(--calm),box-shadow .6s var(--calm)}
.btn:active{transform:scale(.985);transition-duration:.25s}
.btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(127,127,127,.28)}
/* Veil (Max, 26.10.2026): the main button is a translucent veil, never a solid block. On light pages a
   faint grey of the ink, so it stays visible on white and on the soft grey sections; on photos and dark
   bands frosted glass with white text (.hero, .letters, .appband, the header over a photo). */
/* on light pages (Max, 27.10.2026): white frosted glass like the home buttons, held by a hairline and a soft shadow */
.btn.primary{background:color-mix(in srgb,var(--paper) 86%,transparent);color:var(--ink);
  border-color:color-mix(in srgb,var(--ink) 14%,transparent);box-shadow:0 2px 14px rgba(0,0,0,.06);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.btn.primary:hover{background:var(--paper);border-color:color-mix(in srgb,var(--ink) 26%,transparent);box-shadow:0 4px 20px rgba(0,0,0,.09)}
/* Add to bag is black with white text, the one solid button (Max, 27.10.2026) */
.btn.primary.addbtn{background:var(--ink);color:var(--paper);border-color:var(--ink);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.btn.primary.addbtn:hover{background:var(--ink);opacity:.86;box-shadow:none}
.hero .btn.primary,.letters .btn.primary,.appband .btn.primary,body.has-hero #nav:not(.scrolled) .btn.primary{
  background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.35);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hero .btn.primary:hover,.letters .btn.primary:hover,.appband .btn.primary:hover,body.has-hero #nav:not(.scrolled) .btn.primary:hover{background:rgba(255,255,255,.32)}
/* the outlined button everywhere as on the home photo: a clear thin line, a faint veil on hover (Max, 26.10.2026) */
.btn.ghost{background:var(--paper);color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{border-color:var(--ink);background:var(--paper);box-shadow:0 4px 18px rgba(0,0,0,.08)}
/* on photos and dark bands the outline stays see through */
.hero .btn.ghost,.letters .btn.ghost,.appband .btn.ghost,.btn.ghost[style*="color:#fff"]{background:transparent;box-shadow:none}
.btn.sm{padding:10px 18px;font-size:14px}
.btn .arw{transition:transform .8s var(--calm)}
.btn:hover .arw{transform:translateX(4px)}

/* announcement */
.announce{background:var(--ink);color:var(--paper);text-align:center;font-size:13px;font-weight:500;padding:9px 16px;letter-spacing:.01em}
.announce a{text-decoration:underline;text-underline-offset:2px}

/* nav */
header#nav{position:sticky;top:0;z-index:50;background:var(--navbg);backdrop-filter:saturate(150%) blur(18px);
  -webkit-backdrop-filter:saturate(150%) blur(18px);border-bottom:1px solid var(--line)}
.navrow{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{height:19px;filter:var(--logo-filter)}
nav.links{display:flex;gap:24px;align-items:center}
nav.links a{font-size:14.5px;font-weight:500;opacity:.82;transition:opacity .2s}
nav.links a:hover{opacity:1}
.navright{display:flex;align-items:center;gap:12px}
.tgl{width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);
  cursor:pointer;display:grid;place-items:center;font-size:16px;transition:.2s}
.tgl:hover{border-color:var(--ink)}
.burger{display:none;width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:transparent;
  color:var(--ink);cursor:pointer;place-items:center;font-size:18px}

/* hero */
.hero{position:relative;min-height:calc(100vh - 64px);display:flex;align-items:flex-end;overflow:hidden}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.04) 42%,rgba(0,0,0,.64) 100%)}
.hero .htxt{position:relative;z-index:2;color:#fff;padding:0 28px 64px;max-width:var(--max);margin:0 auto;width:100%}
.hero .kick{color:rgba(255,255,255,.82)}
.hero h1{color:#fff;margin:14px 0 18px;max-width:15ch}
/* the name as a dictionary entry (Max, 27.10.2026); the letters that spell HACOY in bold, Domine has no light weight */
.hero h1.define{max-width:none;font-size:inherit}
.hero .def-head{display:block;font-family:var(--sans);font-size:clamp(16px,1.4vw,19px);font-weight:400;opacity:.88;margin-bottom:16px}
.hero .def-sense{display:block;max-width:21ch;font-family:var(--serif);font-weight:400;font-size:clamp(30px,4.2vw,58px);line-height:1.14}
.hero .def-sense{color:rgba(255,255,255,.72);text-shadow:0 1px 22px rgba(0,0,0,.38)}
.hero .def-head{text-shadow:0 1px 14px rgba(0,0,0,.45)}
.hero .def-sense b{font-weight:700;color:#fff}
.hero p{color:rgba(255,255,255,.9);max-width:50ch;font-size:clamp(17px,1.5vw,20px)}
.hero .cta{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.45)}
.hero .btn.ghost:hover{border-color:#fff;background:rgba(255,255,255,.12);box-shadow:none}
/* the hero buttons arrive after the headline, slowly and one after the other (slow luxury, Max 26.10.2026) */
.hero .cta .btn{animation:calmIn 1.4s var(--calm) both}
.hero .cta .btn:nth-child(1){animation-delay:.7s}
.hero .cta .btn:nth-child(2){animation-delay:1.05s}
@keyframes calmIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.btn,.btn .arw{transition:none}.hero .cta .btn{animation:none}}

section.blk{padding:clamp(64px,9vw,116px) 0}
.sechead{max-width:var(--max);margin:0 auto;padding:0 28px}
.sechead h2{margin-top:12px;max-width:20ch}
.sechead p{margin-top:16px;max-width:58ch;color:var(--muted)}

/* three ways */
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
.way{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:3/4;display:flex;align-items:flex-end;isolation:isolate}
.way img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s;z-index:-2}
.way:hover img{transform:scale(1.05)}
.way .grd{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 34%,rgba(0,0,0,.74) 100%);z-index:-1}
.way .in{padding:24px;color:#fff}
.tag{display:inline-block;font-size:11px;font-weight:600;
  background:rgba(255,255,255,.18);color:#fff;padding:5px 11px;border-radius:999px;margin-bottom:12px;backdrop-filter:blur(4px)}
.way h3{color:#fff;margin-bottom:6px}
.way p{color:rgba(255,255,255,.88);font-size:15px;max-width:34ch}
.way .go{margin-top:14px;font-size:14px;font-weight:600;display:inline-flex;gap:7px;align-items:center}

/* collections grid */
.colls{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.coll{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/5;display:flex;align-items:flex-end;isolation:isolate;cursor:pointer}
.coll img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s;z-index:-2}
.coll:hover img{transform:scale(1.06)}
.coll .grd{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.72) 100%);z-index:-1}
.coll .in{padding:18px;color:#fff}
.coll h3{color:#fff;font-size:21px}
.coll .ct{color:rgba(255,255,255,.85);font-size:13px;margin-top:3px;max-width:30ch}
.coll .pr{color:#fff;font-size:12.5px;font-weight:600;margin-top:9px;opacity:.95}
.coll .pill{position:absolute;top:14px;left:14px;z-index:1;font-size:10.5px;font-weight:600;
  background:rgba(255,255,255,.9);color:#000;padding:4px 9px;border-radius:999px}

/* product row */
.prow{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:40px}
.pcard{cursor:pointer}
.pcard .ph{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/5;background:var(--soft)}
.pcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--calm)}
/* soft crossfade (Max, 27.10.2026): a second photo of the piece fades in over about a second;
   a card with one photo only comes a little closer, slowly */
.pcard .ph img.ph2{position:absolute;inset:0;opacity:0;transition:opacity 1s var(--calm)}
.pcard .ph img.ph2.fit{object-fit:contain;background:transparent}
@media (hover:hover){.pcard:hover .ph img.ph2{opacity:1}.pcard:hover .ph img:only-child{transform:scale(1.03)}}
/* Inspiration (28.10.2026): our own photographs in a calm grid, one feed with the app */
.inspo-grid{column-count:3;column-gap:16px}
.inspo-pin{display:block;width:100%;padding:0;border:0;background:var(--soft);border-radius:12px;overflow:hidden;
  margin:0 0 16px;break-inside:avoid;cursor:zoom-in}
.inspo-pin img{display:block;width:100%;height:auto;transition:transform 1.6s var(--calm)}
@media (hover:hover){.inspo-pin:hover img{transform:scale(1.03)}}
.inspo-note{text-align:center;margin:40px 0}
.inspo-lb{position:fixed;inset:0;z-index:1300;background:color-mix(in srgb,var(--paper) 97%,transparent);
  display:flex;align-items:center;justify-content:center;padding:64px 70px 30px}
.inspo-lb[hidden]{display:none}
.inspo-lb figure{margin:0;max-width:min(1100px,100%);max-height:100%;display:flex;flex-direction:column;align-items:center;gap:16px}
.inspo-lb img{max-width:100%;max-height:72vh;object-fit:contain;border-radius:10px}
.inspo-lb figcaption{max-width:640px;text-align:center}
.inspo-lb figcaption p{margin:0 0 12px;font-size:16px;line-height:1.5}
.inspo-pcs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center}
.inspo-pcs .muted{font-size:13px;margin-right:4px}
.inspo-pc{font-size:13px;padding:6px 12px;border:1px solid var(--line);border-radius:999px}
.inspo-x{position:absolute;top:18px;right:22px;background:none;border:0;font:inherit;font-size:14px;color:var(--ink);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.inspo-nav{position:absolute;top:50%;margin-top:-24px;width:48px;height:48px;border-radius:50%;border:1px solid var(--ink);
  background:var(--paper);color:var(--ink);font-size:18px;cursor:pointer}
.inspo-nav.prev{left:14px}.inspo-nav.next{right:14px}
@media(max-width:760px){.inspo-grid{column-count:2;column-gap:10px}.inspo-pin{margin-bottom:10px}
  .inspo-lb{padding:56px 14px 20px}.inspo-nav{top:auto;bottom:16px;margin-top:0}}
.pcard .nm{font-size:13.5px;font-weight:500;margin-top:10px;line-height:1.3}
.pcard .pp{font-size:13.5px;color:var(--muted);margin-top:2px}

/* PDP */
.pdp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:start;max-width:var(--max);margin:0 auto;padding:0 28px}
.pdp .gal{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5;position:sticky;top:88px}
.pdp .gal img{width:100%;height:100%;object-fit:cover}
.pdp .info .tag{background:var(--accent-soft);color:var(--ink)}
.pdp h2{margin:8px 0 4px}
.pdp .price{font-size:22px;font-weight:600;margin:10px 0 18px}
.pdp .desc{color:var(--muted);max-width:48ch}
.pdp .sizes{display:flex;gap:8px;margin:22px 0 8px;flex-wrap:wrap}
.pdp .sz{width:46px;height:46px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;
  font-size:14px;font-weight:500;cursor:pointer;transition:background-color .6s var(--calm),border-color .6s var(--calm),color .6s var(--calm)}
.pdp .sz:hover{border-color:var(--ink)}
/* a chosen size is black with white text, clear at a glance (Max, 27.10.2026) */
.pdp .sz.sel{background:var(--ink);color:var(--paper);border-color:var(--ink);font-weight:600}
.pdp .buy{display:flex;gap:10px;margin:20px 0}
.pdp .feat{border-top:1px solid var(--line);margin-top:22px;padding-top:22px;display:grid;gap:16px}
.pdp .feat .f{display:flex;gap:12px;align-items:flex-start}
.pdp .feat .f .ic{font-family:var(--serif);font-size:20px;line-height:1;margin-top:2px}
.pdp .feat .f .t{font-size:14.5px;font-weight:600}
.pdp .feat .f .s{font-size:13.5px;color:var(--muted)}

/* price transparency bar */
.pt{max-width:920px;margin:36px auto 0;padding:0 28px}
.ptbar{display:flex;height:56px;border-radius:12px;overflow:hidden;margin:22px 0 14px}
.ptseg{display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:600;min-width:0}
.ptleg{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ptleg .l .sw{width:12px;height:12px;border-radius:3px;display:inline-block;margin-right:7px;vertical-align:middle}
.ptleg .l .lab{font-size:13px;font-weight:600}
.ptleg .l .val{font-size:13px;color:var(--muted);margin-top:2px}

/* passport */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center;max-width:var(--max);margin:0 auto;padding:0 28px}
.split.rev .media{order:2}
.split .media{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5}
.split .media img{width:100%;height:100%;object-fit:cover}
.split .body h2{margin:12px 0 18px;max-width:16ch}
.split .body p{max-width:50ch;color:var(--muted)}
.split .body .btn{margin-top:24px}

/* circular pillars */
.pill4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.pil{border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;background:var(--card);transition:.25s}
.pil:hover{border-color:var(--ink);transform:translateY(-3px)}
.pil .n{font-family:var(--serif);font-size:15px;color:var(--muted)}
.pil h3{font-size:20px;margin:12px 0 8px}
.pil p{font-size:14px;color:var(--muted)}

/* materials */
.mats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.mat{border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--card)}
.mat h4{font-size:19px;margin-bottom:8px}
.mat p{font-size:14px;color:var(--muted)}
.mat .care{margin-top:12px;font-size:12.5px;color:var(--ink);opacity:.75}

/* letters */
.letters{position:relative;overflow:hidden}
.letters img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.letters .veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.4) 0%,rgba(0,0,0,.14) 38%,rgba(0,0,0,0) 62%)}
.letters .in{position:relative;z-index:2;color:#fff;max-width:600px;margin:0;padding:clamp(80px,11vw,140px) 28px clamp(80px,11vw,140px) clamp(28px,6vw,96px);text-align:left;text-shadow:0 1px 16px rgba(0,0,0,.45)}
.letters .kick{color:rgba(255,255,255,.75)}
/* the quote on the right, where the photo leaves room (Max, 27.10.2026: founder with the makers) */
.letters.right .veil{background:linear-gradient(270deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.3) 34%,rgba(0,0,0,0) 60%)}
.letters.right{aspect-ratio:2/1;display:flex;align-items:center}
.letters.right img.bg{object-position:center top}
.letters.right blockquote{font-size:clamp(24px,2.9vw,40px);max-width:15ch}
.letters.right .in{max-width:min(520px,36vw);margin-left:auto;padding:clamp(80px,11vw,140px) clamp(28px,6vw,96px) clamp(80px,11vw,140px) 28px}
@media(max-width:760px){.letters.right .veil{background:linear-gradient(0deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,.2) 55%,rgba(0,0,0,0) 80%)}
  .letters.right{aspect-ratio:auto;display:block}
  .letters.right .in{max-width:none;margin-left:0;padding-top:clamp(180px,50vw,260px)}}
.letters blockquote{font-family:var(--serif);font-weight:300;font-size:clamp(26px,4vw,46px);line-height:1.2;letter-spacing:-.02em;margin:20px 0 22px;max-width:16ch}
.letters cite{font-style:normal;color:rgba(255,255,255,.82);font-size:15px;display:block;margin-bottom:8px}
.letters .note{color:rgba(255,255,255,.6);font-size:13px;margin-bottom:26px}

/* eu cards */
.eu-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.eu-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--card)}
.eu-card img{width:100%;aspect-ratio:16/10;object-fit:cover}
.eu-card .p{padding:20px 22px}
.eu-card .city{font-family:var(--serif);font-size:22px}
.eu-card .lbl{font-size:13px;color:var(--muted);margin-top:2px}
.eu-card .p p{font-size:13.5px;color:var(--muted);margin-top:10px}

/* team */
.team{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:760px;margin:40px auto 0;padding:0 28px}
.tm{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--card)}
.tm img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tm .p{padding:18px 20px}
.tm .nm{font-family:var(--serif);font-size:20px}
.tm .ro{font-size:13.5px;color:var(--muted);margin-top:2px}

/* citizens */
.quals{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.qual{border:1px solid var(--line);border-radius:999px;padding:9px 18px;font-size:14px;font-weight:500}
.amb{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:26px}
.amb .a{border:1px solid var(--line);border-radius:12px;padding:16px 18px;background:var(--card)}
.amb .a .nm{font-weight:600;font-size:14.5px}
.amb .a .ro{font-size:12.5px;color:var(--muted);margin-top:3px}

/* membership */
.member{background:var(--paper);color:var(--ink)}
.member .in{max-width:var(--max);margin:0 auto;padding:clamp(56px,7vw,96px) 28px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center}
.member .kick{color:var(--ink);opacity:.5}
.member h2{color:var(--ink);margin:12px 0 34px}
.member .lead{color:var(--ink);opacity:.7;max-width:44ch}
.member .price{font-family:var(--serif);font-size:clamp(40px,6vw,64px);font-weight:300;margin:22px 0 6px}
.member .plans>div{container-type:inline-size}
.member .plans .price{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:5px;min-height:1.6em;min-height:1lh}
.member .plans .price>span{white-space:nowrap}
.member .plans .price [data-eur]{font-size:min(1em,calc(100cqi / var(--pw,2.2)),max(30px,calc((100cqi - var(--sw,4.5rem) - 6px) / var(--pw,2.2))))}
.member .pnote{color:var(--ink);opacity:.5;font-size:14px}
.member .btn{margin-top:24px}
.member .bens{display:grid;gap:2px}
.member .ben{display:flex;gap:14px;padding:15px 0;border-bottom:1px solid var(--line)}
.member .ben .k{font-family:var(--serif);opacity:.45;font-size:14px;min-width:26px}
.member .ben .t{font-size:15px}
.member .ben .t b{font-weight:600}
.member .ben .t span{display:block;color:var(--muted);font-size:13.5px;margin-top:2px}

/* campaigns */
.camps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px}
.camp{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:3/4;display:flex;align-items:flex-end;isolation:isolate}
.camp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s;z-index:-2}
.camp:hover img{transform:scale(1.05)}
.camp .grd{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.76) 100%);z-index:-1}
.camp .in{padding:16px;color:#fff}
.camp .yr{font-size:11px;opacity:.8}
.camp .ti{font-family:var(--serif);font-size:18px;line-height:1.15;margin-top:4px}
.events{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.ev{border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--card)}
.ev h4{font-size:18px;margin-bottom:6px}
.ev p{font-size:13.5px;color:var(--muted)}

/* journal + press */
.jrow{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.jc{border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--card);transition:.2s;display:flex;flex-direction:column}
.jc:hover{border-color:var(--ink);transform:translateY(-3px)}
.jc .cat{font-size:11px;color:var(--muted)}
.jc h4{font-size:19px;margin:12px 0 auto;line-height:1.2}
.jc .rd{font-size:13px;font-weight:600;margin-top:16px;display:inline-flex;gap:6px;align-items:center}
.press{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;justify-content:center;margin-top:44px;
  padding-top:36px;border-top:1px solid var(--line)}
.press span{font-family:var(--serif);font-size:clamp(15px,1.6vw,20px);color:var(--muted);opacity:.85}

/* visit */
.visit{display:grid;grid-template-columns:1.1fr 1fr;gap:0;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;max-width:var(--max);margin:0 auto}
.visit .pic{min-height:340px;position:relative}
.visit .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.visit .tx{padding:clamp(32px,4vw,52px);background:var(--card);display:flex;flex-direction:column;justify-content:center}
.visit .tx h2{margin:12px 0 16px}
.visit .tx .addr{font-size:16px;line-height:1.5}
.visit .tx .meta{color:var(--muted);font-size:14px;margin-top:14px}
.visit .tx .btn{margin-top:24px;align-self:flex-start}

/* app band */
.appband{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.appband .in{max-width:var(--max);margin:0 auto;padding:clamp(64px,8vw,110px) 28px}
.appband .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:38px}
.appband .g{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px}
.appband .g .ic{font-family:var(--serif);font-size:22px}
.appband .g h4{font-size:17px;margin:12px 0 6px}
.appband .g p{font-size:13.5px;color:var(--muted)}

/* support */
.sup{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.sup .s{border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--card)}
.sup .s h4{font-size:18px;margin-bottom:10px}
.sup .s p{font-size:14px;color:var(--muted)}
.sup .s ul{list-style:none;margin-top:10px;font-size:14px;color:var(--muted)}
.sup .s li{padding:5px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px}
.sup .s li:first-child{border-top:0}

/* careers */
.careers{border-top:1px solid var(--line)}
.careers .in{max-width:var(--max);margin:0 auto;padding:clamp(48px,6vw,80px) 28px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.careers h3{max-width:22ch}
.careers p{color:var(--muted);margin-top:8px;max-width:50ch;font-size:15.5px}

/* footer */
footer{background:var(--ink);color:var(--paper)}
.foot{max-width:none;margin:0;padding:clamp(56px,7vw,88px) 32px 40px}
.foot-top{display:grid;grid-template-columns:repeat(5,1fr);gap:28px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.14)}
.foot-brand{text-align:center;padding-top:38px}
.foot-brand .logo{height:38px;width:auto;display:block;margin:0 auto 12px}
.foot-brand .essence{max-width:none;margin:0 auto;opacity:.9;font-size:20px}
.foot .logo{height:22px;margin-bottom:16px;filter:brightness(0) invert(1)}
.foot .essence{font-family:var(--serif);font-size:19px;max-width:22ch;line-height:1.3;opacity:.95}
.foot .col h4{font-size:12px;font-weight:600;opacity:.5;margin-bottom:15px}
.foot .col a{display:block;font-size:14.5px;margin-bottom:10px;opacity:.8}
.foot .col a:hover{opacity:1}
.foot .legal{padding-top:26px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12.5px;opacity:.6;line-height:1.7}
.foot .pay{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.foot .pay span{font-size:11px;border:1px solid rgba(255,255,255,.25);border-radius:6px;padding:4px 9px;opacity:.7}

.rv{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s}
.rv.in{opacity:1;transform:none}
.no-js .rv{opacity:1;transform:none}

@media(max-width:1000px){
  .colls{grid-template-columns:repeat(2,1fr)}
  .prow{grid-template-columns:repeat(3,1fr)}
  .camps{grid-template-columns:repeat(2,1fr)}
  .jrow{grid-template-columns:repeat(2,1fr)}
  .appband .grid{grid-template-columns:repeat(2,1fr)}
  .amb{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  nav.links{display:none}
  .burger{display:grid}
  .ways{grid-template-columns:1fr}
  .pill4{grid-template-columns:1fr 1fr}
  .mats{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .split.rev .media{order:0}
  .split .media{aspect-ratio:16/11}
  .pdp{grid-template-columns:1fr}
  .pdp .gal{position:relative;top:0}
  .member .in{grid-template-columns:1fr}
  .team{grid-template-columns:1fr}
  .visit{grid-template-columns:1fr}
  .sup{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr 1fr}
  .ptleg{grid-template-columns:1fr 1fr}
  .events{grid-template-columns:1fr}
}
@media(max-width:560px){
  .colls,.prow{grid-template-columns:1fr 1fr}
  .camps{grid-template-columns:1fr}
  .eu-cards{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr}
}

/* mobile menu */
.mmenu{position:fixed;inset:0;z-index:60;background:var(--paper);transform:translateY(-100%);transition:transform .4s;display:flex;flex-direction:column;padding:20px 28px;overflow-y:auto}
.mmenu.open{transform:none}
.mmenu .top{display:flex;justify-content:space-between;align-items:center;height:42px}
.mmenu .mclose{width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;display:grid;place-items:center;font-size:18px}
.mmenu nav{margin-top:28px;display:flex;flex-direction:column}
.mmenu nav a{font-family:var(--serif);font-size:28px;padding:10px 0;border-bottom:1px solid var(--line)}

/* ---- multipage additions ---- */
main{display:block}
/* form controls do not inherit the page font on their own: the newsletter field and the buttons
   fell back to Arial. Everything typed or pressed is Quicksand like the rest of the text. */
button,input,select,textarea{font-family:inherit}
main:focus{outline:none}
/* accessibility */
.skip{position:absolute;left:8px;top:-60px;z-index:200;background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:8px;font-weight:600;font-size:14px;transition:top .2s}
.skip:focus{top:8px}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:3px}
:root[data-theme="dark"] a:focus-visible,:root[data-theme="dark"] button:focus-visible,:root[data-theme="dark"] summary:focus-visible{outline-color:#fff}
.hero a:focus-visible,.collband:focus-visible,.camphero a:focus-visible{outline-color:#fff}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important}.rv{opacity:1!important;transform:none!important;transition:none!important}.way img,.coll img,.collband img,.camp img,.pcard .ph img{transition:none!important}}
/* print: force light, hide overlays, reveal content */
@media print{
  /* tokens:website.print · edit tokens.json, not here */
  :root,:root[data-theme="dark"]{--paper:#fff;--card:#fff;--ink:#111;--muted:#555;--accent:#111;--accent-soft:#f1f1f1;--line:#ccc;--soft:#f5f5f4;--btn:#111;--btnText:#fff;--navbg:#fff;--logo-filter:none}
  /* /tokens:website.print */
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .skip,#mmenu,.announce,#nav .tgl,#nav .burger,#railnav{display:none!important}
  header#nav,body.has-hero #nav{position:static!important;background:#fff!important;border-bottom:1px solid #ccc!important;backdrop-filter:none!important}
  body.has-hero #nav::before{display:none!important}
  body.has-hero #nav .logo{filter:none!important}
  body.has-hero #nav nav.links a,body.has-hero #nav .btn.primary{color:#111!important;background:transparent!important}
  body.has-hero .hero{min-height:auto!important}
  .hero{min-height:70vh!important}
  .rv{opacity:1!important;transform:none!important}
  section.blk{padding:22px 0!important}
  .collband{break-inside:avoid}
}
.cardlink{display:block;color:inherit;text-decoration:none}
.mat.cardlink,.eu-card.cardlink,.tm.cardlink{transition:transform .2s,border-color .2s}
.mat.cardlink:hover,.eu-card.cardlink:hover{border-color:var(--ink);transform:translateY(-3px)}
.tm.cardlink:hover{transform:translateY(-3px)}
.tm.cardlink:hover .nm{text-decoration:underline}
.more{display:inline-block;margin-top:14px;font-size:12.5px;font-weight:600;color:var(--muted);transition:color .2s}
.cardlink:hover .more{color:var(--ink)}
/* ---- header redesign: centered logo, left/right clusters, dropdowns ---- */
#nav .wrap{max-width:none;padding:0 32px}
#nav .navrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;height:66px}
#nav .links{display:flex;align-items:center;gap:22px}
@media(max-width:1300px){#nav .links{gap:16px}#nav .navlink{font-size:15px}}
#nav .navicons{display:inline-flex;align-items:center;gap:16px;margin-left:8px;padding-left:18px;border-left:1px solid var(--line)}
#nav .navicon{display:inline-flex;color:var(--ink);opacity:.85;transition:opacity .2s}
#nav .navicon:hover{opacity:1}
#nav .appbtn{font-weight:600}
body.has-hero #nav .navicon{color:#fff;opacity:.92}
body.has-hero #nav .navicons{border-left-color:rgba(255,255,255,.3)}
body.has-hero #nav.scrolled .navicon{color:var(--ink)}
body.has-hero #nav.scrolled .navicons{border-left-color:var(--line)}
#nav .links.left{justify-self:start}
#nav .links.right{justify-self:end}
#nav .brandlogo{justify-self:center;display:flex;align-items:center}
/* larger wordmark so the circular C detail reads; footer matches */
#nav .brandlogo .logo{height:38px}  /* +20%, a little more presence (Max, 05.11.2026) */
.foot .logo{height:32px}
@media(max-width:900px){#nav .brandlogo .logo,#nav .logo{height:30px}}
#nav .navlink{font-family:var(--sans);font-size:16px;font-weight:500;color:var(--ink);opacity:.85;background:none;border:0;padding:0;margin:0;cursor:pointer;display:inline-flex;align-items:center;gap:5px;line-height:1;letter-spacing:-.005em}
#nav .navlink:hover{opacity:1}
#nav .navlink.caret::after{content:"\25be";font-size:10px;opacity:.6;position:relative;top:1px}
#nav .navdrop{position:relative;display:inline-flex}
#nav .dropmenu{position:absolute;top:100%;left:0;min-width:190px;background:transparent;border:0;box-shadow:none;border-radius:0;padding:16px 14px 14px 0;margin:0;display:flex;flex-direction:column;gap:3px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease;z-index:60}
/* invisible bridge so moving the pointer from the trigger to the submenu never crosses a dead gap */
#nav .navdrop::after{content:"";position:absolute;top:100%;left:0;width:100%;height:18px;display:none}
#nav .navdrop:hover::after,#nav .navdrop.open::after{display:block}
#nav .navdrop:hover .dropmenu,#nav .navdrop:focus-within .dropmenu,#nav .navdrop.open .dropmenu{opacity:1;visibility:visible;transform:translateY(0)}
#nav .dropmenu a{padding:6px 2px;font-size:15px;font-weight:500;color:var(--ink);opacity:.85;white-space:nowrap}
#nav .dropmenu a:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}
/* no panel behind the open menu (Max, 05.11.2026, the frosted test of 30.10 is gone): each link carries a soft
   halo in the opposite tone, so it reads over a photo, a white page or anything in between */
#nav .dropmenu{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
#nav .dropmenu a{text-shadow:0 0 2px rgba(255,255,255,.95),0 0 10px rgba(255,255,255,.9),0 0 22px rgba(255,255,255,.7)}
:root[data-theme="dark"] #nav .dropmenu a{text-shadow:0 0 2px rgba(0,0,0,.9),0 0 10px rgba(0,0,0,.85),0 0 22px rgba(0,0,0,.6)}
#nav .navright{display:none}
.mgroup{font-size:11px;font-weight:600;color:var(--muted);margin:22px 0 6px}
/* overlay (has-hero): white nav text over the cover, dropdown stays solid */
body.has-hero #nav .navlink{color:#fff !important;opacity:.92}
body.has-hero #nav .navlink:hover{opacity:1}
body.has-hero #nav.scrolled .navlink{color:var(--ink) !important;opacity:.85}
body.has-hero #nav .dropmenu a{color:#fff !important;opacity:1;text-shadow:0 0 3px rgba(0,0,0,.75),0 1px 10px rgba(0,0,0,.7),0 0 28px rgba(0,0,0,.55)}
body.has-hero #nav.scrolled .dropmenu a{color:var(--ink) !important;text-shadow:0 0 2px rgba(255,255,255,.95),0 0 10px rgba(255,255,255,.9),0 0 22px rgba(255,255,255,.7)}
body.has-hero #nav .dropmenu a:hover{opacity:1}
/* responsive: below 900 show burger, hide clusters, logo left */
@media(max-width:900px){
  #nav .links.left,#nav .links.right{display:none}
  #nav .navrow{grid-template-columns:1fr auto}
  #nav .brandlogo{justify-self:start}
  #nav .burger{display:grid;justify-self:end}
}
@media(min-width:901px){#nav .burger{display:none}}
/* the clusters no longer fit beside the logo (measured in site.js, any width or language): same as below 900 */
html.nav-compact #nav .links.left,html.nav-compact #nav .links.right{display:none}
html.nav-compact #nav .navrow{grid-template-columns:1fr auto}
html.nav-compact #nav .brandlogo{justify-self:start}
html.nav-compact #nav .burger{display:grid!important;justify-self:end}
html.nav-compact #railnav{display:none}
/* ---- far-right stacked icon rail ---- */
#railnav{position:fixed;right:12px;top:120px;z-index:45;display:flex;flex-direction:column;gap:2px;
  background:rgba(255,255,255,.05);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(0,0,0,.05);border-radius:14px;padding:7px 5px;
  box-shadow:0 6px 22px rgba(0,0,0,.06)}
body.has-hero:not(.scrolled) #railnav .railbtn{color:#fff}
body.has-hero:not(.scrolled) #railnav .railbtn .rl{color:rgba(255,255,255,.82)}
#railnav .railbtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:54px;padding:9px 0;
  color:var(--ink);border-radius:11px;transition:background .18s,color .18s}
#railnav .railbtn:hover{background:var(--soft)}
#railnav .railbtn svg{width:20px;height:20px}
#railnav .railbtn .rl{font-size:10px;font-weight:600;color:var(--muted);line-height:1}
#railnav .railbtn:hover .rl{color:var(--ink)}
#railnav .railbtn.app{background:var(--btn);color:var(--btnText);margin-top:4px}
#railnav .railbtn.app .rl{color:rgba(255,255,255,.82)}
#railnav .railbtn.app:hover{background:var(--btn);opacity:.9}
@media(max-width:900px){#railnav{display:none}}
nav.links a.active{opacity:1;font-weight:600}
/* basket badge + toast: the dot anchors on the icon in the header and the rail alike,
   or it hangs off header#nav and widens every page by 9px */
.bagwrap{position:relative;display:inline-flex}
.bagdot{position:absolute;top:-6px;right:-9px;min-width:16px;height:16px;padding:0 3px;border-radius:8px;background:var(--btn);color:var(--btnText);font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}
.bagdot[hidden]{display:none}
body.has-hero:not(.scrolled) .bagdot{background:#fff;color:#111}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(12px);background:var(--btn);color:var(--btnText);padding:12px 22px;border-radius:999px;font-size:14px;font-weight:500;z-index:200;opacity:0;transition:opacity .28s,transform .28s;box-shadow:0 12px 34px rgba(0,0,0,.22);max-width:90vw;text-align:center}
.toast.in{opacity:1;transform:translateX(-50%) translateY(0)}
/* cart page */
.cartrow{display:grid;grid-template-columns:88px 1fr auto;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.cartrow img{width:88px;height:112px;object-fit:cover;border-radius:10px}
.cartrow .qty{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:999px;padding:4px 6px}
.cartrow .qty button{width:26px;height:26px;border:0;background:none;cursor:pointer;font-size:17px;color:var(--ink);border-radius:50%}
.cartrow .qty button:hover{background:var(--soft)}
.cartrow .rm{font-size:12.5px;color:var(--muted);text-decoration:underline;cursor:pointer;background:none;border:0;margin-top:8px}
.cartsum{display:flex;justify-content:space-between;align-items:baseline;margin:22px 0;font-size:20px}
.acct-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:8px}
.acct-card{border:1px solid var(--line);border-radius:14px;padding:20px;display:block;text-decoration:none;color:inherit;transition:border-color .2s,transform .2s}
.acct-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.searchbar{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:999px;padding:12px 20px;max-width:560px}
.searchbar input{border:0;outline:0;background:none;font-size:17px;font-family:var(--sans);width:100%;color:var(--ink)}
.sresults{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:20px;margin-top:26px}
.scard{display:block;text-decoration:none;color:inherit}
.scard .ph{aspect-ratio:3/4;background:var(--soft);border-radius:12px;overflow:hidden;margin-bottom:10px}
.scard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.scard:hover .ph img{transform:scale(1.04)}
.scard .cat{font-size:11px;color:var(--muted)}
.scard h4{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:17px;margin:3px 0 2px}
.scard .pr{font-size:14px;color:var(--muted)}
/* ---- app landing ---- */
.apphero{background:var(--paper);border-bottom:1px solid var(--line);overflow:hidden}
.apphero .wrap{max-width:var(--max);margin:0 auto;padding:clamp(40px,6vw,88px) 28px;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.apphero h1{font-family:var(--serif);font-weight:300;font-size:clamp(38px,5.4vw,66px);line-height:1.03;letter-spacing:-.02em;margin:10px 0 18px;max-width:14ch}
.apphero p.lead{color:var(--muted);font-size:clamp(17px,1.5vw,20px);max-width:46ch}
.appcta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:26px}
.storebadges{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.storebadge{display:inline-flex;align-items:center;gap:11px;background:var(--btn);color:var(--btnText);border-radius:12px;padding:10px 18px;text-decoration:none;transition:opacity .2s}
.storebadge:hover{opacity:.9}
.storebadge svg{flex:none}
.storebadge small{display:block;font-size:10px;opacity:.82;line-height:1}
.storebadge b{display:block;font-size:16px;font-weight:600;line-height:1.2;margin-top:2px}
/* device mockup */
.phone-wrap{display:flex;justify-content:center}
.phone{position:relative;width:290px;height:590px;border-radius:44px;background:#0e0e0e;padding:11px;box-shadow:0 30px 70px rgba(0,0,0,.22)}
.phone .pscreen{position:relative;width:100%;height:100%;border-radius:34px;background:linear-gradient(180deg,#fff,#f4f2ef);overflow:hidden;padding:44px 20px 22px;display:flex;flex-direction:column;gap:12px}
.phone .pscreen.shotonly{padding:30px 0 0;background:#f1f1f1;display:block}
.phone .pscreen.shotonly img{display:block;width:100%;height:auto}
.phone .notch{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:130px;height:26px;background:#0e0e0e;border-radius:0 0 16px 16px;z-index:2}
.phone .plogo{height:19px;width:auto;object-fit:contain;align-self:center;margin-bottom:4px;filter:var(--logo-filter)}
.phone .pgreet{font-family:var(--serif);font-size:24px;font-weight:300;color:#141414;margin-top:2px}
.phone .pcard{background:#fff;border:1px solid rgba(0,0,0,.07);border-radius:16px;padding:14px 15px;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.phone .pcard.lg{background:#141414;color:#fff}
.phone .pk{font-size:10.5px;opacity:.6}
.phone .pcard.lg .pk{opacity:.7}
.phone .ptt{font-family:var(--serif);font-size:16px;margin-top:5px;line-height:1.25}
.phone .prow{display:flex;gap:10px}
.phone .pchip{flex:1;background:#fff;border:1px solid rgba(0,0,0,.07);border-radius:14px;padding:12px;text-align:center;font-size:12px;font-weight:600;color:#141414}
.phone .pimg{height:96px;border-radius:14px;background:linear-gradient(135deg,#e7e2db,#d7cfc4)}
.appfeat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:10px}
.appfeat .af{border:1px solid var(--line);border-radius:16px;padding:22px}
.appfeat .af .ic{font-size:20px}
.appfeat .af h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:21px;margin:10px 0 6px}
.appfeat .af p{color:var(--muted);font-size:14.5px}
.appband{background:var(--btn);color:var(--btnText);border-radius:20px;padding:clamp(28px,4vw,48px);text-align:center}
/* taller, so more of the photo shows (Max, 05.11.2026) */
.appband{min-height:clamp(340px,34vw,460px);display:flex;flex-direction:column;align-items:center;justify-content:center}
.appband h2{font-family:var(--serif);font-weight:300;font-size:clamp(26px,3.4vw,40px);margin-bottom:12px}
.appband p{color:rgba(255,255,255,.75);max-width:52ch;margin:0 auto 22px}
.appband .storebadge{background:#fff;color:#111}
.footget{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:14px;font-weight:500;color:inherit;opacity:.85;text-decoration:none}
.footget:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}
.nltrap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
/* ---- footer: white background, black type ---- */
footer{background:#fff !important;color:var(--ink) !important;border-top:1px solid var(--line)}
.foot{padding-top:32px}
.foot .col h4{opacity:.5}
.foot .col a{opacity:.85}
.foot .logo,.foot-brand .logo{filter:none}
/* menu columns spread evenly across the content width (balanced, centred band) */
.foot-top{border-bottom:0 !important;grid-template-columns:repeat(5,max-content);justify-content:space-between;column-gap:40px;padding:32px 0 8px;max-width:var(--max);margin-left:auto;margin-right:auto}
.foot-brand{padding-top:0}
.foot .essence{color:var(--ink);opacity:.9}
/* press validation bar */
.pbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 44px;padding:0 0 34px;border-bottom:1px solid var(--line)}
.pbar .pk{flex-basis:100%;text-align:center;font-size:11px;color:var(--muted);margin-bottom:6px}
.pbar a{color:var(--ink);text-decoration:none;opacity:.7;transition:opacity .2s;line-height:1;white-space:nowrap}
.pbar a:hover{opacity:1}
.pbar a.pm-logo{display:flex;align-items:center;height:28px}
.pbar a.pm-logo img{height:100%;width:auto;max-width:160px;object-fit:contain;display:block;filter:grayscale(1)}
.pbar a.pm-logo:hover img{filter:grayscale(0)}
.pbar a.pm-lg{height:42px}
.pbar a.pm-badge{height:48px}
.pbar a.pm-lg img,.pbar a.pm-badge img{max-width:180px}
.pm-serif{font-family:var(--serif);font-weight:500;font-size:21px;letter-spacing:.01em}
.pm-caps{font-weight:600;font-size:14px}
.pm-tw{color:#e2001a;opacity:.85;font-weight:800;font-size:19px}
.pm-tw:hover{opacity:1}
.pm-fu{font-size:15px;letter-spacing:.12em}
.pm-fu b{font-weight:700}.pm-fu span{font-weight:300;color:var(--muted)}
.pm-num{display:inline-flex;align-items:center}
.pm-num img{height:30px;width:auto;display:block}
.pm-green{color:#3f9142;opacity:.9;font-weight:700;font-size:14px}
.pm-green:hover{opacity:1}
/* bottom band: newsletter · logo · app, clustered and centred as a group */
.foot-bottom{display:grid;grid-template-columns:1fr auto 1fr;gap:44px clamp(32px,5vw,80px);align-items:center;padding-top:44px;margin:8px auto 0;border-top:1px solid var(--line)}
.foot-bottom .fa-h{font-size:22px;font-weight:400;line-height:1.1}
.foot-bottom .fa-p{font-size:14px;color:var(--muted);margin:6px 0 0;max-width:40ch}
.foot-bottom .nlsignup{max-width:400px;text-align:left;justify-self:start}
.foot-bottom .nlsignup{grid-column:1;grid-row:1}.foot-bottom .foot-brand{grid-column:2;grid-row:1;justify-self:center;text-align:center}.foot-bottom .foot-app{grid-column:3;grid-row:1}
.foot-bottom .essence{white-space:nowrap}
.foot-bottom .foot-app{text-align:right;justify-self:end;align-items:flex-end}
.foot-bottom .foot-app .fa-copy{margin-left:auto}
.foot-bottom .foot-app .fa-badges{justify-content:flex-end}
.nlrow{display:flex;gap:10px;margin:16px auto 0;max-width:440px}
.nlrow input{flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;padding:12px 14px;font:inherit;font-size:15px;background:#fff;color:var(--ink)}
.nlrow input:focus{outline:none;border-color:var(--ink)}
.nlrow button{border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);background:var(--paper);box-shadow:0 2px 14px rgba(0,0,0,.06);color:var(--ink);border-radius:10px;padding:12px 24px;font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .6s var(--calm);white-space:nowrap}
.nlrow button:hover{border-color:color-mix(in srgb,var(--ink) 26%,transparent);box-shadow:0 4px 20px rgba(0,0,0,.09)}
.nlconsent{display:flex;gap:9px;align-items:flex-start;margin:14px auto 0;font-size:12.5px;color:var(--muted);line-height:1.5;max-width:440px;cursor:pointer;text-align:left}
.nlconsent input{margin-top:1px;flex:none;width:15px;height:15px;accent-color:var(--ink)}
.nlconsent a{text-decoration:underline;text-underline-offset:2px}
.apphero .nlconsent{display:block;position:relative;padding-left:24px}.apphero .nlconsent input{position:absolute;left:0;top:2px;margin:0}
.nldone{margin-top:16px;font-size:15px}
.foot-app{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.foot-app .fa-badges{display:flex;gap:12px;flex-wrap:wrap}
.fbadge{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:9px 16px;text-decoration:none;color:var(--ink);transition:.2s}
.fbadge:hover{background:var(--soft)}
.fbadge svg{flex:none}
.fbadge small{display:block;font-size:10.5px;opacity:.65;line-height:1}
.fbadge b{display:block;font-size:15px;font-weight:600;line-height:1.2;margin-top:2px}

/* Footer below the desktop three column layout. The newsletter and the app sit
   side by side, and the HACOY mark closes the page rather than splitting it in
   half. Under 700px two columns squeeze the email field under 180px, so the
   pair stacks, and the mark still comes last. */
@media(max-width:900px){.foot-bottom{grid-template-columns:1fr 1fr;gap:34px 28px;align-items:start;justify-items:start;text-align:left}.foot-bottom .nlsignup{grid-column:1;grid-row:auto;justify-self:start;text-align:left;max-width:none}.nlrow,.nlconsent{margin-left:0;margin-right:0}.foot-bottom .foot-app{grid-column:2;grid-row:auto;justify-self:end;align-items:flex-end;text-align:right}.foot-bottom .foot-app .fa-copy{margin-left:auto}.foot-bottom .foot-app .fa-badges{justify-content:flex-end}.foot-bottom .foot-brand{grid-column:1/-1;grid-row:auto;width:100%;justify-self:center;text-align:center;margin-top:6px;padding-top:32px;border-top:1px solid var(--line)}.nlconsent{text-align:left}}
@media(max-width:700px){.foot-bottom{grid-template-columns:1fr;gap:34px;justify-items:center;text-align:center}.foot-bottom .nlsignup,.foot-bottom .foot-app,.foot-bottom .foot-brand{grid-column:1}.foot-bottom .nlsignup{justify-self:center;text-align:center}.nlrow,.nlconsent{margin-left:auto;margin-right:auto}.foot-bottom .foot-app{justify-self:center;align-items:center;text-align:center}.foot-bottom .foot-app .fa-copy{margin-left:auto;margin-right:auto}.foot-bottom .foot-app .fa-badges{justify-content:center}}
@media(max-width:820px){.foot-top{grid-template-columns:1fr 1fr;justify-content:start;column-gap:24px}}
@media(max-width:620px){.pbar{gap:14px 30px}}
/* featured triptych */
/* featured collections: horizontal scroller, 3 shown at a time, scroll aside for the rest */
.triptych{display:flex;gap:0;background:var(--paper);overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.triptych::-webkit-scrollbar{display:none}
.triptych .tri{position:relative;display:block;overflow:hidden;flex:0 0 33.3333%;scroll-snap-align:start;height:clamp(440px,80vh,900px)}
.triptych .tri img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.triptych .tri:hover img{transform:scale(1.035)}
.triptych .tri .grd{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 52%,rgba(0,0,0,.5) 100%)}
.triptych .lbl{position:absolute;left:26px;bottom:26px;z-index:2;color:#fff;font-size:14px;font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.triptych .lbl::after{content:"";display:block;width:34px;height:1px;background:#fff;margin-top:9px;opacity:.9}
@media(max-width:760px){.triptych .tri{flex-basis:78%;height:70vh}}
/* more collections than fit (Max, 27.10.2026: nobody knew they could slide): on a computer the fourth
   tile peeks in and two quiet veil arrows slide one collection at a time; each shows only where there is more */
@media(min-width:761px){.triptych .tri{flex-basis:31%}}
.triptych .tri:last-child{scroll-snap-align:end}
.tri-wrap{position:relative}
.tri-arw{position:absolute;top:50%;z-index:3;width:52px;height:52px;margin-top:-26px;border-radius:50%;
  border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.2);color:#fff;font-size:20px;cursor:pointer;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;
  transition:opacity .6s var(--calm),background-color .6s var(--calm)}
.tri-arw:hover{background:rgba(255,255,255,.34)}
.tri-arw.prev{left:22px}.tri-arw.next{right:22px}
.tri-arw[hidden]{display:flex;opacity:0;pointer-events:none}
@media(max-width:760px){.tri-arw{display:none!important}}
/* materials fabric carousel (swipe) */
.matcar{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;max-width:var(--max);margin:0 auto;padding:0 28px}
.matcar::-webkit-scrollbar{display:none}
.matcard{flex:0 0 clamp(280px,31%,400px);scroll-snap-align:start;position:relative;display:block;height:clamp(430px,50vw,620px);border-radius:8px;overflow:hidden;background:var(--soft)}
.matcard img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.matcard:hover img{transform:scale(1.04)}
/* the fabric close up first, a piece made from it fades in on hover (Max, 30.10.2026) */
.matcard img.mh{position:absolute;inset:0;opacity:0;transition:opacity 1s var(--calm,ease),transform .6s ease;background:var(--soft)}
.matcard:hover img.mh{opacity:1}
@media(hover:none){.matcard img.mh{display:none}}
.matcard .grd{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.55))}
.matcard .lbl{position:absolute;left:20px;bottom:18px;z-index:2;color:#fff;font-family:var(--serif);font-weight:300;font-size:24px;text-shadow:0 1px 8px rgba(0,0,0,.4)}
@media(max-width:640px){.matcard{flex-basis:70%}}
/* repair flow */
.repairbox{border:1px solid var(--line);border-radius:16px;padding:clamp(22px,3vw,34px);max-width:640px}
.repairbox h2{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:26px;margin-bottom:6px}
.repairbox h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:21px;margin-bottom:6px}
.repairbox label{display:block;font-size:13px;color:var(--muted);margin:14px 0 0}
.repairbox input[type=text],.repairbox input[type=email],.repairbox input[type=password],.repairbox select,.repairbox textarea{width:100%;margin-top:6px;font-family:var(--sans);font-size:15px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink)}
.repairbox textarea{resize:vertical}
.repairbox input[type=file]{margin-top:6px;font-size:13px}
.repairbox .rcheck{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--ink);margin-top:16px}
.repairbox .rcheck input{width:auto;margin:0}
.repairbox .btn{margin-top:20px}
.rtabs{display:flex;margin-bottom:6px;border-bottom:1px solid var(--line)}
.rtab{background:none;border:0;padding:9px 4px;margin-right:22px;font-size:15px;font-weight:500;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.rtab.sel{color:var(--ink);border-bottom-color:var(--ink)}
.rdone{text-align:center}
.rtick{width:54px;height:54px;border-radius:50%;background:var(--btn);color:var(--btnText);display:flex;align-items:center;justify-content:center;font-size:25px;margin:0 auto 14px}
@media(max-width:820px){.apphero .wrap{grid-template-columns:minmax(0,1fr);text-align:center}.apphero h1,.apphero p.lead{max-width:none}.apphero .wrap>div>p,.apphero .appnotify,.apphero .nlrow,.apphero .nlconsent{margin-left:auto!important;margin-right:auto!important}.appcta,.storebadges{justify-content:center}.appfeat{grid-template-columns:1fr}.phone-wrap{margin-top:8px}}
.pagehead{padding:clamp(24px,3.4vw,44px) 0 clamp(26px,3.4vw,46px);border-bottom:1px solid var(--line);background:var(--paper)}
.pagehead .wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
.crumb{display:none}
.crumb a{opacity:.8}.crumb a:hover{opacity:1}
.pagehead h1{font-family:var(--serif);font-weight:300;font-size:clamp(38px,5.6vw,68px);line-height:1.04;letter-spacing:-.02em;margin:12px 0 16px;max-width:20ch}
.pagehead p{max-width:58ch;color:var(--muted);font-size:clamp(17px,1.5vw,20px)}
.tease{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.tz{border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--card);transition:.2s;display:flex;flex-direction:column;min-height:158px}
.tz:hover{border-color:var(--ink);transform:translateY(-3px)}
.tz .k{font-family:var(--serif);font-size:15px;color:var(--muted)}
.tz h3{font-size:21px;margin:10px 0 auto}
.tz .go{font-size:13px;font-weight:600;margin-top:16px;display:inline-flex;gap:6px;align-items:center}
.prose{max-width:760px;margin:0 auto;padding:0 28px}
.prose h3{font-size:22px;margin:30px 0 10px}
.prose p{color:var(--muted);margin-bottom:12px}
.prose h2{margin-bottom:16px}
.prose ul{margin:10px 0 14px 20px}
.prose li{margin:7px 0;color:var(--muted)}
/* full-width content pages (2026-08-20): sections fill the site container, aligned with the page head and hero, instead of a narrow centred column. Body text keeps a readable measure, left-aligned. */
section.blk>.prose{max-width:var(--max)!important;margin-left:auto;margin-right:auto}
section.blk>.prose>p,section.blk>.prose>ul,section.blk>.prose>ol{max-width:74ch}
/* Munich Showroom image band */
.sr-imgs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:4px}
.sr-imgs figure{margin:0}
.sr-imgs img{width:100%;height:clamp(340px,48vh,560px);object-fit:cover;object-position:center;border-radius:var(--radius);display:block}
.sr-imgs figcaption{font-size:13px;color:var(--muted);margin-top:8px}
@media(max-width:700px){.sr-imgs{grid-template-columns:1fr}.sr-imgs img{height:clamp(300px,60vw,440px)}}
/* Events: one row per event, image beside a short text */
.evrow{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(20px,3vw,40px);align-items:center;margin:0 0 clamp(28px,4vw,52px)}
.evrow:last-child{margin-bottom:0}
.evimg img{width:100%;height:clamp(260px,38vh,440px);object-fit:cover;border-radius:var(--radius);display:block}
.evtxt .ev-meta{font-size:12px;color:var(--muted)}
.evtxt h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(24px,2.6vw,32px);margin:8px 0 12px}
.evtxt p{color:var(--muted);max-width:56ch}
.ev-join{border:1px solid var(--line);border-radius:14px;padding:20px;background:var(--card);margin-top:18px}
.ev-join p{color:var(--muted)}
@media(max-width:820px){.evrow{grid-template-columns:1fr;gap:16px}.evtxt p{max-width:none}}
/* membership: support line sits under the pricing cards, not in the benefit list */
.member-support{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);max-width:520px}
.member-support b{display:block;font-size:15px;margin-bottom:4px}
.member-support span{color:var(--muted);font-size:14px;line-height:1.6}
/* journal / knowledge card grids: three per row (2026-08-20) */
.jrow{grid-template-columns:repeat(3,1fr)}
@media(max-width:1000px){.jrow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.jrow{grid-template-columns:1fr}}
/* production: two large place tiles, location set into the bottom left */
.ptiles{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:6px}
.pmap{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:22px}.pm{border:1px solid var(--line);border-radius:var(--radius);padding:clamp(22px,3vw,34px)}.pm-place{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(24px,2.6vw,32px);margin:0 0 14px}.pm-list{list-style:none;padding:0;margin:0 0 14px}.pm-list li{border-top:1px solid var(--line);padding:11px 0;font-size:16px}.pm-list li:last-child{border-bottom:1px solid var(--line)}.pm-list a{text-decoration:none;color:var(--ink)}.pm-list a:hover{text-decoration:underline;text-underline-offset:3px}.pm-note{color:var(--muted);font-size:14px;margin:0 0 14px}
@media(max-width:760px){.pmap{grid-template-columns:1fr}}
.ptile{position:relative;display:block;border-radius:var(--radius);overflow:hidden;text-decoration:none}
.ptile img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center;display:block;transition:transform .6s}
.ptile:hover img{transform:scale(1.03)}
.ptile:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.55))}
.ptile .pt-label{position:absolute;left:22px;bottom:18px;z-index:2;color:#fff;font-family:var(--serif);font-size:clamp(20px,2.2vw,28px);text-shadow:0 2px 12px rgba(0,0,0,.5)}
@media(max-width:760px){.ptiles{grid-template-columns:1fr}}
.lead-line{font-family:var(--serif);font-size:clamp(20px,2.2vw,27px);line-height:1.35;color:var(--ink)!important;max-width:34ch}
/* material page: copy on the left, a stack of images on the right */
.matlayout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.mat-copy p{color:var(--muted);margin-bottom:14px;max-width:62ch}
.mat-copy h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:22px;margin:26px 0 8px}
.mat-pics{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mat-pics img{width:100%;border-radius:var(--radius);display:block;object-fit:cover;aspect-ratio:4/5}
.mat-pics img:first-child{grid-column:1/-1;aspect-ratio:3/4}
.mat-pics img:nth-child(even):last-child{grid-column:1/-1;aspect-ratio:3/4}
/* contact: a single, centred message box */
.contact-single{max-width:620px;margin:0 auto}
/* Knowledge stat strip (from the app) */
.kstats{display:flex;flex-wrap:wrap;gap:16px;margin:6px 0 8px}
.kstat{flex:1;min-width:200px;border:1px solid var(--line);border-radius:14px;padding:20px 22px;background:var(--card)}
.kstat .n{font-family:var(--serif);font-weight:300;font-size:clamp(30px,4vw,44px);line-height:1}
.kstat .l{color:var(--muted);font-size:14px;margin-top:8px;max-width:34ch}
/* app page: six benefit photographs, label set into the bottom right */
.aftgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
.aft{position:relative;border-radius:var(--radius);overflow:hidden}
.aft img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;transition:transform .6s}
.aft:hover img{transform:scale(1.03)}
.aft:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.55))}
.aft-label{position:absolute;right:18px;bottom:16px;z-index:2;color:#fff;font-family:var(--serif);font-size:clamp(17px,1.7vw,22px);text-align:right;text-shadow:0 2px 10px rgba(0,0,0,.5)}
@media(max-width:900px){.aftgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.aftgrid{grid-template-columns:1fr}}
/* phone mockup mirrors the real app home screen */
.pscreen .pbar{display:flex;justify-content:center;padding:10px 0 12px;border-bottom:1px solid rgba(0,0,0,.08)}
.pscreen .plogo{height:14px;width:auto}
.pscreen .pgreetrow{display:flex;align-items:center;justify-content:space-between;margin:14px 0 12px}
.pscreen .pgreet{font-family:var(--serif);font-size:19px;color:#111}
.pscreen .pavatar{width:26px;height:26px;border-radius:999px;background:#111;display:inline-block}
.pscreen .pkick{font-size:10px;color:#666;margin-bottom:8px}
.pscreen .pcard{border-radius:14px;overflow:hidden;margin-bottom:10px;position:relative}
.pscreen .pcard.dark{background:#1b1b1b;color:#fff;padding:16px 14px 18px;text-align:center}
.pscreen .pbadge{display:inline-block;font-size:9.5px;background:rgba(255,255,255,.16);padding:3px 9px;border-radius:999px}
.pscreen .pcard.dark .ptt{font-family:var(--serif);font-size:15px;margin-top:8px}
.pscreen .pcard.dark .psub{font-size:9.5px;color:rgba(255,255,255,.72);margin-top:4px;line-height:1.5}
.pscreen .pcard.shot img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.pscreen .pcard.shot .pcap{position:absolute;left:12px;right:12px;bottom:12px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.pscreen .pcard.shot .pk{font-size:9.5px;opacity:.9}
.pscreen .pcard.shot .ptt{font-family:var(--serif);font-size:15px;line-height:1.15;margin-top:3px}
.pscreen .pcard.shot .psub{font-size:9px;opacity:.85;margin-top:3px;line-height:1.45}
.pscreen .pnav{position:absolute;left:10px;right:10px;bottom:10px;display:flex;justify-content:space-between;background:#fff;border-radius:999px;padding:9px 12px;box-shadow:0 6px 18px rgba(0,0,0,.12);font-size:8.5px;color:#777}
.pscreen .pnav .on{color:#111;font-weight:600}
/* product stories: flatlays shown whole, never cropped */
.jc-ph.fit{background:var(--soft);display:flex;align-items:center;justify-content:center}
.jc-ph.fit img{width:100%;height:100%;object-fit:contain;object-position:center}
.sg-hero{aspect-ratio:auto!important;background:var(--soft);display:flex;align-items:center;justify-content:center;max-width:var(--max);margin:0 auto 26px}
.sg-hero img{width:auto;max-width:100%;max-height:70vh;height:auto;object-fit:contain}
.sgal{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.sgal img{width:100%;aspect-ratio:3/4;object-fit:contain;background:var(--soft);border-radius:var(--radius);display:block}
/* flat lays on white, whole and large, no tinted ground (Max, 30.10.2026) */
.sg-hero.sg-flat{background:none;padding:12px 0}
.sg-hero.sg-flat img{max-height:78vh;width:auto;max-width:100%}
.sgal.sg-flat img{background:none;aspect-ratio:1/1;padding:4%}
.jc-ph.fit.sg-flat{background:#fff}
.jc-ph.fit.sg-flat img{object-fit:contain;padding:6%}
@media(max-width:820px){.sgal{grid-template-columns:1fr 1fr}}
@media(max-width:860px){.matlayout{grid-template-columns:1fr}}
.lcard{border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--card);margin-top:18px}
.lcard h4{font-size:18px;margin-bottom:8px}
.lcard p{font-size:14px;color:var(--muted);margin:0}
.lgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:1000px){.tease{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.lgrid{grid-template-columns:1fr}}
@media(max-width:560px){.tease{grid-template-columns:1fr}}

/* ---- size charts ---- */
.tablewrap{overflow-x:auto;margin-bottom:30px}
.sizetable{width:100%;border-collapse:collapse;margin:6px 0;font-size:14px;min-width:420px}
/* size guide: category tabs + conversion layout */
.sgtabs{display:flex;flex-wrap:wrap;gap:8px}
/* the charts of a category side by side, compact (Max, 30.10.2026) */
.sgpanel:not([hidden]){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:22px 28px;align-items:start}
.sgpanel .sgchart{border:1px solid var(--line);border-radius:14px;padding:18px 18px 12px;background:#fff}
.sgpanel .sglabel{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:18px;margin:0 0 10px;color:var(--ink)}
.sgpanel .sizetable{min-width:0;font-size:13.5px;margin:0}
.sgpanel .sizetable th,.sgpanel .sizetable td{padding:8px 8px;border:0;border-bottom:1px solid var(--line)}
.sgpanel .sizetable thead th{background:none;font-weight:600;font-size:12.5px;color:var(--muted)}
.sgpanel .sizetable td:first-child,.sgpanel .sizetable tbody th:first-child{background:none;width:38%}
.sgpanel .sizetable tbody tr:last-child th,.sgpanel .sizetable tbody tr:last-child td{border-bottom:0}
.sgpanels{margin-top:14px!important}
.sgtabs + .unitsw{margin:20px 0 0}
.sg-conv .tablewrap{border:1px solid var(--line);border-radius:14px;padding:12px 16px;background:#fff}
.sg-conv .sizetable{min-width:0;font-size:13.5px;margin:0}
.sg-conv .sizetable th,.sg-conv .sizetable td{padding:8px 8px;border:0;border-bottom:1px solid var(--line)}
.sg-conv .sizetable thead th{background:none;font-weight:600;font-size:12.5px;color:var(--muted)}
.sg-conv .sizetable tbody th:first-child{background:none}
.sg-conv .sizetable tbody tr:last-child th,.sg-conv .sizetable tbody tr:last-child td{border-bottom:0}
/* white with a black line, the chosen one black with white text, never grey (Max, 30.10.2026) */
.sgtab{border:1px solid var(--ink);background:#fff;border-radius:999px;padding:9px 17px;font:inherit;font-size:14px;cursor:pointer;color:var(--ink);transition:background .6s var(--calm,ease),color .6s var(--calm,ease);white-space:nowrap}
.sgtab.sel{background:var(--ink);color:#fff;border-color:var(--ink)}
.sgpanel[hidden]{display:none}
.sgchart{margin-bottom:30px}
.sglabel{font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.02em;margin-bottom:8px}
.cspics{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}.cspics img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;display:block}.csbar{height:2px;background:var(--line);border-radius:2px;margin-bottom:26px;overflow:hidden}.csbar span{display:block;height:100%;width:0;background:var(--ink);transition:width .6s var(--calm,ease)}.csq[hidden]{display:none}.csl{display:block;font-family:var(--serif);font-weight:var(--display-weight,300);font-size:24px;color:var(--ink);margin:0 0 14px}.csin{position:relative}.csin em{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-style:normal;font-size:14px;color:var(--muted)}.csnav{display:flex;justify-content:space-between;gap:12px;margin-top:26px}.csnav .btn{border:0;cursor:pointer;font-size:15px}.csnav .btn.ghost{border:1px solid var(--ink)}
/* press covers show the whole photo, never cropped (Max, 05.11.2026) */.article-hero.prfull{aspect-ratio:auto;overflow:visible;border-radius:0;text-align:center}.article-hero.prfull img{width:auto;height:auto;max-width:100%;max-height:82vh;border-radius:var(--radius);display:inline-block;vertical-align:top}.jc-img .jc-ph.prfull{aspect-ratio:auto;background:#fff;display:flex;justify-content:center}.jc-img .jc-ph.prfull img{width:100%;height:auto;max-height:520px;object-fit:contain}
.coll-gallery.nat{align-items:start}.coll-gallery.nat img,.coll-gallery.nat img:first-child:nth-last-child(odd){aspect-ratio:auto;height:auto}
.coll-gallery.tall img{aspect-ratio:2/3}.coll-gallery.tall img:first-child:nth-last-child(odd){aspect-ratio:2/3}
.btsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.btsgrid img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:12px;display:block}@media(max-width:700px){.btsgrid{grid-template-columns:1fr 1fr;gap:8px}.btsgrid img{border-radius:8px}}
.sfbox{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:56px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:34px 38px}.sfbox .sg-h{margin-top:0}.sff{display:grid;grid-template-columns:150px minmax(0,220px);align-items:center;gap:14px;margin:12px 0}.sff[hidden]{display:none}.sfn{font-size:14px;color:var(--ink)}.sfi{position:relative;display:block}.sfi em{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-style:normal;font-size:13px;color:var(--muted)}.sff input,.sff select{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:999px;padding:11px 16px;font:inherit;font-size:14px;background:#fff;color:var(--ink)}.sff input:focus,.sff select:focus{outline:none;border-color:var(--ink)}.sfp select{min-width:0}.sfres{margin-top:22px;min-height:52px;color:var(--muted);font-size:14px;line-height:1.6}.sfres span{display:block;margin-top:4px}.sfbig{display:block;font-family:var(--serif);font-weight:var(--display-weight,300);font-size:28px;color:var(--ink)}.sfpic{margin:0;display:flex;justify-content:center}.sfsk{width:100%;max-width:230px;height:auto}.sfm [data-m]{stroke:#cfcfcf;transition:stroke .6s var(--calm,ease)}.sfm [data-m].on{stroke:#111}@media(max-width:860px){.sfbox{grid-template-columns:1fr;gap:20px;padding:24px 20px}.sfpic{order:-1}.sfsk{max-width:150px}.sff{grid-template-columns:1fr;gap:6px}}
.sg-h{font-family:var(--serif);font-size:20px;font-weight:var(--display-weight,300);margin:10px 0 8px}
.sg-list{margin:0 0 8px 18px;color:var(--ink);font-size:14.5px;line-height:1.7}
.dt-list{margin:0 0 8px 18px;padding:0}.dt-list li{margin-bottom:4px}
.sg-sub{color:var(--muted);font-size:13px;margin:6px 0 14px}
.sg-conv{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:10px}
.sg-lbl{font-size:13px;font-weight:600;margin-bottom:6px}
@media(max-width:760px){.sg-conv{grid-template-columns:1fr}}
.sizetable caption{text-align:left;font-family:var(--serif);font-size:19px;margin-bottom:12px;color:var(--ink)}
.sizetable th,.sizetable td{border:1px solid var(--line);padding:11px 12px;text-align:center}
.sizetable thead th{background:var(--soft);font-weight:600}
.sizetable td:first-child,.sizetable tbody th:first-child{text-align:left;font-weight:600;background:var(--soft)}
/* ---- article ---- */
.article-hero{aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;margin:0 auto 26px;max-width:var(--max)}
.article-hero img{width:100%;height:100%;object-fit:cover}
/* journal articles use the full page width, like the rest of the site (2026-08-20) */
.article{max-width:var(--max);margin:0 auto;padding:0 28px}
.article p{margin-bottom:16px;font-size:17px;line-height:1.75;color:var(--ink);max-width:76ch}
.article p.muted{color:var(--muted)}
.article h3{font-size:24px;margin:30px 0 10px}
.backlink{max-width:var(--max);margin:0 auto 22px;padding:0 28px;font-size:14px;font-weight:600}
/* ---- campaign detail ---- */
.camphero{position:relative;height:82vh;min-height:560px;display:flex;align-items:flex-end;overflow:hidden}
.camphero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.camphero .v{display:block;position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,0) 58%,rgba(0,0,0,.42))}
.camphero .t{position:relative;z-index:2;color:#fff;max-width:var(--max);margin:0 auto;width:100%;padding:0 28px 48px}
.camphero .t .yr{font-size:12px;opacity:.85}
.camphero .t h1{color:#fff;font-family:var(--serif);font-weight:300;font-size:clamp(30px,4.4vw,58px);line-height:1.08;margin:0;max-width:20ch;text-shadow:0 2px 10px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.55)}
.camphero .t h1 .c-name{display:block}
.camphero .t h1 .c-sub{display:block;font-size:.6em;opacity:.94;margin-top:.16em;max-width:24ch}
@media(max-width:700px){.camphero{height:70vh;min-height:440px}}
/* ---- newsroom list ---- */
.newslist{margin-top:44px;border-top:1px solid var(--line)}
.nr-lede{color:var(--muted);font-size:16px;line-height:1.7;max-width:70ch;margin:0}
.nr-h{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(24px,2.6vw,32px);margin:56px 0 20px}
.nr-logos{display:flex;flex-wrap:wrap;gap:28px 48px;align-items:center;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.nr-logo img{height:32px;width:auto;max-width:160px;object-fit:contain;display:block}
.nr-facts{border-top:1px solid var(--line)}
.nr-fact{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
.nr-fact .k{font-weight:600}
.nr-fact .v{color:var(--muted)}
@media(max-width:560px){.nr-fact{grid-template-columns:1fr;gap:4px}}
.newslist .n{display:flex;gap:20px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.newslist .n .out{font-weight:600;font-size:14px;min-width:150px}
.newslist .n .dt{font-size:13px;color:var(--muted);min-width:140px}
.newslist .n .ti{font-size:15px;flex:1;min-width:200px}
/* ---- faq ---- */
.faq{max-width:820px;margin:8px auto 0}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:600;font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;color:var(--muted);font-weight:400}
.faq details[open] summary::after{content:"\2212"}
.faq details p{color:var(--muted);font-size:14.5px;padding:0 0 18px;max-width:70ch}
/* ---- shop hub: stacked landscape bands ---- */
.collbands{display:flex;flex-direction:column;gap:16px;margin-top:8px}
.collband{position:relative;display:block;border-radius:var(--radius);overflow:hidden;height:clamp(240px,32vw,400px);color:#fff;isolation:isolate}
.collband img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s;z-index:-2}
.collband:hover img{transform:scale(1.04)}
.collband .grd{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.28) 48%,rgba(0,0,0,0) 100%);z-index:-1}
.collband .in{position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;padding:clamp(26px,5vw,64px);max-width:560px}
.collband h2{color:#fff;font-size:clamp(28px,4vw,52px);line-height:1.02}
.collband p{color:rgba(255,255,255,.9);margin-top:10px;max-width:38ch;font-size:15px}
.collband .meta{margin-top:12px;font-size:13px;font-weight:600;opacity:.95}
.collband .go{margin-top:16px;font-size:14px;font-weight:600;display:inline-flex;gap:7px;align-items:center}
.collband:hover .go .arw{transform:translateX(3px)}
@media(max-width:600px){.collband{height:clamp(220px,60vw,300px)}.collband .grd{background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.62))}}
/* ---- product grid + collection pages ---- */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 24px;margin-top:8px}
.careup{margin:4px 0 22px;padding-top:16px;border-top:1px solid var(--line)}
.careup .kick{margin-bottom:10px}
.careup a{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none}
.careup a:hover .cn{text-decoration:underline}
.careup img{width:56px;height:84px;object-fit:cover;border-radius:8px;background:var(--soft);flex:none}
.careup .cn{font-size:14px;font-weight:500;line-height:1.3}
.careup .cm{font-size:13px;color:var(--muted);margin-top:2px}
.pgrid .pcard .ph{aspect-ratio:4/5}
.rproof{border:0;padding:0;margin:4px 0 12px}.rproof legend{font-size:13px;color:var(--muted);margin-bottom:6px}.rkinds{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:8px}.rkind{display:flex!important;align-items:center;gap:7px;font-size:15px;color:var(--ink);cursor:pointer}.rkind input{width:auto!important;margin:0}.rproof .rsupport{margin-top:6px;font-size:14px}
/* campaign pages: the film behind a play cover and every photo of the shoot (05.11.2026) */
.campfilm{position:relative;display:block;width:100%;max-width:1100px;margin:0 auto;padding:0;border:0;border-radius:14px;overflow:hidden;cursor:pointer;background:#000;aspect-ratio:16/9}
.campfilm img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--calm),opacity .6s}
.campfilm:hover img{transform:scale(1.02)}
.campfilm .cf-play{position:absolute;left:24px;bottom:24px;display:flex;align-items:center;gap:12px;padding:14px 22px 14px 18px;border-radius:999px;background:rgba(255,255,255,.88);color:#111;font-size:15px;font-weight:500}
.campfilm .cf-tri{width:0;height:0;border-left:12px solid #111;border-top:8px solid transparent;border-bottom:8px solid transparent}
.campfilm iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.campgal{columns:2 300px;column-gap:16px;max-width:1100px;margin:0 auto}
.campgal img{width:100%;height:auto;display:block;margin:0 0 14px;border-radius:10px;break-inside:avoid;background:var(--soft)}
.campfilm-sec{padding-bottom:0}
.fcgrid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:start}.fcpic{margin:0;display:grid;gap:14px}.fcpic img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;display:block}
@media(max-width:860px){.fcgrid{grid-template-columns:1fr;gap:28px}.fcpic{order:-1;grid-template-columns:repeat(3,1fr);gap:8px}.fcpic img{border-radius:8px}}
.recs{padding-top:24px}.rec-h{font-family:var(--serif);font-weight:300;font-size:clamp(22px,2.4vw,30px);margin:0 0 22px}
.pgrid.recgrid{grid-template-columns:repeat(4,1fr);gap:28px 18px}
@media(max-width:900px){.pgrid.recgrid{grid-template-columns:repeat(2,1fr)}}
.pgrid.tall .pcard .ph{aspect-ratio:2/3}
.count{font-size:13px;color:var(--muted);margin:0 0 26px}
.pcard{position:relative}
.swrow{display:flex;gap:6px;margin-top:9px}
.sw{width:13px;height:13px;border-radius:50%;border:1px solid rgba(0,0,0,.2);display:inline-block;box-shadow:inset 0 0 0 1.5px #fff}
/* a colour dot on a product card opens the product in that colour (Max, 27.10.2026) */
.pcard .sw[data-c]{width:15px;height:15px;cursor:pointer;transition:transform .5s var(--calm)}
.pcard .sw[data-c]:hover{transform:scale(1.18)}
/* collection description (moved below the products) + behind-the-collection */
.mv-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mv-gallery img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:6px;display:block;background:var(--soft)}
@media(max-width:700px){.mv-gallery{grid-template-columns:1fr 1fr}}
.pagebanner{width:100%;height:clamp(240px,40vw,480px);overflow:hidden}
.pagebanner img{width:100%;height:100%;object-fit:cover;display:block}
.wrapfeat{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px)}
.wrapitem .wrapic{display:inline-flex;color:var(--ink)}
.wrapitem h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:20px;margin:14px 0 6px}
@media(max-width:700px){.wrapfeat{grid-template-columns:1fr;gap:28px}}
.giftform{max-width:560px}
.giftform-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.giftform-row input{flex:1;min-width:180px}
.giftform input,.giftform textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);font:inherit;color:var(--ink);display:block}
.giftform textarea{margin-bottom:16px;resize:vertical}
.gift-banner{font-family:var(--serif);font-weight:300;font-size:clamp(26px,3.8vw,48px);line-height:1.18;margin:0;color:var(--ink)}
.gift-sub{font-size:clamp(16px,1.4vw,19px);line-height:1.6;color:var(--muted);margin:16px 0 0;max-width:60ch}
.gift-choose.gift-alone{grid-template-columns:1fr}
.gift-row{display:grid;grid-template-columns:minmax(220px,300px) minmax(220px,300px) minmax(260px,1fr);gap:clamp(20px,3vw,40px);align-items:start;margin-top:36px}
.gift-includes{padding-top:2px}
.gift-inc-h{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:19px;margin:0 0 16px}
.wrapmini{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;margin-bottom:14px}
.wrapmini img{width:72px;height:90px;object-fit:cover;border-radius:8px;display:block}
.wrapmini h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:15.5px;margin:0 0 3px}
.wrapmini p{margin:0;font-size:13px;line-height:1.5}
@media(max-width:1000px){.gift-row{grid-template-columns:1fr 1fr}.gift-includes{grid-column:1/-1}}
@media(max-width:560px){.gift-row{grid-template-columns:1fr}}
.gift-choose{display:grid;grid-template-columns:auto 1fr;gap:clamp(32px,6vw,84px);align-items:start}
@media(max-width:820px){.gift-choose{grid-template-columns:1fr;gap:40px}}
.colltitle{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(26px,3.2vw,42px);line-height:1.15;margin:0}
.colldesc .cd-title{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(20px,2vw,26px);color:var(--ink);margin-bottom:14px;max-width:60ch}
.colldesc h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(18px,1.7vw,22px);color:var(--ink);margin:26px 0 8px}
.colldesc .cd-more[hidden]{display:none}
.cd-toggle{margin-top:16px;background:none;border:0;padding:0;font:inherit;color:var(--ink);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.cd-toggle:hover{opacity:.7}
.rv-sec{border-top:1px solid var(--line)}
.rv-h{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(22px,2.4vw,30px);margin-bottom:18px}
.stars{color:var(--ink);letter-spacing:2px;font-size:15px;white-space:nowrap}
.rv-head{display:flex;align-items:center;gap:12px;margin-bottom:28px;flex-wrap:wrap}
.rv-num{font-size:18px;font-weight:600}
.rv-count{color:var(--muted);font-size:14px}
.rv-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.rv-card{border:1px solid var(--line);border-radius:10px;padding:18px 20px}
.rv-name{font-weight:600;margin-top:10px;font-size:14px}
.rv-meta{color:var(--muted);font-size:12px;margin-top:2px}
.rv-verified{color:var(--ink)}
.rv-title{font-weight:600;margin-top:12px}
.rv-body{color:var(--muted);margin-top:6px;line-height:1.55}
.colldesc{border-top:1px solid var(--line);padding-top:44px;margin-top:8px}
.colldesc h2{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(24px,2.6vw,32px);margin-bottom:12px}
.colldesc p{color:var(--muted);font-size:clamp(16px,1.4vw,19px);line-height:1.6;max-width:60ch}
.colldesc-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,0.9fr);gap:clamp(28px,5vw,64px);align-items:start}
.coll-gallery{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:sticky;top:96px}
.coll-gallery img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px;display:block;background:var(--soft)}
.coll-gallery img:first-child:nth-last-child(odd){grid-column:1 / -1;aspect-ratio:16/10}
/* two photos until Read more, then all of them, arriving slowly (Max, 27.10.2026; display:block had overridden hidden) */
.coll-gallery img[hidden]{display:none}
/* back to top (Max, 27.10.2026): a small veil at the bottom centre, only near the end of a longer page */
.totop{position:fixed;left:50%;bottom:22px;z-index:40;transform:translate(-50%,10px);opacity:0;pointer-events:none;
  display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;border:1px solid transparent;
  font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink);cursor:pointer;
  background:color-mix(in srgb,var(--paper) 72%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  box-shadow:0 2px 18px rgba(0,0,0,.08);transition:opacity .8s var(--calm),transform .8s var(--calm),background-color .6s var(--calm)}
.totop.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.totop:hover{background:color-mix(in srgb,var(--paper) 90%,transparent)}
@media (prefers-reduced-motion:reduce){.totop{transition:none}}
.coll-gallery img.gmore:not([hidden]){animation:calmIn 1.2s var(--calm) both}
@media(max-width:820px){.colldesc-wrap{grid-template-columns:1fr}.coll-gallery{position:static}}
/* closer to the text above it (Max, 05.11.2026) */
.blk.behindsec{padding-top:clamp(8px,1.5vw,20px)}
.behind-h{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(26px,3vw,36px);margin-bottom:34px}
.behind{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.bc{text-align:center;display:flex;flex-direction:column;align-items:center}
.bc img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:4px}
.bc h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:21px;margin:22px 0 10px}
.bc p{color:var(--muted);font-size:15px;line-height:1.62;max-width:36ch;margin:0 auto}
.bc .bl{display:inline-block;margin-top:16px;font-size:14px;font-weight:500;text-decoration:underline;text-underline-offset:4px}
.bc .bl .arw{margin-left:4px}
@media(max-width:820px){.behind{grid-template-columns:1fr;gap:44px}}
/* founders (Who we are) */
.founders{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:34px}
.founder img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:6px}
.founder h3{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:24px;margin:18px 0 3px}
.founder .role{color:var(--muted);font-size:14px;margin-bottom:10px}
.founder p{color:var(--muted);font-size:15px;line-height:1.6}
.founder .rm{display:inline-block;margin-top:12px;font-size:14px;font-weight:500;text-decoration:underline;text-underline-offset:4px}
@media(max-width:720px){.founders{grid-template-columns:1fr;gap:32px}}
/* booking modal */
.bookmodal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}
.bookmodal[hidden]{display:none}
.bm-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.bm-panel{position:relative;background:#fff;color:var(--ink);border-radius:16px;max-width:440px;width:100%;max-height:92vh;overflow:auto;padding:clamp(24px,4vw,36px);box-shadow:0 30px 80px rgba(0,0,0,.3)}
.bm-x{position:absolute;top:14px;right:16px;background:none;border:0;font-size:18px;cursor:pointer;color:var(--muted);line-height:1}
.bm-h{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:24px;margin-bottom:6px}
.bm-p{color:var(--muted);font-size:14.5px;line-height:1.55;margin-bottom:14px}
.bm-l{display:block;font-size:13px;color:var(--muted);margin-bottom:12px}
.bm-how{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.unitsw{display:inline-flex;gap:6px;margin:4px 0 12px}
.unitsw button{min-width:52px;padding:7px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-size:13px;cursor:pointer;transition:background .6s var(--calm,ease),color .6s var(--calm,ease)}
.unitsw button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.unit-h .u{font-weight:600}
.mood{padding:56px 28px 8px}
.mood-grid{max-width:1500px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.mood-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;display:block}
@media(max-width:700px){.mood{padding:40px 16px 8px}.mood-grid{gap:10px}}
.bm-l input,.bm-l select,.bm-l textarea{display:block;width:100%;margin-top:5px;border:1px solid var(--line);border-radius:9px;padding:11px 12px;font:inherit;font-size:15px;color:var(--ink);background:#fff}
.bm-l input:focus,.bm-l select:focus,.bm-l textarea:focus{outline:none;border-color:var(--ink)}
.bm-full{width:100%;justify-content:center;margin-top:4px}
.bm-link{display:block;width:100%;background:none;border:0;color:var(--muted);font:inherit;font-size:13px;margin-top:12px;cursor:pointer;text-decoration:underline}
.bm-done{text-align:center}
.bm-check{width:48px;height:48px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:500;margin:0 auto 14px}
.bm-hint{font-size:12px;color:var(--muted);line-height:1.5;margin-top:14px}
/* size chart table (PDP size-guide accordion) */
.sztable{width:100%;border-collapse:collapse;margin:10px 0 6px;font-size:14px}
.sztable th,.sztable td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
.sztable th{font-weight:600;color:var(--muted);font-size:12px;}
.sztable td:first-child,.sztable th:first-child{font-weight:600}
/* PDP colour swatches */
.pcolors{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.pcolor{width:26px;height:26px;border-radius:50%;border:1px solid rgba(0,0,0,.2);cursor:pointer;padding:0;box-shadow:inset 0 0 0 2px #fff;transition:transform .15s}
.pcolor:hover{transform:scale(1.08)}
.pcolor.sel{outline:1.5px solid var(--ink);outline-offset:2px}
/* PDP read-more */
.desc-wrap{margin-top:6px}
.desc-full.clamp{max-height:5.6em;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent);mask-image:linear-gradient(180deg,#000 60%,transparent)}
.readmore{background:none;border:0;padding:0;margin-top:8px;font:inherit;font-size:14px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px;color:var(--ink)}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--ink);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
/* PDP accordions + full-width blocks */
.pdp-acc{grid-column:1 / -1;margin-top:14px;border-top:1px solid var(--line)}
.pdp > .pt,.pdp > .feat{grid-column:1 / -1}
.acc{border-bottom:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:18px 2px;font-size:15px;font-weight:500}
.acc summary::-webkit-details-marker{display:none}
.acc .acc-ic{position:relative;width:14px;height:14px;flex:none}
.acc .acc-ic::before,.acc .acc-ic::after{content:"";position:absolute;background:var(--ink)}
.acc .acc-ic::before{left:0;right:0;top:6px;height:1.5px}
.acc .acc-ic::after{top:0;bottom:0;left:6px;width:1.5px;transition:transform .2s}
.acc[open] .acc-ic::after{transform:scaleY(0)}
.acc-body{padding:0 2px 20px;color:var(--muted);font-size:14.5px;line-height:1.6;max-width:64ch}
.acc-body a{text-decoration:underline;text-underline-offset:2px}
.acc-body p{margin-bottom:8px}
/* Shopping with an assistant */
.asst .asst-intro{margin-bottom:12px}
.asst-brief{font:inherit;font-size:13.5px;line-height:1.5;color:var(--ink);white-space:pre-wrap;word-break:break-word;background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:14px 15px;margin:0 0 14px}
.btn-asst{font:inherit;font-size:14px;color:var(--ink);background:var(--paper);border:1px solid var(--ink);border-radius:999px;padding:9px 20px;cursor:pointer;transition:background .15s,color .15s}
.btn-asst:hover{background:var(--ink);color:var(--paper)}
.asst-note{margin-top:12px!important;font-size:12px;color:var(--muted)}
/* alternative big-image PDP */
.pdp-big{grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px)}
.pdp-big .biggal{display:flex;flex-direction:column;gap:10px}
.pdp-big .biggal img{width:100%;border-radius:6px;display:block;background:var(--soft)}
.pdp-big .binfo{position:sticky;top:96px;align-self:start}
/* Desktop: images and details each scroll independently under the cursor.
   overscroll-behavior:contain keeps a column's scroll from bleeding to the page. */
@media(min-width:901px){
 .pdp-big{height:calc(100vh - 118px);align-items:stretch}
 .pdp-big .biggal,.pdp-big .binfo{max-height:100%;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}
 .pdp-big .binfo{position:static;top:auto;align-self:stretch}
 /* the column scrolls on its own and clips at its edge: room for the selected swatch and size rings (29.10.2026) */
 .pdp-big .binfo{padding:4px 6px 0;margin:-4px -6px 0}
 .pdp-big .biggal::-webkit-scrollbar,.pdp-big .binfo::-webkit-scrollbar{width:0;height:0;display:none}
}
@media(max-width:900px){.pdp-big{grid-template-columns:1fr}.pdp-big .binfo{position:static}}
/* campaign stacked banners (app style) */
.campstack{display:flex;flex-direction:column;gap:14px}
.campban{position:relative;display:block;height:clamp(360px,46vw,620px);border-radius:10px;overflow:hidden}
.campban img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.campban:hover img{transform:scale(1.04)}
.campban .grd{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.15) 55%,rgba(0,0,0,0))}
.campban .in{position:absolute;left:clamp(20px,3vw,44px);bottom:clamp(20px,3vw,38px);color:#fff}
.campban .yr{font-size:12px;opacity:.85}
.campban .ti{font-family:var(--serif);font-weight:300;font-size:clamp(24px,3vw,40px);margin-top:6px}
/* journal preview cards + category filter */
.jfilter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.jpill{border:1px solid var(--line);background:none;border-radius:999px;padding:7px 15px;font:inherit;font-size:13px;cursor:pointer;color:var(--muted);transition:.15s}
.jpill:hover{border-color:var(--ink);color:var(--ink)}
.jpill.sel{background:color-mix(in srgb,var(--ink) 7%,transparent);color:var(--ink);border-color:var(--ink);box-shadow:inset 0 0 0 .5px var(--ink)}
.jc-img{padding:0;overflow:hidden}
.jc-img .jc-ph{aspect-ratio:4/3;overflow:hidden;background:var(--soft)}
.jc-img .jc-ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.jc-img:hover .jc-ph img{transform:scale(1.04)}
.jc-img .jc-tx{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1}
/* meet your piece example */
.myp-ex{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:start;margin-top:12px}
.myp-ph{display:block;border-radius:8px;overflow:hidden;background:var(--soft)}
.myp-ph img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.myp-card{border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--card)}
.myp-row{display:flex;justify-content:space-between;gap:18px;padding:11px 0;border-top:1px solid var(--line);font-size:15px}
.myp-row:first-of-type{border-top:0}
.myp-row span{color:var(--muted)}
.myp-row b{font-weight:600;text-align:right}
@media(max-width:760px){.myp-ex{grid-template-columns:1fr;gap:24px}}
/* meet your piece: browsable passport library */
.myp-lib{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px}
.myp-lc{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card);transition:.2s}
.myp-lc:hover{border-color:var(--ink);transform:translateY(-3px)}
.myp-lc-ph{aspect-ratio:4/5;overflow:hidden;background:#fff}
.myp-lc-ph img{width:100%;height:100%;object-fit:contain;padding:12px;box-sizing:border-box}
.myp-lc-tx{padding:16px 18px 18px}
.myp-lc .nm{font-family:var(--serif);font-size:19px}
.myp-lc .mt{color:var(--muted);font-size:13px;margin-top:3px}
.myp-lc .rd{display:inline-flex;gap:6px;align-items:center;font-size:13px;font-weight:600;margin-top:12px}
@media(max-width:820px){.myp-lib{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.myp-lib{grid-template-columns:1fr}}
.myp-lc-score{display:block;font-size:12.5px;color:var(--muted);margin-top:6px}
/* PDP accordion: meet-your-piece preview */
.myp-prev{}
.myp-prev-facts{margin:10px 0 14px;font-size:14px;color:var(--muted)}
.myp-prev-colours{margin-top:10px;font-size:14px}.myp-prev-colours span{color:var(--muted);margin-right:4px}.myp-prev-colours a{text-decoration:underline}
.dpp-colours{margin-top:14px;font-size:14px}.dpp-colours span{color:var(--muted);margin-right:4px}.dpp-colours a{text-decoration:underline}
.btn.sm{padding:9px 16px;font-size:13px}
/* ---- Product Passport Preview (meet your piece) pages ---- */
.dpp-wrap{max-width:1040px;margin:0 auto;padding:0 24px}
.dpp-sec{padding:16px 0}
.dpp-sec .dpp-wrap>.kick{margin-bottom:10px}
.dpp-sec:not(.dpp-top) .dpp-wrap{border-top:1px solid var(--line);padding-top:20px}
.dpp-top{padding-top:8px}
.dpp-hero{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.dpp-ph{border-radius:10px;overflow:hidden;background:#fff;border:1px solid var(--line)}
.dpp-ph img{width:100%;aspect-ratio:4/5;object-fit:contain;display:block;padding:14px;box-sizing:border-box}
.dpp-card{border:1px solid var(--line);border-radius:14px;padding:26px 28px;background:var(--card)}
.dpp-meta{font-size:12.5px;color:var(--muted);margin-bottom:8px}
.dpp-facts{margin-top:6px}
.dpp-fact{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-top:1px solid var(--line);font-size:15px}
.dpp-fact:first-child{border-top:0}
.dpp-fact span{color:var(--muted)}
.dpp-fact b{font-weight:600;text-align:right}
.dpp-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.dpp-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 40px}
.dpp-di span{display:block;font-size:12.5px;color:var(--muted);margin-bottom:4px}
.dpp-di b{font-weight:500;font-size:15.5px}
.dpp-mats{display:flex;flex-direction:column;gap:8px}
.dpp-mat{display:flex;justify-content:space-between;gap:18px;font-size:15.5px}
.dpp-mat span{color:var(--muted)}
.dpp-subh{margin:22px 0 12px;font-size:13px;color:var(--muted)}
.dpp-swatches{display:flex;flex-wrap:wrap;gap:18px}
.dpp-sw{width:140px}
.dpp-sw img{width:140px;height:140px;object-fit:cover;border-radius:8px;display:block}
.dpp-sw figcaption{margin-top:8px;font-size:13.5px;color:var(--muted)}
.dpp-chips{display:grid;gap:8px}
.dpp-chip{font-size:14px;color:inherit}
a.dpp-chip{text-decoration:underline;text-underline-offset:3px}
.dpp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.dpp-stat{border:1px solid var(--line);border-radius:12px;padding:22px;text-align:center;background:var(--card)}
.dpp-stat .n{font-family:var(--serif);font-size:30px;line-height:1}
.dpp-stat .l{margin-top:8px;font-size:13px;color:var(--muted)}
.dpp-note{margin-top:14px;font-size:12.5px;color:var(--muted);line-height:1.55}
.dpp-score{display:flex;align-items:baseline;gap:4px;margin-bottom:16px}
.dpp-score .big{font-family:var(--serif);font-size:40px;line-height:1}
.dpp-score .out{color:var(--muted);font-size:18px}
.dpp-info{position:relative;display:inline-flex;align-items:center;justify-content:center;align-self:center;width:18px;height:18px;margin-left:12px;border:1px solid var(--muted);border-radius:50%;color:var(--muted);font-family:var(--serif);font-style:italic;font-size:12px;line-height:1;cursor:help}
.dpp-info:hover,.dpp-info:focus{color:var(--ink);border-color:var(--ink);outline:none}
.dpp-info .dpp-tip{display:none;position:absolute;left:0;top:26px;width:min(360px,80vw);background:var(--ink);color:var(--paper);padding:14px 16px;border-radius:10px;font-family:var(--sans);font-style:normal;font-size:13px;line-height:1.55;text-align:left;z-index:30;box-shadow:0 8px 30px rgba(0,0,0,.18)}
.dpp-info:hover .dpp-tip,.dpp-info:focus .dpp-tip{display:block}
.dpp-bars{display:flex;flex-direction:column;gap:12px;max-width:560px}
.dpp-bar{display:grid;grid-template-columns:1fr 120px auto;align-items:center;gap:14px;font-size:14px}
.dpp-bar .track{background:var(--line);border-radius:999px;height:7px;overflow:hidden}
.dpp-bar .fill{display:block;height:100%;background:var(--ink);border-radius:999px}
.dpp-bar .v{color:var(--muted);font-size:13px}
.dpp-care{margin:0;padding:0;list-style:none;line-height:1.55}
.dpp-care li{display:flex;gap:14px;align-items:center;margin:9px 0;font-size:15px}
.dpp-care .ci{flex:0 0 auto;width:26px;height:26px;color:var(--ink)}
.dpp-care .ci svg{width:26px;height:26px;display:block}
.dpp-people{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.dpp-person{display:flex;gap:16px;align-items:flex-start;margin:0}
.dpp-person img{width:76px;height:76px;border-radius:50%;object-fit:cover;flex:0 0 auto;background:var(--soft)}
.dpp-person b{display:block;font-size:16px}
.dpp-person span{display:block;font-size:12px;color:var(--muted);margin:2px 0 8px}
.dpp-person p{margin:0;font-size:14px;color:var(--muted);line-height:1.55}
.dpp-vlead{margin:0 0 16px;font-size:15.5px;line-height:1.6;max-width:640px}
.dpp-vform{display:flex;flex-wrap:wrap;gap:10px;max-width:640px;margin-bottom:14px}
.dpp-vform input{flex:1 1 240px;font-family:var(--sans);font-size:15px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);text-transform:uppercase;letter-spacing:.06em}
.dpp-vform input::placeholder{text-transform:none;letter-spacing:0}
.dpp-verify{word-break:break-all}
.dpp-verify a{font-size:14px}
@media(max-width:760px){
  .dpp-hero{grid-template-columns:1fr;gap:24px}
  .dpp-grid,.dpp-people{grid-template-columns:1fr;gap:18px}
  .dpp-stats{grid-template-columns:1fr;gap:12px}
  .dpp-bar{grid-template-columns:1fr 70px auto;gap:10px}
}
/* pricing selectors */
.pricesel{display:flex;gap:20px;flex-wrap:wrap;margin-top:22px}
.pricesel label{display:flex;flex-direction:column;font-size:13px;color:var(--muted);gap:6px}
.pricesel select{border:1px solid var(--line);border-radius:10px;padding:11px 14px;font:inherit;font-size:15px;background:#fff;color:var(--ink);min-width:220px;cursor:pointer}
/* ---- pdp gallery + full description ---- */
.gwrap{position:sticky;top:88px}
.gmain{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5;background:var(--soft)}
.gmain img{width:100%;height:100%;object-fit:cover}
.gthumbs{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.gthumbs img{width:60px;height:76px;object-fit:cover;border-radius:8px;cursor:pointer;border:1px solid var(--line);opacity:.65;transition:.15s}
.gthumbs img:hover,.gthumbs img.sel{opacity:1;border-color:var(--ink)}
.pdp .desc-full{color:var(--muted);max-width:54ch;margin-top:6px}
.pdp .desc-full p{margin-bottom:10px}
.pdp .desc-full strong{color:var(--ink);font-weight:600}
.pdp .desc-full ul{margin:8px 0 12px 18px}
.pdp .desc-full li{margin:5px 0}
.pdp .desc-full h2,.pdp .desc-full h3{font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink);margin:16px 0 4px;letter-spacing:0}
.colorline{font-size:13.5px;color:var(--muted);margin-top:14px}
.colorline b{color:var(--ink);font-weight:600}
@media(max-width:900px){.pgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.gwrap{position:relative;top:0}}
@media(max-width:520px){.pgrid{grid-template-columns:1fr}}

/* ---- overlay header on hero pages ---- */
/* the banner shows on photo pages too since 06.11.2026 (Max) */
body.has-hero .hero{min-height:100vh}
body.has-hero #nav{position:fixed;top:0;left:0;right:0;background:transparent;border-bottom:1px solid transparent;
  backdrop-filter:none;-webkit-backdrop-filter:none;transition:background .35s ease,border-color .35s ease}
body.has-hero #nav::before{content:"";position:absolute;left:0;right:0;top:0;height:200%;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,0));transition:opacity .35s ease}
body.has-hero #nav.scrolled::before{opacity:0}
body.has-hero #nav .logo{filter:brightness(0) invert(1)}
body.has-hero #nav nav.links a{color:#fff;opacity:.92}
body.has-hero #nav nav.links a:hover{opacity:1}
body.has-hero #nav nav.links a.active{color:#fff}
body.has-hero #nav .tgl{color:#fff;border-color:rgba(255,255,255,.45)}
body.has-hero #nav .tgl:hover{border-color:#fff}
body.has-hero #nav .burger{color:#fff;border-color:rgba(255,255,255,.45)}
/* solidifies once the cover image is scrolled past */
body.has-hero #nav.scrolled{background:var(--navbg);border-bottom-color:var(--line);
  backdrop-filter:saturate(150%) blur(18px);-webkit-backdrop-filter:saturate(150%) blur(18px)}
body.has-hero #nav.scrolled .logo{filter:var(--logo-filter)}
body.has-hero #nav.scrolled nav.links a{color:var(--ink);opacity:.82}
body.has-hero #nav.scrolled nav.links a.active{opacity:1}
body.has-hero #nav.scrolled .tgl{color:var(--ink);border-color:var(--line)}
body.has-hero #nav.scrolled .burger{color:var(--ink);border-color:var(--line)}
/* the top navigation keeps each item on one line, the longer German labels too */
#nav nav.links a,#nav .navlink{white-space:nowrap}
/* Phones: nothing is wider than the screen. Found 12.10.2026 by the collection sites' phone
   check: the German buy buttons, the size guide tables, long links in legal and the German
   circular cards each pushed the page 16 to 225px past a 375px screen. */
@media(max-width:760px){
  .pdp .buy{flex-wrap:wrap}
  .pdp-big,.sg-conv{grid-template-columns:minmax(0,1fr)}
  .pdp-big>*,.sg-conv>*{min-width:0}
  main{overflow-wrap:break-word}
  main a{overflow-wrap:anywhere}
}
@media(max-width:480px){.pill4{grid-template-columns:1fr}}
/* nothing that shows a person is cropped: every photo grid keeps the photo's own shape (Max, 05.11.2026) */.pcard .ph,.pgrid .pcard .ph{aspect-ratio:2/3}.stddoc{border-top:1px solid var(--line)}.stddoc:last-of-type{border-bottom:1px solid var(--line)}.stddoc summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:26px 0;align-items:center}.stddoc summary::-webkit-details-marker{display:none}.sd-t{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(24px,2.6vw,32px);grid-column:1}.sd-s{color:var(--muted);font-size:15px;grid-column:1}.stddoc summary .acc-ic{grid-column:2;grid-row:1/span 2}.sd-b .blk{padding:6px 0 18px!important}.sd-b .prose{max-width:none!important;padding:0!important}.stddoc[open] summary{padding-bottom:10px}.stddoc .acc-ic::after{content:"";position:absolute;background:var(--ink);top:0;bottom:0;left:6px;width:1.5px;transition:transform .4s var(--calm,ease)}.stddoc[open] .acc-ic::after{transform:scaleY(0)}.jc-img .jc-ph.prfull{display:block;background:none}.jc-img .jc-ph.prfull img{width:100%;height:auto;max-height:none;object-fit:initial;display:block}.pricetop{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:center}.pring{margin:0;text-align:center;position:relative}.pring svg{width:100%;max-width:260px;display:block;margin:0 auto}.pring figcaption{position:absolute;left:0;right:0;top:0;height:min(260px,100%);display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.pr-l{font-size:12px;color:var(--muted)}.pr-v{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:30px;margin-top:2px}.pr-key{list-style:none;padding:0;margin:18px auto 0;max-width:300px;text-align:left}.pr-key li{display:grid;grid-template-columns:12px 1fr auto auto;gap:10px;align-items:center;padding:7px 0;border-top:1px solid var(--line);font-size:13px}.pr-key i{width:12px;height:12px;border-radius:3px;display:block;border:1px solid var(--line)}.pr-key b{font-weight:500}.pr-key em{font-style:normal;color:var(--muted);min-width:64px;text-align:right}@media(max-width:860px){.pricetop{grid-template-columns:1fr;gap:28px}.pring{order:-1}.pring svg{max-width:210px}.pring figcaption{height:210px}}.pmt-link{position:absolute;inset:0;z-index:2}.pmt .pmo{z-index:3;pointer-events:none}.pmt .pmo a{pointer-events:auto}.pmt{cursor:pointer}.pmt:hover img{transform:scale(1.02)}.jrow.jmood{display:block;columns:3 260px;column-gap:20px}.jmood .jc{display:block;break-inside:avoid;margin:0 0 26px;border:0!important;background:none!important;box-shadow:none!important;padding:0;border-radius:0;overflow:visible}.jmood .jc-ph,.jmood .jc-ph.prfull{aspect-ratio:auto!important;background:none!important;display:block;border-radius:14px;overflow:hidden}.jmood .jc-ph img{width:100%!important;height:auto!important;max-height:none!important;object-fit:initial!important;display:block}.jmood .jc-tx{padding:12px 2px 0;display:block}.jmood .jc-tx h4{margin:4px 0 0}.jmood .rd{display:none}.jmood .jc:hover .jc-ph img{transform:scale(1.02)}@media(max-width:600px){.jrow.jmood{columns:2;column-gap:12px}.jmood .jc{margin-bottom:18px}.jmood .jc-tx h4{font-size:15px}}.campgal.two{columns:auto;display:flex;gap:16px;align-items:flex-start}.campgal.two .cgcol{flex:1;min-width:0}.campgal.two img{margin:0 0 14px}@media(max-width:600px){.campgal.two{gap:8px}.campgal.two img{margin-bottom:8px}}.ev-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.ev-act .btn{font-size:14px}.ev-join{margin:0 0 34px}.crlist{list-style:none;padding:0;margin:0}.crlist li{display:grid;grid-template-columns:200px 1fr auto;gap:16px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line)}.crlist li:last-child{border-bottom:1px solid var(--line)}.crr{color:var(--muted);font-size:14px}.crn{font-size:16px}.crh{color:var(--muted);font-size:14px;text-decoration:underline;text-underline-offset:3px}@media(max-width:620px){.crlist li{grid-template-columns:1fr;gap:2px}}.campline{font-family:var(--serif);font-weight:var(--display-weight,300);font-size:clamp(34px,5vw,64px);line-height:1.08;text-align:center;margin:0 auto;max-width:18ch}.btsgrid.mix{display:block;columns:3;column-gap:14px}.btsgrid.mix img{aspect-ratio:auto;height:auto;margin:0 0 14px;break-inside:avoid}@media(max-width:700px){.btsgrid.mix{columns:2;column-gap:8px}.btsgrid.mix img{margin-bottom:8px}}.pmt:after{background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.78))}.pmt:hover img{transform:none}.pmt .pmo{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(20px,3vw,34px);color:#fff}.pmt .pm-place{color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.45)}.pmt .pm-list li{border-color:rgba(255,255,255,.35)!important;padding:9px 0;font-size:15px}.pmt .pm-list a,.pmt .bl{color:#fff!important}.pmt .pm-note{color:rgba(255,255,255,.85)}@media(max-width:700px){.pmt img{aspect-ratio:3/4.4}}.mvtiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px}.mvtiles .kstat{min-width:0}@media(max-width:860px){.mvtiles{grid-template-columns:1fr 1fr}}@media(max-width:520px){.mvtiles{grid-template-columns:1fr}}.hero .cta .btn[data-hero-coll],.hero .cta .btn[data-hero-coll]:hover{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important;border:1px solid rgba(255,255,255,.85)!important;color:#fff!important;text-shadow:0 1px 8px rgba(0,0,0,.45)}@media(max-width:860px){.member .in{display:flex;flex-direction:column}.member .in>div:first-child{display:contents}.member .in .kick{order:0}.member .in h2{order:1}.member .in .member-support{order:2}.member .in .bens{order:3}.member .in .plans{order:4;margin-top:22px!important}}.campban picture{display:block;width:100%;height:100%}@media(max-width:700px){.campban{height:auto;aspect-ratio:4/5}.campban picture img{object-position:50% 30% !important}}@media(min-width:861px){.collband{height:auto;aspect-ratio:16/9}}@media(max-width:860px){.collband{height:auto;aspect-ratio:4/3;min-height:260px}}.pgrid.stilllife .pcard .ph,.recgrid.stilllife .pcard .ph{aspect-ratio:4/5}.ph img[src*='Gift-Card-Voucher']{object-fit:contain;background:#fff}.mood-grid{align-items:start}.mood-grid img{aspect-ratio:auto;height:auto}.mat-pics{align-items:start}.mat-pics img,.mat-pics img:first-child{aspect-ratio:auto;height:auto}.fcpic img{aspect-ratio:auto;height:auto}@media(max-width:860px){.fcpic img{aspect-ratio:2/3;height:auto}}.cspics{align-items:start}.cspics img{aspect-ratio:auto;height:auto}.evimg img{height:auto;aspect-ratio:auto;max-height:560px;width:auto;max-width:100%;margin:0 auto}.evimg{text-align:center}.sr-imgs{align-items:start}.sr-imgs img{height:auto}.bc img{aspect-ratio:16/10;height:auto;object-fit:cover}.aftgrid{align-items:start}.aft img{aspect-ratio:auto;height:auto}.article-hero[style*='16/9']{aspect-ratio:auto !important;overflow:visible;border-radius:0;text-align:center}.article-hero[style*='16/9'] img{width:auto;height:auto;max-width:100%;max-height:82vh;border-radius:var(--radius);display:inline-block;vertical-align:top}/* Repair: text left, a smaller photo right, under the text on a phone (Max, 06.11.2026) */.repintro{display:grid;grid-template-columns:minmax(0,640px) minmax(0,360px);gap:56px;align-items:start}.repintro .prose{max-width:none}.repintro figure{margin:0}.repintro img{width:100%;height:auto;border-radius:6px;display:block}@media(max-width:820px){.repintro{grid-template-columns:1fr;gap:28px}.repintro figure{max-width:420px}}.ev-logos{display:flex;align-items:center;gap:32px;flex-wrap:wrap;margin-top:18px}.ev-logos a{display:block;opacity:.9;transition:opacity .6s}.ev-logos a:hover{opacity:1}/* Repair form: the issue as pills like in the app, the photo as a HACOY button (Max, 06.11.2026) */.repairbox #r-issue{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}.rpills{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.rpill{font-family:var(--sans);font-size:14px;padding:9px 16px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer;transition:background .6s,color .6s,border-color .6s}.rpill:hover{border-color:var(--ink)}.rpill.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.rfield{margin:14px 0 0}.rfield .rlab{display:block;font-size:13px;color:var(--muted)}.rfile-in{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.rfile-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:8px}.repairbox label.rfile{display:inline-flex;margin:0;color:var(--ink);font-size:14px;cursor:pointer}.rfile-in:focus-visible+.rfile-row .rfile{outline:2px solid var(--ink);outline-offset:2px}/* Knowledge posts: a smaller photo, the text centred under the title (Max, 06.11.2026) */.article-hero.khero{max-width:760px;margin-left:auto;margin-right:auto;text-align:center;background:none}.article-hero.khero img{width:auto;max-width:100%;max-height:520px;height:auto;margin:0 auto;display:block;object-fit:contain}.article.kart{max-width:680px;margin-left:auto;margin-right:auto;text-align:center}.article.kart p{margin-left:auto;margin-right:auto}/* Partners waiting list (Max, 06.11.2026) */.pwait{max-width:620px;margin:20px 0 10px}.pwait .rpills{margin:0 0 16px}.pwait .pwrow{display:flex;gap:10px;flex-wrap:wrap}.pwait .pwrow input{flex:1 1 240px;font-family:var(--sans);font-size:15px;padding:12px 16px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink)}.pwait .nlconsent{display:block;margin-top:12px;font-size:13px;color:var(--muted)}.pwait .pwmsg{margin-top:12px;min-height:1em}/* Wholesale: two photos of the same size side by side (Max, 06.11.2026) */.repintro.two{grid-template-columns:minmax(0,520px) minmax(0,740px)}.repintro.two figure{display:grid;grid-template-columns:1fr 1fr;gap:12px}.repintro.two img{aspect-ratio:3/2;object-fit:cover}@media(max-width:820px){.repintro.two{grid-template-columns:1fr}.repintro.two figure{max-width:none}}.pwait .nlrow.pwrow{justify-content:flex-start;margin-left:0;margin-right:0;max-width:520px}.pwait .nlconsent{margin-left:0;margin-right:0;text-align:left;max-width:520px}.pwait .pwmsg{text-align:left}/* Wholesale: one bigger photo (Max, 06.11.2026) */.repintro.one{grid-template-columns:minmax(0,560px) minmax(0,480px)}@media(max-width:820px){.repintro.one{grid-template-columns:1fr}}.pwait{max-width:860px}.pwait .rpills{flex-wrap:nowrap}@media(max-width:820px){.pwait .rpills{flex-wrap:wrap}}.bm-p.bm-fee{color:var(--ink);margin:14px 0 12px}/* Showroom: two photos of one height, text left and the visit card right (Max, 06.11.2026) */.sr-imgs img{aspect-ratio:4/3;height:auto;object-fit:cover}.srvisit{display:grid;grid-template-columns:minmax(0,620px) minmax(0,400px);gap:64px;align-items:start;justify-content:space-between}.srvisit .prose{max-width:none}.srvisit h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3vw,36px);line-height:1.15;margin:0 0 18px}.srvisit .sr-note{font-size:14px;color:var(--muted);margin-top:26px}.srvisit .sr-note a,.srcard a:not(.btn){text-decoration:underline}.srcard{position:sticky;top:110px;margin:0;padding:28px}.srcard h3{font-family:var(--serif);font-weight:400;font-size:24px;margin:0 0 12px}.srcard p{margin:0 0 12px}.srcard .sr-days{color:var(--muted);font-size:14.5px}.sr-btns{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 16px}.srcard .sr-ev{font-size:14px;color:var(--muted);margin:0}@media(max-width:860px){.srvisit{grid-template-columns:1fr;gap:28px}.srcard{position:static}}.article.kart ul,.article.kart ol{display:inline-block;text-align:left;margin-left:auto;margin-right:auto}.article.kart .ainote{text-align:center}/* Journal: a wider centred column on big screens (Max, 06.11.2026) */.article.kart.jwide{max-width:min(900px,100%)}@media(min-width:1500px){.article.kart.jwide{max-width:980px}}.article.kart.jwide p,.article.kart.jwide h2,.article.kart.jwide h3{max-width:none}/* Calm, breathing: a row of buttons never sits tight under text, on every page (Max, 06.11.2026) */:is(p,ul,ol,h2,h3,h4,blockquote,.lcard)+:is(p,div):has(>:is(a,button).btn:first-child){margin-top:28px!important}/* Calm page changes: a slow cross fade between pages, like the photos (Max, 06.11.2026) */@view-transition{navigation:auto}::view-transition-old(root),::view-transition-new(root){animation-duration:.6s;animation-timing-function:cubic-bezier(.4,0,.2,1)}@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}@media(max-width:820px){.sr-imgs img{aspect-ratio:4/5}}/* Behind the campaign: one role, all its people (Max, 06.11.2026) */.crlist li{grid-template-columns:200px 1fr}.crppl{display:grid;gap:8px}.crp{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px}@media(max-width:700px){.crlist li{grid-template-columns:1fr;gap:6px}.crp{flex-direction:column;align-items:flex-start;gap:2px}.crppl{gap:12px}}/* Calm loading: photos fade in as they arrive (Max, 06.11.2026) */main img{transition:opacity .6s cubic-bezier(.4,0,.2,1)}main img.ld{opacity:0}@media(prefers-reduced-motion:reduce){main img{transition:none}}/* Who we are: five photos without an empty corner, three above and two wider below (Max, 06.11.2026) */.btsgrid.mix{display:grid;columns:auto;grid-template-columns:repeat(6,1fr);gap:14px}.btsgrid.mix img{margin:0;aspect-ratio:3/2;object-fit:cover;grid-column:span 2}.btsgrid.mix img:nth-child(n+4){grid-column:span 3}@media(max-width:700px){.btsgrid.mix{grid-template-columns:1fr 1fr;gap:8px}.btsgrid.mix img,.btsgrid.mix img:nth-child(n+4){grid-column:span 1}.btsgrid.mix img:nth-child(5){grid-column:span 2}}/* App page: every tile one shape again, as it was (Max, 06.11.2026) */.aftgrid{align-items:stretch}.aftgrid .aft img{aspect-ratio:4/5;height:auto;object-fit:cover}/* home hero on phone and iPad (Max, 06.11.2026): 100vh counts the space under the Safari toolbar, so text and buttons sat below the fold; the small viewport height keeps them in view on landing */body.has-hero .hero{min-height:100vh;min-height:100svh}body.has-hero .announce{display:block!important;position:relative;z-index:60}body.has-hero .hero{min-height:calc(100vh - var(--annh,0px));min-height:calc(100svh - var(--annh,0px))}@media(max-width:1366px) and (hover:none){body.has-hero .hero .htxt{padding-bottom:calc(48px + env(safe-area-inset-bottom))}body.has-hero .hero .cta{margin-top:20px}}.pdp .sz2{width:46px;height:46px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;font:500 14px var(--sans);color:var(--ink);background:transparent;padding:0;cursor:pointer;transition:background-color .6s var(--calm),border-color .6s var(--calm),color .6s var(--calm)}.pdp .sz2:hover{border-color:var(--ink)}.pdp .sz2.sel{background:var(--ink);color:var(--paper);border-color:var(--ink);font-weight:600}.pdp .sz2.soldout{opacity:.35;text-decoration:line-through;cursor:default}.pdp [data-two] .sizes{margin:12px 0 4px}