/* Un-Chain LP — design tokens & shared styles (Light × Blue theme) */
:root{
  /* base surfaces */
  --bg:#FFFFFF;
  --bg-2:#F4F8FF;
  --bg-3:#EAF2FE;
  /* ink (navy on light) */
  --ink-100:#0B1830;
  --ink-80:rgba(11,24,48,.92);
  --ink-60:rgba(11,24,48,.70);
  --ink-40:rgba(11,24,48,.52);
  --ink-20:rgba(14,30,58,.16);
  --ink-08:rgba(14,30,58,.06);
  --line:rgba(14,30,58,.10);
  /* tinted panels (alternating sections) */
  --paper:#EAF2FE;
  --paper-2:#DBEAFE;
  --paper-ink:#0E1E3A;
  /* accents — blue family (names kept for compatibility) */
  --purple:#2E7DE0;
  --pink:#2BAEE6;
  --cyan:#6FCBFF;
  --grad: linear-gradient(95deg,#1F66D6 0%,#2E97E6 55%,#6FCBFF 100%);
  --grad-tri: linear-gradient(120deg,#6FCBFF 0%,#2E97E6 50%,#1F66D6 100%);
  --r-sm:10px; --r-md:16px; --r-lg:22px; --r-xl:28px;
  --sans:"Inter","Zen Kaku Gothic New","BIZ UDPGothic","Noto Sans JP",system-ui,sans-serif;
  --display:"Space Grotesk","Zen Kaku Gothic New","Noto Sans JP",system-ui,sans-serif;
  --jp:"Zen Kaku Gothic New","BIZ UDPGothic","Noto Sans JP",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--sans);
  background:var(--bg);
  color:var(--ink-80);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}

.wrap{max-width:1280px;margin:0 auto;padding:0 56px;position:relative}

/* Common */
.eyebrow{
  font-family:var(--mono);
  font-size:11px;letter-spacing:.22em;color:var(--ink-60);
  text-transform:uppercase;
}
.section-num{
  font-family:var(--display);font-weight:500;
  color:var(--ink-40);font-size:13px;letter-spacing:.18em;
}
.h-display{
  font-family:var(--jp);font-weight:800;
  color:var(--ink-100);
  font-size:clamp(38px,4vw,64px);
  line-height:1.18;letter-spacing:-.01em;
}
.h-section{
  font-family:var(--jp);font-weight:800;
  color:var(--ink-100);
  font-size:clamp(34px,3.2vw,52px);
  line-height:1.22;letter-spacing:-.01em;
}
.h-section.light{color:var(--paper-ink)}
.lead{font-size:15px;line-height:1.85;color:var(--ink-60)}
.lead.light{color:#3f5170}

.grad-text{
  background:var(--grad);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.grad-text-tri{
  background:var(--grad-tri);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:14px;
  padding:18px 26px 18px 30px;border-radius:999px;
  font-family:var(--jp);font-weight:700;font-size:15px;
  letter-spacing:.02em;
  transition:transform .2s ease, filter .2s ease;
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.04)}
.btn-primary{
  background:var(--grad);color:#fff;
  box-shadow:0 16px 38px -12px rgba(31,102,214,.5), 0 0 0 1px rgba(255,255,255,.05) inset;
}
.btn-primary .arrow{
  width:32px;height:32px;border-radius:999px;background:#fff;color:#1F66D6;
  display:grid;place-items:center;font-size:14px;
}
.btn-ghost{
  background:transparent;color:var(--ink-100);
  border:1px solid var(--ink-20);padding:17px 28px;
}
.btn-ghost:hover{border-color:var(--ink-40)}
.btn-light{
  background:#fff;color:var(--paper-ink);
  box-shadow:0 14px 30px -12px rgba(20,50,110,.2);
  border:1px solid #DCEAFE;
}

/* Card */
.card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:0 24px 60px -34px rgba(20,50,110,.2);
}
.card.light{background:#fff;border:1px solid #DCEAFE;box-shadow:0 24px 60px -30px rgba(20,50,110,.18)}

/* Decorative blob layer */
.blob{position:absolute;pointer-events:none;user-select:none;z-index:0;opacity:.5}
.glow{filter:blur(46px);opacity:.4}
.sparkle{position:absolute;pointer-events:none;width:22px;opacity:.7}

.section{position:relative;z-index:1}
.section-light{background:var(--paper);color:var(--paper-ink)}
.section-light .lead{color:#3f5170}

/* Floating animation */
@keyframes float-y{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes float-y-lg{0%,100%{transform:translateY(0)}50%{transform:translateY(-26px)}}
@keyframes spin-slow{to{transform:rotate(360deg)}}
@keyframes pulse-soft{0%,100%{opacity:.6}50%{opacity:1}}
.float{animation:float-y 7s ease-in-out infinite}
.float-lg{animation:float-y-lg 9s ease-in-out infinite}
.pulse-soft{animation:pulse-soft 4s ease-in-out infinite}

/* Utility */
.row{display:flex}
.center{align-items:center;justify-content:center}
.between{justify-content:space-between}
.gap-12{gap:12px}.gap-16{gap:16px}.gap-24{gap:24px}.gap-32{gap:32px}
.col{display:flex;flex-direction:column}
.grid{display:grid}
.no-select{user-select:none}

/* Reveal-on-scroll */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .9s ease, transform .9s ease}
[data-reveal].in{opacity:1;transform:none}

/* Pretty wrap for JP headings */
.jp{font-family:var(--jp);text-wrap:pretty}