/* ============ KITAE — monochrome storefront ============ */
:root{
  --bg:#ffffff; --ink:#0b0b0b; --ink2:#1a1a1a; --mut:#7a7a7a; --mut2:#9a9a9a;
  --line:#e7e7e7; --paper:#f6f6f6; --paper2:#efefef; --black:#0b0b0b; --white:#fff;
  --nav-h:64px; --marq-h:34px; --max:1280px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --font: "Space Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --disp: "Space Grotesk", var(--font);
  /* kanji (鍛 etc) fall back to the visitor's system Japanese font — free, no download */
  --jp: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", "MS Mincho", serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
body{font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;width:100%}
/* overflow safety: nothing spills past the viewport */
img,svg,video,table{max-width:100%}
input,select,textarea{max-width:100%;min-width:0;font-family:inherit}
/* size recommender: shrinks and stacks cleanly on small screens */
.recgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:520px}
.recgrid input,.recgrid select{padding:11px;border:1px solid var(--line);width:100%;min-width:0;background:#fff;font-size:14px}
@media(max-width:520px){.recgrid{grid-template-columns:1fr}}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;letter-spacing:-.02em;line-height:1.03}
/* kanji accents render in a system Japanese serif */
.hero .jp,.bigmarq .t span{font-family:var(--jp)!important}
/* wordmark: distinctive tracked display */
.nav .logo,footer.f .logo,#intro .brand .wm{font-family:var(--disp);font-weight:700;letter-spacing:.22em}
.u{text-transform:uppercase;letter-spacing:.14em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}
.hidden{display:none!important}

/* ---------- intro shutter ---------- */
#intro{position:fixed;inset:0;z-index:9999;background:#0b0b0b;overflow:hidden;
  transition:transform .7s var(--ease);will-change:transform}
#intro.done{transform:translateY(-100%);pointer-events:none}
#intro .bars{position:absolute;inset:0;display:flex}
/* bars overlap by 1px so there's never a black seam between them */
#intro .bar{flex:0 0 auto;width:calc(5% + 1px);margin-right:-1px;height:100%;background:#f4f4f4;transform:scaleY(0);transform-origin:bottom;
  animation:barUp .55s var(--ease) forwards}
@keyframes barUp{to{transform:scaleY(1)}}
#intro .brand{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;opacity:0;animation:brandIn .6s ease .55s forwards}
@keyframes brandIn{to{opacity:1}}
#intro .brand img{width:120px;height:120px}
#intro .brand .wm{font-size:34px;font-weight:800;letter-spacing:.42em;text-indent:.42em;color:#0b0b0b}
#intro .brand .tg{font-size:10px;letter-spacing:.4em;color:#555;text-transform:uppercase}
#intro .skip{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:.25em;color:#8a8a8a;text-transform:uppercase}

/* ---------- marquee ---------- */
.marq{height:var(--marq-h);background:var(--black);color:#fff;display:flex;align-items:center;overflow:hidden;white-space:nowrap;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600}
.marq .track{display:inline-flex;gap:0;animation:marq 26s linear infinite;will-change:transform}
.marq span{padding:0 26px;position:relative}
.marq span::after{content:"◆";position:absolute;right:-4px;opacity:.4;font-size:8px;top:50%;transform:translateY(-50%)}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- nav ---------- */
header.nav{position:sticky;top:0;z-index:900;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)}
.nav .row{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:16px}
.nav .logo{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:.34em;text-indent:.34em;font-size:19px}
.nav .logo img{width:30px;height:30px}
.nav nav{display:flex;gap:26px}
.nav nav a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);position:relative;padding:4px 0;font-weight:600}
.nav nav a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--ink);transition:width .3s var(--ease)}
.nav nav a:hover::after,.nav nav a.active::after{width:100%}
.nav .tools{display:flex;align-items:center;gap:16px}
.icbtn{position:relative;display:flex;align-items:center;justify-content:center;width:34px;height:34px}
.icbtn svg{width:21px;height:21px;stroke:var(--ink);fill:none;stroke-width:1.6}
.cartcount{position:absolute;top:-3px;right:-4px;background:var(--ink);color:#fff;font-size:9px;font-weight:700;min-width:15px;height:15px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 3px}
.burger{display:none}

/* ---------- hero ---------- */
.hero{background:#0b0b0b;color:#fff;position:relative;overflow:hidden;padding:76px 0 84px;text-align:center}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.06),transparent 60%)}
.hero img.mark{width:96px;height:96px;filter:invert(1);margin:0 auto 22px;opacity:.95;position:relative}
.hero h1{font-size:clamp(44px,10vw,104px);letter-spacing:.02em;line-height:.9;position:relative}
.hero .sub{color:#c9c9c9;max-width:540px;margin:18px auto 0;font-size:15px;position:relative}
.hero .cta{margin-top:30px;position:relative;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero .jp{position:absolute;font-weight:800;color:rgba(255,255,255,.04);font-size:clamp(120px,28vw,300px);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;letter-spacing:.1em;user-select:none}
.btn{display:inline-flex;align-items:center;gap:9px;padding:14px 26px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;border:1.5px solid var(--ink);background:var(--ink);color:#fff;transition:.25s var(--ease)}
.btn:hover{background:transparent;color:var(--ink)}
.hero .btn{border-color:#fff}.hero .btn.solid{background:#fff;color:#0b0b0b}.hero .btn.solid:hover{background:transparent;color:#fff}
.hero .btn.ghost{background:transparent;color:#fff}.hero .btn.ghost:hover{background:#fff;color:#0b0b0b}
.btn.blk{background:var(--ink);color:#fff;border-color:var(--ink)}.btn.blk:hover{background:#fff;color:var(--ink)}
.btn.lg{padding:16px 34px}
.btn.wide{width:100%;justify-content:center}

/* ---------- section shells ---------- */
section.blk{padding:64px 0}
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:28px;flex-wrap:wrap}
.shead .k{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--mut);font-weight:700;margin-bottom:8px}
.shead h2{font-size:clamp(26px,4vw,40px)}
.shead a.more{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;border-bottom:1.5px solid var(--ink);padding-bottom:2px}

/* ---------- product grid ---------- */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{position:relative;display:block}
.card .media{position:relative;aspect-ratio:3/4;background:var(--paper);overflow:hidden}
.card .media .ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:linear-gradient(135deg,#f2f2f2,#e6e6e6)}
.card .media .ph img{width:52px;height:52px;opacity:.28}
.card .media .ph span{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#a2a2a2;font-weight:700}
.card .media img.pi{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .6s var(--ease),opacity .3s}
.card .media img.pi.broken{opacity:0}
.card:hover .media img.pi{transform:scale(1.05)}
.card .tag{position:absolute;top:10px;left:10px;z-index:2;background:var(--ink);color:#fff;font-size:9.5px;font-weight:700;letter-spacing:.1em;padding:4px 8px;text-transform:uppercase}
.card .tag.new{top:10px;left:auto;right:10px;background:#fff;color:var(--ink);border:1px solid var(--ink)}
.card .info{padding:12px 2px 0}
.card .info .nm{font-size:13px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.card .info .ct{font-size:11px;color:var(--mut);margin:3px 0 6px;text-transform:uppercase;letter-spacing:.1em}
.card .info .pr{display:flex;align-items:center;gap:8px}
.card .info .pr .now{font-weight:800}
.card .info .pr .was{color:var(--mut2);text-decoration:line-through;font-size:13px}
.card .info .pr .off{font-size:11px;color:var(--ink);font-weight:700;border:1px solid var(--line);padding:1px 6px;border-radius:3px}
.card .qadd{position:absolute;left:10px;right:10px;bottom:10px;z-index:2;opacity:0;transform:translateY(8px);transition:.25s var(--ease)}
.card .media:hover .qadd{opacity:1;transform:none}

/* ---------- value strip ---------- */
.vals{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.vals .v{background:#fff;padding:26px 20px;text-align:center}
.vals .v svg{width:26px;height:26px;stroke:var(--ink);fill:none;stroke-width:1.5;margin:0 auto 12px}
.vals .v h4{font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:6px}
.vals .v p{font-size:12.5px;color:var(--mut)}

/* ---------- founder band ---------- */
.founder{background:#0b0b0b;color:#fff}
.founder .inner{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;padding:60px 0}
.founder .ph{aspect-ratio:4/5;background:linear-gradient(135deg,#1c1c1c,#101010);display:flex;align-items:center;justify-content:center;border:1px solid #262626;overflow:hidden}
.founder .ph img{width:90px;height:90px;filter:invert(1);opacity:.4}
.founder .ph img.real{width:100%;height:100%;filter:none;opacity:1;object-fit:cover;object-position:center 18%}
/* face is blurred into founder.jpg; animated single-layer scribble sits on top */
.founder .ph{position:relative}
.fdrwrap{position:relative;width:100%}
.scrib{position:absolute;pointer-events:none;z-index:3;transform-origin:50% 45%;animation:scribWob 3.2s ease-in-out infinite}
.scrib svg{width:100%;height:100%;overflow:visible;display:block}
.scrib svg path{fill:none;stroke:#fafafa;stroke-width:8;stroke-linecap:round;stroke-linejoin:round}
@keyframes scribWob{0%{transform:rotate(-1.6deg) translateY(0)}50%{transform:rotate(1.6deg) translateY(-1.5px)}100%{transform:rotate(-1.6deg) translateY(0)}}
.founder .ph .scrib{top:8%;left:25%;width:38%;height:40%}
.fdrwrap .scrib{top:8%;left:25%;width:38%;height:40%}
.founder .k{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#8a8a8a;font-weight:700;margin-bottom:14px}
.founder h2{font-size:clamp(28px,4.5vw,46px);margin-bottom:16px}
.founder p{color:#c4c4c4;margin-bottom:14px;font-size:15px}
.founder .list{list-style:none;margin:14px 0 24px}
.founder .list li{padding:9px 0;border-bottom:1px solid #232323;font-size:14px;display:flex;gap:10px;align-items:center;color:#e4e4e4}
.founder .list li b{font-weight:700}

/* ---------- spec bars ---------- */
.specs{display:grid;grid-template-columns:1fr 1fr;gap:28px 60px;max-width:820px;margin:0 auto}
.spec .lab{display:flex;justify-content:space-between;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin-bottom:7px}
.spec .lab .val{color:var(--mut)}
.spec .bar{height:8px;background:var(--paper2);position:relative;overflow:hidden}
.spec .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--ink);width:var(--w,0);animation:barfill 1.1s var(--ease)}
@keyframes barfill{from{width:0}}

/* ---------- marquee band (text) ---------- */
.bigmarq{background:#0b0b0b;color:#fff;overflow:hidden;white-space:nowrap;padding:22px 0;border-top:1px solid #1e1e1e;border-bottom:1px solid #1e1e1e}
.bigmarq .t{display:inline-flex;animation:marq 30s linear infinite}
.bigmarq .t span{font-size:clamp(30px,6vw,66px);font-weight:800;letter-spacing:.02em;padding:0 30px;color:#151515;-webkit-text-stroke:1px #3a3a3a}

/* ---------- product detail ---------- */
.pdp{display:grid;grid-template-columns:1.15fr 1fr;gap:44px;padding:34px 0 10px}
.pdp .gallery{display:flex;flex-direction:column;gap:12px}
.pdp .gmain{aspect-ratio:3/4;background:var(--paper);position:relative;overflow:hidden}
.pdp .gmain .ph{position:absolute;inset:0;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;background:linear-gradient(135deg,#f2f2f2,#e4e4e4)}
.pdp .gmain .ph img{width:72px;height:72px;opacity:.28}.pdp .gmain .ph span{font-size:11px;letter-spacing:.22em;color:#a2a2a2;font-weight:700;text-transform:uppercase}
.pdp .gmain img.pi{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pdp .gmain img.pi.broken{display:none}
.pdp .thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pdp .thumbs .t{aspect-ratio:1;background:var(--paper);border:1px solid var(--line);cursor:pointer;overflow:hidden}
.pdp .thumbs .t img{width:100%;height:100%;object-fit:cover;cursor:pointer}
.pdp .meta .bc{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin-bottom:12px}
.pdp .meta h1{font-size:clamp(26px,3.4vw,38px);margin-bottom:10px}
.pdp .meta .price{display:flex;align-items:center;gap:12px;margin:6px 0 4px}
.pdp .meta .price .now{font-size:24px;font-weight:800}
.pdp .meta .price .was{color:var(--mut2);text-decoration:line-through}
.pdp .meta .price .off{background:var(--ink);color:#fff;font-size:11px;font-weight:700;padding:3px 8px}
.pdp .meta .tax{font-size:12px;color:var(--mut);margin-bottom:20px}
.pdp .field{margin-bottom:20px}
.pdp .field .fl{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin-bottom:9px;display:flex;justify-content:space-between}
.pdp .field .fl a{color:var(--mut);border-bottom:1px solid var(--line)}
.sizes{display:flex;gap:8px;flex-wrap:wrap}
.sizes button{min-width:46px;height:44px;border:1.4px solid var(--line);font-size:13px;font-weight:700;transition:.2s;background:#fff}
.sizes button:hover{border-color:var(--ink)}
.sizes button.sel{background:var(--ink);color:#fff;border-color:var(--ink)}
.sizes button.pre{position:relative}
.sizes button.pre::after{content:"pre";position:absolute;top:-7px;right:-6px;font-size:7px;background:var(--mut);color:#fff;padding:1px 3px;border-radius:2px;letter-spacing:.05em}
.pdp .buys{display:flex;flex-direction:column;gap:10px;margin:22px 0}
.pdp .prepaid{font-size:12px;color:var(--mut);display:flex;align-items:center;gap:7px;margin-top:2px}
.pdp .founder-cut{border:1px dashed var(--ink);padding:14px 16px;margin:18px 0;display:flex;gap:12px;align-items:center}
.pdp .founder-cut svg{width:26px;height:26px;stroke:var(--ink);fill:none;stroke-width:1.5;flex:none}
.pdp .founder-cut b{font-size:13px}.pdp .founder-cut p{font-size:12px;color:var(--mut)}
.pdp .founder-cut a{margin-left:auto;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;border-bottom:1.5px solid var(--ink);white-space:nowrap}
.acc{border-top:1px solid var(--line)}
.acc .item{border-bottom:1px solid var(--line)}
.acc .h{width:100%;text-align:left;padding:15px 0;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center}
.acc .h span{font-size:18px;font-weight:400;transition:.3s}
.acc .item.open .h span{transform:rotate(45deg)}
.acc .b{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.acc .b .in{padding:0 0 16px;font-size:13.5px;color:var(--mut);line-height:1.7}
.acc .b .in ul{padding-left:18px}
/* robust native accordion (no overlap) */
.acc{border-top:1px solid var(--line)}
.ac{border-bottom:1px solid var(--line)}
.ac summary{list-style:none;cursor:pointer;padding:15px 2px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center;gap:14px}
.ac summary::-webkit-details-marker{display:none}
.ac summary .ic{position:relative;width:13px;height:13px;flex:none}
.ac summary .ic::before,.ac summary .ic::after{content:"";position:absolute;background:var(--ink);transition:transform .3s var(--ease),opacity .3s}
.ac summary .ic::before{left:0;top:5.5px;width:13px;height:2px}
.ac summary .ic::after{left:5.5px;top:0;width:2px;height:13px}
.ac[open] summary .ic::after{transform:scaleY(0);opacity:0}
.acb{padding:2px 2px 18px;font-size:13.5px;color:var(--mut);line-height:1.7}
.acb ul{padding-left:18px;margin:2px 0}.acb a{color:var(--ink);border-bottom:1px solid var(--line)}

/* ---------- generic content pages ---------- */
.page{padding:44px 0 70px;max-width:820px}
.page h1{font-size:clamp(30px,5vw,46px);margin-bottom:8px}
.page .lead{color:var(--mut);margin-bottom:26px;font-size:15px}
.page h3{font-size:16px;margin:26px 0 8px;text-transform:uppercase;letter-spacing:.06em}
.page p,.page li{color:#333;font-size:14.5px;margin-bottom:10px}
.page ul{padding-left:20px}
.page .contactgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0}
.page .cc{border:1px solid var(--line);padding:20px}
.page .cc .k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin-bottom:6px}
.page .cc a{font-size:16px;font-weight:700}

/* ---------- cart drawer ---------- */
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.3s;z-index:1000}
.scrim.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,92vw);background:#fff;z-index:1001;transform:translateX(100%);transition:transform .38s var(--ease);display:flex;flex-direction:column}
.drawer.on{transform:none}
.drawer .dh{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line)}
.drawer .dh h3{font-size:15px;letter-spacing:.14em;text-transform:uppercase}
.drawer .dh button{font-size:22px;line-height:1}
.drawer .items{flex:1;overflow:auto;padding:8px 22px}
.drawer .empty{text-align:center;color:var(--mut);padding:60px 0;font-size:14px}
.ci{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.ci .im{width:66px;height:84px;background:var(--paper);flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ci .im img{width:28px;height:28px;opacity:.3}.ci .im img.real{width:100%;height:100%;object-fit:cover;opacity:1}
.ci .cd{flex:1;min-width:0}
.ci .cd .n{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.ci .cd .s{font-size:11px;color:var(--mut);margin:2px 0 8px}
.ci .qty{display:inline-flex;border:1px solid var(--line)}
.ci .qty button{width:26px;height:26px;font-size:14px}
.ci .qty span{width:30px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
.ci .rt{text-align:right;display:flex;flex-direction:column;justify-content:space-between}
.ci .rt .p{font-weight:800;font-size:13px}
.ci .rt .rm{font-size:10px;color:var(--mut);text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid var(--line)}
.drawer .foot{border-top:1px solid var(--line);padding:18px 22px}
.drawer .foot .rowl{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;color:var(--mut)}
.drawer .foot .rowl.tot{color:var(--ink);font-weight:800;font-size:16px;margin:10px 0 4px}
.drawer .foot .note{font-size:11px;color:var(--mut);margin:8px 0 14px;display:flex;gap:6px;align-items:center}

/* ---------- footer ---------- */
footer.f{background:#0b0b0b;color:#c7c7c7;padding:56px 0 26px;margin-top:20px}
footer.f .top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:34px}
footer.f .logo{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;letter-spacing:.3em;font-size:20px;margin-bottom:14px}
footer.f .logo img{width:34px;height:34px;filter:invert(1)}
footer.f p.ab{font-size:13px;color:#8f8f8f;max-width:300px}
footer.f h5{color:#fff;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px}
footer.f a{display:block;font-size:13px;color:#a3a3a3;padding:5px 0}
footer.f a:hover{color:#fff}
footer.f .sub{display:flex;border:1px solid #2a2a2a;margin-top:6px}
footer.f .sub input{flex:1;background:none;border:none;color:#fff;padding:11px 12px;font-size:13px;outline:none}
footer.f .sub button{background:#fff;color:#0b0b0b;padding:0 16px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
footer.f .bottom{border-top:1px solid #1e1e1e;margin-top:36px;padding-top:20px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:11.5px;color:#7a7a7a;letter-spacing:.04em}
footer.f .bottom a{display:inline;padding:0}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}

/* ---------- toast ---------- */
#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(30px);background:#0b0b0b;color:#fff;padding:13px 22px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;z-index:1200;opacity:0;transition:.3s var(--ease);pointer-events:none}
#toast.on{opacity:1;transform:translateX(-50%)}

/* ---------- mobile ---------- */
.mnav{position:fixed;inset:0;background:#0b0b0b;color:#fff;z-index:1002;transform:translateX(-100%);transition:transform .35s var(--ease);padding:26px 24px;display:flex;flex-direction:column;gap:4px}
.mnav.on{transform:none}
.mnav a{font-size:22px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:12px 0;border-bottom:1px solid #1c1c1c}
.mnav .x{align-self:flex-end;font-size:30px;margin-bottom:10px}

@media(max-width:1000px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .vals{grid-template-columns:repeat(2,1fr)}
  .founder .inner{grid-template-columns:1fr;gap:26px}
  footer.f .top{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .nav nav{display:none}.burger{display:flex}
  .pdp{grid-template-columns:1fr;gap:24px}
  .specs{grid-template-columns:1fr}
  #intro .brand .wm{font-size:24px}
  .fdrhead{grid-template-columns:1fr!important;gap:20px!important}
  .fdrhead img{max-width:240px}
  .pdp .founder-cut{flex-wrap:wrap}
  .pdp .founder-cut a{margin-left:0;margin-top:2px}
  .page .contactgrid{grid-template-columns:1fr}
  footer.f .top{grid-template-columns:1fr}
  section.blk{padding:46px 0}
}
@media(max-width:460px){
  .grid{grid-template-columns:1fr 1fr;gap:12px}
  .card .info .nm{font-size:12px}
  .hero{padding:56px 0 60px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001s!important;transition-duration:.05s!important}
  #intro{display:none!important}
}
