/* Layout: 12-col editorial grid on paper, full-bleed ink/green/lime bands, one LINE-green thread running down the homepage */
:root{
  --ink:#262320; --ink-2:#34302C; --paper:#F2EFEA; --paper-2:#E6E1D9;
  --stone:#D6D0C6; --stone-2:#BDB5A9; --clay:#8C8478;
  --line:#06C755; --line-deep:#03873A; --electric:#D9FF4A; --muted:#A39C91; --muted-ink:#6E675D;
  --rule:rgba(38,35,32,.14); --rule-dark:rgba(242,239,234,.16);
  --f-display:"LINE Seed Sans","LINE Seed JP","Helvetica Neue",Arial,sans-serif;
  --f-body:"LINE Seed Sans","LINE Seed JP","Helvetica Neue",Arial,sans-serif;
  --f-mono:"LINE Seed Sans","LINE Seed JP","Helvetica Neue",Arial,sans-serif;
  --gutter:max(clamp(16px,4vw,56px), env(safe-area-inset-left,0px));
  --gutter-r:max(clamp(16px,4vw,56px), env(safe-area-inset-right,0px));
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--paper)}
a{color:inherit}
:focus-visible{outline:2px solid var(--line);outline-offset:3px}
.wrap{max-width:1400px;margin:0 auto;padding-left:max(16px,var(--gutter));padding-right:max(16px,var(--gutter-r))}
.mono{font-family:var(--f-mono);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.display{font-family:var(--f-display);font-weight:400;letter-spacing:-.03em;line-height:1.08;text-wrap:balance;margin:0}
.display em{font-style:normal;color:var(--line-deep)}
.final .display em{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-decoration-thickness:.08em;text-underline-offset:.12em}
h1,h2,h3{margin:0}
p{margin:0}

/* ---------- header ---------- */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--f-display);font-weight:800;letter-spacing:.01em;font-size:1.02rem}
.brand img{display:block;height:44px;width:auto;transition:transform .3s}
.brand:hover img{transform:translateY(-2px)}
.brand-mark{width:30px;height:30px;border-radius:8px;background:var(--line);display:grid;place-items:center;color:var(--ink);font-weight:800;font-size:1rem;transition:transform .3s}
.brand:hover .brand-mark{transform:rotate(-12deg)}
.nav{display:flex;gap:4px}
.nav a{text-decoration:none;font-size:.92rem;padding:8px 14px;border-radius:999px;position:relative;transition:background .2s}
.nav a:hover{background:var(--paper-2)}
.nav a[aria-current="page"]{background:var(--ink);color:var(--paper)}
.site-head .btn[aria-current="page"]{background:var(--line);color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;border:0;cursor:pointer;font:600 .95rem/1 var(--f-body);padding:13px 20px;border-radius:999px;transition:transform .2s,background .2s,color .2s}
.btn .arr{display:inline-block;transition:transform .25s}
.btn:hover .arr{transform:translate(3px,-3px)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{background:var(--line);color:var(--ink)}
.btn-line{background:var(--line);color:var(--ink)}
.btn-line:hover{background:var(--paper)}
.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 1px currentColor}
.menu-btn{display:none;background:none;border:1px solid var(--rule);border-radius:999px;padding:9px 14px;font:600 .85rem var(--f-body);cursor:pointer;color:var(--ink)}
.site-head .mobile-nav{display:none}
@media (max-width:760px){
  .nav,.site-head .btn{display:none}
  .menu-btn{display:inline-block}
  .site-head .mobile-nav.open{display:flex;flex-direction:column;align-items:stretch;height:auto;gap:2px;padding-block:8px 16px;border-top:1px solid var(--rule);background:var(--paper)}
  .mobile-nav a{text-decoration:none;font-family:var(--f-display);font-weight:800;font-size:2rem;text-transform:uppercase;padding:6px 0}
}

/* ---------- views ---------- */
.view[hidden]{display:none!important}

/* ---------- hero ---------- */
.hero{background:radial-gradient(120% 90% at 85% 10%,var(--ink-2),var(--ink) 60%);color:var(--paper);position:relative;overflow:hidden;min-height:min(88vh,860px);display:flex}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.9}
.hero .wrap{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:space-between;gap:48px;padding-block:28px 32px;width:100%}
.hero-top,.hero-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hero-logo{display:block;height:52px;width:auto}
.hero-top{align-items:center}
.hero-top .mono:last-child{color:var(--muted)}
.hero h1{font-size:clamp(2.8rem,7.4vw,8rem)}
.hero h1 span{display:block;animation:beat .7s cubic-bezier(.2,.8,.2,1) both}
.hero h1 span:nth-child(2){animation-delay:.12s}
.hero h1 .big{animation-delay:.24s;background:var(--line);color:var(--ink);padding:.04em .08em 0;margin-top:.06em;transform-origin:left;animation-name:expand}
@keyframes beat{from{transform:translateY(.35em)}to{transform:none}}
@keyframes expand{from{clip-path:inset(0 70% 0 0)}to{clip-path:inset(0 0 0 0)}}
.hero-bot{align-items:flex-end}
.hero-main{display:grid;grid-template-columns:repeat(12,1fr);gap:28px;align-items:end}
.hero-main h1{grid-column:1/8;min-width:0}
.leader{grid-column:8/-1;position:relative;margin:0;border-radius:22px;overflow:hidden;aspect-ratio:4/5;max-width:100%;background:var(--ink-2);box-shadow:0 0 0 1px var(--rule-dark)}
.leader img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;filter:saturate(.9) contrast(1.03) sepia(.12);transform:scale(1.04);animation:settle 1.4s cubic-bezier(.2,.8,.2,1) both}
@keyframes settle{to{transform:none}}
.leader::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(38,35,32,0) 38%,rgba(38,35,32,.92) 100%);pointer-events:none}
.leader .badge{position:absolute;top:14px;left:14px;z-index:2;background:var(--line);color:var(--ink);border-radius:999px;padding:7px 12px}
.leader figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px;display:flex;flex-direction:column;gap:12px}
.leader blockquote{margin:0;font-family:var(--f-display);font-weight:800;font-size:clamp(1.25rem,2vw,1.7rem);line-height:1.1;letter-spacing:-.02em;text-wrap:balance}
.leader blockquote::before{content:"“";display:block;color:var(--line);font-size:3rem;line-height:.6;margin-bottom:6px}
.leader .who{font-size:.85rem;color:#D3CCC1;display:flex;flex-direction:column;gap:2px}
.leader .who b{color:var(--paper)}
.ph-name{border-bottom:1px dashed var(--stone-2)}
@media (max-width:900px){.hero-main h1,.leader{grid-column:1/-1}.leader{aspect-ratio:4/4.4;max-width:520px}}
.hero-lede{max-width:34ch;font-size:clamp(1.05rem,1.6vw,1.3rem);color:#E0DBD3;display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.scroll-cue{color:var(--muted)}
.frag{position:absolute;z-index:1;font-family:var(--f-mono);font-size:.7rem;color:var(--paper);background:rgba(242,239,234,.06);border:1px solid var(--rule-dark);border-radius:14px 14px 14px 4px;padding:8px 12px;white-space:nowrap;animation:drift 9s ease-in-out infinite alternate}
.frag b{color:var(--line);font-weight:500}
@keyframes drift{to{transform:translate(14px,-18px)}}
@media (max-width:760px){.frag{display:none}}

/* ---------- home thread ---------- */
.home{position:relative}
.thread{position:absolute;left:max(8px,calc(var(--gutter) / 2 - 1px));top:0;bottom:0;width:2px;pointer-events:none;z-index:5}
.thread i{position:absolute;inset:0;background:var(--line);transform-origin:top;transform:scaleY(var(--p,.04))}
@media (max-width:900px){.thread{display:none}}

/* ---------- section scaffolding ---------- */
.band{padding-block:clamp(72px,10vw,140px)}
.eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:22px;color:var(--muted-ink)}
.eyebrow::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--line);flex:none}
.dark .eyebrow{color:var(--line)}
.h2{font-size:clamp(1.9rem,4vw,3.6rem)}
.sub{font-size:1.1rem;color:var(--muted-ink);max-width:52ch;margin-top:20px}
.dark{background:var(--ink);color:var(--paper)}
.dark .sub{color:#C2BBAF}

/* manifesto */
.manifesto-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:32px 24px}
.manifesto h2{grid-column:1/-1;font-size:clamp(2rem,4.6vw,4.2rem)}
.manifesto h2 .w{color:var(--muted);transition:color .5s}
.manifesto h2 .w.on{color:var(--ink)}
.manifesto-body{grid-column:7/-1;display:flex;flex-direction:column;gap:14px;font-size:clamp(1.05rem,1.4vw,1.25rem);max-width:46ch}
.manifesto-body strong{font-weight:700}
@media (max-width:900px){.manifesto-body{grid-column:1/-1}}

/* advantage bento */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:48px}
.cell{border-radius:22px;padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;gap:14px;min-height:300px;position:relative;overflow:hidden;min-width:0}
.cell h3{font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:clamp(1.4rem,2.1vw,2rem);line-height:.95;letter-spacing:-.01em;text-wrap:balance;max-width:16ch}
.cell p{max-width:40ch}
.cell .reveal{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px;transform:translateY(8px);opacity:.55;transition:transform .35s,opacity .35s}
.cell:hover .reveal,.cell:focus-within .reveal{transform:none;opacity:1}
.c-dist{grid-column:span 7;background:var(--line);color:var(--ink)}
.c-tech{grid-column:span 5;background:var(--ink);color:var(--paper)}
.c-exp{grid-column:span 5;background:var(--paper-2)}
.c-conn{grid-column:span 7;background:var(--stone);color:var(--ink)}
.chip{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.04em;padding:7px 11px;border-radius:999px;background:rgba(38,35,32,.1);text-transform:uppercase}
.c-tech .chip{background:rgba(242,239,234,.1)}
.flow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.flow .node{font-family:var(--f-mono);font-size:.7rem;border:1px solid var(--rule-dark);border-radius:8px;padding:7px 10px}
.flow .node.hot{border-color:var(--line);color:var(--line)}
.flow .wire{width:22px;height:2px;background:var(--line);position:relative;overflow:hidden}
.flow .wire::after{content:"";position:absolute;inset:0;background:var(--electric);transform:translateX(-100%);animation:pulse 1.6s linear infinite}
@keyframes pulse{to{transform:translateX(100%)}}
.cell .corner{position:absolute;top:22px;right:24px;font-size:1.3rem;transition:transform .3s}
.cell:hover .corner{transform:translate(4px,-4px)}
.fine{font-size:.82rem;color:var(--muted-ink);margin-top:18px}
@media (max-width:900px){.c-dist,.c-tech,.c-exp,.c-conn{grid-column:1/-1;min-height:240px}}

/* icons + graphics */
.ic{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-.18em}
.ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex:none;position:relative;z-index:1}
.ico .ic{width:24px;height:24px}
.ticker{background:var(--stone);color:var(--ink);overflow:hidden;border-block:1px solid var(--ink)}
.ticker-track{display:flex;width:max-content;animation:tick 38s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-set{display:flex;align-items:center;gap:34px;padding:16px 17px;font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:clamp(1rem,1.6vw,1.35rem);letter-spacing:-.01em;white-space:nowrap}
.ticker-set span{display:inline-flex;align-items:center;gap:10px}
.ticker-set .ic{width:1.3em;height:1.3em;stroke-width:2}
.ticker-set i{width:10px;height:10px;border-radius:50%;background:var(--line);display:inline-block}
@keyframes tick{to{transform:translateX(-50%)}}
.cell > *{position:relative;z-index:1}
.cell .art{position:absolute;z-index:0;right:-20px;bottom:-20px;width:min(240px,55%);height:auto;pointer-events:none;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.cell:hover .art{transform:rotate(-8deg) scale(1.05)}
.c-dist .ico{background:var(--ink);color:var(--line)}
.c-tech .ico{background:var(--line);color:var(--ink)}
.c-exp .ico{background:var(--paper-2);color:var(--ink)}
.c-conn .ico{background:var(--ink);color:var(--line)}
.cell .head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.netmap{grid-column:1/7;min-width:0;align-self:start}
.netmap svg{width:100%;height:auto;display:block;overflow:visible}
.netmap .lnk{stroke:var(--line);stroke-width:2;fill:none;stroke-dasharray:6 6;animation:flow 1.4s linear infinite}
@keyframes flow{to{stroke-dashoffset:-24}}
.netmap .nd rect{fill:var(--paper);stroke:var(--ink);stroke-width:1.5}
.netmap .nd.hub rect{fill:var(--ink)}
.netmap .nd text{font-family:var(--f-display);font-weight:800;font-size:15px;fill:var(--ink);letter-spacing:.04em}
.netmap .nd.hub text{fill:var(--line)}
.netmap .dot{fill:var(--line)}
@media (max-width:900px){.netmap{grid-column:1/-1;max-width:560px}}
.aud-tab .lab{display:inline-flex;align-items:center;gap:12px}
.aud-tab .lab .ic{width:22px;height:22px}
.step .ico{width:40px;height:40px;border-radius:12px;background:var(--ink);color:var(--line)}
.step .ico .ic{width:20px;height:20px}
.geo{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin-top:8px}
.geo div{aspect-ratio:1;max-width:100%;background:var(--ink);position:relative;overflow:hidden;transition:transform .4s}
.geo div:hover{transform:rotate(90deg)}
.geo .g1{border-radius:50%}
.geo .g2{border-radius:0 100% 0 0}
.geo .g3{clip-path:polygon(0 100%,100% 100%,50% 0)}
.geo .g4{background:transparent;border:clamp(6px,1.2vw,14px) solid var(--ink);border-radius:50%}
.geo .g5{border-radius:100% 0 0 0;background:var(--line)}
.geo .g2,.geo .g7{background:var(--clay)}
.geo .g6{background:repeating-linear-gradient(90deg,var(--ink) 0 3px,transparent 3px 9px)}
.geo .g7{clip-path:polygon(0 0,100% 0,0 100%)}
.geo .g8{border-radius:999px 999px 0 0}
@media (max-width:640px){.geo{grid-template-columns:repeat(4,1fr)}.geo div:nth-child(n+5){display:none}}
.next-list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}
.next-list li{display:flex;gap:14px;align-items:flex-start}
.next-list .ico{width:40px;height:40px;border-radius:12px;background:var(--line);color:var(--ink)}
.next-list .ico .ic{width:20px;height:20px}
.next-list b{display:block}
.next-list span{color:var(--muted-ink);font-size:.95rem}
.story .txt .facts{display:flex;flex-wrap:wrap;gap:8px}
.story .txt .facts span{display:inline-flex;align-items:center;gap:7px;font-size:.85rem;border:1px solid var(--rule);border-radius:999px;padding:6px 12px}
.story .txt .facts .ic{color:var(--line-deep)}
.j-card .mono{display:inline-flex;align-items:center;gap:7px}

/* for startups */
.subnav{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.subnav a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:700;border:1px solid var(--rule);border-radius:999px;padding:10px 16px;background:var(--paper)}
.subnav a:hover{background:var(--ink);color:var(--paper)}
.subnav .ic{color:var(--line-deep)}
.subnav a:hover .ic{color:var(--line)}
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px}
.benefit{background:var(--paper-2);border-radius:22px;padding:28px;display:flex;flex-direction:column;gap:12px;min-width:0;transition:background .3s,color .3s}
.benefit .ico{background:var(--ink);color:var(--line)}
.benefit .mono{color:var(--muted-ink)}
.benefit h3{font-family:var(--f-display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:1;font-size:clamp(1.25rem,1.8vw,1.6rem);text-wrap:balance}
.benefit p{color:var(--muted-ink)}
.benefit .chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:8px}
.benefit:hover{background:var(--ink);color:var(--paper)}
.benefit:hover p,.benefit:hover .mono{color:var(--stone)}
.benefit:hover .ico{background:var(--line);color:var(--ink)}
.benefit:hover .chip{background:rgba(242,239,234,.1)}
@media (max-width:900px){.benefits{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.benefits{grid-template-columns:1fr}}
.cta-strip{margin-top:56px;background:var(--stone);border-radius:22px;padding:clamp(22px,3vw,36px);display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between}
.cta-strip h3{font-family:var(--f-display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;font-size:clamp(1.3rem,2.4vw,2rem);line-height:1}
.cta-strip p{color:var(--muted-ink);margin-top:6px}
.section-link{margin-top:24px}

/* photo hero (home) */
.hp{position:relative;z-index:6;display:block;min-height:min(94vh,920px);background:var(--ink);color:#F2EFEA;overflow:hidden;margin-top:-65px}
.hp-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:48% 35%;max-width:none;transform:scale(1.06);animation:hpzoom 2.4s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes hpzoom{to{transform:scale(1)}}
.hp-shade{position:absolute;inset:0;background:radial-gradient(60% 42% at 50% 74%,rgba(28,25,22,.55),rgba(28,25,22,0) 100%),linear-gradient(180deg,rgba(28,25,22,.55) 0%,rgba(28,25,22,.22) 32%,rgba(28,25,22,.4) 60%,rgba(28,25,22,.82) 100%)}
.hp-center{position:absolute;left:0;right:0;top:71%;transform:translateY(-50%);text-align:center;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;align-items:center;gap:22px}
.hp .hp-title{font-family:var(--f-display);font-weight:400;text-transform:uppercase;letter-spacing:.24em;line-height:1.28;font-size:clamp(1.35rem,3.3vw,3.2rem);margin:0;text-shadow:0 2px 24px rgba(0,0,0,.55),0 0 2px rgba(0,0,0,.4)}
.hp .hp-title span{display:block;padding-left:.24em;animation:hpin 1.2s cubic-bezier(.2,.8,.2,1) both}
.hp .hp-title span:nth-child(2){animation-delay:.18s}
@keyframes hpin{from{letter-spacing:.42em;opacity:.0001}to{letter-spacing:.24em;opacity:1}}
.hp-who{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:#CFC8BD;margin-top:-10px}
.hp-sub{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:#F2EFEA;text-shadow:0 1px 12px rgba(0,0,0,.6);max-width:46ch;line-height:1.9}
.hp-seal{position:absolute;left:max(clamp(16px,6vw,96px),env(safe-area-inset-left,0px));bottom:clamp(24px,5vw,56px);width:clamp(96px,10vw,140px);color:#E9E3D9}
.hp-seal svg{width:100%;height:auto;display:block;overflow:visible}
.hp-seal text{font-family:var(--f-body);font-weight:400;font-size:13.5px;letter-spacing:.18em;fill:currentColor}
.hp-seal .spin{transform-origin:100px 100px;animation:spin 26s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.hp-arrow{position:absolute;right:max(clamp(16px,7vw,110px),env(safe-area-inset-right,0px));bottom:clamp(24px,5vw,56px);width:30px;color:#F2EFEA;display:block}
.hp-arrow svg{width:30px;height:clamp(90px,11vw,150px);display:block}
.hp-arrow:hover svg{animation:nudge 1s ease-in-out infinite}
@keyframes nudge{50%{transform:translateY(8px)}}
@media (max-width:640px){.hp-bg:first-child{object-position:50% 35%!important}.hp{min-height:640px}.hp-center{top:69%}.hp-seal{width:84px}.hp-arrow svg{height:80px}.hp-bg{object-position:48% 30%}.hp .hp-title{letter-spacing:.16em}.hp .hp-title span{padding-left:.16em}.hp-sub{letter-spacing:.18em}}

.hp-slides{position:absolute;inset:0}
.hp .hp-bg{opacity:0;transform:scale(1.08);animation:none;transition:opacity 1.6s ease,transform 0s 1.6s}
.hp .hp-bg.on{opacity:1;transform:scale(1);transition:opacity 1.6s ease,transform 8s linear}
.hp-dots{position:absolute;z-index:3;left:max(clamp(16px,6vw,96px),env(safe-area-inset-left,0px));bottom:clamp(28px,5vw,60px);display:flex;align-items:center;gap:10px}
.hp-count{font-size:.72rem;letter-spacing:.2em;color:#CFC8BD;margin-right:8px;font-variant-numeric:tabular-nums}
.hp-count b{color:#F2EFEA;font-weight:700}
.hp-dot{appearance:none;border:0;background:none;padding:10px 0;cursor:pointer;width:clamp(28px,4vw,52px)}
.hp-dot i{display:block;height:2px;background:rgba(242,239,234,.35);position:relative;overflow:hidden}
.hp-dot i::after{content:"";position:absolute;inset:0;background:#F2EFEA;transform:scaleX(0);transform-origin:left}
.hp-dot.on i::after{animation:fillbar var(--dur,6.5s) linear forwards}
.hp-dot.done i::after{transform:scaleX(1)}
@keyframes fillbar{to{transform:scaleX(1)}}
.hp-dot:focus-visible{outline:2px solid var(--line);outline-offset:2px}

/* header over the photo hero */
body.over .site-head{background:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
body.over::before{background:var(--ink)}
body.over .nav a{color:#F2EFEA}
body.over .nav a:hover{background:rgba(242,239,234,.12)}
body.over .nav a[aria-current="page"]{background:transparent;box-shadow:inset 0 -1px 0 #F2EFEA;border-radius:0}
body.over .site-head .btn{background:transparent;color:#F2EFEA;box-shadow:inset 0 0 0 1px rgba(242,239,234,.6)}
body.over .site-head .btn:hover{background:#F2EFEA;color:var(--ink)}
body.over .menu-btn{color:#F2EFEA;border-color:rgba(242,239,234,.5)}
.brand .logo-light{display:none}
body.over .brand .logo-light{display:block}
body.over .brand .logo-dark{display:none}
.site-head{transition:background .35s,border-color .35s}
.nav a{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase}

/* leadership section */
.leader-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,4vw,64px);align-items:center}
.leader-band .leader{grid-column:1/6;aspect-ratio:4/5}
.leader-band .leader::after{display:none}
.leader-copy{grid-column:6/-1;display:flex;flex-direction:column;gap:20px;min-width:0}
.leader-quote{margin:0;font-family:var(--f-display);font-weight:800;text-transform:uppercase;letter-spacing:-.03em;line-height:.98;font-size:clamp(2rem,4.6vw,4.2rem);text-wrap:balance}
.leader-quote::before{content:"“";display:block;color:var(--line);font-size:1.4em;line-height:.6;margin-bottom:.1em}
.leader-copy .who{display:flex;flex-direction:column;gap:2px;color:var(--muted-ink)}
.leader-copy .who b{color:var(--ink)}
@media (max-width:900px){.leader-band .leader,.leader-copy{grid-column:1/-1}.leader-band .leader{max-width:460px;aspect-ratio:4/4.6}}

/* about: approach */
.strike{text-decoration:line-through;text-decoration-thickness:2px;color:var(--muted);font-size:1.5rem;font-weight:700}
.approach-lead{font-family:var(--f-display);font-weight:800;font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.15;color:var(--ink);text-wrap:balance}

/* about: LINE ecosystem */
.eco-wrap{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:28px;align-items:start;margin-top:8px}
.lchat{background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 0 0 8px var(--ink),0 30px 60px -30px rgba(38,35,32,.5);margin:8px;color:#111;font-family:var(--f-body)}
.lc-head{display:flex;align-items:center;gap:8px;padding:14px;border-bottom:1px solid #eee;font-size:.92rem}
.lc-back{font-size:1.4rem;line-height:1;color:#555}
.lc-av{width:28px;height:28px;border-radius:50%;background:var(--ink);color:#06C755;display:grid;place-items:center;font-weight:800;font-size:.85rem}
.lc-badge svg{width:16px;height:16px;display:block}
.lc-body{background:#8CABD9;background:linear-gradient(180deg,#9BB5DD,#8AA6D3);padding:14px 12px;display:flex;flex-direction:column;gap:10px;min-height:190px}
.lc-day{align-self:center;font-size:.68rem;color:#fff;background:rgba(0,0,0,.18);border-radius:999px;padding:3px 10px}
.lc-row{display:flex;align-items:flex-end;gap:6px}
.lc-row.out{justify-content:flex-end}
.lc-mini{width:24px;height:24px;border-radius:50%;background:var(--ink);color:#06C755;display:grid;place-items:center;font-size:.7rem;font-weight:800;flex:none;align-self:flex-start}
.lc-b{font-size:.8rem;line-height:1.35;padding:8px 11px;border-radius:16px;max-width:78%;background:#fff}
.lc-row.out .lc-b{background:#85E249}
.lc-read{font-size:.58rem;color:#fff;text-align:right;line-height:1.2}
.lc-rich{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#e7e7e7}
.rm{background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:14px 4px;font-size:.66rem;font-weight:700;text-align:center;color:#111}
.rm .ic{width:20px;height:20px;color:#06C755}
.eco-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;min-width:0}
.eco-tile{background:#fff;border:1px solid var(--rule);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:6px;min-width:0;transition:transform .25s,border-color .25s}
.eco-tile:hover{transform:translateY(-3px);border-color:#06C755}
.eco-ic{width:40px;height:40px;border-radius:12px;background:#06C755;color:#fff;display:grid;place-items:center;margin-bottom:4px}
.eco-ic .ic{width:20px;height:20px}
.eco-tile b{font-size:.98rem}
.eco-tile span:last-child{font-size:.86rem;color:var(--muted-ink)}
@media (max-width:760px){.eco-wrap{grid-template-columns:1fr}.lchat{max-width:320px}}
@media (max-width:420px){.eco-grid{grid-template-columns:1fr}}

/* for startups: what we look for */
.look{display:grid;grid-template-columns:1.25fr auto 1fr;gap:14px;align-items:stretch;margin-top:40px}
.look-or{align-self:center}
.look-card{background:var(--ink);color:var(--paper);border-radius:22px;padding:clamp(22px,3vw,36px);display:flex;flex-direction:column;gap:12px;min-width:0;height:100%}
.look-card .ico{background:var(--line);color:var(--ink)}
.look-card h3{font-family:var(--f-display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1}
.look-card p{color:var(--stone);max-width:44ch}
.look-or{font-family:var(--f-display);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:var(--muted-ink);background:var(--paper-2);border-radius:999px;padding:10px 14px}
@media (max-width:760px){.look{grid-template-columns:1fr}.look-or{justify-self:center}}
.builders{margin-top:28px;background:var(--paper-2);border-radius:22px;padding:clamp(22px,3vw,36px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:24px;align-items:center}
.b-intro{font-size:1.1rem;color:var(--muted-ink);max-width:40ch}
.builders ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.builders li{display:flex;align-items:center;gap:14px}
.builders li .ico{width:40px;height:40px;border-radius:12px;background:var(--ink);color:var(--line)}
.builders li .ico .ic{width:20px;height:20px}
.builders li p{font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--muted-ink)}
.builders li b{color:var(--ink)}
@media (max-width:760px){.builders{grid-template-columns:1fr}}

.pull{margin-top:10px;padding-top:18px;border-top:1px solid var(--rule-dark)}
.pull-cap{color:var(--line);margin-bottom:12px}
.pull ul{list-style:none;margin:0;padding:0 0 0 22px;position:relative;display:flex;flex-direction:column;gap:12px}
.pull ul::before{content:"";position:absolute;left:4px;top:6px;bottom:18px;width:2px;background:repeating-linear-gradient(180deg,var(--line) 0 6px,transparent 6px 12px);background-size:2px 12px;animation:wire 1s linear infinite}
@keyframes wire{to{background-position:0 12px}}
.pull li{display:flex;align-items:center;gap:12px;position:relative}
.pull li::before{content:"";position:absolute;left:-20px;top:50%;width:14px;height:2px;background:var(--line)}
.pi{width:36px;height:36px;border-radius:10px;background:rgba(242,239,234,.08);color:var(--line);display:grid;place-items:center;flex:none;transition:background .25s,color .25s}
.pi .ic{width:18px;height:18px}
.pull li:hover .pi{background:var(--line);color:var(--ink)}
.pull li p{color:var(--stone);font-size:1rem}
.pull li b{color:var(--paper)}
@media (prefers-reduced-motion:reduce){.pull ul::before{animation:none}}
.j-card .excerpt{color:var(--muted-ink);font-size:.95rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.j-card .out{font-weight:700;font-size:.9rem;border-bottom:2px solid var(--line);align-self:flex-start}
.j-card.feature{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(20px,3vw,40px);align-items:start}
.j-card.feature .cover{aspect-ratio:4/3}
.j-card.feature .jt{display:flex;flex-direction:column;gap:12px;min-width:0}
.j-card.feature h3{font-size:clamp(1.4rem,2.2vw,1.9rem)}
.j-card.feature .body{display:flex;flex-direction:column;gap:10px;color:var(--muted-ink);max-width:60ch}
.j-card.feature .body p:first-child{color:var(--ink);font-weight:700}
.cv-img{padding:0}
.j-card.soon{cursor:default}
.j-card.soon .cover{transform:none!important}
.cover.is-soon{position:relative}
.cover.is-soon::after{content:"Coming soon";position:absolute;inset:0;display:grid;place-items:center;background:rgba(38,35,32,.55);color:#F2EFEA;font-family:var(--f-display);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem}
.j-card.soon h3{color:var(--muted-ink)}
.j-card.soon:hover h3{text-decoration:none}
.soon-pill{align-self:flex-start;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--paper-2);border-radius:999px;padding:6px 10px;color:var(--muted-ink)}
.cv-img img{width:100%;height:100%;object-fit:cover;object-position:50% 100%;display:block}
.j-card.feature .cv-img{aspect-ratio:4/5}
.calc{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0}
.calc > div{background:var(--paper-2);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:4px;min-width:0}
.calc > div:last-child{background:var(--ink);color:var(--paper)}
.calc > div:last-child span:not(.mono){color:var(--stone)}
.calc > div:last-child b{color:var(--line)}
.calc b{font-family:var(--f-display);font-weight:800;font-size:1.9rem;line-height:1;font-variant-numeric:tabular-nums}
.calc .mono{font-size:.62rem}
.calc span:not(.mono){font-size:.85rem;line-height:1.35}
.src{font-size:.78rem;color:var(--muted)}
@media (max-width:560px){.calc{grid-template-columns:1fr}}
.calc.stats{grid-template-columns:repeat(2,1fr)}
.calc.stats > div:last-child{background:var(--paper-2);color:inherit}
.calc.stats > div:last-child span:not(.mono){color:inherit}
.calc.stats > div:last-child b{color:inherit}
.calc.stats > div:nth-child(-n+2) b{color:var(--line-deep)}
.cv-dime{background:#0f2a1c;color:#F2EFEA;flex-direction:column;justify-content:space-between}
.cv-dime .mono{color:#7BE3A0}
.cv-dime .cv-word{font-size:clamp(3.2rem,6.4vw,5.6rem);color:#2FD27A}
.dime-row{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:800;font-size:1.2rem}
.dime-row i{flex:1;height:2px;background:linear-gradient(90deg,rgba(242,239,234,.3),#2FD27A)}
.follow{margin-top:clamp(56px,7vw,96px);background:var(--ink);color:var(--paper);border-radius:24px;padding:clamp(24px,4vw,48px);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;align-items:center}
.follow .eyebrow{color:var(--line);margin-bottom:12px}
.follow h2{font-family:var(--f-display);font-weight:400;letter-spacing:-.03em;font-size:clamp(1.8rem,3.4vw,2.8rem);line-height:1.08;margin:0 0 14px;text-transform:lowercase}
.follow h2 em{font-style:normal;color:var(--line)}
.follow p{color:var(--stone);max-width:48ch}
.follow-links{display:flex;flex-direction:column;gap:10px}
.soc{display:flex;align-items:center;gap:14px;text-decoration:none;background:rgba(242,239,234,.06);border:1px solid var(--rule-dark);border-radius:16px;padding:14px 16px;transition:background .2s,border-color .2s}
.soc:hover{background:var(--line);border-color:var(--line);color:var(--ink)}
.soc:hover small{color:var(--ink)}
.soc-ic{width:40px;height:40px;border-radius:12px;background:var(--paper);color:var(--ink);display:grid;place-items:center;font-weight:800;font-size:1.05rem;flex:none}
.soc-ic svg{width:20px;height:20px}
.soc b{display:block}
.soc small{color:var(--muted);font-size:.82rem}
.soc .arr{margin-left:auto}
.soc-line .soc-ic{background:#06C755;color:#fff}
@media (max-width:760px){.follow{grid-template-columns:1fr}}
.signs{margin:4px 0;padding-left:1.3em;display:flex;flex-direction:column;gap:10px}
.signs li::marker{color:var(--line-deep);font-weight:800}
.signs b{color:var(--ink);display:block}
@media (max-width:760px){.j-card.feature{grid-column:auto;grid-template-columns:1fr}}

.past-extra{margin-top:clamp(48px,6vw,96px)}
.meetup{margin:0;position:relative;border-radius:24px;overflow:hidden}
.meetup > img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;max-width:100%}
.meet-badge{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.92);color:#262320;border-radius:16px;padding:8px 14px 8px 8px;box-shadow:0 10px 30px -12px rgba(0,0,0,.4)}
.meet-badge img{width:44px;height:44px;border-radius:12px;display:block}
.meet-badge b{display:block;font-size:.95rem}
.meet-badge small{font-size:.78rem;color:#6E675D}

/* partner card (Parnuan) */
.partner-card{aspect-ratio:auto;display:flex;flex-direction:column;align-items:stretch;gap:22px;padding:clamp(20px,3vw,36px);place-items:initial}
.pc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.pc-x{color:var(--muted)}
.pc-banner{display:block;width:100%;height:auto;max-width:100%;border-radius:16px}
.face-slot:has(img){border:2px solid var(--line)}
.face-slot.mascot{border-color:#D63585!important;background:#D63585}
.logo-slot{height:56px;min-width:160px;padding:0 18px;border-radius:14px;border:1.5px dashed rgba(242,239,234,.4);display:grid;place-items:center;color:var(--stone)}
.logo-slot img{max-height:40px;width:auto;display:block}
.founders{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.founder{margin:0;display:flex;align-items:center;gap:14px;min-width:0}
.face-slot{width:72px;height:72px;flex:none;border-radius:50%;border:1.5px dashed rgba(242,239,234,.4);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--stone);overflow:hidden}
.face-slot .ic{width:20px;height:20px}
.face-slot .mono{font-size:.58rem}
.face-slot img{width:100%;height:100%;object-fit:cover}
.founder figcaption{display:flex;flex-direction:column;gap:2px;font-size:.88rem;min-width:0}
.founder figcaption span{color:var(--muted)}
.partner-card .sheet{width:100%}
@media (max-width:480px){.founders{grid-template-columns:1fr}}

/* demo day photo band */
.stage-shot{position:relative;margin:48px 0 0;border-radius:24px;overflow:hidden;background:var(--ink);color:var(--paper)}
.stage-shot img{display:block;width:100%;aspect-ratio:16/8;object-fit:cover;object-position:60% 40%;max-width:100%}
.stage-shot figcaption{position:absolute;left:0;bottom:0;padding:clamp(18px,3vw,36px);display:flex;flex-direction:column;gap:12px;max-width:min(560px,90%)}
.stage-shot .big{font-family:var(--f-display);font-weight:800;text-transform:uppercase;letter-spacing:-.03em;line-height:.95;font-size:clamp(1.6rem,4vw,3.4rem)}
.stage-shot .lbl{background:var(--paper);color:var(--ink);padding:7px 12px;border-radius:999px;align-self:flex-start}
.stage-shot .cap{font-size:.9rem;color:#D3CCC1}
.stage-shot::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(38,35,32,.85),rgba(38,35,32,0) 60%);pointer-events:none}
.stage-shot figcaption{z-index:2}
@media (max-width:640px){.stage-shot img{aspect-ratio:4/5;object-position:62% 40%}.stage-shot::after{background:linear-gradient(0deg,rgba(38,35,32,.9),rgba(38,35,32,0) 65%)}}
.page-photo{margin:0;border-radius:22px;overflow:hidden;margin-top:40px}
.page-photo img{display:block;width:100%;height:auto;object-fit:cover;max-width:100%}
.page-photo figcaption{font-size:.85rem;color:var(--muted-ink);padding-top:10px}

/* collaborations */
.stories{display:flex;flex-direction:column;gap:clamp(48px,6vw,96px);margin-top:56px}
.story{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:center}
.story .vis{grid-column:1/8;min-width:0}
.story .txt{grid-column:8/-1;display:flex;flex-direction:column;gap:14px;min-width:0}
.story.flip .vis{grid-column:6/-1;order:2}
.story.flip .txt{grid-column:1/6;order:1}
.story h3{font-family:var(--f-display);font-weight:800;font-size:clamp(2.4rem,4.6vw,4.2rem);line-height:.88;text-transform:uppercase}
.story .q{font-size:1.3rem;font-weight:700;line-height:1.25;max-width:24ch}
.story .txt p.d{color:var(--muted-ink);max-width:44ch}
.tag{color:var(--line-deep)}
.textlink{font-weight:600;text-decoration:none;border-bottom:2px solid var(--line);align-self:flex-start;padding-bottom:2px}
.textlink:hover{background:var(--paper-2)}
@media (max-width:900px){.story .vis,.story .txt,.story.flip .vis,.story.flip .txt{grid-column:1/-1;order:0}}
.stage{border-radius:24px;aspect-ratio:4/3;max-width:100%;position:relative;overflow:hidden;display:grid;place-items:center;padding:20px}
.stage .illus{position:absolute;top:16px;left:16px;color:inherit;opacity:.7}
.stage-a{background:var(--line)}
.stage-b{background:var(--ink);color:var(--paper)}
.phone{width:min(300px,78%);background:#fff;border-radius:26px;padding:14px;box-shadow:0 30px 60px -25px rgba(0,0,0,.45);color:var(--ink);display:flex;flex-direction:column;gap:9px;transform:rotate(-3deg);transition:transform .5s}
.story:hover .phone{transform:rotate(0)}
.phone .ph{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.85rem;padding-bottom:8px;border-bottom:1px solid #eee}
.phone .ph i{width:22px;height:22px;border-radius:50%;background:var(--line);flex:none}
.bub{font-size:.78rem;line-height:1.35;padding:9px 11px;border-radius:14px;max-width:85%}
.bub.me{align-self:flex-end;background:var(--line);border-bottom-right-radius:4px}
.bub.bot{background:#EFEBE5;border-bottom-left-radius:4px}
.bub .amt{font-family:var(--f-mono);font-weight:700;display:block;font-size:.95rem;margin-top:2px;font-variant-numeric:tabular-nums}
.qr{display:flex;gap:6px;flex-wrap:wrap}
.qr span{font-size:.68rem;border:1px solid var(--line-deep);color:var(--line-deep);border-radius:999px;padding:5px 9px}
.sheet{width:min(380px,92%);display:flex;flex-direction:column;gap:10px;font-family:var(--f-mono);font-size:.74rem}
.sheet .row{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:12px 14px;border:1px solid var(--rule-dark);border-radius:12px;background:rgba(242,239,234,.04)}
.sheet .row span:first-child{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.66rem}
.sheet .status{display:inline-flex;align-items:center;gap:6px;color:var(--line)}
.sheet .status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--line);animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:.25}}
.sheet .bars{display:flex;align-items:flex-end;gap:5px;height:44px}
.sheet .bars i{flex:1;background:var(--line);border-radius:3px 3px 0 0;opacity:.35}
.sheet .bars i.now{opacity:1}

/* audience */
.aud-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:44px}
.aud-tab{appearance:none;border:1px solid var(--rule-dark);background:transparent;color:var(--paper);border-radius:14px;padding:22px 22px;text-align:left;font:500 .78rem/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.aud-tab:hover{border-color:var(--paper)}
.aud-tab[aria-selected="true"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.aud-panel{margin-top:10px;border:1px solid var(--rule-dark);border-radius:18px;padding:clamp(24px,3.4vw,44px);display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.aud-panel h3{font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:clamp(1.9rem,4vw,3.4rem);line-height:.95;text-wrap:balance}
.aud-panel p{color:#CFC8BD;max-width:56ch;font-size:1.08rem}
.aud-panel.swap h3,.aud-panel.swap p{animation:beat .45s cubic-bezier(.2,.8,.2,1)}
@media (max-width:560px){.aud-grid{grid-template-columns:1fr}}

/* journal */
.j-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.j-card{text-decoration:none;display:flex;flex-direction:column;gap:12px;min-width:0}
.cover{aspect-ratio:4/3;max-width:100%;border-radius:18px;overflow:hidden;position:relative;display:flex;padding:20px;transition:transform .4s}
.j-card:hover .cover{transform:translateY(-6px) rotate(-.6deg)}
.j-card .mono{color:var(--muted-ink)}
.j-card h3{font-size:1.2rem;line-height:1.25;font-weight:700;text-wrap:balance}
.j-card:hover h3{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px;text-decoration-thickness:2px}
.cv-word{font-family:var(--f-display);font-weight:800;text-transform:uppercase;line-height:.82;letter-spacing:-.02em}
.cv-thesis{background:var(--stone);color:var(--ink);align-items:flex-end}
.cv-thesis .cv-word{font-size:clamp(2.6rem,5.4vw,4.6rem)}
.cv-playbook{background:var(--ink);color:var(--paper);flex-direction:column;justify-content:space-between}
.cv-playbook .cv-word{font-size:clamp(1.8rem,3.4vw,2.8rem)}
.cv-playbook .stack{display:flex;align-items:flex-end;gap:6px;height:45%}
.cv-playbook .stack i{flex:1;background:var(--line);border-radius:4px 4px 0 0}
.cv-builders{background:var(--line);color:var(--ink);align-items:center;justify-content:center}
.cv-builders .cv-word{font-size:clamp(7rem,15vw,12rem);line-height:.6;padding-top:.3em}
.cv-notes{background:var(--paper-2);color:var(--ink);flex-direction:column;justify-content:space-between;font-family:var(--f-mono);font-size:.72rem}
.cv-notes .grid{flex:1;margin:14px 0;background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);background-size:22px 22px;border-radius:8px;position:relative}
.cv-notes .grid::after{content:"";position:absolute;left:12%;right:10%;top:62%;height:3px;background:var(--line);transform:rotate(-14deg);transform-origin:left}
.j-foot{margin-top:40px}
@media (max-width:900px){.j-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.j-grid{grid-template-columns:1fr}}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}
.filters button{appearance:none;border:1px solid var(--rule);background:transparent;border-radius:999px;padding:9px 15px;font:500 .72rem var(--f-mono);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;color:var(--ink)}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* final cta */
.final{background:var(--stone);color:var(--ink)}
.final .wrap{padding-block:clamp(80px,11vw,160px) 28px;display:flex;flex-direction:column;gap:28px}
.final .eyebrow{color:var(--ink)}
.final .eyebrow::before{background:var(--ink)}
.final h2{font-size:clamp(2.2rem,5.4vw,5rem);transform-origin:left bottom;transform:scale(.94);transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.final.in h2{transform:none}
.final p{font-size:1.2rem;max-width:44ch}
.final-foot{margin-top:56px;padding-top:20px;align-items:center;border-top:1px solid rgba(38,35,32,.35);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--f-display);font-weight:800}

/* footer */
.site-foot{background:var(--ink);color:var(--muted)}
.site-foot .wrap{padding-block:28px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.site-foot a{text-decoration:none}
.site-foot a:hover{color:var(--line)}

/* page headers for secondary views */
.page-hero{padding-block:clamp(56px,8vw,112px) clamp(40px,5vw,72px);border-bottom:1px solid var(--rule)}
.page-hero h1{font-size:clamp(2.2rem,5vw,4.6rem);max-width:18ch;text-transform:lowercase}
.page-hero .sub{font-size:1.2rem}
.cols{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;padding-block:56px;border-bottom:1px solid var(--rule)}
.cols > .mono{grid-column:1/4;color:var(--muted-ink)}
.cols > .body{grid-column:4/-1;display:flex;flex-direction:column;gap:16px;font-size:1.12rem;max-width:62ch;min-width:0}
@media (max-width:900px){.cols > .mono,.cols > .body{grid-column:1/-1}}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.step{border-top:2px solid var(--ink);padding-top:14px;display:flex;flex-direction:column;gap:8px}
.step b{font-family:var(--f-mono);font-size:.72rem;color:var(--line-deep)}
.step h4{margin:0;font-size:1.05rem}
.step p{font-size:.95rem;color:var(--muted-ink)}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.steps{grid-template-columns:1fr}}
.eco{display:flex;flex-wrap:wrap;gap:8px}
.eco span{border:1px solid var(--rule);border-radius:999px;padding:8px 14px;font-size:.92rem}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:520px}
th,td{text-align:left;padding:14px 10px;border-bottom:1px solid var(--rule);font-size:.95rem}
th{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-ink);font-weight:500}
td:first-child{font-weight:700}

/* contact */
.contact{display:grid;grid-template-columns:repeat(12,1fr);gap:32px;padding-block:clamp(48px,7vw,96px)}
.contact-intro{grid-column:1/6;display:flex;flex-direction:column;gap:20px}
.contact-intro h1{font-size:clamp(2rem,4.4vw,4rem);text-transform:lowercase}
.contact form,.contact .done{grid-column:6/-1;background:#FAF8F4;border:1px solid var(--rule);border-radius:24px;padding:clamp(20px,3vw,36px);display:flex;flex-direction:column;gap:20px;min-width:0}
@media (max-width:900px){.contact-intro,.contact form,.contact .done{grid-column:1/-1}}
fieldset{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
legend{font-weight:600;margin-bottom:10px;padding:0}
.radio{position:relative}
.radio input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.radio span{display:inline-block;border:1px solid var(--rule);border-radius:999px;padding:10px 16px;font-size:.92rem;transition:background .2s}
.radio input:checked + span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.radio input:focus-visible + span{outline:2px solid var(--line);outline-offset:2px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field.full{grid-column:1/-1}
.field label{font-size:.85rem;font-weight:600}
.field input,.field textarea{font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:12px 14px;width:100%}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--line);box-shadow:0 0 0 3px rgba(6,199,85,.18)}
.field .err{color:#b42318;font-size:.8rem;min-height:1em}
@media (max-width:560px){.fields{grid-template-columns:1fr}}
.form-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.note{font-size:.82rem;color:var(--muted-ink)}
.done h2{font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:clamp(2rem,4vw,3.2rem);line-height:.95}
#copyFallback{width:100%;min-height:120px;font:.8rem var(--f-mono);border-radius:12px;border:1px solid var(--rule);padding:10px}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,140%);background:var(--ink);color:var(--paper);padding:12px 18px;border-radius:999px;font-size:.9rem;z-index:80;transition:transform .35s}
.toast.show{transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){
  .hp .hp-bg.on{transform:none}.hp-dot.on i::after{animation:none;transform:scaleX(1)}
  .hp-bg{transform:none}
  .ticker-track{animation:none}
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .final h2{transform:none}
  .manifesto h2 .w{color:var(--ink)}
}
[hidden]{display:none!important}

/* ===== multi-page additions ===== */
body{margin:0}
:root{--f-display:"LINE Seed Sans","LINE Seed JP","LINE Seed Sans TH","Anuphan","Helvetica Neue",Arial,sans-serif;--f-body:var(--f-display);--f-mono:var(--f-display)}
.view{display:block}
.head-end{display:flex;align-items:center;gap:10px}
.lang{text-decoration:none;font-size:.82rem;font-weight:700;padding:8px 12px;border-radius:999px;border:1px solid var(--rule)}
.lang:hover{background:var(--paper-2)}
body.over .lang{color:#F2EFEA;border-color:rgba(242,239,234,.5)}
body.over .lang:hover{background:rgba(242,239,234,.12)}
@media (max-width:760px){.head-end{display:none}}
.nav a[aria-current="page"]{background:var(--ink);color:var(--paper)}

/* journal index: plain card grid */
.j-index .j-card[hidden]{display:none}
.j-card .out{margin-top:2px}

/* article page */
.post{padding-block:clamp(28px,4vw,56px) clamp(40px,5vw,72px)}
.crumbs{display:flex;gap:8px;color:var(--muted-ink);margin-bottom:24px}
.crumbs a{text-decoration:none;border-bottom:1px solid var(--line)}
.post-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,4vw,64px);align-items:start}
.post-cover{position:sticky;top:calc(84px + env(safe-area-inset-top,0px))}
.post-cover .cover{aspect-ratio:4/5;border-radius:22px}
.post-cover .cv-img img{object-position:50% 50%!important}
.post-main{display:flex;flex-direction:column;gap:18px;min-width:0}
.post-tag{display:inline-flex;align-items:center;gap:8px;color:var(--line-deep)}
.post-title{font-family:var(--f-display);font-weight:700;font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.12;letter-spacing:-.02em;margin:0;text-wrap:balance}
.post-body{display:flex;flex-direction:column;gap:16px;font-size:1.1rem;line-height:1.7;color:var(--ink);max-width:62ch}
.post-body > p:first-child{font-size:1.25rem;font-weight:700;line-height:1.5}
.post-body .signs b{display:block}
.post-src{align-self:flex-start;margin-top:8px}
.more .j-grid{margin-top:20px}
@media (max-width:860px){.post-grid{grid-template-columns:1fr}.post-cover{position:static;max-width:440px}}

/* Thai typography */
:lang(th) body{line-height:1.7}
:lang(th) .display{line-height:1.3;letter-spacing:0}
:lang(th) .mono,:lang(th) .nav a,:lang(th) .eyebrow,:lang(th) .chip,:lang(th) .filters button,:lang(th) .soon-pill{letter-spacing:.02em}
:lang(th) .hp .hp-title{letter-spacing:.04em;font-weight:400;line-height:1.45}
:lang(th) .hp .hp-title span{padding-left:0}
:lang(th) .cell h3,:lang(th) .story h3,:lang(th) .look-card h3,:lang(th) .benefit h3,:lang(th) .cta-strip h3,:lang(th) .post-title{line-height:1.35;letter-spacing:0}
:lang(th) .leader-quote,:lang(th) .approach-lead{line-height:1.35}
:lang(th) .post-body{line-height:1.85}
:lang(th) .hp .hp-title span{animation:none}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status:empty{display:none}
.form-status.err{color:#b42318}
button[disabled]{opacity:.6;cursor:progress}
.consent{display:flex;flex-direction:column;gap:6px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;line-height:1.5;color:var(--muted-ink);cursor:pointer}
.check input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--line-deep)}
.check a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.consent .err{color:#b42318;font-size:.8rem;min-height:1em}
.legal{font-size:1rem!important;line-height:1.75}
.legal a{word-break:break-all}

/* ---- unfair advantage: minimal ---- */
.bento{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-top:56px}
.bento .cell{grid-column:auto!important;background:transparent!important;color:var(--ink)!important;box-shadow:none!important;border-radius:0;min-height:0;padding:32px 28px 40px;border-left:1px solid var(--rule);gap:14px;overflow:visible}
.bento .cell:first-child{border-left:0;padding-left:0}
.bento .cell::before{content:"";position:absolute;top:-1px;left:0;height:2px;width:0;background:var(--line);transition:width .5s cubic-bezier(.2,.8,.2,1)}
.bento .cell:first-child::before{left:0}
.bento .cell:hover::before,.bento .cell:focus-within::before{width:100%}
.bento .art,.bento .corner,.bento .reveal{display:none!important}
.bento .head{flex-direction:column;align-items:flex-start;gap:36px}
.bento .ico{background:transparent!important;color:var(--line-deep)!important;width:auto;height:auto;border-radius:0;place-items:start}
.bento .ico .ic{width:30px;height:30px;stroke-width:1.4;transition:transform .4s}
.bento .cell:hover .ic{transform:translateY(-3px)}
.bento .mono{color:var(--muted-ink)!important}
.bento h3{text-transform:none;font-weight:400;font-size:clamp(1.25rem,1.7vw,1.6rem);line-height:1.25;letter-spacing:-.015em;max-width:16ch}
.bento p{color:var(--muted-ink)!important;font-size:.95rem;line-height:1.6}
@media (max-width:1000px){.bento{grid-template-columns:repeat(2,minmax(0,1fr))}.bento .cell:nth-child(3){border-left:0;padding-left:0}.bento .cell:nth-child(n+3){border-top:1px solid var(--rule)}}
@media (max-width:560px){.bento{grid-template-columns:1fr}.bento .cell{border-left:0!important;padding-left:0!important;padding-right:0}.bento .cell+.cell{border-top:1px solid var(--rule)}}

/* ---- customer obsessed: snapshot stack ---- */
.look-card{position:relative}
.friends{position:relative;height:clamp(190px,18vw,240px);margin-top:auto;padding-top:18px}
.pf{position:absolute;width:36%;max-width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:7px solid #F2EFEA;border-bottom-width:26px;border-radius:4px;box-shadow:0 18px 30px -16px rgba(0,0,0,.6);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.pf1{left:0;bottom:6px;transform:rotate(-8deg)}
.pf2{left:21%;bottom:18px;transform:rotate(3deg);z-index:2}
.pf3{left:43%;bottom:2px;transform:rotate(-4deg);z-index:3}
.pf4{right:0;bottom:14px;transform:rotate(8deg);z-index:1}
.look-card:hover .pf1{transform:rotate(-12deg) translate(-10px,-6px)}
.look-card:hover .pf2{transform:rotate(1deg) translate(-4px,-16px)}
.look-card:hover .pf3{transform:rotate(-2deg) translate(4px,-12px)}
.look-card:hover .pf4{transform:rotate(12deg) translate(10px,-6px)}
@media (max-width:760px){.friends{height:200px}}
/* snapshot pop-out on hover */
.pf{transition:transform .45s cubic-bezier(.34,1.56,.64,1),box-shadow .45s ease,filter .3s ease;cursor:zoom-in}
.friends:hover .pf{filter:brightness(.82)}
.friends .pf:hover{transform:rotate(0deg) scale(1.45) translateY(-28px)!important;z-index:10;filter:none;box-shadow:0 34px 50px -18px rgba(0,0,0,.75)}
@media (prefers-reduced-motion:reduce){.pf{transition:none}}