/* coddbase.pl – strona tymczasowa (T-47). Fonty lokalnie, bez skryptów, bez ciasteczek. */
@font-face { font-family: "Instrument Sans"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(/fonts/instrument-sans-latin-wght-normal.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: "Instrument Sans"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(/fonts/instrument-sans-latin-ext-wght-normal.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 400; font-display: swap;
  src: url(/fonts/newsreader-latin-standard-normal.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: "Newsreader"; font-style: normal; font-weight: 400; font-display: swap;
  src: url(/fonts/newsreader-latin-ext-standard-normal.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

:root { --navy: #0F172A; --sky: #0EA5E9; --sky-d: #0284C7; --muted: #64748B; --bg: #F8FAFC; --line: #E2E8F0; }
* { box-sizing: border-box; margin: 0; }
html, body { height: 100%; }
body { min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); color: var(--navy);
  font-family: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(60rem 30rem at 50% 38%, rgba(14,165,233,.10), transparent 70%); }

.stage { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 48px 16px; }

/* logo: „Codd” pogrubione, „Base” cienkie, kropka w błękicie */
.mark { font-size: clamp(56px, 13vw, 132px); line-height: 1; letter-spacing: -0.035em; font-weight: 400; display: inline-flex; align-items: baseline; }
.codd { font-weight: 650; opacity: 0; animation: rise .7s cubic-bezier(.2,.7,.2,1) .1s forwards; }
.base { font-weight: 300; opacity: 0; animation: rise .7s cubic-bezier(.2,.7,.2,1) .35s forwards; }
.dot { width: .17em; height: .17em; margin-left: .06em; border-radius: 50%; background: var(--sky); display: inline-block;
  transform: translateY(-1.6em); opacity: 0;
  animation: drop .9s cubic-bezier(.3,0,.4,1) 1s forwards, glow 2.8s ease-in-out 2.2s infinite; }

.tag { margin-top: 22px; font-family: "Newsreader", Georgia, serif; font-size: clamp(22px, 3.4vw, 32px); color: var(--navy);
  opacity: 0; animation: fade .8s ease 1.7s forwards; }
.lead { margin-top: 12px; max-width: 34rem; font-size: 17px; line-height: 1.55; color: var(--muted); opacity: 0; animation: fade .8s ease 1.9s forwards; }
.links { margin-top: 32px; display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; opacity: 0; animation: fade .8s ease 2.1s forwards; }
.btn, .ghost { display: inline-block; padding: 12px 22px; border-radius: 10px; font-weight: 600; font-size: 15px; text-decoration: none; transition: background .15s, border-color .15s; }
.btn { background: var(--sky-d); color: #fff; }
.btn:hover { background: #0369A1; }
.ghost { color: var(--navy); border: 1px solid var(--line); background: #fff; }
.ghost:hover { border-color: var(--sky); }
a:focus-visible { outline: 3px solid rgba(14,165,233,.45); outline-offset: 2px; }

.foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 18px 24px; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.build { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--navy); }
.build i { width: 8px; height: 8px; border-radius: 50%; background: var(--sky); animation: glow 2.8s ease-in-out infinite; }

@keyframes rise { from { opacity: 0; transform: translateY(.25em); } to { opacity: 1; transform: none; } }
@keyframes fade { to { opacity: 1; } }
@keyframes drop {
  0%   { opacity: 0; transform: translateY(-1.6em); }
  15%  { opacity: 1; }
  55%  { transform: translateY(0); }
  70%  { transform: translateY(-.35em); }
  85%  { transform: translateY(0); }
  93%  { transform: translateY(-.08em); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(14,165,233,.0); } 50% { box-shadow: 0 0 0 .1em rgba(14,165,233,.18); } }

@media (prefers-reduced-motion: reduce) {
  .codd, .base, .dot, .tag, .lead, .links { animation: none; opacity: 1; transform: none; }
  .build i { animation: none; }
}
@media (max-width: 480px) { .foot { justify-content: center; } }
