/*
Theme Name: Konekta
Theme URI: https://konekta-abc.nl/
Description: A custom community theme for Konekta.
Author: Konekta
Author URI: https://konekta-abc.nl/
Version: 2.2.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: konekta
*/

:root {
  --k-blue: #092d63;
  --k-blue-2: #0d438e;
  --k-teal: #009d9a;
  --k-teal-dark: #007b79;
  --k-coral: #ff6b57;
  --k-gold: #f4bd43;
  --k-ink: #14263d;
  --k-muted: #617087;
  --k-bg: #f6f9fc;
  --k-card: #ffffff;
  --k-line: #dce6ef;
  --k-radius: 22px;
  --k-radius-lg: 34px;
  --k-shadow: 0 18px 55px rgba(9,45,99,.11);
  --k-shadow-soft: 0 8px 30px rgba(9,45,99,.08);
  --k-max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--k-ink);
  background: var(--k-bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--k-blue-2); text-decoration: none; }
a:hover { color: var(--k-teal-dark); }
button, input, select, textarea { font: inherit; }
.k-container { width: min(calc(100% - 36px), var(--k-max)); margin-inline: auto; }
.k-section { padding: 84px 0; }
.k-section--tight { padding: 58px 0; }
.k-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; color: var(--k-teal-dark); font-size: .8rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.k-eyebrow::before { content: ""; width: 28px; height: 3px; border-radius: 99px; background: var(--k-gold); }
.k-title { margin: 0; color: var(--k-blue); font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.08; letter-spacing: -.045em; }
.k-lead { max-width: 680px; margin: 18px 0 0; color: var(--k-muted); font-size: 1.08rem; }

/* Header */
.k-header { position: sticky; top: 0; z-index: 1000; background: rgba(255,255,255,.96); border-bottom: 1px solid rgba(220,230,239,.9); backdrop-filter: blur(16px); }
.k-header__inner { min-height: 78px; display: flex; align-items: center; gap: 20px; }
.k-brand { display: inline-flex; align-items: center; gap: 12px; flex: 0 0 auto; color: var(--k-blue); }
.k-brand__mark { position: relative; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; background: linear-gradient(145deg,var(--k-teal),var(--k-blue-2)); color: #fff; font-size: 1.5rem; font-weight: 900; box-shadow: 0 10px 25px rgba(0,157,154,.25); }
.k-brand__mark::after { content: ""; position: absolute; right: -4px; top: -4px; width: 11px; height: 11px; border-radius: 50%; background: var(--k-gold); box-shadow: -12px 4px 0 var(--k-coral), -4px 16px 0 #56c6e7; }
.k-brand__text { display: grid; line-height: 1; }
.k-brand__name { font-size: 1.3rem; font-weight: 900; letter-spacing: -.035em; }
.k-brand__tag { margin-top: 6px; color: var(--k-muted); font-size: .72rem; font-weight: 700; }
.k-nav { margin-left: auto; min-width: 0; }
.k-nav ul { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.k-nav a { display: block; padding: 9px 8px; border-radius: 11px; color: var(--k-blue); font-size: .82rem; font-weight: 750; white-space: nowrap; }
.k-nav a:hover { color: var(--k-teal-dark); background: #eef8f7; }
.k-header__tools { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.k-language { display: inline-flex; align-items: center; gap: 3px; padding: 4px; border: 1px solid var(--k-line); border-radius: 12px; background: #fff; box-shadow: 0 4px 14px rgba(9,45,99,.05); }
.k-language > span { display: none; }
.k-language__link { display: inline-flex; align-items: center; min-height: 34px; padding: 0 10px; border-radius: 9px; color: var(--k-muted); font-size: .76rem; font-weight: 850; white-space: nowrap; }
.k-language__link:hover { color: var(--k-blue); background: #f1f6fb; }
.k-language__link.is-current { color: #fff; background: var(--k-blue); }
.k-header__cta { display: inline-flex; align-items: center; justify-content: center; min-height: 43px; padding: 0 15px; border-radius: 13px; color: #fff; background: var(--k-blue); font-size: .86rem; font-weight: 800; white-space: nowrap; }
.k-header__cta:hover { color: #fff; background: var(--k-teal-dark); }
.k-menu-toggle { display: none; width: 44px; height: 44px; margin-left: auto; border: 1px solid var(--k-line); border-radius: 13px; background: #fff; color: var(--k-blue); cursor: pointer; }

/* Hero */
.k-hero { position: relative; overflow: hidden; padding: 88px 0 78px; background: linear-gradient(135deg,#f5fbff 0%,#eef9f7 48%,#fff8ec 100%); }
.k-hero::before,.k-hero::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.k-hero::before { width: 520px; height: 520px; right: -130px; top: -210px; background: radial-gradient(circle,rgba(86,198,231,.32),rgba(86,198,231,0) 68%); }
.k-hero::after { width: 440px; height: 440px; left: -170px; bottom: -260px; background: radial-gradient(circle,rgba(244,189,67,.28),rgba(244,189,67,0) 70%); }
.k-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: 64px; }
.k-hero h1 { max-width: 680px; margin: 0; color: var(--k-blue); font-size: clamp(3rem,6vw,5.6rem); line-height: .96; letter-spacing: -.065em; }
.k-hero h1 span { color: var(--k-teal); }
.k-hero__copy > p { max-width: 620px; margin: 24px 0 0; color: #465b72; font-size: 1.15rem; }
.k-hero__actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 32px; }
.k-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 24px; border: 0; border-radius: 15px; font-weight: 850; transition: transform .2s ease,box-shadow .2s ease,background .2s ease; }
.k-btn:hover { transform: translateY(-2px); }
.k-btn--primary { color: #fff; background: linear-gradient(135deg,var(--k-teal),var(--k-teal-dark)); box-shadow: 0 14px 30px rgba(0,157,154,.23); }
.k-btn--primary:hover { color: #fff; }
.k-btn--secondary { color: var(--k-blue); background: #fff; border: 1px solid var(--k-line); box-shadow: var(--k-shadow-soft); }
.k-hero__trust { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 30px; color: var(--k-muted); font-size: .9rem; font-weight: 700; }
.k-hero__trust span::before { content: "✓"; margin-right: 7px; color: var(--k-teal); font-weight: 900; }
.k-visual { position: relative; min-height: 465px; }
.k-visual__panel { position: absolute; inset: 28px 0 22px 32px; overflow: hidden; border: 9px solid rgba(255,255,255,.85); border-radius: 42px; background: linear-gradient(180deg,#75d3eb 0 35%,#19a8bd 35% 54%,#f7d780 54% 72%,#42a86b 72%); box-shadow: var(--k-shadow); transform: rotate(2deg); }
.k-visual__sun { position: absolute; right: 58px; top: 55px; width: 76px; height: 76px; border-radius: 50%; background: var(--k-gold); box-shadow: 0 0 0 18px rgba(244,189,67,.17); }
.k-visual__island { position: absolute; left: -7%; right: -7%; bottom: -10%; height: 48%; border-radius: 50% 48% 0 0; background: linear-gradient(180deg,#56b872,#1c774a); transform: rotate(-3deg); }
.k-visual__houses { position: absolute; left: 10%; right: 9%; bottom: 23%; display: flex; align-items: flex-end; justify-content: center; gap: 5px; }
.k-house { position: relative; width: 52px; height: 92px; border-radius: 6px 6px 2px 2px; background: #ff8c61; box-shadow: inset 0 -18px rgba(0,0,0,.06); }
.k-house:nth-child(2){height:118px;background:#f7c446}.k-house:nth-child(3){height:102px;background:#45b5d0}.k-house:nth-child(4){height:132px;background:#ef707d}.k-house:nth-child(5){height:96px;background:#f6a251}
.k-house::before { content: ""; position: absolute; left: -5px; right: -5px; top: -19px; height: 25px; background: inherit; clip-path: polygon(50% 0,100% 100%,0 100%); }
.k-house::after { content: ""; position: absolute; left: 14px; bottom: 15px; width: 14px; height: 25px; border-radius: 7px 7px 0 0; background: rgba(255,255,255,.78); box-shadow: 22px -38px 0 -3px rgba(255,255,255,.78),0 -38px 0 -3px rgba(255,255,255,.78); }
.k-visual__card { position: absolute; left: -6px; bottom: 10px; width: 245px; padding: 20px; border-radius: 22px; background: rgba(255,255,255,.95); box-shadow: var(--k-shadow); }
.k-visual__card strong { display:block;color:var(--k-blue);font-size:1.05rem }.k-visual__card span { display:block;margin-top:5px;color:var(--k-muted);font-size:.86rem }
.k-visual__badge { position:absolute;right:-8px;top:18px;padding:11px 16px;border-radius:999px;color:var(--k-blue);background:#fff;box-shadow:var(--k-shadow-soft);font-size:.84rem;font-weight:850 }

/* Cards and content */
.k-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px }
.k-card { position:relative;overflow:hidden;min-height:225px;padding:28px;border:1px solid var(--k-line);border-radius:var(--k-radius);background:var(--k-card);box-shadow:var(--k-shadow-soft);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease }
.k-card:hover { transform:translateY(-6px);border-color:rgba(0,157,154,.35);box-shadow:var(--k-shadow) }
.k-card__icon { width:54px;height:54px;display:grid;place-items:center;border-radius:17px;background:#e8f8f6;color:var(--k-teal-dark);font-size:1.5rem }
.k-card:nth-child(2) .k-card__icon,.k-card:nth-child(5) .k-card__icon{background:#edf2fb;color:var(--k-blue-2)}
.k-card:nth-child(3) .k-card__icon,.k-card:nth-child(6) .k-card__icon{background:#fff5dc;color:#a66a00}
.k-card h3{margin:22px 0 8px;color:var(--k-blue);font-size:1.16rem;line-height:1.25}.k-card p{margin:0;color:var(--k-muted);font-size:.95rem}.k-card__arrow{position:absolute;right:22px;bottom:20px;color:var(--k-teal);font-weight:900}
.k-community{overflow:hidden;border-radius:var(--k-radius-lg);background:var(--k-blue);color:#fff;box-shadow:var(--k-shadow)}
.k-community__inner{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:48px;padding:58px}.k-community h2{margin:0;font-size:clamp(2rem,4vw,3.4rem);line-height:1.05;letter-spacing:-.045em}.k-community p{margin:18px 0 0;color:#cbd9ea}
.k-community__stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.k-stat{padding:21px;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:rgba(255,255,255,.07)}.k-stat strong{display:block;color:#fff;font-size:1.45rem}.k-stat span{color:#cbd9ea;font-size:.83rem}
.k-main{min-height:55vh}.k-content-wrap{width:min(calc(100% - 36px),920px);margin:58px auto 80px;padding:42px;border:1px solid var(--k-line);border-radius:var(--k-radius);background:#fff;box-shadow:var(--k-shadow-soft)}
.k-content-wrap h1,.k-content-wrap h2,.k-content-wrap h3{color:var(--k-blue);line-height:1.15}.k-content-wrap h1{margin-top:0;font-size:clamp(2.2rem,5vw,4rem);letter-spacing:-.04em}
.k-content-wrap input,.k-content-wrap select,.k-content-wrap textarea,.hp-field{width:100%;max-width:100%;min-height:48px;padding:10px 13px;border:1px solid var(--k-line);border-radius:12px;background:#fff}.k-content-wrap button,.k-content-wrap input[type="submit"],.hp-form__button{width:auto;padding:12px 20px;border:0;border-radius:13px;color:#fff;background:var(--k-teal);font-weight:800;cursor:pointer}
.hp-listing,.hp-listing-category,.hp-vendor,.hp-widget,.hp-form{overflow:hidden;border:1px solid var(--k-line)!important;border-radius:18px!important;background:#fff;box-shadow:var(--k-shadow-soft)}.hp-listing__content,.hp-listing-category__content,.hp-vendor__content{padding:20px!important}

/* Footer */
.k-footer{margin-top:60px;color:#d8e4f3;background:#061f45}.k-footer__grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:55px;padding:62px 0 42px}.k-footer .k-brand{color:#fff}.k-footer .k-brand__tag{color:#aec0d5}.k-footer p{max-width:430px;color:#aec0d5}.k-footer h3{margin-top:0;color:#fff;font-size:.95rem;text-transform:uppercase;letter-spacing:.08em}.k-footer ul{margin:0;padding:0;list-style:none}.k-footer li+li{margin-top:9px}.k-footer a{color:#cbd9ea}.k-footer a:hover{color:#fff}.k-footer__bottom{display:flex;justify-content:space-between;gap:20px;padding:22px 0;border-top:1px solid rgba(255,255,255,.12);color:#91a8c2;font-size:.84rem}

/* Scroll reveal motion */
.k-motion-ready .k-reveal { opacity: 0; transform: translate3d(0,42px,0) scale(.985); transition: opacity .75s cubic-bezier(.2,.7,.2,1), transform .75s cubic-bezier(.2,.7,.2,1); transition-delay: var(--k-reveal-delay,0ms); will-change: opacity,transform; }
.k-motion-ready .k-reveal.is-visible { opacity: 1; transform: translate3d(0,0,0) scale(1); }
.k-motion-ready .k-card.k-reveal:nth-child(3n+2) { transform: translate3d(0,54px,0) scale(.98); }
.k-motion-ready .k-card.k-reveal.is-visible { transform: translate3d(0,0,0) scale(1); }

@media (max-width:1180px){.k-header__cta{display:none}.k-nav a{padding-inline:7px;font-size:.78rem}.k-header__inner{gap:12px}}
@media (max-width:980px){.k-header__inner{min-height:68px}.k-menu-toggle{display:grid;place-items:center}.k-nav{position:absolute;left:18px;right:18px;top:calc(100% + 10px);display:none;padding:14px;border:1px solid var(--k-line);border-radius:18px;background:#fff;box-shadow:var(--k-shadow)}.k-nav.is-open{display:block}.k-nav ul{align-items:stretch;flex-direction:column}.k-nav a{padding:12px 14px;font-size:.95rem}.k-header__tools{margin-left:auto}.k-hero{padding:66px 0 58px}.k-hero__grid{grid-template-columns:1fr;gap:36px}.k-visual{min-height:400px}.k-grid{grid-template-columns:repeat(2,1fr)}.k-community__inner{grid-template-columns:1fr;padding:42px}.k-footer__grid{grid-template-columns:1fr 1fr}.k-footer__brand{grid-column:1/-1}}
@media (max-width:620px){.k-container{width:min(calc(100% - 24px),var(--k-max))}.k-section{padding:62px 0}.k-brand__tag{display:none}.k-header__tools{gap:6px}.k-language__link{min-height:32px;padding:0 8px;font-size:.7rem}.k-header__cta{display:none}.k-hero h1{font-size:clamp(2.8rem,15vw,4.25rem)}.k-hero__copy>p{font-size:1rem}.k-hero__actions{flex-direction:column}.k-btn{width:100%}.k-hero__trust{display:grid;gap:8px}.k-visual{min-height:330px}.k-visual__panel{inset:16px 8px 18px 18px;border-radius:30px}.k-visual__card{left:0;width:210px;padding:16px}.k-visual__badge{right:0}.k-house{width:39px}.k-grid{grid-template-columns:1fr}.k-card{min-height:0}.k-community__inner{padding:32px 24px}.k-community__stats{grid-template-columns:1fr}.k-content-wrap{width:min(calc(100% - 24px),920px);margin-top:28px;padding:24px}.k-footer__grid{grid-template-columns:1fr;gap:34px}.k-footer__brand{grid-column:auto}.k-footer__bottom{flex-direction:column}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.k-reveal{opacity:1!important;transform:none!important}}