/* Self-hosted fonts (d4/fonts/, SIL OFL 1.1, see d4/fonts/OFL.txt). The same variable woff2 files and unicode-ranges
   Google Fonts serves for Inter Tight 400–600 and JetBrains Mono 400–500, Latin + Latin Extended (Czech) only: every
   character on the page is in one of these two subsets or in none of Google's (arrows, ✓, ⌘ fall back as before).
   No request leaves ownbuild.ai. index.html preloads the two Inter Tight files (hero copy needs both). */
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:400 600;font-display:swap;src:url(/d4/fonts/inter-tight-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:400 600;font-display:swap;src:url(/d4/fonts/inter-tight-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url(/d4/fonts/jetbrains-mono-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url(/d4/fonts/jetbrains-mono-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* Shared fixed constraints for all three directions: OWN Build tokens (from styles.css :root) */
:root{
  --ground:#f8f7f5; --ink:#141414; --black:#0e0e0c; --yellow:#ffd500;
  --muted:#5c5c5c; --faint:#8a8984; --line:rgba(20,20,20,.1); --paper-2:#efeee9;
  --label:#66655f; --card:#fff; --hl:rgba(20,20,20,.09);
  /* white tick (1.75 px stroke at 12 px) for the ink promise discs: Nabídka .nb-vows, Kontakt .kt-vows */
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.1 6.3 5.1 8.3 8.9 4.2'/%3E%3C/svg%3E");
  --page:1296px; --gutter:clamp(20px,5vw,72px);
  /* section rhythm: every .sec pads --sec-y top and bottom, so chapters sit 192 / 144 (≤900) / 112 (≤600) px apart */
  --sec-y:96px;
  /* section head rhythm: kicker → h2 --kick-gap, head → section body --head-gap (shared .kick component in style.css) */
  --kick-gap:28px; --head-gap:56px;
  --font:"Inter Tight",Inter,ui-sans-serif,system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  /* ── shared scale ── tokens only: nothing changes until a section opts in (var(--sh-2) etc.).
     Sections may alias these or keep prefixed locals, but should not redefine the bare names.
     Radius   --r-xs 6 chips, keys, small tiles · --r-sm 10 white panels and mock windows inside a section
              --r-s 8 inputs, mini UI · --r-m 16 cards · --r-l 28 hero / band / section card · 999px pills
     Shadow   --sh-1 small raised tile or node (hero tiles, Napojení/Produkt nodes)
              --sh-2 the standard white panel (Produkt, Napojení, O nás, Kontakt aside, Audit)
              --sh-3 large focal panel (Kontakt form panel, the mobile menu sheet)
     Easing   --ease-out enter / settle · --ease-io move between two resting states · --ease-spring small pop (ticks, tiles)
     Duration --dur-1 .2s hover, press, colour · --dur-2 .35s state change · --dur-3 .55s enter, layout move */
  --r-xs:6px; --r-s:8px; --r-sm:10px; --r-m:16px; --r-l:28px;
  --sh-1:0 1px 2px rgba(0,0,0,.04),0 8px 20px -14px rgba(0,0,0,.2);
  --sh-2:0 1px 2px rgba(0,0,0,.04),0 12px 32px -16px rgba(0,0,0,.18);
  --sh-3:0 1px 2px rgba(0,0,0,.04),0 28px 56px -32px rgba(0,0,0,.28);
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-io:cubic-bezier(.45,0,.25,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --dur-1:.2s; --dur-2:.35s; --dur-3:.55s;
}
@media (max-width:900px){:root{--sec-y:72px;--head-gap:32px}}
@media (max-width:600px){:root{--sec-y:56px;--kick-gap:20px}}
*,*::before,*::after{box-sizing:border-box}
/* scroll-padding: anchor jumps land below the fixed nav (nav bottom: 76 px at the top of the page, 68 scrolled, 64 ≤900 px) */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:88px}
body{margin:0;background:var(--ground);color:var(--ink);font:400 17px/1.6 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,p{margin:0}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
.wrap{max-width:var(--page);margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 12px;border-radius:6px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.logo{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;text-decoration:none;letter-spacing:-.01em;color:var(--black)}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.num{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}*{scroll-behavior:auto!important}}