/* Time Objects
   Type: Cormorant Garamond for display, EB Garamond for reading text, Roobert for Latin UI/labels.
   Japanese pairs them with Shippori Mincho and Gen Interface JP (gothic).
   Layout: header over a dark hero, then a 1200px column of white image panels on warm paper. */
@import url('fonts.css');
:root{
  --bg:#F7F5F0; --bg2:#EFEBE3; --panel:#FFFFFF; --ink:#06050A; --sub:#5A554E; --mute:#6F6A62; --line:#D6D0C6; --acc:#7A5C32; --err:#9B2C2C; --dark:#0B0B0C;
  --disp:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --text:'EB Garamond',Georgia,'Times New Roman',serif;
  --body:'Roobert',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --ease:cubic-bezier(.165,.84,.44,1); --ease-io:cubic-bezier(.77,0,.175,1);
  --t-ui:12.5px; --t-label:12px; --track:.1em; --t-body:16px; --t-text:clamp(18px,1.3vw,19px); --t-small:14px;
  --t-card:24px; --t-quote:clamp(24px,2.4vw,32px); --t-state:clamp(19px,1.8vw,24px);
  --t-h3:clamp(36px,4.2vw,54px); --t-h2:clamp(46px,6vw,78px); --t-hero:clamp(64px,9vw,136px); --t-sub:clamp(19px,1.8vw,24px);
  --gut:max(clamp(20px,5vw,64px),env(safe-area-inset-left,0px)); --gutr:max(clamp(20px,5vw,64px),env(safe-area-inset-right,0px));
}
.site.ja{
  --disp:'Cormorant Garamond','Shippori Mincho','Hiragino Mincho ProN','Yu Mincho',serif;
  --text:'EB Garamond','Shippori Mincho','Hiragino Mincho ProN','Yu Mincho',serif;
  --body:'Roobert','Gen Interface JP Display','Noto Sans JP','Hiragino Kaku Gothic ProN','Hiragino Sans','Yu Gothic',Meiryo,sans-serif;
  --t-text:17px; --t-card:21px; --t-quote:clamp(22px,2vw,28px); --t-state:clamp(18px,1.5vw,21px);
  --t-h3:clamp(30px,3.2vw,44px); --t-h2:clamp(34px,4.6vw,60px);
}
[hidden]{display:none!important}
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:light;scroll-padding-top:100px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html.menu-open{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--text);font-size:var(--t-body);line-height:1.6;font-synthesis:none;font-variant-numeric:lining-nums;-webkit-text-size-adjust:100%}
.site{font-family:var(--text);background:var(--bg);position:relative;overflow-x:clip;min-height:100vh}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:1px solid var(--acc);outline-offset:4px}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ink);color:var(--bg);padding:12px 18px}
.skip:focus{left:max(16px,env(safe-area-inset-left,0px))}
.wrap{max-width:1200px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gutr)}

/* Japanese setting: proportional kana in display type, strict line breaking, phrase-aware breaks in short text */
.site.ja{line-break:strict;text-spacing-trim:trim-start}
.site.ja :is(.disp,.cardt,blockquote,.paradox p,.dnav a){font-feature-settings:"palt" 1}
.site.ja :is(.disp,.cardt,.tech h3){word-break:keep-all;overflow-wrap:anywhere}
@supports (word-break:auto-phrase){.site.ja :is(.disp,.cardt,blockquote,.paradox p,.body,.small,.chk span,.store p,.tech dd,.keyspec dd,.hero .sub,.err,.status,.dcopy){word-break:auto-phrase;overflow-wrap:normal}}
.body{text-wrap:pretty}
.site:not(.ja) .body{line-height:1.62}.pdinfo p.body{line-height:1.45}

/* type */
.disp{font-family:var(--disp);font-weight:500;line-height:1.08;margin:0;text-wrap:balance}
.site.ja .disp{line-height:1.25;letter-spacing:.02em}
.body{font-size:var(--t-text);line-height:1.85;color:var(--sub);margin:0;max-width:38em}
.site.ja .body{line-height:1.95;letter-spacing:.02em}
.small,.ref{font-family:var(--body);font-size:var(--t-small);color:var(--sub);line-height:1.5}
.eb{font-size:var(--t-small);color:var(--sub);margin:0;display:block}
.cardt{font-family:var(--disp);font-weight:500;font-size:var(--t-card);margin:0;line-height:1.3;color:var(--ink)}
.site.ja .cardt{line-height:1.45;letter-spacing:.03em}
.ref-code{white-space:nowrap}.prod .small .ref-code:last-child{white-space:normal;text-wrap:balance}.nw{white-space:nowrap}

/* links and buttons */
.lk,.btn.ghost{font:inherit;font-family:var(--body);font-size:var(--t-ui);font-weight:500;letter-spacing:var(--track);text-transform:uppercase;color:var(--ink);background:none;border:0;padding:0;min-height:44px;display:inline-flex;align-items:center;cursor:pointer;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.4em;transition:opacity .3s var(--ease)}
.lk:hover,.btn.ghost:hover{opacity:.6}
.btn{font:inherit;font-family:var(--body);font-size:13px;font-weight:500;letter-spacing:var(--track);text-transform:uppercase;padding:0 30px;min-height:52px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid var(--ink);background:var(--ink);color:var(--bg);text-decoration:none;transition:background-color .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease)}
.btn:not(.ghost):hover{background:var(--acc);border-color:var(--acc);color:#fff}
.lit{background:var(--panel);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.lit img.obj{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.lit img.obj.fill{width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.stack{display:flex;flex-direction:column;gap:32px}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:50;background:var(--bg);border-bottom:1px solid var(--line);transition:background-color .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px var(--gutr) 14px var(--gut);padding-top:calc(14px + env(safe-area-inset-top,0px));font-family:var(--body);font-size:var(--t-ui);font-weight:500;letter-spacing:var(--track);text-transform:uppercase;color:var(--ink)}
.top .l{display:flex;gap:28px;align-items:center}
.top .r{display:flex;gap:28px;justify-content:flex-end;align-items:center}
.top a.nv,.lang a{color:inherit;text-decoration:none;min-height:44px;display:inline-flex;align-items:center;text-underline-offset:.4em;text-decoration-thickness:1px}
.top a.nv:hover,.lang a:hover{text-decoration-line:underline}
.top a.nv[aria-current="page"],.lang a[aria-current="true"]{text-decoration-line:underline}
.lang{display:flex;gap:2px;align-items:center;color:inherit}.lang a{padding:0 6px}.lang span{opacity:.5}
.lang a:not([aria-current]){opacity:.6}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;min-height:44px}
.brand img{width:30px;height:auto}
.brand .bt{display:flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--disp);font-weight:500;text-transform:uppercase;line-height:1;white-space:nowrap}
.brand .b1{font-size:16px;letter-spacing:.22em}.brand .b2{font-size:9.5px;letter-spacing:.42em;margin-right:-.42em;opacity:.78}
.top.onhero:not(.solid){color:#FFFFFF;background:transparent;border-bottom-color:transparent}
.top.onhero:not(.solid) .brand img{filter:invert(1)}
.top.onhero:not(.solid) :focus-visible,.hero :focus-visible{outline-color:#FFFFFF}
.burger{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;background:none;border:0;cursor:pointer;display:none;align-items:center;gap:14px;min-height:44px;padding:0}
.burger .bars{display:flex;flex-direction:column;gap:6px;width:24px}
.burger i{height:1px;background:currentColor;display:block;transition:transform .5s var(--ease)}
.burger:hover i:last-child{transform:translateX(6px)}

/* menu: panel slides in from the left over a dimmed page, links rise in one after another */
.drawer{position:fixed;inset:0;z-index:80}
.dscrim{position:absolute;inset:0;background:#000;opacity:0;transition:opacity .4s var(--ease-io)}
.drawer.open .dscrim{opacity:.45}
.drawer .panel{position:absolute;inset:0 auto 0 0;width:min(90%,620px);display:flex;flex-direction:column;overflow-y:auto;color:#FFFFFF;
  background:linear-gradient(217deg,#000 -26%,#121213);
  padding:calc(env(safe-area-inset-top,0px) + 22px) 40px calc(env(safe-area-inset-bottom,0px) + 32px) max(var(--gut),40px);
  transform:translateX(-100%);transition:transform .5s var(--ease)}
.drawer.open .panel{transform:none}
.drawer .x{align-self:flex-start;flex:none;width:48px;height:48px;border-radius:50%;border:0;background:#FFFFFF;cursor:pointer;position:relative;transition:transform .5s var(--ease)}
.drawer .x::before,.drawer .x::after{content:"";position:absolute;left:50%;top:50%;width:18px;height:1px;background:var(--ink);transform:translate(-50%,-50%) rotate(45deg)}
.drawer .x::after{transform:translate(-50%,-50%) rotate(-45deg)}
.drawer .x:hover{transform:rotate(90deg)}
.drawer .x:focus-visible{outline-color:#FFFFFF}
.dnav{margin:auto 0;padding-block:48px}
.dnav ul,.dsub ul{list-style:none;margin:0;padding:0}
.dnav a{display:inline-block;font-family:var(--disp);font-weight:500;font-size:clamp(36px,5.6vh,60px);line-height:1.2;color:#FFFFFF;text-decoration:none;transition:color .5s var(--ease-io)}
.site.ja .dnav a{font-size:clamp(30px,4.6vh,48px);line-height:1.5;letter-spacing:.06em}
.dnav ul:hover a:not(:hover),.dnav ul:focus-within a:not(:focus){color:rgba(255,255,255,.45)}
.dnav a[aria-current="page"]{font-style:italic}
.site.ja .dnav a[aria-current="page"]{margin-right:-.06em;font-style:normal;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
.dsub{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;border-top:1px solid rgba(255,255,255,.22);padding-top:24px}
.dsub li a,.drawer .lang a{font-family:var(--body);font-size:var(--t-ui);font-weight:500;letter-spacing:var(--track);text-transform:uppercase;color:#FFFFFF;min-height:40px;display:inline-flex;align-items:center;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.4em}
.drawer .lang a{text-decoration-line:none}.drawer .lang a[aria-current]{text-decoration-line:underline}
.dcopy{margin:28px 0 0;font-family:var(--body);font-size:12px;color:rgba(255,255,255,.55)}
.drawer :focus-visible{outline-color:#FFFFFF}
@media (prefers-reduced-motion:no-preference){
  .dnav li,.dsub,.dcopy{opacity:0;transform:translateY(2rem);transition:opacity 1s var(--ease),transform 1s var(--ease)}
  .drawer.open .dnav li,.drawer.open .dsub,.drawer.open .dcopy{opacity:1;transform:none}
  .drawer.open .dnav li:nth-child(1){transition-delay:.2s}.drawer.open .dnav li:nth-child(2){transition-delay:.27s}
  .drawer.open .dnav li:nth-child(3){transition-delay:.34s}.drawer.open .dnav li:nth-child(4){transition-delay:.41s}
  .drawer.open .dnav li:nth-child(5){transition-delay:.48s}.drawer.open .dsub{transition-delay:.58s}.drawer.open .dcopy{transition-delay:.64s}
  .drawer.closing .dnav li,.drawer.closing .dsub,.drawer.closing .dcopy{opacity:0;transform:none;transition:opacity .3s var(--ease-io)}
}

/* views */
.view{padding-top:calc(76px + env(safe-area-inset-top,0px))}
.pagehead{padding-block:80px 48px;display:flex;flex-direction:column;gap:22px;border-bottom:1px solid var(--line)}
.pagehead h1{font-size:var(--t-h2)}
.sec{padding-block:96px}.sec+.sec{border-top:1px solid var(--line)}
.home .sec+.sec{border-top:0;background:linear-gradient(var(--line),var(--line)) no-repeat top center/calc(min(100%,1200px) - var(--gut) - var(--gutr)) 1px}
.sectitle{font-size:var(--t-h3)}
.pd~.sec .sectitle{font-size:clamp(30px,3vw,40px)}.site.ja .pd~.sec .sectitle{font-size:clamp(24px,2.4vw,30px)}
.homesec .wrap{display:flex;flex-direction:column;gap:48px;align-items:stretch}.homesec .wrap>div:last-child:not(.two){align-self:flex-start}
.pd~.sec .grid{grid-template-columns:repeat(4,minmax(0,1fr))}.site:not(.ja) :is(.homesec,.pd~.sec) .prod .cardt{font-size:clamp(18px,1.9vw,24px)}.site.ja :is(.homesec,.pd~.sec) .prod .cardt{font-size:clamp(16px,1.75vw,21px)}

/* hero */
.hero{position:relative;min-height:clamp(600px,57vw,820px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:end;padding-top:72px;
  background:radial-gradient(ellipse 70% 85% at 74% 48%,#4E4A43 0%,#2C2A26 36%,#141414 64%,var(--dark) 86%);color:#FFFFFF}
.hero .bgshot{grid-column:2;grid-row:1;display:flex;justify-content:flex-end}
/* cut-out photo with a transparent background; the strap is cut at the photo's bottom edge, so fade it out */
.hero .bgshot img{width:100%;max-width:880px;height:auto;-webkit-mask-image:linear-gradient(to bottom,#000 92%,transparent);mask-image:linear-gradient(to bottom,#000 92%,transparent)}
.hero .scrim{display:none}
.hero .copy{grid-column:1;grid-row:1;padding-block:0 96px;width:100%;display:flex;flex-direction:column;gap:22px}
.hero h1{font-size:var(--t-hero);line-height:.96;color:#FFFFFF;margin-left:-.045em}
.site.ja .hero h1{line-height:.96;letter-spacing:0}
.hero .sub{font-family:var(--disp);font-weight:500;font-style:italic;font-size:var(--t-sub);line-height:1.35;margin:0;max-width:22em;text-wrap:balance;color:rgba(255,255,255,.86)}
.btns{display:flex;gap:28px;align-items:center;flex-wrap:wrap;padding-top:10px}
.hero .btn:not(.ghost){background:#FFFFFF;color:var(--dark);border-color:#FFFFFF}.hero .btn:not(.ghost):hover{background:#E9E1D2;border-color:#E9E1D2;color:var(--dark)}
.hero .btn.ghost{color:#FFFFFF}

/* statement */
.paradox{background:var(--bg2);padding-block:128px}
.paradox .wrap{display:flex;flex-direction:column;align-items:center}
.paradox p{font-family:var(--text);font-weight:400;font-size:var(--t-state);line-height:2;letter-spacing:.02em;margin:0;max-width:40em;color:var(--ink);text-align:center;text-wrap:balance}
.paradox p+p{margin-top:1.1em}
.paradox .ptitle{font-size:var(--t-h3);text-align:center;margin:0 0 12px}.paradox .psub{font-family:var(--disp);font-size:var(--t-card);margin:0 0 8px!important}
.paradox .ptitle+p:not(.psub),.paradox .psub+p{margin-top:40px}
.jsub{font-size:.82em;letter-spacing:0;display:inline-block}.feat h2 .jsub{display:block;margin-top:2px;margin-left:-.5em}
.prod .cardt .m{display:block}
.paradox .ln{display:block;text-wrap:balance}
.pagehead .onefive{margin-top:6px;font-size:var(--t-card)}
.site.ja .paradox p{line-height:1.9;letter-spacing:.08em}.site.ja .paradox p+p{margin-top:1.1em}

/* home */
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.feature .lit{aspect-ratio:4/3}
.copyb{display:flex;flex-direction:column;gap:24px}
.cardt.h{display:block}

/* artist */
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:start}.two>*{min-width:0}
.portrait{width:100%;height:auto}
blockquote{margin:0;font-family:var(--disp);font-weight:500;font-style:italic;font-size:var(--t-quote);line-height:1.5;color:var(--ink);text-wrap:pretty}
.site.ja blockquote{font-style:normal;line-height:1.75;letter-spacing:.04em}
blockquote+.eb{font-size:var(--t-text);line-height:1.62;color:var(--sub)}.site.ja blockquote+.eb{line-height:1.95;letter-spacing:.02em}
.strip{display:grid;grid-template-columns:326fr 448fr 366fr;gap:16px}
.strip img{min-width:0;width:100%;height:clamp(300px,32vw,420px);object-fit:cover}

/* collection */
.tabs{display:flex;gap:4px 28px;flex-wrap:wrap}
.tabs button{font:inherit;font-family:var(--body);font-size:var(--t-ui);font-weight:500;letter-spacing:var(--track);text-transform:uppercase;background:none;border:0;color:var(--mute);cursor:pointer;padding:0;min-height:44px;
  text-decoration-line:none;text-decoration-thickness:1px;text-underline-offset:.4em;transition:color .3s var(--ease)}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-pressed="true"]{color:var(--ink);text-decoration-line:underline}
.tabs{padding:0 0 28px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 28px}
.prod{color:var(--ink);text-decoration:none;display:flex;flex-direction:column;gap:16px;min-width:0}.grid>*{min-width:0}
.site.ja :is(.prod .cardt,.pdinfo h1){overflow-wrap:normal}
@supports (grid-template-rows:subgrid){.grid{grid-auto-rows:auto}.prod{display:grid;grid-template-columns:minmax(0,1fr);grid-row:span 3;grid-template-rows:subgrid;row-gap:14px;align-content:start}.prod .small{margin-top:0}}
.prod .lit{aspect-ratio:1/1}.prod .lit img.obj{transition:transform .8s var(--ease)}
.prod:hover .lit img.obj{transform:scale(1.035)}
.prod .small{display:flex;flex-direction:column;gap:2px;margin-top:-6px}.prod .small .sep{display:none}

/* product */
.crumb{font-family:var(--body);display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:var(--t-small);color:var(--sub);padding-top:32px}
.crumb a{color:var(--sub);text-underline-offset:.4em;text-decoration-thickness:1px;display:inline-flex;min-height:44px;align-items:center}
.pd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:start;padding-block:12px 24px}.pd>*{min-width:0}
.pd .main{aspect-ratio:1/1}.pd .main img.obj{width:100%;height:100%}
.gnav{font-family:var(--body);display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.gb{width:44px;height:44px;border:1px solid var(--line);background:transparent;color:var(--ink);font:18px var(--body);cursor:pointer;transition:border-color .3s var(--ease)}
.gb:hover{border-color:var(--ink)}
.thumbs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:10px}
.thumbs button{aspect-ratio:1/1;border:1px solid var(--line);padding:0;cursor:pointer;overflow:hidden;min-height:44px;transition:border-color .3s var(--ease)}
.thumbs button:hover{border-color:var(--mute)}
.thumbs button[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.thumbs button img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.pdinfo{display:flex;flex-direction:column;gap:20px;position:sticky;top:120px;min-width:0}
.pdinfo{container-type:inline-size}.pdinfo h1{font-size:clamp(22px,9.2cqi,50px)}.pdinfo h1 .m{display:block;white-space:nowrap}
.site.ja .pdinfo h1{font-size:clamp(19px,6.4cqi,34px);line-height:1.3}
.pdinfo .ref{color:var(--ink)}
.pdinfo .row+.small,.pdinfo .small{text-wrap:pretty}
.pdinfo .row{display:flex;gap:28px;align-items:center;flex-wrap:wrap;padding-top:8px}
.keyspec{display:grid;grid-template-columns:8.5em minmax(0,1fr);align-items:baseline;gap:10px 28px;border-top:1px solid var(--line);padding-top:20px;margin:0}
.keyspec dt{font-family:var(--body);font-size:var(--t-body);color:var(--mute)}
.keyspec dd{font-family:var(--body);margin:0;font-size:var(--t-body);color:var(--ink)}
.feat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 72px}
.feat article{display:flex;flex-direction:column;gap:18px}
.feat h2{font-family:var(--disp);font-weight:500;font-size:var(--t-card);line-height:1.3;margin:8px 0 0;color:var(--ink)}
.pics{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:12px}
.pics img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:var(--panel)}
.tech{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:0 48px}
.tech h3{font-family:var(--disp);font-weight:500;font-size:var(--t-card);line-height:1.3;margin:0;padding:14px 0;color:var(--ink);border-top:1px solid var(--ink)}
.tech dl{margin:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);border-top:1px solid var(--ink)}
.tech h3:not(:first-child),.tech h3:not(:first-child)+dl{margin-top:48px}
.tech dt,.tech dd{margin:0;padding:13px 0;font-family:var(--body);font-size:var(--t-body);line-height:1.55;border-bottom:1px solid var(--line)}
.sec:has(.tech)+.sec{border-top:0}
.tech dt{color:var(--mute)}.tech dd{color:var(--ink);padding-left:16px}

/* partners */
.regions{display:flex;flex-direction:column}
.region{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:24px 48px;padding-block:56px;border-top:1px solid var(--line)}
.region:first-child{border-top:0;padding-top:0}.region:last-child{padding-bottom:0}
.regionh{font-size:clamp(34px,3.4vw,48px)}.site.ja .regionh{font-size:clamp(30px,3.6vw,40px)}
.stores{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 28px}
.store{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.store .cardt{margin-bottom:12px;font-size:clamp(19px,2.6vw,24px)}
.store p{margin:0;font-size:var(--t-text);line-height:1.65;color:var(--sub)}
.store .lk{margin-top:auto;padding-top:10px}
.direct{display:flex;flex-direction:column;gap:6px;align-items:flex-start}

/* news */

/* forms */
form{display:flex;flex-direction:column;gap:26px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:28px}.row2>*{min-width:0}
.field{display:flex;flex-direction:column;gap:2px;min-width:0}
.field>label{display:block;font-family:var(--body);font-size:var(--t-label);letter-spacing:var(--track);text-transform:uppercase;color:var(--mute)}
input[type=text],input[type=email],input[type=date],select,textarea{font:inherit;font-family:var(--body);font-size:var(--t-body);color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--mute);
  padding:10px 0;border-radius:0;min-height:46px;width:100%;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
select{-webkit-appearance:none;appearance:none;padding-right:28px;cursor:pointer;background:transparent url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2712%27 height=%278%27 viewBox=%270 0 12 8%27%3E%3Cpath d=%27M1 1.5l5 5 5-5%27 fill=%27none%27 stroke=%27%2306050A%27 stroke-width=%271.2%27/%3E%3C/svg%3E") no-repeat right 4px center}
select option{background:var(--bg)}
input[type=date]::-webkit-calendar-picker-indicator{opacity:0;cursor:pointer}
input[type=date]:not(.has-value){color:var(--mute)}
input[type=date],select{height:47px}input[type=date]::-webkit-datetime-edit{padding:0}
input[type=date]{background:transparent url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2712%27 height=%278%27 viewBox=%270 0 12 8%27%3E%3Cpath d=%27M1 1.5l5 5 5-5%27 fill=%27none%27 stroke=%27%2306050A%27 stroke-width=%271.2%27/%3E%3C/svg%3E") no-repeat right 4px center}
::placeholder{color:var(--mute);opacity:1}
textarea{min-height:132px;resize:none;line-height:1.6}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;border-bottom-color:var(--ink);box-shadow:0 1px 0 var(--ink)}
.chk input:focus-visible{outline:1px solid var(--acc);outline-offset:3px;box-shadow:none}
[aria-invalid="true"]{border-color:var(--err)!important}[aria-invalid="true"]:focus-visible{box-shadow:0 1px 0 var(--err)}
.err{font-family:var(--body);color:var(--err);font-size:var(--t-small);margin:6px 0 0}
.chk,.field>label.chk{font-family:var(--body);letter-spacing:0;text-transform:none;display:flex;gap:12px;align-items:flex-start;font-size:var(--t-small);line-height:1.6;color:var(--sub);cursor:pointer;padding:0}
@media (pointer:coarse){.chk{min-height:44px}}
.chk span{flex:1;min-width:0;text-wrap:pretty}.chk a{color:var(--ink);white-space:nowrap;text-underline-offset:.3em;text-decoration-thickness:1px}
.chk input{-webkit-appearance:none;appearance:none;width:18px;height:18px;margin:2px 0 0;flex:none;border:1px solid var(--sub);border-radius:0;background:transparent;cursor:pointer;transition:background-color .2s var(--ease),border-color .2s var(--ease)}
.chk input:checked{background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2710%27 height=%278%27 viewBox=%270 0 10 8%27%3E%3Cpath d=%27M1 4l2.8 2.8L9 1%27 fill=%27none%27 stroke=%27%23F7F5F0%27 stroke-width=%271.3%27/%3E%3C/svg%3E") no-repeat center;border-color:var(--ink)}
.chk input[aria-invalid="true"]{border-color:var(--err)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.status{font-family:var(--body);margin:0;font-size:var(--t-body);color:var(--ink);line-height:1.7}
.status:empty{display:none}
form.done>*:not(.status){display:none}
form.done .status{font-family:var(--disp);font-weight:500;font-size:var(--t-card);line-height:1.3;padding-block:8px}
.desk,.notice{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--ink);padding-top:16px}
.desk .body,.notice .body{font-size:var(--t-body)}

/* footer */
.foot{position:relative;padding-block:56px 36px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px 72px;align-items:start}
.foot::before{content:"";position:absolute;top:0;left:var(--gut);right:var(--gutr);border-top:1px solid var(--line)}
.foot .nlh{font-size:var(--t-card);margin:0 0 4px;text-transform:none}
.foot .col{display:flex;flex-direction:column;gap:20px;min-width:0}
.foot nav{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0 28px;margin-top:-8px}
.foot nav a{white-space:nowrap}
.foot nav a,.sns span{color:var(--ink);text-decoration:none;font-family:var(--body);font-size:var(--t-ui);font-weight:500;letter-spacing:var(--track);text-transform:uppercase;min-height:40px;display:inline-flex;align-items:center;text-underline-offset:.4em;text-decoration-thickness:1px}
.foot nav a:hover{text-decoration-line:underline}
.sns span{color:var(--sub);font-weight:400}
.nl{display:flex;flex-direction:column;gap:16px;align-items:stretch}
.nl .nlbtn{display:flex;justify-content:flex-start}
.bottomline{font-family:var(--body);grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 24px;border-top:1px solid var(--line);padding-top:24px}
.bottomline .small{font-size:12px;color:var(--mute)}
.bottomline a{color:var(--sub);text-underline-offset:.4em;text-decoration-thickness:1px}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* the English left nav (News · Collection · Takashi Murakami · Partners) needs about 1360px beside the centred brand */
@media (max-width:1359px){.site:not(.ja) .top .l a.nv,.site:not(.ja) .top .r a.nv{display:none}.site:not(.ja) .burger{display:inline-flex}}
@media (max-width:1040px){.region{grid-template-columns:1fr;gap:24px}.foot nav{grid-template-columns:repeat(2,auto)}.top .l a.nv,.top .r a.nv{display:none}.burger{display:inline-flex}}
@media (max-width:860px){
  .two,.feat,.feature,.pd,.tech,.foot{grid-template-columns:1fr}
  .grid,.homesec .grid,.pd~.sec .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.region{grid-template-columns:1fr;padding-block:44px}.row2{grid-template-columns:1fr}
  .pdinfo{position:static}.desk,.notice{order:-1}.two>.notice{border-top:0;padding-top:0}.two>.desk{margin-bottom:8px}
  .hero{min-height:0;grid-template-columns:1fr;align-items:start;padding-top:64px}.hero .bgshot{grid-column:1;grid-row:1;justify-content:center;padding-top:12px}
  .hero .bgshot img{transform:translateX(6.3%)}
  .hero{background:radial-gradient(ellipse 85% 55% at 50% 30%,#4E4A43 0%,#2C2A26 36%,#141414 64%,var(--dark) 90%)}
  .hero .copy{grid-column:1;grid-row:2;padding-block:4px 64px}
  .sec{padding-block:72px}.paradox{padding-block:88px}
  .tech h3{border-top:1px solid var(--ink)}.tech h3+dl{border-top:0}.tech h3:not(:first-child)+dl{margin-top:0}
}
/* phones */
@media (max-width:600px){
  :root{--t-text:16px;--t-card:20px;--t-quote:21px;--t-state:17px;--t-h2:40px;--t-h3:30px;--t-sub:17px}
  .site.ja{--t-text:16px;--t-card:18px;--t-quote:20px;--t-state:16px;--t-h2:32px;--t-h3:26px}
  .top .r{gap:4px}.brand img{width:26px}.brand .b1{font-size:13.5px;letter-spacing:.12em}.brand .b2{font-size:8.5px;letter-spacing:.34em;margin-right:-.34em}.burger .mlabel{display:none}
  .sec{padding-block:60px}.pagehead{padding-block:52px 32px}.paradox{padding-block:72px}
  .btn{min-height:50px;padding:0 24px}
  .paradox p{line-height:1.55}.paradox p+p{margin-top:.9em}.site.ja .paradox p{line-height:1.8}.site.ja .paradox p+p{margin-top:.9em}
  .grid,.homesec .grid{gap:36px 14px}.prod{gap:12px}
  .prod .cardt{font-size:17px}.site.ja .prod .cardt{font-size:15px}.prod .small{font-size:12.5px}
  .stores{grid-template-columns:1fr;gap:32px}
  .pd~.sec .grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);margin-inline:calc(-1 * var(--gut)) calc(-1 * var(--gutr));padding-inline:var(--gut) var(--gutr);gap:14px;scrollbar-width:none}
  .pd~.sec .grid::-webkit-scrollbar{display:none}.pd~.sec .grid .prod{flex:0 0 62%;display:flex;scroll-snap-align:start}
  .keyspec dd{font-size:15px}
  .tech dl{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.tech dt,.tech dd{font-size:15px;padding:11px 0}.tech dd{padding-left:12px}
  .strip{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);margin-inline:calc(-1 * var(--gut)) calc(-1 * var(--gutr));padding-inline:var(--gut) var(--gutr);gap:12px;scrollbar-width:none;align-items:stretch}
  .strip::-webkit-scrollbar{display:none}
  .strip{display:flex}.strip img{flex:0 0 78%!important;height:auto;aspect-ratio:4/5;width:78%;object-fit:cover;scroll-snap-align:start}
  .crumb{flex-wrap:nowrap;white-space:nowrap}.crumb [aria-current]{min-width:0;overflow:hidden;text-overflow:ellipsis}.crumb a{flex:none}
  .hero .bgshot{padding-inline:var(--gut)}
  .foot{padding-block:44px 32px}.foot nav{grid-template-columns:repeat(2,auto);gap:0 22px}
  .bottomline{flex-direction:column;align-items:flex-start}.bottomline .arr{display:block}
  .drawer .panel{width:100%;padding-left:var(--gut);padding-right:var(--gutr)}.drawer .lang a:last-child{padding-right:0}.dnav a{font-size:clamp(30px,9.5vw,40px);white-space:nowrap}.site.ja .dnav a{font-size:clamp(26px,7.6vw,34px)}.dnav{padding-block:36px}
}
/* phones: the wordmark alone, so it stays clear of the menu button and the language switch */
@media (max-width:479px){.brand img{display:none}.brand .b1{font-size:13px;letter-spacing:.1em}.brand .b2{font-size:8px;letter-spacing:.28em;margin-right:-.28em}}
@media (max-width:340px){.brand .b1{font-size:11.5px;letter-spacing:.04em}}
@media (max-width:400px){.site.ja :is(.homesec,.pd~.sec,.view) .prod .cardt{font-size:14px;letter-spacing:.01em}}
@media (max-width:359px){.grid,.homesec .grid{grid-template-columns:1fr}}
.site.ja .keyspec{grid-template-columns:9.6em minmax(0,1fr)}
@media (min-width:861px) and (max-width:905px){.pdinfo .ref .sep{display:none}.pdinfo .ref>.nw{display:block}}
@media (max-width:600px){.keyspec{grid-template-columns:7.6em minmax(0,1fr);column-gap:16px}.site.ja .keyspec{grid-template-columns:9em minmax(0,1fr)}.site.ja .keyspec dt{font-size:14px}
  .pdinfo .ref .sep{display:none}.pdinfo .ref>.nw{display:block}}
@media (max-width:600px){.pd~.sec .prod .cardt{min-height:3.9em}.site.ja .pd~.sec .prod .cardt{min-height:4.35em}}
.tech dd,.keyspec dd{text-wrap:balance}
@media (max-width:400px){.site.ja .keyspec{grid-template-columns:minmax(0,1fr);row-gap:0}.site.ja .keyspec dd{margin-bottom:10px}
  .site.ja .tech dl{grid-template-columns:minmax(0,1fr)}.site.ja .tech dt{border-bottom:0;padding-bottom:0;font-size:13px}.site.ja .tech dd{padding-left:0;padding-top:2px}}
.sns{gap:clamp(14px,5.2vw,22px)!important}
@media (min-width:1041px){.site.ja .regionh{font-size:clamp(28px,2.2vw,32px)}.site.ja .store .cardt{font-size:21px}}
/* Japanese opening brackets that start a line: pull the empty half of the full-width glyph into the margin */
.site.ja blockquote{text-indent:-.5em}
@media (max-width:600px){.site.ja .onefive .jsub{display:block;margin-left:-.5em}}
.strip img[src*="scope"]{object-position:50% 15%}
/* home: news as a compact text list; older items stay hidden until the button below the list shows them (site.js) */
.homesec .wrap>div.hnwrap:last-child{align-self:stretch}
.home #news+.sec{background:none}  /* the news list already ends on a rule */
.hnews{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.hn{display:grid;grid-template-columns:10em minmax(0,1fr);gap:6px 40px;padding:22px 0;border-bottom:1px solid var(--line)}
.hn time{color:var(--mute);padding-top:.3em}
.site:not(.ja) .hn .cardt{font-size:clamp(19px,1.6vw,21px)}.site.ja .hn .cardt{font-size:clamp(16px,1.4vw,18px)}
.hn p{margin:6px 0 0;font-size:16px;line-height:1.75;color:var(--sub);max-width:42em;text-wrap:pretty}.site.ja .hn p{font-size:15px;line-height:1.9;letter-spacing:.02em}
.nmore{font:inherit;font-family:var(--body);font-size:var(--t-ui);font-weight:500;letter-spacing:var(--track);text-transform:uppercase;color:var(--ink);background:none;border:0;padding:0;cursor:pointer;display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-top:14px;text-underline-offset:.4em;text-decoration-thickness:1px}
.nmore::after{content:"";width:8px;height:8px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-3px) rotate(45deg);transition:transform .3s var(--ease)}
.nmore[aria-expanded="true"]::after{transform:translateY(2px) rotate(-135deg)}
.nmore:hover{text-decoration-line:underline}
.hn[hidden]{display:none}
@media (max-width:600px){
  .hn{grid-template-columns:minmax(0,1fr);gap:4px;padding:20px 0}.hn time{padding-top:0}
  .site:not(.ja) .hn .cardt{font-size:18px}.site.ja .hn .cardt{font-size:16px}
}
@supports (word-break:auto-phrase){.site.ja .hn p{word-break:auto-phrase;overflow-wrap:normal}}
/* product price (CHF, before tax) */
.price{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;font-family:var(--body)}
.price .amt{font-size:18px;font-weight:500;letter-spacing:.02em;color:var(--ink)}.price .tax{font-size:var(--t-small);color:var(--mute)}
/* partners: phone and mail open directly */
.store .sub{margin-bottom:4px;color:var(--ink)}
.store a{color:inherit;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:.3em;text-decoration-thickness:1px;transition:text-decoration-color .3s var(--ease)}
.store a:hover{text-decoration-color:currentColor}
/* press: downloads */
.press .regionh{font-size:clamp(26px,2.4vw,34px)}.press .regionh .m{display:block}
.site.ja .press .regionh{font-size:clamp(22px,2vw,28px)}
.dlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.dlist li{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.dlist .pn{font-size:var(--t-text);color:var(--ink)}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 28px}
.pgrid .ph{margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
.pgrid .lit{aspect-ratio:1/1;width:100%;margin-bottom:4px}
.pgrid figcaption{color:var(--mute)}
@media (max-width:600px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 14px}}
/* text selection (review sheet 2) */
::selection{background-color:#F7F7F7;color:#06050A}