/* BasicFor holding page. Graphite + amber, mono for the wordmark and accents.
   Text is Polish, derived from the Russian source — not reviewed by a native speaker. */
:root{
  --graphite:#15181B;
  --graphite-2:#1D2126;
  --paper:#F5F4F1;
  --paper-2:#EDEBE6;
  --amber:#D97A15;
  --amber-ink:#A85C0C;
  --amber-on-dark:#E79A44;
  --ink:#15181B;
  --body:#4B545D;
  --body-dark:#AFB7BF;
  --line:#DFDCD5;
  --line-dark:#2B3036;
  --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sans:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme: light;
}

*{box-sizing:border-box}

body{
  margin:0;
  background:var(--paper);
  color:var(--body);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.col{max-width:640px;margin-inline:auto;padding-inline:24px}

/* --- hero --- */

.hero{background:var(--graphite);color:#fff}
.hero .col{padding-block:56px 52px;display:flex;flex-direction:column;gap:18px}

/* Logo slot: the mark goes here, to the left of the wordmark. */
.brand{display:flex;align-items:center;gap:14px}
.mark{width:48px;height:48px;display:block;flex:none}

.wordmark{
  margin:0;
  font-family:var(--mono);
  font-weight:700;
  font-size:clamp(30px,7vw,40px);
  letter-spacing:-.03em;
  color:#fff;
}

.eyebrow{
  margin:0;
  font-family:var(--mono);
  font-size:11.5px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--amber-on-dark);
}

h1{
  margin:0;
  font-weight:700;
  font-size:clamp(27px,6.2vw,36px);
  line-height:1.2;
  letter-spacing:-.02em;
  color:#fff;
  text-wrap:balance;
}

.lede{margin:0;font-size:17px;color:var(--body-dark);max-width:44ch}

/* --- pains --- */

section{padding-block:44px}
section + section{padding-top:0}

h2{
  margin:0 0 18px;
  font-family:var(--mono);
  font-size:11.5px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--amber-ink);
}

ul{list-style:none;margin:0;padding:0}

.pains li{
  padding:13px 0;
  border-bottom:1px solid var(--line);
  color:var(--ink);
  font-size:16.5px;
  display:flex;
  gap:12px;
  align-items:baseline;
}
.pains li:first-child{border-top:1px solid var(--line)}
.pains li b{font-family:var(--mono);font-weight:600;color:var(--amber);flex:none;font-size:14px}

/* --- proof --- */

.proof{
  background:var(--paper-2);
  border-left:3px solid var(--amber);
  padding:20px 22px;
  border-radius:0 8px 8px 0;
}
.proof p{margin:0;font-size:16.5px;color:var(--ink)}
.proof p + p{margin-top:10px;color:var(--body);font-size:15.5px}

/* --- solutions --- */

.sol li{padding:15px 0;border-bottom:1px solid var(--line)}
.sol li:first-child{border-top:1px solid var(--line)}
.sol .name{font-weight:600;color:var(--ink);font-size:16.5px}
.sol .meta{margin-top:3px;font-size:14.5px;color:var(--body)}
.sol .term{font-family:var(--mono);font-size:13px;color:var(--amber-ink)}
.pilot{margin:0;font-size:16.5px;color:var(--ink);max-width:48ch}

/* --- contact --- */

.contact{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:18px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  text-decoration:none;
  color:inherit;
  transition:background-color .15s ease;
}
.contact:hover{background:var(--paper-2)}
.contact:focus-visible{outline:2px solid var(--amber-ink);outline-offset:3px;border-radius:4px}
.contact .label{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--amber-ink)}
.contact .value{font-size:clamp(19px,4.4vw,23px);font-weight:600;color:var(--ink);letter-spacing:-.01em;word-break:break-word}

.note{margin:20px 0 0;font-size:13.5px;line-height:1.5;max-width:52ch}

footer{
  margin-top:26px;
  padding:22px 0 44px;
  border-top:1px solid var(--line);
  font-family:var(--mono);
  font-size:12.5px;
  color:var(--body);
}

@media (prefers-reduced-motion:reduce){*{transition:none !important}}