:root {
--bk-navy: #141E72;
--bk-navy-deep: #0E1554;
--bk-yellow: #F4C70F;
--bk-yellow-hover: #E0B400;
--bk-yellow-tint: #FDF3D2;
--bk-cream: #F5EFE6;
--bk-gray: #F4F4F4;
--bk-blue-tint: #DFE7F7;
--bk-white: #FFFFFF;
--bk-ink: #1A1A1A;
--bk-muted: #5B6475;
--bk-border: #8C8577;
--bk-line: #E5DFD3;
--bk-success: #1F7A3E;
--bk-error: #B42318;
--bk-font-head: "Oswald", "Arial Narrow", Arial, sans-serif;
--bk-font-body: "Poppins", "Segoe UI", Arial, sans-serif;
--bk-container: 1140px;
--bk-narrow: 720px;
--bk-gutter: 20px;
--bk-section-y: 56px;
--bk-radius-btn: 10px;
--bk-radius-card: 14px;
--bk-shadow: 0 4px 20px rgba(20, 30, 114, 0.08);
}
@media (min-width: 768px) {
:root {
--bk-gutter: 24px;
--bk-section-y: 96px;
}
} .bk-prazna *,
.bk-prazna *::before,
.bk-prazna *::after {
box-sizing: border-box;
}
body.bk-prazna {
margin: 0;
background: var(--bk-white);
color: var(--bk-ink);
font-family: var(--bk-font-body);
font-size: 17px;
font-weight: 400;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
@media (min-width: 768px) {
body.bk-prazna {
font-size: 18px;
line-height: 1.65;
}
}
.bk-prazna img,
.bk-prazna svg,
.bk-prazna video {
display: block;
max-width: 100%;
height: auto;
}
.bk-prazna p,
.bk-prazna ul,
.bk-prazna ol {
margin: 0 0 1em;
}
.bk-prazna strong,
.bk-prazna b {
font-weight: 600;
}
.bk-prazna a {
color: var(--bk-navy);
text-decoration: underline;
text-underline-offset: 3px;
text-decoration-thickness: 1px;
}
.bk-prazna a:hover {
text-decoration-color: var(--bk-yellow);
text-decoration-thickness: 2px;
}
.bk-prazna :focus-visible {
outline: 3px solid var(--bk-navy);
outline-offset: 3px;
}
.bk-section--navy :focus-visible,
.bk-footer :focus-visible {
outline-color: var(--bk-yellow);
}
.bk-skip {
position: absolute;
left: -9999px;
top: 8px;
z-index: 1000;
padding: 8px 16px;
background: var(--bk-navy);
color: var(--bk-white) !important;
}
.bk-skip:focus {
left: 8px;
} .bk-prazna h1,
.bk-prazna h2 {
font-family: var(--bk-font-head);
font-weight: 600;
color: var(--bk-navy);
letter-spacing: 0;
margin: 0 0 24px;
}
.bk-prazna h1 {
font-size: 36px;
line-height: 1.1;
}
.bk-prazna h2 {
font-size: 28px;
line-height: 1.15;
}
.bk-prazna h3 {
font-family: var(--bk-font-body);
font-weight: 600;
font-size: 19px;
line-height: 1.35;
color: var(--bk-navy);
margin: 0 0 12px;
}
@media (min-width: 768px) {
.bk-prazna h1 { font-size: 56px; }
.bk-prazna h2 { font-size: 40px; margin-bottom: 32px; }
.bk-prazna h3 { font-size: 22px; }
}
.bk-lead {
font-size: 18px;
line-height: 1.5;
}
@media (min-width: 768px) {
.bk-lead { font-size: 21px; }
}
.bk-eyebrow {
display: inline-block;
margin: 0 0 16px;
padding: 4px 12px;
border-radius: 4px;
background: var(--bk-yellow);
color: var(--bk-navy);
font-size: 12px;
font-weight: 600;
line-height: 1.2;
letter-spacing: 0.08em;
text-transform: uppercase;
}
@media (min-width: 768px) {
.bk-eyebrow { font-size: 13px; }
}
.bk-meta {
font-size: 14px;
font-weight: 500;
line-height: 1.5;
color: var(--bk-muted);
} .bk-accent {
color: var(--bk-yellow);
} .bk-main {
display: block;
}
.bk-section {
padding: var(--bk-section-y) var(--bk-gutter);
background: var(--bk-white);
}
.bk-section--cream {
background: var(--bk-cream);
}
.bk-section--navy {
background: var(--bk-navy);
color: var(--bk-white);
}
.bk-section--navy h1,
.bk-section--navy h2,
.bk-section--navy h3,
.bk-section--navy a:not(.bk-btn) {
color: var(--bk-white);
}
.bk-section--navy .bk-meta {
color: #C9CEE6;
}
.bk-container {
max-width: var(--bk-container);
margin: 0 auto;
}
.bk-narrow {
max-width: var(--bk-narrow);
margin: 0 auto;
}
.bk-center {
text-align: center;
}
@media (max-width: 767px) {
.bk-center { text-align: left; }
}
.bk-grid {
display: grid;
gap: 16px;
}
@media (min-width: 768px) {
.bk-grid { gap: 24px; }
.bk-grid--2 { grid-template-columns: repeat(2, 1fr); }
.bk-grid--3 { grid-template-columns: repeat(3, 1fr); }
}
.bk-split {
display: grid;
gap: 32px;
align-items: center;
}
@media (min-width: 900px) {
.bk-split { grid-template-columns: 1.1fr 0.9fr; gap: 64px; }
} .bk-btn,
.bk-prazna a.bk-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 52px;
padding: 16px 28px;
border: 2px solid var(--bk-navy);
border-radius: var(--bk-radius-btn);
background: var(--bk-navy);
color: var(--bk-white);
font-family: var(--bk-font-body);
font-size: 17px;
font-weight: 600;
line-height: 1.2;
text-align: center;
text-decoration: none;
cursor: pointer;
transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.bk-btn:hover,
.bk-prazna a.bk-btn:hover {
background: var(--bk-navy-deep);
border-color: var(--bk-navy-deep);
color: var(--bk-white);
text-decoration: none;
} .bk-btn--yellow,
.bk-prazna a.bk-btn--yellow {
background: var(--bk-yellow);
border-color: var(--bk-yellow);
color: var(--bk-navy);
}
.bk-btn--yellow:hover,
.bk-prazna a.bk-btn--yellow:hover {
background: var(--bk-yellow-hover);
border-color: var(--bk-yellow-hover);
color: var(--bk-navy);
} .bk-btn--secondary,
.bk-prazna a.bk-btn--secondary {
background: transparent;
color: var(--bk-navy);
}
.bk-btn--secondary:hover,
.bk-prazna a.bk-btn--secondary:hover {
background: var(--bk-navy);
color: var(--bk-white);
}
.bk-btn--block {
display: flex;
width: 100%;
}
@media (max-width: 767px) {
.bk-btn--block-mobile {
display: flex;
width: 100%;
}
}
.bk-actions {
display: flex;
flex-wrap: wrap;
gap: 16px;
align-items: center;
margin: 32px 0 0;
}
@media (max-width: 767px) {
.bk-actions > .bk-btn {
flex: 1 1 100%;
}
}
.bk-btn + .bk-meta,
.bk-actions + .bk-meta {
margin-top: 12px;
} .bk-card {
padding: 20px;
border-radius: var(--bk-radius-card);
background: var(--bk-white);
box-shadow: var(--bk-shadow);
}
.bk-section:not(.bk-section--cream) .bk-card {
background: var(--bk-gray);
box-shadow: none;
}
@media (min-width: 768px) {
.bk-card { padding: 24px; }
}
.bk-card > :last-child,
.bk-note > :last-child,
.bk-mirror > :last-child {
margin-bottom: 0;
}
.bk-note,
.bk-mirror {
margin: 24px 0;
} .bk-note {
padding: 20px 24px;
border-radius: var(--bk-radius-card);
background: var(--bk-yellow-tint);
color: var(--bk-navy);
} .bk-mirror {
padding: 24px;
border-radius: var(--bk-radius-card);
background: var(--bk-blue-tint);
color: var(--bk-navy);
} .bk-check {
list-style: none;
padding: 0;
}
.bk-check li {
position: relative;
padding-left: 36px;
margin-bottom: 12px;
}
.bk-check li::before {
content: "";
position: absolute;
left: 0;
top: 0.3em;
width: 22px;
height: 22px;
border-radius: 50%;
background: var(--bk-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F4C70F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 14px no-repeat;
} .bk-cross {
list-style: none;
padding: 0;
}
.bk-cross li {
position: relative;
padding-left: 36px;
margin-bottom: 12px;
}
.bk-cross li::before {
content: "";
position: absolute;
left: 0;
top: 0.3em;
width: 22px;
height: 22px;
border-radius: 50%;
background: var(--bk-line) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6475' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / 12px no-repeat;
} .bk-rule {
width: 64px;
height: 4px;
margin: 24px 0;
border: 0;
border-radius: 2px;
background: var(--bk-yellow);
} .bk-thanks {
min-height: 70vh;
padding: 48px var(--bk-gutter);
background: var(--bk-cream);
}
.bk-thanks__card {
max-width: 720px;
margin: 0 auto;
padding: 32px 24px;
border-radius: var(--bk-radius-card);
background: var(--bk-white);
box-shadow: var(--bk-shadow);
}
@media (min-width: 768px) {
.bk-thanks { padding: 96px var(--bk-gutter); }
.bk-thanks__card { padding: 48px; }
}
.bk-thanks__icon {
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
margin: 0 0 24px;
border-radius: 50%;
background: var(--bk-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 28px no-repeat;
}
.bk-signature {
margin-top: 32px;
font-family: var(--bk-font-head);
font-size: 24px;
font-weight: 600;
color: var(--bk-navy);
} .bk-faq details {
border-bottom: 1px solid var(--bk-line);
}
.bk-faq summary {
position: relative;
padding: 20px 40px 20px 0;
font-weight: 600;
color: var(--bk-navy);
cursor: pointer;
list-style: none;
}
.bk-faq summary::-webkit-details-marker {
display: none;
}
.bk-faq summary::after {
content: "+";
position: absolute;
right: 4px;
top: 50%;
transform: translateY(-50%);
font-size: 24px;
font-weight: 400;
line-height: 1;
}
.bk-faq details[open] summary::after {
content: "\2212";
}
.bk-faq details > :not(summary) {
margin: 0 0 20px;
} .bk-testimonial {
padding: 24px;
border-radius: var(--bk-radius-card);
background: var(--bk-cream);
}
.bk-testimonial blockquote {
margin: 0 0 16px;
font-size: 18px;
}
.bk-testimonial__who {
display: flex;
align-items: center;
gap: 12px;
font-size: 14px;
font-weight: 600;
color: var(--bk-navy);
}
.bk-testimonial__who img {
width: 64px;
height: 64px;
border-radius: 50%;
object-fit: cover;
}
.bk-testimonial__who span {
display: block;
font-weight: 500;
color: var(--bk-muted);
}
.bk-result {
display: block;
margin-bottom: 12px;
font-family: var(--bk-font-head);
font-size: 28px;
font-weight: 600;
color: var(--bk-navy);
} .bk-header {
background: var(--bk-white);
border-bottom: 1px solid var(--bk-line);
}
.bk-header__in {
display: flex;
align-items: center;
justify-content: space-between;
max-width: var(--bk-container);
min-height: 56px;
margin: 0 auto;
padding: 0 var(--bk-gutter);
}
@media (min-width: 768px) {
.bk-header__in { min-height: 64px; }
}
.bk-prazna a.bk-logo {
display: inline-flex;
align-items: center;
gap: 12px;
color: var(--bk-navy);
text-decoration: none;
}
.bk-logo__mark {
display: block;
width: 44px;
color: var(--bk-navy);
}
.bk-logo__mark svg {
width: 100%;
height: auto;
}
.bk-logo__name {
font-family: var(--bk-font-body);
font-size: 17px;
font-weight: 600;
letter-spacing: 0.01em;
} .bk-footer {
padding: 48px var(--bk-gutter);
background: var(--bk-navy-deep);
color: var(--bk-white);
font-size: 15px;
}
.bk-footer__in {
max-width: var(--bk-container);
margin: 0 auto;
}
.bk-footer__links {
display: flex;
flex-wrap: wrap;
gap: 12px 32px;
margin-bottom: 24px;
}
.bk-prazna .bk-footer a {
color: var(--bk-white);
text-decoration: none;
}
.bk-prazna .bk-footer a:hover {
text-decoration: underline;
text-decoration-color: var(--bk-yellow);
}
.bk-footer__copy {
margin: 0;
color: #C9CEE6;
font-size: 14px;
} .bk-hide-mobile {
display: none;
}
@media (min-width: 768px) {
.bk-hide-mobile { display: initial; }
.bk-hide-desktop { display: none; }
}
.bk-sr-only {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
.bk-prazna * {
transition: none !important;
scroll-behavior: auto !important;
}
}