/* ==========================================================================
   Kocial sections (block patterns) — used on the site and inside the editor.
   ========================================================================== */

.kb-page { overflow-x: hidden; }
.kb-page > :not(.kb-section):not(.alignfull) { max-width: 800px; margin-left: auto; margin-right: auto; padding-left: clamp(20px, 4.5vw, 64px); padding-right: clamp(20px, 4.5vw, 64px); box-sizing: content-box; }

.kb-section {
	--kb-blue: #0039c7; --kb-yellow: #f9e14e; --kb-burst: #fee415; --kb-red: #ee4557; --kb-muted: #3d3d3d; --kb-soft: #ccd7f4;
	position: relative; margin: 0 !important; padding: clamp(56px, 7vw, 104px) 0;
	font-family: Chivo, "Helvetica Neue", Arial, sans-serif;
}
.kb-section--tight { padding: clamp(32px, 4vw, 56px) 0; }
.kb-inner { max-width: 1440px; margin-left: auto !important; margin-right: auto !important; padding-left: clamp(20px, 4.5vw, 64px); padding-right: clamp(20px, 4.5vw, 64px); box-sizing: border-box; }
.kb-narrow { max-width: calc(800px + 2 * clamp(20px, 4.5vw, 64px)); }
.kb-section .wp-block-columns { gap: clamp(24px, 3vw, 40px); margin-bottom: 0; }
.kb-section .wp-block-column { flex: 1 1 0; min-width: 0; }
.kb-section .wp-block-column[style*="flex-basis"] { flex-grow: 0; }
.kb-steps, .kb-team, .kb-stats, .kb-gallery, .kb-cards, .kb-faq-wrap { align-items: flex-start !important; }
@media (max-width: 781px) {
	.kb-section .wp-block-columns { flex-wrap: wrap !important; }
	.kb-section .wp-block-column, .kb-section .wp-block-column[style*="flex-basis"] { flex-basis: 100% !important; }
}
.kb-section p { margin: 0 0 1em; }
.kb-section h1, .kb-section h2, .kb-section h3 { margin: 0 0 .5em; font-weight: 800; letter-spacing: -.03em; line-height: 1.05; }

/* Type */
.kb-display { font-size: clamp(48px, 6.4vw, 96px) !important; line-height: .98 !important; letter-spacing: -.04em !important; }
.kb-h2 { font-size: clamp(34px, 4vw, 56px) !important; color: var(--kb-blue); }
.kb-section h3 { font-size: clamp(21px, 1.8vw, 26px); letter-spacing: -.02em; }
.kb-lead { font-size: clamp(17px, 1.4vw, 21px); line-height: 1.65; color: var(--kb-muted); }
.kb-label { font-size: 15px; font-style: italic; color: var(--kb-blue); margin-bottom: 12px !important; }
.kb-eyebrow { display: inline-block; padding: 8px 18px; border-radius: 999px; background: var(--kb-yellow); color: #000; font-size: 14px; font-weight: 700; }
.kb-more a { font-weight: 700; color: var(--kb-blue); text-decoration: none; }

/* Buttons: outlined capsules */
.kb-section .wp-block-button__link, .kb-section .wp-block-button.is-style-outline .wp-block-button__link {
	display: inline-flex; align-items: center; min-height: 56px; padding: 0 30px; border-radius: 999px;
	border: 2px solid currentColor; background: transparent; color: var(--kb-blue); font-weight: 700; font-size: 17px; text-decoration: none;
	transition: background .35s, color .35s, transform .35s;
}
.kb-section .wp-block-button__link:hover { background: var(--kb-blue); color: #fff; transform: translateY(-2px); }

/* Blue and yellow bands with wavy edges */
.kb-blue { background: var(--kb-blue); color: #fff; }
.kb-blue .kb-h2, .kb-blue h1, .kb-blue h2, .kb-blue h3 { color: #fff; }
.kb-blue .kb-lead, .kb-blue p { color: var(--kb-soft); }
.kb-blue .kb-eyebrow { color: #000; }
.kb-blue .wp-block-button__link { color: #fff !important; }
.kb-blue .wp-block-button__link:hover { background: #fff; color: var(--kb-blue) !important; }
.kb-yellow { background: var(--kb-yellow); color: #000; }
.kb-yellow .kb-h2 { color: #000; }
.kb-wave-top::before, .kb-wave-bottom::after {
	content: ""; position: absolute; left: 0; right: 0; height: clamp(40px, 6vw, 90px); pointer-events: none;
	background-repeat: no-repeat; background-size: 100% 100%;
}
.kb-wave-top::before { bottom: calc(100% - 1px); }
.kb-wave-bottom::after { top: calc(100% - 1px); }
.kb-blue.kb-wave-top::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,70 C240,130 460,10 720,50 C980,90 1200,10 1440,60 L1440,120 L0,120 Z' fill='%230039c7'/%3E%3C/svg%3E"); }
.kb-blue.kb-wave-bottom::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L1440,0 L1440,50 C1180,110 980,20 720,70 C460,120 220,30 0,80 Z' fill='%230039c7'/%3E%3C/svg%3E"); }
.kb-yellow.kb-wave-top::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,70 C240,130 460,10 720,50 C980,90 1200,10 1440,60 L1440,120 L0,120 Z' fill='%23f9e14e'/%3E%3C/svg%3E"); }
.kb-yellow.kb-wave-bottom::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L1440,0 L1440,50 C1180,110 980,20 720,70 C460,120 220,30 0,80 Z' fill='%23f9e14e'/%3E%3C/svg%3E"); }
.kb-wave-bottom + .kb-section { padding-top: calc(clamp(56px, 7vw, 104px) + clamp(40px, 6vw, 90px)); }
.kb-section:has(+ .kb-wave-top) { padding-bottom: calc(clamp(56px, 7vw, 104px) + clamp(40px, 6vw, 90px)); }

/* Images */
.kb-section .wp-block-image { margin: 0 0 16px; }
.kb-section .wp-block-image img { width: 100%; height: auto; display: block; }
.kb-rounded img { border-radius: 40px; aspect-ratio: 4 / 3; object-fit: cover; }
.kb-portrait img { aspect-ratio: 3 / 4; }
.kb-gallery .wp-block-column:nth-child(2) .kb-portrait img { border-radius: 400px 400px 40px 40px; }
.kb-circle img { border-radius: 50%; aspect-ratio: 1; object-fit: cover; max-width: 300px; margin: 0 auto; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.kb-person:hover .kb-circle img { transform: scale(1.04) rotate(-3deg); }
.kb-blob { position: relative; aspect-ratio: 1; border: 6px solid #000; overflow: hidden; border-radius: 58% 42% 55% 45% / 48% 60% 40% 52%; animation: kbMorph 14s ease-in-out infinite; }
.kb-blob img { width: 100%; height: 100% !important; object-fit: contain; object-position: center bottom; }
.kb-sunburst { background: repeating-conic-gradient(from 0deg at 50% 55%, var(--kb-burst) 0deg 8deg, var(--kb-yellow) 8deg 16deg); }
@keyframes kbMorph {
	0%, 100% { border-radius: 58% 42% 55% 45% / 48% 60% 40% 52%; }
	50% { border-radius: 42% 58% 45% 55% / 60% 42% 58% 40%; }
}
.kb-hero .wp-block-column:last-child { max-width: 600px; margin-left: auto; }

/* Cards */
.kb-cards { margin-top: 40px; }
.kb-card { padding: clamp(28px, 3vw, 40px); border-radius: 48px; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.kb-card:hover, .kb-imgcard:hover { transform: translateY(-8px); }
.kb-imgcard { transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.kb-card--line { border: 2px solid var(--kb-blue); }
.kb-card--line h3 { color: var(--kb-blue); }
.kb-card--line p { color: var(--kb-muted); }
.kb-card--blue { background: var(--kb-blue); color: #fff; }
.kb-card--blue h3 { color: #fff; }
.kb-card--blue p { color: var(--kb-soft); }
.kb-card--yellow { background: var(--kb-yellow); color: #000; }
.kb-num { font-size: 15px; font-weight: 800; color: var(--kb-red) !important; }
.kb-card--blue .kb-num { color: var(--kb-yellow) !important; }
.kb-card--yellow .kb-num { color: #000 !important; }
@media (min-width: 782px) { .kb-cards > .kb-card:nth-child(2) { margin-top: 48px; } }

/* Stats */
.kb-stat { border-top: 2px solid var(--kb-blue); padding-top: 20px; }
.kb-stat__num { font-size: clamp(44px, 5vw, 72px); font-weight: 800; letter-spacing: -.04em; line-height: 1 !important; color: var(--kb-blue); margin-bottom: 8px !important; }
.kb-stat__label { color: var(--kb-muted); }

/* Steps (dark panel) */
.kb-dark { background: #000; color: #fff; border-radius: 64px; padding-top: clamp(40px, 5vw, 64px); padding-bottom: clamp(40px, 5vw, 64px); max-width: calc(1440px - 2 * clamp(20px, 4.5vw, 64px)); width: calc(100% - 2 * clamp(20px, 4.5vw, 64px)); overflow: hidden; position: relative; }
.kb-dark .kb-h2, .kb-dark h3 { color: #fff; }
.kb-dark p { color: #ccc; }
.kb-steps { margin-top: 32px; }
.kb-step__num { font-size: 64px; font-weight: 800; letter-spacing: -.04em; line-height: 1 !important; color: var(--kb-yellow) !important; margin-bottom: 12px !important; }

/* Quote */
.kb-quote { text-align: center; max-width: 1100px; }
.kb-quote__text { font-size: clamp(26px, 3vw, 40px); line-height: 1.3; font-weight: 500; letter-spacing: -.02em; }
.kb-quote__by { font-size: 17px; }

/* Team */
.kb-team { margin-top: 40px; text-align: center; }
.kb-team h3 { margin-top: 16px; }
.kb-team p { color: var(--kb-muted); }

/* FAQ */
.kb-faq { border-bottom: 2px solid var(--kb-blue); padding: 24px 0; }
.kb-faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 24px; font-size: clamp(18px, 1.6vw, 22px); font-weight: 700; color: var(--kb-blue); }
.kb-faq summary::-webkit-details-marker { display: none; }
.kb-faq summary::after { content: "+"; flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; background: var(--kb-blue); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 400; transition: transform .4s, background .3s; }
.kb-faq[open] summary::after { transform: rotate(135deg); background: var(--kb-red); color: #000; }
.kb-faq p { margin-top: 16px !important; color: var(--kb-muted); font-size: 17px; }

/* CTA box */
.kb-cta { position: relative; overflow: hidden; background: var(--kb-blue); color: #fff; border-radius: 64px; padding: clamp(48px, 7vw, 96px) clamp(28px, 6vw, 80px) !important; max-width: calc(1440px - 2 * clamp(20px, 4.5vw, 64px)); width: calc(100% - 2 * clamp(20px, 4.5vw, 64px)); }
.kb-cta::after { content: ""; position: absolute; right: -80px; top: -120px; width: min(460px, 55vw); aspect-ratio: 1; background: repeating-conic-gradient(from 0deg at 50% 50%, var(--kb-burst) 0deg 8deg, var(--kb-yellow) 8deg 16deg); border-radius: 58% 42% 55% 45% / 48% 60% 40% 52%; animation: kbMorph 14s ease-in-out infinite; }
.kb-cta > * { position: relative; z-index: 1; max-width: 720px; }
.kb-cta__title { font-size: clamp(38px, 5vw, 68px) !important; color: #fff !important; }
.kb-cta__text { font-size: 20px; color: var(--kb-soft); }
.kb-cta .wp-block-button__link { color: #fff !important; }
.kb-cta .wp-block-button__link:hover { background: #fff; color: var(--kb-blue) !important; }

/* Scroll reveal for sections (front end only, set up by main.js) */
.js .kb-page .kb-section .kb-inner { opacity: 0; transform: translateY(36px); transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1); }
.js .kb-page .kb-section .kb-inner.is-in { opacity: 1; transform: none; }

/* Phones */
@media (max-width: 781px) {
	.kb-hero .wp-block-column:last-child { max-width: 420px; margin: 24px auto 0; }
	.kb-rounded img, .kb-portrait img { border-radius: 32px; }
	.kb-dark, .kb-cta { border-radius: 40px; }
	.kb-stats { display: grid !important; grid-template-columns: 1fr 1fr; }
	.kb-team { display: grid !important; grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.kb-blob, .kb-cta::after { animation: none; }
	.js .kb-page .kb-section .kb-inner { opacity: 1; transform: none; }
}