/* Спільне для всіх концептів: шрифти, скидання, вікно форми (кольори — змінними, кожен концепт перефарбовує), навігація між варіантами. */
@font-face { font-family: "Geologica"; font-weight: 400 650; font-display: swap; src: url(fonts/geologica-cyr.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Geologica"; font-weight: 400 650; font-display: swap; src: url(fonts/geologica-lat.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+FEFF; }
@font-face { font-family: "Geologica"; font-weight: 651 749; font-display: swap; src: url(fonts/geologica-700-cyr.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Geologica"; font-weight: 651 749; font-display: swap; src: url(fonts/geologica-700-lat.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+FEFF; }
@font-face { font-family: "Geologica"; font-weight: 750 900; font-display: swap; src: url(fonts/geologica-800-cyr.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Geologica"; font-weight: 750 900; font-display: swap; src: url(fonts/geologica-800-lat.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+FEFF; }
@font-face { font-family: "Spark Serif"; font-style: italic; font-weight: 500; font-display: swap; src: url(fonts/noto-serif-italic-cyr.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Spark Serif"; font-style: italic; font-weight: 500; font-display: swap; src: url(fonts/noto-serif-italic-lat.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F; }
:root { --f: "Geologica", system-ui, -apple-system, "Segoe UI", sans-serif; --serif: "Spark Serif", Georgia, serif; --ease: cubic-bezier(.16, 1, .3, 1);
  --lead-bg: #fffdf8; --lead-ink: #10172a; --lead-muted: #5d667e; --lead-line: #cdc4b2; --lead-accent: #c01a1a; --lead-r: 4px; }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 400 1.0625rem/1.6 var(--f); -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p, ul, ol, figure, blockquote { margin: 0; } ul, ol { padding: 0; list-style: none; }
a { color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--lead-accent); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }
.rosette .spark { display: none; }
.rosette .petal { transform-box: fill-box; transform-origin: center; }

/* навігація між варіантами (лише для перегляду власником) */
.idea-nav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; padding: 18px clamp(16px, 4vw, 48px) calc(18px + env(safe-area-inset-bottom)); background: #0b1022; font: 500 .875rem var(--f); }
.idea-nav a { color: #c9d1e5; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.idea-nav a:hover { color: #fff; }

/* вікно форми */
html.dlg-open { overflow: hidden; }
.lead-dlg { padding: 0; border: 0; border-radius: var(--lead-r); width: min(100% - 24px, 480px); max-height: min(100dvh - 24px, 760px); overflow: auto; background: var(--lead-bg); color: var(--lead-ink); box-shadow: 0 40px 90px rgba(5, 10, 25, .45); font-family: var(--f); }
.lead-dlg::backdrop { background: rgba(8, 14, 34, .66); }
.lead-dlg[open] { animation: lead-in .45s var(--ease); }
@keyframes lead-in { from { opacity: 0; transform: translateY(24px); } }
.lead-box { padding: 30px 26px 26px; display: grid; gap: 14px; }
.lead-x { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; border: 0; background: none; color: var(--lead-muted); font-size: 1.9rem; line-height: 1; cursor: pointer; }
.lead-title, .lead-ok-t { font-size: 1.6rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; padding-right: 36px; outline: none; }
.lead-text { color: var(--lead-muted); font-size: .9688rem; margin-top: -4px; }
.lead-form { display: grid; gap: 14px; }
.lead-lvl { justify-self: start; padding: 6px 12px; border-left: 3px solid var(--lead-accent); background: rgba(127, 127, 127, .1); font-weight: 600; font-size: .875rem; }
.fld { display: grid; gap: 6px; min-width: 0; }
.fld label { font-size: .875rem; font-weight: 600; }
.fld input, .fld select { width: 100%; min-height: 52px; padding: 0 14px; border: 1.5px solid var(--lead-line); border-radius: var(--lead-r); background: #fff; color: #10172a; font: 400 1.0625rem/1.3 var(--f); }
.fld input:focus, .fld select:focus { outline: none; border-color: var(--lead-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lead-accent) 22%, transparent); }
.fld input[aria-invalid="true"] { border-color: #c01a1a; }
.err { color: #c01a1a; font-size: .8125rem; }
.lead-submit, .lead-again { min-height: 54px; border: 0; border-radius: var(--lead-r); background: var(--lead-accent); color: #fff; font: 600 1.0625rem var(--f); cursor: pointer; padding: 0 22px; }
.lead-again { justify-self: start; background: transparent; color: var(--lead-ink); border: 1.5px solid currentColor; }
.lead-hint { font-size: .8125rem; color: var(--lead-muted); }
.lead-ok { display: grid; gap: 12px; }
@media (max-width: 599px) { .lead-dlg { width: 100%; max-width: 100%; margin: auto 0 0; max-height: 94dvh; border-radius: var(--lead-r) var(--lead-r) 0 0; } }