:root{
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}

/* ---------- brand logo ---------- */
.brand-logo-img{ height:1.5em; width:auto; display:block; }

/* ---------- eyebrow ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:0.5rem;
  font-size:0.75rem; font-weight:500; text-transform:uppercase;
  letter-spacing:0.22em;
}
.eyebrow::before{
  content:""; width:0.375rem; height:0.375rem; border-radius:var(--radius-pill);
  background:var(--brand); flex:none;
}
.eyebrow.dark{ color:var(--ink-soft); }
.eyebrow.light{ color:rgba(255,255,255,0.7); }
.eyebrow.light::before{ background:var(--brand-light); }

/* ---------- buttons ---------- */
.pill-btn{
  display:inline-flex; align-items:center; gap:0.5rem;
  border-radius:var(--radius-pill); padding:0.875rem 1.75rem;
  font-size:0.875rem; font-weight:500; text-transform:uppercase; letter-spacing:0.06em;
  transition:background-color 200ms ease, color 200ms ease, transform 160ms var(--ease-out);
}
.pill-btn .arrow-icon{ width:1rem; height:1rem; flex:none; transition:none; }
.pill-btn.light{ background:#ffffff; color:var(--brand-deep); }
.pill-btn.light:hover{ background:var(--brand-light); color:#ffffff; }
.pill-btn.solid{ background:var(--ink); color:#ffffff; }
.pill-btn.solid:hover{ background:var(--brand); }
.pill-btn:active{ transform:scale(0.97); }

.lang-switch{
  display:inline-flex; align-items:center; border-radius:var(--radius-pill);
  border:1px solid rgba(255,255,255,0.25); overflow:hidden; font-size:0.7rem; font-weight:500;
  letter-spacing:0.06em;
}
.lang-switch button{ padding:0.4rem 0.6rem; color:rgba(255,255,255,0.6); transition:color 200ms ease, background-color 200ms ease, transform 140ms var(--ease-out); }
.lang-switch button:active{ transform:scale(0.9); }
.lang-switch button[aria-current="true"]{ color:#fff; background:rgba(255,255,255,0.15); }
.lang-switch.dark{ border-color:var(--hairline); }
.lang-switch.dark button{ color:var(--ink-soft); }
.lang-switch.dark button[aria-current="true"]{ color:var(--ink); background:var(--surface); }

.dots{ display:flex; align-items:center; gap:0.5rem; }
.dots button{ padding:0.375rem; display:grid; place-items:center; transition:transform 140ms var(--ease-out); }
.dots button:active{ transform:scale(0.85); }
.dots span{ display:block; height:0.375rem; border-radius:var(--radius-pill); transition:width .3s ease, background-color .3s ease; }
.dots.dark span{ width:0.375rem; background:var(--ghost); }
.dots.dark button[aria-current="true"] span{ width:1.25rem; background:var(--ink); }
.dots.light span{ width:0.375rem; background:rgba(255,255,255,0.4); }
.dots.light button[aria-current="true"] span{ width:1.25rem; background:#fff; }

/* ---------- clip-mask reveal primitives ---------- */
.clip-line, .clip-word{ overflow:hidden; display:block; }
.clip-line{ padding-bottom:0.14em; }
.clip-word{ display:inline-block; padding-bottom:0.12em; }
.clip-line span, .clip-word span{
  display:block; transform:translateY(115%); opacity:0; will-change:transform,opacity;
}
