@font-face{font-family:'Satoshi';src:url('/fonts/satoshi/Satoshi-Light.otf') format('opentype');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'Satoshi';src:url('/fonts/satoshi/Satoshi-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Satoshi';src:url('/fonts/satoshi/Satoshi-Medium.otf') format('opentype');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Satoshi';src:url('/fonts/satoshi/Satoshi-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Satoshi';src:url('/fonts/satoshi/Satoshi-Italic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap;}
@font-face{font-family:'Clash Display';src:url('/fonts/clash-display-font/ClashDisplay-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Clash Display';src:url('/fonts/clash-display-font/ClashDisplay-Medium.otf') format('opentype');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Clash Display';src:url('/fonts/clash-display-font/ClashDisplay-Semibold.otf') format('opentype');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Clash Display';src:url('/fonts/clash-display-font/ClashDisplay-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap;}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
[data-theme="dark"]{
  --bg:#080e0c;--bg2:#0c1410;--bg3:#111d18;
  --teal:#2db484;--teal-soft:rgba(45,180,132,0.09);--teal-border:rgba(45,180,132,0.28);
  --text-primary:#eef2ef;--text-muted:rgba(220,235,228,0.48);--text-dim:rgba(220,235,228,0.22);
  --border:rgba(255,255,255,0.07);--border-mid:rgba(255,255,255,0.11);
  --card-bg:#0c1410;--left-bg:#111d18;
  --overlay-bg:rgba(5,10,8,0.97);--footer-bg:#060c0a;
}
[data-theme="light"]{
  --bg:#f3f6f4;--bg2:#eaf0ec;--bg3:#e2ebe5;
  --teal:#1a8c64;--teal-soft:rgba(26,140,100,0.08);--teal-border:rgba(26,140,100,0.25);
  --text-primary:#0d1f18;--text-muted:rgba(13,31,24,0.52);--text-dim:rgba(13,31,24,0.28);
  --border:rgba(0,0,0,0.07);--border-mid:rgba(0,0,0,0.12);
  --card-bg:#edf3ef;--left-bg:#e6ede9;
  --overlay-bg:rgba(240,245,242,0.97);--footer-bg:#e8eeea;
}
html{scroll-behavior:smooth;}
body{background:var(--bg);font-family:'Satoshi',sans-serif;color:var(--text-primary);cursor:none;overflow-x:hidden;transition:background .4s,color .4s;}

/* ── CURSOR ── */
#cursor-wrap{position:fixed;z-index:9999;pointer-events:none;transform:translate(-2px,-2px);}
#cursor-wrap svg{width:20px;height:20px;display:block;}
[data-theme="dark"] .cur-path{stroke:#eef2ef;fill:#080e0c;}
[data-theme="light"] .cur-path{stroke:#0d1f18;fill:#f3f6f4;}
#cursor-you{position:absolute;top:-2px;left:18px;background:var(--teal);color:#fff;font-size:9px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:100px;white-space:nowrap;transition:background .4s;}
body.toolbar-hover #cursor-you{opacity:0;}
#cursor-wrap.grab svg{transform:scale(.85);}

/* ── DOT CANVAS ── */
#dot-canvas{position:fixed;inset:0;pointer-events:none;z-index:0;}

/* ── NAV ── */

/* ── OVERLAY ── */
.left-toolbar{position:fixed;left:12px;top:50%;transform:translateY(-50%);z-index:550;display:flex;flex-direction:column;gap:10px;}
.tool-badge{position:relative;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-mid);background:color-mix(in srgb,var(--bg2) 88%, transparent);box-shadow:0 10px 30px rgba(0,0,0,0.08);backdrop-filter:blur(10px);transition:border-color .25s,background .25s,transform .25s;}
.tool-badge:hover{border-color:var(--teal-border);background:var(--teal-soft);transform:translateY(-2px);}
.tool-badge svg{width:20px;height:20px;display:block;}
.tool-badge img{display:block;width:22px;height:22px;object-fit:contain;}
.tool-badge span{font-size:12px;font-weight:600;letter-spacing:-.01em;}
.tool-label{position:absolute;left:58px;top:50%;transform:translateY(-50%) translateX(-6px);padding:8px 12px;border-radius:999px;border:1px solid var(--border-mid);background:color-mix(in srgb,var(--bg2) 94%, transparent);color:var(--text-primary);font-size:11px;font-weight:500;letter-spacing:.06em;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;}
.tool-badge:hover .tool-label{opacity:1;transform:translateY(-50%) translateX(0);}
.tool-badge svg path,.tool-badge svg circle{transition:fill .25s,stroke .25s;}
.tool-badge-figma img{width:24px;height:24px;}
.tool-badge-adobe > span:first-child{color:#c7b8ff;}
.tool-badge-adobe img{width:24px;height:24px;}
.tool-badge-chatgpt img{width:24px;height:24px;}
.tool-badge-gemini img{width:24px;height:24px;}
.tool-badge-claude img{width:24px;height:24px;}
.tool-badge-vscode img{width:24px;height:24px;}
.tool-badge-pencil img{width:24px;height:24px;}
[data-theme="light"] .tool-badge-chatgpt img{filter:brightness(0);}
[data-theme="light"] .tool-badge{box-shadow:0 12px 32px rgba(13,31,24,0.08);}
[data-theme="light"] .tool-badge-claude svg path{stroke:#0d1f18;}

/* ══ FOLD 1 ══ */
#fold-hero{position:relative;width:100%;height:100vh;overflow:hidden;z-index:10;}
.drag-el{position:absolute;cursor:none;user-select:none;-webkit-user-select:none;z-index:20;visibility:hidden;}
.drag-el.placed{visibility:visible;}
.drag-el.dragging{z-index:400;}
.drag-el.snapping{transition:left .4s cubic-bezier(.34,1.56,.64,1),top .4s cubic-bezier(.34,1.56,.64,1);}
.bbox{position:absolute;inset:-10px;border:1px solid rgba(45,180,132,0.55);border-radius:3px;opacity:0;transition:opacity .15s;pointer-events:none;}
.drag-el:hover .bbox,.drag-el.dragging .bbox{opacity:1;}
.bbox::before,.bbox::after,.bbox .c1,.bbox .c2{content:'';position:absolute;width:7px;height:7px;border:1.5px solid var(--teal);border-radius:1px;background:var(--bg);}
.bbox::before{top:-4px;left:-4px;border-right:none;border-bottom:none;}
.bbox::after{top:-4px;right:-4px;border-left:none;border-bottom:none;}
.bbox .c1{bottom:-4px;left:-4px;border-right:none;border-top:none;}
.bbox .c2{bottom:-4px;right:-4px;border-left:none;border-top:none;}
.bbox-label{position:absolute;top:-26px;left:0;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);opacity:0;transition:opacity .15s;white-space:nowrap;}
.drag-el.dragging .bbox-label{opacity:1;}
.el-title{font-family:'Clash Display',sans-serif;font-size:clamp(70px,11vw,148px);font-weight:600;color:var(--text-primary);line-height:1;letter-spacing:-.03em;white-space:nowrap;transition:color .4s;}
.el-title br{display:none;}
.hero-title-draggable{display:inline-flex;align-items:center;justify-content:center;}
.el-title--tagline{display:inline-block;font-size:84px;white-space:nowrap;line-height:1.04;text-align:center;}
.el-title-accent{color:var(--teal);}
.el-title-rocket-wrap{display:block;line-height:0;}
.el-rocket-icon{width:58px;height:58px;color:var(--teal);display:block;overflow:visible;animation:rocket-wiggle 2.4s ease-in-out infinite;transform-origin:50% 54%;}
.el-rocket-body{fill:currentColor;}
.el-rocket-flame{fill:#00C896;animation:rocket-flame 0.55s ease-in-out infinite;transform-origin:4px 19px;}
@keyframes rocket-wiggle{0%,100%{transform:translateY(0) rotate(0deg);}20%{transform:translateY(-2px) rotate(-3deg);}45%{transform:translateY(1px) rotate(2deg);}70%{transform:translateY(-1px) rotate(-1deg);}}
@keyframes rocket-flame{0%,100%{opacity:.75;transform:scale(.86) translate(-.2px,.3px);}50%{opacity:1;transform:scale(1.18) translate(-1px,1px);}}
.el-desc{font-size:clamp(14px,1.1vw,16px);line-height:1.82;color:var(--text-muted);max-width:440px;text-align:center;transition:color .4s;}
#scroll-arrow{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;cursor:none;z-index:20;}
#scroll-arrow svg{width:28px;height:28px;stroke:var(--teal);fill:none;stroke-width:1.5;animation:bounce 1.8s ease-in-out infinite;}
@keyframes bounce{0%,100%{transform:translateY(0);opacity:.45;}50%{transform:translateY(8px);opacity:1;}}
#scroll-arrow p{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-dim);}

@property --eyebrow-angle{syntax:'<angle>';inherits:false;initial-value:0deg;}

/* ── HERO EYEBROW ── */
.hero-eyebrow{position:absolute;top:8vh;left:50%;transform:translateX(-50%);z-index:20;display:inline-flex;align-items:center;gap:8px;padding:7px 18px;border-radius:100px;border:1px solid var(--teal-border);background:var(--teal-soft);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);white-space:nowrap;backdrop-filter:blur(8px);overflow:hidden;isolation:isolate;}
.hero-eyebrow::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1.25px;background:conic-gradient(from var(--eyebrow-angle),transparent 0deg,transparent 235deg,rgba(0,200,150,.14) 268deg,rgba(0,200,150,.9) 286deg,rgba(238,242,239,.32) 300deg,transparent 326deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:eyebrow-stroke 7.5s linear infinite;}
.hero-eyebrow-dot{width:5px;height:5px;border-radius:50%;background:var(--teal);flex-shrink:0;animation:pulse 2.8s ease-in-out infinite;}
@keyframes eyebrow-stroke{to{--eyebrow-angle:360deg;}}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.1);}}

/* ── HERO CTA ── */
.hero-cta-row{position:absolute;bottom:100px;left:50%;transform:translateX(-50%);z-index:20;display:flex;align-items:center;gap:12px;white-space:nowrap;}
.hero-btn-primary{display:inline-flex;align-items:center;gap:8px;padding:13px 26px;border-radius:100px;background:var(--text-primary);color:var(--bg);font-family:'Satoshi',sans-serif;font-size:12px;font-weight:600;letter-spacing:.05em;text-decoration:none;cursor:none;transition:background .25s,color .25s,transform .15s,box-shadow .25s;}
.hero-btn-primary:hover{background:var(--teal);color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px rgba(45,180,132,0.35);}
.hero-btn-secondary{position:relative;display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:100px;border:1px solid var(--border-mid);background:transparent;color:var(--text-primary);font-family:'Satoshi',sans-serif;font-size:12px;font-weight:500;letter-spacing:.05em;text-decoration:none;cursor:none;transition:border-color .25s,color .25s,background .25s,transform .15s;}
.hero-btn-secondary:hover{border-color:var(--teal-border);background:var(--teal-soft);color:var(--teal);transform:translateY(-2px);}
.hero-work-preview{position:absolute;left:50%;bottom:calc(100% + 24px);width:610px;height:430px;transform:translateX(-50%) translateY(14px) scale(.94);opacity:0;pointer-events:none;transition:opacity .28s ease,transform .34s cubic-bezier(.16,1,.3,1);filter:drop-shadow(0 32px 54px rgba(0,0,0,.42));}
.hero-btn-secondary:hover .hero-work-preview,.hero-btn-secondary:focus-visible .hero-work-preview{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
.hero-work-preview::before{content:'';position:absolute;inset:38px 0 4px;border-radius:32px;background:rgba(0,0,0,.74);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(10px);}
.hero-work-preview-card{position:absolute;top:16px;width:270px;height:390px;border-radius:18px;overflow:hidden;background:var(--card-bg);border:1px solid var(--teal-border);box-shadow:0 24px 48px rgba(0,0,0,.34);transition:transform .34s cubic-bezier(.16,1,.3,1);text-align:left;letter-spacing:0;text-transform:none;}
.hero-work-preview-card--hisabi{left:28px;transform:rotate(-12deg) translateY(12px);}
.hero-work-preview-card--wellows{right:28px;transform:rotate(12deg) translateY(12px);}
.hero-btn-secondary:hover .hero-work-preview-card--hisabi,.hero-btn-secondary:focus-visible .hero-work-preview-card--hisabi{transform:rotate(-12deg) translateY(0);}
.hero-btn-secondary:hover .hero-work-preview-card--wellows,.hero-btn-secondary:focus-visible .hero-work-preview-card--wellows{transform:rotate(12deg) translateY(0);}
.hero-work-preview-cover{position:relative;display:block;height:39%;background-size:cover;background-position:center top;overflow:hidden;}
.hero-work-preview-card--hisabi .hero-work-preview-cover{background-image:linear-gradient(180deg,rgba(8,12,18,.08),rgba(8,12,18,.7)),url('./images/Hisabi-cover-image.jpg');}
.hero-work-preview-card--wellows .hero-work-preview-cover{background-image:linear-gradient(180deg,rgba(8,12,18,.08),rgba(8,12,18,.7)),url('./images/wellows-case-study/wellows-cover.jpg');}
.hero-work-preview-badge{position:absolute;top:12px;left:12px;padding:5px 9px;border-radius:999px;background:rgba(8,12,18,.52);border:1px solid rgba(255,255,255,.18);color:#eef2ef;font-size:7px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;}
.hero-work-preview-caption{position:absolute;left:16px;right:16px;bottom:14px;display:flex;flex-direction:column;gap:2px;color:#eef2ef;}
.hero-work-preview-caption strong{font-size:13px;line-height:1.1;}
.hero-work-preview-caption small{font-size:8px;line-height:1.2;color:rgba(238,242,239,.66);}
.hero-work-preview-body{display:flex;flex-direction:column;padding:19px 18px 16px;background:var(--left-bg);height:61%;}
.hero-work-preview-num{font-size:8px;font-weight:700;letter-spacing:.14em;color:var(--text-dim);margin-bottom:12px;}
.hero-work-preview-title{font-family:'Clash Display',sans-serif;font-size:22px;font-weight:600;line-height:1;color:var(--text-primary);margin-bottom:7px;}
.hero-work-preview-date{font-size:8px;color:var(--text-dim);margin-bottom:4px;}
.hero-work-preview-role{font-size:8px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);margin-bottom:13px;}
.hero-work-preview-desc{font-size:8.5px;line-height:1.65;color:var(--text-muted);margin-bottom:13px;}
.hero-work-preview-subcase{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border-radius:10px;border:1px solid var(--teal-border);background:var(--card-bg);margin-bottom:12px;}
.hero-work-preview-subcase > span:first-child{display:flex;flex-direction:column;gap:2px;}
.hero-work-preview-subcase strong{font-size:8.5px;line-height:1.2;color:var(--text-primary);}
.hero-work-preview-subcase small{font-size:7px;line-height:1.2;color:var(--text-dim);}
.hero-work-preview-arrow{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;border:1px solid var(--teal);color:var(--teal);font-size:12px;line-height:1;}
.hero-work-preview-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;}
.hero-work-preview-tags small{font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);border:1px solid var(--border-mid);padding:4px 8px;border-radius:999px;}

/* ══ FOLD 2 ══ */
#fold-work{position:relative;z-index:10;padding:120px 64px 100px;}
.work-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:56px;padding-bottom:28px;border-bottom:1px solid var(--border);}
.work-header-meta{display:flex;align-items:center;gap:18px;}
.section-eyebrow{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);margin-bottom:10px;font-weight:500;}
.section-title{font-family:'Clash Display',sans-serif;font-size:clamp(30px,4vw,52px);font-weight:500;line-height:1.05;letter-spacing:-.02em;color:var(--text-primary);transition:color .4s;}
.section-count{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);padding-bottom:4px;}
.cards-nav{display:flex;align-items:center;gap:8px;}
.cards-nav-btn{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--border-mid);background:transparent;color:var(--text-primary);cursor:none;transition:border-color .25s,background .25s,transform .2s,color .25s;}
.cards-nav-btn:hover{border-color:var(--teal-border);background:var(--teal-soft);color:var(--teal);transform:translateY(-1px);}
.cards-nav-btn:disabled{opacity:.35;pointer-events:none;transform:none;}
.cards-nav-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;}
.cards-stack{display:flex;overflow-x:scroll;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:24px;width:calc((100vw - 164px) * 0.75);max-width:calc((100vw - 164px) * 0.75);margin:0 auto;padding:0;scroll-padding-inline:0;cursor:grab;}
.cards-stack::-webkit-scrollbar{display:none;}
.cards-stack.dragging{cursor:grabbing;}
.cards-dots{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:28px;}
.cdot{width:6px;height:6px;border-radius:50%;background:var(--text-dim);border:none;padding:0;cursor:none;transition:background .25s,transform .25s;}
.cdot.active{background:var(--teal);transform:scale(1.4);}

/* ── CARD ── */
.card{display:grid;grid-template-columns:360px 1fr;flex:0 0 calc((100vw - 164px) * 0.75);width:calc((100vw - 164px) * 0.75);min-height:600px;border:1px solid var(--border-mid);border-radius:16px;overflow:hidden;background:var(--card-bg);transition:border-color .3s,background .4s;scroll-snap-align:start;}
.card:hover{border-color:var(--teal-border);}
.card-left{background:var(--left-bg);border-right:1px solid var(--border);padding:40px 36px;display:flex;flex-direction:column;}
.card-num{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-dim);margin-bottom:20px;font-weight:500;}
.card-project-name{font-family:'Clash Display',sans-serif;font-size:clamp(26px,2.8vw,40px);font-weight:500;line-height:1.05;letter-spacing:-.015em;color:var(--text-primary);margin-bottom:8px;}
.card-date{font-size:12px;letter-spacing:.04em;color:var(--text-dim);margin-bottom:4px;}
.card-role{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:500;margin-bottom:22px;}
.card-desc{font-size:13px;line-height:1.78;color:var(--text-muted);margin-bottom:28px;}
.subcases{display:flex;flex-direction:column;gap:4px;flex:1;}
.subcase{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-radius:10px;border:1px solid transparent;cursor:none;transition:background .2s,border-color .2s;position:relative;}
.subcase.clickable{cursor:none;}
.subcase.clickable:hover{background:var(--teal-soft);border-color:var(--teal-border);}
.subcase.active{background:var(--card-bg);border-color:var(--border-mid);}
.subcase.locked{opacity:.35;pointer-events:none;}
.subcase-left{display:flex;align-items:flex-start;gap:10px;}
.subcase-dot{width:7px;height:7px;border-radius:50%;border:1.5px solid var(--text-dim);margin-top:4px;flex-shrink:0;transition:border-color .2s,background .2s;}
.subcase.active .subcase-dot{background:var(--teal);border-color:var(--teal);}
.subcase-name{font-size:13px;font-weight:500;color:var(--text-primary);line-height:1.3;margin-bottom:3px;}
.subcase-tags{font-size:11px;color:var(--text-dim);letter-spacing:.02em;}
.subcase-arrow{width:26px;height:26px;border-radius:50%;border:1px solid var(--border-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:border-color .2s,background .2s;}
.subcase.active .subcase-arrow{border-color:var(--teal);background:var(--teal-soft);}
.subcase.active .subcase-arrow svg{stroke:var(--teal);}
.subcase.clickable:hover .subcase-arrow{border-color:var(--teal-border);}
.subcase.clickable:hover .subcase-arrow svg{stroke:var(--teal);}
.subcase-arrow svg{width:11px;height:11px;stroke:var(--text-dim);fill:none;stroke-width:1.5;transition:stroke .2s;}
.card-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px;}
.ctag{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted);border:1px solid var(--border-mid);padding:4px 12px;border-radius:100px;}

/* ── RIGHT PANEL ── */
.card-right{position:relative;overflow:hidden;background:
  radial-gradient(circle at 16% 18%,rgba(45,180,132,.12) 0%,transparent 24%),
  linear-gradient(145deg,color-mix(in srgb,var(--bg2) 92%, transparent) 0%,var(--bg3) 58%,color-mix(in srgb,var(--bg) 88%, transparent) 100%);
}
.card-right#hisabi-right{background:
  radial-gradient(circle at 20% 24%, rgba(233,171,54,.18) 0%, transparent 28%),
  radial-gradient(circle at 82% 74%, rgba(233,171,54,.12) 0%, transparent 24%),
  linear-gradient(145deg,#3a2a14 0%, #21170d 58%, #17100a 100%);
}
.card-right::before{content:'';position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(255,255,255,.02) 0%,transparent 32%),
  linear-gradient(0deg,rgba(0,0,0,.16) 0%,transparent 24%);
  pointer-events:none;z-index:0;
}
.card-right-img{position:absolute;inset:0;background-size:cover;background-position:center top;opacity:0;transition:opacity .45s cubic-bezier(.4,0,.2,1),transform .6s cubic-bezier(.25,.46,.45,.94);filter:saturate(1.04) contrast(1.02);}
.card-right-img.active{opacity:1;}
.card-right-img.no-cover-label::before{display:none;}
.card-right-img::before{content:attr(data-cover);position:absolute;top:20px;left:20px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(8,12,18,.36);color:#eef2ef;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;backdrop-filter:blur(10px);box-shadow:0 12px 24px rgba(0,0,0,.18);}
.card-right-link{position:absolute;inset:0;z-index:2;display:flex;align-items:flex-end;justify-content:center;padding:28px;text-decoration:none;opacity:1;transition:opacity .3s ease,background .25s ease;background:linear-gradient(to top,rgba(5,10,8,.28) 0%,rgba(5,10,8,0) 34%);}
.card-right-link-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 24px;border-radius:999px;border:1px solid rgba(255,255,255,0.24);background:rgba(255,255,255,0.12);color:#eef2ef;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;backdrop-filter:blur(10px);transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease;box-shadow:0 10px 24px rgba(0,0,0,.2);}
/* hover effect on image */
.card-right-img::after{content:'';position:absolute;inset:0;background:rgba(45,180,132,0.08);opacity:0;transition:opacity .35s;}
.card:hover .card-right-img.active::after{opacity:1;}
/* scale on hover */
.card-right:hover .card-right-img.active{transform:scale(1.025);transition:opacity .45s,transform .6s cubic-bezier(.25,.46,.45,.94);}
.card-right:hover .card-right-link{background:linear-gradient(to top,rgba(5,10,8,.42) 0%,rgba(5,10,8,0) 40%);}
.card-right:hover .card-right-link-btn{transform:translateY(-2px);background:rgba(255,255,255,0.16);border-color:rgba(255,255,255,0.45);box-shadow:0 16px 28px rgba(0,0,0,.28);}

#hisabi-app,#hisabi-ds{background-position:center center;}
#hisabi-app{background-size:auto,auto,auto,120px 120px,120px 120px,auto;}
#hisabi-ds{background-size:auto,auto,auto,100% 100%,auto;}
#hisabi-app{overflow:hidden;}
.hisabi-scene{position:absolute;inset:18px 18px 18px;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;}
.hisabi-scene-top{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 14px 0 12px;}
.hisabi-brand-mark{width:20px;height:20px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;}
.hisabi-top-actions{display:flex;align-items:center;gap:8px;}
.hisabi-top-pill,.hisabi-top-avatar{width:24px;height:24px;border-radius:999px;display:flex;align-items:center;justify-content:center;}
.hisabi-top-avatar{font-size:10px;font-weight:700;}
.hisabi-scene-body{display:grid;grid-template-columns:34px 1fr;min-height:0;flex:1;}
.hisabi-sidebar{display:flex;flex-direction:column;align-items:center;gap:11px;padding:14px 0;}
.hisabi-side-dot{width:12px;height:12px;border-radius:4px;}
.hisabi-main{padding:16px 16px 14px;display:flex;flex-direction:column;gap:12px;min-width:0;}
.hisabi-main-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.hisabi-main-title{font-size:15px;font-weight:700;display:flex;align-items:center;gap:10px;}
.hisabi-live-badge{padding:4px 8px;border-radius:999px;font-size:9px;font-weight:700;letter-spacing:.04em;}
.hisabi-head-controls{display:flex;align-items:center;gap:8px;}
.hisabi-control{padding:7px 12px;border-radius:10px;font-size:10px;font-weight:600;}
.hisabi-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;}
.hisabi-kpi-card,.hisabi-profile-card,.hisabi-actions-card,.hisabi-table-card{border-radius:16px;}
.hisabi-kpi-card{min-height:84px;padding:14px 16px;}
.hisabi-kpi-label{font-size:10px;font-weight:600;margin-bottom:14px;}
.hisabi-kpi-value{font-size:16px;line-height:1.1;font-weight:800;margin-bottom:7px;}
.hisabi-kpi-meta{font-size:10px;font-weight:700;}
.hisabi-mid-grid{display:grid;grid-template-columns:2fr 1fr;gap:12px;}
.hisabi-profile-card{padding:18px 22px;display:flex;flex-direction:column;justify-content:center;min-height:124px;position:relative;overflow:hidden;}
.hisabi-profile-card::after{content:'';position:absolute;inset:auto auto -24px -10px;width:180px;height:120px;}
.hisabi-profile-title{font-size:20px;font-weight:800;letter-spacing:-.02em;}
.hisabi-profile-line{width:46px;height:3px;border-radius:999px;margin:8px 0 10px;}
.hisabi-profile-email{font-size:12px;margin-bottom:10px;}
.hisabi-profile-edit{font-size:11px;}
.hisabi-actions-card{padding:12px;}
.hisabi-actions-title{font-size:14px;font-weight:700;margin:2px 2px 10px;}
.hisabi-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.hisabi-action-btn{min-height:54px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;text-align:center;padding:0 10px;}
.hisabi-action-btn.wide{grid-column:1 / -1;}
.hisabi-action-btn.positive{box-shadow:inset 0 0 0 999px rgba(26,156,74,.05);}
.hisabi-action-btn.danger{box-shadow:inset 0 0 0 999px rgba(192,44,72,.05);}
.hisabi-action-btn.info{box-shadow:inset 0 0 0 999px rgba(53,100,213,.06);}
.hisabi-action-btn.warning{box-shadow:inset 0 0 0 999px rgba(196,104,29,.06);}
.hisabi-table-card{padding:14px 16px 10px;}
.hisabi-table-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;font-size:14px;font-weight:700;}
.hisabi-view-all{font-size:10px;letter-spacing:.04em;text-transform:uppercase;}
.hisabi-table-labels,.hisabi-table-row{display:grid;grid-template-columns:2.2fr 1.1fr 1fr 1.2fr;gap:12px;align-items:center;}
.hisabi-table-labels{padding:0 10px 8px;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.hisabi-table-row{padding:12px 10px;font-size:11px;}
.hisabi-table-row:last-child{border-bottom:none;}
.hisabi-table-row .type{font-weight:700;}
.hisabi-table-row .amount{justify-self:end;font-weight:800;}
.hisabi-tag{display:inline-flex;align-items:center;justify-content:center;padding:3px 8px;border-radius:999px;font-style:normal;font-size:9px;font-weight:700;letter-spacing:.03em;}
html[data-theme="dark"] .hisabi-scene{background:
  radial-gradient(circle at 18% 100%, rgba(31,171,88,.06) 0, transparent 26%),
  linear-gradient(180deg,#f5f7fb 0%,#eef2f7 100%);
  border:1px solid rgba(23,45,77,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 18px 34px rgba(17,33,58,.08);
}
html[data-theme="dark"] .hisabi-scene-top{background:rgba(255,255,255,.8);border-bottom:1px solid rgba(23,45,77,.08);}
html[data-theme="dark"] .hisabi-brand-mark{background:#e7f4ef;color:#23a67a;}
html[data-theme="dark"] .hisabi-top-pill,
html[data-theme="dark"] .hisabi-top-avatar{border:1px solid rgba(23,45,77,.08);background:#ffffff;}
html[data-theme="dark"] .hisabi-top-avatar{color:#24a884;background:#eefaf5;}
html[data-theme="dark"] .hisabi-sidebar{background:#fbfcfe;border-right:1px solid rgba(23,45,77,.08);}
html[data-theme="dark"] .hisabi-side-dot{border:1px solid rgba(76,101,142,.16);background:#f3f6fb;}
html[data-theme="dark"] .hisabi-side-dot.active{background:rgba(36,168,132,.10);border-color:rgba(36,168,132,.28);box-shadow:0 0 0 3px rgba(36,168,132,.08);}
html[data-theme="dark"] .hisabi-main-title{color:#20314d;}
html[data-theme="dark"] .hisabi-live-badge{background:rgba(42,214,130,.12);color:#28b56e;}
html[data-theme="dark"] .hisabi-control{border:1px solid rgba(23,45,77,.10);background:#ffffff;color:#5d6f89;}
html[data-theme="dark"] .hisabi-kpi-card,
html[data-theme="dark"] .hisabi-profile-card,
html[data-theme="dark"] .hisabi-actions-card,
html[data-theme="dark"] .hisabi-table-card{border:1px solid rgba(23,45,77,.10);background:linear-gradient(180deg,#ffffff 0%,#fbfcfe 100%);box-shadow:0 6px 16px rgba(17,33,58,.05);}
html[data-theme="dark"] .hisabi-kpi-card.highlight{border-color:rgba(72,214,118,.45);box-shadow:inset 0 0 0 1px rgba(72,214,118,.10),0 6px 16px rgba(17,33,58,.05);}
html[data-theme="dark"] .hisabi-kpi-label{color:#7787a0;}
html[data-theme="dark"] .hisabi-kpi-value{color:#162947;}
html[data-theme="dark"] .hisabi-kpi-meta.positive{color:#20b863;}
html[data-theme="dark"] .hisabi-kpi-meta.healthy{color:#2fc46b;}
html[data-theme="dark"] .hisabi-kpi-meta.neutral{color:#7389a6;}
html[data-theme="dark"] .hisabi-profile-card{background:linear-gradient(135deg,#20314a 0%,#16253d 100%);border-color:rgba(18,31,52,.08);}
html[data-theme="dark"] .hisabi-profile-card::after{background:radial-gradient(circle,rgba(34,168,132,.08) 0%,transparent 70%);}
html[data-theme="dark"] .hisabi-profile-title{color:#ffffff;}
html[data-theme="dark"] .hisabi-profile-line{background:#22b36f;}
html[data-theme="dark"] .hisabi-profile-email{color:#a9c0db;}
html[data-theme="dark"] .hisabi-profile-edit{color:#90a6c0;}
html[data-theme="dark"] .hisabi-actions-title,
html[data-theme="dark"] .hisabi-table-head{color:#1d2f4b;}
html[data-theme="dark"] .hisabi-action-btn{border:1px solid rgba(23,45,77,.08);background:#ffffff;color:#314562;box-shadow:none;}
html[data-theme="dark"] .hisabi-table-labels{color:#8d9ab0;border-bottom:1px solid rgba(23,45,77,.08);}
html[data-theme="dark"] .hisabi-table-row{color:#5f708a;border-bottom:1px solid rgba(23,45,77,.06);}
html[data-theme="dark"] .hisabi-table-row .type{color:#24364f;}
html[data-theme="dark"] .hisabi-table-row .amount.positive{color:#21b861;}
html[data-theme="dark"] .hisabi-table-row .amount.danger{color:#ee5d71;}
html[data-theme="dark"] .hisabi-tag.positive{background:rgba(35,179,96,.12);color:#1ea95a;}
html[data-theme="dark"] .hisabi-tag.warning{background:rgba(233,170,64,.14);color:#d68f1f;}
html[data-theme="dark"] .hisabi-view-all{color:#2aae67;}
html[data-theme="light"] .hisabi-scene{background:
  radial-gradient(circle at 20% 100%, rgba(255,184,0,.08) 0, transparent 26%),
  linear-gradient(180deg,#122039 0%,#0f1930 100%);
  border:1px solid rgba(117,147,193,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 20px 44px rgba(0,0,0,.28);
}
html[data-theme="light"] .hisabi-scene-top{background:rgba(14,26,47,.72);border-bottom:1px solid rgba(117,147,193,.12);}
html[data-theme="light"] .hisabi-brand-mark{background:#16314f;color:#f7bd2f;}
html[data-theme="light"] .hisabi-top-pill,
html[data-theme="light"] .hisabi-top-avatar{border:1px solid rgba(117,147,193,.16);background:#172742;}
html[data-theme="light"] .hisabi-top-avatar{background:#123742;color:#f6c44f;}
html[data-theme="light"] .hisabi-sidebar{background:#122039;border-right:1px solid rgba(117,147,193,.10);}
html[data-theme="light"] .hisabi-side-dot{border:1px solid rgba(131,160,203,.24);background:rgba(255,255,255,.03);}
html[data-theme="light"] .hisabi-side-dot.active{background:rgba(250,191,53,.12);border-color:rgba(250,191,53,.38);box-shadow:0 0 0 3px rgba(250,191,53,.08);}
html[data-theme="light"] .hisabi-main-title{color:#f2f7ff;}
html[data-theme="light"] .hisabi-live-badge{background:rgba(250,176,34,.16);color:#f8b83d;}
html[data-theme="light"] .hisabi-control{border:1px solid rgba(117,147,193,.16);background:#14253f;color:#b6c3d9;}
html[data-theme="light"] .hisabi-kpi-card,
html[data-theme="light"] .hisabi-profile-card,
html[data-theme="light"] .hisabi-actions-card,
html[data-theme="light"] .hisabi-table-card{background:linear-gradient(180deg,rgba(25,42,69,.94) 0%,rgba(17,29,50,.98) 100%);border:1px solid rgba(88,118,158,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.02);}
html[data-theme="light"] .hisabi-kpi-card.highlight{border-color:rgba(31,180,72,.65);box-shadow:inset 0 0 0 1px rgba(31,180,72,.15),0 0 0 1px rgba(31,180,72,.05);}
html[data-theme="light"] .hisabi-kpi-label{color:#8fa2c0;}
html[data-theme="light"] .hisabi-kpi-value{color:#f4f8ff;}
html[data-theme="light"] .hisabi-kpi-meta.positive{color:#1bd167;}
html[data-theme="light"] .hisabi-kpi-meta.healthy{color:#49db7b;}
html[data-theme="light"] .hisabi-kpi-meta.neutral{color:#8eb5e3;}
html[data-theme="light"] .hisabi-profile-card{background:linear-gradient(180deg,rgba(25,42,69,.94) 0%,rgba(17,29,50,.98) 100%);border-color:rgba(88,118,158,.24);}
html[data-theme="light"] .hisabi-profile-card::after{background:radial-gradient(circle,rgba(255,180,54,.14) 0%,transparent 70%);}
html[data-theme="light"] .hisabi-profile-title{color:#fff8ef;}
html[data-theme="light"] .hisabi-profile-line{background:#f0aa2e;}
html[data-theme="light"] .hisabi-profile-email{color:#c3cfde;}
html[data-theme="light"] .hisabi-profile-edit{color:#8797ae;}
html[data-theme="light"] .hisabi-actions-title,
html[data-theme="light"] .hisabi-table-head{color:#f4f7ff;}
html[data-theme="light"] .hisabi-action-btn{border:1px solid rgba(99,127,169,.22);background:#13243d;color:#e9f1ff;}
html[data-theme="light"] .hisabi-table-labels{color:#71839d;border-bottom:1px solid rgba(99,127,169,.18);}
html[data-theme="light"] .hisabi-table-row{color:#dce4f1;border-bottom:1px solid rgba(99,127,169,.10);}
html[data-theme="light"] .hisabi-table-row .type{color:#f3f7ff;}
html[data-theme="light"] .hisabi-table-row .amount.positive{color:#29d86f;}
html[data-theme="light"] .hisabi-table-row .amount.danger{color:#ff6e7f;}
html[data-theme="light"] .hisabi-tag.positive{background:rgba(35,179,96,.18);color:#4ae184;}
html[data-theme="light"] .hisabi-tag.warning{background:rgba(216,133,42,.16);color:#f7b24f;}
html[data-theme="light"] .hisabi-view-all{color:#f2a62f;}
[data-theme="light"] .card-right{background:
  radial-gradient(circle at 16% 18%,rgba(26,140,100,.12) 0%,transparent 24%),
  linear-gradient(145deg,#dce7e1 0%,#d6e1db 58%,#ced9d3 100%);
}
[data-theme="dark"] .card-right#hisabi-right{background:
  radial-gradient(circle at 18% 24%, rgba(45,180,132,.18) 0%, transparent 28%),
  radial-gradient(circle at 82% 74%, rgba(45,180,132,.12) 0%, transparent 24%),
  linear-gradient(145deg,#0f1f19 0%, #0b1612 58%, #08110d 100%);
}
[data-theme="light"] .card-right#hisabi-right{background:
  radial-gradient(circle at 20% 24%, rgba(233,171,54,.18) 0%, transparent 28%),
  radial-gradient(circle at 82% 74%, rgba(233,171,54,.12) 0%, transparent 24%),
  linear-gradient(145deg,#3a2a14 0%, #21170d 58%, #17100a 100%);
}
[data-theme="light"] .card-right::before{background:
  linear-gradient(180deg,rgba(255,255,255,.28) 0%,transparent 30%),
  linear-gradient(0deg,rgba(13,31,24,.10) 0%,transparent 24%);
}
[data-theme="light"] .card-right-img::before{background:rgba(243,246,244,.72);border-color:rgba(13,31,24,.10);color:#0d1f18;box-shadow:0 12px 24px rgba(13,31,24,.10);}

.card-right-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;}
.ph-icon{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--teal-border);display:flex;align-items:center;justify-content:center;}
.ph-icon svg{width:20px;height:20px;stroke:var(--teal);fill:none;stroke-width:1.5;}
.ph-text{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);}
.wip-badge{position:absolute;top:20px;left:20px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;background:var(--teal-soft);border:1px solid var(--teal-border);color:var(--teal);padding:5px 14px;border-radius:100px;z-index:2;}

/* ══ FOLD 3 — TESTIMONIAL ══ */
#fold-testimonial{position:relative;z-index:10;padding:120px 64px 116px;overflow:visible;}
.testimonial-row{display:grid;grid-template-columns:1fr 360px;gap:80px;max-width:1100px;margin:0 auto;align-items:center;}
.testimonial-head{text-align:left;}
.testimonial-title{font-family:'Clash Display',sans-serif;font-size:clamp(36px,4.5vw,64px);font-weight:500;line-height:1.05;letter-spacing:0;color:var(--text-primary);}
.testimonial-score-card{position:relative;justify-self:end;width:100%;border:1px solid var(--border-mid);background:color-mix(in srgb,var(--bg2) 88%, transparent);box-shadow:0 28px 70px rgba(0,0,0,.18);backdrop-filter:blur(14px);border-radius:28px;padding:52px 36px 42px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:320px;overflow:visible;}
.testimonial-score{font-family:'Clash Display',sans-serif;font-size:clamp(76px,8vw,118px);font-weight:500;line-height:.8;color:var(--text-primary);margin-bottom:26px;}
.testimonial-score-label{font-size:15px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:28px;}
.testimonial-avatars{display:flex;justify-content:center;align-items:center;margin-bottom:28px;}
.testimonial-avatar-trigger{position:relative;display:block;width:48px;height:48px;margin-left:-12px;}
.testimonial-avatar-trigger:first-child{margin-left:0;}
.testimonial-avatar-trigger > img{width:48px;height:48px;border-radius:50%;border:2px solid var(--bg2);box-shadow:0 10px 22px rgba(0,0,0,.22);object-fit:cover;display:block;transition:transform .18s ease,border-color .18s ease;}
.testimonial-avatar-trigger:hover > img{transform:translateY(-2px) scale(1.04);border-color:var(--teal-border);}
.testimonial-score-copy{max-width:250px;font-size:16px;line-height:1.7;color:var(--text-muted);}
.testimonial-popup{position:absolute;right:calc(100% + 32px);top:50%;width:560px;min-height:292px;padding:42px 42px 34px;border-radius:28px;border:1px solid var(--border-mid);background:color-mix(in srgb,var(--bg2) 92%, transparent);box-shadow:0 30px 80px rgba(0,0,0,.28);backdrop-filter:blur(16px);transform:translateY(-50%) translateX(16px) scale(.97);opacity:0;pointer-events:none;transition:opacity .24s ease,transform .3s cubic-bezier(.16,1,.3,1);text-align:left;z-index:4;}
.testimonial-popup::before{content:'';position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(0deg,var(--teal-soft),transparent);border-radius:0 0 28px 28px;pointer-events:none;}
.testimonial-avatar-trigger:hover .testimonial-popup{opacity:1;transform:translateY(-50%) translateX(0) scale(1);}
.testimonial-popup-client{position:relative;z-index:1;display:flex;align-items:center;gap:18px;margin-bottom:28px;}
.testimonial-popup-client img{width:64px;height:64px;border-radius:50%;object-fit:cover;border:1px solid var(--teal-border);box-shadow:0 14px 34px rgba(0,0,0,.24);}
.testimonial-popup-client strong{display:block;font-size:18px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--text-primary);margin-bottom:5px;}
.testimonial-popup-client small{font-size:13px;color:var(--text-muted);}
.testimonial-mark{position:absolute;top:46px;right:38px;width:82px;height:60px;fill:none;stroke:var(--border-mid);stroke-width:1.4;opacity:.8;}
.testimonial-popup-copy{position:relative;z-index:1;display:block;font-size:21px;line-height:1.7;color:var(--text-muted);}
.testimonial-popup-meta{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:8px;margin-top:28px;}
.testimonial-popup-meta small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);border:1px solid var(--teal-border);background:var(--teal-soft);padding:7px 12px;border-radius:999px;}
.testimonial-quote-card,.testimonial-client,.testimonial-copy,.testimonial-meta{display:none;}

/* Process */
#fold-process{position:relative;z-index:10;padding:116px 64px 112px;background:linear-gradient(180deg,transparent 0%,color-mix(in srgb,var(--bg2) 42%, transparent) 100%);}
.process-inner{max-width:1180px;margin:0 auto;}
.process-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,430px);gap:48px;align-items:end;margin-bottom:54px;padding-bottom:28px;border-bottom:1px solid var(--border);}
.process-intro{font-size:15px;line-height:1.8;color:var(--text-muted);}
.process-track{position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;}
.process-track::before{content:'';position:absolute;left:7%;right:7%;top:38px;height:1px;background:linear-gradient(90deg,transparent,var(--teal-border),var(--border-mid),transparent);pointer-events:none;}
.process-step{position:relative;min-height:260px;padding:68px 16px 22px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--card-bg) 72%, transparent);transition:border-color .25s,background .25s,transform .25s;}
.process-step:hover{border-color:var(--teal-border);background:color-mix(in srgb,var(--bg3) 86%, transparent);transform:translateY(-3px);}
.process-number{position:absolute;top:18px;left:16px;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--teal-border);background:var(--teal-soft);color:var(--teal);font-size:10px;font-weight:700;letter-spacing:.12em;}
.process-step h3{font-family:'Clash Display',sans-serif;font-size:20px;font-weight:500;line-height:1.05;letter-spacing:0;color:var(--text-primary);margin-bottom:14px;}
.process-step p{font-size:12px;line-height:1.7;color:var(--text-muted);}

/* caption */
.card-right-caption{position:absolute;bottom:0;left:0;right:0;padding:24px 28px;background:linear-gradient(to top,rgba(0,0,0,0.7) 0%,transparent 100%);display:flex;justify-content:space-between;align-items:flex-end;transition:opacity .45s;}
.card-right-caption.hidden{opacity:0;}
.caption-name{font-size:15px;font-weight:500;color:#eef2ef;line-height:1.2;}
.caption-sub{font-size:11px;color:rgba(238,242,239,0.5);margin-top:3px;letter-spacing:.03em;}

/* ══ FOLD 3 — FOOTER ══ */
#fold-footer{position:relative;z-index:10;background:var(--footer-bg);padding:100px 64px 52px;transition:background .4s;}
.footer-inner{max-width:960px;margin:0 auto;}
.footer-headline{font-family:'Clash Display',sans-serif;font-size:clamp(36px,6vw,82px);font-weight:500;line-height:1.06;letter-spacing:-.025em;color:var(--text-primary);margin-bottom:48px;transition:color .4s;}
.footer-headline em{font-style:italic;color:var(--teal);}
.footer-cta-row{display:flex;align-items:center;gap:14px;margin-bottom:80px;flex-wrap:wrap;}
.footer-btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--text-primary);color:var(--bg);padding:14px 28px;border-radius:100px;font-size:13px;font-weight:600;letter-spacing:.04em;text-decoration:none;cursor:none;transition:background .25s,color .25s,transform .15s;}
.footer-btn-primary:hover{background:var(--teal);color:#fff;transform:translateY(-1px);}
.footer-btn-linkedin{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--text-primary);color:var(--bg);border-radius:50%;text-decoration:none;cursor:none;transition:background .25s,transform .15s;flex-shrink:0;}
.footer-btn-linkedin:hover{background:var(--teal);transform:translateY(-1px);}
.footer-btn-linkedin svg{width:18px;height:18px;fill:currentColor;}
.footer-rule{border:none;border-top:1px solid var(--border);margin-bottom:28px;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;}
.footer-copy{font-size:12px;color:var(--text-dim);letter-spacing:.03em;}
.footer-right-links{display:flex;gap:24px;}
.footer-right-links a{font-size:12px;color:var(--text-dim);text-decoration:none;letter-spacing:.03em;transition:color .2s;cursor:none;}
.footer-right-links a:hover{color:var(--teal);}

/* Project intake */
.onboarding-modal{position:fixed;inset:0;z-index:9000;display:grid;place-items:stretch;padding:0;opacity:0;pointer-events:none;transition:opacity .28s ease;}
.onboarding-modal.open{opacity:1;pointer-events:auto;}
.onboarding-backdrop{position:absolute;inset:0;background:rgba(3,7,6,.9);backdrop-filter:blur(18px);}
.onboarding-shell{position:relative;width:100%;height:100vh;min-height:100vh;overflow:hidden;border:0;border-radius:0;background:radial-gradient(circle at 85% 12%,rgba(45,180,132,.16),transparent 34%),radial-gradient(circle at 12% 88%,rgba(255,255,255,.08),transparent 28%),linear-gradient(145deg,rgba(12,20,16,.99),rgba(7,12,10,.98) 58%,rgba(13,28,23,.99));box-shadow:none;transform:translateY(16px);transition:transform .34s cubic-bezier(.16,1,.3,1);}
.onboarding-modal.open .onboarding-shell{transform:translateY(0);}
.onboarding-shell::before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.08),transparent 28%,rgba(45,180,132,.08) 74%,transparent);opacity:.7;pointer-events:none;}
.onboarding-glow{position:absolute;border-radius:999px;filter:blur(12px);pointer-events:none;}
.onboarding-glow-one{width:360px;height:360px;right:-150px;top:-130px;background:radial-gradient(circle,rgba(45,180,132,.24),transparent 68%);}
.onboarding-glow-two{width:280px;height:280px;left:-130px;bottom:-130px;background:radial-gradient(circle,rgba(255,255,255,.09),transparent 68%);}
.onboarding-close{position:absolute;right:22px;top:22px;z-index:3;width:42px;height:42px;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:rgba(255,255,255,.05);color:#eef2ef;display:grid;place-items:center;cursor:none;transition:background .2s,border-color .2s,transform .2s;}
.onboarding-close:hover{background:rgba(45,180,132,.14);border-color:rgba(45,180,132,.34);transform:translateY(-1px);}
.onboarding-close svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.8;fill:none;}
.onboarding-topbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:30px max(30px,6vw) 22px;}
.onboarding-brand{display:inline-flex;align-items:center;gap:10px;color:rgba(238,242,239,.76);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;}
.onboarding-brand-mark{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:rgba(45,180,132,.13);border:1px solid rgba(45,180,132,.32);color:var(--teal);font-size:10px;}
.onboarding-count{font-size:11px;font-weight:700;letter-spacing:.12em;color:rgba(238,242,239,.42);}
.onboarding-progress{position:relative;z-index:2;height:1px;background:rgba(255,255,255,.09);}
.onboarding-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--teal),#c8fff0);box-shadow:0 0 18px rgba(45,180,132,.55);transition:width .34s cubic-bezier(.16,1,.3,1);}
.onboarding-form{position:relative;z-index:2;display:flex;min-height:calc(100vh - 86px);flex-direction:column;padding:72px max(30px,12vw) 46px;}
.onboarding-step-meta{margin-bottom:20px;color:var(--teal);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;}
.onboarding-stage{position:relative;flex:1;display:flex;align-items:center;}
.onboarding-question-wrap{width:100%;animation:onboarding-in .34s cubic-bezier(.16,1,.3,1);}
.onboarding-modal.leaving .onboarding-question-wrap{animation:onboarding-out .2s ease forwards;}
@keyframes onboarding-in{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}
@keyframes onboarding-out{to{opacity:0;transform:translateY(-10px);}}
.onboarding-question-index{display:block;margin-bottom:14px;color:rgba(238,242,239,.34);font-size:13px;font-weight:700;letter-spacing:.12em;}
.onboarding-question{max-width:780px;font-family:'Clash Display',sans-serif;font-size:clamp(34px,5.6vw,72px);font-weight:500;line-height:.98;letter-spacing:0;color:#eef2ef;}
.onboarding-field{margin-top:34px;max-width:680px;}
.onboarding-input,.onboarding-textarea{width:100%;border:0;border-bottom:1px solid rgba(255,255,255,.22);border-radius:0;background:transparent;color:#eef2ef;font-family:'Satoshi',sans-serif;font-size:clamp(22px,3vw,34px);font-weight:400;line-height:1.25;outline:none;padding:10px 0 16px;cursor:none;transition:border-color .2s,box-shadow .2s;}
.onboarding-textarea{min-height:132px;resize:none;}
.onboarding-input::placeholder,.onboarding-textarea::placeholder{color:rgba(238,242,239,.24);}
.onboarding-input:focus,.onboarding-textarea:focus{border-color:var(--teal);box-shadow:0 12px 30px -28px rgba(45,180,132,.9);}
.onboarding-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:32px;max-width:760px;}
.onboarding-option{min-height:64px;border:1px solid rgba(255,255,255,.11);border-radius:16px;background:rgba(255,255,255,.045);color:#eef2ef;text-align:left;padding:16px 18px;font-family:'Satoshi',sans-serif;font-size:15px;font-weight:600;line-height:1.25;cursor:none;transition:background .2s,border-color .2s,transform .2s,box-shadow .2s;}
.onboarding-option:hover,.onboarding-option.selected{background:rgba(45,180,132,.13);border-color:rgba(45,180,132,.45);box-shadow:0 14px 32px rgba(0,0,0,.22);transform:translateY(-1px);}
.onboarding-error{min-height:18px;margin-top:16px;color:#ffb5b5;font-size:12px;letter-spacing:.03em;}
.onboarding-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:32px;}
.onboarding-back,.onboarding-next{height:48px;border-radius:999px;font-family:'Satoshi',sans-serif;font-weight:700;letter-spacing:.05em;cursor:none;transition:background .2s,border-color .2s,color .2s,transform .2s,opacity .2s;}
.onboarding-back{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:rgba(238,242,239,.72);padding:0 22px;}
.onboarding-back:disabled{opacity:0;pointer-events:none;}
.onboarding-next{display:inline-flex;align-items:center;gap:10px;border:0;background:#eef2ef;color:#080e0c;padding:0 22px;}
.onboarding-next:hover,.onboarding-back:hover{transform:translateY(-1px);}
.onboarding-next:hover{background:var(--teal);color:#fff;}
.onboarding-next svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.9;fill:none;}
.onboarding-thanks{max-width:720px;}
.onboarding-thanks .onboarding-question{margin-bottom:22px;}
.onboarding-thanks p{max-width:560px;color:rgba(238,242,239,.62);font-size:17px;line-height:1.7;}
.onboarding-thanks-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px;}
.onboarding-thanks-actions a,.onboarding-thanks-actions button{display:inline-flex;align-items:center;justify-content:center;height:48px;border-radius:999px;padding:0 22px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;cursor:none;}
.onboarding-thanks-actions a{background:var(--teal);color:#fff;}
.onboarding-thanks-actions button{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#eef2ef;}

@media (max-width: 900px){
  .left-toolbar{display:none;}
  .work-header-meta{gap:12px;}
  .cards-nav-btn{width:38px;height:38px;}
  .el-title--tagline{font-size:68px;}
  .el-rocket-icon{width:48px;height:48px;}
  #fold-process{padding:96px 32px 92px;}
  .process-header{grid-template-columns:1fr;gap:22px;align-items:start;}
  .process-track{grid-template-columns:repeat(2,minmax(0,1fr));}
  .process-track::before{display:none;}
  .process-step{min-height:210px;padding:64px 20px 24px;}
  .testimonial-row{grid-template-columns:1fr;max-width:680px;gap:28px;}
  .testimonial-head{max-width:none;text-align:center;}
  .testimonial-score-card{justify-self:center;max-width:360px;}
  .testimonial-popup{display:none;}
}

@media (max-width: 640px){
  #fold-process{padding:84px 20px 82px;}
  .process-header{margin-bottom:30px;padding-bottom:20px;}
  .process-intro{font-size:14px;line-height:1.7;}
  .process-track{grid-template-columns:1fr;gap:10px;}
  .process-step{display:grid;grid-template-columns:48px 1fr;column-gap:14px;min-height:auto;padding:18px 18px 18px 16px;border-radius:12px;}
  .process-number{position:static;width:42px;height:42px;grid-row:1 / span 2;}
  .process-step h3{font-size:20px;margin-bottom:7px;}
  .process-step p{font-size:12px;line-height:1.65;}
  #fold-testimonial{padding:84px 20px 82px;}
  .testimonial-title{font-size:clamp(38px,10vw,64px);line-height:1;}
  .testimonial-score-card{border-radius:22px;padding:38px 22px 34px;min-height:auto;}
  .testimonial-score{font-size:76px;margin-bottom:18px;}
  .testimonial-score-label{font-size:12px;margin-bottom:22px;}
  .testimonial-score-copy{font-size:14px;}
  #fold-work{padding:88px 20px 72px;}
  .work-header{display:block;margin-bottom:32px;padding-bottom:20px;}
  .work-header-meta{display:block;}
  .cards-nav{display:none;}
  .section-count{display:block;margin-top:14px;padding-bottom:0;}
  .cards-stack{gap:16px;margin:0 -20px;width:auto;max-width:none;padding:0 20px;scroll-padding-left:20px;scroll-padding-inline:20px;}
  .card{grid-template-columns:1fr;flex:0 0 calc(100vw - 40px);width:calc(100vw - 40px);min-height:auto;}
  .card-right{order:-1;min-height:260px;}
  .card-left{border-right:none;border-top:1px solid var(--border);padding:24px 20px 22px;}
  .card-project-name{font-size:clamp(24px,8vw,32px);}
  .card-desc{font-size:12px;line-height:1.7;margin-bottom:20px;}
  .subcases{gap:8px;}
  .subcase{padding:12px 14px;}
  .card-tags{margin-top:18px;}
  .card-right-caption{padding:18px 20px;}
  .hisabi-scene{inset:12px;}
  .hisabi-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .hisabi-mid-grid{grid-template-columns:1fr;}
  .hisabi-table-labels,.hisabi-table-row{grid-template-columns:1.8fr .9fr .9fr 1fr;gap:8px;}
  .hisabi-profile-card{min-height:92px;padding:14px 16px;}
  .hisabi-profile-title{font-size:16px;}
  .hisabi-main{padding:12px;gap:10px;}
  .hisabi-actions-title,.hisabi-table-head{font-size:12px;}
  .hisabi-main-title{font-size:12px;}
  .hisabi-control{padding:6px 8px;font-size:9px;}
  .hisabi-sidebar{gap:8px;}
  .hisabi-side-dot:nth-child(n+7){display:none;}
  .el-title{white-space:normal;text-align:center;}
  .el-title--tagline{font-size:40px;line-height:1.08;white-space:nowrap;}
  .el-rocket-icon{width:34px;height:34px;}
  .el-title br{display:block;}
  .hero-eyebrow{top:6vh;font-size:10px;padding:6px 14px;}
  .hero-cta-row{bottom:84px;flex-direction:column;gap:8px;}
  .hero-btn-primary,.hero-btn-secondary{font-size:12px;padding:12px 22px;width:220px;justify-content:center;}
  .hero-work-preview{display:none;}
  .onboarding-modal{padding:0;}
  .onboarding-shell{height:100vh;max-height:100vh;min-height:100vh;overflow-y:auto;border-radius:0;}
  .onboarding-topbar{padding:22px 72px 16px 22px;}
  .onboarding-form{min-height:calc(100vh - 82px);padding:48px 22px 28px;}
  .onboarding-stage{align-items:flex-start;}
  .onboarding-question{font-size:clamp(36px,11vw,56px);line-height:1.02;}
  .onboarding-options{grid-template-columns:1fr;gap:10px;}
  .onboarding-option{min-height:58px;}
  .onboarding-actions{padding-top:24px;}
}

@media (max-width: 380px){
  .el-title--tagline{font-size:34px;}
  .el-rocket-icon{width:30px;height:30px;}
}

/* orbs */
.orb{position:fixed;pointer-events:none;z-index:1;border-radius:50%;}
.orb1{top:-80px;right:-60px;width:400px;height:400px;background:radial-gradient(circle,rgba(45,180,132,.08) 0%,transparent 70%);}
.orb2{top:60%;left:5%;width:300px;height:300px;background:radial-gradient(circle,rgba(45,180,132,.05) 0%,transparent 70%);}
[data-theme="light"] .orb1{background:radial-gradient(circle,rgba(26,140,100,.06) 0%,transparent 70%);}
[data-theme="light"] .orb2{background:radial-gradient(circle,rgba(26,140,100,.04) 0%,transparent 70%);}

/* ── AI CHAT WIDGET ─────────────────────────────────────────────────────── */
#chat-widget{position:fixed;left:calc(100vw - 80px);top:calc(100vh - 80px);z-index:8000;width:52px;height:52px;}
#chat-toggle{position:relative;width:52px;height:52px;border-radius:50%;background:var(--teal);border:none;cursor:none;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(45,180,132,0.45),0 0 0 0 rgba(45,180,132,0.25);transition:transform .2s,box-shadow .2s;flex-shrink:0;touch-action:none;user-select:none;-webkit-user-select:none;}
#chat-toggle:hover{transform:scale(1.07);box-shadow:0 6px 28px rgba(45,180,132,0.55),0 0 0 7px rgba(45,180,132,0.11);}
.chat-icon,.chat-close-icon{position:absolute;width:22px;height:22px;color:#fff;transition:opacity .22s,transform .22s;}
.chat-close-icon{opacity:0;transform:rotate(-90deg) scale(.7);}
#chat-widget.open .chat-icon{opacity:0;transform:rotate(90deg) scale(.7);}
#chat-widget.open .chat-close-icon{opacity:1;transform:rotate(0) scale(1);}
.chat-badge{position:absolute;top:-4px;right:-4px;background:var(--bg);color:var(--teal);font-size:8px;font-weight:700;letter-spacing:.06em;padding:2px 5px;border-radius:100px;border:1px solid var(--teal-border);line-height:1.4;}
#chat-widget.dragging #chat-toggle{transform:scale(1.04);box-shadow:0 10px 28px rgba(45,180,132,0.45),0 0 0 8px rgba(45,180,132,0.10);}
#chat-panel{position:absolute;width:340px;max-height:480px;background:var(--bg2);border:1px solid var(--border-mid);border-radius:20px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.26),0 0 0 1px rgba(45,180,132,0.08);opacity:0;pointer-events:none;transition:opacity .28s cubic-bezier(.16,1,.3,1),transform .28s cubic-bezier(.16,1,.3,1);}
#chat-widget[data-x-anchor="right"] #chat-panel{right:0;transform-origin:bottom right;}
#chat-widget[data-x-anchor="left"] #chat-panel{left:0;transform-origin:bottom left;}
#chat-widget[data-y-anchor="above"] #chat-panel{bottom:64px;transform:translateY(14px) scale(.97);}
#chat-widget[data-y-anchor="below"] #chat-panel{top:64px;transform:translateY(-14px) scale(.97);}
#chat-widget.open #chat-panel{opacity:1;transform:translateY(0) scale(1);pointer-events:all;}
#chat-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border);flex-shrink:0;}
.chat-header-left{display:flex;align-items:center;gap:10px;}
.chat-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--teal) 0%,rgba(45,180,132,.45) 100%);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0;letter-spacing:-.01em;}
.chat-header-name{font-size:13px;font-weight:600;color:var(--text-primary);letter-spacing:-.01em;}
.chat-header-status{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--text-muted);letter-spacing:.04em;margin-top:2px;}
.chat-dot{width:6px;height:6px;background:var(--teal);border-radius:50%;display:inline-block;animation:chat-pulse 2.2s ease-in-out infinite;flex-shrink:0;}
@keyframes chat-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.chat-panel-close{background:none;border:none;cursor:none;padding:5px;color:var(--text-muted);display:flex;align-items:center;justify-content:center;border-radius:8px;transition:color .18s,background .18s;flex-shrink:0;}
.chat-panel-close:hover{color:var(--text-primary);background:var(--teal-soft);}
.chat-panel-close svg{width:15px;height:15px;}
#chat-messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;scroll-behavior:smooth;min-height:0;}
#chat-messages::-webkit-scrollbar{width:3px;}
#chat-messages::-webkit-scrollbar-track{background:transparent;}
#chat-messages::-webkit-scrollbar-thumb{background:var(--border-mid);border-radius:10px;}
.chat-msg{max-width:86%;animation:chat-in .2s ease;}
@keyframes chat-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.chat-msg p{font-size:13px;line-height:1.55;padding:10px 13px;border-radius:16px;margin:0;font-family:'Satoshi',sans-serif;}
.chat-msg.ai p{background:var(--bg3);border:1px solid var(--border);color:var(--text-primary);border-bottom-left-radius:5px;}
.chat-msg.user{align-self:flex-end;}
.chat-msg.user p{background:var(--teal);color:#fff;border-bottom-right-radius:5px;}
.chat-suggestions{display:flex;flex-direction:column;gap:5px;margin-top:2px;}
.chat-suggestion{background:none;border:1px solid var(--teal-border);color:var(--teal);font-size:12px;font-weight:500;padding:7px 12px;border-radius:100px;cursor:none;text-align:left;transition:background .18s,border-color .18s,transform .15s;font-family:'Satoshi',sans-serif;letter-spacing:.01em;}
.chat-suggestion:hover{background:var(--teal-soft);border-color:var(--teal);transform:translateX(3px);}
.chat-typing{display:flex;align-items:center;gap:5px;padding:12px 14px;background:var(--bg3);border:1px solid var(--border);border-radius:16px;border-bottom-left-radius:5px;width:fit-content;}
.chat-typing span{width:5px;height:5px;background:var(--text-muted);border-radius:50%;animation:typing-dot .9s infinite;flex-shrink:0;}
.chat-typing span:nth-child(2){animation-delay:.18s;}
.chat-typing span:nth-child(3){animation-delay:.36s;}
@keyframes typing-dot{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-4px);opacity:1}}
#chat-input-wrap{display:flex;align-items:center;gap:8px;padding:12px 14px;border-top:1px solid var(--border);flex-shrink:0;}
#chat-input{flex:1;background:var(--bg3);border:1px solid var(--border);border-radius:100px;padding:9px 15px;font-size:13px;font-family:'Satoshi',sans-serif;color:var(--text-primary);outline:none;transition:border-color .18s;cursor:text;min-width:0;}
#chat-input::placeholder{color:var(--text-dim);}
#chat-input:focus{border-color:var(--teal-border);}
#chat-send{width:34px;height:34px;border-radius:50%;background:var(--teal);border:none;cursor:none;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .18s,opacity .18s;}
#chat-send:hover{transform:scale(1.09);}
#chat-send:disabled{opacity:.4;}
#chat-send svg{width:14px;height:14px;}
@media (max-width:640px){#chat-panel{width:min(340px,calc(100vw - 24px));max-height:420px;}}