/* Fisheoo – strona fisheoo.pl z odliczaniem do premiery. Kolorystyka z wizytówki: granat, turkus, biel. */
@font-face { font-family: Montserrat; font-style: normal; font-weight: 500; font-display: swap; src: url(/fonts/montserrat-latin-ext-500-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: Montserrat; font-style: normal; font-weight: 500; font-display: swap; src: url(/fonts/montserrat-latin-500-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: Montserrat; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/montserrat-latin-ext-600-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: Montserrat; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/montserrat-latin-600-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: Montserrat; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/montserrat-latin-ext-700-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: Montserrat; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/montserrat-latin-700-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: Montserrat; font-style: normal; font-weight: 800; font-display: swap; src: url(/fonts/montserrat-latin-ext-800-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: Montserrat; font-style: normal; font-weight: 800; font-display: swap; src: url(/fonts/montserrat-latin-800-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: Montserrat; font-style: italic; font-weight: 800; font-display: swap; src: url(/fonts/montserrat-latin-ext-800-italic.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: Montserrat; font-style: italic; font-weight: 800; font-display: swap; src: url(/fonts/montserrat-latin-800-italic.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; }

:root { --navy: #061820; --navy2: #0A2733; --cyan: #22D3EE; --text: #FFFFFF; --soft: #D6E7EC; --muted: #B5D3DB; }
* { box-sizing: border-box; }
html { background: var(--navy); -webkit-text-size-adjust: 100%; }
body { margin: 0; color: var(--text); font-family: Montserrat, system-ui, sans-serif; }
a { color: var(--cyan); }
a:hover { color: #8BEAF7; }
:focus-visible { outline: 3px solid var(--cyan); outline-offset: 3px; }

.page { position: relative; min-height: 100vh; overflow: hidden; background: radial-gradient(120% 80% at 50% 0%, #0D3442 0%, #082330 45%, var(--navy) 100%); }
.lake { position: absolute; left: 0; right: 0; bottom: 0; height: 52%; opacity: .55; background: url(/assets/swit.jpg) center 64% / cover no-repeat;
  -webkit-mask-image: linear-gradient(to top, #000 0%, rgba(0,0,0,.85) 35%, transparent 100%); mask-image: linear-gradient(to top, #000 0%, rgba(0,0,0,.85) 35%, transparent 100%); }
.lake-shade { position: absolute; left: 0; right: 0; bottom: 0; height: 52%; background: linear-gradient(to bottom, rgba(6,24,32,.6), rgba(6,24,32,.15) 60%, rgba(6,24,32,.7)); }
.waves { position: absolute; left: 0; top: 34%; width: 100%; height: 240px; opacity: .55; }

.main { position: relative; z-index: 2; max-width: 1080px; margin: 0 auto; padding: clamp(36px, 6vh, 64px) 20px 40px; min-height: 100vh;
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(22px, 4vh, 36px); }
.logo { height: clamp(48px, 7vw, 84px); width: auto; display: block; }
.kicker { margin: 0; display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border: 1.5px solid var(--cyan); border-radius: 999px;
  font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #CFF6FB; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
h1 { margin: 0; font-weight: 800; font-size: clamp(34px, 5.4vw, 72px); line-height: 1.04; letter-spacing: -.02em; }
.brush { position: relative; display: inline-block; }
.brush > svg { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.brush > span { position: relative; z-index: 1; color: var(--navy); font-style: italic; }
.brush-h1 { padding: .06em .45em .12em; margin-top: .12em; }
.brush-motto { margin: 8px 0 0; padding: .35em .9em .45em; font-weight: 800; font-size: clamp(16px, 4.2vw, 34px); white-space: nowrap; }
.lead { margin: 0; max-width: 640px; font-size: clamp(16px, 1.6vw, 20px); font-weight: 500; line-height: 1.55; color: var(--soft); }
.lead strong { color: #fff; }

.countdown { display: flex; flex-direction: column; align-items: center; gap: 14px; width: 100%; }
.countdown-title { margin: 0; font-size: 14px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--cyan); }
.tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(8px, 1.6vw, 18px); width: 100%; max-width: 640px; }
.tile { padding: clamp(12px, 2.4vw, 22px) 6px; border: 2px solid var(--cyan); border-radius: 20px; background: rgba(6,24,32,.72);
  box-shadow: 0 0 22px rgba(34,211,238,.25), inset 0 0 18px rgba(34,211,238,.08); display: flex; flex-direction: column; gap: 4px; }
.num { font-weight: 800; font-size: clamp(30px, 5.4vw, 64px); line-height: 1; font-variant-numeric: tabular-nums; }
.unit { font-size: clamp(11px, 1.2vw, 14px); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }

.features { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 0; }
.features li { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 132px; padding: 0 6px; border-right: 1px solid rgba(34,211,238,.4); font-size: 14px; font-weight: 600; line-height: 1.3; }
.features li:last-child { border-right: 0; }
.features svg { width: 36px; height: 36px; fill: none; stroke: var(--cyan); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.features svg .fill { fill: var(--cyan); }

.beta { width: 100%; max-width: 720px; padding: clamp(22px, 3.5vw, 36px); border: 2px solid var(--cyan); border-radius: 24px; background: rgba(6,24,32,.82);
  box-shadow: 0 0 26px rgba(34,211,238,.22); text-align: left; display: flex; flex-direction: column; gap: 18px; scroll-margin-top: 24px; }
.beta-head h2 { margin: 0 0 6px; font-weight: 800; font-size: clamp(22px, 2.6vw, 30px); line-height: 1.15; }
.beta-head p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--soft); }
#beta-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label { font-size: 13px; font-weight: 600; color: #CFF6FB; }
.opt { font-weight: 500; color: var(--muted); }
input[type=text], input[type=email], input[type=tel], select { min-height: 48px; padding: 0 14px; border-radius: 12px; border: 1.5px solid rgba(34,211,238,.45);
  background: var(--navy2); color: #fff; font: 500 16px Montserrat, sans-serif; width: 100%; }
input::placeholder { color: #7FA3AD; }
input[aria-invalid=true] { border-color: #FF8A7A; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.consent { grid-column: 1 / -1; display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5; color: var(--soft); }
.consent input { width: 20px; height: 20px; margin: 1px 0 0; flex: none; accent-color: var(--cyan); }
.captcha { grid-column: 1 / -1; }
.captcha:empty { display: none; }
.error { grid-column: 1 / -1; margin: 0; padding: 10px 14px; border-radius: 10px; background: rgba(255,138,122,.12); border: 1px solid #FF8A7A; color: #FFD2CB; font-size: 14px; }
#beta-submit { grid-column: 1 / -1; min-height: 52px; border: 0; border-radius: 14px; background: var(--cyan); color: var(--navy); font: italic 800 18px Montserrat, sans-serif; cursor: pointer; }
#beta-submit:disabled { opacity: .6; cursor: wait; }
.done { display: flex; gap: 14px; align-items: center; padding: 16px; border-radius: 14px; background: var(--navy2); font-size: 15px; line-height: 1.5; }
.done svg { width: 32px; height: 32px; flex: none; fill: none; stroke: var(--cyan); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
[hidden] { display: none !important; }

.privacy { width: 100%; max-width: 720px; text-align: left; font-size: 13px; line-height: 1.6; color: var(--muted); }
.privacy summary { cursor: pointer; font-weight: 600; color: #CFF6FB; }
.privacy p { margin: 8px 0 0; }
.todo { background: #F5E63A; color: #061820; padding: 0 4px; border-radius: 4px; }
.foot { margin-top: auto; padding-top: 24px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; font-size: 14px; font-weight: 500; color: var(--muted); }

@media (max-width: 600px) {
  .waves { display: none; }
  .features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 0; width: 100%; }
  .features li { width: auto; border-right: 0; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }