:root{
  --ink:#171717; --ink-2:#242424; --green:#21F1A8; --paper:#F4F0E6; --paper-2:#E8E2D3;
  --on-ink:#F4F0E6; --on-ink-dim:#B9B4A8; --on-paper:#171717; --on-paper-dim:#55524B;
  --display:"Montserrat","Arial Black",Arial,sans-serif;
  --label:"Oxanium","Montserrat",Arial,sans-serif;
  --body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme: light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  background:var(--ink);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --paper:#E9E4D8; --paper-2:#DDD6C5; color-scheme: dark; }
}
:root[data-theme="dark"]{ --paper:#E9E4D8; --paper-2:#DDD6C5; color-scheme: dark; }
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 64px)}
body{margin:0;background:var(--ink);color:var(--on-ink);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--green);outline-offset:3px}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--ink)}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:9;display:flex;align-items:center;justify-content:space-between;
  padding:10px clamp(16px,4vw,40px);background:var(--ink)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:40px;height:40px;border-radius:6px}
.brand span{font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:.01em}
.pill{font-family:var(--label);font-weight:600;font-size:14px;text-decoration:none;color:var(--ink);background:var(--green);padding:9px 16px;border-radius:999px}

/* nav */
.nav-right{display:flex;align-items:center;gap:10px}
.burger{width:44px;height:44px;border:2px solid var(--on-ink-dim);background:transparent;border-radius:8px;display:grid;place-content:center;gap:5px;cursor:pointer;padding:0}
.burger span{display:block;width:20px;height:2px;background:var(--on-ink);border-radius:2px;transition:transform .2s,opacity .2s}
.burger[aria-expanded="true"]{border-color:var(--green)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.menu{position:absolute;left:0;right:0;top:100%;background:var(--ink);border-top:2px solid var(--green);padding:8px clamp(16px,4vw,40px) 28px;display:flex;flex-direction:column;box-shadow:0 24px 40px rgba(0,0,0,.45);max-height:calc(100vh - 80px);overflow-y:auto;
  opacity:0;visibility:hidden;transform:translateY(-12px);pointer-events:none;
  transition:opacity .3s ease,transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s linear .3s}
.menu.open{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .3s ease,transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s}
.menu a{opacity:0;transform:translateY(8px);transition:opacity .3s ease,transform .3s ease,color .2s}
.menu.open a{opacity:1;transform:none}
.menu.open a:nth-child(2){transition-delay:.04s}.menu.open a:nth-child(3){transition-delay:.08s}.menu.open a:nth-child(4){transition-delay:.12s}.menu.open a:nth-child(5){transition-delay:.16s}.menu.open a:nth-child(6){transition-delay:.2s}.menu.open a:nth-child(7){transition-delay:.24s}.menu.open a:nth-child(n+8){transition-delay:.28s}
figure{will-change:transform;transform-origin:center center}
.menu a{font-family:var(--display);font-weight:900;font-size:clamp(32px,7vw,56px);line-height:1;letter-spacing:-.03em;text-decoration:none;color:var(--on-ink-dim);padding:14px 0;border-bottom:1px solid #2e2e2e}
.menu a:hover,.menu a.on{color:var(--on-ink)}
.menu a.on::before{content:"";display:inline-block;width:.3em;height:.3em;background:var(--green);border-radius:50%;margin-right:.3em;vertical-align:middle}
@media (max-width:420px){.nav-right .pill{display:none}}
@media (prefers-reduced-motion:reduce){.burger span{transition:none}.menu,.menu a{transition:none!important;transform:none!important}}

/* writing */
.writing{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px)}
.writing-in{max-width:1080px;margin:0 auto}
.writing h2{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,80px);line-height:.92;letter-spacing:-.035em;margin:0 0 12px}
.writing .lede{margin:0 0 32px;font-size:19px;color:var(--on-paper-dim);max-width:52ch}
.posts{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.posts li{border-bottom:2px solid var(--ink)}
.posts a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;align-items:baseline;padding:22px 4px;text-decoration:none}
.posts h3{font-family:var(--display);font-weight:800;font-size:clamp(22px,3vw,32px);line-height:1.1;letter-spacing:-.015em;margin:0}
.posts p{grid-column:1/2;margin:0;color:var(--on-paper-dim);max-width:60ch}
.posts .read{grid-row:1/3;grid-column:2/3;font-family:var(--label);font-weight:600;font-size:15px;background:var(--ink);color:var(--green);padding:8px 14px;border-radius:999px;align-self:center}
.posts a:hover h3{text-decoration:underline;text-decoration-color:var(--green);text-decoration-thickness:4px;text-underline-offset:4px}
@media (max-width:560px){.posts a{grid-template-columns:1fr}.posts .read{grid-row:auto;grid-column:1/2;justify-self:start;margin-top:8px}}

/* about */
.about{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px);background:var(--ink);color:var(--on-ink)}
.about-in{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(28px,6vw,80px)}
.about h2{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,80px);line-height:.92;letter-spacing:-.035em;margin:0 0 22px;color:var(--green)}
.about p{margin:0 0 16px;max-width:58ch;font-size:18px;color:var(--on-ink-dim)}
.about .about-lead{font-size:clamp(21px,2.6vw,27px);line-height:1.3;color:var(--on-ink);max-width:30ch}
.about-facts{margin:0;display:grid;gap:16px;align-content:start}
.about-facts div{border-top:2px solid var(--green);padding-top:10px}
.about-facts dt{font-family:var(--label);font-weight:600;font-size:14px;color:var(--green)}
.about-facts dd{margin:2px 0 0;font-weight:500;color:var(--on-ink)}
@media (max-width:760px){.about-in{grid-template-columns:1fr}}
.about-hero{max-width:1180px;margin:0 auto clamp(28px,5vw,56px);aspect-ratio:3/2;background:var(--ink-2)}
.about-hero img{width:100%;height:100%;object-fit:cover;object-position:42% 55%}
.about-ride{max-width:1180px;margin:clamp(28px,5vw,56px) auto 0;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:clamp(10px,1.6vw,18px);align-items:stretch}
.about-ride figure:first-child{aspect-ratio:2/3}
.about-ride img{width:100%;height:100%;object-fit:cover}
.about-snow{max-width:1180px;margin:clamp(10px,1.6vw,18px) auto 0;display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.6vw,18px)}
.about-snow figure{aspect-ratio:3/2}
.about-snow img{width:100%;height:100%;object-fit:cover}
@media (max-width:760px){.about-snow{grid-template-columns:1fr}}
@media (max-width:760px){.about-ride{grid-template-columns:1fr}.about-ride figure:first-child{aspect-ratio:4/5}.about-ride figure:last-child{aspect-ratio:3/2}}


/* sections v2 */
.sec-head{padding:clamp(48px,7vw,96px) clamp(16px,5vw,64px) clamp(16px,3vw,28px);background:var(--ink);color:var(--on-ink)}
.sec-head.on-paper{background:var(--paper);color:var(--on-paper);padding-bottom:clamp(36px,5vw,64px)}
.sec-in{max-width:1280px;margin:0 auto}
.sec-kicker{font-family:var(--label);font-weight:600;font-size:14px;color:var(--green);margin:0 0 10px}
.sec-head.on-paper .sec-kicker,.sec-kicker.dark{color:var(--on-paper-dim)}
.sec-head h2,.partners h2{font-family:var(--display);font-weight:900;font-size:clamp(48px,9vw,112px);line-height:.88;letter-spacing:-.04em;margin:0}
.sec-dek{margin:18px 0 0;max-width:56ch;font-size:clamp(17px,2vw,20px);color:var(--on-ink-dim)}
.sec-head.on-paper .sec-dek,.sec-dek.dark{color:var(--on-paper-dim)}
.s12{grid-column:span 12}.s8{grid-column:span 8}.s6{grid-column:span 6}.s4{grid-column:span 4}
.a21{aspect-ratio:2/1}.a169{aspect-ratio:16/9}.a32{aspect-ratio:3/2}.a11{aspect-ratio:1/1}.a45{aspect-ratio:4/5}.a23{aspect-ratio:2/3}.a34{aspect-ratio:3/4}
figure.contain{background:#fff}figure.contain img{object-fit:contain}
.sub-head{grid-column:1/-1;margin:clamp(20px,3vw,36px) 2px 0;font-family:var(--label);font-weight:600;font-size:15px;color:var(--on-ink-dim)}
.partners{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px)}
.partners-in{max-width:1180px;margin:0 auto}
.p-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));gap:clamp(18px,3vw,32px);margin-top:clamp(28px,4vw,48px)}
.p-card{border-top:3px solid var(--ink);padding-top:16px}
.p-card h3{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.6vw,30px);letter-spacing:-.015em;margin:16px 0 8px}
.p-card .tags{margin:0 0 10px}.p-card p{margin:0;color:var(--on-paper-dim);max-width:52ch}
.p-imgs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.p-imgs img{width:100%;height:100%;object-fit:cover}
.p-imgs.trio{grid-template-columns:repeat(3,1fr)}.p-imgs .p-wide{grid-column:1/-1}
.p-note{aspect-ratio:8/5;display:grid;place-items:center;background:var(--ink);color:var(--on-ink-dim);font-family:var(--label);font-weight:600;font-size:15px}
.next-in.tux{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center}
.tux-poster{margin:0;aspect-ratio:9/16;background:var(--ink);box-shadow:0 18px 40px rgba(0,0,0,.25)}
.tux-poster img{width:100%;height:100%;object-fit:cover}
.tux-copy p{margin:0 0 14px}
@media (max-width:760px){.s8,.s6,.s4{grid-column:span 12}.next-in.tux{grid-template-columns:1fr}.tux-poster{max-width:340px;width:100%;justify-self:center}}

/* tags + case study */
.tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tags li{font-family:var(--label);font-weight:600;font-size:14px;border:2px solid currentColor;border-radius:999px;padding:5px 12px}
.case-study{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:20px 32px;margin:0}
.case-study div{border-top:2px solid currentColor;padding-top:10px}
.case-study dt{font-family:var(--label);font-weight:600;font-size:14px;opacity:.75;margin:0 0 4px}
.case-study dd{margin:0;font-size:17px;line-height:1.5}
.case-study .outcome{border-top-color:var(--green)}
.next .case-study .outcome{border-top-color:var(--ink);border-top-width:4px}
.tux-wrap{max-width:1280px;margin:clamp(32px,5vw,56px) auto 0}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.hero-cta a{font-family:var(--display);font-weight:800;font-size:16px;text-decoration:none;padding:12px 20px;border-radius:999px}
.hero-cta .c1{background:var(--green);color:var(--ink)}
.hero-cta .c2{border:2px solid var(--paper);color:var(--paper)}
.wwm{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px)}
.wwm-in{max-width:1080px;margin:0 auto}
.wwm h2{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,80px);line-height:.92;letter-spacing:-.035em;margin:0 0 14px}
.wwm .lede{margin:0 0 32px;font-size:19px;color:var(--on-paper-dim);max-width:56ch}
.wwm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));gap:clamp(18px,3vw,32px)}
.wwm-card{border-top:3px solid var(--ink);padding-top:16px}
.wwm-card h3{font-family:var(--display);font-weight:800;font-size:clamp(24px,3vw,32px);letter-spacing:-.015em;margin:0 0 10px}
.wwm-card p{margin:0 0 14px;max-width:52ch}
.wwm-card .tags{margin-top:6px}
.wwm-contact{margin-top:clamp(32px,5vw,48px);display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}

.ca-list{margin:0;padding-left:1.1em}.ca-list li{margin:0 0 8px}
.ca-hook{font-family:var(--display);font-weight:900;font-size:clamp(28px,4.5vw,52px);letter-spacing:-.03em;line-height:1;margin:0 0 6px;color:var(--ink)}
.ca-rack{grid-column:span 5;aspect-ratio:auto;background:var(--paper-2)}.ca-rack img{object-fit:contain;height:auto}
.ca-logo{grid-column:span 7;aspect-ratio:auto;align-self:start}.ca-logo img{height:auto}
@media (max-width:760px){.ca-rack,.ca-logo{grid-column:span 12}}

/* home gallery */
.hgal-wrap{padding:clamp(12px,2vw,24px) clamp(12px,2vw,24px) clamp(32px,5vw,56px);background:var(--ink)}
.hgal{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(80px,9vw,140px);grid-auto-flow:dense;gap:clamp(8px,1.2vw,14px)}
.hg{position:relative;display:block;overflow:hidden;border-radius:4px;background:var(--ink-2);text-decoration:none}
.hg img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.hg.fit{background:#fff}.hg.fit img{object-fit:contain}.hg.fit-paper{background:var(--paper-2)}.hg.fit-paper img{object-fit:contain}
.hg span{position:absolute;left:8px;bottom:8px;font-family:var(--label);font-weight:600;font-size:13px;color:var(--ink);background:var(--paper);padding:3px 8px;border-radius:4px}
.hg:hover img{transform:scale(1.04)}
.c4{grid-column:span 4}.c6{grid-column:span 6}.c8{grid-column:span 8}.c12{grid-column:span 12}
.r3{grid-row:span 3}.r4{grid-row:span 4}.r6{grid-row:span 6}
@media (max-width:760px){.hgal{grid-template-columns:1fr 1fr;grid-auto-rows:42vw}
  .hg{grid-column:span 2;grid-row:span 1}.hg.m1{grid-column:span 1}.hg.mt{grid-column:span 1;grid-row:span 2}}
@media (prefers-reduced-motion:reduce){.hg img{transition:none}}
.cat-tiles{grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr))}

/* hero */
.hero{position:relative;min-height:min(92vh,980px);display:flex;align-items:flex-end;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:45% 50%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,23,0) 40%,rgba(23,23,23,.88) 100%)}
.hero-copy{position:relative;z-index:1;padding:0 clamp(16px,5vw,64px) clamp(28px,6vw,72px);max-width:1100px}
.hero h1{font-family:var(--display);font-weight:900;font-size:clamp(48px,11vw,148px);line-height:.88;letter-spacing:-.035em;margin:0 0 18px;color:var(--paper)}
.hero p{margin:0;max-width:34ch;font-size:clamp(18px,2.2vw,22px);color:var(--paper)}
.hero .note{margin-top:14px;font-family:var(--label);font-size:14px;color:var(--green)}

/* project intro on paper */
.paper{background:var(--paper);color:var(--on-paper)}
.intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,72px);
  padding:clamp(48px,8vw,112px) clamp(16px,5vw,64px);max-width:1280px;margin:0 auto}
.kicker{font-family:var(--label);font-weight:600;font-size:14px;color:var(--on-paper-dim);margin:0 0 10px}
.intro h2{font-family:var(--display);font-weight:900;font-size:clamp(56px,10vw,132px);line-height:.86;letter-spacing:-.04em;margin:0;
  color:var(--ink);position:relative;display:inline-block}
.intro h2::after{content:"";position:absolute;left:.04em;right:-.12em;bottom:.06em;height:.16em;background:var(--green);z-index:-1}
.intro h2{z-index:0}
.dek{font-size:clamp(20px,2.4vw,26px);line-height:1.35;margin:24px 0 0;max-width:30ch}
.facts{margin:0;display:grid;gap:18px;align-content:start;padding-top:8px}
.facts div{border-top:2px solid var(--ink);padding-top:10px}
.facts dt{font-family:var(--label);font-weight:600;font-size:14px;color:var(--on-paper-dim)}
.facts dd{margin:2px 0 0;font-weight:500;font-size:18px}
.story{grid-column:1/-1;max-width:62ch;font-size:18px;margin:0}

/* gallery on ink */
.gallery{padding:clamp(16px,3vw,32px);display:grid;gap:clamp(10px,1.6vw,18px);grid-template-columns:repeat(12,1fr);max-width:1440px;margin:0 auto}
figure{margin:0;position:relative;overflow:hidden;background:var(--ink-2)}
figure img{width:100%;height:100%;object-fit:cover}
figcaption{position:absolute;left:10px;bottom:10px;font-family:var(--label);font-weight:600;font-size:13px;color:var(--ink);background:var(--paper);padding:3px 8px;border-radius:4px}
.g-crank{grid-column:1/-1;aspect-ratio:16/8}
.g-drink{grid-column:1/8;aspect-ratio:4/3}
.g-drip{grid-column:8/13;aspect-ratio:auto}
.g-ltd{grid-column:1/5;aspect-ratio:2/3}
.g-wings{grid-column:5/9;aspect-ratio:2/3}
.g-wings img{object-position:50% 50%}
.g-fork{grid-column:9/13;aspect-ratio:2/3;background:#fff}
.g-fork img{object-fit:contain}
.studio-note{grid-column:1/-1;color:var(--on-ink-dim);font-size:15px;margin:6px 2px 0;max-width:60ch}

/* next */
.next{background:var(--green);color:var(--ink);padding:clamp(36px,6vw,72px) clamp(16px,5vw,64px)}
.next-in{max-width:1280px;margin:0 auto;display:flex;flex-wrap:wrap;gap:12px 40px;align-items:baseline;justify-content:space-between}
.next h3{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,88px);line-height:.9;letter-spacing:-.035em;margin:0}
.next p{margin:0;max-width:40ch;font-size:18px}
.next .kicker{color:var(--ink);opacity:.75;width:100%;margin:0}
.watch{display:inline-block;font-family:var(--display);font-weight:800;font-size:17px;text-decoration:none;background:var(--ink);color:var(--green);padding:14px 24px;border-radius:999px;margin-top:8px}
.watch:focus-visible{outline-color:var(--ink)}

/* feedback */
.fb{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px)}
.fb-in{max-width:760px;margin:0 auto}
.fb h2{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,80px);line-height:.92;letter-spacing:-.035em;margin:0 0 12px}
.fb .lede{margin:0 0 36px;font-size:19px;color:var(--on-paper-dim)}
.q{margin:0 0 30px;border:0;padding:0}
.q > label,.q legend{display:block;font-weight:600;font-size:18px;margin-bottom:10px;padding:0}
textarea,input[type=text]{width:100%;font:inherit;font-size:17px;color:var(--on-paper);background:#FFFDF8;border:2px solid var(--ink);border-radius:8px;padding:12px 14px}
textarea{min-height:92px;resize:vertical}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{cursor:pointer}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;font-family:var(--label);font-weight:600;font-size:15px;border:2px solid var(--ink);border-radius:999px;padding:7px 14px;background:transparent}
.chips input:checked + span{background:var(--ink);color:var(--green)}
.chips input:focus-visible + span{outline:3px solid var(--ink);outline-offset:2px}
.scale span{min-width:48px;text-align:center}
.chip-group{font-family:var(--label);font-weight:600;font-size:14px;color:var(--on-paper-dim);margin:18px 0 8px}
#q2 .chip-group:first-child{margin-top:0}
.scale-hint{font-size:14px;color:var(--on-paper-dim);margin-top:8px}
.send{display:inline-block;margin-top:6px;font-family:var(--display);font-weight:800;font-size:18px;text-decoration:none;background:var(--ink);color:var(--green);padding:16px 26px;border-radius:999px}
.send{border:0;cursor:pointer}
.addr{margin:14px 0 0;font-weight:600;user-select:all;-webkit-user-select:all}
.fine{font-size:14px;color:var(--on-paper-dim);margin:14px 0 0}
.done{display:none;margin-top:18px;font-weight:600}

footer{padding:36px clamp(16px,5vw,64px);display:flex;gap:16px;align-items:center;color:var(--on-ink-dim);font-size:14px}
footer img{width:48px;height:48px;border-radius:6px}

@media (max-width:760px){
  .intro{grid-template-columns:1fr}
  .g-crank{aspect-ratio:4/3}
  .g-drink,.g-drip{grid-column:1/-1;aspect-ratio:4/3}
  .g-ltd,.g-wings,.g-fork{grid-column:span 6;aspect-ratio:3/4}
  .g-fork{grid-column:1/-1;aspect-ratio:4/3}
  .brand span{font-size:14px}
}
@media (prefers-reduced-motion:no-preference){
  .hero h1,.hero p,.hero .note{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
  .hero p{animation-delay:.12s}.hero .note{animation-delay:.22s}
  @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
}

/* pages */
.view[hidden]{display:none!important}
.work{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px)}
.work-in{max-width:1280px;margin:0 auto}
.work h2{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,80px);line-height:.92;letter-spacing:-.035em;margin:0 0 clamp(24px,4vw,40px)}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:clamp(18px,3vw,32px)}
.tile{display:flex;flex-direction:column;text-decoration:none;color:var(--on-paper)}
.tile-img{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--ink-2);border-radius:4px}
.tile-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.tile-text{display:grid;place-items:center;background:var(--ink)}
.tile-text span{font-family:var(--display);font-weight:900;font-size:clamp(36px,5vw,56px);letter-spacing:-.035em;color:var(--green)}
.tile-name{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.6vw,28px);letter-spacing:-.015em;margin:14px 0 4px;border-top:3px solid var(--ink);padding-top:10px}
.tile-dek{color:var(--on-paper-dim);font-size:16px}
.tile{padding:12px 12px 20px;border-radius:6px}
.tile:nth-child(odd){background:var(--ink);color:var(--on-ink)}
.tile:nth-child(odd) .tile-name{border-top-color:var(--green)}
.tile:nth-child(odd) .tile-dek{color:var(--on-ink-dim)}
.tile:nth-child(odd) .tile-text{background:var(--ink-2)}
.tile:nth-child(even){background:#FFFDF8;border:2px solid var(--ink)}
.tile:hover .tile-img img{transform:scale(1.04)}
.tile:hover .tile-name{text-decoration:underline;text-decoration-color:var(--green);text-decoration-thickness:4px;text-underline-offset:4px}
.pager{background:var(--green);color:var(--ink);padding:clamp(32px,5vw,56px) clamp(16px,5vw,64px)}
.pager-in{max-width:1280px;margin:0 auto;display:flex;flex-wrap:wrap;gap:16px 40px;align-items:flex-end;justify-content:space-between}
.pager-next{text-decoration:none;display:flex;flex-direction:column}
.pager-k{font-family:var(--label);font-weight:600;font-size:14px;opacity:.75}
.pager-t{font-family:var(--display);font-weight:900;font-size:clamp(36px,6vw,72px);line-height:.95;letter-spacing:-.035em}
.pager-next:hover .pager-t{text-decoration:underline;text-decoration-thickness:5px;text-underline-offset:6px}
.pager-all{font-family:var(--display);font-weight:800;font-size:16px;text-decoration:none;background:var(--ink);color:var(--green);padding:12px 20px;border-radius:999px}
.pager a:focus-visible{outline-color:var(--ink)}
@media (prefers-reduced-motion:reduce){.tile-img img{transition:none}}

/* crm */
.thumb-top{object-position:top}
.crm-head{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px) clamp(40px,6vw,72px)}
.crm-in{max-width:1080px;margin:0 auto}
.crm-kick{font-family:var(--label);font-weight:600;font-size:15px;color:var(--on-paper-dim);margin:0 0 10px}
.crm-head h2{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,80px);line-height:.92;letter-spacing:-.035em;margin:0 0 14px}
.crm-head .lede{margin:0 0 32px;font-size:19px;color:var(--on-paper-dim);max-width:56ch}
.case-l{display:block;font-family:var(--label);font-weight:600;font-size:14px;letter-spacing:.02em;margin:0 0 6px;opacity:.75}
.mods{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:8px;counter-reset:m}
.mods li{counter-increment:m;border:2px solid var(--ink);border-radius:6px;padding:10px 12px;font-weight:600}
.mods li::before{content:counter(m);font-family:var(--display);font-weight:900;color:var(--ink);background:var(--green);border-radius:999px;display:inline-grid;place-items:center;width:1.6em;height:1.6em;margin-right:8px;font-size:14px}
.crm-mail{padding:clamp(40px,7vw,88px) clamp(16px,5vw,64px)}
.crm-mail.dark{background:var(--ink);color:var(--on-ink)}
.crm-mail.light{background:var(--paper);color:var(--on-paper)}
.crm-mail-in{max-width:1080px;margin:0 auto;display:grid;gap:32px 56px;grid-template-columns:minmax(0,1fr)}
@media (min-width:860px){.crm-mail-in{grid-template-columns:360px minmax(0,1fr);align-items:start}.crm-mail-in .phone{grid-column:1;grid-row:1}.crm-mail-in .case{grid-column:2;grid-row:1;position:sticky;top:96px}}
.case-k{font-family:var(--label);font-weight:600;font-size:14px;margin:0 0 8px;color:var(--green)}
.crm-mail.light .case-k{color:var(--on-paper-dim)}
.case h3{font-family:var(--display);font-weight:900;font-size:clamp(28px,4vw,44px);line-height:1;letter-spacing:-.025em;margin:0 0 24px}
.case-row{margin:0 0 22px;font-size:18px;max-width:52ch}
.flow{margin:0 0 22px}
.flow-src{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.flow-src li{border:2px solid currentColor;border-radius:999px;padding:6px 14px;font-size:15px;font-weight:600}
.crm-mail.dark .flow-src li{border-color:var(--green)}
.flow-out{margin:12px 0 0;font-family:var(--display);font-weight:800;font-size:17px}
.flow-out span{color:var(--green);margin-right:4px}
.flow-sup{margin:14px 0 0}
.sup-pill{display:inline-block;border:2px dashed currentColor;border-radius:999px;padding:6px 14px;font-size:15px;font-weight:600;opacity:.8}
.crm-mail.light .flow-out span{color:var(--on-paper)}
.result{border-top:3px solid var(--green);padding-top:14px;font-weight:600}
.crm-mail.light .result{border-top-color:var(--ink)}
.phone{margin:0;width:min(100%,360px);justify-self:center}
.phone-screen{height:min(72vh,660px);overflow-y:auto;overscroll-behavior:contain;border:10px solid #0b0b0b;border-radius:36px;background:#0b0b0b;box-shadow:0 24px 48px rgba(0,0,0,.35);scrollbar-width:thin}
.crm-mail.light .phone-screen{box-shadow:0 24px 48px rgba(0,0,0,.18)}
.phone-screen img{display:block;width:100%;height:auto}
.phone-screen:focus-visible{outline:3px solid var(--green);outline-offset:4px}
.phone figcaption{text-align:center;font-family:var(--label);font-size:14px;margin-top:12px;opacity:.75}

/* launch additions */
.skip{position:absolute;left:-9999px;top:8px;z-index:20;background:var(--green);color:var(--ink);padding:10px 16px;border-radius:999px;font-weight:700;text-decoration:none}
.skip:focus{left:12px}
.prod-links{margin:20px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.prod-links a{font-family:var(--label);font-weight:600;font-size:14px;text-decoration:none;border:2px solid currentColor;border-radius:999px;padding:6px 12px}
.prod-links a:hover{background:var(--ink);color:var(--green);border-color:var(--ink)}
.on-ink .prod-links a:hover{background:var(--green);color:var(--ink);border-color:var(--green)}
footer{flex-wrap:wrap}
footer .f-copy{flex:1 1 auto}
footer nav{display:flex;gap:16px}
footer nav a{color:var(--on-ink-dim)}
.cform{margin-top:clamp(32px,5vw,48px);max-width:760px}
.cform h3{font-family:var(--display);font-weight:800;font-size:clamp(24px,3vw,32px);letter-spacing:-.015em;margin:0 0 18px}
.cform .row{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
@media (max-width:640px){.cform .row{grid-template-columns:1fr}}
.cform input[type=email],.cform select{width:100%;font:inherit;font-size:17px;color:var(--on-paper);background:#FFFDF8;border:2px solid var(--ink);border-radius:8px;padding:12px 14px}
.cform select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.cform textarea{min-height:140px}
.cform .req{color:var(--on-paper-dim);font-weight:400;font-size:15px}
.cform .hp{position:absolute;left:-9999px}
.cform .err{color:#8A1C1C;font-weight:600;margin:10px 0 0}
.cform [aria-invalid=true]{border-color:#8A1C1C}
.cform .send[disabled]{opacity:.6;cursor:progress}
.cform-done{display:none;border-top:3px solid var(--ink);padding-top:18px;margin-top:clamp(32px,5vw,48px);max-width:760px}
.cform-done h3{font-family:var(--display);font-weight:800;font-size:clamp(28px,4vw,40px);margin:0 0 8px}
.fbx[hidden]{display:none}
.mmd-logo{max-width:min(420px,60%);width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:8px}
.tagline{font-family:var(--label);font-weight:800;font-size:clamp(22px,3vw,30px);margin:22px 0 0;color:var(--ink)}
.legal{padding:clamp(48px,8vw,104px) clamp(16px,5vw,64px)}
.legal-in{max-width:760px;margin:0 auto}
.legal h2{font-family:var(--display);font-weight:900;font-size:clamp(40px,7vw,72px);line-height:.92;letter-spacing:-.035em;margin:0 0 20px}
.legal h3{font-family:var(--display);font-weight:800;font-size:22px;margin:32px 0 8px}
.legal p,.legal li{max-width:64ch}