:root{
  --bg:#ffffff;
  --bg-deep:#1f1d1a;
  --fg:#1f1d1a;
  --fg-soft:#3b3732;
  --red:#f05a49;
  --red-soft:#ff7a68;
  --muted:#999;
  --muted-d:#666666;
  --border:#ece7df;
  --border-d:rgba(255,255,255,.07);
  --card:#f8f6f2;
  --nav:64px;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--fg);font-family:'Noto Sans JP',sans-serif;overflow-x:hidden;cursor:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;}

/* ── CURSOR ── */
#cur{width:6px;height:6px;background:var(--red);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:transform .25s,background .2s;mix-blend-mode:difference;}
#cur-r{width:34px;height:34px;border:1.5px solid rgba(17,17,17,.35);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:left .12s,top .12s,width .25s,height .25s,background .25s,border-color .25s;display:flex;align-items:center;justify-content:center;}
#cur-r.text{width:72px;height:72px;background:var(--red);border-color:var(--red);}
#cur-r .cur-lbl{font-family:'DM Mono',monospace;font-size:.55rem;letter-spacing:.1em;color:#fff;opacity:0;transform:scale(.6);transition:opacity .2s,transform .2s;text-transform:uppercase;text-align:center;line-height:1;}
#cur-r.text .cur-lbl{opacity:1;transform:scale(1);}
body.dark-cur #cur-r{border-color:rgba(245,243,239,.4);}

/* ── NAV ── */
.sitenav{
  position:fixed;top:0;left:0;right:0;z-index:500;
  height:var(--nav);display:flex;justify-content:space-between;align-items:center;
  padding:0 3rem;border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.92);backdrop-filter:blur(20px) saturate(180%);
  transition:background .35s,border-color .35s,color .35s;
}
.sitenav.on-dark{background:rgba(26,24,22,.85);border-bottom-color:rgba(255,255,255,.08);color:#f0ede8;}
.sitenav.on-dark .sn-r a{color:rgba(240,237,232,.55);}
.sitenav.on-dark .sn-r a:hover{color:#f0ede8;}
.sitenav.on-dark .lang-sw{border-left-color:rgba(255,255,255,.1);}
.sn-logo{font-family:'DM Mono',monospace;font-size:.75rem;letter-spacing:.08em;font-weight:500;display:flex;align-items:center;gap:.5rem;}
.sn-logo::before{content:'';width:8px;height:8px;background:var(--red);border-radius:50%;display:inline-block;animation:pulse 2s infinite;}
@keyframes slowdrift{
  0%,100%{transform:translate(0,0) scale(1);}
  50%{transform:translate(2%,-3%) scale(1.05);}
}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.4);opacity:.5;}}
.sn-r{display:flex;align-items:center;gap:2rem;}
.sn-r a{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color .2s;cursor:none;position:relative;}
.sn-r a:hover{color:var(--fg);}
.sn-r a::after{content:'';position:absolute;left:0;bottom:-4px;width:0;height:1px;background:var(--red);transition:width .25s;}
.sn-r a:hover::after{width:100%;}
.lang-sw{display:flex;gap:2px;border-left:1px solid var(--border);padding-left:1rem;}
.lb{background:none;border:1px solid transparent;color:var(--muted);font-family:'DM Mono',monospace;font-size:.65rem;padding:3px 8px;cursor:none;letter-spacing:.06em;transition:all .2s;}
.lb:hover,.lb.on{border-color:var(--red);color:var(--red);}
.back-btn{display:flex;align-items:center;gap:.4rem;font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--fg);background:none;border:none;cursor:none;text-decoration:none;transition:color .2s;}
.back-btn:hover{color:var(--red);}

/* ── LANG ── */
.lang-ja .zh,.lang-ja .en{display:none;}
.lang-zh .ja,.lang-zh .en{display:none;}
.lang-en .ja,.lang-en .zh{display:none;}

/* ════════════════════════════
   HERO — full bleed with Spline 3D background
════════════════════════════ */
#page-main{display:block;}

.hero{
  height:100vh;min-height:720px;
  position:relative;overflow:hidden;
  padding-top:var(--nav);
  border-bottom:1px solid var(--border);
  background:#fbfaf8;
}
.hero::before{
  content:'';position:absolute;inset:var(--nav) 0 0 48%;
  z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(251,250,248,.88) 0%,rgba(251,250,248,.18) 30%,rgba(251,250,248,0) 60%),
    radial-gradient(circle at 68% 46%,rgba(240,90,73,.18),transparent 28%);
}
.hero::after{
  content:'';position:absolute;left:3rem;right:3rem;bottom:12%;
  height:1px;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(240,90,73,.42),transparent);
  animation:linebreath 5.5s ease-in-out infinite;
}
@keyframes linebreath{0%,100%{opacity:.18;transform:translateX(-2%);}50%{opacity:.62;transform:translateX(2%);}}
.hero-grid{
  position:absolute;inset:0;
  background-image:linear-gradient(to right,rgba(17,17,17,.026) 1px,transparent 1px),linear-gradient(to bottom,rgba(17,17,17,.026) 1px,transparent 1px);
  background-size:8.333% 100%,100% 25%;
  z-index:1;pointer-events:none;
}
#hero-spline{
  position:absolute;inset:0;width:100%;height:100%;z-index:0;
  pointer-events:none;
  opacity:.45;
  filter:saturate(.7) contrast(.92);
}
.hero-inner{
  position:relative;z-index:2;
  height:100%;
  display:flex;flex-direction:column;
  padding:5rem 3rem 3rem;
}
.hero-top{
  display:flex;justify-content:space-between;align-items:flex-start;
  font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-d);
  margin-bottom:auto;
}
.hero-top-l{display:flex;flex-direction:column;gap:.4rem;}
.hero-top-r{display:flex;flex-direction:column;gap:.4rem;text-align:right;}
.hero-top .blink{display:inline-block;width:6px;height:6px;background:var(--red);border-radius:50%;margin-right:.4rem;animation:pulse 1.4s infinite;}

.hero-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3.2rem,8.2vw,8.8rem);
  line-height:1;
  letter-spacing:.01em;
  margin-bottom:1.5rem;
  text-wrap:balance;
}
/* CJK characters are wider than Bebas latin glyphs — scale down for ja/zh */
body.lang-ja .hero-title,
body.lang-zh .hero-title{
  font-family:'Noto Sans JP',sans-serif;
  font-weight:500;
  font-size:clamp(2.2rem,4.8vw,5.4rem);
  line-height:1.28;
  letter-spacing:.035em;
}
/* Stroked CJK glyphs are unreadable — use a soft tinted fill instead */
body.lang-ja .hero-title .stroke,
body.lang-zh .hero-title .stroke{
  -webkit-text-stroke:0;
  color:rgba(17,17,17,.18);
}
.hero-title .stroke{-webkit-text-stroke:1.5px var(--fg);color:transparent;}
body.lang-en .hero-title .stroke{
  -webkit-text-stroke:.7px rgba(31,29,26,.55);
  color:rgba(31,29,26,.035);
  text-shadow:0 1px 0 rgba(31,29,26,.12);
}
.hero-title .red{color:var(--red);}
.hero-title .word{display:inline-block;overflow:hidden;vertical-align:bottom;}
.hero-title .word span{display:inline-block;transform:translateY(110%);transition:transform 1s cubic-bezier(.2,.8,.2,1);}
.hero-title .word.in span{transform:translateY(0);}

.hero-bottom{
  display:grid;grid-template-columns:1.4fr 1.1fr auto;
  gap:3rem;align-items:end;
  padding-top:1.5rem;border-top:1px solid rgba(17,17,17,.12);
}
.hero-desc{font-size:.86rem;color:#444;line-height:1.85;max-width:520px;}
.hero-desc strong{color:var(--fg);font-weight:700;}
.hero-meta{display:flex;flex-direction:column;gap:.45rem;}
.hero-meta-l{font-family:'DM Mono',monospace;font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-d);}
.hero-meta-v{font-size:.84rem;font-weight:700;color:var(--fg);}
.hero-meta-v .dot{display:inline-block;width:6px;height:6px;background:#3aaf3a;border-radius:50%;margin-right:.4rem;animation:pulse 1.6s infinite;}
.hero-cta{
  display:inline-flex;align-items:center;gap:.6rem;
  background:var(--fg);color:var(--bg);
  font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  padding:14px 22px;border:none;cursor:none;
  align-self:start;text-decoration:none;
  transition:background .25s,transform .25s;
  position:relative;overflow:hidden;
}
.hero-cta:hover{background:var(--red);}
.hero-cta .arr{font-size:1rem;}

/* ── STATS BAR ── */
.stats{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--border);}
.stat{padding:2rem 2.5rem;border-right:1px solid var(--border);position:relative;overflow:hidden;cursor:none;}
.stat:last-child{border-right:none;}
.stat::before{content:'';position:absolute;inset:0;background:var(--card);transform:translateY(100%);transition:transform .4s cubic-bezier(.2,.8,.2,1);z-index:0;}
.stat:hover::before{transform:translateY(0);}
.stat>*{position:relative;z-index:1;}
.stat-n{font-family:'Bebas Neue',sans-serif;font-size:3.4rem;color:var(--red);line-height:1;margin-bottom:.2rem;letter-spacing:-.01em;}
.stat-l{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d);}

/* ════════════════════════════
   WORKS — Featured Row 01-02 + Grid 03-05
════════════════════════════ */
.sec-hdr{
  display:flex;justify-content:space-between;align-items:flex-end;
  padding:5rem 3rem 2rem;border-bottom:1px solid var(--border);
  gap:2rem;
}
.sec-hdr-l{display:flex;flex-direction:column;gap:.6rem;}
.sec-tag{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-d);}
.sec-tag::before{content:'';display:inline-block;width:18px;height:1px;background:var(--red);margin-right:.6rem;vertical-align:middle;}
.sec-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.5rem,5vw,4.5rem);line-height:.95;letter-spacing:-.005em;}
.sec-title .red{color:var(--red);}
#works .sec-title{font-size:clamp(2.1rem,4vw,3.55rem);}
.sec-meta{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-d);}

/* Featured Row - 2 columns */
.feat-row{
  display:grid;grid-template-columns:1fr 1fr;
  border-bottom:1px solid var(--border);
}
.feat-sm{
  border-right:1px solid var(--border);
  display:grid;grid-template-columns:1fr 1fr;
  cursor:none;position:relative;overflow:hidden;
  transition:background .3s;
}
.feat-sm:last-child{border-right:none;}
.feat-sm:hover{background:var(--card);}
.feat-sm::after{content:'';position:absolute;left:0;bottom:0;height:2px;background:var(--red);width:0;transition:width .4s ease;}
.feat-sm:hover::after{width:100%;}
.feat-sm-inner{
  padding:3rem 2rem;
  display:flex;flex-direction:column;gap:1.2rem;
  border-right:1px solid var(--border);
}
.feat-sm-num{
  display:flex;justify-content:space-between;align-items:center;
  font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted-d);
}
.featured-badge{
  background:rgba(176,125,58,.08) !important;
  color:#9b6730;
  border:1px solid rgba(176,125,58,.28);
  padding:3px 8px;
  font-size:.48rem;
  letter-spacing:.12em;
}
.feat-sm-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(1.35rem,2.2vw,1.9rem);
  line-height:1.12;
  letter-spacing:0;
}
.feat-sm-title .red{color:var(--red);font-size:.88em;font-weight:500;}
.feat-sm-sub{font-size:.82rem;color:#555;line-height:1.6;max-width:320px;}
.feat-sm-tags{display:flex;gap:.35rem;flex-wrap:wrap;}
.feat-sm-tag{font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.08em;text-transform:uppercase;color:var(--red);border:1px solid rgba(217,64,64,.35);padding:2px 7px;}
.feat-sm-meta{display:flex;gap:1.2rem;padding-top:1rem;border-top:1px solid var(--border);}
.feat-sm-mi{display:flex;flex-direction:column;gap:.15rem;}
.feat-sm-ml{font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d);}
.feat-sm-mv{font-size:.72rem;font-weight:700;}
.feat-sm-r{
  position:relative;overflow:hidden;
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  min-height:280px;
}
.feat-sm-r::before{
  content:'';position:absolute;
  width:120%;height:120%;left:-10%;top:-10%;
  background:none;
  filter:none;
}
.feat-sm-r-img{
  position:relative;z-index:2;
  height:75%;width:auto;
  object-fit:contain;
  mix-blend-mode:normal;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.feat-sm:hover .feat-sm-r-img{transform:scale(1.03);}
.feat-sm-r-placeholder{
  position:relative;z-index:2;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}

/* ── feat-sm tonal variants (differentiate cases without breaking layout) ── */
.feat-sm.tone-lulio .feat-sm-r{background:#fff;}
.feat-sm.tone-lulio .feat-sm-r::before{display:none;}
.feat-sm.tone-lulio .feat-sm-r-img{mix-blend-mode:normal;}
.feat-sm.tone-lulio .feat-sm-tag{color:#6a87b3;border-color:rgba(106,135,179,.35);}
.feat-sm.tone-lulio .feat-sm-title .red{color:#6a87b3;}
.feat-sm.tone-lulio::after{background:linear-gradient(to right,#6aabcf,#a080c8,#c06888);}
.feat-sm-r-img.contain{height:75%;width:auto;object-fit:contain;}

/* Grid 03-05 */
.works-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-bottom:1px solid var(--border);
}
.wcard{
  border-right:1px solid var(--border);
  padding:2rem 1.5rem 2rem;
  position:relative;cursor:none;
  display:flex;flex-direction:column;gap:1rem;
  transition:background .3s;
  overflow:hidden;
}
.wcard:nth-child(4n){border-right:none;}
.wcard:nth-child(n+5){border-top:1px solid var(--border);}
.wcard:hover{background:var(--card);}
.wcard::after{content:'';position:absolute;bottom:0;left:0;height:2px;background:var(--red);width:0;transition:width .4s ease;}
.wcard:hover::after{width:100%;}
.wcard-num{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.15em;color:var(--muted-d);display:flex;justify-content:space-between;align-items:center;}
.wcard-num .arr{color:var(--red);font-size:.9rem;opacity:0;transform:translate(-6px,6px);transition:all .3s;}
.wcard:hover .wcard-num .arr{opacity:1;transform:translate(0,0);}
.wcard-thumb{
  width:100%;aspect-ratio:4/3;
  background:var(--card);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  position:relative;
}
.wcard-thumb-inner{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.wcard:hover .wcard-thumb-inner{transform:scale(1.06);}
.wcard-tags{display:flex;gap:.3rem;flex-wrap:wrap;}
.wcard-tag{font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.08em;text-transform:uppercase;color:var(--red);border:1px solid rgba(217,64,64,.3);padding:2px 6px;}
.wcard-title{font-size:.98rem;font-weight:600;line-height:1.35;}
.wcard-sub{font-family:'DM Mono',monospace;font-size:.6rem;color:var(--muted-d);letter-spacing:.04em;}
.wcard-desc{font-size:.78rem;color:#666;line-height:1.7;}
.wcard-status{
  font-family:'DM Mono',monospace;font-size:.55rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  margin-top:auto;display:flex;align-items:center;gap:.4rem;
}
.wcard-status::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--muted);}
.wcard-status.live::before{background:#3aaf3a;}
.wcard-status.live{color:#3aaf3a;}

/* ════════════════════════════
   ABOUT — DARK SECTION
════════════════════════════ */
.about-dark{
  background:var(--bg-deep);color:#f0f0f0;
  border-bottom:1px solid var(--border);
  position:relative;overflow:hidden;
}
.about-dark .sec-hdr{border-bottom-color:rgba(255,255,255,.08);}
.about-dark .sec-tag{color:rgba(240,237,232,.5);}
.about-dark .sec-tag::before{background:var(--red);}
.about-dark .sec-meta{color:rgba(240,237,232,.5);}
.about-bg-text{
  position:absolute;font-family:'Bebas Neue',sans-serif;
  font-size:28rem;line-height:.7;letter-spacing:-.02em;
  color:rgba(255,255,255,.025);
  pointer-events:none;user-select:none;
  bottom:-3rem;left:-1rem;
  z-index:0;
}
.about-grid{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1.2fr 1fr;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.about-l{padding:5rem 3rem;border-right:1px solid rgba(255,255,255,.08);}
.about-r{padding:5rem 3rem;}
.about-ey{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:1.5rem;}
.about-hl{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.2rem,4.5vw,4rem);line-height:.95;margin-bottom:1.8rem;letter-spacing:-.005em;}
.about-hl .red{color:var(--red);}
.about-hl .stroke{-webkit-text-stroke:1.5px #f0f0f0;color:transparent;}
.about-body{font-size:.92rem;color:rgba(240,237,232,.72);line-height:1.9;max-width:520px;}
.about-body strong{color:#f0f0f0;font-weight:700;}
.about-quote{
  font-size:1.1rem;font-weight:700;line-height:1.55;color:#f0f0f0;
  border-left:2px solid var(--red);padding-left:1.5rem;margin:2rem 0 0;
  font-style:italic;max-width:480px;
}

/* Timeline */
.tl-title{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:2rem;}
.tl-item{
  display:grid;grid-template-columns:110px 14px 1fr;gap:1.2rem;
  padding:1.4rem 0;border-bottom:1px solid rgba(255,255,255,.06);
  position:relative;
}
.tl-item:first-of-type{border-top:1px solid rgba(255,255,255,.06);}
.tl-yr{font-family:'DM Mono',monospace;font-size:.6rem;color:var(--red);letter-spacing:.06em;padding-top:3px;}
.tl-dot{display:flex;justify-content:center;padding-top:6px;}
.tl-dot span{width:8px;height:8px;border-radius:50%;background:var(--red);position:relative;}
.tl-dot span::after{content:'';position:absolute;top:50%;left:50%;width:24px;height:24px;border:1px solid rgba(217,64,64,.3);border-radius:50%;transform:translate(-50%,-50%);}
.tl-item.now .tl-dot span{box-shadow:0 0 0 0 rgba(217,64,64,.7);animation:tlpulse 2s infinite;}
@keyframes tlpulse{0%{box-shadow:0 0 0 0 rgba(217,64,64,.7);}70%{box-shadow:0 0 0 12px rgba(217,64,64,0);}100%{box-shadow:0 0 0 0 rgba(217,64,64,0);}}
.tl-c-title{font-size:.88rem;font-weight:700;margin-bottom:.25rem;color:#f0ede8;}
.tl-c-sub{font-size:.74rem;color:rgba(240,237,232,.5);line-height:1.55;}

/* ── SKILLS — horizontal cloud ── */
.skills{
  position:relative;z-index:1;
  padding:4rem 3rem;border-bottom:1px solid rgba(255,255,255,.08);
}
.skills-rows{display:flex;flex-direction:column;gap:2.2rem;margin-top:2rem;}
.skill-row{display:grid;grid-template-columns:140px 1fr;gap:2rem;align-items:start;}
.skill-row-l{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);padding-top:.4rem;}
.skill-row-r{display:flex;flex-wrap:wrap;gap:.5rem;}
.skill-pill{
  font-size:.82rem;font-weight:400;
  padding:.45rem 1rem;
  border:1px solid rgba(255,255,255,.15);
  color:rgba(240,237,232,.85);
  border-radius:999px;
  transition:all .25s;cursor:none;
}
.skill-pill:hover{border-color:var(--red);color:var(--red);background:rgba(217,64,64,.06);transform:translateY(-2px);}
.skill-pill.primary{background:rgba(217,64,64,.12);border-color:rgba(217,64,64,.4);color:#f0a8a8;}
.skill-pill.primary:hover{background:var(--red);color:#fff;border-color:var(--red);}

/* ════════════════════════════
   CONTACT — full bleed
════════════════════════════ */
.contact{
  padding:7rem 3rem;
  position:relative;overflow:hidden;
  background:var(--bg);
  border-bottom:1px solid var(--border);
}
.contact-bg{
  position:absolute;inset:0;z-index:0;
  background-image:
    radial-gradient(circle at 20% 30%,rgba(217,64,64,.08) 0%,transparent 50%),
    radial-gradient(circle at 80% 70%,rgba(127,176,105,.08) 0%,transparent 50%);
  filter:blur(20px);
  animation:slowdrift 22s ease-in-out infinite;
}
.contact-inner{position:relative;z-index:1;}
.contact-ey{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-d);margin-bottom:2rem;}
.contact-ey::before{content:'';display:inline-block;width:18px;height:1px;background:var(--red);margin-right:.6rem;vertical-align:middle;}
.contact-hl{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4rem,12vw,12rem);
  line-height:.86;letter-spacing:-.012em;
  margin-bottom:3rem;
}
.contact-hl .stroke{-webkit-text-stroke:1.5px var(--fg);color:transparent;}
.contact-hl .red{color:var(--red);}
.contact-row{
  display:grid;grid-template-columns:1.6fr 1fr 1fr;
  gap:2rem;padding-top:2rem;
  border-top:1px solid var(--border);
}
.contact-mail{
  font-family:'DM Mono',monospace;
  font-weight:500;
  font-size:clamp(1.1rem,2.2vw,2rem);
  text-decoration:none;color:var(--fg);
  display:inline-flex;align-items:center;gap:1rem;
  letter-spacing:-.01em;cursor:none;
  position:relative;
  text-transform:none;
}
.contact-mail::after{content:'↗';color:var(--red);font-size:.8em;transition:transform .3s;}
.contact-mail:hover::after{transform:translate(4px,-4px);}
.contact-mail .underline{position:relative;}
.contact-mail .underline::after{content:'';position:absolute;left:0;right:0;bottom:6px;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .35s;}
.contact-mail:hover .underline::after{transform:scaleX(1);}
.contact-info{display:flex;flex-direction:column;gap:.4rem;}
.contact-info-l{font-family:'DM Mono',monospace;font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-d);}
.contact-info-v{font-size:.92rem;font-weight:700;color:var(--fg);}
.contact-info-v .dot{display:inline-block;width:7px;height:7px;background:#3aaf3a;border-radius:50%;margin-right:.5rem;animation:pulse 1.6s infinite;}

/* ── FOOTER ── */
.footer{
  background:var(--bg-deep);color:rgba(240,237,232,.5);
  padding:1.4rem 3rem;
  display:flex;justify-content:space-between;align-items:center;
  font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.12em;
}
.footer .red{color:var(--red);}

/* ── Reveal ── */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1);}
.reveal.vis{opacity:1;transform:none;}
.reveal-stagger>*{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1);}
.reveal-stagger.vis>*{opacity:1;transform:none;}
.reveal-stagger.vis>*:nth-child(1){transition-delay:.05s;}
.reveal-stagger.vis>*:nth-child(2){transition-delay:.12s;}
.reveal-stagger.vis>*:nth-child(3){transition-delay:.19s;}
.reveal-stagger.vis>*:nth-child(4){transition-delay:.26s;}

/* ════════════════════════════
   DETAIL PAGE
════════════════════════════ */
#page-detail{display:none;padding-top:var(--nav);}

.d-hero{
  min-height:90vh;
  display:grid;grid-template-columns:1.05fr 1fr;
  border-bottom:1px solid var(--border);
  position:relative;
}
.d-hero-l{
  padding:5rem 3rem;
  display:flex;flex-direction:column;justify-content:center;gap:2rem;
  border-right:1px solid var(--border);
  position:relative;
}
.d-hero-num{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.2em;color:var(--muted-d);text-transform:uppercase;}
.d-hero-num .red{color:var(--red);}
.d-hero-title{font-family:'Noto Sans JP',sans-serif;font-size:clamp(2.8rem,5.4vw,6.2rem);font-weight:500;line-height:1.12;letter-spacing:.035em;}
.d-hero-jp{font-family:'Noto Sans JP',sans-serif;font-size:clamp(1.35rem,2.5vw,2.2rem);font-weight:500;line-height:1.55;letter-spacing:.02em;}
.d-hero-jp .red{color:var(--red);}
.d-hero-tag{font-size:1rem;color:#444;line-height:1.75;max-width:440px;font-weight:400;}
.d-hero-tag strong{color:var(--fg);font-weight:700;}
.d-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem 2rem;padding-top:1.5rem;border-top:1px solid var(--border);}
.d-mi{display:flex;flex-direction:column;gap:.2rem;}
.d-ml{font-family:'DM Mono',monospace;font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-d);}
.d-mv{font-size:.85rem;font-weight:700;}
.d-hero-r{
  display:flex;align-items:center;justify-content:center;
  background:#ffffff;
  overflow:hidden;position:relative;
}
.d-hero-r::before{
  /* very subtle vignette only — no color wash that would tint the artwork */
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 60%,transparent 55%,rgba(17,17,17,.05) 100%);
  pointer-events:none;
}
/* dotted-grid texture for visual richness without polluting the image */
.d-hero-r::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:radial-gradient(circle,rgba(17,17,17,.07) 1px,transparent 1.4px);
  background-size:24px 24px;
  mask-image:linear-gradient(to bottom,transparent 0%,#000 30%,#000 70%,transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 30%,#000 70%,transparent 100%);
  opacity:.55;
}
.d-hero-r img{height:88%;width:auto;position:relative;z-index:2;filter:drop-shadow(0 30px 60px rgba(17,17,17,.18)) drop-shadow(0 8px 18px rgba(17,17,17,.08));}
.d-hero-r-corners{
  position:absolute;inset:0;z-index:3;pointer-events:none;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:2rem;
  font-family:'DM Mono',monospace;font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-d);
}
.d-hero-r-corners>div{display:flex;justify-content:space-between;}

/* Section base */
.d-sec{border-bottom:1px solid var(--border);}
.d-lbl{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:.8rem;}
.d-lbl::before{content:'';display:inline-block;width:14px;height:1px;background:var(--red);margin-right:.5rem;vertical-align:middle;}
.d-h2{font-family:'Noto Sans JP',sans-serif;font-size:clamp(1.55rem,2.7vw,2.65rem);font-weight:500;line-height:1.45;margin-bottom:1.3rem;letter-spacing:.015em;}
.d-h2 .red{color:var(--red);}
.d-body{font-size:.9rem;color:#555;line-height:1.85;}

/* Overview */
.d-overview{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;}
.d-ov-t{padding:5rem 3rem;border-right:1px solid var(--border);}
.d-ov-s{padding:3.5rem 2rem;border-right:1px solid var(--border);display:flex;flex-direction:column;justify-content:flex-end;gap:.4rem;position:relative;overflow:hidden;}
.d-ov-s:last-child{border-right:none;}
.d-ov-s::before{content:'';position:absolute;inset:0;background:var(--card);transform:translateY(100%);transition:transform .4s cubic-bezier(.2,.8,.2,1);z-index:0;}
.d-ov-s:hover::before{transform:translateY(0);}
.d-ov-s>*{position:relative;z-index:1;}
.d-big-n{font-family:'Bebas Neue',sans-serif;font-size:3.6rem;color:var(--red);line-height:1;letter-spacing:-.01em;}
.d-small-l{font-family:'DM Mono',monospace;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d);}
.d-small-s{font-size:.78rem;color:#777;line-height:1.5;margin-top:.2rem;}

/* Problem (dark) */
.d-problem{display:grid;grid-template-columns:1fr 1fr;background:var(--bg-deep);}
.d-prob-l{padding:5rem 3rem;border-right:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;justify-content:center;gap:2rem;}
.d-prob-q{font-size:clamp(1.4rem,2.6vw,2rem);font-weight:700;color:#f0f0f0;line-height:1.45;border-left:3px solid var(--red);padding-left:1.5rem;}
.d-prob-attr{font-family:'DM Mono',monospace;font-size:.6rem;color:rgba(255,255,255,.3);letter-spacing:.1em;text-transform:uppercase;}
.d-prob-body{font-size:.88rem;color:rgba(240,237,232,.6);line-height:1.85;}
.d-prob-r{padding:5rem 3rem;display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-content:center;}
.d-pi{background:rgba(255,255,255,.03);padding:2rem 1.8rem;border:1px solid rgba(255,255,255,.07);transition:all .3s;}
.d-pi:hover{background:rgba(217,64,64,.08);border-color:rgba(217,64,64,.3);transform:translateY(-3px);}
.d-pi-icon{font-family:'Bebas Neue',sans-serif;font-size:2.4rem;color:var(--red);margin-bottom:.5rem;line-height:1;}
.d-pi-title{font-size:.9rem;font-weight:700;color:#f0f0f0;margin-bottom:.3rem;}
.d-pi-body{font-size:.76rem;color:rgba(240,237,232,.55);line-height:1.55;}

/* Research */
.d-research{display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:hidden;}
.d-research::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(circle at 10% 20%,rgba(217,64,64,.04) 0%,transparent 40%),
    radial-gradient(circle at 90% 80%,rgba(127,176,105,.04) 0%,transparent 40%);
  pointer-events:none;z-index:0;
}
.d-res-l{padding:5rem 3rem;border-right:1px solid var(--border);position:relative;z-index:1;}
.d-res-r{padding:5rem 3rem;position:relative;z-index:1;}
.d-res-l::after{
  content:'';position:absolute;top:50%;right:-1px;width:1px;height:60%;
  background:linear-gradient(to bottom,transparent,var(--red),transparent);
  opacity:.3;transform:translateY(-50%);
}
.d-pc{
  background:#fff;border:1px solid var(--border);padding:1.8rem;
  margin-bottom:1rem;transition:all .35s cubic-bezier(.2,.8,.2,1);
  position:relative;overflow:hidden;
}
.d-pc::before{
  content:'';position:absolute;top:0;left:0;width:3px;height:0;
  background:linear-gradient(to bottom,var(--red),rgba(217,64,64,.3));
  transition:height .35s;
}
.d-pc:hover{border-color:rgba(217,64,64,.3);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.06);}
.d-pc:hover::before{height:100%;}
.d-pc:last-child{margin-bottom:0;}
.d-pc-top{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;}
.d-pc-av{
  width:48px;height:48px;
  background:linear-gradient(135deg,#e8e4de 0%,#d4d0c8 100%);
  color:var(--fg);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;font-weight:700;flex-shrink:0;
  border:2px solid var(--border);
  transition:all .3s;
  position:relative;overflow:hidden;
}
.d-pc-av::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(217,64,64,.1) 0%,transparent 50%);
  opacity:0;transition:opacity .3s;
}
.d-pc:hover .d-pc-av{border-color:var(--red);transform:scale(1.05);}
.d-pc:hover .d-pc-av::before{opacity:1;}
.d-pc-av.lin{background:linear-gradient(135deg,#7ec8e3,#5ba3c0);color:#fff;border-color:#7ec8e3;}
.d-pc-av.yuki{background:linear-gradient(135deg,#f4a6b8,#e07a94);color:#fff;border-color:#f4a6b8;}
.d-pc-av.zhang{background:linear-gradient(135deg,#7FB069,#5a9048);color:#fff;border-color:#7FB069;}
.d-pc-name{font-size:.92rem;font-weight:700;}
.d-pc-role{font-family:'DM Mono',monospace;font-size:.56rem;color:var(--muted);margin-top:.15rem;}
.d-pc-q{
  font-size:.86rem;color:#444;font-style:italic;
  border-left:2px solid var(--red);padding-left:1rem;
  line-height:1.6;margin-bottom:.8rem;
  position:relative;
}
.d-pc-q::before{content:'"';position:absolute;left:-.3rem;top:-.2rem;font-size:1.2rem;color:var(--red);opacity:.3;}
.d-ptag{
  display:inline-block;font-family:'DM Mono',monospace;font-size:.5rem;
  padding:3px 8px;border:1px solid rgba(217,64,64,.35);
  color:var(--red);margin:3px 3px 0 0;letter-spacing:.05em;text-transform:uppercase;
  background:rgba(217,64,64,.04);
  transition:all .2s;
}
.d-pc:hover .d-ptag{border-color:var(--red);background:rgba(217,64,64,.08);}
.d-ins{
  padding:1.8rem 0;border-bottom:1px solid var(--border);
  position:relative;transition:all .3s;
}
.d-ins:hover{padding-left:.5rem;}
.d-ins:first-child{border-top:1px solid var(--border);}
.d-ins-num{
  font-family:'DM Mono',monospace;font-size:.56rem;color:var(--red);
  letter-spacing:.14em;margin-bottom:.6rem;
  display:flex;align-items:center;gap:.5rem;
}
.d-ins-num::after{content:'';flex:1;height:1px;background:linear-gradient(to right,rgba(217,64,64,.2),transparent);}
.d-ins-title{font-size:.96rem;font-weight:700;line-height:1.4;margin-bottom:.4rem;}
.d-ins-body{font-size:.8rem;color:#666;line-height:1.65;}

/* Color */
.d-color-sec{display:grid;grid-template-columns:3fr 2fr;}
.d-color-grid{display:grid;grid-template-columns:repeat(3,1fr);border-right:1px solid var(--border);}
.d-ci-swatch{height:140px;position:relative;cursor:none;overflow:hidden;}
.d-ci-swatch::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.06);opacity:0;transition:opacity .3s;}
.d-ci-swatch:hover::after{opacity:1;}
.d-ci-info{padding:.9rem 1.1rem;border-top:1px solid var(--border);border-right:1px solid var(--border);}
.d-color-grid > div:nth-child(3n) .d-ci-info{border-right:none;}
.d-ci-name{font-size:.82rem;font-weight:700;margin-bottom:.15rem;}
.d-ci-hex{font-family:'DM Mono',monospace;font-size:.56rem;color:var(--muted);letter-spacing:.05em;}
.d-color-txt{padding:5rem 3rem;display:flex;flex-direction:column;justify-content:center;gap:1rem;}

/* Walkthrough */
.d-wt-hdr{padding:5rem 3rem 2rem;display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;}
.d-wt-hdr-r{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-d);}
.d-step-tabs{display:flex;border-top:1px solid var(--border);border-bottom:1px solid var(--border);overflow-x:auto;-webkit-overflow-scrolling:touch;}
.d-st{flex:1;padding:1.6rem 1.4rem;cursor:none;border-right:1px solid var(--border);transition:background .2s;position:relative;user-select:none;}
.d-st:last-child{border-right:none;}
.d-st:hover:not(.on){background:var(--card);}
.d-st.on{background:var(--bg-deep);}
.d-st-num{font-family:'DM Mono',monospace;font-size:.55rem;color:var(--muted);margin-bottom:.4rem;letter-spacing:.14em;}
.d-st.on .d-st-num{color:rgba(255,255,255,.35);}
.d-st-name{font-size:.86rem;font-weight:700;}
.d-st.on .d-st-name{color:#f0ede8;}
.d-st-bar{position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--red);transform:scaleX(0);transition:transform .3s;}
.d-st.on .d-st-bar{transform:scaleX(1);}
.d-sub-tabs{display:flex;gap:.5rem;padding:2rem 3rem 0;justify-content:center;flex-wrap:wrap;}
.d-sub-t{font-family:'DM Mono',monospace;font-size:.6rem;padding:6px 14px;border:1px solid var(--border);cursor:none;letter-spacing:.06em;background:none;color:var(--muted-d);transition:all .2s;}
.d-sub-t.on{background:var(--bg-deep);color:#f0f0f0;border-color:var(--bg-deep);}
.d-ann-wrap{padding:4rem 3rem 5rem;position:relative;display:flex;justify-content:center;background:#fff;}
.d-ann-svg{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;}
.d-phone-img{display:block;height:500px;width:auto;flex-shrink:0;position:relative;z-index:1;mix-blend-mode:normal;}
.d-ann-item{position:absolute;z-index:2;}
.d-ann-num{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:var(--red);color:#fff;font-family:'DM Mono',monospace;font-size:.6rem;font-weight:700;margin-bottom:.3rem;}
.d-ann-title{font-size:.88rem;font-weight:700;margin-bottom:.15rem;line-height:1.25;}
.d-ann-sub{font-size:.74rem;color:#777;line-height:1.45;max-width:240px;}
.d-wt-panel{display:none;background:var(--bg);}
.d-wt-panel.on{display:block;}

/* All screens */
.d-all-screens{padding:5rem 3rem;background:#fff;}
.d-scr-scroll{display:flex;gap:2rem;overflow-x:auto;margin-top:2rem;padding:.5rem 0 1.2rem;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;background:#fff;}
.d-scr-scroll::-webkit-scrollbar{height:3px;}
.d-scr-scroll::-webkit-scrollbar-track{background:var(--card);}
.d-scr-scroll::-webkit-scrollbar-thumb{background:var(--red);}
.d-scr-item{flex-shrink:0;text-align:center;scroll-snap-align:start;padding:0;background:transparent;border:none;transition:transform .35s;}
.d-scr-item img{height:360px;width:auto;display:block;mix-blend-mode:normal;transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.d-scr-item:hover{transform:translateY(-2px);}
.d-scr-item:hover img{transform:scale(1.012);}
.d-scr-lbl{font-family:'DM Mono',monospace;font-size:.58rem;color:var(--muted-d);margin-top:.8rem;letter-spacing:.1em;text-transform:uppercase;}

/* Outcome */
.d-outcome{display:grid;grid-template-columns:repeat(3,1fr);background:var(--bg-deep);border-top:1px solid rgba(255,255,255,.07);}
.d-out{padding:4rem 3rem;border-right:1px solid rgba(255,255,255,.07);position:relative;overflow:hidden;}
.d-out:last-child{border-right:none;}
.d-out::before{content:'';position:absolute;left:0;top:0;width:100%;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .5s;}
.d-out.vis::before{transform:scaleX(1);}
.d-out-n{font-family:'Bebas Neue',sans-serif;font-size:4rem;color:var(--red);line-height:1;margin-bottom:.5rem;letter-spacing:-.01em;}
.d-out-l{font-size:.9rem;font-weight:700;margin-bottom:.3rem;color:#f0ede8;}
.d-out-s{font-size:.78rem;color:rgba(240,237,232,.5);line-height:1.55;}

/* ════════════════════════════
   DETAIL PAGE TONAL DIFFERENTIATION
   .d-mottainai = warm earth + waste-bag color codes (red/orange/green/yellow)
   .d-lulio     = cool dawn aurora (blue→purple→rose), softer light, deeper rests
════════════════════════════ */
/* shared decorative ticker rails */
.d-rail{
  position:absolute;top:0;bottom:0;width:38px;z-index:5;pointer-events:none;
  display:flex;align-items:flex-start;justify-content:center;
  font-family:'DM Mono',monospace;font-size:.52rem;letter-spacing:.32em;
  text-transform:uppercase;color:var(--muted-d);
  border-right:1px solid var(--border);
}
.d-rail.right{right:0;border-right:none;border-left:1px solid var(--border);}
.d-rail.left{left:0;}
.d-rail span{writing-mode:vertical-rl;transform:rotate(180deg);padding:1.5rem 0;white-space:nowrap;}
.d-rail::after{content:'';position:absolute;top:50%;left:50%;width:5px;height:5px;border-radius:50%;background:var(--red);transform:translate(-50%,-50%);box-shadow:0 0 0 4px rgba(217,64,64,.12);}
.d-lulio .d-rail::after{background:#6aabcf;box-shadow:0 0 0 4px rgba(106,171,207,.16);}

/* Mottainai — paper / earth */
.d-mottainai .d-hero{
  background:#fff;
}
.d-mottainai .d-hero-l{padding-left:3.5rem;padding-right:3.5rem;}
.d-mottainai .d-hero-l::before{
  content:'CASE / 04 — MOTTAINAI — 物品処分 — 60秒で完結 — ';
  position:absolute;top:0;left:0;height:100%;width:38px;
  display:flex;align-items:center;justify-content:center;
  border-right:1px solid var(--border);
  font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.32em;color:var(--muted-d);
  writing-mode:vertical-rl;text-transform:uppercase;
  display:none;
}
.d-mottainai .d-hero-r{
  background:#fff;
}
/* Mottainai detail hero-r: pure white, no textures, no shadows */
.d-mottainai .d-hero-r{
  background:#fff;
}
.d-mottainai .d-hero-r::before{display:none;}
.d-mottainai .d-hero-r::after{display:none;}
.d-mottainai .d-hero-r img{filter:none;mix-blend-mode:normal;}
/* corner crosshairs */
.d-mottainai .d-hero{position:relative;}
.d-mottainai .d-hero::before,
.d-mottainai .d-hero::after,
.d-lulio .d-hero::before,
.d-lulio .d-hero::after{
  content:'';position:absolute;width:18px;height:18px;border:1px solid var(--red);z-index:10;
}
.d-mottainai .d-hero::before,
.d-mottainai .d-hero::after{display:none;}
.d-lulio .d-hero::before{top:14px;left:14px;border-right:none;border-bottom:none;border-color:#6aabcf;}
.d-lulio .d-hero::after{bottom:14px;right:14px;border-left:none;border-top:none;border-color:#c06080;}

/* LULIO — cool dawn */
.d-lulio .d-hero{
  background:
    radial-gradient(ellipse at 18% 12%,rgba(106,171,207,.18) 0,transparent 45%),
    radial-gradient(ellipse at 82% 88%,rgba(192,96,128,.14) 0,transparent 45%),
    radial-gradient(ellipse at 88% 18%,rgba(160,128,200,.14) 0,transparent 40%),
    linear-gradient(180deg,#f8f8f8 0%,#f5f5f5 100%);
}
.d-lulio .d-hero-l::before{
  content:'CASE / 05 — LULIO — 聴覚 × 触覚 — 深いリラックス — ';
  position:absolute;top:0;left:0;height:100%;width:38px;
  display:flex;align-items:center;justify-content:center;
  border-right:1px solid var(--border);
  font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.32em;color:#6a87b3;
  writing-mode:vertical-rl;text-transform:uppercase;
  background:linear-gradient(180deg,rgba(106,171,207,.06),rgba(192,96,128,.06));
}
.d-lulio .d-hero-l{padding-left:5rem;padding-right:3.5rem;}
.d-lulio .d-hero-num .red,
.d-lulio .d-hero-jp .red,
.d-lulio .d-hero-title{color:#6aabcf !important;}
.d-lulio .d-hero-title{
  background:linear-gradient(135deg,#4a9ab5,#8a6aaf 55%,#c06080);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.d-lulio .d-hero-r{
  background:#fff;
}
.d-lulio .d-hero-r::before{display:none;}
.d-lulio .d-hero-r::after{display:none;}
.d-lulio .d-hero-r img{filter:none;mix-blend-mode:normal;}
.d-lulio .d-hero-r-corners{color:#6a87b3;}
.d-lulio .d-lbl{color:#6aabcf;}
.d-lulio .d-lbl::before{background:#6aabcf;}
.d-lulio .d-h2 .red{color:#6aabcf;}
.d-lulio .d-prob-q{border-left-color:#6aabcf;}
.d-lulio .d-pi-icon{color:#a080c8;}
.d-lulio .d-pi:hover{background:rgba(106,171,207,.08);border-color:rgba(106,171,207,.3);}
.d-lulio .d-big-n{color:#6aabcf;}
.d-lulio .d-prob-q{color:#f0ede8;}
.d-lulio .d-problem{
  background:
    radial-gradient(ellipse at 80% 20%,rgba(106,171,207,.08) 0,transparent 50%),
    radial-gradient(ellipse at 10% 90%,rgba(192,96,128,.05) 0,transparent 50%),
    #0d1620;
}
.d-lulio .featured-badge{background:#6a87b3;}

/* Mottainai accents */
.d-mottainai{
  --m-red:#f05a49;
  --m-green:#7f9f66;
  --m-yellow:#e1b84b;
  --m-blue:#759bb4;
  --m-paper:#fff;
  --m-ink:#2d2924;
}
.d-mottainai .d-overview{background:var(--m-paper);}
.d-mottainai .d-research::before{
  background:
    radial-gradient(circle at 10% 20%,rgba(127,176,105,.06) 0%,transparent 40%),
    radial-gradient(circle at 90% 80%,rgba(232,197,71,.05) 0%,transparent 40%),
    radial-gradient(circle at 50% 50%,rgba(217,64,64,.03) 0%,transparent 50%);
}
.m-brief{
  display:grid;grid-template-columns:1.15fr 1fr;
  min-height:480px;background:#fff;
  border-bottom:1px solid var(--border);
}
.m-brief-l{padding:4.5rem 3rem;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--border);}
.m-brief-kicker{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--m-red);margin-bottom:1.2rem;}
.m-brief-title{font-family:'Noto Sans JP',sans-serif;font-size:clamp(1.9rem,3.8vw,4rem);font-weight:500;line-height:1.45;letter-spacing:.025em;max-width:760px;}
.m-brief-title .tone{color:var(--m-red);}
.m-brief-note{max-width:620px;font-size:.92rem;line-height:1.9;color:#5f5850;margin-top:2rem;}
.m-brief-r{padding:4rem 3rem;display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-content:center;background:#fff;}
.m-ticket{
  border:none;border-top:1px solid var(--border);background:#fff;padding:1.2rem 0;min-height:128px;
  display:flex;flex-direction:column;justify-content:space-between;position:relative;
}
.m-ticket::before{content:'';position:absolute;top:-1px;left:0;width:38px;height:1px;background:var(--ticket,#f05a49);}
.m-ticket-l{font-family:'DM Mono',monospace;font-size:.52rem;letter-spacing:.16em;text-transform:uppercase;color:#8b8176;}
.m-ticket-v{font-family:'Noto Sans JP',sans-serif;font-size:clamp(1.9rem,3vw,3rem);font-weight:500;line-height:1.2;color:var(--ticket,#f05a49);}
.m-ticket-s{font-size:.78rem;line-height:1.55;color:#6a6259;}
.m-decision{
  display:grid;grid-template-columns:1fr 1.2fr;
  background:#fff;border-bottom:1px solid var(--border);
}
.m-decision-l{padding:5rem 3rem;border-right:1px solid var(--border);}
.m-route{padding:5rem 3rem;display:flex;flex-direction:column;gap:.8rem;background:#fff;}
.m-route-row{
  display:grid;grid-template-columns:84px 1fr auto;gap:1rem;align-items:center;
  padding:1rem 0;border:none;border-bottom:1px solid var(--border);background:#fff;
}
.m-route-code{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:#8b8176;}
.m-route-track{height:10px;background:#eee6dc;position:relative;overflow:hidden;}
.m-route-track span{display:block;height:100%;width:var(--w);background:var(--c);transform-origin:left;animation:routebreath 4.8s ease-in-out infinite;}
@keyframes routebreath{0%,100%{transform:scaleX(.96);opacity:.72;}50%{transform:scaleX(1);opacity:1;}}
.m-route-label{font-size:.86rem;font-weight:700;color:var(--m-ink);}
.m-route-meta{font-family:'DM Mono',monospace;font-size:.54rem;color:#8b8176;letter-spacing:.08em;}
.m-insight-board{
  display:grid;grid-template-columns:1fr 1fr 1fr;background:#fff;color:var(--m-ink);
  border-bottom:1px solid var(--border);
}
.m-insight-card{padding:3rem 2.4rem;border-right:1px solid var(--border);min-height:300px;display:flex;flex-direction:column;justify-content:space-between;}
.m-insight-card:last-child{border-right:none;}
.m-insight-no{font-family:'DM Mono',monospace;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;color:#9a9188;}
.m-insight-title{font-size:clamp(1rem,1.45vw,1.28rem);font-weight:500;line-height:1.85;color:var(--m-ink);margin:1.2rem 0;}
.m-insight-body{font-size:.78rem;line-height:1.9;color:#6c645b;}
.m-insight-mark{font-family:'DM Mono',monospace;font-size:1.05rem;line-height:1;color:var(--mark,#f05a49);opacity:.9;}
.m-color-system{
  display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--border);background:#fff;
}
.m-color-copy{padding:5rem 3rem;border-right:1px solid var(--border);display:flex;flex-direction:column;justify-content:center;}
.m-color-use{padding:4rem 3rem;background:var(--m-paper);display:grid;gap:.8rem;align-content:center;}
.m-color-rule{display:grid;grid-template-columns:54px 1fr;gap:1rem;align-items:start;padding:1rem;background:#fff;border:1px solid var(--border);}
.m-color-dot{width:54px;height:54px;background:var(--c);border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);}
.m-color-rule h4{font-size:.9rem;margin-bottom:.25rem;}
.m-color-rule p{font-size:.76rem;line-height:1.6;color:#6a6259;}
.m-walk-note{
  padding:0 3rem 3rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;background:#fff;
}
.m-walk-chip{border:none;border-top:1px solid var(--border);padding:1.1rem 0;background:#fff;}
.m-walk-chip b{display:block;font-family:'DM Mono',monospace;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--m-red);margin-bottom:.45rem;}
.m-walk-chip span{font-size:.78rem;color:#60584f;line-height:1.6;}
/* edge ticker on detail sections */
.d-sec{position:relative;}
.d-sec::before{
  content:attr(data-idx);
  position:absolute;top:1rem;right:1.2rem;z-index:4;
  font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.2em;
  color:var(--muted);text-transform:uppercase;pointer-events:none;
}
.d-lulio .d-sec::before{color:rgba(106,135,179,.55);}

/* mobile */
@media (max-width:920px){
  /* === Base === */
  body{cursor:auto;}
  #cur,#cur-r{display:none;}

  /* === Homepage === */
  .hero{height:auto;min-height:auto;}
  .hero-bottom{grid-template-columns:1fr;}
  .hero-inner,.sec-hdr,.feat-sm-inner,.about-l,.about-r,.skills,.contact{padding-left:1.2rem;padding-right:1.2rem;}
  .feat-row,.feat-sm{grid-template-columns:1fr;}
  .feat-row{display:grid;grid-template-columns:1fr;}
  .feat-sm-inner{border-right:none !important;border-bottom:1px solid var(--border);}
  .feat-sm,.feat-sm.tone-lulio{grid-template-columns:1fr;grid-template-rows:auto auto;min-height:auto;}
  .feat-sm-r,.feat-sm.tone-lulio .feat-sm-r{border-right:none !important;border-bottom:1px solid var(--border);min-height:260px;}
  .works-grid{grid-template-columns:1fr;}
  .wcard{border-right:none !important;border-top:1px solid var(--border);min-height:auto;}
  .wcard:nth-child(odd){border-right:none !important;}
  .wcard:nth-child(n+3){border-top:1px solid var(--border);}
  .stats{grid-template-columns:1fr 1fr;}
  .stat:nth-child(2n){border-right:none;}
  .stat:nth-child(n+3){border-top:1px solid var(--border);}
  .about-grid{grid-template-columns:1fr;}
  .about-l,.about-r{border-right:none !important;border-bottom:1px solid var(--border);}
  .skill-row{grid-template-columns:1fr;gap:.6rem;}
  .sn-r{gap:1rem;}
  .sn-r a:not(.lb){display:none;}
  .sitenav{padding:0 1.2rem;}
  .contact-row{grid-template-columns:1fr;}
  .m-brief,.m-decision,.m-color-system{grid-template-columns:1fr;}
  .m-brief-l,.m-decision-l,.m-color-copy{padding:3rem 1.2rem;border-right:none;border-bottom:1px solid var(--border);}
  .m-brief-r,.m-route,.m-color-use{padding:2rem 1.2rem;grid-template-columns:1fr;}
  .m-insight-board{grid-template-columns:1fr;}
  .m-insight-card{min-height:auto;padding:2.4rem 1.2rem;border-right:none;border-bottom:1px solid rgba(255,255,255,.08);}
  .m-walk-note{grid-template-columns:1fr;padding:0 1.2rem 2rem;}
  .m-route-row{grid-template-columns:60px 1fr;gap:.8rem;}
  .m-route-label{grid-column:2;}

  /* === Detail pages - layout === */
  .d-hero{grid-template-columns:1fr !important;}
  .d-hero-l{
    padding:3rem 1.2rem 2rem !important;
    border-right:none !important;
    border-bottom:1px solid var(--border);
  }
  /* Hide decorative vertical rails */
  .d-hero-l::before,
  .d-mottainai .d-hero-l::before,
  .d-lulio .d-hero-l::before,
  .d-yuai .d-hero-l::before{display:none !important;}
  .d-yuai .d-hero-l,.d-mottainai .d-hero-l,.d-lulio .d-hero-l{padding-left:1.2rem !important;}
  .d-hero-r{
    padding:2rem 1.2rem !important;
    min-height:260px;
  }
  .d-hero-r img{height:auto !important;max-height:280px;width:auto;max-width:100%;}
  .d-rail{display:none !important;}
  .d-hero-r-corners{display:none;}

  .d-overview{grid-template-columns:1fr !important;}
  .d-ov-t,.d-ov-s{padding:2.5rem 1.2rem !important;border-right:none !important;border-bottom:1px solid var(--border);}
  .d-problem{grid-template-columns:1fr !important;}
  .d-prob-l{padding:3rem 1.2rem !important;border-right:none !important;border-bottom:1px solid var(--border);}
  .d-prob-r{grid-template-columns:1fr !important;padding:2rem 1.2rem !important;}
  .d-research{grid-template-columns:1fr !important;}
  .d-res-l,.d-res-r{padding:3rem 1.2rem !important;border-right:none !important;border-bottom:1px solid var(--border);}
  .d-color-sec{grid-template-columns:1fr !important;}
  .d-color-grid{border-right:none !important;}
  .d-color-txt{padding:2.5rem 1.2rem !important;}
  .d-outcome{grid-template-columns:1fr !important;}
  .d-out{padding:2rem 1.2rem !important;border-right:none !important;border-bottom:1px solid rgba(255,255,255,.07);}

  /* === Walkthrough: full mobile overhaul === */
  .d-wt-hdr{padding:2rem 1.2rem 1rem !important;flex-direction:column;gap:.4rem;}
  .d-wt-hdr-r{display:none;}

  /* Step tabs: horizontally scrollable, compact */
  .d-step-tabs{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;
    flex-wrap:nowrap;
  }
  .d-st{
    min-width:80px;max-width:100px;
    padding:.8rem .6rem;
    flex-shrink:0;
    scroll-snap-align:start;
  }
  .d-st-num{font-size:.5rem;}
  .d-st-name{font-size:.72rem;}

  /* Sub-tabs */
  .d-sub-tabs{padding:1rem 1rem 0 !important;gap:.4rem;}
  .d-sub-t{font-size:.55rem;padding:5px 10px;}

  /* Annotation wrap: phone centered, annotations as list below */
  .d-ann-wrap{
    padding:2rem 1.2rem !important;
    flex-direction:column;
    align-items:center;
    background:#fff !important;
    gap:1.5rem;
  }
  .d-phone-img{
    height:auto !important;
    width:65vw !important;
    max-width:260px;
    mix-blend-mode:normal !important;
    flex-shrink:0;
  }
  /* Hide SVG connector lines on mobile */
  .d-ann-svg{display:none !important;}
  /* Annotations: static list below phone */
  .d-ann-item{
    position:static !important;
    width:100% !important;
    left:auto !important;
    top:auto !important;
    display:flex;
    align-items:flex-start;
    gap:.6rem;
    padding:.5rem 0;
    border-bottom:1px solid #eee;
  }
  .d-ann-item:last-child{border-bottom:none;}
  .d-ann-num{flex-shrink:0;width:20px;height:20px;font-size:.55rem;}
  .d-ann-title{font-size:.8rem;}
  .d-ann-sub{font-size:.68rem;}

  /* All screens: smaller images, smooth touch scroll */
  .d-all-screens{padding:2rem 0 2rem 1.2rem !important;}
  .d-scr-scroll{
    gap:1rem !important;
    padding-right:1.2rem;
    padding-bottom:1rem;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;
  }
  .d-scr-item{scroll-snap-align:start;}
  .d-scr-item img{
    height:200px !important;
    width:auto;
    mix-blend-mode:normal !important;
  }

  /* Yuai-specific mobile */
  .yuai-origin-inner{grid-template-columns:1fr !important;}
  .yuai-origin-l{padding:3rem 1.2rem !important;border-right:none !important;border-bottom:1px solid var(--border);}
  .yuai-origin-r{padding:2rem 1.2rem !important;}
  .yuai-bar-row{grid-template-columns:85px 1fr 38px;gap:.5rem;}
  .yuai-bar-label{font-size:.66rem;}
  .yuai-donuts{grid-template-columns:1fr !important;}
  .yuai-donut-card{border-right:none !important;border-bottom:1px solid var(--border);padding:2rem 1.2rem;}
}

/* ════ YUAI tonal ════ */
.d-yuai .d-hero{background:linear-gradient(180deg,#fafafa 0%,#f5f5f5 100%);}
.d-yuai .d-hero::before{top:14px;left:14px;border-right:none;border-bottom:none;border-color:#f5a623;}
.d-yuai .d-hero::after{bottom:14px;right:14px;border-left:none;border-top:none;border-color:#7fb069;}
.d-yuai .d-hero-l::before{
  content:'CASE / 02 — YUAI — 友愛 — ちかマップ × ぺらトレ — ';
  position:absolute;top:0;left:0;height:100%;width:38px;
  display:flex;align-items:center;justify-content:center;
  border-right:1px solid var(--border);
  font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.32em;color:#c8882a;
  writing-mode:vertical-rl;text-transform:uppercase;
  background:linear-gradient(180deg,rgba(245,166,35,.04),rgba(127,176,105,.04));
}
.d-yuai .d-hero-l{padding-left:5rem;}
.d-yuai .d-hero-r{background:#fff;}
.d-yuai .d-hero-r::before,.d-yuai .d-hero-r::after{display:none;}
.d-yuai .d-hero-r img{filter:none;mix-blend-mode:normal;}
.d-yuai .d-hero-r-corners{color:#c8882a;}
.d-yuai .d-hero-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4.5rem,8.5vw,9rem);line-height:.86;letter-spacing:-.01em;
  background:linear-gradient(135deg,#f5a623 0%,#e8823c 50%,#7fb069 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.d-yuai .d-lbl{color:#f5a623;}
.d-yuai .d-lbl::before{background:#f5a623;}
.d-yuai .d-h2 .accent{color:#f5a623;}
.d-yuai .d-big-n{color:#f5a623;}
.d-yuai .d-ins-num{color:#f5a623;}
.d-yuai .d-ins-num::after{background:linear-gradient(to right,rgba(245,166,35,.2),transparent);}
.d-yuai .d-prob-q{border-left-color:#f5a623;}
.d-yuai .d-pi:hover{background:rgba(245,166,35,.08);border-color:rgba(245,166,35,.3);}
.d-yuai .d-pc::before{background:linear-gradient(to bottom,#f5a623,rgba(245,166,35,.3));}
.d-yuai .d-st.on{background:#1c1a14;}
.d-yuai .d-out-n{color:#f5a623;}
.d-yuai .d-out::before{background:linear-gradient(to right,#f5a623,#7fb069);}
.d-yuai .d-rail::after{background:#f5a623;box-shadow:0 0 0 4px rgba(245,166,35,.16);}
.d-yuai .d-sec::before{color:rgba(200,136,42,.55);}
.d-yuai .d-problem{background:#0f0e09;}

/* Yuai chart layout */
.yuai-origin{border-bottom:1px solid var(--border);}
.yuai-origin-inner{display:grid;grid-template-columns:1fr 1.1fr;min-height:460px;}
.yuai-origin-l{padding:5rem 3rem;border-right:1px solid var(--border);display:flex;flex-direction:column;justify-content:center;}
.yuai-origin-r{padding:4rem 3rem;display:flex;flex-direction:column;justify-content:center;background:#f9f9f9;}
.yuai-chart{background:#fff;border:1px solid var(--border);padding:2rem 2rem;border-radius:2px;}
.yuai-chart-title{font-family:'DM Mono',monospace;font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:1.6rem;}
.yuai-bar-row{display:grid;grid-template-columns:130px 1fr 46px;align-items:center;gap:.8rem;margin-bottom:1rem;}
.yuai-bar-label{font-size:.74rem;color:#555;line-height:1.3;}
.yuai-bar-track{height:9px;background:#f0f0f0;border-radius:5px;overflow:hidden;}
.yuai-bar-fill{height:100%;width:0;border-radius:5px;background:var(--clr,#f5a623);transition:width 1.1s cubic-bezier(.2,.8,.2,1);}
.yuai-bar-fill.anim{width:var(--pct,0%);}
.yuai-bar-pct{font-family:'Bebas Neue',sans-serif;font-size:1.05rem;}
.yuai-chart-src{font-family:'DM Mono',monospace;font-size:.46rem;color:#ccc;letter-spacing:.1em;margin-top:1rem;}

/* Insight donut row */
.yuai-donuts{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--border);}
.yuai-donut-card{padding:3rem 2rem;border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:center;gap:.8rem;text-align:center;transition:background .3s;}
.yuai-donut-card:last-child{border-right:none;}
.yuai-donut-card:hover{background:var(--card);}
.yuai-donut-label{font-size:.86rem;font-weight:700;line-height:1.3;}
.yuai-donut-sub{font-size:.72rem;color:#888;line-height:1.45;max-width:180px;}

/* phone img override */
.d-phone-img{mix-blend-mode:normal !important;}
.d-ann-wrap{background:#fff !important;}
.d-scr-item img{mix-blend-mode:normal !important;}

/* mobile yuai */
@media(max-width:920px){
  .yuai-origin-inner{grid-template-columns:1fr;}
  .yuai-origin-l{padding:3rem 1.2rem;border-right:none;border-bottom:1px solid var(--border);}
  .yuai-origin-r{padding:2rem 1.2rem;}
  .yuai-bar-row{grid-template-columns:80px 1fr 40px;}
  .yuai-bar-label{font-size:.66rem;}
  .yuai-donuts{grid-template-columns:1fr;}
  .yuai-donut-card{border-right:none;border-bottom:1px solid var(--border);padding:2rem 1.2rem;}
  .d-yuai .d-hero-l{padding-left:1.2rem;}
  .d-yuai .d-hero-l::before{display:none;}
}


@media(max-width:920px){
  .d-ann-wrap{padding:2rem 1rem 2rem !important;flex-direction:column;align-items:center;}
  .d-phone-img{height:auto !important;width:70vw !important;max-width:280px;}
  .d-ann-svg{display:none !important;}
  .d-ann-item{position:static !important;width:auto !important;display:flex;align-items:flex-start;gap:.6rem;padding:.5rem 0;border-bottom:1px solid #eee;}
  .d-ann-item:last-child{border-bottom:none;}
  .d-scr-item img{height:200px !important;}
  .d-scr-scroll{gap:1rem;padding:0 1rem 1rem;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;}
  .d-scr-item{scroll-snap-align:start;}
  .d-step-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .d-st{min-width:90px;padding:.9rem .7rem;}
  .d-sub-tabs{padding:1rem !important;}
  .d-wt-hdr{padding:2rem 1.2rem 1rem !important;}
  .d-hero-l::before,.d-yuai .d-hero-l::before,.d-mottainai .d-hero-l::before,.d-lulio .d-hero-l::before{display:none !important;}
  .d-hero-l{padding:3rem 1.2rem !important;}
  .d-hero-r{padding:2rem 1.2rem !important;}
  .d-yuai .d-hero-l{padding-left:1.2rem !important;}
  .d-prob-r{grid-template-columns:1fr !important;padding:2rem 1.2rem !important;}
  .d-overview,.d-problem,.d-research,.d-color-sec,.d-outcome,.d-hero{grid-template-columns:1fr !important;}
  .d-hero-l,.d-hero-r,.d-prob-l,.d-prob-r,.d-res-l,.d-res-r,.d-ov-t,.d-ov-s,.d-color-txt,.d-out{border-right:none !important;border-bottom:1px solid var(--border) !important;}
  .d-all-screens{padding:2rem 1rem !important;}
  .d-rail{display:none;}
  .stats{grid-template-columns:1fr 1fr !important;}
}


/* ════ SHOP tonal — warm gold × navy × ivory ════ */
.d-shop .d-hero{background:linear-gradient(180deg,#f8f8f8 0%,#f4f4f4 100%);}
.d-shop .d-hero::before{top:14px;left:14px;border-right:none;border-bottom:none;border-color:#b07d3a;}
.d-shop .d-hero::after{bottom:14px;right:14px;border-left:none;border-top:none;border-color:#1a2a5a;}
.d-shop .d-hero-l::before{
  content:'CASE / 01 — GUTING JUN SHOP — 谷町君 — E-COMMERCE — ';
  position:absolute;top:0;left:0;height:100%;width:38px;
  display:flex;align-items:center;justify-content:center;
  border-right:1px solid var(--border);
  font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.32em;color:#9a6a28;
  writing-mode:vertical-rl;text-transform:uppercase;
  background:linear-gradient(180deg,rgba(176,125,58,.05),rgba(26,42,90,.04));
}
.d-shop .d-hero-l{padding-left:5rem;}
.d-shop .d-hero-r{background:#fff;}
.d-shop .d-hero-r::before,.d-shop .d-hero-r::after{display:none;}
.d-shop .d-hero-r img{filter:none;mix-blend-mode:normal;border-radius:0;box-shadow:none;}
.d-shop .d-hero-r-corners{color:#9a6a28;}
.d-shop .d-hero-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4rem,8vw,8.5rem);line-height:.86;letter-spacing:-.01em;
  background:linear-gradient(135deg,#b07d3a 0%,#d4a855 60%,#1a2a5a 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.d-shop .d-lbl{color:#b07d3a;}
.d-shop .d-lbl::before{background:#b07d3a;}
.d-shop .d-h2 .accent{color:#b07d3a;}
.d-shop .d-big-n{color:#b07d3a;}
.d-shop .d-ins-num{color:#b07d3a;}
.d-shop .d-ins-num::after{background:linear-gradient(to right,rgba(176,125,58,.2),transparent);}
.d-shop .d-prob-q{border-left-color:#b07d3a;}
.d-shop .d-pi:hover{background:rgba(176,125,58,.08);border-color:rgba(176,125,58,.3);}
.d-shop .d-pc::before{background:linear-gradient(to bottom,#b07d3a,rgba(176,125,58,.3));}
.d-shop .d-st.on{background:#1a2a5a;}
.d-shop .d-out-n{color:#b07d3a;}
.d-shop .d-out::before{background:linear-gradient(to right,#b07d3a,#1a2a5a);}
.d-shop .d-rail::after{background:#b07d3a;box-shadow:0 0 0 4px rgba(176,125,58,.16);}
.d-shop .d-sec::before{color:rgba(154,106,40,.55);}
.d-shop .d-problem{background:#0e1528;}

/* Shop screen gallery */
.shop-gallery{padding:4rem 3rem;border-bottom:1px solid var(--border);}
.shop-gallery-title{margin-bottom:2rem;}
.shop-tabs{display:flex;gap:.5rem;margin-bottom:2rem;flex-wrap:wrap;}
.shop-tab{font-family:'DM Mono',monospace;font-size:.6rem;padding:6px 16px;border:1px solid var(--border);cursor:pointer;letter-spacing:.06em;background:none;color:var(--muted-d);transition:all .2s;}
.shop-tab.on{background:#1a2a5a;color:#fff;border-color:#1a2a5a;}
.shop-screen-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.shop-screen-grid.pc-grid{grid-template-columns:repeat(2,1fr);}
.shop-screen-item{border:1px solid var(--border);overflow:hidden;background:#fff;cursor:pointer;transition:transform .3s,box-shadow .3s;}
.shop-screen-item:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,.1);}
.shop-screen-item img{width:100%;height:auto;display:block;}

/* Browser frame wrapper for PC screenshots */
.browser-frame{
  border:1px solid #d0d0d0;
  border-radius:8px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 4px 20px rgba(0,0,0,.08);
  transition:transform .3s,box-shadow .3s;
}
.browser-frame:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,.12);}
.browser-bar{
  background:#f0f0f0;
  border-bottom:1px solid #d8d8d8;
  padding:8px 12px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}
.browser-dots{display:flex;gap:5px;}
.browser-dots span{
  width:10px;height:10px;border-radius:50%;display:inline-block;
}
.browser-dots span:nth-child(1){background:#ff5f57;}
.browser-dots span:nth-child(2){background:#febc2e;}
.browser-dots span:nth-child(3){background:#28c840;}
.browser-url{
  flex:1;background:#fff;border:1px solid #d0d0d0;
  border-radius:4px;padding:3px 10px;
  font-family:'DM Mono',monospace;font-size:.55rem;
  color:#888;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.browser-viewport{
  height:320px;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  cursor:ns-resize;
}
.browser-viewport::-webkit-scrollbar{width:4px;}
.browser-viewport::-webkit-scrollbar-track{background:#f0f0f0;}
.browser-viewport::-webkit-scrollbar-thumb{background:#b07d3a;border-radius:2px;}
.browser-viewport img{width:100%;height:auto;display:block;}
.browser-lbl{
  padding:.6rem .8rem;border-top:1px solid var(--border);
  font-family:'DM Mono',monospace;font-size:.52rem;
  color:var(--muted);letter-spacing:.08em;text-transform:uppercase;
  background:#fff;
}
@media(max-width:920px){
  .shop-screen-grid.pc-grid{grid-template-columns:1fr !important;}
  .browser-viewport{height:260px;}
}
.shop-screen-lbl{padding:.6rem .8rem;font-family:'DM Mono',monospace;font-size:.52rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;border-top:1px solid var(--border);}
.shop-screen-panel{display:none;}
.shop-screen-panel.on{display:block;}

/* Live link button */
.shop-live-btn{
  display:inline-flex;align-items:center;gap:.6rem;
  background:#b07d3a;color:#fff;
  font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  padding:14px 24px;border:none;cursor:pointer;text-decoration:none;
  transition:background .25s,transform .25s;margin-top:1rem;
}
.shop-live-btn:hover{background:#9a6a28;transform:translateY(-2px);}
.shop-live-btn .arr{font-size:1rem;}

@media(max-width:920px){
  .shop-gallery{padding:2rem 1.2rem;}
  .shop-screen-grid{grid-template-columns:repeat(2,1fr) !important;}
  .d-shop .d-hero-l{padding-left:1.2rem !important;}
  .d-shop .d-hero-l::before{display:none !important;}
}


/* ════ THESIS tonal — deep ink × gold × paper ════ */
.d-thesis .d-hero{
  background:
    radial-gradient(ellipse at 20% 30%, rgba(138,106,40,.08) 0, transparent 50%),
    linear-gradient(180deg,#111 0%,#1a1610 100%);
  color:#f0ede8;
}
.d-thesis .d-hero::before{top:14px;left:14px;border-right:none;border-bottom:none;border-color:#8a6a28;}
.d-thesis .d-hero::after{bottom:14px;right:14px;border-left:none;border-top:none;border-color:#8a6a28;}
.d-thesis .d-hero-l::before{
  content:'MASTER THESIS — 修士論文 — 優秀賞 — MUSASHINO ART UNIV — 2025 — ';
  position:absolute;top:0;left:0;height:100%;width:38px;
  display:flex;align-items:center;justify-content:center;
  border-right:1px solid rgba(138,106,40,.3);
  font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.32em;color:rgba(138,106,40,.7);
  writing-mode:vertical-rl;text-transform:uppercase;
  background:linear-gradient(180deg,rgba(138,106,40,.06),rgba(0,0,0,0));
}
.d-thesis .d-hero-l{padding-left:5rem;}
.d-thesis .d-hero-num{color:rgba(240,237,232,.5);}
.d-thesis .d-hero-num .red{color:#c8a830 !important;}
/* — d-thesis hero-r: full-bleed horizontal image, no dark void above/below — */
.d-thesis .d-hero-r{background:#0a0a0a;padding:0;position:relative;overflow:hidden;}
.d-thesis .d-hero-r::before{display:none;}
.d-thesis .d-hero-r::after{
  display:block;content:'';position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(10,10,10,.55) 0%, transparent 22%, transparent 78%, rgba(10,10,10,.55) 100%),
    radial-gradient(ellipse at 50% 50%, transparent 55%, rgba(10,10,10,.4) 100%);
  mask-image:none;-webkit-mask-image:none;opacity:1;background-size:auto;
}
.d-thesis .d-hero-r img{
  filter:none;mix-blend-mode:normal;
  width:100%;height:100%;object-fit:cover;object-position:center;
  max-width:none;position:relative;z-index:2;
}
.d-thesis .d-hero-r-corners{color:rgba(200,168,48,.7);z-index:4;}
.d-thesis .d-hero-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3.5rem,7vw,8rem);line-height:.86;letter-spacing:-.01em;
  color:#f0ede8;
  background:linear-gradient(135deg,#f0ede8 0%,#c8a830 60%,#8a6a28 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.d-thesis .d-hero-jp{color:#f0ede8;}
.d-thesis .d-hero-tag{color:rgba(240,237,232,.7);}
.d-thesis .d-hero-tag strong{color:#f0ede8;}
.d-thesis .d-meta-grid{border-top-color:rgba(255,255,255,.1);}
.d-thesis .d-ml{color:rgba(240,237,232,.4);}
.d-thesis .d-mv{color:#f0ede8;}
.d-thesis .d-lbl{color:#c8a830;}
.d-thesis .d-lbl::before{background:#c8a830;}
.d-thesis .d-h2 .accent{color:#c8a830;}
.d-thesis .d-h2{color:#111;}
.d-thesis .d-ins-num{color:#c8a830;}
.d-thesis .d-ins-num::after{background:linear-gradient(to right,rgba(200,168,48,.2),transparent);}
.d-thesis .d-out-n{color:#c8a830;}
.d-thesis .d-out{background:var(--bg-deep);}
.d-thesis .d-out::before{background:linear-gradient(to right,#c8a830,#8a6a28);}
.d-thesis .d-out-l{color:#f0ede8;}
.d-thesis .d-out-s{color:rgba(240,237,232,.5);}
.d-thesis .d-rail::after{background:#c8a830;box-shadow:0 0 0 4px rgba(200,168,48,.16);}
.d-thesis .d-sec::before{color:rgba(200,168,48,.4);}

/* Award banner */
.thesis-award{
  display:flex;align-items:center;gap:1rem;
  background:linear-gradient(135deg,rgba(200,168,48,.12),rgba(138,106,40,.08));
  border:1px solid rgba(200,168,48,.3);
  padding:1rem 1.5rem;margin-top:1.5rem;
  width:fit-content;
}
.thesis-award-icon{font-size:1.6rem;line-height:1;}
.thesis-award-text{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:#c8a830;}
.thesis-award-sub{font-size:.72rem;color:rgba(240,237,232,.55);margin-top:.2rem;}

/* Exhibition gallery */
.thesis-gallery{
  display:grid;grid-template-columns:1fr 1fr;
  gap:0;border-bottom:1px solid var(--border);
}
.thesis-gallery-main{
  grid-row:span 2;
  overflow:hidden;border-right:1px solid var(--border);
}
.thesis-gallery-main img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.thesis-gallery-main:hover img{transform:scale(1.03);}
.thesis-gallery-sub{overflow:hidden;border-bottom:1px solid var(--border);}
.thesis-gallery-sub:last-child{border-bottom:none;}
.thesis-gallery-sub img{width:100%;height:100%;object-fit:cover;display:block;min-height:240px;transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.thesis-gallery-sub:hover img{transform:scale(1.03);}

@media(max-width:920px){
  .thesis-gallery{grid-template-columns:1fr;}
  .thesis-gallery-main{grid-row:span 1;border-right:none;border-bottom:1px solid var(--border);}
  .thesis-gallery-main img,.thesis-gallery-sub img{min-height:220px;}
  .d-thesis .d-hero-l{padding-left:1.2rem !important;}
  .d-thesis .d-hero-l::before{display:none !important;}
}

/* ── THESIS HERO BANNER (single wide image) ── */
.thesis-banner{background:#0d0d0a;border-bottom:1px solid var(--border);position:relative;}
.thesis-banner-img{width:100%;aspect-ratio:21/9;overflow:hidden;background:#000;position:relative;}
.thesis-banner-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s cubic-bezier(.2,.8,.2,1);}
.thesis-banner:hover .thesis-banner-img img{transform:scale(1.02);}
.thesis-banner-img::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg, rgba(13,13,10,.0) 60%, rgba(13,13,10,.4) 100%);}
.thesis-banner-caption{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;padding:1.4rem 3rem 1.6rem;background:#0d0d0a;color:#f0ede8;border-top:1px solid rgba(200,168,48,.15);}
.thesis-banner-cap-title{font-family:'Bebas Neue','Noto Sans JP',sans-serif;font-size:clamp(1.1rem,1.6vw,1.4rem);letter-spacing:.02em;color:#f0ede8;}
.thesis-banner-cap-r{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#c8a830;white-space:nowrap;}
@media(max-width:920px){.thesis-banner-img{aspect-ratio:16/10;}.thesis-banner-caption{flex-direction:column;align-items:flex-start;gap:.6rem;padding:1.2rem 1.2rem 1.4rem;}}

/* ── THESIS VENN — three-method triangulation ── */
.thesis-venn{background:radial-gradient(ellipse at 50% 0%, #1a1610 0%, #0d0d0a 60%);color:#f0ede8;padding:5rem 3rem 4rem;position:relative;overflow:hidden;}
.thesis-venn::before{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle, rgba(200,168,48,.06) 1px, transparent 1.4px);background-size:28px 28px;mask-image:linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);-webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);opacity:.55;}
.thesis-venn-header{max-width:980px;margin:0 auto 3rem;text-align:center;position:relative;z-index:2;}
.thesis-venn-title{font-family:'Bebas Neue','Noto Sans JP',sans-serif;font-size:clamp(1.8rem,3.4vw,3rem);line-height:1.1;margin:.6rem 0 1.2rem;color:#f0ede8;letter-spacing:.005em;}
.thesis-venn-lead{font-size:.9rem;line-height:1.85;max-width:680px;margin:0 auto;color:rgba(240,237,232,.7);}
.thesis-venn-stage{width:100%;max-width:680px;margin:0 auto;position:relative;z-index:2;padding:1rem 0 .5rem;}
.thesis-venn-svg{width:100%;height:auto;display:block;}
.thesis-venn-svg .venn-c{transition:transform .8s cubic-bezier(.2,.8,.2,1);transform-origin:center;transform-box:fill-box;}
.thesis-venn:hover .venn-c1{transform:translate(-6px,-3px);}
.thesis-venn:hover .venn-c2{transform:translate(6px,-3px);}
.thesis-venn:hover .venn-c3{transform:translate(0,6px);}
.thesis-venn-svg .venn-core{filter:drop-shadow(0 0 14px rgba(200,168,48,.45));}
.thesis-venn-svg .venn-pair-labels{opacity:.85;}
.thesis-venn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:1100px;margin:2.5rem auto 0;position:relative;z-index:2;}
.thesis-venn-card{padding:1.4rem 1.5rem;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.02);border-top:2px solid var(--vc, #c8a830);transition:transform .4s, background .4s, border-color .4s;}
.thesis-venn-card:hover{transform:translateY(-3px);background:rgba(200,168,48,.05);border-color:rgba(200,168,48,.3);}
.thesis-venn-card-num{font-family:'Bebas Neue',sans-serif;font-size:1.4rem;color:var(--vc, #c8a830);letter-spacing:.04em;margin-bottom:.3rem;}
.thesis-venn-card-name{font-size:1.05rem;font-weight:700;color:#f0ede8;margin-bottom:.5rem;letter-spacing:.01em;}
.thesis-venn-card-body{font-size:.78rem;color:rgba(240,237,232,.55);line-height:1.7;}
@media(max-width:920px){.thesis-venn{padding:3.5rem 1.2rem 3rem;}.thesis-venn-grid{grid-template-columns:1fr;}}

/* ── THESIS GALLERY V2 (2×16:9 left + 1×1:1 right) ── */
.thesis-gallery-v2{
  display:grid;grid-template-columns:3fr 2fr;
  gap:0;border-bottom:1px solid var(--border);
  min-height:560px;
}
.tg2-left{display:flex;flex-direction:column;border-right:1px solid var(--border);}
.tg2-wide{overflow:hidden;flex:1;}
.tg2-wide:first-child{border-bottom:1px solid var(--border);}
.tg2-wide img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/9;display:block;transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.tg2-wide:hover img{transform:scale(1.03);}
.tg2-right{
  overflow:hidden;display:flex;flex-direction:column;
  justify-content:flex-end;
}
.tg2-right img{
  width:100%;
  aspect-ratio:1/1;object-fit:cover;display:block;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.tg2-right:hover img{transform:scale(1.03);}
.tg2-caption{
  padding:1.5rem 2rem;border-top:1px solid var(--border);
}
@media(max-width:920px){
  .thesis-gallery-v2{grid-template-columns:1fr;min-height:auto;}
  .tg2-left{border-right:none;}
  .tg2-right{border-top:1px solid var(--border);}
  .tg2-wide img{aspect-ratio:16/9;}
  .tg2-right img{aspect-ratio:16/9;}
}

/* ── THESIS METHOD SECTIONS ── */
.thesis-method-sec{
  background:var(--bg-deep);color:#f0ede8;
  padding:5rem 3rem;
}
.thesis-method-light{background:#fafafa !important;color:var(--fg) !important;}
.thesis-method-header{
  display:flex;align-items:flex-start;gap:3rem;
  margin-bottom:3.5rem;padding-bottom:2.5rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.thesis-method-light .thesis-method-header{border-bottom-color:var(--border);}
.thesis-method-num{
  font-family:'Bebas Neue',sans-serif;font-size:clamp(2.8rem,4vw,4.5rem);
  line-height:1;color:rgba(200,168,48,.35);
  border:1px solid rgba(200,168,48,.2);
  padding:.6rem 1.2rem;white-space:nowrap;flex-shrink:0;
}
.thesis-method-light .thesis-method-num{color:rgba(17,17,17,.18);border-color:var(--border);}
.thesis-method-info{flex:1;}
.thesis-method-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2rem,3.5vw,3.2rem);
  line-height:1.05;color:#f0ede8;
  letter-spacing:.01em;margin-top:.6rem;
}
.thesis-method-light .thesis-method-title{color:var(--fg);}
.thesis-method-body{
  display:grid;grid-template-columns:1fr 1fr;
  gap:3rem;align-items:start;
}
.thesis-method-text{}

/* Fieldwork steps */
.thesis-method-steps{display:flex;flex-direction:column;gap:0;}
.thesis-step{
  display:flex;gap:1.5rem;padding:1.4rem 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.thesis-step:last-child{border-bottom:none;}
.thesis-step-tag{
  font-family:'DM Mono',monospace;font-size:.58rem;
  letter-spacing:.1em;color:#c8a830;
  white-space:nowrap;padding-top:.15rem;
  min-width:80px;
}
.thesis-step-title{
  font-size:.88rem;font-weight:700;color:#f0ede8;
  margin-bottom:.35rem;line-height:1.35;
}
.thesis-step-body{font-size:.76rem;color:rgba(240,237,232,.55);line-height:1.65;}

/* Icon grid for iconography section */
.thesis-icon-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1rem;align-content:start;
}
.thesis-icon-item{
  padding:1.5rem 1.4rem;
  border:1px solid var(--border);
  background:#fff;
  transition:all .3s;
}
.thesis-icon-item:hover{border-color:#c8a830;transform:translateY(-2px);box-shadow:0 4px 20px rgba(0,0,0,.06);}
.thesis-icon-char{
  font-family:'Noto Serif JP',serif;
  font-size:2.2rem;line-height:1;margin-bottom:.6rem;
}
.thesis-icon-name{
  font-size:.82rem;font-weight:700;color:var(--fg);
  margin-bottom:.4rem;
}
.thesis-icon-desc{font-size:.74rem;color:#666;line-height:1.6;}

/* 3D findings */
.thesis-3d-findings{
  padding-top:1rem;
}
.thesis-3d-item{
  display:flex;gap:1.5rem;padding:1.8rem 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.thesis-3d-item:last-child{border-bottom:none;}
.thesis-3d-num{
  font-family:'Bebas Neue',sans-serif;font-size:2.8rem;
  color:rgba(200,168,48,.3);line-height:1;
  flex-shrink:0;width:3rem;
}
.thesis-3d-title{
  font-size:.92rem;font-weight:700;color:#f0ede8;
  margin-bottom:.5rem;line-height:1.35;
}
.thesis-3d-body{font-size:.78rem;color:rgba(240,237,232,.55);line-height:1.65;}

/* ── THESIS 3D INTERACTIVE ── */
.thesis-3d-interactive{background:#0a0a0a;color:#f0ede8;padding:5rem 3rem;position:relative;border-bottom:1px solid rgba(255,255,255,.06);}
.thesis-3d-int-header{display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;margin-bottom:3rem;padding-bottom:2.5rem;border-bottom:1px solid rgba(255,255,255,.08);}
.thesis-3d-int-title{font-family:'Bebas Neue','Noto Sans JP',sans-serif;font-size:clamp(1.8rem,3.2vw,2.8rem);line-height:1.1;margin-top:.6rem;color:#f0ede8;letter-spacing:.005em;}
.thesis-3d-int-h-r{font-size:.86rem;line-height:1.85;color:rgba(240,237,232,.65);align-self:end;}
.thesis-3d-int-stage{position:relative;width:100%;aspect-ratio:16/9;background:radial-gradient(ellipse at 50% 40%, #2a2620 0%, #0d0a08 75%);border:1px solid rgba(200,168,48,.18);overflow:hidden;}
.thesis-3d-int-viewer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;}
.thesis-3d-int-viewer model-viewer{width:100%;height:100%;background:transparent;}
.thesis-3d-int-placeholder{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:2rem;}
.thesis-3d-int-icon{font-family:'DM Mono',monospace;font-size:3rem;color:#c8a830;animation:thesis3dSpin 4s linear infinite;margin-bottom:.4rem;}
@keyframes thesis3dSpin{from{transform:rotate(0);}to{transform:rotate(360deg);}}
.thesis-3d-int-ph-title{font-size:1rem;font-weight:700;color:#f0ede8;letter-spacing:.02em;}
.thesis-3d-int-ph-sub{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(240,237,232,.45);}
.thesis-3d-int-load-btn{margin-top:1rem;padding:.7rem 1.4rem;background:transparent;border:1px solid #c8a830;color:#c8a830;font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;cursor:none;transition:background .25s,color .25s;}
.thesis-3d-int-load-btn:hover{background:#c8a830;color:#0a0a0a;}
.thesis-3d-int-hud{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;padding:1rem 1.4rem;background:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.6) 100%);font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(240,237,232,.55);pointer-events:none;}
.thesis-3d-int-hud-tag{color:#c8a830;}
.thesis-3d-int-hud-attr{display:block;color:rgba(240,237,232,.4);margin-top:.25rem;font-size:.55rem;}
.thesis-3d-int-hud-hint{padding:.4rem .7rem;border:1px solid rgba(200,168,48,.3);color:#c8a830;}
.thesis-3d-int-annots{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem;}
.thesis-3d-int-annot{position:relative;padding:1.4rem 1.4rem 1.4rem 3.2rem;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);transition:border-color .3s, background .3s;}
.thesis-3d-int-annot:hover{border-color:rgba(200,168,48,.3);background:rgba(200,168,48,.04);}
.thesis-3d-int-annot-pin{position:absolute;left:1.2rem;top:1.4rem;width:1.6rem;height:1.6rem;border-radius:50%;background:#c8a830;color:#0a0a0a;font-family:'Bebas Neue',sans-serif;font-size:.95rem;display:flex;align-items:center;justify-content:center;letter-spacing:.04em;}
.thesis-3d-int-annot-t{font-size:.88rem;font-weight:700;color:#f0ede8;margin-bottom:.4rem;letter-spacing:.01em;}
.thesis-3d-int-annot-b{font-size:.74rem;color:rgba(240,237,232,.55);line-height:1.65;}
.thesis-3d-int-ref{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-top:2.4rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.06);}
.thesis-3d-int-ref img{max-width:55%;height:auto;display:block;border:1px solid rgba(200,168,48,.18);}
.thesis-3d-int-ref-cap{display:flex;flex-direction:column;gap:.4rem;text-align:right;flex:1;}
@media(max-width:920px){.thesis-3d-interactive{padding:3rem 1.2rem;}.thesis-3d-int-header{grid-template-columns:1fr;gap:1.4rem;}.thesis-3d-int-annots{grid-template-columns:1fr;}.thesis-3d-int-ref{flex-direction:column;align-items:stretch;}.thesis-3d-int-ref img{max-width:100%;}.thesis-3d-int-ref-cap{text-align:left;}}

/* ── THESIS TIMELINE — horizontal-scroll annual chart ── */
.thesis-timeline{background:#fafafa;color:var(--fg);padding:5rem 0 4rem;border-bottom:1px solid var(--border);}
.thesis-timeline-header{padding:0 3rem;margin-bottom:2rem;display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;}
.thesis-timeline-h-l{max-width:680px;}
.thesis-timeline-title{font-family:'Bebas Neue','Noto Sans JP',sans-serif;font-size:clamp(1.8rem,3.2vw,2.8rem);line-height:1.1;margin-top:.5rem;letter-spacing:.005em;}
.thesis-timeline-lead{font-size:.86rem;line-height:1.85;color:#555;margin-top:.8rem;}
.thesis-timeline-h-r{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d);text-align:right;align-self:flex-end;display:flex;align-items:center;gap:.6rem;}
.thesis-timeline-h-r .tt-arrow{color:#c8a830;font-size:1rem;}
.thesis-timeline-scroll{position:relative;width:100%;overflow-x:auto;overflow-y:hidden;cursor:grab;user-select:none;scrollbar-width:thin;scrollbar-color:#c8a830 #eee;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#fff;}
.thesis-timeline-scroll::-webkit-scrollbar{height:6px;}
.thesis-timeline-scroll::-webkit-scrollbar-track{background:#f0f0f0;}
.thesis-timeline-scroll::-webkit-scrollbar-thumb{background:#c8a830;}
.thesis-timeline-scroll.dragging{cursor:grabbing;}
.thesis-timeline-track{display:flex;align-items:stretch;height:520px;padding:0;}
.thesis-timeline-track img{height:100%;width:auto;max-width:none;display:block;user-select:none;-webkit-user-drag:none;filter:contrast(1.02);}
.thesis-timeline-placeholder{height:520px;min-width:1600px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.6rem;background:repeating-linear-gradient(45deg, #f6f6f6 0 12px, #fff 12px 24px);color:#888;}
.thesis-timeline-placeholder p{font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;}
.thesis-timeline-progress{position:relative;height:2px;background:#eee;margin-top:.6rem;}
.thesis-timeline-progress-bar{position:absolute;left:0;top:0;height:100%;background:#c8a830;width:0%;transition:width .15s linear;}
.thesis-timeline-foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 3rem 0;font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d);}
@media(max-width:920px){.thesis-timeline-header{padding:0 1.2rem;flex-direction:column;align-items:flex-start;}.thesis-timeline-foot{padding:.8rem 1.2rem 0;}.thesis-timeline-track{height:380px;}.thesis-timeline-placeholder{height:380px;min-width:1100px;}}

/* d-outcome 4 columns for thesis */
.d-thesis .d-outcome{grid-template-columns:repeat(4,1fr);}

@media(max-width:1100px){
  .thesis-method-body{grid-template-columns:1fr;}
  .thesis-icon-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:920px){
  .thesis-method-sec{padding:3rem 1.2rem;}
  .thesis-method-header{flex-direction:column;gap:1rem;}
  .thesis-icon-grid{grid-template-columns:1fr;}
  .d-thesis .d-outcome{grid-template-columns:1fr 1fr !important;}
  .tg2-caption{padding:1rem 1.2rem;}
}

/* === Case refinement: shared rhythm, individual visual languages === */
.d-lulio .d-hero-r img,
.d-yuai .d-hero-r img,
.d-shop .d-hero-r img{animation:caseFloat 7s ease-in-out infinite;}
@keyframes caseFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}

.d-lulio .d-overview,
.d-yuai .d-overview,
.d-shop .d-overview{background:#fff !important;}
.d-lulio .d-ov-s > div,
.d-yuai .d-ov-s > div,
.d-shop .d-ov-s > div{padding:1.25rem 0;border-top:1px solid var(--border);background:transparent;}
.d-lulio .d-big-n,
.d-yuai .d-big-n,
.d-shop .d-big-n{font-family:'Noto Sans JP',sans-serif;font-weight:500;letter-spacing:.02em;line-height:1;}

.d-lulio .d-problem,
.d-yuai .d-problem,
.d-shop .d-problem{background:#fff !important;color:var(--fg);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.d-lulio .d-prob-l,
.d-yuai .d-prob-l,
.d-shop .d-prob-l{border-right:1px solid var(--border);}
.d-lulio .d-prob-r,
.d-yuai .d-prob-r,
.d-shop .d-prob-r{background:#fff;}
.d-lulio .d-prob-q,
.d-yuai .d-prob-q,
.d-shop .d-prob-q{color:var(--fg) !important;font-family:'Noto Sans JP',sans-serif;font-weight:500;font-size:clamp(1.35rem,2.2vw,2.2rem);line-height:1.62;}
.d-lulio .d-prob-body,
.d-yuai .d-prob-body,
.d-shop .d-prob-body{color:#666 !important;}
.d-lulio .d-pi,
.d-yuai .d-pi,
.d-shop .d-pi{background:#fff !important;border:none !important;border-top:1px solid var(--border) !important;padding:1.35rem 0;}
.d-lulio .d-pi-title,
.d-yuai .d-pi-title,
.d-shop .d-pi-title{color:var(--fg) !important;font-weight:500;}
.d-lulio .d-pi-body,
.d-yuai .d-pi-body,
.d-shop .d-pi-body{color:#666 !important;}

.lulio-breath{display:grid;grid-template-columns:1fr 1.15fr;background:linear-gradient(180deg,#fff 0%,#f8fbfd 100%);border-bottom:1px solid var(--border);}
.lulio-breath-copy{padding:5rem 3rem;border-right:1px solid var(--border);}
.lulio-breath-stage{padding:5rem 3rem;display:flex;flex-direction:column;justify-content:center;gap:1.25rem;}
.lulio-breath-row{display:grid;grid-template-columns:86px 1fr 44px;gap:1rem;align-items:center;border-top:1px solid rgba(106,171,207,.18);padding:1.05rem 0;}
.lulio-breath-label{font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.14em;color:#6a87b3;text-transform:uppercase;}
.lulio-breath-track{height:5px;background:#eef5f8;overflow:hidden;}
.lulio-breath-track span{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,#6aabcf,#caa4cf);animation:casePulse 4.5s ease-in-out infinite;}
.lulio-breath-val{font-family:'DM Mono',monospace;font-size:.7rem;color:#6a87b3;text-align:right;}
@keyframes casePulse{0%,100%{transform:scaleX(.94);opacity:.62;}50%{transform:scaleX(1);opacity:1;}}
.lulio-market-chart{margin-top:1.8rem;border-top:1px solid rgba(106,171,207,.2);}
.lulio-market-row{display:grid;grid-template-columns:130px 1fr 54px;gap:1rem;align-items:center;padding:1.05rem 0;border-bottom:1px solid rgba(106,171,207,.16);}
.lulio-market-label{font-size:.82rem;line-height:1.5;color:#2d2924;font-weight:500;}
.lulio-market-track{height:9px;background:#eef5f8;overflow:hidden;position:relative;}
.lulio-market-track span{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,#6aabcf,#8a6aaf 68%,#c06080);transform-origin:left;animation:barLoad 1.2s cubic-bezier(.2,.8,.2,1) both;}
.lulio-market-val{font-family:'DM Mono',monospace;font-size:.72rem;color:#6a87b3;text-align:right;}
.lulio-market-src{margin-top:1rem;font-family:'DM Mono',monospace;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:#8d98a3;line-height:1.7;}
@keyframes barLoad{from{transform:scaleX(.08);opacity:.35;}to{transform:scaleX(1);opacity:1;}}
.lulio-evidence{display:grid;gap:.9rem;margin-top:1.6rem;}
.lulio-evidence-item{display:grid;grid-template-columns:64px 1fr;gap:1rem;padding:1rem 0;border-top:1px solid var(--border);}
.lulio-evidence-num{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.14em;color:#6aabcf;}
.lulio-evidence-title{font-size:.98rem;font-weight:700;line-height:1.5;margin-bottom:.3rem;}
.lulio-evidence-body{font-size:.8rem;line-height:1.75;color:#666;}

.yuai-phrase-map{display:grid;grid-template-columns:1.05fr 1fr;background:#fffaf2;border-bottom:1px solid #f0e3cc;}
.yuai-phrase-copy{padding:5rem 3rem;border-right:1px solid #f0e3cc;}
.yuai-phrase-board{padding:5rem 3rem;display:grid;gap:.8rem;align-content:center;}
.yuai-phrase-card{display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:1rem;padding:1rem 0;border-top:1px solid #f0e3cc;}
.yuai-phrase-num{font-family:'DM Mono',monospace;color:#c8882a;font-size:.72rem;letter-spacing:.12em;}
.yuai-phrase-text{font-size:.95rem;line-height:1.65;color:#2f2a22;}
.yuai-phrase-dot{width:10px;height:10px;border-radius:50%;background:var(--c,#f5a623);box-shadow:0 0 0 8px color-mix(in srgb,var(--c,#f5a623) 12%, transparent);}

.shop-live-btn{border-color:rgba(176,125,58,.28);background:#fff;color:#7c5c32;}
.shop-live-btn:hover{background:#fff8ed;}
.shop-ops{padding:5rem 3rem;background:linear-gradient(180deg,#fff 0%,#fbf8f2 100%);border-bottom:1px solid var(--border);}
.shop-ops-head{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-bottom:3.2rem;}
.shop-ops-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(176,125,58,.22);border-bottom:1px solid rgba(176,125,58,.22);}
.shop-ops-step{min-height:260px;padding:1.6rem 1.35rem;border-right:1px solid rgba(176,125,58,.18);display:flex;flex-direction:column;justify-content:space-between;background:rgba(255,255,255,.55);}
.shop-ops-step:last-child{border-right:none;}
.shop-ops-num{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.14em;color:#b07d3a;}
.shop-ops-title{font-size:1.08rem;line-height:1.55;font-weight:500;color:#28231d;margin-top:1.8rem;}
.shop-ops-body{font-size:.78rem;line-height:1.8;color:#6a6258;margin-top:.8rem;}
.shop-ops-meter{height:4px;background:#efe6d8;margin-top:2rem;overflow:hidden;}
.shop-ops-meter span{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,#b07d3a,#d8b66a);animation:casePulse 5s ease-in-out infinite;}
.shop-screen-item,.browser-frame{border:none;background:#fff;box-shadow:none;}
.shop-screen-item img{background:#fff;}
.browser-bar{background:#fff;border-bottom:1px solid var(--border);}

.d-thesis .d-hero-title,
.d-thesis .thesis-method-title,
.d-thesis .thesis-venn-title,
.d-thesis .thesis-timeline-title{font-family:'Noto Sans JP',sans-serif;font-weight:500;letter-spacing:.025em;}
.thesis-venn{background:#fffaf0 !important;color:var(--fg);}
.thesis-venn::before{opacity:.28;}
.thesis-venn-title,
.thesis-venn-card-name{color:var(--fg) !important;}
.thesis-venn-lead,
.thesis-venn-card-body{color:#645c4d !important;}
.thesis-venn-card{background:#fff !important;border:0 !important;border-top:1px solid rgba(200,168,48,.42) !important;}
.thesis-venn-stage{filter:drop-shadow(0 18px 44px rgba(80,60,20,.08));}
.thesis-venn-svg g[style*="mix-blend-mode"]{mix-blend-mode:multiply !important;}
.thesis-venn-svg .venn-labels text,
.thesis-venn-svg .venn-pair-labels text{fill:#5f563f !important;}
.thesis-method-sec:not([style*="background:#0d0d0a"]){background:#fff !important;color:var(--fg);}
.thesis-method-sec:not([style*="background:#0d0d0a"]) .thesis-method-header{border-bottom:1px solid var(--border);}
.thesis-method-sec:not([style*="background:#0d0d0a"]) .thesis-method-num{color:#c8a830;}
.thesis-method-sec:not([style*="background:#0d0d0a"]) .thesis-method-title{color:var(--fg);}
.thesis-icon-item{border:none !important;border-top:1px solid rgba(200,168,48,.22) !important;background:#fff !important;}

@media(max-width:900px){
  .lulio-breath,.yuai-phrase-map,.shop-ops-head{grid-template-columns:1fr;}
  .lulio-breath-copy,.yuai-phrase-copy{border-right:none;border-bottom:1px solid var(--border);padding:3rem 1.2rem;}
  .lulio-breath-stage,.yuai-phrase-board,.shop-ops{padding:3rem 1.2rem;}
  .shop-ops-grid{grid-template-columns:1fr;}
  .shop-ops-step{border-right:none;border-bottom:1px solid rgba(176,125,58,.18);min-height:210px;}
  .shop-ops-step:last-child{border-bottom:none;}
}

.d-yuai .d-research{
  grid-template-columns:.95fr 1.05fr;
  background:#fff;
}
.yuai-journey{display:grid;gap:0;margin-top:1.6rem;border-top:1px solid #f0e3cc;}
.yuai-journey-row{
  display:grid;grid-template-columns:92px 1fr;gap:1rem;
  padding:1.15rem 0;border-bottom:1px solid #f0e3cc;
}
.yuai-journey-k{
  font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  color:#c8882a;padding-top:.16rem;
}
.yuai-journey-v{font-size:.92rem;line-height:1.75;color:#2b2722;}
.yuai-journey-v strong{font-weight:700;color:var(--fg);}
.yuai-matrix{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:1.6rem;}
.yuai-matrix-card{
  min-height:140px;padding:1rem;border-top:1px solid var(--c,#f5a623);
  background:#fffaf2;display:flex;flex-direction:column;justify-content:space-between;
}
.yuai-matrix-num{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.12em;color:var(--c,#f5a623);}
.yuai-matrix-title{font-size:.88rem;font-weight:700;line-height:1.45;margin-top:1.2rem;}
.yuai-matrix-body{font-size:.72rem;line-height:1.65;color:#6a6258;margin-top:.5rem;}
.yuai-response{display:grid;gap:.9rem;margin-top:1.6rem;}
.yuai-response-item{
  display:grid;grid-template-columns:64px 1fr;gap:1rem;
  padding:1.05rem 0;border-top:1px solid var(--border);
}
.yuai-response-num{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.14em;color:#f5a623;}
.yuai-response-title{font-size:1rem;font-weight:700;line-height:1.5;margin-bottom:.35rem;}
.yuai-response-body{font-size:.8rem;line-height:1.75;color:#666;}

.thesis-method-sec:not([style*="background:#0d0d0a"]) .thesis-step{border-bottom-color:var(--border);}
.thesis-method-sec:not([style*="background:#0d0d0a"]) .thesis-step-title{color:var(--fg);}
.thesis-method-sec:not([style*="background:#0d0d0a"]) .thesis-step-body{color:#555;}
.thesis-method-sec:not([style*="background:#0d0d0a"]) .thesis-step-tag{color:#a98221;}


/* ── Content additions: process / validation / rewritten case copy ── */
.style-line{font-size:.72rem;line-height:1.7;color:var(--muted-d);margin-top:1rem;font-family:'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase;}
.process-sec{background:#fbfaf8;border-bottom:1px solid var(--border);}
.process-grid{display:grid;grid-template-columns:.8fr 1.2fr;border-top:1px solid var(--border);}
.process-intro{padding:5rem 3rem;border-right:1px solid var(--border);display:flex;flex-direction:column;justify-content:space-between;gap:3rem;}
.process-list{padding:3rem;display:grid;grid-template-columns:1fr;gap:0;}
.process-step{padding:2rem 0;border-bottom:1px solid var(--border);display:grid;grid-template-columns:160px 1fr;gap:2rem;}
.process-step:last-child{border-bottom:none;}
.process-no{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--red);}
.process-title{font-size:1.25rem;font-weight:700;margin-bottom:.7rem;}
.process-body{font-size:.92rem;line-height:1.9;color:#4a4640;max-width:760px;}
.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);margin-top:2rem;}
.tool-cell{background:#fbfaf8;padding:1.15rem;min-height:96px;}
.tool-k{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:.55rem;}
.tool-v{font-size:.82rem;line-height:1.65;color:#3b3732;}
.about-simple{display:grid;grid-template-columns:.9fr 1.1fr;border-top:1px solid rgba(255,255,255,.08);}
.about-simple-l{padding:5rem 3rem;border-right:1px solid rgba(255,255,255,.08);}
.about-simple-r{padding:5rem 3rem;display:grid;grid-template-columns:1fr 1fr;gap:2rem 3rem;}
.about-block{border-top:1px solid rgba(255,255,255,.1);padding-top:1.3rem;}
.about-block h3{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:1rem;}
.about-block p,.about-block li{color:rgba(240,237,232,.72);font-size:.9rem;line-height:1.9;}
.about-block ul{list-style:none;display:flex;flex-direction:column;gap:.45rem;}
.case-copy{padding:5rem 3rem;border-bottom:1px solid var(--border);background:#fff;}
.case-copy.dark{background:var(--bg-deep);color:#f0ede8;border-bottom-color:rgba(255,255,255,.08);}
.case-copy.dark .case-body,.case-copy.dark .case-list li,.case-copy.dark .case-note{color:rgba(240,237,232,.72);}
.case-copy.dark .case-card{border-color:rgba(255,255,255,.08);background:rgba(255,255,255,.035);}
.case-head{display:grid;grid-template-columns:.62fr 1fr;gap:3rem;align-items:center;margin-bottom:3.2rem;}
.case-kicker{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:#b07d3a;margin-bottom:1rem;}
.case-title{font-size:clamp(1.55rem,2.55vw,2.85rem);line-height:1.34;font-weight:500;letter-spacing:.015em;}
.case-body{font-size:.98rem;line-height:2;color:#444;max-width:880px;}
.case-head>.case-copy-main,
.case-head>div:last-child{
  position:relative;
}
.case-head>div:last-child{
  padding:1.35rem 1.55rem;
  border-left:2px solid rgba(176,125,58,.5);
  background:linear-gradient(90deg,rgba(176,125,58,.075),rgba(176,125,58,.025));
}
.case-copy.dark .case-head>div:last-child{
  background:rgba(176,125,58,.07);
  border-left-color:rgba(176,125,58,.7);
}
.case-subgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);}
.case-copy.dark .case-subgrid{background:rgba(255,255,255,.08);}
.case-card{
  position:relative;
  background:#fff;padding:2rem;border:1px solid var(--border);
  counter-increment:case-card;
}
.case-card::before{
  content:counter(case-card, decimal-leading-zero);
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;margin-bottom:1.1rem;
  border:1px solid rgba(176,125,58,.38);
  color:#b07d3a;background:rgba(176,125,58,.055);
  font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.06em;
}
.case-card::after{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,#b07d3a,rgba(176,125,58,.15));
  opacity:.65;
}
.case-subgrid,.case-decision{counter-reset:case-card;}
.case-card h3{font-size:1rem;margin-bottom:1rem;line-height:1.6;font-weight:600;}
.case-card p{font-size:.88rem;line-height:1.85;color:#555;}
.case-copy.dark .case-card p{color:rgba(240,237,232,.72);}
.case-list{margin-top:1rem;list-style:none;display:flex;flex-direction:column;gap:.7rem;}
.case-list li{font-size:.9rem;line-height:1.75;color:#444;position:relative;padding-left:1rem;}
.case-list li::before{content:'•';position:absolute;left:0;color:#b07d3a;font-size:.9rem;}
.case-card strong{color:#9b6730;font-weight:700;}
.case-decision{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin-top:2rem;}
.case-decision .case-card{min-height:260px;}
.shop-decision-ill{
  width:50%;
  min-width:150px;
  margin:0 auto 1.25rem;
  border:0;
  background:transparent;
}
.shop-decision-ill img{
  width:100%;
  height:auto;
  object-fit:contain;
  mix-blend-mode:normal;
  transition:transform .4s ease;
}
.case-decision .case-card:hover .shop-decision-ill img{transform:scale(1.025);}
.case-note{font-size:.92rem;line-height:1.9;color:#444;margin-top:1.4rem;}
.case-quote{border-left:2px solid #b07d3a;padding-left:1.4rem;font-size:1.15rem;line-height:2;color:inherit;margin:1.4rem 0;}
.d-shop .d-outcome{grid-template-columns:repeat(6,1fr);}
.case-copy.dark .case-title{color:rgba(240,237,232,.92);}
.case-copy.dark .case-decision{background:rgba(255,255,255,.08);}
.case-copy.dark .case-decision .case-card,
.case-copy.dark .case-subgrid .case-card{
  background:#292621 !important;
  border-color:rgba(255,255,255,.1) !important;
  color:#f0ede8;
}
.case-copy.dark .case-card h3{color:rgba(240,237,232,.92);font-weight:500;}
.case-copy.dark .case-card p,
.case-copy.dark .case-card .case-list li,
.case-copy.dark .case-card .case-note{color:rgba(240,237,232,.76);}
.case-copy.dark .case-card strong{color:rgba(240,237,232,.92);}
@media(max-width:900px){.process-grid,.about-simple,.case-head,.case-decision{grid-template-columns:1fr;}.process-intro,.about-simple-l{border-right:none;border-bottom:1px solid var(--border);}.about-simple-r,.tools-grid,.case-subgrid{grid-template-columns:1fr;}.process-step{grid-template-columns:1fr;gap:.6rem;}.d-shop .d-outcome{grid-template-columns:1fr !important;}}

@media(max-width:900px){
  .hero::before{inset:var(--nav) 0 42% 0;}
  .d-yuai .d-research,.yuai-matrix{grid-template-columns:1fr;}
}

/* ════ TJ Brothers featured case ════ */
.feat-hero{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);
  min-height:560px;
  border-bottom:1px solid var(--border);
  background:
    radial-gradient(circle at 18% 20%,rgba(176,125,58,.11),transparent 34%),
    linear-gradient(135deg,#fffaf0 0%,#f5efe3 45%,#ffffff 100%);
  cursor:none;
  overflow:hidden;
  position:relative;
}
.feat-hero::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,#b07d3a,#1f1d1a,#b07d3a);transform:scaleX(.18);transform-origin:left;transition:transform .55s cubic-bezier(.2,.8,.2,1);}
.feat-hero:hover::after{transform:scaleX(1);}
.feat-hero-copy{padding:4.5rem 3rem;display:flex;flex-direction:column;justify-content:space-between;gap:2rem;border-right:1px solid rgba(176,125,58,.24);position:relative;z-index:2;}
.feat-hero-num{display:flex;justify-content:space-between;align-items:center;gap:1rem;font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#7f6a4d;}
.feat-hero-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(4rem,9vw,9rem);line-height:.82;letter-spacing:-.012em;color:#1f1d1a;margin:.4rem 0 1.4rem;}
.feat-hero-title .gold{color:#b07d3a;}
.feat-hero-sub{font-size:1rem;line-height:1.85;color:#4a4238;max-width:680px;}
.feat-hero-tags{display:flex;gap:.45rem;flex-wrap:wrap;margin-top:1.4rem;}
.feat-hero-tag{font-family:'DM Mono',monospace;font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;color:#8a642d;border:1px solid rgba(176,125,58,.34);background:rgba(176,125,58,.07);padding:4px 9px;}
.feat-hero-meta{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;padding-top:1.4rem;border-top:1px solid rgba(176,125,58,.24);}
.feat-hero-visual{position:relative;padding:3rem;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.feat-hero-visual::before{content:'TJ BROTHERS';position:absolute;right:-.6rem;bottom:-.8rem;font-family:'Bebas Neue',sans-serif;font-size:clamp(5rem,12vw,13rem);line-height:.8;color:rgba(176,125,58,.08);letter-spacing:-.02em;}
.feat-hero-shot{width:min(760px,100%);background:#fff;border:1px solid rgba(31,29,26,.12);box-shadow:0 34px 80px rgba(31,29,26,.18);position:relative;z-index:2;transform:rotate(-1.2deg);transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s;}
.feat-hero:hover .feat-hero-shot{transform:rotate(0) translateY(-6px);box-shadow:0 44px 110px rgba(31,29,26,.22);}
.feat-hero-shot img{width:100%;height:auto;max-height:390px;object-fit:cover;object-position:top;}
.feat-hero-phone{position:absolute;right:3rem;bottom:2.2rem;width:150px;background:#111;border:8px solid #111;border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.28);z-index:3;overflow:hidden;transform:rotate(5deg);}
.feat-hero-phone img{width:100%;height:300px;object-fit:cover;object-position:top;}

.d-tj{--tj-gold:#b07d3a;--tj-ink:#1f1d1a;--tj-paper:#fffaf0;--tj-line:#e8d8bf;}
.d-tj .d-hero{background:linear-gradient(135deg,#fffaf0 0%,#f8f1e5 50%,#fff 100%);}
.d-tj .d-hero-l{padding-left:5rem;}
.d-tj .d-hero-l::before{content:'CASE / 01 — TJ BROTHERS — BRAND INTEGRATION — WORDPRESS — ';position:absolute;top:0;left:0;height:100%;width:38px;display:flex;align-items:center;justify-content:center;border-right:1px solid rgba(176,125,58,.24);font-family:'DM Mono',monospace;font-size:.5rem;letter-spacing:.32em;color:#8a642d;writing-mode:vertical-rl;text-transform:uppercase;background:rgba(176,125,58,.045);}
.d-tj .d-hero-num .red,.d-tj .d-lbl,.d-tj .case-kicker,.d-tj .d-out-n{color:var(--tj-gold) !important;}
.d-tj .d-lbl::before,.d-tj .d-out::before{background:linear-gradient(90deg,var(--tj-gold),#f1d59e);}
.tj-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(4.5rem,9vw,9rem);line-height:.84;letter-spacing:-.012em;color:var(--tj-ink);}
.tj-subtitle{color:#8a642d;}
.tj-live-btn{border-color:rgba(176,125,58,.36) !important;background:#fff !important;color:#7c5c32 !important;}
.tj-live-btn:hover{background:#fff5e4 !important;}
.tj-hero-r{background:radial-gradient(circle at 50% 35%,rgba(176,125,58,.16),transparent 38%),#fff;}
.tj-hero-r::before,.tj-hero-r::after{display:none;}
.tj-browser-shot{width:min(86%,780px);background:#fff;border:1px solid rgba(31,29,26,.12);box-shadow:0 36px 90px rgba(31,29,26,.2);position:relative;z-index:2;transform:rotate(1.2deg);}
.tj-browser-shot img{width:100%;height:620px;object-fit:cover;object-position:top;}
.tj-overview{display:grid;grid-template-columns:.95fr 1.05fr;border-bottom:1px solid var(--border);background:#fff;}
.tj-overview-copy{padding:5rem 3rem;border-right:1px solid var(--border);display:flex;flex-direction:column;justify-content:center;}
.tj-value-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);}
.tj-value{background:#fff;padding:3rem 2rem;display:flex;flex-direction:column;justify-content:space-between;min-height:260px;transition:background .3s,transform .3s;}
.tj-value:hover{background:#fffaf0;transform:translateY(-2px);}
.tj-value b{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.16em;color:var(--tj-gold);}
.tj-value h3{font-size:1.1rem;margin:2rem 0 .8rem;}
.tj-value p{font-size:.84rem;line-height:1.75;color:#665b4d;}
.tj-brand-map{display:grid;grid-template-columns:1.1fr .15fr 1fr 1fr 1fr;gap:1rem;align-items:center;}
.tj-brand-node{min-height:190px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.045);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1.4rem;position:relative;overflow:hidden;}
.tj-brand-node.main{background:linear-gradient(135deg,rgba(176,125,58,.22),rgba(255,255,255,.05));}
.tj-brand-node span{font-family:'Bebas Neue',sans-serif;font-size:4.5rem;line-height:1;color:var(--tj-gold);}
.tj-brand-node img{width:96px;height:96px;border-radius:50%;object-fit:cover;margin-bottom:1rem;filter:saturate(.9);}
.tj-brand-node p{font-size:.85rem;line-height:1.55;color:rgba(240,237,232,.82);font-weight:700;}
.tj-brand-line{height:1px;background:linear-gradient(90deg,var(--tj-gold),rgba(255,255,255,.08));}
.tj-route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);}
.tj-route-card{background:#fff;min-height:420px;position:relative;overflow:hidden;padding:2rem;display:flex;flex-direction:column;justify-content:flex-end;}
.tj-route-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:transform .7s cubic-bezier(.2,.8,.2,1);}
.tj-route-card::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.64));}
.tj-route-card:hover img{transform:scale(1.06);}
.tj-route-card>*:not(img){position:relative;z-index:1;color:#fff;}
.tj-route-card>span{font-family:'Bebas Neue',sans-serif;font-size:3.2rem;line-height:.9;color:rgba(255,255,255,.84);}
.tj-route-card h3{font-size:1.06rem;margin:1rem 0 .55rem;}
.tj-route-card p{font-size:.8rem;line-height:1.75;color:rgba(255,255,255,.78);}
.tj-screens{padding:5rem 3rem;border-bottom:1px solid var(--border);background:#f8f3e9;overflow:hidden;}
.tj-screens-head{max-width:760px;margin-bottom:3rem;}
.tj-screen-stage{display:grid;grid-template-columns:1fr 260px;gap:2rem;align-items:start;}
.tj-desktop-shot{background:#fff;border:1px solid rgba(31,29,26,.12);box-shadow:0 30px 80px rgba(31,29,26,.16);}
.tj-desktop-shot img{width:100%;height:720px;object-fit:cover;object-position:top;}
.tj-mobile-shot{background:#111;border:10px solid #111;border-radius:30px;overflow:hidden;box-shadow:0 28px 70px rgba(31,29,26,.28);transform:translateY(80px);}
.tj-mobile-shot img{width:100%;height:640px;object-fit:cover;object-position:top;}
.tj-process-strip{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid var(--border);background:#fff;}
.tj-process-strip div{padding:2rem 1.4rem;border-right:1px solid var(--border);min-height:160px;display:flex;flex-direction:column;justify-content:space-between;}
.tj-process-strip div:last-child{border-right:none;}
.tj-process-strip b{font-family:'Bebas Neue',sans-serif;font-size:2.8rem;line-height:1;color:var(--tj-gold);}
.tj-process-strip span{font-size:.82rem;font-weight:700;line-height:1.55;}
.tj-outcome{grid-template-columns:repeat(4,1fr);}
.d-tj .case-card::before{border-color:rgba(176,125,58,.38);color:var(--tj-gold);background:rgba(176,125,58,.055);}
.d-tj .case-card::after{background:linear-gradient(180deg,var(--tj-gold),rgba(176,125,58,.15));}
.d-tj .case-list li::before{color:var(--tj-gold);}

@media(max-width:920px){
  .feat-hero{grid-template-columns:1fr;min-height:auto;}
  .feat-hero-copy{padding:3rem 1.2rem;border-right:none;border-bottom:1px solid rgba(176,125,58,.24);}
  .feat-hero-meta{grid-template-columns:1fr;}
  .feat-hero-visual{padding:2rem 1.2rem 5.5rem;}
  .feat-hero-phone{right:1.2rem;bottom:1.4rem;width:104px;border-radius:18px;border-width:6px;}
  .feat-hero-phone img{height:190px;}
  .feat-hero-shot img{max-height:260px;}
  .d-tj .d-hero-l{padding-left:1.2rem !important;}
  .d-tj .d-hero-l::before{display:none;}
  .tj-browser-shot{width:100%;transform:none;}
  .tj-browser-shot img{height:360px;}
  .tj-overview,.tj-value-grid,.tj-route-grid,.tj-screen-stage,.tj-process-strip,.tj-outcome{grid-template-columns:1fr !important;}
  .tj-overview-copy{padding:3rem 1.2rem;border-right:none;border-bottom:1px solid var(--border);}
  .tj-value{min-height:auto;padding:2rem 1.2rem;}
  .tj-brand-map{grid-template-columns:1fr;}
  .tj-brand-line{height:42px;width:1px;margin:0 auto;background:linear-gradient(180deg,var(--tj-gold),rgba(255,255,255,.08));}
  .tj-route-card{min-height:300px;padding:1.4rem;}
  .tj-screens{padding:3rem 1.2rem;}
  .tj-desktop-shot img{height:360px;}
  .tj-mobile-shot{width:210px;margin:0 auto;transform:none;}
  .tj-mobile-shot img{height:430px;}
  .tj-process-strip div{border-right:none;border-bottom:1px solid var(--border);min-height:120px;}
}

@media(max-width:920px){
  .d-tj .d-meta-grid{grid-template-columns:1fr !important;gap:.9rem !important;}
  .d-tj .d-mi{min-width:0;}
  .d-tj .d-mv{overflow-wrap:anywhere;word-break:normal;}
  .d-tj .d-hero-num{white-space:normal;line-height:1.8;}
  .d-tj .tj-title{font-size:clamp(3.6rem,18vw,5.2rem);}
  .d-tj .tj-subtitle{font-size:1.35rem;line-height:1.55;}
}

@media(max-width:920px){
  .d-tj .d-hero-l{overflow:hidden;}
  .d-tj .d-hero-tag,
  .d-tj .tj-subtitle,
  .d-tj .d-hero-num{max-width:100%;overflow-wrap:anywhere;word-break:break-word;}
}

@media(max-width:920px){
  .d-tj .d-hero,
  .d-tj .d-hero-l,
  .d-tj .d-hero-r{min-width:0;width:100%;max-width:100vw;}
  .d-tj .d-hero-l{overflow:visible;}
  .d-tj .d-hero-l > *{min-width:0;max-width:100%;}
  .d-tj .d-hero-tag{width:100%;}
}

@media(max-width:920px){
  .d-tj .d-hero-l{padding-right:2.4rem !important;}
  .d-tj .d-hero-num{font-size:.54rem;}
  .d-tj .d-hero-tag{font-size:.92rem;line-height:1.85;}
}

/* ════ TJ Brothers rhythm reset: airy, brand-colored, fewer blocks ════ */
.tj-refresh{
  --tj-navy:#1e2448;
  --tj-navy-2:#11162e;
  --tj-gold:#a77d47;
  --tj-gold-2:#c8a56c;
  --tj-cream:#f6f1e8;
  --tj-paper:#ffffff;
  --tj-text:#191b24;
  --tj-muted:#6c7082;
  background:var(--tj-paper);
}
.tj-refresh .tj-sticky-live{
  position:fixed;
  right:2rem;
  bottom:2rem;
  z-index:450;
  display:inline-flex;
  align-items:center;
  gap:.75rem;
  padding:1.05rem 1.35rem;
  background:var(--tj-navy);
  color:#fff;
  text-decoration:none;
  font-family:'DM Mono',monospace;
  font-size:.66rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 22px 60px rgba(17,22,46,.24);
  cursor:none;
}
.tj-refresh .tj-sticky-live span:last-child{color:var(--tj-gold-2);font-size:1rem;}
.tj-refresh .tj-panel{
  min-height:calc(100vh - var(--nav));
  padding:clamp(5rem,7vw,8rem) clamp(2rem,5vw,5rem);
  border-bottom:1px solid rgba(30,36,72,.12);
  position:relative;
  overflow:hidden;
}
.tj-refresh .tj-eyebrow{
  font-family:'DM Mono',monospace;
  font-size:.68rem;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--tj-gold);
  margin-bottom:1.4rem;
}
.tj-refresh .tj-panel h2{
  font-family:'Noto Sans JP',sans-serif;
  font-size:clamp(2.35rem,4.6vw,5.15rem);
  line-height:1.28;
  font-weight:500;
  letter-spacing:.01em;
  color:var(--tj-text);
  text-wrap:balance;
}
.tj-refresh .tj-panel p{
  font-size:clamp(.98rem,1.05vw,1.12rem);
  line-height:2.05;
  color:var(--tj-muted);
}
.tj-refresh .tj-panel-hero{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(3rem,5vw,6rem);
  align-items:center;
  background:
    radial-gradient(circle at 14% 18%,rgba(167,125,71,.18),transparent 30%),
    linear-gradient(135deg,#f8f5ee 0%,#fff 46%,#eef1f7 100%);
  padding-top:clamp(4rem,6vw,7rem);
}
.tj-refresh .tj-panel-hero::after{
  content:'TJ';
  position:absolute;
  right:-3vw;
  bottom:-6vw;
  font-family:'Bebas Neue',sans-serif;
  font-size:32vw;
  line-height:.75;
  color:rgba(30,36,72,.045);
  pointer-events:none;
}
.tj-refresh .tj-hero-copy{position:relative;z-index:2;max-width:760px;}
.tj-refresh .tj-logo-mark{width:88px;height:88px;object-fit:contain;margin-bottom:2.1rem;}
.tj-refresh .tj-hero-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(5.5rem,10vw,11.5rem);
  line-height:.82;
  letter-spacing:-.015em;
  color:var(--tj-navy);
  margin:0 0 1.4rem;
}
.tj-refresh .tj-hero-lead{
  font-size:clamp(1.6rem,2.45vw,2.65rem) !important;
  line-height:1.45 !important;
  color:var(--tj-gold) !important;
  font-weight:500;
  max-width:760px;
  margin-bottom:2rem;
}
.tj-refresh .tj-hero-body{max-width:690px;color:#4b5063 !important;}
.tj-refresh .tj-hero-actions{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;margin-top:2.4rem;}
.tj-refresh .tj-primary-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.85rem;
  min-width:240px;
  padding:1.2rem 1.6rem;
  background:var(--tj-navy);
  color:#fff;
  text-decoration:none;
  font-family:'DM Mono',monospace;
  font-size:.72rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  border:1px solid var(--tj-navy);
  box-shadow:0 20px 50px rgba(30,36,72,.22);
  cursor:none;
  transition:transform .25s,background .25s,box-shadow .25s;
}
.tj-refresh .tj-primary-cta:hover{transform:translateY(-3px);background:#29305a;box-shadow:0 26px 70px rgba(30,36,72,.3);}
.tj-refresh .tj-primary-cta span:last-child{color:var(--tj-gold-2);font-size:1rem;}
.tj-refresh .tj-mini-note{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tj-muted);}
.tj-refresh .tj-hero-visual{position:relative;z-index:1;}
.tj-refresh .tj-browser-frame{
  background:#fff;
  border:1px solid rgba(30,36,72,.12);
  box-shadow:0 38px 100px rgba(30,36,72,.18);
  transform:rotate(-1.2deg);
  overflow:hidden;
}
.tj-refresh .tj-browser-frame img{width:100%;height:min(62vh,650px);object-fit:cover;object-position:top;}
.tj-refresh .tj-panel-white{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1fr);
  gap:clamp(4rem,6vw,7rem);
  align-items:center;
  background:#fff;
}
.tj-refresh .tj-section-copy{max-width:850px;}
.tj-refresh .tj-section-copy p:last-child{max-width:720px;margin-top:2rem;}
.tj-refresh .tj-capability-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.2rem;
}
.tj-refresh .tj-capability-grid article{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:1.7rem;
  align-items:center;
  min-height:150px;
  padding:2rem;
  border:1px solid rgba(30,36,72,.12);
  background:linear-gradient(135deg,#fff,#f7f8fb);
}
.tj-refresh .tj-capability-grid article span,
.tj-refresh .tj-process-large span{
  font-family:'Bebas Neue',sans-serif;
  font-size:4.6rem;
  line-height:1;
  color:rgba(30,36,72,.18);
}
.tj-refresh .tj-capability-grid h3,
.tj-refresh .tj-process-large h3{font-size:1.25rem;margin-bottom:.35rem;color:var(--tj-text);}
.tj-refresh .tj-capability-grid p,
.tj-refresh .tj-process-large p{font-size:.9rem;line-height:1.75;color:var(--tj-muted);}
.tj-refresh .tj-panel-navy,
.tj-refresh .tj-panel-final{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(4rem,6vw,7rem);
  align-items:center;
  background:
    radial-gradient(circle at 82% 18%,rgba(167,125,71,.18),transparent 32%),
    linear-gradient(135deg,var(--tj-navy-2),var(--tj-navy));
  color:#fff;
}
.tj-refresh .tj-panel-navy h2,
.tj-refresh .tj-panel-final h2{color:#fff;}
.tj-refresh .tj-panel-navy p,
.tj-refresh .tj-panel-final p{color:rgba(255,255,255,.72);}
.tj-refresh .tj-brand-system{display:grid;gap:1.4rem;}
.tj-refresh .tj-brand-main{
  min-height:260px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.055);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:.75rem;
}
.tj-refresh .tj-brand-main img{width:120px;height:120px;object-fit:contain;background:#fff;border-radius:50%;padding:1.1rem;}
.tj-refresh .tj-brand-main strong{font-size:1.35rem;color:#fff;}
.tj-refresh .tj-brand-main span{font-family:'DM Mono',monospace;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tj-gold-2);}
.tj-refresh .tj-brand-children{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;}
.tj-refresh .tj-brand-children div{min-height:170px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.9rem;padding:1rem;}
.tj-refresh .tj-brand-children img{width:80px;height:80px;border-radius:50%;object-fit:cover;}
.tj-refresh .tj-brand-children span{font-family:'Bebas Neue',sans-serif;font-size:3.4rem;color:var(--tj-gold-2);line-height:1;}
.tj-refresh .tj-brand-children strong{color:#fff;font-size:.95rem;}
.tj-refresh .tj-panel-map{
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:clamp(4rem,6vw,7rem);
  align-items:center;
  background:var(--tj-cream);
}
.tj-refresh .tj-paths{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;}
.tj-refresh .tj-paths article{position:relative;min-height:540px;overflow:hidden;display:flex;align-items:flex-end;padding:2rem;background:#000;}
.tj-refresh .tj-paths img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1);}
.tj-refresh .tj-paths article:hover img{transform:scale(1.05);}
.tj-refresh .tj-paths article::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,22,46,.05),rgba(17,22,46,.72));}
.tj-refresh .tj-paths div{position:relative;z-index:1;color:#fff;}
.tj-refresh .tj-paths span{font-family:'DM Mono',monospace;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tj-gold-2);}
.tj-refresh .tj-paths h3{font-size:1.45rem;margin:.8rem 0 .4rem;color:#fff;}
.tj-refresh .tj-paths p{color:rgba(255,255,255,.76);font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;}
.tj-refresh .tj-panel-showcase{background:#fff;display:grid;grid-template-rows:auto 1fr;gap:3.5rem;}
.tj-refresh .tj-showcase-head{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end;}
.tj-refresh .tj-showcase-head h2{max-width:850px;font-size:clamp(2.1rem,3.6vw,4.1rem);}
.tj-refresh .tj-screen-pair{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:2rem;align-items:start;}
.tj-refresh .tj-desktop-clean{border:1px solid rgba(30,36,72,.12);box-shadow:0 30px 90px rgba(30,36,72,.15);height:min(66vh,720px);overflow:hidden;background:#fff;}
.tj-refresh .tj-desktop-clean img{width:100%;height:100%;object-fit:cover;object-position:top;}
.tj-refresh .tj-phone-clean{background:#111;border:10px solid #111;border-radius:30px;box-shadow:0 28px 70px rgba(30,36,72,.22);height:min(60vh,640px);overflow:hidden;}
.tj-refresh .tj-phone-clean img{width:100%;height:100%;object-fit:cover;object-position:top;}
.tj-refresh .tj-panel-process{grid-template-columns:.8fr 1.2fr;}
.tj-refresh .tj-process-large{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;}
.tj-refresh .tj-process-large div{min-height:420px;padding:2rem;border:1px solid rgba(30,36,72,.12);display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(180deg,#fff,#f7f8fb);}
.tj-refresh .tj-final-copy{max-width:850px;}
.tj-refresh .tj-final-copy p{margin:2rem 0 2.5rem;max-width:700px;}
.tj-refresh .tj-final-stats{display:grid;grid-template-columns:1fr;gap:1.2rem;}
.tj-refresh .tj-final-stats div{min-height:170px;padding:2rem;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:space-between;gap:2rem;}
.tj-refresh .tj-final-stats strong{font-family:'Bebas Neue',sans-serif;font-size:5.5rem;line-height:1;color:var(--tj-gold-2);}
.tj-refresh .tj-final-stats span{font-size:1.05rem;font-weight:700;color:#fff;}

/* TJ homepage card now uses logo palette instead of the shared brown case palette */
.feat-hero{
  background:linear-gradient(135deg,#10162f 0%,#1e2448 48%,#f7f5ef 48%,#fff 100%);
}
.feat-hero-copy{border-right-color:rgba(255,255,255,.14);}
.feat-hero-num,.feat-hero-sub,.feat-hero .feat-sm-ml{color:rgba(255,255,255,.72);}
.feat-hero-title{color:#fff;}
.feat-hero-title .gold{color:#c8a56c;}
.feat-hero-tag{color:#f1d8a8;border-color:rgba(200,165,108,.42);background:rgba(200,165,108,.08);}
.feat-hero-meta{border-top-color:rgba(255,255,255,.16);}
.feat-hero .feat-sm-mv{color:#fff;}
.feat-hero::after{background:linear-gradient(90deg,#c8a56c,#fff,#c8a56c);}
.feat-hero-visual::before{color:rgba(30,36,72,.07);}

@media(max-width:1100px){
  .tj-refresh .tj-panel-hero,
  .tj-refresh .tj-panel-white,
  .tj-refresh .tj-panel-navy,
  .tj-refresh .tj-panel-map,
  .tj-refresh .tj-panel-final,
  .tj-refresh .tj-panel-process{grid-template-columns:1fr;}
  .tj-refresh .tj-panel{min-height:auto;}
  .tj-refresh .tj-screen-pair{grid-template-columns:1fr;}
  .tj-refresh .tj-phone-clean{width:260px;justify-self:center;}
  .tj-refresh .tj-showcase-head{grid-template-columns:1fr;align-items:start;}
}
@media(max-width:920px){
  .tj-refresh .tj-sticky-live{left:1rem;right:1rem;bottom:1rem;justify-content:center;}
  .tj-refresh .tj-panel{padding:4rem 1.25rem;}
  .tj-refresh .tj-logo-mark{width:68px;height:68px;}
  .tj-refresh .tj-hero-title{font-size:clamp(4rem,20vw,6.4rem);}
  .tj-refresh .tj-browser-frame{transform:none;}
  .tj-refresh .tj-browser-frame img{height:360px;}
  .tj-refresh .tj-capability-grid article{grid-template-columns:1fr;gap:.8rem;min-height:auto;padding:1.5rem;}
  .tj-refresh .tj-brand-children,.tj-refresh .tj-paths,.tj-refresh .tj-process-large{grid-template-columns:1fr;}
  .tj-refresh .tj-paths article{min-height:330px;}
  .tj-refresh .tj-desktop-clean{height:360px;}
  .tj-refresh .tj-phone-clean{height:430px;width:220px;}
  .tj-refresh .tj-process-large div{min-height:260px;}
  .tj-refresh .tj-primary-cta{width:100%;min-width:0;}
}

@media(max-width:920px){
  .tj-refresh .tj-sticky-live{display:none;}
}
@media(min-width:921px){
  .tj-refresh .tj-panel-hero{padding-top:clamp(3.5rem,5vw,5.5rem);}
}

/* Global case-study rhythm: give existing detail pages more breathing room. */
@media(min-width:921px){
  body:not([data-project="tj"]) .case-copy{
    min-height:72vh;
    padding:clamp(6rem,8.5vw,9rem) 3rem;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  body:not([data-project="tj"]) .case-head{
    gap:clamp(3.5rem,6vw,7rem);
    margin-bottom:clamp(4rem,5vw,5.6rem);
  }
  body:not([data-project="tj"]) .case-head>div:last-child{
    padding:2rem 2.2rem;
  }
  body:not([data-project="tj"]) .case-body{
    max-width:760px;
  }
  body:not([data-project="tj"]) .case-card{
    padding:2.8rem 2.4rem;
  }
  body:not([data-project="tj"]) .case-decision .case-card,
  body:not([data-project="tj"]) .case-subgrid .case-card{
    min-height:330px;
  }
}

/* Homepage balance pass: keep TJ featured, but let it belong to the portfolio system. */
.feat-hero{
  min-height:430px;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  background:#fff;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.feat-hero::after{
  height:2px;
  background:linear-gradient(90deg,var(--red),rgba(240,90,73,.18),transparent);
  transform:scaleX(.22);
}
.feat-hero-copy{
  padding:3.1rem 3rem;
  border-right:1px solid var(--border);
  background:
    linear-gradient(90deg,rgba(240,90,73,.035),transparent 46%),
    #fff;
}
.feat-hero-num{
  color:var(--muted-d);
}
.feat-hero-title{
  font-size:clamp(3.4rem,6vw,6.3rem);
  color:var(--fg);
  margin:.2rem 0 1rem;
}
.feat-hero-title .gold{
  color:var(--red);
}
.feat-hero-sub{
  color:#4f4a44;
  font-size:.92rem;
  line-height:1.75;
  max-width:620px;
}
.feat-hero-tag{
  color:var(--red);
  border-color:rgba(240,90,73,.28);
  background:rgba(240,90,73,.04);
}
.feat-hero-meta{
  border-top:1px solid var(--border);
  padding-top:1rem;
}
.feat-hero .feat-sm-ml{color:var(--muted-d);}
.feat-hero .feat-sm-mv{color:var(--fg);}
.feat-hero-visual{
  padding:2.1rem 3rem;
  background:
    radial-gradient(circle at 85% 80%,rgba(30,36,72,.08),transparent 34%),
    #fbfaf8;
}
.feat-hero-visual::before{
  display:none;
}
.feat-hero-shot{
  width:min(650px,88%);
  transform:rotate(-.7deg);
  box-shadow:0 24px 60px rgba(31,29,26,.13);
}
.feat-hero:hover .feat-hero-shot{
  transform:rotate(0) translateY(-4px);
  box-shadow:0 30px 76px rgba(31,29,26,.16);
}
.feat-hero-shot img{
  max-height:300px;
}
.feat-hero-phone{
  width:112px;
  right:3.2rem;
  bottom:2rem;
  border-width:6px;
  border-radius:18px;
  box-shadow:0 18px 42px rgba(0,0,0,.22);
}
.feat-hero-phone img{
  height:218px;
}
.feat-hero .featured-badge{
  color:#8a642d;
  border-color:rgba(176,125,58,.3);
  background:rgba(176,125,58,.055) !important;
}
@media(max-width:920px){
  .feat-hero-copy{padding:2.4rem 1.2rem;}
  .feat-hero-visual{padding:1.6rem 1.2rem 4.5rem;}
  .feat-hero-shot{width:100%;}
  .feat-hero-phone{width:96px;right:1.2rem;bottom:1rem;}
  .feat-hero-phone img{height:178px;}
}

/* Second homepage balance pass: featured, not dominant. */
.feat-hero{
  min-height:360px;
}
.feat-hero-copy{
  padding:2.35rem 3rem;
}
.feat-hero-title{
  font-size:clamp(2.9rem,4.7vw,5.05rem);
  line-height:.86;
  margin:.1rem 0 .85rem;
}
.feat-hero-title .gold{
  color:var(--fg);
}
.feat-hero-sub{
  font-size:.86rem;
  line-height:1.72;
  max-width:560px;
}
.feat-hero-tags{
  margin-top:1rem;
}
.feat-hero-meta{
  gap:.8rem;
  padding-top:.85rem;
}
.feat-hero-visual{
  padding:1.6rem 3rem;
}
.feat-hero-shot{
  width:min(570px,82%);
}
.feat-hero-shot img{
  max-height:250px;
}
.feat-hero-phone{
  width:92px;
  right:3rem;
  bottom:1.45rem;
}
.feat-hero-phone img{
  height:176px;
}
.feat-hero .featured-badge{
  color:var(--red);
  border-color:rgba(240,90,73,.28);
  background:rgba(240,90,73,.035) !important;
}
@media(max-width:920px){
  .feat-hero-copy{padding:2rem 1.2rem;}
  .feat-hero-visual{padding:1.4rem 1.2rem 3.6rem;}
  .feat-hero-shot{width:100%;}
  .feat-hero-phone{width:82px;right:1.2rem;bottom:.9rem;}
  .feat-hero-phone img{height:150px;}
}

/* Homepage TJ preview: use the final packaged mockup as a single asset. */
.feat-hero-visual{
  padding:1.2rem 2rem;
  background:#fff !important;
}
.feat-hero-mockup{
  position:relative;
  z-index:2;
  width:min(760px,100%);
  height:auto;
  display:block;
  filter:none;
  transition:transform .55s cubic-bezier(.2,.8,.2,1);
}
.feat-hero:hover .feat-hero-mockup{
  transform:translateY(-4px);
  filter:none;
}
@media(max-width:920px){
  .feat-hero{
    grid-template-columns:1fr !important;
    min-height:auto;
  }
  .feat-hero-copy{
    border-right:none;
    border-bottom:1px solid var(--border);
    padding:2rem 1.25rem;
  }
  .feat-hero-num{
    align-items:flex-start;
  }
  .feat-hero-title{
    font-size:clamp(3.6rem,18vw,5.6rem);
  }
  .feat-hero-sub{
    font-size:.94rem;
    line-height:1.78;
  }
  .feat-hero-meta{
    grid-template-columns:1fr;
  }
  .feat-hero-visual{
    padding:1.2rem 1rem 1.5rem;
    min-height:auto;
  }
  .feat-hero-mockup{
    width:100%;
  }
}

/* Mobile homepage hero cleanup: stack the intro cleanly and keep stats in one row. */
@media(max-width:920px){
  .hero-inner{
    padding:3rem 1.2rem 2.4rem;
  }
  .hero-top{
    gap:1rem;
  }
  .hero-top-r{
    display:none;
  }
  .hero-bottom{
    display:flex !important;
    flex-direction:column;
    align-items:flex-start;
    gap:1.35rem;
    padding-top:1.35rem;
  }
  .hero-desc{
    max-width:100%;
    font-size:.92rem;
    line-height:1.85;
  }
  .hero-meta{
    order:3;
    width:100%;
    padding-top:1.15rem;
    border-top:1px solid rgba(17,17,17,.1);
  }
  .hero-cta{
    order:2;
    width:100%;
    justify-content:center;
    padding:16px 20px;
    align-self:stretch;
  }
  .stats{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .stat{
    padding:1.55rem .85rem;
    border-top:none !important;
    border-right:1px solid var(--border) !important;
  }
  .stat:last-child{
    border-right:none !important;
  }
  .stat-n{
    font-size:clamp(2.8rem,15vw,4.2rem);
  }
  .stat-l{
    font-size:.58rem;
    line-height:1.5;
    letter-spacing:.1em;
  }
}

/* Fix over-scaled TJ process section. Keep it calm and readable. */
.tj-refresh .tj-panel-process{
  min-height:auto;
  padding:clamp(4.5rem,6vw,6rem) clamp(2rem,5vw,5rem);
  grid-template-columns:.9fr 1.1fr;
  gap:clamp(3rem,5vw,5rem);
  align-items:center;
}
.tj-refresh .tj-panel-process .tj-section-copy h2{
  font-size:clamp(1.9rem,2.8vw,3.15rem);
  line-height:1.42;
  max-width:620px;
}
.tj-refresh .tj-panel-process .tj-section-copy p:last-child{
  max-width:560px;
}
.tj-refresh .tj-process-large{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}
.tj-refresh .tj-process-large div{
  min-height:240px;
  padding:1.6rem;
  justify-content:flex-start;
  gap:1.4rem;
}
.tj-refresh .tj-process-large span{
  font-size:2.2rem;
  color:var(--tj-gold);
  opacity:.9;
}
.tj-refresh .tj-process-large h3{
  font-size:1.05rem;
  margin:0;
}
.tj-refresh .tj-process-large p{
  font-size:.82rem;
  line-height:1.7;
}
@media(max-width:920px){
  .tj-refresh .tj-panel-process{grid-template-columns:1fr;padding:3.5rem 1.25rem;}
  .tj-refresh .tj-process-large{grid-template-columns:1fr;}
  .tj-refresh .tj-process-large div{min-height:auto;}
}

/* Safety fix: process numbers only, never language spans or body copy. */
.tj-refresh .tj-process-large div > span{
  display:block;
  font-family:'DM Mono',monospace;
  font-size:.72rem;
  line-height:1;
  letter-spacing:.16em;
  color:var(--tj-gold);
  opacity:1;
  margin-bottom:1.2rem;
}
.tj-refresh .tj-process-large div > span span{
  font-family:inherit;
  font-size:inherit;
  line-height:inherit;
  letter-spacing:inherit;
  color:inherit;
  opacity:inherit;
}
.tj-refresh .tj-process-large h3 span,
.tj-refresh .tj-process-large p span{
  font-size:inherit !important;
  line-height:inherit !important;
  letter-spacing:inherit !important;
  color:inherit !important;
  opacity:inherit !important;
  font-family:inherit !important;
}
.tj-refresh .tj-process-large h3{
  font-size:1.12rem;
  line-height:1.5;
  font-weight:700;
  color:var(--tj-text);
  margin:0 0 .7rem;
}
.tj-refresh .tj-process-large p{
  font-size:.88rem;
  line-height:1.85;
  font-weight:400;
  color:var(--tj-muted);
}

/* Safety fix: capability grid numbers only; language spans must keep normal hierarchy. */
.tj-refresh .tj-capability-grid article > span{
  font-family:'DM Mono',monospace;
  font-size:.72rem;
  line-height:1;
  letter-spacing:.16em;
  color:var(--tj-gold);
  opacity:1;
}
.tj-refresh .tj-capability-grid h3 span,
.tj-refresh .tj-capability-grid p span,
.tj-refresh .tj-section-copy h2 span,
.tj-refresh .tj-section-copy p span,
.tj-refresh .tj-showcase-head h2 span,
.tj-refresh .tj-final-copy h2 span,
.tj-refresh .tj-final-copy p span{
  font-size:inherit !important;
  line-height:inherit !important;
  letter-spacing:inherit !important;
  color:inherit !important;
  opacity:inherit !important;
  font-family:inherit !important;
  font-weight:inherit !important;
}
.tj-refresh .tj-capability-grid h3{
  font-size:1.15rem;
  line-height:1.45;
  font-weight:700;
  color:var(--tj-text);
}
.tj-refresh .tj-capability-grid p{
  font-size:.9rem;
  line-height:1.8;
  font-weight:400;
  color:var(--tj-muted);
}

/* Live website section: one alignment system + framed scrollable previews. */
.tj-refresh .tj-browser-lab{
  background:#fff;
  display:block;
  min-height:auto;
  padding:clamp(4.5rem,6vw,6.5rem) clamp(2rem,5vw,5rem);
}
.tj-refresh .tj-browser-lab .tj-showcase-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:2.4rem;
  align-items:end;
  margin-bottom:3rem;
}
.tj-refresh .tj-browser-lab .tj-showcase-head h2{
  max-width:760px;
  font-size:clamp(2rem,3.1vw,3.45rem);
  line-height:1.35;
}
.tj-refresh .tj-showcase-copy{
  max-width:720px;
  margin-top:1.2rem;
  font-size:.96rem;
  line-height:1.9;
  color:var(--tj-muted);
}
.tj-refresh .tj-live-preview{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:1.5rem;
  align-items:end;
  padding:1.5rem;
  border:1px solid rgba(30,36,72,.12);
  background:
    linear-gradient(135deg,#f7f8fb 0%,#fff 52%,#f4f1eb 100%);
}
.tj-refresh .tj-live-browser{
  min-width:0;
  background:#fff;
  border:1px solid rgba(30,36,72,.14);
  box-shadow:0 26px 70px rgba(30,36,72,.12);
}
.tj-refresh .tj-live-scroll{
  height:min(62vh,620px);
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:rgba(30,36,72,.28) rgba(30,36,72,.06);
}
.tj-refresh .tj-live-scroll::-webkit-scrollbar,
.tj-refresh .tj-phone-scroll::-webkit-scrollbar{width:6px;}
.tj-refresh .tj-live-scroll::-webkit-scrollbar-thumb,
.tj-refresh .tj-phone-scroll::-webkit-scrollbar-thumb{background:rgba(30,36,72,.28);border-radius:999px;}
.tj-refresh .tj-live-scroll img{
  width:100%;
  height:auto;
  display:block;
}
.tj-refresh .tj-live-phone{
  width:240px;
  height:min(58vh,570px);
  border:10px solid #111;
  border-radius:30px;
  background:#111;
  box-shadow:0 26px 70px rgba(30,36,72,.2);
  overflow:hidden;
  justify-self:center;
}
.tj-refresh .tj-phone-top{
  height:22px;
  background:#111;
  position:relative;
}
.tj-refresh .tj-phone-top::after{
  content:'';
  position:absolute;
  left:50%;
  top:7px;
  width:54px;
  height:5px;
  transform:translateX(-50%);
  border-radius:999px;
  background:#262626;
}
.tj-refresh .tj-phone-scroll{
  height:calc(100% - 22px);
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
}
.tj-refresh .tj-phone-scroll img{
  width:100%;
  height:auto;
  display:block;
}
.tj-refresh .tj-preview-note{
  position:absolute;
  left:1.5rem;
  bottom:.55rem;
  font-family:'DM Mono',monospace;
  font-size:.58rem !important;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(108,112,130,.72) !important;
  line-height:1;
}
.tj-refresh .tj-preview-note span{font-size:inherit !important;color:inherit !important;}
@media(max-width:1100px){
  .tj-refresh .tj-browser-lab .tj-showcase-head{grid-template-columns:1fr;align-items:start;}
  .tj-refresh .tj-live-preview{grid-template-columns:1fr;}
  .tj-refresh .tj-live-phone{width:240px;height:500px;}
}
@media(max-width:920px){
  .tj-refresh .tj-browser-lab{padding:3.6rem 1.25rem;}
  .tj-refresh .tj-live-preview{padding:1rem;padding-bottom:2rem;}
  .tj-refresh .tj-live-scroll{height:390px;}
  .tj-refresh .tj-live-phone{width:210px;height:430px;}
}

/* Reflection should close the case calmly, not become a giant manifesto. */
.tj-refresh .tj-final-summary{
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  gap:clamp(3rem,5vw,5.5rem);
  min-height:auto;
  align-items:start;
  padding:clamp(4.75rem,7vw,7rem) clamp(2rem,5vw,5rem);
  background:
    radial-gradient(circle at 88% 8%,rgba(210,179,112,.14),transparent 28%),
    linear-gradient(135deg,#141a35,#202642);
}
.tj-refresh .tj-final-summary .tj-final-copy{
  max-width:620px;
}
.tj-refresh .tj-final-summary .tj-final-copy h2{
  margin-top:1.55rem;
  max-width:620px;
  font-size:clamp(1.75rem,2.35vw,2.7rem);
  line-height:1.38;
  font-weight:700;
  letter-spacing:-.035em;
  color:#fff;
}
.tj-refresh .tj-final-summary .tj-final-copy p{
  margin:1.35rem 0 0;
  max-width:560px;
  font-size:.96rem;
  line-height:2;
  font-weight:400;
  color:rgba(255,255,255,.7);
}
.tj-refresh .tj-final-summary .tj-final-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}
.tj-refresh .tj-final-summary .tj-final-stats div{
  min-height:220px;
  padding:1.45rem;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.045);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:1rem;
}
.tj-refresh .tj-final-summary .tj-final-stats strong{
  font-family:'DM Mono',monospace;
  font-size:.75rem;
  line-height:1;
  letter-spacing:.16em;
  color:var(--tj-gold-2);
}
.tj-refresh .tj-final-summary .tj-final-stats span{
  font-size:1.03rem;
  line-height:1.5;
  font-weight:700;
  color:#fff;
}
.tj-refresh .tj-final-summary .tj-final-stats p{
  margin:auto 0 0;
  font-size:.86rem;
  line-height:1.8;
  font-weight:400;
  color:rgba(255,255,255,.62);
}
.tj-refresh .tj-final-summary .tj-final-stats span span,
.tj-refresh .tj-final-summary .tj-final-stats p span{
  font-size:inherit !important;
  line-height:inherit !important;
  letter-spacing:inherit !important;
  color:inherit !important;
  font-family:inherit !important;
  font-weight:inherit !important;
}
@media(max-width:1100px){
  .tj-refresh .tj-final-summary{
    grid-template-columns:1fr;
  }
}
@media(max-width:920px){
  .tj-refresh .tj-final-summary{
    padding:3.6rem 1.25rem;
  }
  .tj-refresh .tj-final-summary .tj-final-copy h2{
    font-size:clamp(1.55rem,7vw,2.15rem);
  }
  .tj-refresh .tj-final-summary .tj-final-stats{
    grid-template-columns:1fr;
  }
  .tj-refresh .tj-final-summary .tj-final-stats div{
    min-height:160px;
  }
}

/* TJ section titles: clear hierarchy, but avoid oversized CJK display type. */
.tj-refresh .tj-section-copy h2,
.tj-refresh .tj-panel-navy .tj-section-copy h2,
.tj-refresh .tj-panel-map .tj-section-copy h2,
.tj-refresh .tj-panel-white .tj-section-copy h2{
  font-size:clamp(1.85rem,2.75vw,3rem);
  line-height:1.42;
  font-weight:700;
  letter-spacing:-.03em;
}
.tj-refresh .tj-section-copy p:last-child{
  font-size:.98rem;
  line-height:1.95;
  font-weight:400;
}
@media(max-width:920px){
  .tj-refresh .tj-section-copy h2,
  .tj-refresh .tj-panel-navy .tj-section-copy h2,
  .tj-refresh .tj-panel-map .tj-section-copy h2,
  .tj-refresh .tj-panel-white .tj-section-copy h2{
    font-size:clamp(1.65rem,8vw,2.35rem);
  }
}

/* TJ refinement: labels need color, and cards need one clear reading axis. */
.tj-refresh .tj-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.8rem;
  color:var(--tj-gold);
  font-weight:500;
  margin-bottom:1.2rem;
}
.tj-refresh .tj-eyebrow::before{
  content:'';
  width:2.2rem;
  height:2px;
  background:currentColor;
  opacity:.72;
}
.tj-refresh .tj-panel-white .tj-eyebrow,
.tj-refresh .tj-browser-lab .tj-eyebrow{
  color:var(--tj-navy);
}
.tj-refresh .tj-panel-white .tj-eyebrow::before,
.tj-refresh .tj-browser-lab .tj-eyebrow::before{
  background:var(--tj-gold);
  opacity:1;
}
.tj-refresh .tj-capability-grid{
  gap:1rem;
}
.tj-refresh .tj-capability-grid article{
  position:relative;
  display:grid;
  grid-template-columns:3.6rem minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:1.45rem;
  row-gap:.65rem;
  align-items:start;
  min-height:168px;
  padding:1.75rem 1.9rem;
  background:
    linear-gradient(90deg,rgba(167,125,71,.08),transparent 42%),
    linear-gradient(135deg,#fff,#f7f8fb);
}
.tj-refresh .tj-capability-grid article::after{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(180deg,var(--tj-gold),rgba(167,125,71,.18));
}
.tj-refresh .tj-capability-grid article > span{
  grid-column:1;
  grid-row:1 / span 2;
  padding-top:.2rem;
  text-align:left;
  font-size:.78rem;
}
.tj-refresh .tj-capability-grid h3{
  grid-column:2;
  grid-row:1;
  margin:0;
  text-align:left;
}
.tj-refresh .tj-capability-grid p{
  grid-column:2;
  grid-row:2;
  margin:0;
  text-align:left;
}
.tj-refresh .tj-panel-ownership{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(3rem,5vw,5.5rem);
  align-items:center;
  min-height:auto;
  background:
    radial-gradient(circle at 8% 12%,rgba(167,125,71,.13),transparent 30%),
    linear-gradient(135deg,#f8f5ee 0%,#fff 52%,#eef1f7 100%);
}
.tj-refresh .tj-ownership-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}
.tj-refresh .tj-ownership-list article{
  min-height:270px;
  padding:1.55rem;
  border:1px solid rgba(30,36,72,.12);
  background:rgba(255,255,255,.78);
  box-shadow:0 22px 60px rgba(30,36,72,.07);
  display:flex;
  flex-direction:column;
  gap:1rem;
}
.tj-refresh .tj-ownership-list article:nth-child(2),
.tj-refresh .tj-ownership-list article:nth-child(3){
  background:linear-gradient(135deg,#fff,rgba(248,245,238,.9));
}
.tj-refresh .tj-ownership-list article > span{
  font-family:'DM Mono',monospace;
  font-size:.66rem;
  line-height:1;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--tj-gold);
}
.tj-refresh .tj-ownership-list h3{
  margin:0;
  max-width:16em;
  font-size:1.12rem;
  line-height:1.5;
  font-weight:700;
  color:var(--tj-text);
}
.tj-refresh .tj-ownership-list p{
  margin:auto 0 0;
  font-size:.88rem;
  line-height:1.85;
  color:var(--tj-muted);
}
.tj-refresh .tj-ownership-list h3 span,
.tj-refresh .tj-ownership-list p span{
  font-size:inherit !important;
  line-height:inherit !important;
  color:inherit !important;
  font-family:inherit !important;
  font-weight:inherit !important;
}
@media(max-width:1100px){
  .tj-refresh .tj-panel-ownership{
    grid-template-columns:1fr;
  }
}
@media(max-width:920px){
  .tj-refresh .tj-capability-grid article{
    grid-template-columns:3rem minmax(0,1fr) !important;
    padding:1.45rem 1.35rem;
    min-height:auto;
  }
  .tj-refresh .tj-capability-grid article > span{
    grid-column:1;
    grid-row:1 / span 2;
  }
  .tj-refresh .tj-capability-grid h3,
  .tj-refresh .tj-capability-grid p{
    grid-column:2;
  }
  .tj-refresh .tj-panel-ownership{
    padding:3.7rem 1.25rem;
  }
  .tj-refresh .tj-ownership-list{
    grid-template-columns:1fr;
  }
  .tj-refresh .tj-ownership-list article{
    min-height:auto;
  }
}

/* TJ layout merge: keep the portfolio typography, but restore the calmer case-study rhythm. */
.tj-refresh{
  --tj-blue:#1f2448;
  --tj-blue-2:#2f365f;
  --tj-ice:#f7f8fb;
  --tj-paper-warm:#fbfaf6;
  --tj-paper-soft:#f2f4f8;
  --tj-rule:#dfe3ec;
  --tj-copy:#5d6170;
  --tj-gold:#a77d47;
  --tj-gold-2:#c39b5d;
  --tj-charcoal:#1f1d1a;
  background:var(--tj-paper-warm);
  color:var(--tj-blue);
}
.tj-refresh .reveal{
  opacity:1;
  transform:none;
}
.tj-refresh .reveal.vis{
  opacity:1;
  transform:none;
}
.tj-refresh .tj-panel{
  min-height:auto;
  padding:clamp(4.75rem,8vw,8.5rem) clamp(1.35rem,5vw,4.5rem);
  border-bottom:1px solid var(--tj-rule);
}
.tj-refresh .tj-eyebrow{
  color:var(--tj-gold);
  margin-bottom:1.45rem;
}
.tj-refresh .tj-panel h2,
.tj-refresh .tj-section-copy h2,
.tj-refresh .tj-panel-navy .tj-section-copy h2,
.tj-refresh .tj-panel-map .tj-section-copy h2,
.tj-refresh .tj-panel-white .tj-section-copy h2{
  max-width:26ch;
  font-family:'Noto Sans JP',sans-serif;
  font-size:clamp(1.75rem,2.55vw,2.9rem);
  line-height:1.42;
  font-weight:500;
  letter-spacing:.015em;
  color:var(--tj-blue);
}
.tj-refresh .tj-panel p,
.tj-refresh .tj-section-copy p:last-child{
  max-width:56ch;
  font-size:clamp(.94rem,1.05vw,1.04rem);
  line-height:1.95;
  font-weight:300;
  color:var(--tj-copy);
}
.tj-refresh .tj-panel-hero{
  min-height:calc(100vh - var(--nav));
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(3rem,6vw,5.5rem);
  align-items:center;
  background:
    linear-gradient(90deg,rgba(167,125,71,.08),transparent 40%),
    linear-gradient(135deg,#fff 0%,#fbfaf6 46%,#edf2f8 100%);
  color:var(--tj-blue);
  padding-top:clamp(4.8rem,7vw,7rem);
}
.tj-refresh .tj-panel-hero::after{
  color:rgba(31,36,72,.045);
  right:-2vw;
  bottom:-5vw;
}
.tj-refresh .tj-panel-hero .tj-eyebrow,
.tj-refresh .tj-panel-navy .tj-eyebrow,
.tj-refresh .tj-final-summary .tj-eyebrow{
  color:var(--tj-gold);
}
.tj-refresh .tj-logo-mark{
  width:clamp(74px,7vw,104px);
  height:clamp(74px,7vw,104px);
  filter:none;
  opacity:1;
  margin-bottom:2rem;
}
.tj-refresh .tj-hero-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(5rem,10.5vw,10.5rem);
  line-height:.82;
  letter-spacing:.005em;
  color:var(--tj-blue);
  margin:0 0 1.55rem;
}
.tj-refresh .tj-hero-lead{
  max-width:24ch;
  font-size:clamp(1.28rem,2.05vw,2rem) !important;
  line-height:1.55 !important;
  font-weight:400;
  color:var(--tj-blue-2) !important;
}
.tj-refresh .tj-hero-body{
  max-width:47ch;
  color:var(--tj-copy) !important;
}
.tj-refresh .tj-primary-cta,
.tj-refresh .tj-sticky-live{
  background:var(--tj-gold);
  color:var(--tj-charcoal);
  border-color:rgba(200,165,108,.5);
  box-shadow:0 18px 44px rgba(0,0,0,.18);
}
.tj-refresh .tj-primary-cta:hover,
.tj-refresh .tj-sticky-live:hover{
  background:var(--tj-gold-2);
}
.tj-refresh .tj-primary-cta span:last-child,
.tj-refresh .tj-sticky-live span:last-child{
  color:var(--tj-charcoal);
}
.tj-refresh .tj-mini-note{
  color:var(--tj-copy);
}
.tj-refresh .tj-browser-frame,
.tj-refresh .tj-live-browser{
  border-radius:8px;
  border:1px solid rgba(31,36,72,.12);
  background:#fff;
  box-shadow:0 34px 90px -44px rgba(31,36,72,.34);
  overflow:hidden;
}
.tj-refresh .tj-browser-frame{
  transform:rotate(-.65deg);
  max-height:min(70vh,720px);
  overflow-y:auto;
  scrollbar-width:thin;
}
.tj-refresh .tj-browser-frame img{
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:top;
}
.tj-refresh .tj-panel-white:not(.tj-panel-process){
  display:block;
  background:var(--tj-paper-warm);
}
.tj-refresh .tj-section-copy{
  max-width:min(100%,900px);
  margin:0 0 clamp(2.6rem,5vw,4.5rem);
}
.tj-refresh .tj-panel-white .tj-eyebrow,
.tj-refresh .tj-browser-lab .tj-eyebrow{
  color:var(--tj-gold);
}
.tj-refresh .tj-capability-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:var(--tj-rule);
  border:1px solid var(--tj-rule);
}
.tj-refresh .tj-capability-grid article{
  display:block;
  min-height:245px;
  padding:2rem 1.65rem 2.25rem;
  border:0;
  background:var(--tj-paper-warm);
  box-shadow:none;
}
.tj-refresh .tj-capability-grid article::after{
  display:none;
}
.tj-refresh .tj-capability-grid article:hover{
  background:var(--tj-paper-soft);
}
.tj-refresh .tj-capability-grid article > span{
  display:block;
  margin-bottom:1.4rem;
  font-family:'DM Mono',monospace;
  font-size:.72rem;
  letter-spacing:.12em;
  color:var(--tj-gold);
}
.tj-refresh .tj-capability-grid h3{
  margin:0 0 .75rem;
  font-size:1.22rem;
  line-height:1.45;
  color:var(--tj-blue);
}
.tj-refresh .tj-capability-grid p{
  max-width:26ch;
  font-size:.88rem;
  line-height:1.82;
  color:var(--tj-copy);
}
.tj-refresh .tj-panel-ownership{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:clamp(3rem,6vw,5.5rem);
  align-items:start;
  background:#fff;
}
.tj-refresh .tj-ownership-list{
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--tj-rule);
  border-top:1px solid var(--tj-rule);
  border-bottom:1px solid var(--tj-rule);
}
.tj-refresh .tj-ownership-list article,
.tj-refresh .tj-ownership-list article:nth-child(2),
.tj-refresh .tj-ownership-list article:nth-child(3){
  min-height:auto;
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  column-gap:1.5rem;
  row-gap:.65rem;
  padding:2rem 0;
  border:0;
  background:#fff;
  box-shadow:none;
}
.tj-refresh .tj-ownership-list article > span{
  grid-column:1;
  grid-row:1 / span 2;
  padding-top:.28rem;
  color:var(--tj-gold);
}
.tj-refresh .tj-ownership-list h3{
  grid-column:2;
  grid-row:1;
  max-width:28ch;
  font-size:1.22rem;
  line-height:1.45;
  color:var(--tj-blue);
}
.tj-refresh .tj-ownership-list p{
  grid-column:2;
  grid-row:2;
  margin:.65rem 0 0;
  max-width:58ch;
  color:var(--tj-copy);
}
.tj-refresh .tj-panel-navy{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(3rem,6vw,5.5rem);
  align-items:center;
  background:
    linear-gradient(135deg,#fff 0%,#fbfaf6 45%,#edf2f8 100%);
  color:var(--tj-blue);
}
.tj-refresh .tj-panel-navy .tj-section-copy h2,
.tj-refresh .tj-final-summary .tj-final-copy h2{
  color:var(--tj-blue);
}
.tj-refresh .tj-panel-navy .tj-section-copy p,
.tj-refresh .tj-final-summary .tj-final-copy p{
  color:var(--tj-copy);
}
.tj-refresh .tj-brand-main,
.tj-refresh .tj-brand-children div{
  border-radius:8px;
  border:1px solid var(--tj-rule);
  background:rgba(255,255,255,.72);
  box-shadow:0 22px 70px -48px rgba(31,36,72,.34);
}
.tj-refresh .tj-brand-main img{
  width:128px;
  height:128px;
  filter:none;
  background:transparent;
  padding:0;
  border-radius:0;
}
.tj-refresh .tj-brand-children img{
  filter:none;
}
.tj-refresh .tj-brand-children span{
  color:var(--tj-gold);
}
.tj-refresh .tj-brand-main strong,
.tj-refresh .tj-brand-children strong{
  color:var(--tj-blue);
}
.tj-refresh .tj-panel-map{
  display:block;
  background:var(--tj-paper-soft);
}
.tj-refresh .tj-paths{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  margin-top:clamp(2.4rem,4vw,4rem);
}
.tj-refresh .tj-paths article{
  min-height:clamp(360px,42vw,520px);
  border-radius:8px;
}
.tj-refresh .tj-browser-lab{
  background:#fff;
  position:relative;
  z-index:460;
}
.tj-refresh .tj-browser-lab .tj-showcase-head{
  max-width:1180px;
  margin:0 auto 3rem;
}
.tj-refresh .tj-live-preview{
  max-width:1180px;
  margin:0 auto;
  grid-template-columns:minmax(0,1fr) clamp(220px,22vw,280px);
  align-items:start;
  position:relative;
  z-index:460;
  border-color:var(--tj-rule);
  background:
    linear-gradient(135deg,#fff 0%,var(--tj-paper-warm) 100%);
}
.tj-refresh .tj-live-browser{
  border-color:rgba(31,29,26,.12);
  box-shadow:0 30px 80px rgba(31,29,26,.14);
}
.tj-refresh .tj-live-scroll{
  height:min(72vh,720px);
  overflow-y:auto;
  overflow-x:hidden;
}
.tj-refresh .tj-live-scroll img,
.tj-refresh .tj-phone-scroll img{
  width:100%;
  height:auto;
  object-fit:contain;
}
.tj-refresh .tj-live-site{
  width:100%;
  height:1450px;
  display:block;
  border:0;
  background:#fff url('tj/tj-home-full.png') top center / 100% auto no-repeat;
}
.tj-refresh .tj-live-phone{
  width:clamp(280px,27vw,340px);
  height:min(68vh,650px);
  align-self:start;
  transform:translateY(2rem);
}
.tj-refresh .tj-live-phone .tj-live-site{
  height:1250px;
  background-image:url('tj/tj-home-mobile.png');
}
.tj-refresh .tj-panel-process{
  background:var(--tj-paper-warm);
}
.tj-refresh .tj-process-large{
  gap:1px;
  background:var(--tj-rule);
  border:1px solid var(--tj-rule);
}
.tj-refresh .tj-process-large div{
  min-height:260px;
  border:0;
  background:var(--tj-paper-warm);
}
.tj-refresh .tj-final-summary{
  background:
    linear-gradient(135deg,#fff 0%,#fbfaf6 45%,#edf2f8 100%);
}
.tj-refresh .tj-final-summary .tj-final-stats div{
  border-color:var(--tj-rule);
  background:rgba(255,255,255,.76);
  box-shadow:0 22px 70px -52px rgba(31,36,72,.35);
}
.tj-refresh .tj-final-summary .tj-final-stats strong{
  color:var(--tj-gold);
}
.tj-refresh .tj-final-summary .tj-final-stats span{
  color:var(--tj-blue);
}
.tj-refresh .tj-final-summary .tj-final-stats p{
  color:var(--tj-copy);
}
@media(max-width:1100px){
  .tj-refresh .tj-panel-hero,
  .tj-refresh .tj-panel-ownership,
  .tj-refresh .tj-panel-navy{
    grid-template-columns:1fr;
  }
  .tj-refresh .tj-capability-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .tj-refresh .tj-live-preview{
    grid-template-columns:1fr;
  }
  .tj-refresh .tj-live-phone{
    transform:none;
  }
}
@media(max-width:920px){
  .tj-refresh .tj-panel{
    padding:3.8rem 1.25rem;
  }
  .tj-refresh .tj-panel-hero{
    padding-top:3.6rem;
  }
  .tj-refresh .tj-logo-mark{
    width:68px;
    height:68px;
  }
  .tj-refresh .tj-hero-title{
    font-size:clamp(4.2rem,21vw,6.2rem);
  }
  .tj-refresh .tj-browser-frame{
    transform:none;
    max-height:430px;
  }
  .tj-refresh .tj-capability-grid,
  .tj-refresh .tj-paths{
    grid-template-columns:1fr;
  }
  .tj-refresh .tj-capability-grid article{
    min-height:auto;
  }
  .tj-refresh .tj-ownership-list article{
    grid-template-columns:1fr;
    gap:.85rem;
    padding:1.55rem 0;
  }
  .tj-refresh .tj-brand-children{
    grid-template-columns:1fr;
  }
  .tj-refresh .tj-live-scroll{
    height:430px;
  }
  .tj-refresh .tj-live-phone{
    width:min(230px,82vw);
    height:460px;
  }
  .tj-refresh .tj-preview-note{
    position:static;
    margin-top:1rem;
  }
}