/* ==========================================================
   KING-TECH + MANDAS MERGED — FULL CLEAN (NO REDUNDANCY)
   ✅ Matches your current JS:
      - .kt-header: .is-top / .is-scrolled
      - .kt-topbar: .is-hidden
      - .kt-menu.open / #ktOverlay.active / .kt-menu-btn.active
      - .kt-dd.open
      - #ktBackToTop.show
      - #ktMailModal.open
      - #ktUpdModal.open
      - #preloader.kt-hide
   ✅ Fixes: Hero video starts from top (home only) + nav/topbar overlay (Mandas style)
   ✅ Fixes: removes duplicate/invalid nested media queries
   ========================================================== */


/* ===============================
   ROOT VARIABLES (KINGTECH)
================================ */
:root{
  /* KING-TECH BRAND */
  --blue: #2D8CFF;
  --blueDark: #0B6FE6;

  /* Topbar base color */
  --topbar: #0B6FE6;

  /* BASE */
  --bg: #ffffff;
  --text: #0b1020;
  --muted: #5b667a;
  --line: #e7ecf5;

  /* Cards */
  --card: #0b0f18;
  --cardText: #ffffff;
  --cardMuted: #b8c3d6;

  /* UI */
  --radius: 18px;
  --shadow: 0 14px 40px rgba(10,20,40,.10);

  /* Container */
  --container: 1200px;

  /* DESKTOP TOPBAR */
  --topbar-font: 13px;
  --topbar-pad-y: 10px;

  /* DESKTOP NAVBAR */
  --nav-height: 81px;
  --nav-height-scrolled: 78px;
  --nav-pad-y: 15px;
  --nav-pad-y-scrolled: 10px;

  --logo-height: 66px;
  --logo-height-scrolled: 44px;

  --nav-font: 15px;
  --nav-font-scrolled: 14px;

  /* NAV & TOPBAR OPACITY (edit here) */
  --nav-opacity-top: .45;          /* 0.0 - 1.0 */
  --nav-opacity-scroll: .92;       /* 0.0 - 1.0 */
  --topbar-opacity-top: .55;       /* on hero (home) */
  --topbar-opacity-scroll: .95;    /* after scroll */

  /* Link colors */
  --kt-nav-top-link: #fff;
  --kt-nav-scroll-link: #0b1020;

  /* Topbar hide animation */
  --kt-topbar-hide-y: -120%;

  /* Floating spacing */
  --toTop-right: 18px;
  --toTop-bottom: 18px;
  --fabs-bottom: 76px; /* keeps fabs above Back-To-Top */

  /* Overlay for menu */
  --overlay-bg: rgba(0,0,0,.38);
  --overlay-blur: 10px;

  /* ===== Mandas-only tokens (renamed) ===== */
  --mandas-gold: #c6a15b;
  --mandas-overlay-bg: rgba(0,0,0,.38);
  --mandas-overlay-blur: 10px;

  /* ==========================================================
     HERO CONTROL PANEL (EDIT HERE)
     ========================================================== */
  --kt-hero-min-vh: 71vh;
  --kt-hero-pad-top: 95px;
  --kt-hero-pad-bottom: 90px;

  --kt-hero-blur: 8px;
  --kt-hero-scale: 1.08;
  --kt-hero-video-shift: -20px;
  --kt-hero-object-y: 10%;

  --kt-hero-overlay-alpha: .55;

  --kt-hero-card-width: 860px;
  --kt-hero-card-radius: 26px;
  --kt-hero-card-pad-y: 36px;
  --kt-hero-card-pad-x: 28px;
  --kt-hero-card-mt: 110px;

  --kt-hero-card-shadow: 0 25px 70px rgba(0,0,0,.55);

  /* HERO CARD POSITION CONTROLS */
  --kt-card-y: 0px;
  --kt-h1-y: 0px;
  --kt-type-y: 0px;
  --kt-cta-y: 0px;
  --kt-badges-y: 0px;

  --kt-card-gap: 16px;
  --kt-cta-gap: 12px;

  /* HERO TEXT */
  --kt-hero-title-size: clamp(28px, 4vw, 52px);
  --kt-hero-title-letter: .06em;
  --kt-hero-title-line: 1.08;

  --kt-hero-title-color: #fff;

  /* BUTTONS */
  --kt-hero-btn-gap: 12px;
  --kt-hero-btn-mt: 18px;

  --kt-hero-btn-primary-bg: linear-gradient(135deg,var(--blue),var(--blueDark));
  --kt-hero-btn-primary-color: #fff;

  --kt-hero-btn-dark-bg: rgba(0,0,0,.40);
  --kt-hero-btn-dark-color: #fff;
  --kt-hero-btn-dark-border: rgba(255,255,255,.28);

  /* Home overlay bars sizing helper */
  --kt-topbar-h: 44px;
  --kt-hero-safe-top: calc(var(--nav-height) + var(--kt-topbar-h) + 20px);
  --kt-hero-content-y: 0px;
}


/* ===============================
   GLOBAL FOUNDATION
================================ */
*{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
}
html,body{
  height:100%;
  max-width:100%;
  overflow-x:hidden;
}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background:var(--bg);
  color:var(--text);
}
a{color:inherit;text-decoration:none}
img,video,iframe{max-width:100%;height:auto;display:block}
.container{width:min(var(--container),92%);margin:0 auto}


/* ===============================
   NAVBAR (KINGTECH)
================================ */
.kt-header{
  position:sticky;
  top:0;
  z-index:999;
  transition:background .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.kt-header.is-top{
  background: rgba(0,0,0,var(--nav-opacity-top));
  border-bottom: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:none;
}
.kt-header.is-scrolled{
  background: rgba(255,255,255,var(--nav-opacity-scroll));
  border-bottom:1px solid rgba(0,0,0,.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:0 10px 30px rgba(10,20,40,.10);
}

.kt-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  height:var(--nav-height);
  padding:var(--nav-pad-y) 0;
  position:relative;
  transition:height .18s ease, padding .18s ease;
}
.kt-header.is-scrolled .kt-nav{
  height:var(--nav-height-scrolled);
  padding:var(--nav-pad-y-scrolled) 0;
}
.kt-brand{display:flex;align-items:center;gap:10px}
.kt-logo{
  height:var(--logo-height);
  width:auto;
  transition:height .18s ease;
}
.kt-header.is-scrolled .kt-logo{height:var(--logo-height-scrolled)}

/* Desktop links */
.kt-menu{display:flex;align-items:center;gap:22px}
.kt-link,
.kt-dd-btn{
  font-weight:900;
  font-size:var(--nav-font);
  opacity:.92;
  transition:font-size .18s ease, opacity .18s ease, color .18s ease;
}
.kt-link:hover,
.kt-dd-btn:hover{opacity:1}

.kt-header.is-top .kt-link,
.kt-header.is-top .kt-dd-btn{color:var(--kt-nav-top-link)}
.kt-header.is-scrolled .kt-link,
.kt-header.is-scrolled .kt-dd-btn{color:var(--kt-nav-scroll-link)}

.kt-link.active{color:var(--blue) !important}
.kt-header.is-scrolled .kt-link,
.kt-header.is-scrolled .kt-dd-btn{font-size:var(--nav-font-scrolled)}

/* Dropdown */
.kt-dd{position:relative}
.kt-dd-btn{
  border:none;
  background:transparent;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0;
}
.kt-caret{opacity:.7}
.kt-dd-menu{
  position:absolute;
  top:calc(100% + 12px);
  left:0;
  min-width:280px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
  box-shadow:0 18px 50px rgba(10,20,40,.12);
  display:none;
  z-index:1002;
}
.kt-dd-menu a{
  display:block;
  padding:10px 10px;
  border-radius:10px;
  font-weight:800;
  color:var(--text);
}
.kt-dd-menu a:hover{background:#f3f7ff}
.kt-dd.open .kt-dd-menu{display:block}

/* CTA buttons */
.kt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 14px;
  border-radius:14px;
  font-weight:900;
  border:1px solid rgba(45,140,255,.25);
  transition:filter .12s ease, transform .12s ease, font-size .18s ease;
  font-size:var(--nav-font);
}
.kt-header.is-scrolled .kt-btn{font-size:var(--nav-font-scrolled)}
.kt-btn:hover{filter:brightness(1.03);transform:translateY(-1px)}
.kt-btn-quote{background:#fff;color:var(--blue);border:1px solid rgba(45,140,255,.45)}
.kt-btn-book{
  background:linear-gradient(135deg,var(--blue),var(--blueDark));
  color:#fff;
  border:1px solid rgba(45,140,255,.35);
}
.kt-bell{margin-right:8px}


/* ===============================
   TOPBAR (KINGTECH)
================================ */
.kt-topbar{
  background: rgba(11,111,230,.95);
  color:#fff;
  font-size:var(--topbar-font);
  position:sticky;
  top:0;
  z-index:998;
  transition:transform .18s ease, opacity .18s ease;
}
.kt-topbar.is-hidden{
  transform:translateY(var(--kt-topbar-hide-y));
  opacity:0;
  pointer-events:none;
}
.kt-topbar .inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  padding:var(--topbar-pad-y) 0;
}
.kt-topbar-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.kt-topchip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-weight:800;
  white-space:nowrap;
}
.kt-social{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#fff;
  opacity:.95;
}
.kt-topbar a{color:#fff;opacity:.95}
.kt-topbar a:hover{opacity:1}
.kt-ic{
  width:18px;height:18px;border-radius:6px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.14);
  font-size:11px;font-weight:900;
}


/* ===============================
   SECTIONS / UI (KINGTECH)
================================ */
.section{padding:56px 0}
.section.alt{
  background:#f6f8fc;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.section-head{margin-bottom:18px}
h1,h2{
  font-family:Orbitron,Inter;
  margin:0 0 10px;
  line-height:1.1;
}
h1{font-size:clamp(30px,4vw,46px)}
p{margin:0}
.muted{color:var(--muted)}

.cta{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 16px;
  border-radius:14px;
  background:var(--kt-hero-btn-primary-bg);
  border:1px solid rgba(45,140,255,.35);
  color:var(--kt-hero-btn-primary-color);
  font-weight:900;
  box-shadow:0 10px 25px rgba(45,140,255,.18);
}
.btn:hover{filter:brightness(1.03)}
.btn-outline{
  background:#fff;
  color:var(--text);
  border:1px solid rgba(45,140,255,.35);
  box-shadow:none;
}
.btn-outline:hover{background:#f3f7ff}

/* Grids */
.grid3{display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
.grid4{display:grid;gap:14px;grid-template-columns:repeat(4,1fr)}
.grid5{display:grid;gap:14px;grid-template-columns:repeat(5,1fr)}

/* Cards */
.card{
  border-radius:var(--radius);
  padding:18px;
  background:var(--card);
  color:var(--cardText);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 16px 45px rgba(0,0,0,.12);
  transition:transform .15s ease, border-color .15s ease;
}
.card:hover{transform:translateY(-2px);border-color:rgba(45,140,255,.45)}
.card h3{margin:0 0 8px}
.card p{margin:0;color:var(--cardMuted);line-height:1.55}

.light-card{
  border:1px solid var(--line);
  background:#fff;
  border-radius:var(--radius);
  padding:18px;
  box-shadow:var(--shadow);
}
.light-card h3{margin:0 0 8px}
.light-card p{margin:0;color:var(--muted);line-height:1.55}

.icon-row{display:flex;gap:12px;align-items:flex-start}
.icon{
  width:40px;height:40px;
  border-radius:14px;
  background:linear-gradient(135deg,var(--blue),var(--blueDark));
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:900;
}

/* Accordions */
.accordion{display:grid;gap:12px}
details{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow);
  padding:14px 16px;
}
summary{cursor:pointer;font-weight:900}
details .sub{margin:10px 0 0;color:var(--muted);line-height:1.65}
.ul{margin:10px 0 0;padding-left:18px;color:var(--muted)}
.ul li{margin:8px 0}

/* Quotes */
.quote{
  border-radius:var(--radius);
  background:linear-gradient(135deg, rgba(45,140,255,.12), rgba(11,111,230,.06));
  border:1px solid rgba(45,140,255,.18);
  padding:18px;
}
.quote p{margin:0;line-height:1.6}
.quote .who{margin-top:10px;color:var(--muted);font-weight:900}


/* ==========================================================
   HERO VIDEO (INDEX) — BASE
========================================================== */
.hero.kt-hero-video{
  position: relative;
  min-height: var(--kt-hero-min-vh);
  padding: var(--kt-hero-pad-top) 0 var(--kt-hero-pad-bottom);
  overflow: hidden;
}

/* Background video */
.kt-hero-bgvid{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: center var(--kt-hero-object-y);
  z-index:0;
  filter: blur(var(--kt-hero-blur));
  transform: translateY(var(--kt-hero-video-shift)) scale(var(--kt-hero-scale));
}

/* Overlay */
.kt-hero-overlay{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,var(--kt-hero-overlay-alpha));
  z-index:1;
}

/* Center content */
.kt-hero-center{
  position: relative;
  z-index:2;
  display:flex;
  justify-content:center;
}

/* Glass Card */
.kt-hero-card{
  width: min(var(--kt-hero-card-width), 92%);
  text-align: center;
  padding: var(--kt-hero-card-pad-y) var(--kt-hero-card-pad-x);
  margin-top: var(--kt-hero-card-mt);

  background:
    linear-gradient(180deg, rgba(15,25,45,.65), rgba(10,18,34,.85)),
    rgba(45,140,255,.22);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  border: 1px solid rgba(255,255,255,.22);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.18),
    var(--kt-hero-card-shadow);

  border-radius: var(--kt-hero-card-radius);

  display:flex;
  flex-direction:column;
  align-items:center;
  gap: var(--kt-card-gap);

  transform: translateY(var(--kt-card-y));
}

/* Title */
.kt-hero-title h1{
  margin:0;
  font-family: Orbitron, Inter;
  font-weight: 900;
  letter-spacing: var(--kt-hero-title-letter);
  color: var(--kt-hero-title-color);
  font-size: var(--kt-hero-title-size);
  line-height: var(--kt-hero-title-line);
  text-transform: uppercase;
  transform: translateY(var(--kt-h1-y));
}

/* Typewriter wrapper */
.kt-hero-type{
  margin-top: 12px;
  text-align: center;
  transform: translateY(var(--kt-type-y));
}

/* Typewriter text */
#ktTypewriter{
  font-weight: 800;
  letter-spacing: .02em;
  background: linear-gradient(90deg, #ffffff 0%, #2D8CFF 55%, #ffffff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* CTA */
.kt-hero-cta-center{
  justify-content:center;
  gap: var(--kt-hero-btn-gap);
  margin-top: var(--kt-hero-btn-mt);
  transform: translateY(var(--kt-cta-y));
}
.kt-hero-card .kt-hero-cta-center{ gap: var(--kt-cta-gap); }

/* Dark button */
.kt-btn-dark{
  background: var(--kt-hero-btn-dark-bg) !important;
  color: var(--kt-hero-btn-dark-color) !important;
  border: 1px solid var(--kt-hero-btn-dark-border) !important;
}
.kt-btn-dark:hover{ background: rgba(255,255,255,.10) !important; }


/* ===============================
   FOOTER (KINGTECH)
================================ */
.footer{padding:42px 0;border-top:1px solid var(--line);background:#fff}
.footer-grid{display:grid;gap:18px;grid-template-columns:1.2fr 1fr 1fr}
.footer h4{margin:0 0 10px;font-family:Orbitron,Inter}
.footer a{display:block;margin:8px 0;color:var(--muted)}
.footer a:hover{color:var(--text)}
.footnote{margin-top:20px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted)}
.map{width:100%;height:220px;border:0;border-radius:16px;box-shadow:var(--shadow)}


/* ===============================
   FLOATING ACTIONS (KINGTECH)
================================ */
.kt-fabs{
  position:fixed;
  right:var(--toTop-right);
  bottom:var(--fabs-bottom);
  z-index:10040;
  display:flex;
  flex-direction:column;
  gap:10px;
  pointer-events:none;
}
.kt-fabs *{pointer-events:auto}
.kt-fab-wrap{position:relative}
.kt-fab{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:999px;
  border:1px solid rgba(45,140,255,.35);
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  color:var(--text);
  font-weight:900;
  box-shadow:0 12px 30px rgba(10,20,40,.12);
  cursor:pointer;
}
.kt-fab:hover{border-color:rgba(45,140,255,.65)}
.kt-fab-ic{
  width:30px;height:30px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--blue),var(--blueDark));
  color:#fff;
}
.kt-fab-tx{font-family:Orbitron,Inter;letter-spacing:.04em;font-size:12px}
.kt-fab-menu{
  position:absolute;
  right:0;
  bottom:calc(100% + 10px);
  display:grid;
  gap:8px;
  min-width:210px;
  padding:10px;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 18px 40px rgba(10,20,40,.16);
  transform-origin:bottom right;
  transform:scale(.98);
  opacity:0;
  pointer-events:none;
  transition:opacity .15s ease, transform .15s ease;
}
.kt-fab-menu.open{opacity:1;transform:scale(1);pointer-events:auto}
.kt-fab-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--text);
  font-weight:900;
}
.kt-fab-item:hover{border-color:rgba(45,140,255,.45);background:#f3f7ff}
.kt-mini-ic{width:24px;display:flex;align-items:center;justify-content:center}

/* Back to top */
.kt-backtotop{
  position:fixed;
  right:var(--toTop-right);
  bottom:var(--toTop-bottom);
  z-index:10050;
  width:48px;
  height:48px;
  border-radius:14px;
  border:1px solid rgba(45,140,255,.35);
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 12px 30px rgba(10,20,40,.18);
  color:var(--text);
  font-weight:900;
  cursor:pointer;
  display:none;
  align-items:center;
  justify-content:center;
}
.kt-backtotop.show{display:flex}


/* ===============================
   MODAL (KINGTECH)
================================ */
.kt-modal{
  position:fixed;
  inset:0;
  background:rgba(8,14,28,.55);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  display:none;
  z-index:10000;
}
.kt-modal.open{display:grid;place-items:center}
.kt-modal-card{
  width:min(920px,94%);
  max-height:90vh;
  overflow:auto;
  border-radius:18px;
  border:1px solid rgba(45,140,255,.18);
  background:#fff;
  box-shadow:0 26px 70px rgba(10,20,40,.25);
}
.kt-modal-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:18px;
  border-bottom:1px solid var(--line);
}
.kt-modal-title{margin:0;font-family:Orbitron,Inter}
.kt-modal-sub{margin:6px 0 0;color:var(--muted)}
.kt-modal-close{
  background:#fff;
  border:1px solid var(--line);
  color:var(--text);
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
}
.kt-modal-close:hover{border-color:rgba(45,140,255,.45)}
.kt-modal-form{padding:18px;display:grid;gap:10px}
.kt-input{
  width:100%;
  padding:14px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--text);
  outline:none;
}
.kt-input:focus{border-color:rgba(45,140,255,.55)}
.kt-modal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}


/* ===============================
   UPDATES POPUP
================================ */
.kt-upd-modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:14px;
  background:rgba(0,0,0,.55);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  z-index:25000;
}
.kt-upd-modal.open{display:flex}

.kt-upd-card{
  width:min(560px,92vw);
  background:rgba(255,255,255,.95);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  border:1px solid rgba(45,140,255,.20);
  border-radius:18px;
  box-shadow:0 22px 65px rgba(0,0,0,.25);
  padding:18px 18px 16px;
  position:relative;
  cursor:pointer;
}
.kt-upd-close{
  position:absolute;
  top:10px;
  right:10px;
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(255,255,255,.92);
  cursor:pointer;
}
.kt-upd-close:hover{border-color:rgba(45,140,255,.35)}
.kt-upd-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  color:#0b1020;
  border:1px solid rgba(45,140,255,.22);
  background:rgba(45,140,255,.08);
  margin-bottom:10px;
}
.kt-upd-title{
  margin:0 0 8px;
  font-family:Orbitron,Inter;
  font-weight:900;
  font-size:18px;
  line-height:1.2;
}
.kt-upd-text{
  margin:0 0 10px;
  color:rgba(11,16,32,.85);
  line-height:1.55;
  font-weight:600;
}
.kt-upd-meta{
  font-size:12px;
  font-weight:800;
  color:rgba(11,16,32,.55);
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:12px;
}
.kt-upd-btn{
  width:100%;
  border:none;
  border-radius:14px;
  padding:12px 14px;
  font-weight:900;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--blueDark));
}


/* ===============================
   PRELOADER
================================ */
body.kt-preloading{
  overflow:hidden !important;
  height:100vh !important;
}
.kt-preloader{
  position:fixed;
  inset:0;
  z-index:30000;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  opacity:1;
  visibility:visible;
  transition:opacity .45s ease, visibility .45s ease;
}
.kt-preloader.kt-hide{opacity:0;visibility:hidden}
.kt-preloader-inner{
  display:grid;
  place-items:center;
  transform:scale(1);
  transition:transform .45s ease;
}
.kt-preloader.kt-hide .kt-preloader-inner{transform:scale(.96)}
.kt-preloader-ring{
  position:relative;
  width:140px;
  height:140px;
  display:grid;
  place-items:center;
}
.kt-preloader-logo{
  width:86px;
  height:auto;
  display:block;
  border-radius:14px;
  animation:ktGlow 1.6s ease-in-out infinite;
}
@keyframes ktGlow{
  0%,100%{filter:drop-shadow(0 8px 18px rgba(10,20,40,.18));transform:scale(1)}
  50%{filter:drop-shadow(0 10px 26px rgba(45,140,255,.22));transform:scale(1.02)}
}
.kt-preloader-ring .arc{
  position:absolute;
  inset:0;
  border-radius:50%;
  border:6px solid transparent;
  border-top-color:rgba(45,140,255,.95);
  border-right-color:rgba(45,140,255,.30);
  animation:ktSpin 1.35s linear infinite;
  will-change:transform;
}
.kt-preloader-ring .arc-1{inset:-6px;animation-duration:1.35s}
.kt-preloader-ring .arc-2{inset:7px;animation-duration:1.65s}
.kt-preloader-ring .arc-3{inset:20px;animation-duration:1.95s;animation-direction:reverse}
@keyframes ktSpin{to{transform:rotate(360deg)}}

@media (prefers-reduced-motion: reduce){
  .kt-preloader-ring .arc,
  .kt-preloader-logo{animation:none !important}
  .kt-preloader,
  .kt-preloader-inner{transition:none !important}
}


/* ==========================================================
   MOBILE MENU (Mandas-style drawer adapted for KingTech)
========================================================== */

/* Hamburger button */
.kt-menu-btn{
  display:none;
  position:relative;
  width:34px;
  height:24px;
  border:none;
  background:transparent;
  cursor:pointer;
  padding:0;
  z-index:30020;
}
.kt-menu-btn .bar{
  height:3px;
  width:100%;
  border-radius:2px;
  display:block;
  transition:transform .35s ease, opacity .25s ease, background-color .35s ease;
}
.kt-menu-btn .bar:nth-child(2){margin:6px 0}

/* Hamburger colors follow nav state */
.kt-header.is-top .kt-menu-btn .bar{background:#fff}
.kt-header.is-scrolled .kt-menu-btn .bar{background:#111}

.kt-menu-btn.active .bar:nth-child(1){
  transform:translateY(9px) rotate(45deg);
  background:var(--blueDark);
}
.kt-menu-btn.active .bar:nth-child(2){opacity:0}
.kt-menu-btn.active .bar:nth-child(3){
  transform:translateY(-9px) rotate(-45deg);
  background:var(--blueDark);
}

/* lock scroll */
body.kt-menu-open{
  overflow:hidden !important;
  height:100vh !important;
  touch-action:none;
}

/* Overlay */
.kt-overlay{
  position:fixed;
  inset:0;
  background:var(--overlay-bg);
  -webkit-backdrop-filter:blur(var(--overlay-blur));
  backdrop-filter:blur(var(--overlay-blur));
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .35s ease, visibility .35s ease;
  z-index:30000;
}
.kt-overlay.active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}


/* ===============================
   RESPONSIVE
================================ */
@media (max-width:980px){
  :root{
    --nav-height: 72px;
    --nav-height-scrolled: 74px;
    --nav-pad-y: 14px;
    --nav-pad-y-scrolled: 10px;

    --logo-height: 52px;
    --logo-height-scrolled: 50px;

    --nav-font: 15px;
    --nav-font-scrolled: 13px;

    --topbar-font: 10px;
    --topbar-pad-y: 8px;

    --kt-topbar-h: 40px;

    /* hero mobile tuning */
    --kt-hero-min-vh: 72vh;
    --kt-hero-card-mt: 70px;
    --kt-hero-card-pad-y: 26px;
    --kt-hero-card-pad-x: 16px;

    --kt-card-gap: 14px;
    --kt-cta-gap: 10px;
  }

  .kt-menu-btn{display:block}

  /* Keep your mobile topbar always visible */
  .kt-topbar{position:relative}
  .kt-topbar.is-hidden{
    transform:none !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
  .kt-topbar-social{display:none !important}

  .kt-topbar .inner{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:nowrap;
    white-space:nowrap;
    gap:6px;
  }
  .kt-topbar-contact{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:nowrap;
    white-space:nowrap;
    gap:6px;
    width:100%;
    min-width:0;
  }
  .kt-topchip{
    flex:1 1 0;
    min-width:0;
    padding:3px 6px;
    border-radius:10px;
    font-size:10px;
    gap:4px;
    line-height:1.1;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .kt-topchip span{
    display:inline-block;
    min-width:0;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    vertical-align:bottom;
  }

  /* Drawer uses SAME .kt-menu */
  .kt-menu{
    position:fixed;
    top:0;
    right:-320px;
    width:min(86vw,320px);
    height:100svh;

    background:rgba(255,255,255,.94);
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);

    border-left:1px solid rgba(45,140,255,.25);
    border-radius:16px 0 0 16px;
    box-shadow:-10px 0 28px rgba(0,0,0,.28);

    padding:18px 22px;
    padding-top:calc(var(--nav-height) + 18px);
    gap:14px;

    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:flex-start;

    overflow-y:auto;
    -webkit-overflow-scrolling:touch;

    opacity:0;
    transition:right .55s cubic-bezier(.25,1,.3,1), opacity .45s ease;
    z-index:30010;
  }
  .kt-menu.open{right:0;opacity:1}

  .kt-menu .kt-link,
  .kt-menu .kt-dd-btn{
    width:100%;
    text-align:left;
    justify-content:flex-start;
    font-size:1.02rem;
    letter-spacing:.5px;
    text-transform:uppercase;
    font-weight:900;
    opacity:1;
    color:var(--text) !important;
  }
  .kt-menu .kt-link:hover,
  .kt-menu .kt-dd-btn:hover{color:var(--blueDark) !important}

  .kt-menu .kt-btn{width:100%;justify-content:center}

  .kt-dd{width:100%}
  .kt-dd-menu{
    position:static;
    width:100%;
    min-width:unset;
    border:1px solid rgba(0,0,0,.08);
    box-shadow:none;
    margin-top:8px;
  }
  .kt-dd-menu a{padding:12px 12px}

  /* Collapse grids */
  .grid5{grid-template-columns:1fr 1fr}
  .grid3{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}

@media (max-width:640px){
  .kt-fab-tx{display:none}
  .kt-fab{padding:12px}
  .grid4{grid-template-columns:1fr}
  .grid5{grid-template-columns:1fr}
}
@media (max-width:420px){
  .kt-topchip{font-size:9px;padding:3px 5px}
}


/* ==========================================================
   MANDAS FULL CSS (SCOPED)
   Use: <body class="mandas-scope">
========================================================== */
body.mandas-scope{
  color-scheme: light only;
  --gold: var(--mandas-gold);
  --dark: #111;
  --mandas-muted-bg: #f7f7f7;

  --nav-bg-color-default: 0,0,0;
  --nav-bg-opacity-default: .35;
  --nav-bg-opacity-scrolled: .95;

  --nav-height-default: 92px;
  --nav-height-scrolled: 95px;

  --nav-blur: 8px;
  --logo-size-default: 100px;
  --logo-size-scrolled: 100px;

  --nav-link-align-desktop: right;
  --nav-link-color-default: #fff;
  --nav-link-color-scrolled: #000;
  --nav-link-hover-color: var(--gold);
  --nav-link-font-weight: 500;

  --mobile-link-color: #000;
  --mobile-link-hover-color: var(--gold);

  --mobile-menu-opacity: .92;
  --mobile-menu-border: 1px solid var(--gold);
  --mobile-menu-radius: 12px;
  --mobile-menu-inner-gap: 18px;

  --overlay-bg: rgba(0,0,0,.38);
  --overlay-blur: 4px;

  --float-position: 35%;
  --hero-overlay: rgba(0,0,0,.32);

  --md-title-size: 27px;
  --md-nights-size: 11px;
}

/* (Your Mandas scoped rules kept exactly as you provided) */
body.mandas-scope #preloader{
  position: fixed; inset: 0; background:#fff;
  display:flex; align-items:center; justify-content:center;
  z-index:9999; transition: opacity .5s, visibility .5s;
}
body.mandas-scope .preloader-content{ text-align:center; }
body.mandas-scope .logo-ring{ position:relative; display:inline-block; }
body.mandas-scope .preloader-logo{
  width:92px; height:auto; display:block;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.12));
}
body.mandas-scope .logo-ring .ring{
  position:absolute; inset:-16px;
  border:3px solid rgba(198,161,91,.35);
  border-top-color: var(--gold);
  border-radius:50%;
  animation: mandas-spin 1.2s linear infinite;
}
@keyframes mandas-spin{ to{ transform: rotate(360deg); } }

/* ... Mandas rest (kept) ... */
/* NOTE: You can paste the rest of your Mandas scoped CSS here if you still need it. */


/* ==========================================================
   HOME ONLY: FULL SCREEN VIDEO HERO + NAV/TOPBAR OVERLAY
   - Makes the first screen fully video (Mandas feel)
========================================================== */
body.page-home .hero.kt-hero-video{
  min-height: 100vh;
  padding: 0 !important;
  margin: 0 !important;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
}

/* Header + topbar overlay video */
body.page-home .kt-topbar{
  position: fixed;
  top: 0;
  left:0; right:0;
  width:100%;
  z-index:20040;
  background: rgba(11,111,230,var(--topbar-opacity-top));
}
body.page-home .kt-header{
  position: fixed;
  top: var(--kt-topbar-h);
  left:0; right:0;
  width:100%;
  z-index:20050;
}

/* Topbar becomes stronger after scroll (still JS controlled) */
body.page-home .kt-header.is-scrolled ~ .kt-topbar{
  background: rgba(11,111,230,var(--topbar-opacity-scroll));
}

/* Place hero content safely below fixed bars */
body.page-home .kt-hero-center{
  width:100%;
  padding-top: var(--kt-hero-safe-top);
  padding-bottom: 70px;
  transform: translateY(var(--kt-hero-content-y));
}

/* Remove margin-top on home so it can center nicely */
body.page-home .kt-hero-card{
  margin-top: 0 !important;
}

/* Keep overlay/menu above */
body.page-home .kt-overlay{ z-index:30000; }
body.page-home .kt-menu{ z-index:30010; }
body.page-home .kt-menu-btn{ z-index:30020; }





/* ==========================================================
   FINAL HEADER / TOPBAR / HERO BEHAVIOR — KINGTECH
   Uses EXISTING JS:
   - .kt-header.is-top / .is-scrolled
   - .kt-topbar.is-hidden
========================================================== */

/* ===============================
   HOME PAGE — INITIAL STATE
   (Topbar visible, Nav below it)
================================ */
body.page-home .kt-topbar{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20040;
}

body.page-home .kt-header.is-top{
  position: fixed;
  top: var(--kt-topbar-h);
  left: 0;
  right: 0;
  z-index: 20050;
}

/* ===============================
   HOME PAGE — SCROLLED STATE
   (Topbar hidden, Nav moves UP)
================================ */
body.page-home .kt-topbar.is-hidden{
  transform: translateY(-100%);
}

body.page-home .kt-header.is-scrolled{
  position: fixed;
  top: 0; /* 🔥 THIS REMOVES THE GAP */
  left: 0;
  right: 0;
  z-index: 20050;
}

/* ===============================
   HERO SAFE POSITIONING
   (Prevents content jump)
================================ */
body.page-home .kt-hero-center{
  padding-top: calc(var(--kt-topbar-h) + var(--nav-height) + 20px);
}

/* When topbar is gone, reduce padding */
body.page-home .kt-header.is-scrolled ~ .hero .kt-hero-center{
  padding-top: calc(var(--nav-height) + 20px);
}

/* ===============================
   MOBILE — SAME LOGIC, NO GAP
================================ */
@media (max-width: 980px){

  body.page-home .kt-topbar{
    position: fixed;
    top: 0;
  }

  body.page-home .kt-header{
    position: fixed;
    top: var(--kt-topbar-h);
  }

  body.page-home .kt-topbar.is-hidden{
    transform: translateY(-100%);
  }

  body.page-home .kt-header.is-scrolled{
    top: 0; /* 🔥 NO SPACE ON MOBILE */
  }
}