/* WE26 — landing styles. Organic / rounded. Solid colors only. */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,500;1,700;1,900&display=swap');

/* ─── Tokens ───────────────────────────────────────────────────────────── */

:root {
  --paper:  #F1EBDD;
  --paper-2:#E8E1D0;
  --ink:    #0E1116;
  --ink-2:  #1B2027;
  --ink-3:  #2A2F37;
  --line-l: #C9C0A9;
  --red:    #E6332A;
  --red-d:  #B0241D;
  --navy:   #1B2A4E;
  --field:  #1F5F3F;
  --gold:   #E2B441;
  --green:  #2BB371;
  --rose:   #E2647B;
  --muted:  #7A6F58;
  --muted-d:#8E97A5;

  --bg:     var(--ink);
  --fg:     var(--paper);
  --line-c: rgba(241,235,221,.18);
  --accent: var(--red);

  --r-pill: 999px;
  --r-card: 22px;
  --r-tile: 28px;
  --r-btn:  999px;

  --f: "Poppins", system-ui, sans-serif;
}

[data-theme="paper"] {
  --bg: var(--paper);
  --fg: var(--ink);
  --line-c: var(--line-l);
  --accent: var(--red);
}
[data-theme="field"] {
  --bg: var(--field);
  --fg: var(--paper);
  --line-c: rgba(241,235,221,.22);
  --accent: var(--gold);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--f);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }

/* Hide scrollbar */
html { scrollbar-width: none; }
::-webkit-scrollbar { width: 0; height: 0; display: none; }

body::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 9000;
  opacity: .06;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* ─── Entrance · video then glass shatter ──────────────────────────────── */

.we-ev {
  position: fixed; inset: 0;
  z-index: 9500;
  background: #000;
  overflow: hidden;
  cursor: pointer;
}
.we-ev.phase-shatter { background: transparent; pointer-events: none; }

.we-ev-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  background: #000;
}

.we-ev-frozen {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
  animation: ev-frozenFade .7s .55s forwards;
}
@keyframes ev-frozenFade {
  to { opacity: 0; }
}

.we-ev-cracks {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  opacity: 0;
  filter: drop-shadow(0 0 6px rgba(255,255,255,.6));
  animation: ev-cracksIn .55s ease-out forwards;
}
@keyframes ev-cracksIn {
  0%   { opacity: 0; transform: scale(.92); }
  35%  { opacity: 1; transform: scale(1.02); }
  100% { opacity: 0; transform: scale(1.05); }
}

.we-ev-flash {
  position: absolute; inset: 0;
  background: #fff;
  opacity: 0;
  animation: ev-flash .35s ease-out forwards;
}
@keyframes ev-flash {
  0%   { opacity: 0; }
  20%  { opacity: .85; }
  100% { opacity: 0; }
}

.we-ev-shard {
  position: absolute; inset: 0;
  background-color: #1a1a1a;
  background-size: cover;
  background-position: center;
  transform-origin: center;
  opacity: 0;
  will-change: transform, opacity, filter;
  /* Cracked-glass: pieces barely separate then fade to reveal the hero video. */
  animation: ev-shard 3s var(--delay, 0s) cubic-bezier(.2,.55,.3,1) forwards;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.55)) brightness(.9);
}
@keyframes ev-shard {
  0%   { opacity: 0; transform: translate(0,0) scale(1); filter: brightness(1.4) drop-shadow(0 2px 4px rgba(0,0,0,.55)); }
  4%   { opacity: 1; }
  18%  { opacity: 1; transform: translate(calc(var(--tx) * .04), calc(var(--ty) * .04)) scale(1); filter: brightness(.9) drop-shadow(0 2px 4px rgba(0,0,0,.55)); }
  78%  { opacity: 1; transform: translate(calc(var(--tx) * .055), calc(var(--ty) * .055)) scale(1); filter: brightness(.85) drop-shadow(0 2px 4px rgba(0,0,0,.55)); }
  100% { opacity: 0; transform: translate(calc(var(--tx) * .03), calc(var(--ty) * .03)) scale(1.01); filter: brightness(1.2) drop-shadow(0 0 0 rgba(0,0,0,0)); }
}

/* Hero stagger animations are paused under the entrance overlay so they
   only play once the shatter completes and the hero is revealed. */
body.is-entering .we-hero-grid .we-w,
body.is-entering .we-hero-meta,
body.is-entering .we-hero-sub,
body.is-entering .we-hero-cta,
body.is-entering .we-hero-stats,
body.is-entering .we-rail,
body.is-entering .we-mkt,
body.is-entering .we-chip,
body.is-entering .we-hero-cutout {
  animation-play-state: paused !important;
  opacity: 0 !important;
}

/* ─── Entrance · loading screen ────────────────────────────────────────── */

.we-ev-load {
  position: absolute; inset: 0;
  background: #0d2d1f;
  color: #F1EBDD;
  overflow: hidden;
  font-family: "Big Shoulders Display", "Inter", sans-serif;
}
.we-ev-load-bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: contrast(1.05) saturate(.95);
  transform: scale(1.05);
  animation: ev-load-zoom 2.4s ease-out forwards;
}
@keyframes ev-load-zoom { to { transform: scale(1.12); } }
.we-ev-load-tint {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(13,45,31,.55) 0%, rgba(13,45,31,.20) 35%, rgba(13,45,31,.85) 100%),
    radial-gradient(ellipse at 50% 60%, rgba(31,95,63,.30) 0%, rgba(13,45,31,.78) 90%);
  pointer-events: none;
}
.we-ev-load-grain {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 3px);
  mix-blend-mode: overlay;
  pointer-events: none;
}
.we-ev-load-tl,
.we-ev-load-tr {
  position: absolute;
  top: clamp(18px, 4vh, 32px);
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(241,235,221,.85);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  opacity: 0;
  animation: ev-load-fadeIn .6s .3s forwards;
}
.we-ev-load-tl {
  left: clamp(20px, 4vw, 56px);
  font-family: "Big Shoulders Display", sans-serif;
  font-size: 22px; font-weight: 800;
  letter-spacing: -0.01em;
  text-transform: none;
  color: #F1EBDD;
}
.we-ev-load-tl i { font-style: italic; color: #E2B441; margin-left: 2px; }
.we-ev-load-mark-dot {
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #E6332A;
  box-shadow: 0 0 0 4px rgba(230,51,42,.22);
  animation: ev-load-dot 1.4s ease-in-out infinite;
}
.we-ev-load-tr { right: clamp(20px, 4vw, 56px); }
@keyframes ev-load-dot { 50% { box-shadow: 0 0 0 8px rgba(230,51,42,0); } }
@keyframes ev-load-fadeIn { to { opacity: 1; } }

.we-ev-load-mid {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  opacity: 0;
  animation: ev-load-fadeIn .6s .15s forwards;
}
.we-ev-load-ring {
  position: relative;
  width: clamp(140px, 22vmin, 200px);
  aspect-ratio: 1;
}
.we-ev-load-ring svg {
  width: 100%; height: 100%;
  display: block;
  filter: drop-shadow(0 0 18px rgba(226,180,65,.35));
}
.we-ev-load-pct {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: "Big Shoulders Display", sans-serif;
  font-weight: 900;
  font-size: clamp(56px, 9vmin, 84px);
  line-height: 1; letter-spacing: -0.04em;
  color: #F1EBDD; font-feature-settings: "tnum";
}
.we-ev-load-cap {
  text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.we-ev-load-cap span {
  font-size: clamp(20px, 3.4vmin, 28px);
  font-weight: 800; letter-spacing: .02em;
  color: #F1EBDD;
}
.we-ev-load-cap em {
  font-style: normal;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(241,235,221,.65);
}

.we-ev.phase-loading { animation: none; }
.we-ev.phase-playing .we-ev-load { display: none; }

/* ─── Header ───────────────────────────────────────────────────────────── */

.we-header {
  position: fixed; top: 16px; left: 0; right: 0;
  z-index: 100;
  display: flex; justify-content: center;
  pointer-events: none;
}
.we-header-inner {
  pointer-events: auto;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 28px;
  padding: 8px 10px 8px 22px;
  background: rgba(14, 17, 22, 0.7);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(241,235,221,.12);
  border-radius: var(--r-pill);
  max-width: calc(100vw - 32px);
  width: min(1100px, calc(100vw - 32px));
}
[data-theme="paper"] .we-header-inner {
  background: rgba(255, 252, 245, 0.8);
  border-color: rgba(14,17,22,.1);
}

.we-mark {
  display: inline-flex; align-items: center; gap: 10px;
  font-weight: 800;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: var(--paper);
}
[data-theme="paper"] .we-mark { color: var(--ink); }
.we-mark-dot {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 3px rgba(230,51,42,.18);
  flex-shrink: 0;
}
.we-mark-dot-lg { width: 36px; height: 36px; }
.we-mark-name { display: inline-flex; align-items: baseline; }
.we-mark-26 { color: var(--red); }

.we-nav {
  display: flex; gap: 28px;
  font-size: 14px;
  font-weight: 500;
  justify-self: center;
}
.we-nav a {
  position: relative;
  padding: 6px 2px;
  color: var(--paper);
  opacity: .82;
  transition: opacity .15s, color .15s;
}
[data-theme="paper"] .we-nav a { color: var(--ink); }
.we-nav a:hover { opacity: 1; color: var(--accent); }

.we-header-cta {
  display: flex; align-items: center; gap: 14px;
}
.we-conn {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--paper);
  opacity: .8;
  padding: 6px 12px;
  border-radius: var(--r-pill);
  background: rgba(241,235,221,.07);
}
[data-theme="paper"] .we-conn { color: var(--ink); background: rgba(14,17,22,.05); }
.we-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 0 rgba(43,179,113,.5);
  animation: pulse 1.8s infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(43,179,113,.5); }
  50%      { box-shadow: 0 0 0 6px rgba(43,179,113,0); }
}

/* ─── Buttons ──────────────────────────────────────────────────────────── */

.we-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 18px;
  font-family: inherit;
  font-weight: 600;
  font-size: 13.5px;
  border: 1px solid transparent;
  border-radius: var(--r-btn);
  cursor: pointer;
  transition: transform .18s ease, background .18s, color .18s, box-shadow .18s;
  white-space: nowrap;
}
.we-btn-primary {
  background: var(--accent);
  color: #fff;
  box-shadow: 0 6px 0 rgba(176,36,29,.0), 0 0 0 0 rgba(230,51,42,.0);
}
.we-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(230,51,42,.32);
}
.we-btn-ghost {
  background: rgba(241,235,221,.08);
  color: var(--paper);
  border-color: rgba(241,235,221,.18);
}
.we-btn-ghost:hover {
  background: rgba(241,235,221,.14);
  border-color: rgba(241,235,221,.32);
  transform: translateY(-2px);
}
[data-theme="paper"] .we-btn-ghost {
  background: rgba(14,17,22,.04);
  color: var(--ink);
  border-color: rgba(14,17,22,.12);
}
.we-btn-lg {
  padding: 14px 24px; font-size: 15px;
}
.we-btn svg { transition: transform .2s; }
.we-btn:hover svg { transform: translateX(2px); }
.we-btn-ghost:hover svg { transform: scale(1.1); }

/* ─── Hero ─────────────────────────────────────────────────────────────── */

.we-hero {
  position: relative;
  min-height: 100vh;
  padding-top: 96px;
  padding-bottom: 60px;
  overflow: hidden;
  background: var(--ink);
  color: var(--paper);
}
.we-hero-bg {
  position: absolute; inset: 0;
  z-index: 0;
}
.we-hero-video {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.85) contrast(1.05);
  animation: kenBurns 28s ease-in-out infinite alternate;
}
@keyframes kenBurns {
  from { transform: scale(1.0) translate(0, 0); }
  to   { transform: scale(1.06) translate(-1%, -1%); }
}
.we-hero-tint {
  position: absolute; inset: 0;
  background: rgba(14, 17, 22, 0.62);
}
.we-hero-grain {
  position: absolute; inset: 0;
  pointer-events: none;
  opacity: .12;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='1' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  mix-blend-mode: overlay;
}

/* Decorative photo cutouts — soften the rectangles */
.we-hero-cutout {
  position: absolute;
  z-index: 2;
  pointer-events: none;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.45);
}
.we-hero-cutout img { width: 100%; height: 100%; object-fit: cover; display: block; }
.we-hero-cutout-circle {
  width: 240px; height: 240px;
  top: 110px; right: 32px;
  border-radius: 50%;
  border: 6px solid var(--paper);
  transform: rotate(-8deg);
  animation: floatA 9s ease-in-out infinite alternate, popIn .9s 0.4s both cubic-bezier(.2,.7,.2,1);
}
.we-hero-cutout-blob {
  width: 180px; height: 230px;
  top: 30vh; left: 28px;
  border-radius: 60% 40% 55% 45% / 50% 60% 40% 50%;
  border: 5px solid var(--paper);
  transform: rotate(6deg);
  animation: floatB 11s ease-in-out infinite alternate, popIn .9s 0.7s both cubic-bezier(.2,.7,.2,1);
}
@keyframes floatA {
  from { transform: rotate(-8deg) translateY(-6px); }
  to   { transform: rotate(-4deg) translateY(8px); }
}
@keyframes floatB {
  from { transform: rotate(6deg) translateY(0); }
  to   { transform: rotate(2deg) translateY(-14px); }
}
@keyframes popIn {
  from { opacity: 0; transform: scale(.7) rotate(-12deg); }
  to   { opacity: 1; }
}

.we-hero-grid {
  position: relative;
  z-index: 3;
  max-width: 1280px;
  margin: 0 auto;
  padding: 36px 36px 24px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.we-hero-meta {
  display: flex; flex-wrap: wrap; gap: 8px;
  animation: rise .7s 0.05s both ease-out;
}
.we-meta-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 14px;
  border-radius: var(--r-pill);
  background: rgba(241,235,221,.08);
  border: 1px solid rgba(241,235,221,.16);
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: -0.005em;
}
.we-meta-num {
  font-weight: 700;
  color: var(--accent);
  font-feature-settings: "tnum";
}

.we-hero-title {
  font-family: var(--f);
  font-weight: 800;
  font-size: clamp(54px, 9.2vw, 148px);
  line-height: 0.92;
  letter-spacing: -0.035em;
  margin: 0;
  text-wrap: balance;
  max-width: 14ch;
}
.we-line { display: block; }
.we-line-2 { color: var(--paper); }
.we-w {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.4em);
  animation: word 0.7s cubic-bezier(.2,.7,.2,1) forwards;
}
.we-line-1 .we-w:nth-child(1) { animation-delay: 0.10s; }
.we-line-1 .we-w:nth-child(2) { animation-delay: 0.18s; }
.we-line-1 .we-w:nth-child(3) { animation-delay: 0.26s; }
.we-line-2 .we-w:nth-child(1) { animation-delay: 0.36s; }
.we-line-2 .we-w:nth-child(2) { animation-delay: 0.42s; }
.we-line-2 .we-w:nth-child(3) { animation-delay: 0.50s; }
.we-w-stamp {
  font-style: italic;
  font-weight: 900;
  background: var(--accent);
  color: #fff;
  padding: 0 0.18em 0.04em;
  border-radius: 12px;
  display: inline-block;
  transform: rotate(-1.5deg) translateY(-0.04em);
}
@keyframes word {
  to { opacity: 1; transform: translateY(0); }
}
@keyframes rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

.we-hero-sub {
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  max-width: 520px;
  color: rgba(241,235,221,.84);
  margin: 0;
  text-wrap: pretty;
  animation: rise .8s 0.65s both ease-out;
}
.we-hero-sub strong { font-weight: 700; color: var(--paper); }

.we-hero-cta {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  animation: rise .8s 0.78s both ease-out;
}

.we-hero-stats {
  display: flex; gap: 36px; flex-wrap: wrap;
  margin-top: 6px;
  animation: rise .8s 0.92s both ease-out;
}
.we-hstat {
  display: flex; flex-direction: column; gap: 2px;
  position: relative;
  padding-left: 14px;
}
.we-hstat::before {
  content: "";
  position: absolute; left: 0; top: 8px; bottom: 8px;
  width: 3px; border-radius: 2px;
  background: var(--accent);
}
.we-hstat:nth-child(2)::before { background: #4FB3F0; }
.we-hstat:nth-child(3)::before { background: var(--gold); }
.we-hstat-num {
  font-size: 22px; font-weight: 800; letter-spacing: -0.02em;
  font-feature-settings: "tnum";
}
.we-hstat-lbl { font-size: 12px; color: rgba(241,235,221,.65); font-weight: 500; }

/* ─── Floating market cards ────────────────────────────────────────────── */

.we-hero-cards {
  position: relative;
  z-index: 4;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 36px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.we-mkt {
  background: var(--paper);
  color: var(--ink);
  border-radius: var(--r-card);
  overflow: hidden;
  cursor: pointer;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s;
  box-shadow: 0 8px 28px rgba(0,0,0,.28);
  opacity: 0;
  animation: cardIn .9s cubic-bezier(.2,.7,.2,1) forwards;
  animation-delay: calc(0.85s + var(--i) * 0.12s);
  border: 1px solid rgba(0,0,0,.06);
}
.we-mkt:focus { outline: none; }
.we-mkt:hover, .we-mkt:focus-visible {
  transform: translateY(-6px);
  box-shadow: 0 18px 50px rgba(0,0,0,.42);
}
.we-mkt:hover .we-mkt-img,
.we-mkt:focus-visible .we-mkt-img {
  transform: scale(1.04);
}
@keyframes cardIn {
  from { opacity: 0; transform: translateY(28px) scale(.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.we-mkt-img {
  position: relative;
  height: 130px;
  background-size: cover;
  background-position: center;
  transition: transform .5s ease;
}
.we-mkt-tag {
  position: absolute;
  bottom: 10px; left: 10px;
  padding: 5px 11px;
  background: var(--accent);
  color: #fff;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-radius: var(--r-pill);
}
.we-mkt-body { padding: 14px 16px 16px; }
.we-mkt-q {
  font-weight: 700;
  font-size: 18px;
  line-height: 1.18;
  letter-spacing: -0.015em;
  margin: 0 0 12px;
  text-wrap: balance;
}
.we-mkt-bar {
  position: relative;
  height: 30px;
  background: var(--paper-2);
  border-radius: var(--r-pill);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 12px;
  font-size: 11.5px;
  font-weight: 600;
  margin-bottom: 12px;
  overflow: hidden;
  font-feature-settings: "tnum";
}
.we-mkt-bar-fill {
  position: absolute; left: 0; top: 0; bottom: 0;
  background: var(--green);
  z-index: 0;
  transition: width .3s ease;
  border-radius: var(--r-pill);
}
.we-mkt-bar-yes, .we-mkt-bar-no { position: relative; z-index: 1; }
.we-mkt-bar-yes { color: #042414; }
.we-mkt-bar-no  { color: var(--ink); }
.we-mkt-foot {
  display: flex; justify-content: space-between;
  font-size: 11.5px; font-weight: 500;
  color: var(--muted);
  font-feature-settings: "tnum";
}
.we-mkt-foot-k { color: var(--ink-3); font-weight: 600; }

/* ─── Odds rail ────────────────────────────────────────────────────────── */

.we-rail {
  margin-top: 8px;
  animation: rise .8s 1.05s both ease-out;
}
.we-rail-label {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px;
  font-weight: 600;
  color: rgba(241,235,221,.7);
  margin-bottom: 12px;
  letter-spacing: 0;
}
.we-rail-dot {
  width: 7px; height: 7px; background: var(--accent); border-radius: 50%;
  animation: pulse 1.8s infinite;
}
.we-rail-track {
  display: flex; gap: 8px; flex-wrap: wrap;
}
.we-chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  border: 1px solid rgba(241,235,221,.18);
  background: rgba(14,17,22,.45);
  color: var(--paper);
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: all .2s;
  opacity: 0;
  animation: chipIn .5s forwards;
  animation-delay: calc(1.1s + var(--i) * 0.03s);
  font-feature-settings: "tnum";
}
@keyframes chipIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.we-chip:hover, .we-chip.is-hot {
  background: var(--paper);
  color: var(--ink);
  border-color: var(--paper);
  transform: translateY(-2px);
}
.we-chip-name { font-weight: 600; }
.we-chip-price { font-weight: 700; }
.we-chip-mv { font-size: 11px; opacity: .8; padding-left: 8px; border-left: 1px solid rgba(255,255,255,.14); }
.we-chip:hover .we-chip-mv { border-left-color: rgba(0,0,0,.15); }
.we-mv-up   { color: var(--green); }
.we-mv-down { color: var(--rose); }
.we-mv-flat { color: var(--muted-d); }
.we-chip:hover .we-mv-flat { color: var(--muted); }

/* ─── Markets section ──────────────────────────────────────────────────── */

.we-markets {
  background: var(--paper);
  color: var(--ink);
  padding: 110px 36px 80px;
  position: relative;
}
.we-markets-head {
  max-width: 1280px;
  margin: 0 auto 56px;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 56px;
  align-items: end;
}
.we-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
  text-transform: lowercase;
  letter-spacing: 0;
  margin-bottom: 18px;
}
.we-eyebrow-dot {
  width: 8px; height: 8px; background: var(--accent); border-radius: 50%;
}
.we-markets-title {
  font-weight: 800;
  font-size: clamp(40px, 5.6vw, 84px);
  line-height: 0.96;
  letter-spacing: -0.035em;
  margin: 0;
  text-wrap: balance;
}
.we-h-stamp {
  font-style: italic;
  font-weight: 900;
  background: var(--ink);
  color: var(--paper);
  padding: 0.05em 0.2em 0.1em;
  border-radius: 16px;
  display: inline-block;
  transform: rotate(-1deg);
  margin-top: 6px;
}
.we-markets-lede {
  display: flex; flex-direction: column; gap: 22px;
  align-items: flex-start;
}
.we-markets-lede p {
  font-size: 16.5px;
  line-height: 1.55;
  color: var(--ink-2);
  margin: 0;
  text-wrap: pretty;
}
.we-markets-lede strong { color: var(--ink); font-weight: 700; }

.we-tiles {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.we-tile {
  display: flex; flex-direction: column; gap: 10px;
  border-radius: var(--r-tile);
  padding: 8px 8px 10px;
  background: transparent;
  transition: background .25s;
  cursor: pointer;
}
.we-tile:hover { background: var(--paper-2); }
.we-tile-img {
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: 22px;
  overflow: hidden;
  transition: transform .35s ease;
  background: var(--paper-2);
  line-height: 0;
}
.we-tile-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 45%;
}
.we-tile:hover .we-tile-img { transform: translateY(-4px); }
.we-tile-arrow {
  position: absolute; top: 14px; right: 14px;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--paper);
  color: var(--ink);
  display: flex; align-items: center; justify-content: center;
  transition: transform .2s, background .2s;
}
.we-tile:hover .we-tile-arrow {
  background: var(--accent); color: #fff;
  transform: rotate(-25deg) scale(1.05);
}
.we-tile-foot {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 0 6px;
}
.we-tile-title { font-weight: 700; font-size: 17px; letter-spacing: -0.01em; }
.we-tile-meta {
  font-size: 12px; color: var(--muted); font-weight: 500;
  font-feature-settings: "tnum";
}

.we-trust {
  max-width: 1280px;
  margin: 64px auto 0;
  padding: 22px 28px;
  border-radius: var(--r-pill);
  background: var(--paper-2);
  display: flex; align-items: center; gap: 22px;
  flex-wrap: wrap;
}
.we-trust-l { font-weight: 600; color: var(--ink); font-size: 13.5px; }
.we-trust-list {
  list-style: none; padding: 0; margin: 0;
  display: flex; gap: 22px; flex-wrap: wrap;
  font-size: 13px;
  color: var(--ink-2);
}
.we-trust-list li {
  display: inline-flex; align-items: center; gap: 6px;
  font-weight: 500;
}

/* ─── Footer ───────────────────────────────────────────────────────────── */

.we-footer {
  background: var(--ink);
  color: var(--paper);
  padding: 36px 36px 32px;
}
.we-footer-inner {
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 32px; flex-wrap: wrap;
}
.we-footer-mark {
  display: flex; align-items: center; gap: 16px;
}
.we-footer-name {
  display: block;
  font-size: 22px; font-weight: 800;
  letter-spacing: -0.02em;
}
.we-footer-tag {
  display: block;
  font-size: 12px;
  color: rgba(241,235,221,.55);
  font-weight: 500;
  max-width: 460px;
  margin-top: 2px;
}
.we-footer-meta {
  display: flex; align-items: center; gap: 14px;
  font-size: 12.5px;
  color: rgba(241,235,221,.7);
  font-weight: 500;
}
.we-footer-meta a:hover { color: var(--accent); }

/* ─── Responsive ───────────────────────────────────────────────────────── */

@media (max-width: 1100px) {
  .we-nav { display: none; }
  .we-conn { display: none; }
  .we-header-inner { grid-template-columns: auto 1fr; }
  .we-header-cta { justify-self: end; }
  .we-hero-cutout-circle { width: 170px; height: 170px; right: 16px; top: 96px; }
  .we-hero-cutout-blob   { width: 140px; height: 175px; left: 16px; top: 36vh; }
  .we-hero-cards { grid-template-columns: 1fr; gap: 12px; }
  .we-markets-head { grid-template-columns: 1fr; gap: 28px; }
  .we-tiles { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .we-header { top: 10px; }
  .we-header-inner { padding: 6px 8px 6px 16px; gap: 12px; }
  .we-markets { padding: 70px 20px 50px; }
  .we-tiles { grid-template-columns: 1fr; }
  .we-hero-stats { gap: 22px; }
  .we-hero-cutout-circle, .we-hero-cutout-blob { display: none; }
}