/* ============================================================
   NOUSOOS 2.0 — Editorial / Brutal Clean
   Warm off-white + black. No gradients, no shadows, no SaaS.
   ============================================================ */

@font-face { font-family:'BasierSquare'; src:url('fonts/BasierSquare-Regular.otf') format('opentype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'BasierSquare'; src:url('fonts/BasierSquare-RegularItalic.otf') format('opentype'); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:'BasierSquare'; src:url('fonts/BasierSquare-Medium.otf') format('opentype'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'BasierSquare'; src:url('fonts/BasierSquare-SemiBold.otf') format('opentype'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'BasierSquare'; src:url('fonts/BasierSquare-Bold.otf') format('opentype'); font-weight:700; font-style:normal; font-display:swap; }

:root {
  --bg:        #F1EEEA;   /* warm off-white (oat) */
  --bg-deep:   #e6e1d9;
  --ink:       #0a0a0a;   /* near black, warm */
  --ink-soft:  #5a544a;   /* warm gray */
  --rule:      #d8d2c4;   /* unified hairline rule */
  --rule-strong: #d8d2c4;
  --inverse:   #0a0a0a;
  --inverse-fg:#F1EEEA;
  --max:       1440px;
  --gutter:    clamp(20px, 4vw, 56px);
}

* , *::before, *::after { box-sizing:border-box; }
html, body { margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  font-family:'BasierSquare','Helvetica Neue',Helvetica,Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
  font-size:16px;
  line-height:1.55;
  letter-spacing:-0.01em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

a { color:inherit; text-decoration:none; }
img, svg { display:block; max-width:100%; }
button { font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }

/* ─── shared ─── */
.shell  { max-width:var(--max); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter); }
.rule   { border:0; border-top:1px solid var(--rule); margin:0; }
.rule-strong { border-top-color:var(--rule-strong); }

.label {
  font-size:11px;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:0.18em;
  color:var(--ink);
}
.label--muted { color:var(--ink-soft); }
.num { font-feature-settings:"tnum","ss01"; }

/* ─── nav ─── */
.nav {
  position:sticky; top:0; z-index:50;
  background:var(--bg);
  border-bottom:1px solid var(--rule);
}
.nav__row {
  display:flex; align-items:center; justify-content:space-between;
  height:64px;
}
.nav__logo {
  display:flex; align-items:center; gap:10px;
  font-weight:600; letter-spacing:-0.04em; font-size:18px;
}
.nav__logo svg { height:13px; width:auto; }
.nav__items {
  display:flex; gap:36px;
  font-size:13px; letter-spacing:0.02em;
}
.nav__items a { position:relative; padding:6px 0; opacity:.7; transition:opacity 200ms var(--ease,cubic-bezier(.16,1,.3,1)); }
.nav__items a:hover { opacity:1; }
.nav__cta {
  font-size:13px; letter-spacing:0.02em;
  display:inline-flex; align-items:center; gap:8px;
}
.nav__cta::after {
  content:""; width:6px; height:6px; background:var(--ink); border-radius:50%;
}
/* ─── NAV (minimal) ─── */
.nav--minimal { border-bottom:1px solid transparent; background:var(--bg); }
.nav--minimal .nav__row { height:64px; }
.nav__menu, .nav__kontakt, .nav__cta-btn {
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; font-weight:500;
  letter-spacing:0.18em; text-transform:uppercase;
  color:var(--ink);
}
.nav__actions { display:flex; align-items:stretch; gap:10px; }
.nav__top {
  background:transparent; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--ink);
  padding:0;
  width:40px; height:40px;
  color:var(--ink);
  opacity:0;
  pointer-events:none;
  transform:translateY(-4px);
  transition:opacity 240ms cubic-bezier(.22,1,.36,1), transform 240ms cubic-bezier(.22,1,.36,1), background 200ms, color 200ms;
}
body.is-scrolled .nav__top {
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
.nav__top:hover { background:var(--ink); color:var(--inverse-fg); }
.nav__top-arr { font-size:16px; line-height:1; }
.nav__links {
  display:flex; gap:28px;
  font-size:13px; font-weight:400; letter-spacing:0.04em; text-transform:lowercase;
}
.nav__links a {
  color:var(--ink); text-decoration:none;
  position:relative; padding:6px 2px;
  transition:opacity 200ms;
}
.nav__links a::after {
  content:""; position:absolute; left:0; right:0; bottom:0;
  height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:left;
  transition:transform 280ms cubic-bezier(.22,1,.36,1);
}
.nav__links a:hover::after { transform:scaleX(1); }
.nav__cta-btn {
  text-decoration:none;
  border:1px solid var(--ink);
  padding:9px 18px;
  border-radius:0;
  transition:background 200ms, color 200ms;
}
.nav__cta-btn:hover { background:var(--ink); color:var(--inverse-fg); }
.nav__cta-btn .cta__arrow { width:14px; height:1px; background:currentColor; position:relative; }
.nav__cta-btn .cta__arrow::after { content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }
.nav__dot { width:7px; height:7px; background:var(--ink); border-radius:50%; display:inline-block; }

/* ─── burger button (mobile only) ─── */
.nav__burger { display:none; }

/* ─── mobile menu — fullscreen editorial takeover ─── */
.nav__mobile { display:none; }

@media (max-width:880px){
  .nav__items { display:none; }
  .nav__links { display:none; }
  .nav__actions { margin-left:auto; }
  .nav__cta-btn { font-size:11px; letter-spacing:0.12em; padding:8px 14px; }

  .nav__burger {
    position:relative;
    width:42px; height:40px;
    display:inline-flex; flex-direction:column; justify-content:center; align-items:center; gap:7px;
    border:1px solid var(--ink);
    background:transparent;
    cursor:pointer;
    color:var(--ink);
    transition:background 240ms cubic-bezier(.22,1,.36,1),
               color 240ms cubic-bezier(.22,1,.36,1),
               border-color 240ms cubic-bezier(.22,1,.36,1);
  }
  .nav__burger-line {
    display:block; width:18px; height:1.5px;
    background:currentColor;
    transition:transform 340ms cubic-bezier(.7,0,.3,1);
  }
  .nav__burger.is-open { background:transparent; }
  .nav__burger.is-open .nav__burger-line:nth-child(1) { transform:translateY(4.25px) rotate(45deg); }
  .nav__burger.is-open .nav__burger-line:nth-child(2) { transform:translateY(-4.25px) rotate(-45deg); }

  /* fullscreen panel */
  .nav__mobile {
    display:block;
    position:fixed; inset:0;
    z-index:55;
    background:var(--inverse);
    color:var(--inverse-fg);
    pointer-events:none;
    clip-path:inset(0 0 100% 0);
    transition:clip-path 560ms cubic-bezier(.76,0,.24,1);
    overflow:hidden;
  }
  .nav__mobile.is-open {
    pointer-events:auto;
    clip-path:inset(0 0 0 0);
  }

  .nav__mobile-inner {
    height:100%;
    box-sizing:border-box;
    padding:96px 24px 32px;
    display:flex; flex-direction:column;
    position:relative;
  }
  .nav__mobile-inner::after {
    content:"";
    position:absolute;
    top:64px; bottom:0; right:0;
    width:1px;
    background:linear-gradient(to bottom, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0) 100%);
    transform-origin:top;
    transform:scaleY(0);
    transition:transform 800ms 280ms cubic-bezier(.22,1,.36,1);
  }
  .nav__mobile.is-open .nav__mobile-inner::after { transform:scaleY(1); }

  .nav__mobile-label {
    display:block;
    font-size:11px; font-weight:500;
    letter-spacing:0.22em; text-transform:uppercase;
    color:#7a746a;
    margin-bottom:28px;
    opacity:0;
    transform:translateY(-6px);
    transition:opacity 420ms 200ms cubic-bezier(.22,1,.36,1),
               transform 420ms 200ms cubic-bezier(.22,1,.36,1);
  }
  .nav__mobile.is-open .nav__mobile-label { opacity:1; transform:translateY(0); }

  .nav__mobile-list {
    display:flex; flex-direction:column;
    border-top:1px solid rgba(255,255,255,0.12);
  }

  .nav__mobile-link {
    position:relative;
    display:grid;
    grid-template-columns:48px 1fr auto;
    column-gap:8px;
    align-items:end;
    padding:24px 0 22px;
    border-bottom:1px solid rgba(255,255,255,0.12);
    color:inherit;
    text-decoration:none;
    opacity:0;
    transform:translateY(28px);
    transition:opacity 620ms cubic-bezier(.22,1,.36,1),
               transform 620ms cubic-bezier(.22,1,.36,1),
               background 240ms ease;
    transition-delay:calc(220ms + var(--i) * 90ms);
  }
  .nav__mobile.is-open .nav__mobile-link {
    opacity:1; transform:translateY(0);
  }
  .nav__mobile-link:active { background:rgba(255,255,255,0.04); }

  .nav__mobile-num {
    font-size:10px; font-weight:500;
    letter-spacing:0.24em;
    color:#7a746a;
    font-feature-settings:"tnum";
    align-self:end;
    padding-bottom:10px;
  }
  .nav__mobile-name {
    font-size:clamp(46px, 13.5vw, 72px);
    font-weight:600;
    letter-spacing:-0.035em;
    line-height:0.92;
    text-transform:lowercase;
  }
  .nav__mobile-arr {
    width:28px; height:1px;
    background:currentColor;
    position:relative;
    align-self:end;
    margin-bottom:18px;
    opacity:0.5;
    transition:width 360ms cubic-bezier(.22,1,.36,1), opacity 240ms;
  }
  .nav__mobile-arr::after {
    content:"";
    position:absolute; right:0; top:-4px;
    width:9px; height:9px;
    border-top:1px solid currentColor;
    border-right:1px solid currentColor;
    transform:rotate(45deg);
  }
  .nav__mobile-link:hover .nav__mobile-arr,
  .nav__mobile-link:focus-visible .nav__mobile-arr {
    width:56px; opacity:1;
  }

  .nav__mobile-foot {
    margin-top:auto;
    padding-top:40px;
    display:flex; flex-direction:column;
    gap:18px;
    opacity:0;
    transform:translateY(14px);
    transition:opacity 480ms 620ms cubic-bezier(.22,1,.36,1),
               transform 480ms 620ms cubic-bezier(.22,1,.36,1);
  }
  .nav__mobile.is-open .nav__mobile-foot { opacity:1; transform:translateY(0); }

  .nav__mobile-mail {
    font-size:clamp(22px, 5.6vw, 28px);
    font-weight:500;
    letter-spacing:-0.02em;
    color:var(--inverse-fg);
    text-decoration:none;
    align-self:flex-start;
    border-bottom:1px solid rgba(255,255,255,0.22);
    padding-bottom:6px;
    transition:border-color 200ms;
  }
  .nav__mobile-mail:hover { border-bottom-color:var(--inverse-fg); }

  .nav__mobile-ingredients {
    font-size:10px;
    letter-spacing:0.34em;
    text-transform:uppercase;
    color:#7a746a;
    font-weight:500;
  }

  /* nav colors invert while menu is open */
  body.menu-open { overflow:hidden; }
  body.menu-open .nav { background:transparent; }
  body.menu-open .nav__burger { color:var(--inverse-fg); border-color:var(--inverse-fg); }
  body.menu-open .nav__cta-btn { color:var(--inverse-fg); border-color:rgba(255,255,255,0.4); }
  body.menu-open .nav__cta-btn:hover { background:var(--inverse-fg); color:var(--ink); border-color:var(--inverse-fg); }
  body.menu-open .nav__top { opacity:0 !important; pointer-events:none !important; }
}

/* svc row — reveal full sentence on hover (smooth, elegant) */
.svc__sol-word { display:inline-block; white-space:nowrap; }
.svc__sol-rest {
  display:inline-block;
  max-width:0;
  overflow:hidden;
  white-space:nowrap;
  transition:max-width 900ms cubic-bezier(.22,1,.36,1);
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
}
.svc__row:hover .svc__sol-rest,
.svc__row:focus-within .svc__sol-rest {
  max-width:60ch;
}
.svc__sol .arr { display:none; }
.hero--big {
  position:relative;
  min-height:100vh;
  background:var(--bg);
  display:flex; flex-direction:column;
  overflow:hidden;
  padding:0;
}

.hero__inner {
  flex:1;
  width:100%;
  max-width:1440px;
  margin:0 auto;
  padding:clamp(56px, 8vh, 120px) clamp(24px, 5vw, 80px) clamp(32px, 5vh, 64px);
  box-sizing:border-box;
  display:grid;
  grid-template-columns: minmax(160px, 1fr) minmax(320px, auto) minmax(160px, 1fr);
  grid-template-rows: auto 1fr;
  grid-template-areas:
    "wordmark wordmark wordmark"
    "pitch    bread    ings";
  column-gap: clamp(16px, 3vw, 56px);
  row-gap: clamp(16px, 3vh, 48px);
}

/* wordmark — top row, full width, pushed down so bread overlaps its bottom 20% */
.hero__wordmark {
  grid-area: wordmark;
  width:100%;
  max-width:min(92vw, 1280px);
  margin:clamp(40px, 9vh, 120px) auto 0;
  display:grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "tagL  ..."
    "logo  logo"
    "...   tagR";
  align-items:start;
  padding:0;
  position:relative;
  z-index:1;
}
.hero__wordmark-tag {
  font-size:36px; font-weight:400; line-height:1;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin:0 0 14px;
  padding-left:0;
  grid-area: tagL;
  justify-self:start;
}
.hero__wordmark-tag--right {
  grid-area: tagR;
  justify-self:end;
  padding-right:0;
  margin:14px 0 0;
}
.hero__wordmark-img {
  grid-area: logo;
  width:100%;
  max-width:min(92vw, 1280px);
  height:auto;
  display:block;
  margin:0 auto;
  transform:none !important;
}

/* bread image — centered, overlaps bottom of wordmark; bigger so it covers part of "nousoos" */
.hero--big .hero__bread {
  grid-area: bread;
  display:block;
  width:100%;
  max-width:clamp(480px, 60vw, 860px);
  height:auto;
  margin: clamp(-420px, -22vw, -200px) auto 0;
  align-self:end;
  justify-self:center;
  position:relative;
  z-index:2;
  pointer-events:none;
  user-select:none;
  transform:translate3d(0, var(--bread-y, 0), 0);
  will-change:transform;
}

/* left pitch column — aligned to bottom of grid row */
.hero__pitch {
  grid-area: pitch;
  align-self:end;
  max-width:300px;
  z-index:3;
}
.hero__pitch-copy {
  font-size:14px; line-height:1.55; color:var(--ink);
  margin:0 0 32px;
  letter-spacing:-0.005em;
}
.hero__pitch-cta {
  display:inline-flex; align-items:center; gap:14px;
  font-size:11px; font-weight:600;
  letter-spacing:0.16em;
  text-transform:uppercase;
  padding-bottom:6px;
  border-bottom:1px solid var(--ink);
}
.hero__pitch-cta .arr { width:22px; height:1px; background:currentColor; position:relative; }
.hero__pitch-cta .arr::after { content:""; position:absolute; right:0; top:-4px; width:9px; height:9px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }

/* right ingredients column — aligned to bottom, scroll button below */
.hero__ingredients {
  grid-area: ings;
  align-self:end;
  justify-self:end;
  display:flex; flex-direction:column; align-items:flex-end; gap:28px;
  z-index:3;
}
.hero__ingredients ul {
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; align-items:flex-end; gap:12px;
  font-size:14px; font-weight:600;
  letter-spacing:0.16em; text-transform:uppercase;
}
.hero__ingredients li.dot { color:var(--ink-soft); font-weight:400; line-height:0.5; }

.hero__scroll {
  width:64px; height:64px; border-radius:50%;
  border:1px solid var(--ink);
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--ink);
  transition:background 200ms, color 200ms, transform 240ms cubic-bezier(.16,1,.3,1);
}
.hero__scroll:hover { background:var(--ink); color:var(--inverse-fg); transform:translateY(2px); }
.hero__scroll-arr { font-size:18px; line-height:1; }

/* 4-step strip pinned at bottom of hero */
.hero__steps {
  position:relative;
  border-top:1px solid var(--rule);
  background:var(--bg);
  z-index:4;
}
.hero__steps-row {
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:0;
  padding-top:24px; padding-bottom:28px;
}
.hero__step {
  position:relative;
  display:flex; flex-direction:column; gap:8px;
  padding:8px 24px 8px 0;
}
.hero__step + .hero__step { padding-left:24px; border-left:1px solid var(--rule); }
.hero__step-num {
  font-size:10px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--ink-soft); font-weight:500;
  font-feature-settings:"tnum";
}
.hero__step-title {
  font-size:14px; font-weight:700; letter-spacing:0.04em;
  text-transform:uppercase; color:var(--ink);
}
.hero__step-sub {
  font-size:11px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--ink-soft); font-weight:500;
}

/* ─── HERO responsive ─── */
@media (max-width: 1024px){
  .hero__inner {
    grid-template-columns: minmax(140px, 1fr) minmax(280px, auto) minmax(140px, 1fr);
    column-gap: clamp(12px, 2vw, 32px);
  }
  .hero--big .hero__bread { max-width: clamp(400px, 60vw, 720px); }
}

@media (max-width: 880px){
  .hero__inner {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
      "wordmark"
      "bread"
      "pitch"
      "ings";
    row-gap: clamp(20px, 3vh, 40px);
    padding-top: clamp(40px, 6vh, 80px);
  }
  .hero__wordmark-tag { font-size: clamp(18px, 5vw, 28px); }
  .hero--big .hero__bread {
    max-width: min(75vw, 520px);
    margin-top: clamp(-90px, -12vw, -30px);
    justify-self: center;
  }
  .hero__pitch { max-width: none; align-self: start; }
  .hero__ingredients {
    align-self: start; justify-self: start;
    flex-direction: row; flex-wrap: wrap; align-items: center; gap: 24px;
  }
  .hero__ingredients ul {
    flex-direction: row; flex-wrap: wrap; align-items: center; gap: 14px;
  }
}

@media (max-width: 520px){
  .hero__steps-row { grid-template-columns:1fr; }
  .hero__step + .hero__step { border-left:0; border-top:1px solid var(--rule); padding:16px 0 0 0; margin-top:8px; }
}
@media (max-width: 880px) and (min-width: 521px){
  .hero__steps-row { grid-template-columns:1fr 1fr; }
  .hero__step:nth-child(3) { border-left:0; }
}

/* ─── CTA pill / box ─── */
.cta {
  display:inline-flex; align-items:center; gap:14px;
  background:var(--ink); color:var(--inverse-fg);
  padding:14px 22px;
  font-size:13px; font-weight:500;
  letter-spacing:0.18em; text-transform:uppercase;
  transition:transform 240ms cubic-bezier(.16,1,.3,1), background 200ms;
}
.cta:hover { transform:translateY(-2px); background:#000; }
.cta__arrow { width:14px; height:1px; background:currentColor; position:relative; }
.cta__arrow::after { content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }

.cta--ghost {
  background:transparent; color:var(--ink);
  border:1px solid var(--ink);
}
.cta--ghost:hover { background:var(--ink); color:var(--inverse-fg); }

/* wide variant — button reaches further toward page center; inner content stays anchored right */
.cta--wide {
  width:min(560px, 64vw);
  padding-left:clamp(24px, 5vw, 80px);
  padding-right:24px;
  justify-content:flex-end;
}
.cta--wide .cta__inner {
  display:inline-flex; align-items:center; gap:14px;
}

/* ─── CLAIM (big typo) ─── */
.claim {
  padding:clamp(80px, 12vw, 200px) 0 clamp(40px, 8vw, 120px);
  border-top:1px solid var(--rule);
}
.claim__kicker {
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:48px;
}
.claim__h {
  font-weight:400;
  font-size: clamp(36px, 5.9vw, 106px);
  line-height:1.15;
  letter-spacing:-0.04em;
  margin:0;
  text-wrap:balance;
  max-width:none;
}
.claim__h .hl {
  display:inline-block;
  background:var(--ink); color:var(--inverse-fg);
  padding:0.04em 0.22em 0.12em;
  margin:0 0.04em;
  transform:translateY(-0.03em);
}
.claim__h em { font-style:italic; font-weight:500; color:var(--ink-soft); }

.claim__lockup {
  margin-top:clamp(40px, 6vw, 88px);
  border-top:1px solid var(--rule);
  padding-top:clamp(28px, 4vw, 56px);
}
.claim__lockup img {
  width:100%; height:auto;
  display:block;
  filter:contrast(1.05);
}

/* ─── 4 steps ─── */
.steps {
  margin-top:clamp(64px, 10vw, 144px);
  padding-bottom:clamp(64px, 10vw, 144px);
  border-bottom:1px solid var(--rule);
}
.steps__head {
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:48px;
  border-bottom:1px solid var(--rule);
  padding-bottom:24px;
}
.steps__grid {
  display:grid;
  grid-template-columns:repeat(4, 1fr);
}
.step {
  padding:32px 28px 0 0;
  border-left:1px solid var(--rule);
  padding-left:24px;
  min-height:240px;
}
.step:first-child { border-left:0; padding-left:0; }
.step__num {
  font-size:13px; letter-spacing:0.18em; font-weight:500;
  color:var(--ink-soft); margin-bottom:36px;
}
.step__title {
  font-size: clamp(28px, 3.6vw, 48px);
  line-height:1.0;
  letter-spacing:-0.03em;
  font-weight:600;
  margin:0 0 16px;
  text-transform:lowercase;
}
.step__copy { font-size:14px; color:var(--ink-soft); line-height:1.5; margin:0; max-width:none; white-space:nowrap; }
.step__map {
  margin-top:36px;
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-soft);
  display:flex; align-items:center; gap:10px;
}
.step__map b { font-weight:600; color:var(--ink); }
@media (max-width:880px){
  .steps__grid { grid-template-columns:repeat(2,1fr); }
  .step:nth-child(3) { border-left:0; padding-left:0; }
}
@media (max-width:520px){
  .steps__grid { grid-template-columns:1fr; }
  .step { border-left:0; padding-left:0; border-top:1px solid var(--rule); padding-top:24px; min-height:0; }
  .step:first-child { border-top:0; padding-top:0; }
}
@media (max-width:760px){
  .steps__grid { display:none; }
  .steps { padding-bottom:0; border-bottom:0; }
  .steps__head { margin-bottom:0; border-bottom:0; padding-bottom:0; }
}

/* ─── SECTION HEADER (heading on top-left, centered lead+sub below) ─── */
.sec {
  padding:clamp(80px, 12vw, 180px) 0;
  border-bottom:1px solid var(--rule);
  position:relative;
}
.sec__head {
  display:grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items:center;
  column-gap:clamp(24px, 4vw, 64px);
  margin-bottom:clamp(48px, 8vw, 120px);
  position:relative;
  background:var(--bg);
  z-index:5;
  padding:clamp(20px, 2vw, 32px) 0;
}
.dopad .sec__head { background:var(--inverse); }
.sec__h {
  display:block;
  font-weight:600;
  font-size: clamp(64px, 10vw, 168px);
  line-height:0.86;
  letter-spacing:-0.05em;
  margin:0;
  text-align:left;
}
.sec__lead {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  gap:14px;
  margin:0;
  max-width:520px;
  justify-self:start;
}
.sec__lead > div {
  font-size: clamp(20px, 1.8vw, 28px);
  line-height:1.2;
  letter-spacing:-0.02em;
  font-weight:500;
  margin:0;
  text-wrap:balance;
}
.sec__lead > small, .sec__lead small {
  font-size:14px; line-height:1.55; color:var(--ink-soft); font-weight:400;
  letter-spacing:0.01em;
  display:block;
  margin:0;
  max-width:48ch;
  text-wrap:pretty;
}
.sec__lead--legacy {
  display:flex; flex-direction:column; gap:24px;
  font-size: clamp(20px, 2vw, 28px);
  line-height:1.18;
  letter-spacing:-0.02em;
  font-weight:500;
  max-width:36ch;
  padding-top:14px;
}
@media (max-width:880px){
  .sec__head { grid-template-columns:1fr; row-gap:24px; }
  .sec__h { font-size: clamp(56px, 18vw, 96px); }
  .sec__lead { max-width:none; }
  .sec__lead > div { font-size: clamp(20px, 5vw, 26px); }
}

/* Shifted variant — legacy, no-op with new block layout */
.sec__head--shift { display:block; }
.sec__head--shift .sec__h    { grid-column: 2 / 3; }
.sec__head--shift .sec__lead { grid-column: 3 / 4; }
@media (max-width:760px){
  .sec__head--shift { grid-template-columns:1fr; }
  .sec__head--shift .sec__h,
  .sec__head--shift .sec__lead { grid-column: 1 / 2; }
}

/* ─── SLUŽBY TABLE ─── */
.svc {
  position:relative;
}
.svc__bg {
  position:absolute; inset:0;
  background-image:url('assets/cierna.svg');
  background-size:1100px auto;
  background-position:right -260px top 30%;
  background-repeat:no-repeat;
  opacity:.04;
  pointer-events:none;
  mix-blend-mode:multiply;
}
.svc__table {
  display:grid;
  grid-template-columns:120px 1fr 1fr;
  border-top:1px solid var(--rule-strong);
  font-size:14px;
}
.svc__row {
  display:contents;
}
.svc__row > div {
  padding:28px 24px;
  border-bottom:1px solid var(--rule);
  display:flex; align-items:center;
  transition:background 200ms;
}
.svc__row:hover > div { background:rgba(0,0,0,0.03); }
.svc__hdr > div {
  font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--ink-soft); padding-top:16px; padding-bottom:16px;
  border-bottom:1px solid var(--rule-strong);
}
.svc__num {
  font-size:11px; color:var(--ink-soft); letter-spacing:0.16em; font-weight:500;
}
.svc__layer {
  font-size: clamp(28px, 3.4vw, 44px);
  line-height:1; font-weight:600; letter-spacing:-0.03em;
  text-transform:lowercase;
}
.svc__sol {
  font-size: clamp(20px, 1.8vw, 24px);
  line-height:1.2; font-weight:400;
  display:flex; align-items:baseline; justify-content:flex-start; gap:0; flex-wrap:nowrap; min-width:0;
  letter-spacing:-0.01em;
}
.svc__sol .arr {
  width:24px; height:1px; background:var(--ink); position:relative; opacity:0;
  transition:opacity 200ms, transform 240ms cubic-bezier(.16,1,.3,1);
  transform:translateX(-6px);
}
.svc__sol .arr::after {
  content:""; position:absolute; right:0; top:-4px; width:9px; height:9px;
  border-top:1px solid var(--ink); border-right:1px solid var(--ink); transform:rotate(45deg);
}
.svc__row:hover .svc__sol .arr { opacity:1; transform:translateX(0); }

.svc__foot {
  display:flex; justify-content:space-between; align-items:flex-end;
  margin-top:64px;
  gap:24px;
}
.svc__foot p {
  font-size: clamp(20px, 2.2vw, 32px);
  line-height:1.15; letter-spacing:-0.025em;
  font-weight:500; max-width:24ch; margin:0;
}
.svc__foot p em { font-style:italic; font-weight:400; color:var(--ink-soft); }

@media (max-width:760px){
  .svc__table { grid-template-columns: 60px 1fr; }
  .svc__hdr > div:nth-child(3) { display:none; }
  .svc__row > div:nth-child(1) { border-bottom:0; }
  .svc__row > div:nth-child(2) { padding-bottom:8px; border-bottom:0; }
  .svc__row > div:nth-child(3) {
    grid-column: 1 / -1;
    border-top:0; padding-top:0; margin-top:-12px; padding-bottom:24px;
    padding-left:84px;
    color:var(--ink-soft);
  }
  .svc__layer { font-size:32px; }
  .svc__sol { font-size:14px; }
  .svc__sol-rest {
    max-width:none;
    color:var(--ink-soft);
    transition:none;
  }
  .svc__foot { flex-direction:column; align-items:flex-start; }
}

/* ─── PROCES (now only CTA wrapper) ─── */
.proc {
  background:var(--bg);
  padding-top:clamp(24px, 3vw, 48px) !important;
  padding-bottom:clamp(48px, 7vw, 120px) !important;
  border-bottom:0 !important;
}
.proc__list {
  display:flex; flex-direction:column;
  border-top:1px solid var(--rule-strong);
}
.proc__row {
  display:grid;
  grid-template-columns: 64px 1fr 2fr;
  align-items:baseline;
  padding:32px 0;
  border-bottom:1px solid var(--rule);
  gap:40px;
}
.proc__num { font-size:11px; letter-spacing:0.18em; color:var(--ink-soft); font-weight:500; }
.proc__step {
  font-size: clamp(32px, 4.2vw, 64px);
  line-height:1; letter-spacing:-0.035em; font-weight:600;
}
.proc__step .dot { color:var(--ink-soft); }
.proc__desc {
  font-size: clamp(16px, 1.4vw, 20px);
  color:var(--ink); line-height:1.4; letter-spacing:-0.005em;
}
@media (max-width:760px){
  .proc__row { grid-template-columns: 40px 1fr; }
  .proc__desc { grid-column: 1 / 3; padding-left:40px; padding-top:8px; }
  .proc__step { font-size:36px; }
}

.proc__cta {
  margin-top:0;
  display:grid;
  grid-template-columns:1fr auto;
  gap:48px;
  align-items:end;
}
.proc__cta p {
  font-size: clamp(28px, 4vw, 56px);
  line-height:1.05;
  letter-spacing:-0.035em;
  font-weight:500;
  max-width:18ch;
  margin:0;
}
.proc__cta p em { font-style:italic; font-weight:400; color:var(--ink-soft); }
.proc__cta .hl {
  display:inline-block;
  background:var(--ink); color:var(--inverse-fg);
  padding:0.04em 0.24em 0.12em;
}
@media (max-width:760px){
  .proc__cta { grid-template-columns:1fr; }
}

/* ─── DOPAD (black section) ─── */
.dopad {
  background:var(--inverse);
  color:var(--inverse-fg);
  border:0;
  position:relative;
  overflow:clip;
}
.dopad__bg {
  position:absolute; inset:0;
  background-image:url('assets/biela.svg');
  background-size:900px auto;
  background-position:right -180px bottom -100px;
  background-repeat:no-repeat;
  opacity:.05;
  pointer-events:none;
}
.dopad .sec__head { color:var(--inverse-fg); }
.dopad .sec__lead small { color:#a8a39a; }
.dopad .rule { border-color:var(--rule); }

/* dopad — cursor-tracked preview chip (face zoom, b&w) */
.dopad__cursor-preview {
  position:fixed; top:0; left:0; z-index:9999;
  width:150px; height:190px;
  pointer-events:none;
  opacity:0; transform:translate(-200%, -200%);
  transition:opacity 180ms cubic-bezier(.16,1,.3,1);
  background:#1a1a18;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  will-change:transform;
}
.dopad__cursor-preview.is-on { opacity:1; }
.dopad__cursor-preview__img {
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:contain;
  object-position:center;
  opacity:0;
  transition:opacity 180ms ease;
}
.dopad__cursor-preview__img.is-active { opacity:1; }
.dopad__cursor-preview.has-img .dopad__cursor-preview__img.is-active { opacity:1; }
.dopad__cursor-preview__label {
  position:relative; z-index:1;
  font-size:10px; letter-spacing:0.22em; text-transform:uppercase;
  color:#7a746a; font-weight:500;
  font-family:var(--mono, ui-monospace, monospace);
}
.dopad__cursor-preview.has-img .dopad__cursor-preview__label { display:none; }
@media (max-width:760px){
  .dopad__cursor-preview { display:none; }
}

.dopad__list {
  display:flex; flex-direction:column;
  border-top:1px solid var(--rule);
}
.dopad__row {
  position:relative;
  display:grid;
  grid-template-columns: 80px 1.4fr 2fr 0.6fr;
  align-items:center;
  gap:24px;
  padding:40px 0;
  border-bottom:1px solid var(--rule);
  cursor:pointer;
  transition:padding 320ms cubic-bezier(.16,1,.3,1), background 200ms;
}
.dopad__row::before {
  content:""; position:absolute; left:0; right:0; top:0; bottom:0;
  background:rgba(255,255,255,0.03); opacity:0;
  transition:opacity 240ms;
  pointer-events:none;
}
.dopad__row:hover { padding-left:16px; padding-right:16px; }
.dopad__row:hover::before { opacity:1; }
.dopad__num { font-size:11px; letter-spacing:0.18em; color:#7a746a; font-weight:500; }
.dopad__title {
  font-size: clamp(24px, 3vw, 40px);
  line-height:1; letter-spacing:-0.03em; font-weight:600;
}
.dopad__title small {
  display:block; font-size:13px; font-weight:400; color:#a8a39a;
  letter-spacing:0.01em; margin-top:8px;
}
.dopad__roles {
  font-size:14px; line-height:1.45; color:#cbc6bb; letter-spacing:0.01em;
}
.dopad__roles .sep { color:#5a554c; padding:0 6px; }
.dopad__cta {
  display:flex; align-items:center; justify-content:flex-end;
  gap:16px;
  font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:#a8a39a;
  transition:color 200ms, transform 240ms cubic-bezier(.16,1,.3,1);
  white-space:nowrap;
}
.dopad__row:hover .dopad__cta { color:var(--inverse-fg); transform:translateX(-4px); }
.dopad__cta .arr {
  width:36px; height:1px; background:currentColor; position:relative;
  transition:width 240ms cubic-bezier(.16,1,.3,1);
}
.dopad__row:hover .dopad__cta .arr { width:56px; }
.dopad__cta .arr::after {
  content:""; position:absolute; right:0; top:-4px; width:9px; height:9px;
  border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg);
}
@media (max-width:880px){
  .dopad__row { grid-template-columns: 48px 1fr; }
  .dopad__roles { grid-column: 1 / 3; padding-left:48px; }
  .dopad__cta { grid-column: 1 / 3; padding-left:48px; justify-content:flex-start; }
}

/* ─── footer ─── */
.foot {
  background:var(--inverse);
  color:var(--inverse-fg);
  position:relative;
  overflow:hidden;
}
.foot__bg {
  position:absolute; inset:0;
  background-image:url('assets/footer_textura.svg');
  background-size:900px auto;
  background-position:right top;
  background-repeat:repeat-x;
  opacity:.18;
  pointer-events:none;
}
.foot__inner {
  position:relative;
  padding:clamp(80px, 12vw, 160px) 0 32px;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap:48px;
}
.foot__contact { grid-column:1 / 3; }
.foot__contact h3 {
  font-size: clamp(40px, 5vw, 80px);
  line-height:0.96; letter-spacing:-0.04em; font-weight:600;
  margin:0 0 32px;
  max-width:14ch;
}
.foot__contact h3 .hl {
  display:inline-block; background:var(--bg); color:var(--ink);
  padding:0.04em 0.22em 0.12em 0;
}
.foot__contact a.email {
  font-size: clamp(20px, 2.4vw, 32px);
  letter-spacing:-0.02em; font-weight:500;
  border-bottom:1px solid var(--rule);
  padding-bottom:6px;
  transition:border-color 200ms;
}
.foot__contact a.email:hover { border-color:var(--inverse-fg); }
.foot__col h5 {
  font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  color:#7a746a; font-weight:500;
  margin:0 0 16px;
}
.foot__col ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; font-size:14px; color:#cbc6bb; }
.foot__col ul a:hover { color:var(--inverse-fg); }
.foot__bottom {
  position:relative;
  display:flex; justify-content:space-between; align-items:center;
  padding:24px 0; border-top:1px solid var(--rule);
  font-size:12px; color:#7a746a; letter-spacing:0.04em;
}
.foot__bottom .word {
  font-size:11px; letter-spacing:0.32em; text-transform:uppercase;
}
@media (max-width:760px){
  .foot__inner { grid-template-columns:1fr 1fr; gap:32px; }
  .foot__contact { grid-column:1 / 3; }
}

/* ─── reveal ─── */
.reveal { opacity:0; transform:translateY(16px); transition:opacity 700ms cubic-bezier(.16,1,.3,1), transform 700ms cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity:1; transform:none; }

/* ─── inline CTA section (no top padding/border) ─── */
.news {
  padding:clamp(80px, 10vw, 160px) 0;
  border-bottom:1px solid var(--rule);
}
.news__grid {
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  gap:clamp(48px, 8vw, 120px);
  align-items:end;
  border-top:1px solid var(--rule-strong);
  padding-top:clamp(48px, 6vw, 96px);
}
.news__copy p:not(.news__kicker):not(.label) {
  font-size: clamp(28px, 4vw, 56px);
  line-height:1.05;
  letter-spacing:-0.035em;
  font-weight:500;
  margin:0;
  max-width:18ch;
}
.news__copy p em { font-style:italic; font-weight:400; color:var(--ink-soft); }
.news__copy .hl {
  display:inline-block;
  background:var(--ink); color:var(--inverse-fg);
  padding:0.04em 0.22em 0.12em;
}
.news__form { display:flex; flex-direction:column; gap:14px; max-width:520px; }
.news__form .label { margin-bottom:0; }
.news__field {
  display:flex; align-items:stretch;
  border-bottom:1px solid var(--ink);
}
.news__field input {
  flex:1; min-width:0;
  background:transparent; border:0; outline:0;
  font:inherit; font-size:18px; letter-spacing:-0.01em;
  padding:14px 0;
  color:var(--ink);
}
.news__field input::placeholder { color:var(--ink-soft); }
.news__field button {
  display:inline-flex; align-items:center; gap:12px;
  background:var(--ink); color:var(--inverse-fg);
  padding:14px 22px;
  font-size:12px; font-weight:500;
  letter-spacing:0.18em; text-transform:uppercase;
  transition:transform 200ms;
}
.news__field button:hover { transform:translateY(-2px); }
.news__form small { font-size:12px; color:var(--ink-soft); letter-spacing:0.04em; }
@media (max-width:880px){
  .news__grid { grid-template-columns:1fr; gap:48px; align-items:start; }
}
@media (max-width:520px){
  .news__field { flex-direction:column; align-items:stretch; border-bottom:0; gap:14px; }
  .news__field input { border-bottom:1px solid var(--ink); padding:12px 0; }
  .news__field button { justify-content:center; padding:16px 22px; width:100%; }
}

/* ─── CLIENTS / MARQUEE ─── */
.clients {
  padding:clamp(64px, 8vw, 120px) 0;
  border-bottom:1px solid var(--rule);
  overflow:hidden;
}
.clients__head {
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:clamp(40px, 5vw, 72px);
}
.marquee {
  position:relative;
  width:100%;
  border-top:1px solid var(--rule-strong);
  border-bottom:1px solid var(--rule-strong);
  overflow:hidden;
}
.marquee::before, .marquee::after {
  content:""; position:absolute; top:0; bottom:0; width:120px; z-index:2; pointer-events:none;
}
.marquee::before { left:0;  background:linear-gradient(to right, var(--bg) 0%, transparent 100%); }
.marquee::after  { right:0; background:linear-gradient(to left,  var(--bg) 0%, transparent 100%); }
.marquee__track {
  display:flex; align-items:center; gap:0;
  width:max-content;
  animation:marquee 50s linear infinite;
}
.marquee:hover .marquee__track { animation-play-state:paused; }
.logo-tile {
  flex:0 0 auto;
  padding:36px 56px;
  font-size: clamp(28px, 2.6vw, 40px);
  font-weight:600;
  letter-spacing:-0.025em;
  color:var(--ink);
  white-space:nowrap;
  border-right:1px solid var(--rule);
  font-style:italic;
  opacity:.85;
  transition:opacity 200ms;
}
.logo-tile:hover { opacity:1; }
.logo-tile--img {
  display:flex; align-items:center; justify-content:center;
  padding:28px 56px;
  font-size:0;
}
.logo-tile--img img {
  height:clamp(40px, 4vw, 56px);
  width:auto; max-width:200px;
  object-fit:contain;
  display:block;
  filter:grayscale(1) contrast(1.05);
  opacity:.78;
  transition:opacity 200ms, filter 200ms;
}
.logo-tile--img:hover img { opacity:1; filter:grayscale(0) contrast(1); }
@keyframes marquee {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}

/* ─── TÍM ─── */
.team {
  padding:clamp(80px, 12vw, 180px) 0;
  border-bottom:1px solid var(--rule);
}
.team__grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:0;
  border-top:1px solid var(--rule-strong);
}
.team__card {
  display:grid;
  grid-template-columns: 200px 1fr;
  gap:32px;
  padding:40px 0;
  border-bottom:1px solid var(--rule);
  align-items:start;
}
.team__card:nth-child(odd)  { padding-right:48px; border-right:1px solid var(--rule); }
.team__card:nth-child(even) { padding-left:48px; }
.team__photo {
  position:relative;
  aspect-ratio: 4 / 5;
  background:
    repeating-linear-gradient(135deg,
      rgba(0,0,0,0.06) 0 8px,
      rgba(0,0,0,0)   8px 16px),
    var(--bg-deep);
  border:1px solid var(--rule-strong);
  display:flex; align-items:flex-end;
  overflow:hidden;
}
.team__photo img {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center top;
  display:block;
  filter:grayscale(0.08) contrast(1.02);
}
.team__photo:has(img) { background:var(--bg-deep); border:1px solid var(--rule-strong); }
.team__photo:has(img) .team__photo-tag { display:none; }
.team__video {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity 400ms ease;
  pointer-events:none;
}
.team__card--video .team__photo { position:relative; overflow:hidden; }
.team__card--video:hover .team__video,
.team__card--video:focus-within .team__video { opacity:1; }
.team__photo-tag {
  display:block;
  font-family:'BasierSquare', monospace;
  font-size:10px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--ink-soft);
  background:var(--bg);
  padding:6px 10px;
  margin:10px;
  border:1px solid var(--rule);
}
.team__num {
  font-size:11px; letter-spacing:0.18em; color:var(--ink-soft); font-weight:500;
  display:block; margin-bottom:12px;
}
.team__name {
  font-size: clamp(28px, 3.4vw, 44px);
  line-height:1; letter-spacing:-0.035em; font-weight:600;
  margin:0 0 10px;
  text-transform:lowercase;
}
.team__role {
  display:inline-block;
  font-size:13px; letter-spacing:0.04em; color:var(--ink);
  border-top:1px solid var(--ink);
  padding-top:8px;
  margin-bottom:18px;
}
.team__bio {
  font-size:14px; color:var(--ink-soft); line-height:1.55; margin:0 0 20px; max-width:34ch;
}
.team__links {
  display:flex; align-items:center; gap:8px;
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-soft);
}
.team__links a { border-bottom:1px solid var(--rule); padding-bottom:2px; transition:color 200ms, border-color 200ms; }
.team__links a:hover { color:var(--ink); border-color:var(--ink); }
.team__links .sep { color:var(--rule-strong); }
.team__sheet {
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase; font-weight:500;
  color:var(--ink-soft); text-decoration:none;
  border-bottom:1px solid var(--rule); padding-bottom:2px;
  transition:color 200ms, border-color 200ms;
}
.team__sheet:hover { color:var(--ink); border-color:var(--ink); }
.team__sheet .arr {
  width:18px; height:1px; background:currentColor; position:relative;
}
.team__sheet .arr::after {
  content:""; position:absolute; right:0; top:-4px; width:8px; height:8px;
  border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg);
}
@media (max-width:880px){
  .team__grid { grid-template-columns:1fr; }
  .team__card { grid-template-columns:140px 1fr; padding:32px 0 !important; border-right:0 !important; padding-left:0 !important; padding-right:0 !important; }
}
@media (max-width:520px){
  .team__card { grid-template-columns:1fr; }
}

/* ─── CONTACT FORM ─── */
.contact {
  padding-top:clamp(32px, 4vw, 72px);
  padding-bottom:clamp(80px, 12vw, 180px);
  border-bottom:0;
}
.contact__grid {
  display:grid;
  grid-template-columns: 1.15fr 1fr;
  gap:clamp(48px, 8vw, 120px);
  border-top:0;
  padding-top:0;
}
.contact__lead .label { display:block; margin-bottom:32px; }
.contact__h {
  font-size: clamp(38px, 4.4vw, 68px);
  line-height:1.08;
  letter-spacing:-0.04em;
  font-weight:600;
  margin:0 0 48px;
  text-wrap:balance;
}
.contact__h .hl {
  display:inline-block;
  background:var(--ink); color:var(--inverse-fg);
  padding:0.04em 0.22em 0.12em;
  margin:0 0.04em;
}
.contact__meta {
  position:relative;
  border-top:1px solid var(--rule);
  padding-top:24px;
  display:flex; flex-direction:column; gap:8px;
  font-size:15px;
  letter-spacing:-0.005em;
}
.contact__meta p { margin:0; }
.contact__meta p.muted { color:var(--ink-soft); margin-top:8px; font-size:13px; line-height:1.55; }
.contact__meta strong { font-weight:600; }

/* textura presahujúca z contact sekcie do footera — zarovnaná na predel */
.contact__bleed {
  display:block;
  position:absolute;
  left:50%;
  bottom:0;
  transform:translate(-50%, 50%);
  max-height:250px;
  width:auto;
  pointer-events:none;
  user-select:none;
  z-index:6;
  mix-blend-mode:multiply;
  opacity:0.9;
}
@media (max-width:880px){
  .contact__bleed { max-height:170px; }
}

.contact__form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px 32px;
}
.contact__form .field { display:flex; flex-direction:column; gap:10px; }
.contact__form .field--full { grid-column:1 / -1; }
.contact__form label {
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--ink-soft); font-weight:500;
}
.contact__form label .opt { color:var(--rule-strong); font-weight:400; letter-spacing:0.04em; text-transform:none; font-size:11px; }
.contact__form input[type="text"],
.contact__form input[type="email"],
.contact__form input[type="tel"],
.contact__form textarea {
  background:transparent;
  border:0; border-bottom:1px solid var(--ink);
  outline:0;
  font:inherit; font-size:18px; letter-spacing:-0.01em;
  padding:10px 0;
  color:var(--ink);
  width:100%;
  border-radius:0;
}
.contact__form input::placeholder, .contact__form textarea::placeholder { color:var(--ink-soft); opacity:0.45; }
.contact__form textarea { resize:vertical; min-height:140px; line-height:1.5; }
.contact__form input:focus, .contact__form textarea:focus { border-bottom-color:var(--ink); border-bottom-width:2px; padding-bottom:9px; }

.chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.chip {
  display:inline-flex; align-items:center;
  font-size:13px; letter-spacing:-0.005em;
  padding:8px 14px;
  border:1px solid var(--rule-strong);
  cursor:pointer;
  user-select:none;
  transition:background 160ms, color 160ms;
}
.chip input { display:none; }
.chip:has(input:checked) { background:var(--ink); color:var(--inverse-fg); border-color:var(--ink); }
.chip:hover { background:rgba(0,0,0,0.04); }
.chip:has(input:checked):hover { background:#000; }

.contact__bottom {
  display:flex; align-items:flex-start; justify-content:flex-start; gap:18px;
  flex-direction:column;
  padding-left:0;
}
.contact__bottom .contact__submit { margin-left:0; }
.contact__note { font-size:12px; color:var(--ink-soft); max-width:46ch; line-height:1.55; margin:0; text-transform:none; align-self:flex-start; }
.contact__submit {
  flex:0 0 auto;
  padding:18px 36px;
  font-size:14px; letter-spacing:0.06em;
  text-transform:uppercase;
  font-weight:600;
}

@media (max-width:880px){
  .contact__grid { grid-template-columns:1fr; gap:48px; }
  .contact__form { grid-template-columns:1fr; }
  .contact__bottom { flex-direction:column; align-items:flex-start; gap:20px; }
  .contact__note { align-self:flex-start; }
}

/* ─── tweaks panel ─── */
.tweaks {
  position:fixed; bottom:24px; right:24px; z-index:9999;
  width:280px;
  background:var(--bg);
  border:1px solid var(--ink);
  padding:20px 22px 22px;
  font-family:'BasierSquare', sans-serif;
}
.tweaks h6 {
  font-size:11px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase;
  margin:0 0 16px;
}
.tweaks .group { margin-bottom:14px; }
.tweaks .group label.title {
  font-size:10px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--ink-soft); margin-bottom:8px; display:block;
}
.tweaks .swatches { display:flex; gap:8px; }
.tweaks .swatch {
  width:32px; height:32px;
  border:1px solid var(--ink); cursor:pointer;
  position:relative;
  transition:transform 160ms;
}
.tweaks .swatch.active { outline:2px solid var(--ink); outline-offset:2px; }
.tweaks .swatch:hover { transform:scale(1.06); }
.tweaks .seg {
  display:grid; grid-template-columns:1fr 1fr 1fr; gap:0;
  border:1px solid var(--ink);
}
.tweaks .seg button {
  font-size:11px; letter-spacing:0.12em; text-transform:uppercase;
  padding:8px 4px; border-right:1px solid var(--ink);
}
.tweaks .seg button:last-child { border-right:0; }
.tweaks .seg button.active { background:var(--ink); color:var(--bg); }
.tweaks .toggle { display:flex; justify-content:space-between; font-size:13px; align-items:center; }
.tweaks .toggle input { width:34px; height:20px; appearance:none; background:#c9c1ac; border-radius:9999px; position:relative; cursor:pointer; outline:0; transition:background 200ms; }
.tweaks .toggle input::after { content:""; position:absolute; top:2px; left:2px; width:16px; height:16px; background:var(--bg); border-radius:50%; transition:left 200ms; }
.tweaks .toggle input:checked { background:var(--ink); }
.tweaks .toggle input:checked::after { left:16px; }
.tweaks .close {
  position:absolute; top:14px; right:14px; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-soft);
}
.tweaks .close:hover { color:var(--ink); }

/* ============================================================
   LEGAL PAGES (privacy / cookies)
   ============================================================ */

.legal-hero {
  padding: clamp(64px, 10vw, 144px) 0 0;
}
.legal-hero__kicker {
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom: clamp(40px, 6vw, 80px);
  border-bottom:1px solid var(--rule);
  padding-bottom:24px;
}
.legal-hero__kicker .back {
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--ink-soft); font-weight:500;
  display:inline-flex; align-items:center; gap:10px;
  transition:color 200ms;
}
.legal-hero__kicker .back::before {
  content:""; width:18px; height:1px; background:currentColor; position:relative; display:inline-block;
}
.legal-hero__kicker .back:hover { color:var(--ink); }

.legal-hero__h {
  font-size: clamp(48px, 9vw, 120px);
  font-weight:600;
  letter-spacing:-0.045em;
  line-height:0.95;
  margin:0 0 clamp(32px, 4vw, 56px);
  text-transform:lowercase;
  text-wrap:balance;
}
.legal-hero__lead {
  font-size: clamp(18px, 2vw, 24px);
  line-height:1.45;
  letter-spacing:-0.01em;
  color:var(--ink);
  max-width:62ch;
  margin:0 0 18px;
  font-weight:400;
}
.legal-hero__lead em { font-style:italic; color:var(--ink-soft); font-weight:400; }
.legal-hero__meta {
  margin-top: clamp(48px, 6vw, 96px);
  padding:18px 0 18px;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  display:flex; justify-content:space-between; align-items:baseline;
  gap:16px;
}
.legal-hero__meta .label { color:var(--ink); }
.legal-hero__meta .num { color:var(--ink-soft); }

/* ─── body grid ─── */
.legal-body { padding: clamp(48px, 6vw, 96px) 0 clamp(80px, 10vw, 160px); }
.legal-body__inner {
  display:grid;
  grid-template-columns: 220px 1fr;
  gap: clamp(48px, 8vw, 120px);
}

/* ─── sticky TOC ─── */
.legal-toc {
  position:sticky;
  top:96px;
  align-self:start;
}
.legal-toc__head {
  font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--ink-soft); font-weight:500;
  margin-bottom:18px;
  display:block;
}
.legal-toc__list {
  list-style:none; padding:0; margin:0;
  border-top:1px solid var(--rule);
}
.legal-toc__list li { border-bottom:1px solid var(--rule); }
.legal-toc__list a {
  display:grid;
  grid-template-columns: 28px 1fr;
  gap:10px;
  padding:11px 0;
  font-size:12px;
  letter-spacing:0.02em;
  color:var(--ink-soft);
  line-height:1.4;
  transition:color 220ms, padding-left 240ms cubic-bezier(.22,1,.36,1);
}
.legal-toc__list a .n {
  font-size:10px; letter-spacing:0.22em; font-weight:500;
  color:var(--ink-soft);
  font-feature-settings:"tnum";
}
.legal-toc__list a:hover { color:var(--ink); padding-left:6px; }
.legal-toc__list a:hover .n { color:var(--ink); }
.legal-toc__list a.is-active { color:var(--ink); padding-left:6px; }
.legal-toc__list a.is-active .n { color:var(--ink); font-weight:600; }
.legal-toc__list li:has(a.is-active) { background:rgba(0,0,0,0.02); }

/* ─── sections ─── */
.legal-section {
  padding: clamp(48px, 7vw, 96px) 0;
  border-top:1px solid var(--rule);
}
.legal-section:first-child { border-top:0; padding-top:0; }
.legal-section:last-child { padding-bottom:0; }

.legal-section__head {
  display:grid;
  grid-template-columns: 60px 1fr;
  gap:24px;
  align-items:baseline;
  margin-bottom:clamp(28px, 3vw, 48px);
}
.legal-section__num {
  font-size:11px; letter-spacing:0.22em; font-weight:500;
  color:var(--ink-soft);
  font-feature-settings:"tnum";
  padding-top:14px;
}
.legal-section__h {
  font-size: clamp(26px, 3.4vw, 44px);
  font-weight:600;
  letter-spacing:-0.03em;
  line-height:1.05;
  margin:0;
  text-transform:lowercase;
}

.legal-section__body {
  padding-left: 84px;
  max-width: 68ch;
}
.legal-section__body p {
  font-size:16px;
  line-height:1.65;
  letter-spacing:-0.005em;
  margin:0 0 20px;
  color:var(--ink);
}
.legal-section__body p.lead {
  font-size:18px;
  line-height:1.55;
  color:var(--ink);
  margin-bottom:28px;
}
.legal-section__body p em { font-style:italic; color:var(--ink-soft); }
.legal-section__body strong { font-weight:600; color:var(--ink); }
.legal-section__body a { color:var(--ink); border-bottom:1px solid var(--ink); transition:opacity 200ms; }
.legal-section__body a:hover { opacity:0.6; }

.legal-section__body h3 {
  font-size: clamp(17px, 1.8vw, 20px);
  font-weight:600;
  letter-spacing:-0.015em;
  line-height:1.25;
  margin: 36px 0 12px;
  text-transform:lowercase;
  display:flex; align-items:baseline; gap:10px;
}
.legal-section__body h3::before {
  content:"↳";
  font-size:0.85em;
  color:var(--ink-soft);
  font-weight:400;
}
.legal-section__body h3 + p { margin-top:6px; }

.legal-section__body ul {
  list-style:none;
  margin:0 0 24px;
  padding:0;
}
.legal-section__body ul li {
  font-size:16px;
  line-height:1.55;
  padding:5px 0 5px 24px;
  position:relative;
  color:var(--ink);
}
.legal-section__body ul li::before {
  content:"—";
  position:absolute; left:0; top:5px;
  color:var(--ink-soft);
}

.legal-section__body .callout {
  margin: 28px 0;
  padding: 18px 22px;
  border-left:2px solid var(--ink);
  background: rgba(0,0,0,0.025);
  font-size:14px; line-height:1.6;
  color:var(--ink-soft);
}
.legal-section__body .callout strong { color:var(--ink); }

/* ─── data sheet (key/value) ─── */
.legal-dl {
  margin:0;
  border-top:1px solid var(--rule);
}
.legal-dl__row {
  display:grid;
  grid-template-columns: 220px 1fr;
  gap:24px;
  align-items:baseline;
  padding:20px 0;
  border-bottom:1px solid var(--rule);
}
.legal-dl dt {
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-soft);
  font-weight:500;
}
.legal-dl dd {
  margin:0;
  font-size:16px;
  line-height:1.5;
  color:var(--ink);
  letter-spacing:-0.005em;
}
.legal-dl dd small {
  display:block;
  margin-top:6px;
  font-size:13px;
  color:var(--ink-soft);
  letter-spacing:0.01em;
}
.legal-dl dd .mono {
  font-feature-settings:"tnum","ss01";
  font-weight:500;
  letter-spacing:0.02em;
}
@media (max-width:760px){
  .legal-dl__row {
    grid-template-columns: 1fr;
    gap:6px;
  }
}

/* ─── responsive ─── */
@media (max-width:880px){
  .legal-body__inner { grid-template-columns: 1fr; gap: clamp(32px, 5vw, 48px); }
  .legal-toc { position:static; }
  .legal-section__head { grid-template-columns: 48px 1fr; gap:16px; }
  .legal-section__body { padding-left: 0; }
  .legal-section__num { padding-top:8px; }
}
@media (max-width:520px){
  .legal-hero__kicker { flex-direction:column; gap:14px; align-items:flex-start; }
  .legal-hero__meta { flex-direction:column; gap:8px; align-items:flex-start; }
  .legal-section__head { grid-template-columns: 1fr; gap:8px; }
  .legal-section__num { padding-top:0; }
}

/* ============================================================
   COOKIE CONSENT — banner + modal
   ============================================================ */

/* ─── banner ─── */
.cc-banner {
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:60;
  background:var(--bg);
  border-top:1px solid var(--ink);
  padding:22px 0;
  transform:translateY(110%);
  transition:transform 520ms cubic-bezier(.76,0,.24,1);
  pointer-events:none;
}
.cc-banner.is-open {
  transform:translateY(0);
  pointer-events:auto;
}
.cc-banner__inner {
  display:grid;
  grid-template-columns: 1.4fr 1fr;
  gap:clamp(20px, 4vw, 56px);
  align-items:center;
}
.cc-banner__copy { display:flex; flex-direction:column; gap:6px; }
.cc-banner__label { color:var(--ink); }
.cc-banner__text {
  font-size:14px;
  line-height:1.5;
  letter-spacing:-0.005em;
  color:var(--ink);
  margin:0;
  max-width:60ch;
}
.cc-banner__text a {
  color:var(--ink);
  border-bottom:1px solid var(--ink);
  padding-bottom:1px;
  transition:opacity 200ms;
}
.cc-banner__text a:hover { opacity:0.6; }
.cc-banner__actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:wrap;
}

/* ─── shared button ─── */
.cc-btn {
  display:inline-flex; align-items:center; gap:10px;
  border:1px solid var(--ink);
  background:transparent;
  color:var(--ink);
  padding:11px 18px;
  font:inherit;
  font-size:11px; font-weight:500;
  letter-spacing:0.18em; text-transform:uppercase;
  cursor:pointer;
  border-radius:0;
  transition:background 220ms cubic-bezier(.22,1,.36,1),
             color 220ms cubic-bezier(.22,1,.36,1);
  white-space:nowrap;
}
.cc-btn:hover { background:var(--ink); color:var(--inverse-fg); }
.cc-btn--primary {
  background:var(--ink);
  color:var(--inverse-fg);
}
.cc-btn--primary:hover { background:#000; color:var(--inverse-fg); }
.cc-btn--link {
  border:0;
  padding:11px 4px;
  background:transparent;
  position:relative;
}
.cc-btn--link:hover { background:transparent; color:var(--ink); }
.cc-btn--link::after {
  content:""; position:absolute;
  left:4px; right:4px; bottom:6px;
  height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:left;
  transition:transform 280ms cubic-bezier(.22,1,.36,1);
}
.cc-btn--link:hover::after { transform:scaleX(1); }
.cc-btn--link .cc-arr {
  width:14px; height:1px; background:currentColor;
  position:relative; display:inline-block;
}
.cc-btn--link .cc-arr::after {
  content:""; position:absolute;
  right:0; top:-3px; width:7px; height:7px;
  border-top:1px solid currentColor;
  border-right:1px solid currentColor;
  transform:rotate(45deg);
}

@media (max-width:760px){
  .cc-banner { padding:20px 0; }
  .cc-banner__inner { grid-template-columns:1fr; gap:18px; }
  .cc-banner__actions {
    justify-content:stretch;
    flex-wrap:wrap;
    gap:10px;
  }
  .cc-banner__actions .cc-btn { flex:1 1 calc(50% - 10px); justify-content:center; }
  .cc-banner__actions .cc-btn--link { flex:1 1 100%; justify-content:center; }
}

/* ─── modal ─── */
.cc-modal {
  position:fixed; inset:0;
  z-index:70;
  display:none;
}
.cc-modal.is-open { display:block; }
.cc-modal__backdrop {
  position:absolute; inset:0;
  background:rgba(10,10,10,0.6);
  opacity:0;
  transition:opacity 280ms cubic-bezier(.22,1,.36,1);
}
.cc-modal.is-open .cc-modal__backdrop { opacity:1; }
.cc-modal__panel {
  position:absolute;
  top:50%; left:50%;
  width:min(580px, calc(100vw - 32px));
  max-height:calc(100vh - 64px);
  overflow-y:auto;
  background:var(--bg);
  border:1px solid var(--ink);
  padding:32px clamp(24px, 4vw, 40px) 28px;
  opacity:0;
  transform:translate(-50%, -46%);
  transition:opacity 320ms cubic-bezier(.22,1,.36,1),
             transform 320ms cubic-bezier(.22,1,.36,1);
}
.cc-modal.is-open .cc-modal__panel {
  opacity:1;
  transform:translate(-50%, -50%);
}
.cc-modal__head {
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:14px;
}
.cc-modal__close {
  font-size:11px;
  font-weight:500;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-soft);
  background:transparent; border:0; padding:0;
  cursor:pointer;
  transition:color 200ms;
}
.cc-modal__close:hover { color:var(--ink); }
.cc-modal__h {
  font-size:clamp(28px, 4vw, 40px);
  font-weight:600;
  letter-spacing:-0.035em;
  line-height:1;
  margin:0 0 12px;
  text-transform:lowercase;
}
.cc-modal__lead {
  font-size:14px;
  color:var(--ink-soft);
  line-height:1.55;
  margin:0 0 28px;
  max-width:54ch;
}

.cc-cats {
  border-top:1px solid var(--rule);
  margin-bottom:24px;
}
.cc-cat {
  display:grid;
  grid-template-columns: 1fr auto;
  gap:18px;
  align-items:start;
  padding:18px 0;
  border-bottom:1px solid var(--rule);
}
.cc-cat__name {
  font-size:14px;
  font-weight:600;
  letter-spacing:0.02em;
  margin:0 0 6px;
  text-transform:lowercase;
  color:var(--ink);
}
.cc-cat__desc {
  font-size:13px;
  color:var(--ink-soft);
  line-height:1.5;
  margin:0;
  max-width:46ch;
}

/* ─── toggle pill ─── */
.cc-toggle {
  position:relative;
  width:42px; height:24px;
  border-radius:9999px;
  background:#c9c1ac;
  border:0; padding:0;
  cursor:pointer;
  transition:background 220ms cubic-bezier(.22,1,.36,1);
  align-self:start;
  margin-top:2px;
}
.cc-toggle::after {
  content:""; position:absolute;
  top:2px; left:2px;
  width:20px; height:20px;
  background:var(--bg);
  border-radius:50%;
  transition:left 240ms cubic-bezier(.7,0,.3,1);
}
.cc-toggle.is-on { background:var(--ink); }
.cc-toggle.is-on::after { left:20px; }
.cc-toggle.is-locked {
  cursor:not-allowed;
  opacity:0.55;
}

.cc-modal__actions {
  display:flex;
  gap:12px;
  justify-content:flex-end;
  flex-wrap:wrap;
}

body.cc-modal-open { overflow:hidden; }

@media (max-width:520px){
  .cc-modal__panel { padding:28px 22px 24px; }
  .cc-modal__actions { flex-direction:column; }
  .cc-modal__actions .cc-btn { width:100%; justify-content:center; }
}

/* ─── footer "nastavenia cookies" link ─── */
.foot .js-cc-open {
  background:transparent; border:0; padding:0;
  font:inherit; cursor:pointer;
  color:inherit; text-align:left;
}