:root {
  /* Makara tokens v0.1 */
  --mk-abyss: #02080F;
  --mk-ink: #050D16;
  --mk-deep: #0B1F2E;
  --mk-line: #1B3446;
  --mk-slate: #8FA3B2;
  --mk-mist: #C9D7E0;
  --mk-pearl: #E8E6F2;
  --mk-cyan: #00E0FF;
  --mk-lime: #C6FF3D;
  --mk-pink: #FF2E93;
  --mk-orange: #FF6A1F;
  --mk-melyseg: var(--mk-cyan);
  --mk-felszin: var(--mk-lime);
  --mk-part: var(--mk-orange);
  --mk-nev: var(--mk-pink);
  --mk-font: Futura, 'Futura PT', 'Jost', 'Century Gothic', sans-serif;
  --mk-display-size: clamp(56px, 9vw, 140px);
  --mk-display-lh: 0.95;
  --mk-display-weight: 600;
  --mk-display-tracking: -0.015em;
  --mk-h1-size: clamp(40px, 5vw, 76px);
  --mk-h1-lh: 1.02;
  --mk-h1-weight: 600;
  --mk-h1-tracking: 0;
  --mk-statement-size: clamp(24px, 2.6vw, 38px);
  --mk-statement-lh: 1.3;
  --mk-statement-weight: 500;
  --mk-statement-tracking: 0;
  --mk-lead-size: clamp(19px, 1.6vw, 23px);
  --mk-lead-lh: 1.6;
  --mk-lead-weight: 400;
  --mk-lead-tracking: 0;
  --mk-body-size: 18px;
  --mk-body-lh: 1.65;
  --mk-body-weight: 300;
  --mk-body-tracking: 0;
  --mk-label-size: 13px;
  --mk-label-lh: 1.2;
  --mk-label-weight: 600;
  --mk-label-tracking: 0.24em;
  --mk-small-size: 12px;
  --mk-small-lh: 1.4;
  --mk-small-weight: 500;
  --mk-small-tracking: 0.12em;
  --mk-max: 1280px;
  --mk-gutter: clamp(20px, 4vw, 48px);
  --mk-section: clamp(128px, 15vw, 240px);
  --mk-block: clamp(72px, 8vw, 120px);
  --mk-stack: 28px;
  --mk-radius: 0;
  --mk-ease: cubic-bezier(.2,.7,.2,1);
  --mk-hover: .4s;
  --mk-reveal: 1.2s;
  --mk-grain: url(grain.png);
}

/* grainy photo surface */
.mk-surface{position:relative;isolation:isolate;overflow:hidden}
.mk-surface>.mk-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:grayscale(1) contrast(1.15)}
.mk-surface>.mk-bg.mk-keep{filter:none}
.mk-surface::before{content:"";position:absolute;inset:0;background:var(--mk-c,var(--mk-ink));opacity:var(--mk-o,.9);z-index:1;pointer-events:none}
.mk-surface::after{content:"";position:absolute;inset:0;background-image:var(--mk-grain);background-size:320px 320px;mix-blend-mode:overlay;opacity:.6;z-index:2;pointer-events:none}
.mk-surface>.mk-content{position:relative;z-index:3}
