/* ============================================================
   KONPRANN — base: reset, elements, typography primitives
   Requires tokens.css.
   ============================================================ */

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--color-bg);
  color:var(--color-text);
  font-family:var(--font-text);
  font-size:var(--text-md);
  line-height:var(--leading-loose);
  -webkit-font-smoothing:antialiased;
}

p,ul,ol,h1,h2,h3,h4,figure,blockquote,address,fieldset{margin:0}
ul,ol{padding:0;list-style:none}
address{font-style:normal}
img{max-width:100%;display:block}

a{color:var(--color-accent);text-underline-offset:.18em}
a:hover{color:var(--color-accent-2)}

svg{fill:none;stroke:currentColor;stroke-width:var(--icon-stroke);
    stroke-linecap:round;stroke-linejoin:round}

:focus-visible{outline:3px solid var(--color-accent-3);outline-offset:3px;border-radius:var(--radius-sm)}

.k-sprite{position:absolute;width:0;height:0;overflow:hidden}

.k-sr-only{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;
  clip-path:inset(50%);overflow:hidden;white-space:nowrap;
}

/* ---- headings -------------------------------------------- */

.k-display{
  font-family:var(--font-display);font-weight:var(--weight-black);
  line-height:var(--leading-snug);letter-spacing:var(--tracking-tight);
  text-wrap:balance;
}
.k-display--4{font-size:var(--text-4xl);line-height:.94}
.k-display--3{font-size:var(--text-3xl);line-height:1}
.k-display--2{font-size:var(--text-2xl);line-height:1.02}
.k-display--1{font-size:var(--text-xl);font-weight:var(--weight-heavy);letter-spacing:-.02em}

.k-display em{font-style:normal;color:var(--color-accent)}

/* ---- body text ------------------------------------------- */

.k-lede{font-size:var(--text-lg);line-height:var(--leading-normal);text-wrap:pretty}
.k-body{font-size:var(--text-base);line-height:var(--leading-normal)}
.k-sub{font-size:var(--text-xs);font-style:italic;color:var(--color-text-muted)}
.k-sub--lg{font-size:var(--text-md);font-weight:var(--weight-medium)}

/* ---- labels ---------------------------------------------- */

.k-kicker{
  display:flex;align-items:center;gap:var(--space-2);
  font-family:var(--font-display);font-weight:var(--weight-heavy);
  font-size:var(--text-2xs);letter-spacing:var(--tracking-wider);
  text-transform:uppercase;color:var(--color-accent-text);
}
.k-kicker::before{content:"";width:26px;height:3px;border-radius:2px;background:currentColor}

.k-eyebrow{
  font-family:var(--font-display);font-weight:var(--weight-heavy);
  font-size:12px;letter-spacing:var(--tracking-wide);
  text-transform:uppercase;color:var(--color-text-label);
}
.k-eyebrow--accent{color:var(--color-accent-2);display:flex;align-items:center;gap:var(--space-2)}

/* ---- language switching ---------------------------------- */

html[data-lang="ht"] [lang="en"]{display:none}
html[data-lang="en"] [lang="ht"]{display:none}
