/* =====================================================================
   KISO — Child Theme CSS (Bootstrap 5)
   Optimized, de-duplicated, accessible, animation-safe
   ===================================================================== */

/* ---------------------------------
   Design tokens / CSS variables
---------------------------------- */
:root {
  /* Brand */
  --kiso-primary: #ff6600;
  --kiso-primary-600: #e65c00;
  --kiso-primary-100: rgba(255, 102, 0, 0.1);
  --kiso-dark: #0b0f1c;
  --kiso-ink: #1d2230;
  --kiso-muted: #6b7280;
  --kiso-border: #e9edf2;
  --kiso-bg: #f8fafc;

  /* Shadows / radii */
  --kiso-radius: 14px;
  --kiso-radius-xl: 18px;
  --kiso-shadow-sm: 0 8px 30px rgba(15,19,32,.06);
  --kiso-shadow-md: 0 16px 40px rgba(0,0,0,.08);
  --kiso-shadow-lg: 0 30px 80px rgba(16,24,40,.18);
}

/* Sync Bootstrap colors */
:root {
  --bs-primary: var(--kiso-primary);
  --bs-link-color: var(--kiso-primary);
  --bs-link-hover-color: var(--kiso-primary-600);
}

/* ---------------------------------
   Base / reset
---------------------------------- */
html { scroll-behavior: smooth; }
body { color: var(--kiso-ink); background:#fff; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--kiso-primary); }
img { display:block; max-width:100%; height:auto; }
:focus-visible { outline: 3px solid var(--kiso-primary); outline-offset: 2px; border-radius: 6px; }
.container-narrow { max-width: 1040px; margin-inline: auto; }
.section{ padding:72px 0; } .section-sm{ padding:48px 0; } .section-lg{ padding:96px 0; }
.section-muted{ background: var(--kiso-bg); }
.rounded-xl{ border-radius: var(--kiso-radius-xl); }
.shadow-xl{ box-shadow: var(--kiso-shadow-lg); }

/* Buttons */
.btn { border-radius: 12px; }
.btn-primary {
  --bs-btn-bg: var(--kiso-primary);
  --bs-btn-border-color: var(--kiso-primary);
  --bs-btn-hover-bg: var(--kiso-primary-600);
  --bs-btn-hover-border-color: var(--kiso-primary-600);
  --bs-btn-focus-shadow-rgb: 255,102,0;
}
.btn-outline-primary {
  --bs-btn-color: var(--kiso-primary);
  --bs-btn-border-color: var(--kiso-primary);
  --bs-btn-hover-bg: var(--kiso-primary);
  --bs-btn-hover-border-color: var(--kiso-primary);
  --bs-btn-hover-color: #fff;
}
.badge-primary-soft { background: var(--kiso-primary-100); color: var(--kiso-primary); border:1px solid rgba(255,102,0,.25); }
.text-kiso { color: var(--kiso-primary) !important; }
.bg-kiso { background: var(--kiso-primary) !important; }
.border-kiso { border-color: var(--kiso-primary) !important; }

/* ---------------------------------
   Top bar
---------------------------------- */
.mdy-top-header{ background: rgba(30,30,30,.92); color:#fff; }
.mdy-top-header .link-light{ opacity:.9; }
.mdy-top-header .link-light:hover{ opacity:1; }

/* ---------------------------------
   Header / Navbar / Navwalker
---------------------------------- */
.site-header{ background:#fff; border-bottom:1px solid var(--kiso-border); }
.navbar{ position:relative; z-index:1030; transition:box-shadow .2s ease, background .2s ease; }
.is-scrolled .navbar{ box-shadow: var(--kiso-shadow-sm); }
.navbar .navbar-brand img{ max-height:52px; width:auto; }
.navbar.navbar-light .navbar-nav .nav-link{ color:var(--kiso-ink); font-weight:500; }
.navbar.navbar-light .navbar-nav .nav-link:hover, .navbar.navbar-light .navbar-nav .nav-link:focus{ color:var(--kiso-primary); }
.navbar .nav-link.active, .navbar .menu-item.current-menu-item > .nav-link, .navbar .menu-item.current-menu-ancestor > .nav-link{ color: var(--kiso-primary) !important; }
.navbar .btn{ margin-left:.25rem; }

/* Dropdowns (navwalker) */
.dropdown-menu{ border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); box-shadow: var(--kiso-shadow-md); }
.dropdown-item{ border-radius:10px; }
.dropdown-item:hover, .dropdown-item:focus{ background: var(--kiso-primary-100); color: var(--kiso-primary); }
.dropdown-submenu{ position:relative; }
.dropdown-submenu > .dropdown-menu{ top:0; left:100%; margin-inline:.25rem; }

/* Offcanvas (mobile nav) */
.offcanvas{ background: var(--kiso-dark); color:#fff; }
.offcanvas .offcanvas-title{ color:#fff; }
.offcanvas .navbar-nav .nav-link{ color:#fff; opacity:.92; }
.offcanvas .navbar-nav .nav-link:hover{ opacity:1; color:#fff; }

/* ---------------------------------
   Mega menu
---------------------------------- */
.dropdown-mega.position-static .dropdown-menu.mega-menu{
  width:min(1140px, calc(100vw - 2rem)); left:50%; transform:translateX(-50%);
  margin-top:.5rem; border:1px solid var(--kiso-border); border-radius: var(--kiso-radius);
  box-shadow:0 20px 60px rgba(16,24,40,.12); padding:1.25rem;
}
.dropdown-mega .dropdown-menu .dropdown-item{ border-radius:10px; padding:.5rem .75rem; }
.dropdown-mega .dropdown-menu .dropdown-item:hover{ background: var(--kiso-primary-100); color: var(--kiso-primary); }
.mega-menu h6{ letter-spacing:.04em; margin-bottom:.5rem; color: var(--kiso-muted); }
.highlight-kazumi{ background:linear-gradient(160deg, rgba(255,102,0,.12), rgba(255,102,0,.06)); border:1px solid rgba(255,102,0,.22); border-radius: var(--kiso-radius); }

/* Brand logos (consistent size) */
.brands-row .brand-logo{ max-height:34px; width:auto; display:block; filter:grayscale(100%); opacity:.85; transition:.2s ease; }
.brands-row .brand-logo:hover{ filter:none; opacity:1; }

@media (max-width:991.98px){
  .dropdown-mega.position-static .dropdown-menu.mega-menu{ width:calc(100vw - 1.5rem); left:50%; transform:translateX(-50%); padding:1rem; }
}

/* ---------------------------------
   Hero (video + overlay)
---------------------------------- */
.hero{ position:relative; min-height:68vh; display:flex; align-items:center; background:#000; overflow:hidden; }
.hero video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:.8; }
.hero .hero-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.72)); }
.hero .hero-content{ position:relative; z-index:2; color:#fff; }
.hero .lead{ opacity:.9; }
.hero .badge{ backdrop-filter: blur(3px); }
.kazumi-flag{ display:inline-flex; align-items:center; gap:.5rem; padding:.35rem .65rem; border-radius:999px; background: var(--kiso-primary-100); color:#fff; border:1px solid rgba(255,102,0,.4); }
.kazumi-flag .dot{ width:8px; height:8px; border-radius:50%; background: var(--kiso-primary); }

/* ---------------------------------
   USP strip
---------------------------------- */
.usp{ background:#fff; border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); padding:14px 18px; }
.usp .icon{ width:40px; height:40px; border-radius:50%; background: var(--kiso-primary-100); color: var(--kiso-primary); display:inline-flex; align-items:center; justify-content:center; }

/* ---------------------------------
   Generic cards
---------------------------------- */
.card-kiso{ border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); overflow:hidden; background:#fff; transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease; }
.card-kiso:hover{ transform: translateY(-4px); box-shadow: var(--kiso-shadow-md); border-color: rgba(255,102,0,.35); }

/* ---------------------------------
   Services / tiles
---------------------------------- */
.service-tile{ border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); padding:18px; background:#fff; transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease; height:100%; }
.service-tile:hover{ transform: translateY(-4px); box-shadow: var(--kiso-shadow-md); border-color: rgba(255,102,0,.35); }
.service-tile .icon{ width:52px; height:52px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background: var(--kiso-primary-100); color: var(--kiso-primary); font-size:20px; }
.service-tile h5{ margin-top:.75rem; }
.service-tile .thumb{ border-radius:12px; overflow:hidden; }
.service-tile .thumb img{ width:100%; height:190px; object-fit:cover; }

/* ---------------------------------
   Brands carousel
---------------------------------- */
.brand-logo{ height:46px; max-width:160px; object-fit:contain; filter:grayscale(100%); opacity:.85; transition: transform .2s ease, filter .2s ease, opacity .2s ease; }
.brand-logo:hover{ filter:none; opacity:1; transform:scale(1.05); }
#brandsCarousel .carousel-indicators [data-bs-target]{ width:10px; height:10px; border-radius:50%; background-color: rgba(0,0,0,.25); }
#brandsCarousel .carousel-indicators .active{ background-color: var(--kiso-primary); }
#brandsCarousel .carousel-item .d-flex{ gap:1.75rem; }
@media (min-width:992px){ .brand-logo{ height:54px; } }
@media (max-width:575.98px){ .brand-logo{ width:128px; height:48px; } #brandsCarousel .carousel-item .d-flex{ gap:1.25rem; } }

/* ---------------------------------
   Testimonials
---------------------------------- */
.testimonial{ border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); background:#fff; padding:20px; }
.testimonial .avatar{ width:64px; height:64px; border-radius:50%; overflow:hidden; margin-right:12px; border:2px solid var(--kiso-primary-100); }

/* ---------------------------------
   Blog cards
---------------------------------- */
.blog-card{ border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); overflow:hidden; background:#fff; transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease; }
.blog-card:hover{ transform: translateY(-4px); box-shadow: var(--kiso-shadow-md); border-color: rgba(255,102,0,.35); }
.blog-card .thumb{ max-height:220px; overflow:hidden; }
.blog-card .thumb img{ width:100%; height:220px; object-fit:cover; }

/* ---------------------------------
   Footer
---------------------------------- */
.site-footer{ background:#000; color:#d0d6e0; }
.site-footer .footer-top{ padding:60px 0; border-bottom:1px solid rgba(255,255,255,.08); }
.site-footer .footer-bottom{ padding:22px 0; }
.site-footer .widgettitle, .site-footer .widget-title{ color:#fff; margin-bottom:1rem; font-size:1rem; }
.site-footer .menu a, .site-footer .widget a{ color:#d0d6e0; opacity:.92; }
.site-footer .menu a:hover, .site-footer .widget a:hover{ color:#fff; opacity:1; }
.footer-social .icon{ width:44px; height:44px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#005bac; color:#fff; margin-right:.5rem; transition: transform .2s ease, background .2s ease; }
.footer-social .icon:hover{ transform: translateY(-3px); background: var(--kiso-primary); }

/* ---------------------------------
   Forms / inputs (+ header search)
---------------------------------- */
.form-control, .form-select{ border-radius:12px; border-color:#e6eaf0; }
.form-control:focus, .form-select:focus{ border-color: var(--kiso-primary); box-shadow: 0 0 0 .25rem rgba(255,102,0,.15); }
#headerSearch .form-control{ border-radius:12px; }
#headerSearch .btn{ border-radius:12px; }

/* ==================================================
   High-end Offerte Survey (modal or inline)
================================================== */
.kiso-offerte-modal{ border:0; border-radius: var(--kiso-radius-xl); overflow:hidden; box-shadow: var(--kiso-shadow-lg); }
.kiso-offerte__hero{ position:relative; background:#0c0f1c; color:#fff; isolation:isolate; }
.kiso-offerte__hero.has-bg::before{ content:""; position:absolute; inset:0; background-image:var(--hero-bg); background-size:cover; background-position:center; opacity:.28; z-index:-2; }
.kiso-offerte__hero::after{ content:""; position:absolute; inset:0; background: radial-gradient(1100px 400px at 10% -15%, rgba(255,102,0,.28), transparent); z-index:-1; }
.kiso-offerte__hero .progress{ height:10px; border-radius:999px; background:#1c2234; }
.kiso-offerte__hero .progress-bar{ background: var(--kiso-primary); }
.kiso-offerte__body .card.kiso-review{ border-radius: var(--kiso-radius); background:#f8fafc; }

/* Steps */
.kiso-step{ display:none; }
.kiso-step.is-active{ display:block; animation:kisoFadeIn .35s ease; }
.kiso-step.anim-in{ animation:kisoSlideUp .4s ease; }
@keyframes kisoFadeIn{ from{opacity:0} to{opacity:1} }
@keyframes kisoSlideUp{ from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none} }

/* Tiles */
.kiso-tile{ position:relative; border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); overflow:hidden; cursor:pointer; background:#fff; transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease; outline:0; }
.kiso-tile:focus-visible{ box-shadow:0 0 0 .25rem rgba(255,102,0,.18); }
.kiso-tile__media img{ width:100%; height:110px; object-fit:cover; display:block; }
.kiso-tile__body{ position:relative; padding:12px 14px; display:flex; align-items:center; gap:.6rem; }
.kiso-tile__icon{ width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background: var(--kiso-primary-100); color: var(--kiso-primary); }
.kiso-tile__label{ font-weight:600; }
.kiso-tile__check{ margin-left:auto; transform:scale(.6); opacity:0; transition: transform .15s ease, opacity .15s ease; }
.kiso-tile.is-active{ border-color: rgba(255,102,0,.45); box-shadow: var(--kiso-shadow-md); transform: translateY(-2px); }
.kiso-tile.is-active .kiso-tile__icon{ background: var(--kiso-primary); color:#fff; }
.kiso-tile.is-active .kiso-tile__check{ opacity:1; transform:scale(1); }
.kiso-tile.pulse-in{ animation:kisoPulse .26s ease; }
@keyframes kisoPulse{ from{transform:scale(.98)} to{transform:scale(1)} }

/* Toast / feedback */
.kiso-toast{ position:fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(20px); background:#111; color:#fff; padding:10px 14px; border-radius:10px; opacity:0; pointer-events:none; box-shadow:0 8px 30px rgba(0,0,0,.2); z-index:9999; transition: opacity .2s ease, transform .2s ease; }
.kiso-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.glow-in{ animation:glowIn 1.2s ease; }
@keyframes glowIn{ 0%{ box-shadow:0 0 0 0 rgba(255,102,0,0) } 40%{ box-shadow:0 0 0 .25rem rgba(255,102,0,.18) } 100%{ box-shadow:none } }

/* Success screen */
.kiso-success .display-4{ font-size:3rem; }

/* Motion preferences */
@media (prefers-reduced-motion: reduce){
  * { animation: none !important; transition: none !important; }
}

/* ---------------------------------
   WooCommerce basics
---------------------------------- */
.woocommerce ul.products{ display:flex; flex-wrap:wrap; gap:15px; list-style:none; margin:0; padding:0; }
.woocommerce ul.products li.product{ border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); padding:15px; width:calc(25% - 15px); display:block; }
.woocommerce ul.products li.product .button{ background: var(--kiso-primary); color:#fff; border:none; border-radius:10px; }
.woocommerce .products .product .price{ font-weight:600; }
.woocommerce div.product .summary .price{ font-size:1.25rem; font-weight:700; }
.single-product .cart .button, .woocommerce ul.products li.product .button{ border-radius:12px; }

/* ---------------------------------
   Page hero
---------------------------------- */
.page-hero{ min-height:240px; overflow:hidden; }
.page-hero-bg{ background-size:cover; background-position:center; filter:brightness(.85); }
.page-hero-overlay{ background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.65)); }
.page-hero .display-5, .page-hero h1, .page-hero .breadcrumbs{ color:#fff; }

/* ---------------------------------
   Airco Vergelijker helpers
---------------------------------- */
.ac-compare .compare-matrix .table thead th,
.ac-compare .compare-matrix .table tfoot th,
.ac-compare .compare-matrix .table tfoot td{ position:sticky; top:0; z-index:2; background:#fff; }
.ac-compare .compare-matrix .sticky-col{ position:sticky; left:0; z-index:3; border-right:1px solid var(--kiso-border); background:#fff; }
.ac-compare .compare-matrix table{ min-width:760px; }
.ac-compare .compare-matrix td, .ac-compare .compare-matrix th{ white-space:nowrap; }
@media (max-width:991.98px){ .ac-compare .compare-matrix table{ min-width:680px; } }
@media (max-width:575.98px){ .ac-compare .compare-matrix table{ min-width:620px; } }

/* ---------------------------------
   Blog & categories scroller
---------------------------------- */
.kiso-horizontal{ display:flex; gap:16px; overflow-x:auto; scroll-behavior:smooth; scroll-snap-type:x mandatory; padding-bottom:4px; }
.kiso-horizontal > *{ flex:0 0 auto; width:280px; scroll-snap-align:start; }
@media (min-width:576px){ .kiso-horizontal > *{ width:300px; } }
@media (min-width:992px){ .kiso-horizontal > *{ width:320px; } }
.kiso-card{ border:1px solid var(--kiso-border); border-radius: var(--kiso-radius); overflow:hidden; background:#fff; transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease; }
.kiso-card:hover{ transform: translateY(-3px); box-shadow: var(--kiso-shadow-md); border-color: rgba(255,102,0,.35); }
.kiso-ig-item{ display:block; border:1px solid var(--kiso-border); border-radius:12px; overflow:hidden; background:#fff; }
.kiso-ig-item img{ width:100%; height:220px; object-fit:cover; display:block; }

/* ---------------------------------
   Branding / logos in header/footer
---------------------------------- */
.navbar .brand-logo{ max-height:52px; height:auto; }
.site-footer .brand-logo{ max-height:56px; height:auto; }
.brand-logo--dark[data-fallback-invert="1"]{ filter: invert(1) brightness(1.15) contrast(1.05); }

/* ---------------------------------
   Dark theme prep (optional)
---------------------------------- */
.theme-dark .site-header{ background: var(--kiso-dark); border-color: rgba(255,255,255,.08); }
.theme-dark .navbar .nav-link{ color:#d0d6e0; }
.theme-dark .navbar .nav-link:hover{ color:#fff; }
.theme-dark .brand-logo--light{ display:none; }
.theme-dark .brand-logo--dark{ display:inline-block; }
.theme-dark .site-footer{ background: var(--kiso-dark); }
.theme-dark .site-footer .footer-logo{ max-height:56px; height:auto; }

/* ---------------------------------
   Responsive tweaks
---------------------------------- */
@media (min-width:992px){ .navbar{ padding-top:12px; padding-bottom:12px; } }
@media (max-width:991.98px){ .hero{ min-height:56vh; } .blog-card .thumb img{ height:200px; } }
@media (max-width:575.98px){
  .hero .display-4, .hero .h1{ font-size:1.8rem; }
  .service-tile .thumb img{ height:160px; }
  #kiso-offerte .card{ border-radius:12px; }
  #kiso-offerte .d-flex.align-items-center.justify-content-between.flex-wrap.gap-2.mt-4{ flex-direction:column; align-items:stretch; }
  #kiso-offerte .d-flex.align-items-center.justify-content-between.flex-wrap.gap-2.mt-4 .btn{ width:100%; }
}


.daisekai-premium .object-fit-cover{object-fit:cover}
.daisekai-premium .brochure-banner:hover{box-shadow:0 12px 30px rgba(0,0,0,.08)}
.daisekai-premium .card .badge{font-weight:600;letter-spacing:.01em}
.daisekai-premium .card .h5{letter-spacing:.01em}
.daisekai-premium .ratio{background:#fff}


.kiso-advantages .kiso-tabs .nav-link{
  font-weight:600;
  padding:.75rem 1rem;
  border-top-left-radius:1rem;
  border-top-right-radius:1rem;
}
.kiso-advantages .kiso-tabs .nav-link.active{
  background:#fff;
  border-color:#dee2e6 #dee2e6 #fff;
}
.kiso-advantages .kiso-checks li{
  position:relative;
  padding-left:1.8rem;
  margin:.4rem 0;
}
.kiso-advantages .kiso-checks li i{
  position:absolute; left:0; top:.15rem; width:1.25rem; text-align:center; opacity:.9;
}

/* Premium CTA's */
.daisekai-premium .btn.rounded-pill { border-radius: 9999px; }
.daisekai-premium .btn-success { box-shadow: 0 6px 18px rgba(16,185,129,.15); }

/* Bullet icon alignment */
.kiso-checks li { position:relative; padding-left:1.8rem; margin:.4rem 0; }
.kiso-checks li i{ position:absolute; left:0; top:.15rem; width:1.25rem; text-align:center; opacity:.9; }


/* ===== Premium Landing (universieel) ===== */
.premium-landing .object-fit-cover{object-fit:cover}
.premium-landing .btn.rounded-pill{border-radius:9999px}

.premium-landing .btn-success{box-shadow:0 8px 26px rgba(16,185,129,.18); transition:transform .15s ease, box-shadow .2s ease}
.premium-landing .btn-success:hover{transform:translateY(-1px); box-shadow:0 12px 34px rgba(16,185,129,.24)}
.premium-landing .btn-primary{box-shadow:0 8px 26px rgba(13,110,253,.15)}
.premium-landing .btn-primary:hover{transform:translateY(-1px); box-shadow:0 12px 34px rgba(13,110,253,.22)}

.premium-landing .badge{font-weight:600; letter-spacing:.01em}
.premium-landing .premium-card .badge{border-radius:9999px}

.premium-landing .brochure-banner:hover{box-shadow:0 16px 40px rgba(0,0,0,.08)}

.kiso-advantages .kiso-tabs .nav-link{
  font-weight:700; padding:.85rem 1.1rem;
  border-top-left-radius:1rem; border-top-right-radius:1rem;
}
.kiso-advantages .kiso-tabs .nav-link.active{
  background:#fff; border-color:#dee2e6 #dee2e6 #fff;
}
.kiso-advantages .kiso-checks li{position:relative; padding-left:1.8rem; margin:.4rem 0}
.kiso-advantages .kiso-checks li i{position:absolute; left:0; top:.15rem; width:1.25rem; text-align:center; opacity:.9}

.premium-sticky-cta{
  position:fixed; left:0; right:0; bottom:0; display:flex; z-index:1050;
  box-shadow:0 -10px 24px rgba(0,0,0,.08)
}