﻿/* =========================================================
   KASBEAR — DESIGN TOKENS
========================================================= */
:root{
  --kb-blue:#00AFEF;
  --kb-blue-light:#5FD8FF;
  --kb-blue-deep:#0B4F6C;
  --kb-ink:#060B12;
  --kb-ink-2:#0C151F;
  --kb-ink-3:#121E2B;
  --kb-white:#FFFFFF;
  --kb-fog:#F4F8FB;
  --kb-fog-2:#E8EFF3;
  --kb-slate:#56697A;
  --kb-slate-dark:#9FB7C6;
  --kb-line:#1B2A38;
  --kb-line-light:#DDE6EC;
  --kb-radius:18px;
  --kb-ease:cubic-bezier(.16,1,.3,1);
  --kb-font-display:'Space Grotesk', sans-serif;
  --kb-font-body:'Inter', sans-serif;
  --kb-font-mono:'JetBrains Mono', monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:100px; overflow-x:hidden;}
body{
  font-family:var(--kb-font-body);
  color:var(--kb-slate);
  background:var(--kb-white);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;}
a{text-decoration:none;}
::selection{background:var(--kb-blue); color:#fff;}

h1,h2,h3,h4{font-family:var(--kb-font-display); color:var(--kb-ink); margin:0; letter-spacing:-0.01em;}

:focus-visible{outline:2px solid var(--kb-blue); outline-offset:3px; border-radius:4px;}

.kb-eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--kb-font-mono); font-size:.72rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--kb-blue-light);
  margin-bottom:1rem;
}
.kb-eyebrow-dark{color:var(--kb-blue-deep);}
.kb-eyebrow i{font-size:.85rem;}

.kb-h2{font-size:clamp(1.8rem,3.2vw,2.7rem); font-weight:600; line-height:1.12;}
.kb-h2-light{color:#fff;}
.kb-lead-sm{font-size:1.05rem; line-height:1.65; color:var(--kb-slate);}
.kb-lead-light{color:var(--kb-slate-dark);}

.kb-text-gradient{
  background:linear-gradient(100deg,var(--kb-blue),var(--kb-blue-light));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* Buttons */
.btn-kb-primary{
  background:var(--kb-blue); border:1px solid var(--kb-blue); color:#fff;
  font-weight:600; padding:.85rem 1.6rem; border-radius:100px;
  display:inline-flex; align-items:center; gap:.55rem;
  transition:transform .35s var(--kb-ease), box-shadow .35s var(--kb-ease), background .25s;
  box-shadow:0 10px 30px -10px rgba(0,175,239,.55);
}
.btn-kb-primary:hover{background:#00c2ff; color:#fff; transform:translateY(-3px); box-shadow:0 16px 34px -10px rgba(0,175,239,.7);}
.btn-kb-ghost{
  background:transparent; border:1px solid rgba(255,255,255,.35); color:#fff;
  font-weight:600; padding:.85rem 1.6rem; border-radius:100px;
  display:inline-flex; align-items:center; gap:.55rem;
  transition:all .3s var(--kb-ease);
  backdrop-filter:blur(6px);
}
.btn-kb-ghost:hover{background:rgba(255,255,255,.12); border-color:#fff; color:#fff; transform:translateY(-3px);}
.btn-kb-subtle{
  background:transparent; border:1px solid var(--kb-line-light); color:var(--kb-ink);
  font-weight:600; padding:.55rem 1.15rem; border-radius:100px; font-size:.88rem;
  transition:all .3s var(--kb-ease);
}
.btn-kb-subtle:hover{background:var(--kb-fog); border-color:var(--kb-blue); color:var(--kb-blue-deep); transform:translateY(-2px);}
.btn-kb-dark{
  background:var(--kb-ink); border:1px solid var(--kb-ink); color:#fff;
  font-weight:600; padding:.85rem 1.6rem; border-radius:100px;
  display:inline-flex; align-items:center; gap:.55rem;
  transition:all .3s var(--kb-ease);
}
.btn-kb-dark:hover{background:#000; transform:translateY(-3px); color:#fff;}
.btn-kb-outline-dark{
  background:transparent; border:1px solid var(--kb-line-light); color:var(--kb-ink);
  font-weight:600; padding:.8rem 1.5rem; border-radius:100px;
  display:inline-flex; align-items:center; gap:.5rem;
  transition:all .3s var(--kb-ease);
}
.btn-kb-outline-dark:hover{background:var(--kb-ink); color:#fff; border-color:var(--kb-ink);}

/* =========================================================
   NAVBAR
========================================================= */
.kb-nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  padding:1.2rem 0; transition:all .4s var(--kb-ease);
  background:transparent;
}
.kb-nav.is-scrolled{
  padding:.85rem 0; background:rgba(6,11,18,.88); backdrop-filter:blur(14px);
  box-shadow:0 1px 0 rgba(255,255,255,.06);
}
.kb-nav-inner{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; gap:1rem; min-height:52px;
}
.kb-brand{
  display:flex; align-items:center; flex-shrink:1; min-width:0;
  font-family:var(--kb-font-display); font-weight:700; font-size:1.4rem;
  color:#fff !important; letter-spacing:-.01em;
}
.kb-brand-logo{height:clamp(26px, 6vw, 38px); width:auto; display:block;}
.kb-nav-utils{
  display:flex; align-items:center; gap:.35rem; flex-shrink:0;
}
.kb-nav-icon-btn{
  width:52px; height:52px; border:none; background:transparent;
  color:rgba(255,255,255,.88); border-radius:14px; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  transition:background .25s, color .25s, transform .25s var(--kb-ease);
  position:relative; cursor:pointer;
}
a.kb-nav-icon-btn{text-decoration:none;}
.kb-nav-icon-btn:hover,
.kb-nav-icon-btn:focus-visible{
  background:rgba(0,175,239,.14); color:#fff; transform:translateY(-1px);
}
.kb-nav-icon-btn i{font-size:1.45rem;}
.kb-nav-cart-count{
  position:absolute; top:6px; right:6px; min-width:19px; height:19px; padding:0 5px;
  border-radius:100px; background:var(--kb-blue); color:#fff;
  font-size:.65rem; font-weight:700; line-height:19px; text-align:center;
  font-family:var(--kb-font-mono); pointer-events:none;
}

/* Theme toggle */
.kb-theme-toggle .kb-theme-icon-light{display:none;}
html[data-kb-theme="dark"] .kb-theme-toggle .kb-theme-icon-dark{display:none;}
html[data-kb-theme="dark"] .kb-theme-toggle .kb-theme-icon-light{display:block;}
html.kb-theme-animating .kb-main,
html.kb-theme-animating .kb-main *{
  transition:background-color .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease !important;
}

/* Full-page search */
body.kb-search-open{overflow:hidden;}
.kb-search-overlay{
  position:fixed; inset:0; z-index:2000;
  display:flex; align-items:center; justify-content:center;
  padding:max(1.5rem, env(safe-area-inset-top)) 1.5rem max(1.5rem, env(safe-area-inset-bottom));
  background:rgba(6,11,18,.97);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .45s var(--kb-ease), visibility .45s var(--kb-ease);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
}
.kb-search-overlay.is-open{opacity:1; visibility:visible; pointer-events:auto;}
.kb-search-overlay::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 70% 50% at 50% 20%, rgba(0,175,239,.12), transparent 60%),
    linear-gradient(rgba(0,175,239,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,175,239,.08) 1px, transparent 1px);
  background-size:auto, 42px 42px, 42px 42px;
  opacity:.6;
}
.kb-search-close{
  position:fixed; top:max(1rem, env(safe-area-inset-top)); right:1.5rem; z-index:2001;
  width:52px; height:52px; border:1px solid rgba(255,255,255,.18);
  border-radius:50%; background:rgba(255,255,255,.06); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; cursor:pointer;
  transition:background .25s, border-color .25s, transform .25s var(--kb-ease);
}
.kb-search-close:hover{background:rgba(0,175,239,.2); border-color:rgba(0,175,239,.45); transform:scale(1.05);}
.kb-search-panel{
  position:relative; z-index:1; width:min(760px, 100%);
  margin:0 auto; padding:3.5rem 0 1rem;
  transform:translateY(24px); opacity:0;
  transition:transform .5s var(--kb-ease), opacity .5s var(--kb-ease);
}
.kb-search-overlay.is-open .kb-search-panel{transform:translateY(0); opacity:1;}
.kb-search-eyebrow{
  font-family:var(--kb-font-mono); font-size:.75rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--kb-blue-light);
  margin-bottom:1rem;
}
.kb-search-title{
  font-family:var(--kb-font-display); font-size:clamp(2rem, 5vw, 3rem);
  font-weight:700; color:#fff; margin:0 0 1.75rem; line-height:1.1;
}
.kb-search-form{display:flex; gap:.75rem; align-items:stretch;}
.kb-search-input{
  flex:1; min-width:0; width:100%; height:64px; padding:0 1.35rem;
  border:1px solid rgba(255,255,255,.16); border-radius:16px;
  background:rgba(255,255,255,.06); color:#fff; font-size:1.05rem;
  transition:border-color .25s, box-shadow .25s, background .25s;
  -webkit-appearance:none; appearance:none;
}
.kb-search-input::placeholder{color:rgba(159,183,198,.75);}
.kb-search-input:focus{
  outline:none; border-color:var(--kb-blue);
  box-shadow:0 0 0 4px rgba(0,175,239,.18); background:rgba(255,255,255,.09);
}
.kb-search-submit{
  flex-shrink:0; height:64px; padding:0 1.75rem; border:none; border-radius:16px;
  background:var(--kb-blue); color:#fff; font-weight:600; font-size:1rem;
  display:inline-flex; align-items:center; gap:.5rem; cursor:pointer;
  transition:background .25s, transform .25s var(--kb-ease);
  box-shadow:0 12px 30px -12px rgba(0,175,239,.55);
}
.kb-search-submit:hover{background:#00c2ff; transform:translateY(-2px);}
.kb-search-hint{
  margin:1.25rem 0 0; font-size:.92rem; color:var(--kb-slate-dark);
}

@media (min-width:992px){
  .kb-search-panel{padding-top:0;}
  .kb-search-title{padding-right:0;}
}

/* =========================================================
   HERO
========================================================= */
.kb-hero{
  position:relative; min-height:100vh; display:flex; flex-direction:column; justify-content:center;
  overflow:hidden; background:var(--kb-ink);
}
.kb-hero-carousel{position:absolute; inset:0; z-index:0;}
.kb-hero-carousel .carousel-inner,
.kb-hero-carousel .carousel-item{height:100%; min-height:100vh;}
.kb-hero-carousel .carousel-item{
  position:relative;
  display:none;
  align-items:center;
  box-sizing:border-box;
  padding-top:6rem;
  padding-bottom:6rem;
}
.kb-hero-carousel .carousel-item.active,
.kb-hero-carousel .carousel-item-next,
.kb-hero-carousel .carousel-item-prev{display:flex;}
.kb-hero-video-wrap{position:absolute; inset:0; z-index:0; overflow:hidden; background:linear-gradient(160deg,#04080d,#0a1a26);}
.kb-hero-video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center center;
  opacity:1; transform:scale(1.2); transform-origin:center center;
}
.kb-hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 20%, rgba(0,175,239,.16), transparent 100%),
    linear-gradient(180deg, rgba(6,11,18,.55) 0%, rgba(6,11,18,.75) 55%, rgba(6,11,18,.96) 100%);
}
.kb-hero-grid-overlay{
  position:absolute; inset:0; opacity:.5; mix-blend-mode:soft-light;
  background-image:linear-gradient(rgba(0,175,239,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(0,175,239,.18) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image:radial-gradient(circle at 65% 35%, black, transparent 70%);
}
.kb-hero-content{position:relative; z-index:2; width:100%; padding:0;}

.kb-hero-carousel .carousel-item{transition:opacity .8s var(--kb-ease), transform .8s var(--kb-ease);}
.kb-hero-title{font-size:clamp(2.6rem,5.6vw,4.4rem); font-weight:700; line-height:1.04; color:#fff; margin-bottom:1.4rem;}
.kb-hero-lead{font-size:1.12rem; color:var(--kb-slate-dark); max-width:540px; margin-bottom:2rem; line-height:1.7;}
.kb-hero-actions{display:flex; gap:1rem; flex-wrap:wrap;}
.kb-hero-actions .btn{max-width:100%;}

.kb-hero-nav{
  width:48px; height:48px; top:50%; transform:translateY(-50%); z-index:4; opacity:1;
  background:rgba(0,175,239,.14); border:1px solid rgba(0,175,239,.35); border-radius:50%;
  transition:background .25s var(--kb-ease), border-color .25s var(--kb-ease), transform .25s var(--kb-ease);
}
.kb-hero-nav:hover{background:rgba(0,175,239,.28); border-color:rgba(0,175,239,.55);}
.kb-hero-nav.carousel-control-prev{left:1.25rem;}
.kb-hero-nav.carousel-control-next{right:1.25rem;}
.kb-hero-nav .carousel-control-prev-icon,
.kb-hero-nav .carousel-control-next-icon{width:1.15rem; height:1.15rem; filter:brightness(0) invert(1);}

.kb-hero-indicators{display:flex; gap:.6rem; margin-top:0;}
.kb-hero-indicators-bar{
  position:relative; z-index:5; width:100%; margin-top:auto;
  padding:0 0 1.25rem; pointer-events:none;
}
.kb-hero-indicators-bar .kb-hero-indicators{pointer-events:auto;}
.kb-hero-indicators button{
  position:relative; width:64px; height:3px; background:rgba(255,255,255,.18); border:none; padding:0; border-radius:3px; overflow:hidden; cursor:pointer;
}
.kb-hero-indicators button::after{
  content:''; position:absolute; inset:0; background:var(--kb-blue); transform-origin:left; transform:scaleX(0); transition:transform .35s var(--kb-ease);
}
.kb-hero-indicators button.is-active::after{transform:scaleX(1);}

/* Hero phone mockup */
.kb-phone-mock{
  width:250px; aspect-ratio:9/18.5; border-radius:36px; position:relative;
  background:linear-gradient(160deg,#222b34,#0a0e13);
  padding:9px; box-shadow:0 40px 80px -25px rgba(0,0,0,.65), inset 0 0 0 1px rgba(255,255,255,.06);
}
.kb-phone-mock::before{
  content:''; position:absolute; top:9px; left:50%; transform:translateX(-50%);
  width:34%; height:16px; background:#080b0f; border-radius:0 0 13px 13px; z-index:3;
}
.kb-phone-screen{width:100%; height:100%; border-radius:28px; overflow:hidden; position:relative; background:#000;}
.kb-phone-screen .kb-screen-ui{position:absolute; inset:0;}
.kb-screen-oled{
  background:radial-gradient(circle at 30% 20%, #0c2230, #000 60%);
}
.kb-screen-oled .kb-glow{
  position:absolute; width:140%; height:60%; left:-20%; top:8%;
  background:radial-gradient(ellipse at center, rgba(0,175,239,.85), rgba(0,175,239,0) 70%);
  filter:blur(10px); animation:kbBreathe 4.5s ease-in-out infinite;
}
@keyframes kbBreathe{0%,100%{opacity:.55; transform:scale(1);} 50%{opacity:1; transform:scale(1.06);}}
.kb-screen-oled .kb-bars{position:absolute; left:14%; right:14%; bottom:14%; display:flex; gap:6px;}
.kb-screen-oled .kb-bars span{flex:1; height:34px; border-radius:6px; background:rgba(255,255,255,.08);}
.kb-screen-oled .kb-bars span:nth-child(1){background:linear-gradient(180deg,#00afef,#0b4f6c);}
.kb-screen-oled .kb-bars span:nth-child(3){background:linear-gradient(180deg,#5fd8ff,#0b4f6c); height:46px; margin-top:-12px;}
.kb-screen-oled .kb-dot-row{position:absolute; top:24px; left:0; right:0; display:flex; justify-content:space-between; padding:0 16px;}
.kb-screen-oled .kb-dot-row span{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.5);}
.kb-phone-logo{
  position:absolute; top:36%; left:50%; transform:translate(-50%,-50%);
  width:86px; height:70px; color:#fff; z-index:2;
  filter: drop-shadow(0 0 12px rgba(0,175,239,0.5));
}
.kb-phone-logo svg{width:100%; height:100%; display:block;}

.kb-scroll-cue{
  position:absolute; bottom:1.4rem; right:1.8rem; z-index:3; color:rgba(255,255,255,.55);
  display:flex; flex-direction:column; align-items:center; gap:.4rem; font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
  font-family:var(--kb-font-mono);
}
.kb-scroll-cue i{font-size:1.1rem; animation:kbBob 2s ease-in-out infinite;}
@keyframes kbBob{0%,100%{transform:translateY(0);} 50%{transform:translateY(6px);}}

/* =========================================================
   MARQUEE
========================================================= */
.kb-marquee{background:var(--kb-ink-2); padding:1.1rem 0; overflow:hidden; border-bottom:1px solid var(--kb-line);}
.kb-marquee-track{display:flex; width:max-content; animation:kbMarquee 28s linear infinite;}
.kb-marquee-group{display:flex; align-items:center; gap:2.6rem; padding-right:2.6rem;}
.kb-marquee-track span.kb-m-item{
  font-family:var(--kb-font-mono); font-size:.85rem; color:var(--kb-slate-dark); white-space:nowrap; letter-spacing:.03em;
}
.kb-marquee-track span.kb-m-tag{color:var(--kb-blue-light); font-weight:600;}
.kb-marquee-track span.kb-m-dot{color:var(--kb-blue); opacity:.6;}
@keyframes kbMarquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* =========================================================
   GENERIC SECTIONS
========================================================= */
.kb-section{padding:6.5rem 0;}
.kb-section-dark{background:var(--kb-ink); color:var(--kb-slate-dark);}
.kb-section-fog{background:var(--kb-fog);}
.kb-section-tight{padding:4.5rem 0;}

/* Main content shell (theme-aware; hero stays outside) */
.kb-main{background:var(--kb-t-bg, #fff); color:var(--kb-t-text, var(--kb-slate));}
.kb-main .kb-h2,
.kb-main .kb-gammes-title,
.kb-main h3,
.kb-main h4{color:var(--kb-t-heading, var(--kb-ink));}

/* Reveal animation utility */
[data-reveal]{opacity:0; transform:translateY(34px); transition:opacity .9s var(--kb-ease), transform .9s var(--kb-ease);}
[data-reveal].is-visible{opacity:1; transform:translateY(0);}
[data-reveal-img]{opacity:0; transform:translateY(50px) scale(.93); transition:opacity 1s var(--kb-ease), transform 1s var(--kb-ease);}
[data-reveal-img].is-visible{opacity:1; transform:translateY(0) scale(1);}

@media (prefers-reduced-motion: reduce){
  [data-reveal], [data-reveal-img]{transition:none !important; opacity:1 !important; transform:none !important;}
  .kb-marquee-track, .kb-screen-oled .kb-glow, .kb-scroll-cue i, .kb-screen-lcd .kb-backlight, .kb-brands-bg::before, .kb-brands-bg::after, .kb-search-overlay, .kb-search-panel{animation:none !important; transition:none !important;}
  .kb-search-panel{transform:none !important; opacity:1 !important;}
  .kb-pcard:hover{transform:translateY(-8px);}
  .kb-pcard:hover .kb-pcard-visual img{transform:none;}
}

/* =========================================================
   GAMMES INTRO
========================================================= */
.kb-gammes-block{
  background:linear-gradient(180deg, var(--kb-fog) 0%, #fff 14%, #fff 100%);
  border-bottom:1px solid var(--kb-line-light);
}
.kb-gammes-intro{
  padding:clamp(4rem, 8vw, 6.5rem) 0 clamp(2.5rem, 5vw, 3.5rem);
  text-align:center;
}
.kb-gammes-intro-inner{max-width:720px; margin:0 auto;}
.kb-gammes-eyebrow{
  display:inline-flex; align-items:center; gap:1rem;
  font-family:var(--kb-font-mono); font-size:.68rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--kb-blue-deep);
  margin-bottom:1.5rem;
}
.kb-gammes-eyebrow::before, .kb-gammes-eyebrow::after{
  content:''; width:clamp(20px, 4vw, 36px); height:1px;
}
.kb-gammes-eyebrow::before{background:linear-gradient(90deg, transparent, var(--kb-blue));}
.kb-gammes-eyebrow::after{background:linear-gradient(90deg, var(--kb-blue), transparent);}
.kb-gammes-title{
  font-size:clamp(2rem, 4vw, 3rem); font-weight:600; line-height:1.1;
  letter-spacing:-0.02em; margin-bottom:1.25rem;
}
.kb-gammes-lead{
  font-size:1.08rem; line-height:1.7; color:var(--kb-slate);
  margin:0 auto 2.75rem; max-width:560px;
}
.kb-tech-pillars{
  display:flex; align-items:stretch; justify-content:center;
  max-width:660px; margin:0 auto;
}
.kb-tech-pillar{
  flex:1; display:flex; flex-direction:column; align-items:flex-start;
  text-align:left; padding:1.5rem 1.6rem; border-radius:var(--kb-radius);
  border:1px solid var(--kb-line-light); background:#fff;
  transition:transform .35s var(--kb-ease), box-shadow .35s, border-color .35s;
  text-decoration:none; color:inherit;
}
.kb-tech-pillar:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 50px -20px rgba(11,79,108,.18);
  border-color:rgba(0,175,239,.3);
}
.kb-tech-pillar-icon{
  width:42px; height:42px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem; margin-bottom:1rem;
}
.kb-tech-pillar--oled .kb-tech-pillar-icon{
  background:linear-gradient(135deg, #1a0a2e, #2d1b4e); color:#c4a8ff;
}
.kb-tech-pillar--oled:hover{border-color:rgba(123,47,255,.25);}
.kb-tech-pillar--lcd .kb-tech-pillar-icon{
  background:linear-gradient(135deg, #e8f4fc, #c5e8f7); color:var(--kb-blue-deep);
}
.kb-tech-pillar-label{
  font-family:var(--kb-font-mono); font-size:.65rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--kb-slate); margin-bottom:.35rem;
}
.kb-tech-pillar h4{font-size:1.05rem; font-weight:600; margin-bottom:.4rem; color:var(--kb-ink);}
.kb-tech-pillar p{font-size:.85rem; line-height:1.5; margin:0; color:var(--kb-slate);}
.kb-tech-pillar-arrow{
  margin-top:auto; padding-top:1rem;
  font-size:.78rem; font-weight:600; color:var(--kb-blue);
  display:flex; align-items:center; gap:.35rem;
}
.kb-tech-divider{
  width:1px; align-self:stretch; margin:1.25rem 0;
  background:linear-gradient(180deg, transparent, var(--kb-line-light), transparent);
}
@media (max-width:575px){
  .kb-tech-pillars{flex-direction:column; gap:.75rem;}
  .kb-tech-divider{
    width:72%; height:1px; margin:0 auto;
    background:linear-gradient(90deg, transparent, var(--kb-line-light), transparent);
  }
}

/* =========================================================
   PRODUCT SHOWCASE
========================================================= */
.kb-product{padding:clamp(3.5rem, 6vw, 5.5rem) 0; border-bottom:1px solid var(--kb-line-light); overflow:hidden;}
.kb-product--oled{background:linear-gradient(160deg, #faf9fc 0%, #f3f0fa 45%, #fff 100%);}
.kb-product--lcd{background:#fff;}
.kb-product-index{
  font-family:var(--kb-font-mono); font-size:.68rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--kb-slate); margin-bottom:.85rem; display:block;
}
.kb-product--oled .kb-product-badge{background:rgba(123,47,255,.1); color:#5c3d8f;}
.kb-product--oled .kb-product-tagline{border-color:rgba(123,47,255,.4); color:#4a2d7a;}
.kb-product--oled .kb-product-highlight-val{color:#6b3fa0;}
.kb-product--oled .kb-spec-chip i{background:rgba(123,47,255,.1); color:#9b5fff;}
.kb-product-tagline{
  font-family:var(--kb-font-display); font-size:clamp(1.05rem, 1.8vw, 1.2rem);
  font-weight:500; font-style:italic; line-height:1.45;
  color:var(--kb-blue-deep); margin:0 0 1.5rem;
  padding-left:1.1rem; border-left:3px solid var(--kb-blue);
}
.kb-product-desc{
  font-size:1rem; line-height:1.75; color:var(--kb-slate); margin-bottom:1.75rem;
}
.kb-product-highlights{
  display:flex; margin-bottom:1.75rem;
  border:1px solid var(--kb-line-light); border-radius:14px; overflow:hidden;
  background:rgba(255,255,255,.75);
}
.kb-product-highlight{
  flex:1; text-align:center; padding:1rem .65rem;
  border-right:1px solid var(--kb-line-light);
}
.kb-product-highlight:last-child{border-right:none;}
.kb-product-highlight-val{
  display:block; font-family:var(--kb-font-display); font-size:1.3rem;
  font-weight:700; color:var(--kb-blue-deep); line-height:1.2;
}
.kb-product-highlight-lbl{
  display:block; font-family:var(--kb-font-mono); font-size:.62rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--kb-slate);
  margin-top:.3rem;
}
.kb-spec-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:.65rem;
  margin-bottom:2rem;
}
.kb-spec-chip{
  display:flex; align-items:center; gap:.65rem;
  padding:.72rem .85rem; border-radius:12px;
  background:rgba(255,255,255,.9); border:1px solid var(--kb-line-light);
  font-size:.86rem; line-height:1.35;
  transition:border-color .25s, background .25s;
}
.kb-spec-chip:hover{border-color:rgba(0,175,239,.35); background:#fff;}
.kb-spec-chip i{
  flex-shrink:0; width:30px; height:30px; border-radius:8px;
  background:rgba(0,175,239,.1); color:var(--kb-blue);
  display:flex; align-items:center; justify-content:center; font-size:.88rem;
}
.kb-spec-chip b{
  font-family:var(--kb-font-mono); font-size:.66rem; text-transform:uppercase;
  letter-spacing:.04em; color:var(--kb-ink); font-weight:600; display:block;
}
.kb-product-actions{display:flex; flex-wrap:wrap; gap:.75rem; align-items:center;}
@media (max-width:575px){
  .kb-product-highlights{flex-direction:column;}
  .kb-product-highlight{border-right:none; border-bottom:1px solid var(--kb-line-light);}
  .kb-product-highlight:last-child{border-bottom:none;}
  .kb-spec-grid{grid-template-columns:1fr;}
}
.kb-product-feature{
  display:grid; grid-template-columns:1fr; align-items:center; gap:2.5rem;
}
.kb-product-feature-media{
  display:flex; justify-content:center; align-items:center;
  width:100vw; margin-left:calc(50% - 50vw);
}
.kb-product-feature-copy{padding:0 1.25rem;}
.kb-product-feature-copy-inner{max-width:540px; margin:0 auto;}
.kb-product-visual{
  width:100%; margin:0 auto; padding:0;
  border:none; border-radius:0; background:transparent;
  overflow:hidden; aspect-ratio:unset;
}
.kb-product-shot{
  display:block; width:100%; height:auto;
  max-height:min(72vh, 620px); margin:0 auto;
  object-fit:contain; object-position:center;
  transform:scale(1.5); transform-origin:center center;
  transition:transform .5s var(--kb-ease);
}
.kb-product-visual:hover .kb-product-shot{transform:scale(1.575);}
@media (min-width:992px){
  .kb-product-feature{
    grid-template-columns:1fr 1fr; gap:0; min-height:min(480px, 68vh);
  }
  .kb-product-feature--media-left .kb-product-feature-media{order:1;}
  .kb-product-feature--media-left .kb-product-feature-copy{order:2;}
  .kb-product-feature--media-right .kb-product-feature-media{order:2;}
  .kb-product-feature--media-right .kb-product-feature-copy{order:1;}
  .kb-product-feature-media{
    width:50vw; margin-left:0; align-self:stretch;
    padding:clamp(1rem, 2.5vw, 2rem);
  }
  .kb-product-feature--media-left .kb-product-feature-media{
    justify-content:center; padding-left:clamp(1rem, 3vw, 2.5rem);
  }
  .kb-product-feature--media-right .kb-product-feature-media{
    justify-content:center; padding-right:clamp(1rem, 3vw, 2.5rem);
  }
  .kb-product-feature-copy{
    display:flex; align-items:center; padding:0;
  }
  .kb-product-feature--media-left .kb-product-feature-copy-inner{
    margin:0 auto 0 0; padding:0 clamp(1.5rem, 4vw, 3rem) 0 clamp(1.25rem, 3vw, 2rem);
  }
  .kb-product-feature--media-right .kb-product-feature-copy-inner{
    margin:0 0 0 auto; padding:0 clamp(1.25rem, 3vw, 2rem) 0 clamp(1.5rem, 4vw, 3rem);
  }
  .kb-product-shot{max-height:min(76vh, 680px);}
}
.kb-product-badge{
  display:inline-flex; align-items:center; gap:.4rem; font-family:var(--kb-font-mono); font-size:.7rem;
  letter-spacing:.12em; text-transform:uppercase; font-weight:600; color:var(--kb-blue-deep);
  background:rgba(0,175,239,.1); padding:.35rem .8rem; border-radius:100px; margin-bottom:1.2rem;
}
.kb-product h3{font-size:clamp(1.65rem,2.6vw,2.25rem); font-weight:600; margin-bottom:.75rem; letter-spacing:-0.02em;}
.kb-product-tag{font-family:var(--kb-font-mono); font-size:.95rem; color:var(--kb-blue); margin-bottom:1.4rem; display:block;}
.kb-spec-list{list-style:none; padding:0; margin:1.6rem 0 2rem; display:grid; grid-template-columns:1fr 1fr; gap:1rem 1.4rem;}
.kb-spec-list li{display:flex; gap:.7rem; align-items:flex-start; font-size:.92rem;}
.kb-spec-list li i{color:var(--kb-blue); font-size:1.05rem; margin-top:.15rem;}
.kb-spec-list b{color:var(--kb-ink); display:block; font-family:var(--kb-font-mono); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; margin-bottom:.1rem;}

.kb-phone-mock.kb-phone-lg{width:270px;}

.kb-screen-lcd{background:linear-gradient(160deg,#eef6fb,#cfe9f3);}
.kb-screen-lcd .kb-backlight{
  position:absolute; inset:0; background:radial-gradient(ellipse at 50% 0%, rgba(255,255,255,.9), rgba(255,255,255,0) 60%);
  animation:kbBacklight 5s ease-in-out infinite;
}
@keyframes kbBacklight{0%,100%{opacity:.7;} 50%{opacity:1;}}
.kb-screen-lcd .kb-ips-grid{position:absolute; inset:0; background-image:linear-gradient(rgba(11,79,108,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(11,79,108,.08) 1px, transparent 1px); background-size:10px 10px;}
.kb-screen-lcd .kb-bars{position:absolute; left:14%; right:14%; bottom:16%; display:flex; gap:6px;}
.kb-screen-lcd .kb-bars span{flex:1; height:28px; border-radius:5px;}
.kb-screen-lcd .kb-bars span:nth-child(1){background:#0b4f6c;}
.kb-screen-lcd .kb-bars span:nth-child(2){background:#00afef;}
.kb-screen-lcd .kb-bars span:nth-child(3){background:#5fd8ff;}
.kb-screen-lcd .kb-bars span:nth-child(4){background:#0b4f6c; opacity:.4;}
.kb-screen-lcd .kb-dot-row{position:absolute; top:22px; left:0; right:0; display:flex; justify-content:space-between; padding:0 16px;}
.kb-screen-lcd .kb-dot-row span{width:6px; height:6px; border-radius:50%; background:rgba(11,79,108,.35);}

/* Mini feature cards (glass/digitizer) */
.kb-mini-card{
  background:#fff; border:1px solid var(--kb-line-light); border-radius:var(--kb-radius); padding:2rem 1.8rem;
  height:100%; transition:transform .4s var(--kb-ease), box-shadow .4s var(--kb-ease), border-color .4s;
}
.kb-mini-card:hover{transform:translateY(-8px); box-shadow:0 30px 50px -25px rgba(11,79,108,.25); border-color:var(--kb-blue);}
.kb-mini-card .kb-mini-icon{
  width:52px; height:52px; border-radius:14px; background:var(--kb-ink); color:var(--kb-blue);
  display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:1.3rem;
}
.kb-mini-card h4{font-size:1.1rem; font-weight:600; margin-bottom:.6rem;}
.kb-mini-card p{font-size:.92rem; margin:0;}

/* =========================================================
   PROCESS STEPS
========================================================= */
.kb-step{position:relative; padding-top:.5rem;}
.kb-step-num{font-family:var(--kb-font-mono); font-size:.85rem; color:var(--kb-blue); font-weight:600;}
.kb-step-icon{display:block; font-size:1.8rem; color:var(--kb-ink); margin:1rem 0 1.1rem;}
.kb-step h3{font-size:1.15rem; font-weight:600; margin-bottom:.5rem;}
.kb-step p{font-size:.9rem; margin:0;}
.kb-step::after{content:''; position:absolute; top:.6rem; left:0; right:-1.4rem; height:1px; background:var(--kb-line-light); display:none;}
@media (min-width:768px){.kb-step-line{position:relative;} }

/* =========================================================
   BRANDS — COMPATIBILITY
========================================================= */
.kb-brands{
  position:relative; overflow:hidden;
  padding-top:3.5rem; padding-bottom:5rem;
  background:var(--kb-t-section-tint-bg);
  color:var(--kb-t-section-tint-text);
  border-bottom:1px solid var(--kb-t-section-tint-border);
}
.kb-brands .kb-eyebrow{color:var(--kb-t-section-tint-eyebrow);}
.kb-brands .kb-h2{color:var(--kb-t-section-tint-heading);}
.kb-brands .kb-lead-sm{color:var(--kb-t-section-tint-text);}
.kb-brands-bg{
  position:absolute; inset:0; pointer-events:none; overflow:hidden;
}
.kb-brands-bg::before,
.kb-brands-bg::after{
  content:''; position:absolute; border-radius:50%; filter:blur(80px);
  opacity:var(--kb-t-brand-orb-opacity);
  animation:kbBrandOrb 12s ease-in-out infinite alternate;
}
.kb-brands-bg::before{width:420px; height:420px; left:-8%; top:10%; background:radial-gradient(circle, rgba(0,175,239,.45), transparent 70%);}
.kb-brands-bg::after{width:360px; height:360px; right:-6%; bottom:5%; background:radial-gradient(circle, rgba(95,216,255,.3), transparent 70%); animation-delay:-6s;}
@keyframes kbBrandOrb{0%{transform:translate(0,0) scale(1);} 100%{transform:translate(30px,-20px) scale(1.08);}}

.kb-brand-bento{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:1rem;
}
@media (min-width:576px){.kb-brand-bento{grid-template-columns:repeat(3, 1fr);}}
@media (min-width:992px){.kb-brand-bento{grid-template-columns:repeat(4, 1fr); gap:1.15rem;}}

.kb-brand-tile{
  position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:.65rem;
  min-height:168px; padding:1.35rem 1rem; border-radius:22px;
  background:var(--kb-t-brand-tile-bg); border:1px solid var(--kb-t-brand-tile-border);
  transition:transform .45s var(--kb-ease), background .35s, border-color .35s, box-shadow .45s var(--kb-ease);
  cursor:default; overflow:hidden;
}
.kb-brand-tile::before{
  content:''; position:absolute; inset:0; opacity:0; transition:opacity .4s;
  background:radial-gradient(circle at 50% 0%, rgba(0,175,239,.18), transparent 65%);
}
.kb-brand-tile:hover{
  transform:translateY(-10px) rotate(-1.5deg);
  background:var(--kb-t-brand-tile-hover-bg); border-color:rgba(0,175,239,.35);
  box-shadow:var(--kb-t-brand-tile-shadow);
}
.kb-brand-tile:hover::before{opacity:1;}
.kb-brand-tile:nth-child(even):hover{transform:translateY(-10px) rotate(1.5deg);}
.kb-brand-logo-wrap{
  position:relative; z-index:1; width:72px; height:72px; border-radius:18px;
  background:var(--kb-t-brand-logo-bg); display:flex; align-items:center; justify-content:center; padding:.75rem;
  transition:transform .5s var(--kb-ease);
  box-shadow:var(--kb-t-brand-logo-shadow);
}
.kb-brand-tile:hover .kb-brand-logo-wrap{transform:scale(1.14) rotate(-4deg);}
.kb-brand-tile:nth-child(even):hover .kb-brand-logo-wrap{transform:scale(1.14) rotate(4deg);}
.kb-brand-logo-wrap img{max-width:100%; max-height:40px; object-fit:contain; display:block;}
.kb-brand-tile h4{
  position:relative; z-index:1; color:var(--kb-t-brand-tile-title); font-size:1rem; font-weight:600; margin:0;
  transition:color .3s;
}
.kb-brand-tile:hover h4{color:var(--kb-t-brand-tile-hover-title);}
.kb-brand-count{
  position:relative; z-index:1; font-family:var(--kb-font-mono); font-size:.72rem; letter-spacing:.04em;
  color:var(--kb-t-brand-count-text); background:var(--kb-t-brand-count-bg); border:1px solid var(--kb-t-brand-count-border);
  padding:.28rem .65rem; border-radius:100px; transition:background .3s, color .3s, border-color .3s;
}
.kb-brand-tile:hover .kb-brand-count{background:var(--kb-blue); color:#fff; border-color:var(--kb-blue);}

/* =========================================================
   PRODUCTS CATALOG (Gamme de Produits)
========================================================= */
.kb-products-catalog{
  background:var(--kb-t-section-tint-bg);
  border-top:1px solid var(--kb-t-section-tint-border);
  border-bottom:1px solid var(--kb-t-section-tint-border);
}
.kb-products-catalog .kb-eyebrow{color:var(--kb-t-section-tint-eyebrow);}
.kb-products-catalog .kb-h2{color:var(--kb-t-section-tint-heading);}
.kb-products-catalog .kb-lead-sm{color:var(--kb-t-section-tint-text);}
.kb-pcard{
  position:relative; cursor:pointer;
  background:var(--kb-t-pcard-bg);
  border:1px solid var(--kb-t-pcard-border); border-radius:20px; overflow:hidden;
  height:100%; display:flex; flex-direction:column;
  transition:transform .3s var(--kb-ease), box-shadow .3s, border-color .3s;
  will-change:transform;
}
.kb-pcard:hover{
  box-shadow:var(--kb-t-pcard-shadow);
  border-color:var(--kb-t-pcard-hover-border);
}
.kb-pcard-visual{
  position:relative; flex-shrink:0;
  width:100%; aspect-ratio:4/3;
  padding:0; overflow:hidden; background:var(--kb-t-pcard-visual-bg);
}
.kb-pcard-glow{
  position:absolute; width:200px; height:200px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, var(--kb-blue) 0%, transparent 70%);
  opacity:.12; top:-60px; right:-60px; z-index:2;
  transition:opacity .35s var(--kb-ease);
}
.kb-pcard:hover .kb-pcard-glow{opacity:.22;}
.kb-pcard-img-wrap{
  position:absolute; inset:0; z-index:1; width:100%; height:100%;
}
.kb-pcard-visual img{
  width:100%; height:100%; object-fit:cover; object-position:center; display:block;
  transform:scale(1.5); transform-origin:center center;
  transition:transform .4s var(--kb-ease);
}
.kb-pcard:hover .kb-pcard-visual img{transform:scale(1.59);}
.kb-pcard-body{
  padding:1.25rem 1.15rem 1.15rem; display:flex; flex-direction:column; flex:1;
}
.kb-pcard-name{
  font-family:var(--kb-font-display); font-size:1rem; font-weight:600;
  color:var(--kb-t-pcard-name); margin:0 0 .65rem; line-height:1.25;
}
.kb-pcard-price{
  font-family:var(--kb-font-display); font-size:1.2rem; font-weight:700;
  color:var(--kb-blue); margin:0 0 1rem;
}
.kb-pcard-price small{font-size:.72rem; color:var(--kb-slate-dark); font-weight:400; margin-left:.25rem;}
.kb-pcard-actions{
  display:flex; gap:.5rem; margin-top:auto;
}
.kb-pcard-btn{
  flex:1; min-width:0; display:inline-flex; align-items:center; justify-content:center; gap:.35rem;
  padding:.55rem .5rem; border-radius:100px; font-size:.78rem; font-weight:600;
  border:1px solid transparent; cursor:pointer; transition:all .25s var(--kb-ease);
  text-decoration:none; white-space:nowrap;
}
.kb-pcard-btn-cart{
  background:rgba(0,175,239,.14); border-color:rgba(0,175,239,.35); color:var(--kb-blue-light);
}
.kb-pcard-btn-cart:hover{background:var(--kb-blue); border-color:var(--kb-blue); color:#fff;}
.kb-pcard-btn-view{
  background:transparent; border-color:var(--kb-t-pcard-btn-view-border); color:var(--kb-t-pcard-btn-view-color);
}
.kb-pcard-btn-view:hover{background:var(--kb-t-pcard-btn-view-hover-bg); border-color:var(--kb-t-pcard-btn-view-hover-border); color:var(--kb-t-pcard-btn-view-hover-color);}

/* =========================================================
   TESTIMONIALS
========================================================= */
.kb-quote-card{background:#fff; border:1px solid var(--kb-line-light); border-radius:var(--kb-radius); padding:2rem; height:100%;}
.kb-quote-card i.kb-quote-mark{color:var(--kb-blue); font-size:1.6rem; opacity:.4;}
.kb-quote-card p{font-size:.98rem; color:var(--kb-ink); margin:1rem 0 1.5rem; line-height:1.65;}
.kb-avatar{
  width:42px; height:42px; border-radius:50%; background:var(--kb-blue); color:#fff; font-weight:700; font-family:var(--kb-font-display);
  display:flex; align-items:center; justify-content:center; font-size:.9rem;
}
.kb-quote-name{font-weight:600; color:var(--kb-ink); font-size:.92rem;}
.kb-quote-role{font-size:.8rem; color:var(--kb-slate);}
.kb-stars{color:var(--kb-blue); font-size:.8rem; margin-bottom:.4rem;}

/* =========================================================
   CTA BANNER
========================================================= */
.kb-cta{
  background:linear-gradient(135deg,var(--kb-ink) 0%, #0a2233 60%, #0b3a52 100%);
  border-radius:28px; padding:4rem 3rem; position:relative; overflow:hidden;
}
.kb-cta::before{
  content:''; position:absolute; width:480px; height:480px; right:-160px; top:-160px; border-radius:50%;
  background:radial-gradient(circle, rgba(0,175,239,.35), transparent 70%);
}
.kb-cta h2{color:#fff;}

/* =========================================================
   CONTACT
========================================================= */
.kb-form-control{
  background:var(--kb-fog); border:1px solid var(--kb-line-light); border-radius:12px; padding:.8rem 1rem; font-size:.95rem;
  transition:border-color .25s, box-shadow .25s;
}
.kb-form-control:focus{border-color:var(--kb-blue); box-shadow:0 0 0 3px rgba(0,175,239,.15); background:#fff;}
.kb-contact-info-item{display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.6rem;}
.kb-contact-info-item i{width:42px; height:42px; border-radius:12px; background:var(--kb-ink); color:var(--kb-blue); display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0;}
.kb-contact-info-item h5{font-size:.95rem; font-weight:600; color:var(--kb-ink); margin-bottom:.2rem;}
.kb-contact-info-item p{font-size:.88rem; margin:0;}

/* =========================================================
   FOOTER
========================================================= */
.kb-footer{background:var(--kb-ink); color:var(--kb-slate-dark); padding:5rem 0 2rem;}
.kb-footer h6{color:#fff; font-family:var(--kb-font-mono); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:1.3rem;}
.kb-footer ul{list-style:none; padding:0; margin:0;}
.kb-footer ul li{margin-bottom:.7rem;}
.kb-footer ul li a{color:var(--kb-slate-dark); font-size:.9rem; transition:color .25s;}
.kb-footer ul li a:hover{color:var(--kb-blue-light);}
.kb-social{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--kb-line); color:var(--kb-slate-dark);
  display:flex; align-items:center; justify-content:center; transition:all .3s;
}
.kb-social:hover{background:var(--kb-blue); color:#fff; border-color:var(--kb-blue); transform:translateY(-3px);}
.kb-footer-bottom{border-top:1px solid var(--kb-line); padding-top:1.6rem; margin-top:3.5rem; font-size:.82rem;}

/* Back to top */
.kb-totop{
  position:fixed; bottom:1.8rem; right:1.8rem; width:48px; height:48px; border-radius:50%; background:var(--kb-blue); color:#fff;
  display:flex; align-items:center; justify-content:center; z-index:999; opacity:0; pointer-events:none; transform:translateY(10px);
  transition:all .35s var(--kb-ease); box-shadow:0 10px 25px -8px rgba(0,175,239,.6);
}
.kb-totop.is-visible{opacity:1; pointer-events:auto; transform:translateY(0);}

@media (max-width:991px){
  .kb-section{padding:4.5rem 0;}
  .kb-section-tight{padding:3.5rem 0;}
  .kb-brands{padding-top:2.75rem; padding-bottom:3.5rem;}
  .kb-products-catalog{padding-top:3.5rem; padding-bottom:3.5rem;}
  .kb-pcard-visual{aspect-ratio:1/1;}
  .kb-pcard-name{font-size:.95rem;}
  .kb-pcard-price{font-size:1.1rem;}
  .kb-pcard-btn{font-size:.74rem; padding:.5rem .4rem;}
  .kb-product{padding:3.5rem 0;}
  .kb-hero-carousel,
  .kb-hero-carousel .carousel-inner{overflow-x:hidden; max-width:100%;}
  .kb-hero-carousel .carousel-item{
    padding-top:5.5rem; padding-bottom:5rem;
    padding-left:clamp(1.25rem, 5vw, 1.75rem);
    padding-right:clamp(1.25rem, 5vw, 1.75rem);
    overflow:hidden;
  }
  .kb-hero-carousel .carousel-item > .kb-hero-content{
    width:100%; max-width:100%; min-width:0; padding:0;
  }
  .kb-hero-content .row{--bs-gutter-x:0; margin-inline:0;}
  .kb-hero-content .row > [class*="col"]{padding-inline:0; min-width:0;}
  .kb-hero-actions{align-items:flex-start; flex-direction:column; gap:.75rem; max-width:100%;}
  .kb-hero-actions .btn{align-self:flex-start; width:auto; max-width:100%;}
  .kb-hero-actions .btn-lg{padding:.8rem 1.35rem; font-size:.95rem;}
  .kb-hero-nav{width:42px; height:42px;}
  .kb-hero-nav.carousel-control-prev{left:.5rem;}
  .kb-hero-nav.carousel-control-next{right:.5rem;}
  .kb-hero-nav .carousel-control-prev-icon,
  .kb-hero-nav .carousel-control-next-icon{width:1rem; height:1rem;}
  .kb-spec-list{grid-template-columns:1fr;}
  .kb-cta{padding:3rem 1.6rem;}
  .kb-search-overlay{align-items:flex-start; justify-content:flex-start;}
  .kb-search-panel{padding-top:4.25rem;}
  .kb-search-title{padding-right:3.5rem;}
  .kb-search-form{flex-direction:column;}
  .kb-search-input, .kb-search-submit{
    width:100%; min-height:58px; height:auto; padding:1.1rem 1.25rem;
    font-size:16px; line-height:1.25;
  }
  .kb-search-submit{justify-content:center;}
  .kb-hero-indicators-bar{display:flex; justify-content:center;}
  .kb-hero-indicators{justify-content:center;}
}
@media (max-width:575px){
  .kb-nav{padding:.9rem 0;}
  .kb-nav.is-scrolled{padding:.7rem 0;}
  .kb-nav-inner{min-height:48px;}
  .kb-brand-logo{height:clamp(24px, 7vw, 32px);}
  .kb-nav-utils{gap:.2rem;}
  .kb-nav-icon-btn{width:46px; height:46px; border-radius:12px;}
  .kb-nav-icon-btn i{font-size:1.3rem;}
  .kb-section{padding:3.25rem 0;}
  .kb-h2{font-size:clamp(1.55rem, 6.5vw, 2rem);}
  .kb-hero-carousel .carousel-item{padding-top:5rem; padding-bottom:4.5rem;}
  .kb-hero-nav{display:none;}
  .kb-hero-title{font-size:clamp(1.85rem, 8.5vw, 2.35rem); margin-bottom:1rem;}
  .kb-hero-lead{margin-bottom:1.5rem; max-width:none;}
  .kb-hero-actions .btn-lg{padding:.75rem 1.15rem; font-size:.9rem;}
  .kb-hero-indicators button{width:48px;}
  .kb-scroll-cue{display:none;}
  .kb-search-close{width:44px; height:44px; top:max(.85rem, env(safe-area-inset-top)); right:1rem;}
  .kb-search-panel{padding-top:3.75rem;}
  .kb-search-title{font-size:clamp(1.5rem, 7vw, 2rem); margin-bottom:1.15rem;}
  .kb-search-eyebrow{font-size:.68rem; margin-bottom:.75rem;}
  .kb-search-input, .kb-search-submit{min-height:56px; padding:1rem 1.15rem; border-radius:14px;}
  .kb-search-hint{font-size:.85rem; line-height:1.55;}
  .kb-footer-bottom{flex-direction:column; align-items:flex-start !important; gap:1rem !important;}
  .kb-totop{bottom:1.25rem; right:1.25rem; width:44px; height:44px;}
  .kb-pcard-btn{font-size:0; gap:0; padding:.5rem; justify-content:center;}
  .kb-pcard-btn i{font-size:1.05rem;}
}

/* =========================================================
   THEME — light / dark (post-hero content only)
========================================================= */
:root, html[data-kb-theme="light"]{
  --kb-t-bg:#ffffff;
  --kb-t-surface:var(--kb-fog);
  --kb-t-card:#ffffff;
  --kb-t-text:var(--kb-slate);
  --kb-t-heading:var(--kb-ink);
  --kb-t-border:var(--kb-line-light);
  --kb-t-eyebrow:var(--kb-blue-deep);
  --kb-t-section-tint-bg:var(--kb-fog);
  --kb-t-section-tint-border:var(--kb-line-light);
  --kb-t-section-tint-heading:var(--kb-ink);
  --kb-t-section-tint-text:var(--kb-slate);
  --kb-t-section-tint-eyebrow:var(--kb-blue-deep);
  --kb-t-brand-orb-opacity:.2;
  --kb-t-brand-tile-bg:#ffffff;
  --kb-t-brand-tile-border:var(--kb-line-light);
  --kb-t-brand-tile-title:var(--kb-ink);
  --kb-t-brand-tile-hover-bg:#ffffff;
  --kb-t-brand-tile-hover-title:var(--kb-ink);
  --kb-t-brand-tile-shadow:0 22px 44px -18px rgba(11,79,108,.18);
  --kb-t-brand-logo-bg:#ffffff;
  --kb-t-brand-logo-shadow:0 4px 14px -6px rgba(11,79,108,.12);
  --kb-t-brand-count-text:var(--kb-blue-deep);
  --kb-t-brand-count-bg:rgba(0,175,239,.1);
  --kb-t-brand-count-border:rgba(0,175,239,.22);
  --kb-t-pcard-bg:#ffffff;
  --kb-t-pcard-border:var(--kb-line-light);
  --kb-t-pcard-name:var(--kb-ink);
  --kb-t-pcard-visual-bg:var(--kb-fog-2);
  --kb-t-pcard-shadow:0 20px 40px -18px rgba(11,79,108,.14);
  --kb-t-pcard-hover-border:rgba(0,175,239,.35);
  --kb-t-pcard-btn-view-border:rgba(11,79,108,.18);
  --kb-t-pcard-btn-view-color:var(--kb-ink);
  --kb-t-pcard-btn-view-hover-bg:var(--kb-fog);
  --kb-t-pcard-btn-view-hover-border:rgba(0,175,239,.35);
  --kb-t-pcard-btn-view-hover-color:var(--kb-blue-deep);
}
html[data-kb-theme="dark"]{
  --kb-t-bg:var(--kb-ink);
  --kb-t-surface:var(--kb-ink-2);
  --kb-t-card:var(--kb-ink-3);
  --kb-t-text:var(--kb-slate-dark);
  --kb-t-heading:#ffffff;
  --kb-t-border:var(--kb-line);
  --kb-t-eyebrow:var(--kb-blue-light);
  --kb-t-section-tint-bg:var(--kb-ink);
  --kb-t-section-tint-border:var(--kb-line);
  --kb-t-section-tint-heading:#ffffff;
  --kb-t-section-tint-text:var(--kb-slate-dark);
  --kb-t-section-tint-eyebrow:var(--kb-blue-light);
  --kb-t-brand-orb-opacity:.35;
  --kb-t-brand-tile-bg:var(--kb-ink-2);
  --kb-t-brand-tile-border:var(--kb-line);
  --kb-t-brand-tile-title:#ffffff;
  --kb-t-brand-tile-hover-bg:var(--kb-ink-3);
  --kb-t-brand-tile-hover-title:#ffffff;
  --kb-t-brand-tile-shadow:0 22px 44px -18px rgba(0,175,239,.22);
  --kb-t-brand-logo-bg:rgba(255,255,255,.96);
  --kb-t-brand-logo-shadow:0 4px 14px -6px rgba(0,0,0,.25);
  --kb-t-brand-count-text:var(--kb-slate-dark);
  --kb-t-brand-count-bg:rgba(0,175,239,.12);
  --kb-t-brand-count-border:rgba(0,175,239,.22);
  --kb-t-pcard-bg:linear-gradient(145deg, rgba(17,22,33,0) 0%, #0e1220 100%);
  --kb-t-pcard-border:var(--kb-line);
  --kb-t-pcard-name:#ffffff;
  --kb-t-pcard-visual-bg:#0e1220;
  --kb-t-pcard-shadow:0 30px 60px rgba(0,0,0,.5), 0 0 40px rgba(0,175,239,.12);
  --kb-t-pcard-hover-border:rgba(0,175,239,.4);
  --kb-t-pcard-btn-view-border:rgba(255,255,255,.2);
  --kb-t-pcard-btn-view-color:#fff;
  --kb-t-pcard-btn-view-hover-bg:rgba(255,255,255,.08);
  --kb-t-pcard-btn-view-hover-border:rgba(255,255,255,.35);
  --kb-t-pcard-btn-view-hover-color:#fff;
}
html[data-kb-theme="dark"] body{background:var(--kb-ink);}

html[data-kb-theme="dark"] .kb-main .kb-eyebrow-dark{color:var(--kb-t-eyebrow);}
html[data-kb-theme="dark"] .kb-main .kb-lead-sm{color:var(--kb-t-text);}

html[data-kb-theme="dark"] .kb-main .kb-section-fog{background:var(--kb-t-surface);}

html[data-kb-theme="dark"] .kb-main .kb-gammes-block{
  background:linear-gradient(180deg, var(--kb-ink-2) 0%, var(--kb-ink) 14%, var(--kb-ink) 100%);
  border-bottom-color:var(--kb-t-border);
}
html[data-kb-theme="dark"] .kb-main .kb-gammes-eyebrow{color:var(--kb-blue-light);}
html[data-kb-theme="dark"] .kb-main .kb-gammes-lead{color:var(--kb-t-text);}
html[data-kb-theme="dark"] .kb-main .kb-tech-pillar{
  background:var(--kb-t-card); border-color:var(--kb-t-border);
}
html[data-kb-theme="dark"] .kb-main .kb-tech-pillar h4{color:var(--kb-t-heading);}
html[data-kb-theme="dark"] .kb-main .kb-tech-pillar p{color:var(--kb-t-text);}
html[data-kb-theme="dark"] .kb-main .kb-tech-divider{
  background:linear-gradient(180deg, transparent, var(--kb-t-border), transparent);
}
@media (max-width:575px){
  html[data-kb-theme="dark"] .kb-main .kb-tech-divider{
    background:linear-gradient(90deg, transparent, var(--kb-t-border), transparent);
  }
}

html[data-kb-theme="dark"] .kb-main .kb-product{border-bottom-color:var(--kb-t-border);}
html[data-kb-theme="dark"] .kb-main .kb-product--oled{
  background:linear-gradient(160deg, #0e0a14 0%, #12101a 45%, var(--kb-ink) 100%);
}
html[data-kb-theme="dark"] .kb-main .kb-product--lcd{background:var(--kb-ink);}
html[data-kb-theme="dark"] .kb-main .kb-product-index{color:var(--kb-t-text);}
html[data-kb-theme="dark"] .kb-main .kb-product-desc{color:var(--kb-t-text);}
html[data-kb-theme="dark"] .kb-main .kb-product--oled .kb-product-tagline{color:#c4a8ff; border-color:rgba(155,95,255,.45);}
html[data-kb-theme="dark"] .kb-main .kb-product-tagline{color:var(--kb-blue-light); border-color:rgba(0,175,239,.45);}
html[data-kb-theme="dark"] .kb-main .kb-product-highlights{
  background:rgba(255,255,255,.04); border-color:var(--kb-t-border);
}
html[data-kb-theme="dark"] .kb-main .kb-product-highlight{border-color:var(--kb-t-border);}
html[data-kb-theme="dark"] .kb-main .kb-product--oled .kb-product-highlight-val{color:#c4a8ff;}
html[data-kb-theme="dark"] .kb-main .kb-product-highlight-val{color:var(--kb-blue-light);}
html[data-kb-theme="dark"] .kb-main .kb-product-highlight-lbl{color:var(--kb-t-text);}
html[data-kb-theme="dark"] .kb-main .kb-spec-chip{
  background:rgba(255,255,255,.04); border-color:var(--kb-t-border); color:var(--kb-t-text);
}
html[data-kb-theme="dark"] .kb-main .kb-spec-chip b{color:var(--kb-t-heading);}
html[data-kb-theme="dark"] .kb-main .kb-spec-chip:hover{background:rgba(255,255,255,.07); border-color:rgba(0,175,239,.35);}

html[data-kb-theme="dark"] .kb-main .kb-mini-card{
  background:var(--kb-t-card); border-color:var(--kb-t-border);
}
html[data-kb-theme="dark"] .kb-main .kb-mini-card p{color:var(--kb-t-text);}

html[data-kb-theme="dark"] .kb-main .kb-step-icon{color:var(--kb-t-heading);}
html[data-kb-theme="dark"] .kb-main .kb-step p{color:var(--kb-t-text);}

html[data-kb-theme="dark"] .kb-main .kb-quote-card{
  background:var(--kb-t-card); border-color:var(--kb-t-border);
}
html[data-kb-theme="dark"] .kb-main .kb-quote-card p{color:var(--kb-t-text);}
html[data-kb-theme="dark"] .kb-main .kb-quote-name{color:var(--kb-t-heading);}
html[data-kb-theme="dark"] .kb-main .kb-quote-role{color:var(--kb-t-text);}

html[data-kb-theme="dark"] .kb-main .kb-form-control{
  background:var(--kb-t-surface); border-color:var(--kb-t-border); color:var(--kb-t-heading);
}
html[data-kb-theme="dark"] .kb-main .kb-form-control::placeholder{color:rgba(159,183,198,.55);}
html[data-kb-theme="dark"] .kb-main .kb-form-control:focus{
  background:var(--kb-t-card); color:var(--kb-t-heading);
}
html[data-kb-theme="dark"] .kb-main .kb-contact-info-item h5{color:var(--kb-t-heading);}
html[data-kb-theme="dark"] .kb-main .kb-contact-info-item p{color:var(--kb-t-text);}
html[data-kb-theme="dark"] .kb-main .form-label{color:var(--kb-t-text);}

html[data-kb-theme="dark"] .kb-main .kb-product--lcd .kb-product-badge{
  background:rgba(0,175,239,.12); color:var(--kb-blue-light);
}
html[data-kb-theme="dark"] .kb-main .kb-product--oled .kb-product-badge{
  background:rgba(123,47,255,.15); color:#c4a8ff;
}

html[data-kb-theme="dark"] .kb-main .btn-kb-outline-dark{
  border-color:var(--kb-t-border); color:var(--kb-t-heading);
}
html[data-kb-theme="dark"] .kb-main .btn-kb-outline-dark:hover{
  background:var(--kb-blue); border-color:var(--kb-blue); color:#fff;
}
html[data-kb-theme="dark"] .kb-main .btn-kb-subtle{
  border-color:var(--kb-t-border); color:var(--kb-t-text);
}
html[data-kb-theme="dark"] .kb-main .btn-kb-subtle:hover{
  background:var(--kb-t-surface); border-color:var(--kb-blue); color:var(--kb-blue-light);
}

html[data-kb-theme="dark"] .kb-nav.is-scrolled{
  background:rgba(6,11,18,.94); box-shadow:0 1px 0 rgba(255,255,255,.06);
}
