:root{
  --ink:#08090c;--navy:#0d1b2a;--slate:#1e2d3d;
  --sky-dark:#0a1f35;
  --sky-mid:#163554;
  --sky:    #f2f2f2 !important;
  --sky-2:  #ebebeb !important;
  --sky-3:  #e0e0e0 !important;
  --white:#ffffff;
  --grey-1:#f4f6f9;--grey-2:#e8ecf1;--grey-3:#ccd3dc;--grey-4:#8a97a8;--grey-5:#5c6b7a;--grey-6:#2c3a48;
  --red:#c0392b;--gold:#c9973a;--accent:#393186;
  --accent-2:#393186;
  --accent-light: rgba(100,100,100,.07) !important;
  /*--font-display:'Playfair Display',serif;*/
  --font-body:'Instrument Sans',sans-serif;--font-accent:'Bebas Neue',sans-serif;
    --orange:#e07b45;
      --r-sm:8px;
  --r-md:16px;
  --r-lg:24px;
  --r-xl:32px;
  --shadow-sm:0 1px 3px rgba(0,0,0,0.07),0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:0 4px 20px rgba(0,0,0,0.08),0 1px 4px rgba(0,0,0,0.04);
  --shadow-lg:0 12px 48px rgba(0,0,0,0.12),0 4px 12px rgba(0,0,0,0.06);
  --shadow-glow:0 8px 32px rgba(192,154,82,0.22);
}

*{box-sizing:border-box;margin:0;padding:0;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--white);color:var(--grey-6);overflow-x:hidden;-webkit-font-smoothing:antialiased}
.mrtop-2{margin-top: 15px;}
.arounded{border-radius: 3px;}
.logo-electro-white{width: 76%; 
  /*background-color: #fff;*/
   padding: 6px; border-radius: 3px;}
.logo-electro{width: 76%; 
  /*background-color: #fff;*/
  display: none;
   padding: 6px; border-radius: 3px;}
  .light-nav  .logo-electro-white{display: none;}
.light-nav .logo-electro {display: block;}

.topbar{background:var(--sky-dark);padding:7px 0;font-size:.72rem;letter-spacing:.04em;z-index:300;position:relative}
.topbar .container{max-width:1240px;margin:auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.4rem}
.topbar-left{color:rgba(255,255,255,.6)}
.topbar a{color:rgba(255,255,255,.45);text-decoration:none;margin-left:1.4rem;transition:color .2s}
.topbar a:hover{color:rgba(255,255,255,.9)}
.color-b{color: #393186 !important;}
.navbar{background:rgba(8,9,12,.96);backdrop-filter:blur(24px);border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;z-index:200;padding:.55rem 0;transition:all .35s}
.navbar.light-nav{background:rgba(255,255,255,.97);border-bottom:1px solid var(--grey-2)}
.container{max-width:1240px;margin:auto;padding:0 2rem}
.nav-inner{display:flex;justify-content:space-between;align-items:center}
.nav-brand{text-decoration:none;display:flex;align-items:center;gap:.7rem}
.logo-mark{font-family:var(--font-accent);font-size:2rem;letter-spacing:.08em;color:#fff;display:flex;align-items:center;line-height:1}
.navbar.light-nav .logo-mark{color:var(--navy)}
.logo-dot{display:inline-block;width:10px;height:10px;background:var(--red);border-radius:50%;margin:0 2px;position:relative;top:-4px}
.brand-text{display:flex;flex-direction:column;gap:2px}
.brand-sub{font-weight:700;font-size:.72rem;color:var(--gold);letter-spacing:.1em;text-transform:uppercase}
.brand-tag{font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.3)}
.navbar.light-nav .brand-tag{color:var(--grey-4)}
.nav-menu {
  list-style:  none;
  display: flex;
  align-items: center;
  margin-left: auto;   /* pushes menu to the right of the logo */
  gap: 1.3rem;          /* spacing between nav items, adjust as you like */
}
.nav-item{position:relative}
.nav-link{font-weight:600;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.6);text-decoration:none;padding:.45rem .9rem;border-radius:5px;transition:color .2s,background .2s;display:flex;align-items:center;gap:.3rem;cursor:pointer;background:transparent;border:none;white-space:nowrap}
.navbar.light-nav .nav-link{color:var(--grey-5)}
.nav-link:hover,.nav-link.active{color:#fff;background:rgba(255,255,255,.07)}
.navbar.light-nav .nav-link:hover,.navbar.light-nav .nav-link.active{color:#e51e23;background:var(--grey-1)}
.nav-cta{background:var(--red)!important;color:#fff!important;padding:.42rem 1.1rem!important;border-radius:5px!important}
.nav-cta:hover{background:#a93226!important}
.arrow{font-size:.6rem;opacity:.6}
.dropdown{position:absolute;top:calc(100% + 8px);left:0;background:var(--white);border:1px solid var(--grey-2);border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,.15);padding:1rem;min-width:220px;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .24s;z-index:500}
.dropdown.wide{min-width:520px;display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.nav-item:hover .dropdown{opacity:1;visibility:visible;transform:translateY(0)}

/* ═══════════════════════════════
   MEGA DROPDOWN — PRODUCTS MENU
═══════════════════════════════ */
.mega-item { position: relative; }

.mega-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  background: #fff;
  border: 1px solid #e8ecf1;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0,0,0,.18);
  min-width: 740px;
  opacity: 0;
  visibility: hidden;
  transition: all .24s ease;
  z-index: 500;
  overflow: hidden;
}

.mega-item:hover .mega-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* top bar */
.mega-top-bar {
  background: #f4f6f9;
  border-bottom: 1px solid #e8ecf1;
  padding: .6rem 1.2rem;
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8a97a8;
}

/* two-column grid */
.mega-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.mega-col {
  padding: 1.2rem 1.1rem 1rem;
  display: flex;
  flex-direction: column;
}

.mega-col:first-child {
  border-right: 1px solid #e8ecf1;
}

/* column header */
.mcol-header {
  display: flex;
  align-items: center;
  gap: .75rem;
  /*margin-bottom: 1rem;*/
  padding-bottom: .85rem;
  border-bottom: 1px solid #f0f0f0;
}

.mcol-icon {
  width: 50px;
  height: 50px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.nvento-ico {
  background: linear-gradient(145deg, #1e2d3d, #0d1b2a);
  color: #fff;
}

.furnito-ico {
  background: linear-gradient(145deg, #2a1d0d, #1a1408);
  color: #c8a44a;
}

.mcol-range {
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8a97a8;
  margin-bottom: .15rem;
}

.mcol-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0d1b2a;
  letter-spacing: .03em;
  line-height: 1.1;
}

.furnito-title { color: #a07c1e; }

.mcol-sub {
  font-size: .68rem;
  color: #8a97a8;
  margin-top: .1rem;
}

/* product items */
.mprod-list {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  flex: 1;
}

.mprod-item {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .42rem .55rem;
  border-radius: 8px;
  text-decoration: none;
  transition: background .15s;
  cursor: pointer;
}

.mprod-item:hover { background: #f4f6f9; }
.mprod-item:hover .mprod-name { color: #393186; }

.mprod-thumb {
  width: 34px;
  height: 34px;
  border-radius: 7px;
  background: #f0f0f0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: .85rem;
  color: #393186;
}

.furnito-thumb {
  background: #f5f0e8;
  color: #c8a44a;
}

.mprod-model {
  font-size: .57rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #8a97a8;
  line-height: 1;
}

.mprod-name {
  font-size: .82rem;
  font-weight: 600;
  color: #2c3a48;
  line-height: 1.25;
  margin-top: .12rem;
  transition: color .15s;
}

.mprod-tags {
  display: flex;
  gap: .22rem;
  margin-top: .22rem;
  flex-wrap: wrap;
}

.mtag {
  font-size: .52rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 3px;
  background: rgba(57,49,134,.07);
  color: #393186;
  border: 1px solid rgba(57,49,134,.1);
}

.mtag.red {
  background: rgba(192,57,43,.07);
  color: #c0392b;
  border-color: rgba(192,57,43,.12);
}

.mtag.green {
  background: rgba(22,163,74,.07);
  color: #16a34a;
  border-color: rgba(22,163,74,.12);
}

.mtag.gold {
  background: rgba(200,164,74,.08);
  color: #a07c1e;
  border-color: rgba(200,164,74,.2);
}

/* footer links */
.mcol-footer-link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #393186;
  text-decoration: none;
  margin-top: .85rem;
  padding-top: .75rem;
  border-top: 1px solid #f0f0f0;
  transition: gap .2s;
}

.mcol-footer-link:hover { gap: .6rem; }

.furnito-flink { color: #a07c1e; }
.ft-contact-list{
  list-style:none;
  padding:0;
  margin:0 0 1rem;
}
.ft-contact-list li{
  display:flex;
  align-items:flex-start;
  gap:.6rem;
  margin-bottom:.85rem;
  font-size:.85rem;
  color:rgba(255,255,255,.75);
  line-height:1.5;
}
.ft-contact-list li i{
  color:#c1c1c1;
  margin-top:.2rem;
  width:14px;
  flex-shrink:0;
}
.ft-contact-list li a{
  color:rgba(255,255,255,.75);
  text-decoration:none;
}
.ft-contact-list li a:hover{
  color:var(--enq-gold, #C9A86C);
}
/* ── RESPONSIVE ── */
@media (max-width: 860px) {
  .mega-dropdown {
    min-width: calc(100vw - 2rem);
    left: -1rem;
    transform: translateY(10px);
  }
  .mega-item:hover .mega-dropdown {
    transform: translateY(0);
  }
}

@media (max-width: 640px) {
  #mainLockImg{width: 69%;}
  .mega-cols { grid-template-columns: revert-rule;}
  .mega-col:first-child { border-right: none; border-bottom: 1px solid #e8ecf1; }
  .mega-dropdown { min-width: 92vw;    left: -120px; }
  .mob-mrttop{margin-top: 15px;}
}

.hamburger{display:none;flex-direction:column;gap:5px;background:#000;border:none;cursor:pointer;padding:4px}
.hamburger span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:.3s}

.btn-blue{font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;background:var(--accent);color:#fff;border:none;padding:.85rem 2rem;border-radius:8px;text-decoration:none;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.5rem;box-shadow:0 4px 20px rgba(30,86,200,.3)}
.btn-blue:hover{background:#1645a8;transform:translateY(-2px);box-shadow:0 8px 32px rgba(30,86,200,.4);color:#fff}
.btn-outline-dark{font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--navy);border:1.5px solid rgba(13,27,42,.2);padding:.85rem 2rem;border-radius:8px;text-decoration:none;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.5rem}
.btn-outline-dark:hover{border-color:var(--navy);background:rgba(13,27,42,.05);transform:translateY(-2px);color:var(--navy)}
.btn-ghost-dark{font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--navy);border:1.5px solid rgba(13,27,42,.25);padding:.65rem 1.5rem;border-radius:100px;text-decoration:none;cursor:pointer;transition:all .2s}
.btn-ghost-dark:hover{background:var(--navy);color:#fff}
.btn-dark{font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;background:var(--navy);color:#fff;border:none;padding:.65rem 1.5rem;border-radius:100px;text-decoration:none;cursor:pointer;transition:all .2s}
.btn-dark:hover{background:var(--sky-dark);color:#fff}
.btn-link{font-weight:700;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;border:none;background:transparent;cursor:pointer;padding:0;transition:gap .2s}
.btn-link:hover{gap:.7rem;color:var(--navy)}

.s-kicker{font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:.55rem;margin-bottom:.6rem}
.s-kicker::before{content:'';display:inline-block;width:20px;height:2px;background:var(--accent)}
.s-kicker.center{justify-content:center}
.s-kicker.center::before{display:none}
.s-kicker.dark-k{color:var(--red)}
.s-kicker.dark-k::before{background:var(--red)}
.s-kicker.white-k{color:#393186;}
.s-kicker.white-k::before{background:#393186;}
.s-h2{font-family:var(--font-display);font-size:clamp(2.2rem,3.8vw,3.5rem);line-height:1.06;color:var(--navy);letter-spacing:-.01em}
.s-h2 em{font-style:italic;color:var(--accent)}
.s-h2 .lt{color:var(--grey-4);font-style:normal}
.s-h2.on-dark{color:#0d1b2a;}
.s-h2.on-dark .lt{color:#393186;}
.s-body{font-size:.97rem;color:var(--grey-5);line-height:1.72;margin-top:.8rem;max-width:560px}
.s-body.on-dark{color:#0d1b2a;}

/* HERO */

/* ══════════════════════════════
   HERO SLIDER
══════════════════════════════ */
#hero{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  display:flex;
  align-items:center;
}

/* slides */
.slider-track{
  display:flex;
  width:100%;
  height:100%;
  position:absolute;inset:0;
  transition:transform .75s cubic-bezier(.77,0,.18,1);
}
.slide{
  flex-shrink:0;
  width:100%;
  height:100%;
  position:relative;
  /*display:flex;*/
  align-items:center;
}

/* slide 1 */
/*.slide-1{ background:#d3d2d2; }*/
.slide-1 .hero-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(30,86,200,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(30,86,200,.04) 1px,transparent 1px);background-size:55px 55px}
.slide-1 .hc{position:absolute;border-radius:50%;border:1px solid rgba(30,86,200,.1)}
.slide-1 .hc1{width:650px;height:650px;right:-160px;top:-160px}
.slide-1 .hc2{width:440px;height:440px;right:60px;top:120px;border-color:rgba(30,86,200,.06)}
.slide-1 .hc3{width:220px;height:220px;right:220px;top:330px;border-color:rgba(30,86,200,.13)}

.hero-inner{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;
  padding:7rem 2rem 5rem;width:100%;max-width:1240px;margin:0 auto;
}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(30,86,200,.09);
  border:1px solid rgba(30,86,200,.18);
  border-radius:100px;padding:.35rem .9rem;
  font-weight:700;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#393186;margin-bottom:1.5rem}
.hero-h1{font-family:var(--font-display);font-size:clamp(3rem,5.5vw,5.4rem);line-height:1.03;color:#0d1b2a;margin-bottom:1.4rem;letter-spacing:-.02em}
.hero-h1 em{font-style:italic;color:#393186}
.hero-h1 span{display:block;color:#163554}
.hero-desc{font-size:1.05rem;color:#5c6b7a;line-height:1.72;max-width:500px;margin-bottom:2rem}
.hero-trust{display:flex;align-items:center;gap:1.5rem;margin-bottom:2.2rem;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:.4rem;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#5c6b7a}
.trust-item i{color:#393186;font-size:.8rem}
.trust-sep{width:1px;height:16px;background:#ccd3dc}
.hero-btns{display:flex;gap:.9rem;flex-wrap:wrap}
.btn-blue{font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;background:#393186;color:#fff;border:none;padding:.85rem 2rem;border-radius:8px;text-decoration:none;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.5rem;box-shadow:0 4px 20px rgba(57,49,134,.3)}
.btn-outline-dark{font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:#0d1b2a;border:1.5px solid rgba(13,27,42,.2);padding:.85rem 2rem;border-radius:8px;text-decoration:none;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.5rem}
.hero-visual{display:flex;align-items:center;justify-content:center}
.hero-img{width:100%;max-width:500px;height:auto}

/* slide 2 – dark smart features */
.slide-2{
  /*background:linear-gradient(135deg,#100c07 0%,#1e1508 40%,#2a1d0d 70%,#150f06 100%);*/
}
.slide-2-inner{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;
  padding:7rem 2rem 5rem;width:100%;max-width:1240px;margin:0 auto;
}
.s2-left{}
.s2-eyebrow{font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:1.2rem;display:flex;align-items:center;gap:.7rem}
.s2-eyebrow::before{content:'';width:22px;height:1.5px;background:var(--orange);flex-shrink:0}
.s2-h{font-family:var(--font-display);font-size:clamp(2.6rem,4.5vw,4.8rem);line-height:1.05;color:#fff;margin-bottom:.5rem}
.s2-h em{font-style:italic;color:var(--orange)}
.s2-sub{font-size:.78rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.38);margin-bottom:2rem}
.s2-feats{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.sf{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:1.2rem;transition:all .2s;cursor:default}
.sf:hover{border-color:rgba(224,123,69,.3);background:rgba(224,123,69,.06)}
.sf-ico{width:42px;height:42px;border-radius:10px;border:1px solid rgba(224,123,69,.25);display:flex;align-items:center;justify-content:center;margin-bottom:.8rem}
.sf-ico svg{width:20px;height:20px;stroke:var(--orange);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sf-name{font-weight:700;font-size:.88rem;color:#fff;margin-bottom:.25rem;line-height:1.2}
.sf-desc{font-size:.75rem;color:rgba(255,255,255,.38);line-height:1.45}

.s2-right{position:relative;display:flex;align-items:center;justify-content:center;min-height:480px}
.s2-lock-img{width:80%;max-width:420px;position:relative;z-index:2;filter:drop-shadow(0 30px 60px rgba(0,0,0,.7))}
.spy-badge{position:absolute;top:60px;right:10px;z-index:4;background:rgba(15,12,7,.92);border:1px solid rgba(224,123,69,.25);border-radius:12px;padding:14px 18px;backdrop-filter:blur(10px);min-width:200px}
.spy-label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:8px;text-align:center}
.spy-row{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:rgba(255,255,255,.35);letter-spacing:.1em}
.spy-actual{background:rgba(56,180,220,.15);border:1.5px dashed rgba(56,180,220,.4);border-radius:6px;padding:4px 14px;font-family:monospace;font-size:14px;font-weight:700;color:#56c8f0;letter-spacing:.12em}
.spy-stars{letter-spacing:.08em;font-size:13px;color:rgba(255,255,255,.25)}

/* slide 3 – app section */
.slide-3{
  /*background:#d3d2d2;*/
}
.slide-3-inner{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;
  padding:7rem 2rem 5rem;width:100%;max-width:1240px;margin:0 auto;
}
.s3-phone-wrap{display:flex;align-items:center;justify-content:center;position:relative}
.s3-phone{width:260px;background:#111;border-radius:36px;overflow:hidden;border:2px solid rgba(255,255,255,.1);box-shadow:0 40px 80px rgba(0,0,0,.8);position:relative;z-index:2}
.phone-bar{background:#1a1a1a;padding:12px 16px 8px;display:flex;justify-content:space-between;align-items:center}
.phone-time{font-size:12px;font-weight:600;color:#fff}
.phone-icons{display:flex;gap:6px;align-items:center}
.phone-icons i{font-size:9px;color:rgba(255,255,255,.7)}
.phone-header{background:#1c1c1c;padding:12px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.06)}
.ph-back{font-size:13px;color:#fff;opacity:.7}
.ph-title{font-size:14px;font-weight:600;color:#fff}
.ph-refresh{font-size:12px;color:rgba(255,255,255,.5);margin-left:auto}
.ph-date{font-size:10px;color:rgba(255,255,255,.35);padding:10px 16px 6px;font-weight:500}
.log-item{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.04)}
.log-ico{width:30px;height:30px;border-radius:8px;background:#222;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.log-ico i{font-size:.7rem;color:rgba(255,255,255,.6)}
.log-ico.warn{background:rgba(220,50,50,.15)}
.log-ico.warn i{color:#f87171}
.log-txt{flex:1}
.log-main{font-size:11px;font-weight:500;color:#fff;line-height:1.3}
.log-time{font-size:10px;color:rgba(255,255,255,.35);margin-top:2px}
.ph-date2{font-size:10px;color:rgba(255,255,255,.25);padding:8px 16px 4px}

.s3-right{}
.s3-eyebrow{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:1.4rem}
.s3-h{font-family:var(--font-display);font-size:clamp(2.8rem,4.5vw,5rem);line-height:1.02;color:#fff;margin-bottom:.4rem}
.s3-h em{font-style:normal;color:var(--orange)}
.s3-dot{display:inline-block;width:8px;height:8px;background:var(--orange);border-radius:50%;margin-left:2px;vertical-align:super;font-size:.5em}
.s3-tagline{font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:2.5rem}
.s3-features{display:flex;flex-direction:column;gap:0;border-left:1.5px solid rgba(255,255,255,.1);padding-left:0;margin-left:8px}
.s3-feat{padding:.75rem 0 .75rem 1.8rem;position:relative;cursor:pointer;transition:all .2s}
.s3-feat::before{content:'';position:absolute;left:-5px;top:50%;transform:translateY(-50%);width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.25);transition:all .2s}
.s3-feat.act::before{background:var(--orange);border-color:var(--orange);box-shadow:0 0 10px rgba(224,123,69,.5)}
.s3-feat-line{position:absolute;left:-0.75px;top:0;bottom:0;width:1.5px;background:var(--orange);transform:scaleY(0);transform-origin:top;transition:transform .3s;opacity:0}
.s3-feat.act .s3-feat-line{transform:scaleY(1);opacity:1}
.s3-feat-name{font-size:.97rem;font-weight:600;color:rgba(255,255,255,.38);transition:color .2s}
.s3-feat.act .s3-feat-name{color:#fff}

/* ── SLIDER NAV ── */
.slider-nav{
  position:absolute;bottom:106px;left:50%;transform:translateX(-50%);
  z-index:20;display:flex;align-items:center;gap:1rem;
}
.slider-arrow{width:42px;height:42px;border-radius:50%;border:1.5px solid rgba(255,255,255,.25);background:rgba(0,0,0,.3);backdrop-filter:blur(8px);color:#fff;font-size:.85rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}
.slider-arrow:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.5)}
.slider-arrow.dark{border-color:rgba(13,27,42,.2);color:#0d1b2a;background:rgba(255,255,255,.5)}
.slider-arrow.dark:hover{background:rgba(13,27,42,.1)}
.slider-dots{display:flex;gap:.5rem;align-items:center}
.sdot{height:3px;border-radius:2px;background:rgba(255,255,255,.3);cursor:pointer;transition:all .4s;width:28px}
.sdot.dark{background:rgba(13,27,42,.2)}
.sdot.active{width:56px;background:#fff}
.sdot.dark.active{background:#0d1b2a}
.video-container {
    width: 100%;
}

.video-container video {
    width: 100%;
    height: auto;
 }
/* ══════════════════════════════
   SUPER SMART SECTION
══════════════════════════════ */
/* ══════════════════════════════
   SUPER SMART SECTION
══════════════════════════════ */
#super-smart{
  background:linear-gradient(135deg,#100c07 0%,#1c1408 45%,#261b0e 70%,#110d06 100%);
  padding:7rem 0;
  position:relative;overflow:hidden;
}
#super-smart::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 70% 50%,rgba(200,150,60,.1) 0%,transparent 60%);pointer-events:none}

.ss-inner{max-width:1240px;margin:0 auto;padding:0 2rem;display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}

.ss-left{}
.ss-eyebrow{display:flex;align-items:center;gap:.7rem;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:#FBE2E6;font-weight:600;margin-bottom:1.6rem}
.ss-eyebrow::before{content:'';width:22px;height:1.5px;background:var(--orange);flex-shrink:0}
.ss-head{font-family:var(--font-display);font-size:clamp(2.8rem,4.5vw,5rem);line-height:1.03;margin-bottom:.4rem}
.ss-head .big{color:#fff;font-style:normal;display:block}
.ss-head .accent{color:#4ec98a;font-style:italic;display:block}
.ss-tagline{font-size:.75rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:2.5rem}

.ss-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.ss-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:1.4rem 1.2rem;transition:all .22s;cursor:default}
.ss-card:hover{border-color:rgba(224,123,69,.3);background:rgba(224,123,69,.07);transform:translateY(-3px)}
.ss-card-ico{width:44px;height:44px;border-radius:11px;border:1px solid rgba(224,123,69,.25);display:flex;align-items:center;justify-content:center;margin-bottom:1rem}
.ss-card-ico svg{width:20px;height:20px;stroke:#FFF;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ss-card-name{font-weight:700;font-size:.92rem;color:#fff;margin-bottom:.3rem;line-height:1.25}
.ss-card-desc{font-size:.79rem;color:rgba(255,255,255,.66);line-height:1.5}

.ss-right{position:relative;display:flex;align-items:center;justify-content:center;min-height:520px}
.ss-lock-stage{position:relative;z-index:2;width:100%;display:flex;align-items:center;justify-content:center}
.ss-lock-img{width:99%;filter:drop-shadow(0 40px 80px rgba(0,0,0,.8)) drop-shadow(0 0 40px rgba(200,150,60,.08));animation:ssFloat 5s ease-in-out infinite}
@keyframes ssFloat{0%,100%{transform:translateY(0) rotateY(-4deg)}50%{transform:translateY(-14px) rotateY(4deg)}}

/* floating spy badge */
.spy-pill{position:absolute;top:14%;right:-20px;z-index:5;background:rgba(10,8,4,.9);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 18px;backdrop-filter:blur(14px);min-width:210px;box-shadow:0 16px 40px rgba(0,0,0,.5)}
.spy-pill-title{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.3);text-align:center;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.06);padding-bottom:8px}
.spy-pill-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.spy-pill-label{font-size:9.5px;color:rgba(255,255,255,.35);letter-spacing:.1em;text-transform:uppercase}
.spy-pin{background:rgba(56,180,220,.12);border:1.5px dashed rgba(56,180,220,.45);border-radius:7px;padding:5px 14px;font-family:'Courier New',monospace;font-size:15px;font-weight:700;color:#56c8f0;letter-spacing:.14em}
.spy-stars-row{font-size:11px;color:rgba(255,255,255,.18);letter-spacing:.12em}

/* ambient glow blob behind lock */
.ss-glow{position:absolute;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(200,150,60,.09) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:1}

/* ══════════════════════════════
   MEDIA / EXPERTS SECTION
══════════════════════════════ */
#media-sec{
  background:linear-gradient(170deg,#080c14 0%,#0d1221 50%,#080c14 100%);
  padding:6rem 0 4rem;
  position:relative;overflow:hidden;
}
#media-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 55% 60% at 30% 50%,rgba(30,86,200,.07) 0%,transparent 60%);pointer-events:none}

.media-inner{max-width:1240px;margin:0 auto;padding:0 2rem}

/* top row */
.media-top{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:flex-start;margin-bottom:4rem}

/* left – big video */
.media-video-wrap{position:relative;border-radius:20px;overflow:hidden;cursor:pointer;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.media-video-thumb{width:100%;aspect-ratio:16/9;background:linear-gradient(135deg,#1a2035,#0d1525);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.mvt-bg-img{position:absolute;inset:0;object-fit:cover;opacity:.5}
.mvt-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.7) 100%)}
.yt-play{width:64px;height:64px;border-radius:50%;background:#ff0000;display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s;box-shadow:0 8px 32px rgba(255,0,0,.4);z-index:3;position:relative}
.yt-play i{font-size:1.3rem;color:#fff;margin-left:4px}
.media-video-wrap:hover .yt-play{transform:scale(1.1);box-shadow:0 12px 40px rgba(255,0,0,.6)}
.video-label{position:absolute;bottom:0;left:0;right:0;padding:1.2rem 1.4rem;z-index:3}
.vl-hashtag{font-size:.72rem;font-weight:700;color:rgba(255,255,255,.6);margin-bottom:.3rem}
.vl-title{font-size:.92rem;font-weight:700;color:#fff;line-height:1.3}
.vl-brand{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.12);border-radius:4px;padding:.15rem .5rem;font-size:.65rem;font-weight:700;color:#fff;letter-spacing:.08em;margin-top:.5rem}
.vl-brand i{font-size:.75rem}
.mvt-corner{position:absolute;top:12px;left:12px;z-index:3}
.mvt-logo{background:rgba(255,255,255,.1);backdrop-filter:blur(6px);border-radius:6px;padding:4px 10px;font-weight:700;font-size:.72rem;color:#fff}

/* right – expert col */
.media-right{}
.mr-heading{font-family:var(--font-display);font-size:clamp(1.6rem,2.8vw,2.4rem);line-height:1.1;color:#fff;margin-bottom:.3rem}
.mr-heading span{color:rgba(255,255,255,.35)}
.mr-divider{width:40px;height:2px;background:linear-gradient(90deg,var(--orange),transparent);border-radius:2px;margin:1rem 0 1.5rem}

/* carousel thumbnails */
.expert-carousel{position:relative;overflow:hidden;border-radius:14px;margin-bottom:1.2rem}
.ec-track{display:flex;gap:0;transition:transform .5s cubic-bezier(.77,0,.18,1)}
.ec-slide{flex-shrink:0;width:100%;border-radius:14px;overflow:hidden;position:relative;background:#111;cursor:pointer}
.ec-thumb{width:100%;aspect-ratio:16/9;background:linear-gradient(135deg,#1a2035,#0d1525);display:flex;align-items:flex-start;position:relative;overflow:hidden}
.ec-play{position:absolute;bottom:10px;left:10px;width:30px;height:30px;background:#ff0000;border-radius:4px;display:flex;align-items:center;justify-content:center;z-index:3}
.ec-play i{font-size:.6rem;color:#fff;margin-left:2px}
.ec-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.7) 100%)}
.ec-info{position:absolute;bottom:0;left:0;right:0;padding:.8rem 1rem;z-index:3;display:grid;grid-template-columns:1fr auto;gap:.5rem;align-items:end}
.ec-hashtag{font-size:.6rem;font-weight:700;color:rgba(255,255,255,.5)}
.ec-title{font-size:.75rem;font-weight:700;color:#fff;line-height:1.3;grid-column:1/-1}
.ec-brand-col{text-align:right}
.ec-logo{font-size:.6rem;font-weight:800;color:#fff;letter-spacing:.08em;background:rgba(255,255,255,.12);padding:2px 7px;border-radius:3px}

/* carousel nav */
.ec-nav{display:flex;gap:.5rem;justify-content:flex-end}
.ec-arr{width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;font-size:.8rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}
.ec-arr:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.4)}

/* bottom – real stories */
.media-bottom{text-align:center;padding-top:3rem;border-top:1px solid rgba(255,255,255,.06)}
.rs-heading{font-family:var(--font-display);font-size:clamp(2rem,4vw,3.5rem);color:#fff;line-height:1}
.rs-heading span{color:rgba(255,255,255,.25)}

/* ══════════════════════════════
   SUPER APP SECTION
══════════════════════════════ */
#super-app{
  background:linear-gradient(160deg,#080c14 0%,#0a0c1c 50%,#080c14 100%);
  padding:7rem 0;
  position:relative;overflow:hidden;
}
#super-app::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 25% 50%,rgba(30,86,200,.08) 0%,transparent 55%);pointer-events:none}

.sa-inner{max-width:1240px;margin:0 auto;padding:0 2rem;display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}

/* phone mockup */
.sa-phone-wrap{display:flex;align-items:center;justify-content:center;position:relative}
.sa-phone{width:280px;background:#111;border-radius:38px;overflow:hidden;border:2px solid rgba(255,255,255,.12);box-shadow:0 48px 96px rgba(0,0,0,.9),0 0 0 8px rgba(255,255,255,.02);position:relative;z-index:2;animation:saFloat 5s ease-in-out infinite}
@keyframes saFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.sa-notch{width:100px;height:22px;background:#000;border-radius:0 0 16px 16px;margin:0 auto;position:relative;z-index:3}
.sa-screen{background:#141414}

.sa-bar{background:#1a1a1a;padding:10px 16px 6px;display:flex;justify-content:space-between;align-items:center}
.sa-time{font-size:11px;font-weight:600;color:#fff}
.sa-icons{display:flex;gap:5px;align-items:center}
.sa-icons i{font-size:8px;color:rgba(255,255,255,.7)}

.sa-header{background:#1d1d1d;padding:12px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.07)}
.sa-back{font-size:13px;color:rgba(255,255,255,.6)}
.sa-title{font-size:13px;font-weight:600;color:#fff}
.sa-refresh{margin-left:auto;font-size:11px;color:rgba(255,255,255,.4)}

.sa-date{font-size:9.5px;color:rgba(255,255,255,.3);padding:9px 16px 5px;font-weight:500;text-transform:uppercase;letter-spacing:.06em}

.sa-log{display:flex;align-items:center;gap:9px;padding:9px 16px;border-bottom:1px solid rgba(255,255,255,.04)}
.sa-log-ico{width:28px;height:28px;border-radius:7px;background:#222;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sa-log-ico i{font-size:.65rem;color:rgba(255,255,255,.55)}
.sa-log-ico.warn-r{background:rgba(220,50,50,.15)}
.sa-log-ico.warn-r i{color:#f87171}
.sa-log-txt{}
.sa-log-main{font-size:10.5px;font-weight:500;color:#fff;line-height:1.25}
.sa-log-time{font-size:9px;color:rgba(255,255,255,.3);margin-top:1px}
.sa-date2{font-size:9px;color:rgba(255,255,255,.2);padding:7px 16px 3px;text-transform:uppercase;letter-spacing:.06em}

/* right side */
.sa-right{}
.sa-eyebrow{font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:1.8rem}
.sa-h{font-family:var(--font-display);font-size:clamp(3rem,3vw,5.2rem);line-height:1.0;color:#fff;margin-bottom:.2rem}
.sa-h .orange{font-style:normal;color:var(--orange)}
.sa-h .dot{display:inline-block;color:var(--orange);font-size:.8em;line-height:1}
.sa-tagline{font-size:.78rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:2.8rem}

/* vertical feature list with indicator */
.sa-features{display:flex;flex-direction:column;gap:0;padding-left:1.5rem;position:relative}
.sa-features::before{content:'';position:absolute;left:0;top:0;bottom:0;width:1.5px;background:rgba(255,255,255,.1)}
.sa-feat{padding:.8rem 0 .8rem 1.6rem;position:relative;cursor:pointer;transition:all .2s}
.sa-indicator{position:absolute;left:-4.5px;top:50%;transform:translateY(-50%);width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.3);transition:all .25s;z-index:2}
.sa-feat.active .sa-indicator{background:var(--orange);border-color:var(--orange);box-shadow:0 0 12px rgba(224,123,69,.6)}
.sa-feat-bar{position:absolute;left:-0.75px;top:0;width:1.5px;height:100%;background:var(--orange);transform:scaleY(0);transform-origin:top;transition:transform .3s ease}
.sa-feat.active .sa-feat-bar{transform:scaleY(1)}
.sa-feat-name{font-size:1.05rem;font-weight:600;color:rgba(255,255,255,.3);transition:color .2s;line-height:1}
.sa-feat.active .sa-feat-name{color:#fff}

/* RESPONSIVE */
@media(max-width:900px){
  .hero-inner,.slide-2-inner,.slide-3-inner{grid-template-columns:1fr}
  .slide-2-inner .s2-right,.slide-3-inner .s3-phone-wrap{display:none}
  .ss-inner,.sa-inner{grid-template-columns:1fr}
  .ss-right{display:block;}
  .sa-phone-wrap{display:none}
  .media-top{grid-template-columns:1fr}
}
@media(max-width:640px){
  .ss-grid{grid-template-columns:1fr}
  .s2-feats{grid-template-columns:1fr}
    #hero{min-height: 219px;}
  .hero-inner{padding:5rem 1.5rem 4rem}
  .slider-nav{bottom:-3%; }
  .fb-visual{min-height: auto !important; margin-top: 24px !important;}

}


.float-info{position:absolute;z-index:3;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.75);border-radius:14px;padding:.65rem 1rem;display:flex;align-items:center;gap:.6rem;box-shadow:0 8px 32px rgba(10,31,53,.12)}

@keyframes flt{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}



.orbit{position:absolute;border-radius:50%;border:1px dashed rgba(30,86,200,.14);animation:spinO 30s linear infinite}
.orbit1{width:420px;height:420px;top:50%;left:50%;transform:translate(-50%,-50%)}
.orbit2{width:300px;height:300px;top:50%;left:50%;transform:translate(-50%,-50%);animation-direction:reverse;animation-duration:20s}
@keyframes spinO{to{transform:translate(-50%,-50%) rotate(360deg)}}


.fi-ico{width:32px;height:32px;border-radius:8px;background:var(--accent-light);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:.85rem;flex-shrink:0}
.fi-lbl{font-size:.58rem;color:var(--grey-4);letter-spacing:.07em;text-transform:uppercase;line-height:1}
.fi-val{font-weight:700;font-size:.86rem;color:var(--navy);line-height:1.2}

/* TICKER */
.ticker-bar{background:var(--navy);overflow:hidden;border-top:2px solid var(--red)}
.ticker-track{display:flex;animation:tkMove 30s linear infinite;white-space:nowrap}
@keyframes tkMove{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.tk-item{display:inline-flex;align-items:center;gap:.6rem;padding:.86rem 2.5rem;border-right:1px solid rgba(255,255,255,.06);font-weight:700;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.38);flex-shrink:0}
.tk-item b{color:rgba(255,255,255,.82)}
.tk-item i{color:var(--gold);font-size:.75rem}

/* HOW IT WORKS */
.how-sec{background:var(--white);padding:1rem 0 7rem;overflow:hidden}
.how-inner{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.how-tabs-wrap{margin-top:2rem}
.how-tabs{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}
.how-tab{font-weight:700;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:.42rem 1rem;border-radius:100px;border:1.5px solid var(--grey-2);color:var(--grey-4);background:transparent;cursor:pointer;transition:all .2s}
.how-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.how-panel{display:none}
.how-panel.active{display:block}
.how-panel h4{font-family:var(--font-display);font-size:1.25rem;color:var(--navy);margin-bottom:.5rem}
.how-panel p{font-size:.9rem;color:var(--grey-5);line-height:1.7}
.how-visual{position:relative;
  /*background:linear-gradient(145deg,#e4eef9,#c4ddf5);*/
height:480px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  /*box-shadow:0 24px 60px rgba(10,31,53,.12);*/
}
.how-visual::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,rgba(30,86,200,.1) 0%,transparent 60%)}
.step-chip{position:absolute;z-index:3;background:rgba(255,255,255,.95);border:1px solid rgba(255,255,255,.8);border-radius:12px;padding:.55rem .9rem;display:flex;align-items:center;gap:.55rem;box-shadow:0 6px 24px rgba(10,31,53,.1)}
.sc-num{width:28px;height:28px;border-radius:8px;background:var(--accent);color:#fff;font-weight:700;font-size:.82rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sc-txt{font-size:.75rem;font-weight:600;color:var(--navy)}
.hf-list{margin-top:2rem;display:flex;flex-direction:column;gap:.8rem}
.hf-item{display:flex;align-items:flex-start;gap:.9rem;padding:1rem;background:var(--grey-1);border-radius:12px;border:1px solid var(--grey-2);transition:all .2s}
.hf-item:hover{border-color:rgba(30,86,200,.2);background:var(--sky)}
.hf-ico{width:38px;height:38px;border-radius:10px;background: #f0f0f0 !important; color: var(--accent) !important;display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0}
.hf-txt strong{font-weight:700;font-size:.9rem;color:var(--navy);display:block;margin-bottom:.2rem}
.hf-txt span{font-size:.8rem;color:var(--grey-5);line-height:1.55}

/* SMART HOME */
.smart-sec{background:var(--grey-1);padding:6rem 0}
.smart-hdr{text-align:center;margin-bottom:3rem}
.smart-hdr h2{font-family:var(--font-display);font-size:clamp(2.4rem,4vw,4rem);color:var(--navy);line-height:1.05}
.smart-hdr h2 em{font-style:italic;color:var(--accent-2)}
.smart-hdr p{font-size:1rem;color:var(--grey-5);max-width:500px;margin:.8rem auto 0;line-height:1.65}
.app-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.9rem;max-width:700px;margin:0 auto 2.5rem}
.app-card{background:#fff;border:1.5px solid var(--grey-2);border-radius:16px;padding:1.4rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;cursor:pointer;transition:all .22s}
.app-card:hover,.app-card.active{border-color:var(--accent-2);box-shadow:0 8px 28px rgba(46,196,182,.12);transform:translateY(-4px)}
.app-card.active{background:linear-gradient(145deg,#f0fdfb,#e6faf8)}
.app-card i{font-size:1.6rem;color:var(--grey-4);transition:color .2s}
.app-card:hover i,.app-card.active i{color:var(--accent-2)}
.app-label{font-size:.65rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-5);text-align:center;line-height:1.3}
.app-info{background:#fff;border:1px solid var(--grey-2);border-radius:16px;padding:1.4rem 1.8rem;max-width:700px;margin:0 auto;display:flex;align-items:center;gap:1.2rem;box-shadow:0 4px 20px rgba(10,31,53,.05)}
.app-info-ico{width:48px;height:48px;border-radius:12px;  background: linear-gradient(135deg,#f2f2f2,#e6e6e6) !important;
display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:var(--accent-2);flex-shrink:0}
.app-info strong{font-weight:700;font-size:1rem;color:var(--navy);display:block;margin-bottom:.3rem}
.app-info p{font-size:.85rem;color:var(--grey-5);line-height:1.55}

/* FEATURED */
.featured-sec{background:#efefef !important;padding:5.5rem 0;overflow:hidden}
.fb-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center}
.fb-label{font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--grey-5);margin-bottom:.4rem}
.fb-h1{font-family:var(--font-display);font-size:clamp(2.4rem,1vw,4.2rem);line-height:1;color:var(--navy);margin-bottom:.6rem;letter-spacing:-.01em}
.clor-elc{color: #393186;}
.fb-tagline{font-size:1rem;font-weight:500;color:var(--grey-5);margin-bottom:1.6rem;line-height:1.55}
.fb-offers{display:flex;flex-direction:column;gap:.38rem;margin-bottom:1.8rem}
.fb-offer{font-size:.89rem;color:var(--grey-6);display:flex;align-items:center;gap:.5rem}
.fb-offer i{color:var(--accent);width:14px}
.fb-actions{display:flex;gap:.8rem}
.fb-visual{display:flex;align-items:center;justify-content:center;min-height:420px;position:relative}
.fb-lock-stage{position:relative;display:flex;gap:2.5rem;align-items:center}
@keyframes gentleFlt{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* KEYLESS */
.keyless-sec{background:#d8d7d8;padding:7rem 0;position:relative;overflow:hidden}
.keyless-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 20% 50%,rgba(30,86,200,.12) 0%,transparent 55%)}
.keyless-inner{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.keyless-badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(46,196,182,.1);border:1px solid rgba(46,196,182,.2);border-radius:100px;padding:.28rem .8rem;font-weight:700;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);margin-bottom:1rem}
.keyless-h2{font-family:var(--font-display);
  font-size:clamp(2.5rem,4.5vw,4.2rem);line-height:1.03;
  color:#0d1b2a;letter-spacing:-.01em;margin-bottom:1rem}
.keyless-h2 em{font-style:italic;color:var(--accent-2)}
.keyless-desc{font-size:.97rem;color:rgb(0 0 0 / 50%);line-height:1.72;margin-bottom:2rem;max-width:460px}
.keyless-access{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin-bottom:2.2rem}
.ka-item{background:#2F343A;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem 1.1rem;transition:all .2s}
.ka-item:hover{border-color:rgba(46,196,182,.25);background:#4F6D8A;}
.ka-item i{font-size:1.2rem;color:#fff;margin-bottom:.5rem;display:block}
.ka-item strong{font-weight:700;font-size:.88rem;color:#fff;display:block;margin-bottom:.2rem}
.ka-item span{font-size:.78rem;color:rgba(255,255,255,.4);line-height:1.45}
.keyless-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:480px}
.kv-card{background:linear-gradient(145deg,#152030,#0a1624);border:1px solid rgba(255,255,255,.08);border-radius:28px;padding:2.5rem 2rem;width:320px;position:relative;overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.4)}
.kv-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,rgba(30,86,200,.15) 0%,transparent 55%)}
.kv-lock-display{text-align:center;position:relative;z-index:2;margin-bottom:1.5rem}
.kv-status{display:inline-flex;align-items:center;gap:.4rem;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.2);border-radius:100px;padding:.28rem .8rem;font-size:.65rem;font-weight:700;color:#22c55e;margin-bottom:1rem;letter-spacing:.08em}
.kv-status-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;animation:pdot 2s ease-in-out infinite}
@keyframes pdot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}
.kv-time{font-family:var(--font-accent);font-size:2.8rem;color:#fff;letter-spacing:.05em;display:block;margin-bottom:.3rem}
.kv-date{font-size:.8rem;color:rgba(255,255,255,.4);letter-spacing:.08em}
.kv-methods{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;position:relative;z-index:2;margin-bottom:1.2rem}
.kv-method{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:.7rem .5rem;text-align:center;cursor:pointer;transition:all .2s}
.kv-method:hover,.kv-method.act{background:rgba(30,86,200,.15);border-color:rgba(30,86,200,.3)}
.kv-method i{font-size:1rem;color:rgba(255,255,255,.45);display:block;margin-bottom:.3rem;transition:color .2s}
.kv-method:hover i,.kv-method.act i{color:var(--accent)}
.kv-method span{font-size:.5rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.3);display:block;line-height:1.3}
.kv-btn{width:100%;background:linear-gradient(90deg,var(--accent),#2563eb);color:#fff;border:none;border-radius:10px;padding:.85rem;font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:all .2s;position:relative;z-index:2}
.kv-btn:hover{opacity:.9;transform:translateY(-1px)}

/* DESIGN SEC */
.design-sec{background:#ffffff;padding:7rem 0;overflow:hidden}
.design-hdr{text-align:center;margin-bottom:4rem}
.design-hdr-kicker{font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--grey-4);margin-bottom:.7rem}
.design-hdr h2{font-family:var(--font-display);font-size:clamp(2.8rem,5vw,5rem);color:var(--navy);line-height:1;letter-spacing:-.02em}
.design-hdr h2 em{font-style:italic;color:var(--accent)}
.design-hdr p{font-size:1.05rem;color:var(--grey-5);max-width:580px;margin:.9rem auto 0;line-height:1.65}
.device-strip-wrap {
    position: relative;
    /* overflow: hidden; */
    height: 447px;
    margin: 0 -2rem;
    background:#efefef !important;

}
.device-strip-par{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;will-change:transform}
.ds-lock-l,.ds-lock-r{position:absolute;top:50%;transition:transform 1.4s cubic-bezier(.16,1,.3,1)}
.ds-lock-l{left:50%;transform:translateX(-130%) translateY(-50%)}
.ds-lock-r{left:50%;transform:translateX(20%) translateY(-50%)}
.device-strip-wrap.in-view .ds-lock-l{transform:translateX(-68%) translateY(-50%)}
.device-strip-wrap.in-view .ds-lock-r{transform:translateX(12%) translateY(-50%)}
.ds-lbl{position:absolute;top:auto; bottom: 26%; font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--grey-5);opacity:0;transition:opacity .6s .9s}
.device-strip-wrap.in-view .ds-lbl{opacity:1}
.ds-lbl-l{left:calc(50% - 360px);transform:translateY(70px);text-align:left}
.ds-lbl-r{right:calc(50% - 360px);transform:translateY(70px);text-align:right}
.ds-lbl-name{font-family:var(--font-display);font-size:1.4rem;color:var(--navy);display:block;margin-bottom:.2rem}
.strip-glow{position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(30,86,200,.07) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.design-features{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--grey-2);margin-top:0}
.df-cell{padding:2.5rem 2rem;border-right:1px solid var(--grey-2);transition:background .2s}
.df-cell:last-child{border-right:none}
.df-cell:hover{background:rgba(30,86,200,.03)}
.df-ico{width:46px;height:46px;  background: #f0f0f0 !important;
  border-color: rgba(100,100,100,.12) !important;
  color: var(--accent) !important;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--accent);margin-bottom:1rem;border:1px solid rgba(30,86,200,.12)}
.df-name{font-family:var(--font-display);font-size:1rem;color:var(--navy);margin-bottom:.4rem}
.df-desc{font-size:.83rem;color:var(--grey-5);line-height:1.55}

/* PARALLAX BANNER */
.par-banner{position:relative;height:400px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.par-bg{position:absolute;inset:-100px;background:linear-gradient(145deg,var(--sky-dark) 0%,var(--sky-mid) 50%,#1a4070 100%);will-change:transform}
.par-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:40px 40px}
.par-glow{position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(30,86,200,.18) 0%,transparent 65%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.par-content{position:relative;z-index:2;text-align:center;padding:0 2rem}
.pb-kicker{font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:.8rem}
.pb-h2{font-family:var(--font-display);font-size:clamp(2.4rem,5vw,4.5rem);color:#fff;line-height:1;margin-bottom:.9rem;letter-spacing:-.01em}
.pb-h2 em{font-style:italic;color:var(--gold)}
.pb-stats{display:flex;gap:3rem;justify-content:center;flex-wrap:wrap;margin-top:2rem}
.pb-stat{text-align:center}
.pb-stat-num{font-family:var(--font-accent);font-size:2.8rem;color:#fff;letter-spacing:.05em;display:block;line-height:1}
.pb-stat-lbl{font-size:.68rem;color:rgba(255,255,255,.45);letter-spacing:.12em;text-transform:uppercase;margin-top:.3rem}

/* PRODUCTS */
.products-sec{background:var(--white);padding:6rem 0}
.prod-hdr{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:1rem;margin-bottom:2.5rem}
.ptabs{display:flex;gap:.4rem;flex-wrap:wrap}
.ptab{font-weight:700;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;padding:.38rem .9rem;border-radius:100px;border:1.5px solid var(--grey-2);color:var(--grey-5);background:transparent;cursor:pointer;transition:all .2s}
.ptab.active,.ptab:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.pc{background:var(--grey-1);border:1px solid var(--grey-2);border-radius:18px;overflow:hidden;cursor:pointer;position:relative;transition:all .25s}
.pc:hover{transform:translateY(-6px);border-color:var(--grey-3);box-shadow:0 20px 50px rgba(13,27,42,.08)}
.pc.span2{grid-column:span 2}
.pc-badge{position:absolute;top:.8rem;left:.8rem;z-index:2;font-weight:700;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;padding:.2rem .55rem;border-radius:4px}
.pc-badge.top{background:var(--red);color:#fff}
.pc-badge.wifi{background:var(--accent-light);color:var(--accent);border:1px solid rgba(30,86,200,.15)}
.pc-badge.bt{background:rgba(168,85,247,.08);color:#9333ea;border:1px solid rgba(168,85,247,.15)}
.pc-vis{height:200px;  background: #efefef !important;
display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.pc.span2 .pc-vis{height:260px}
.pc-info{padding:1.2rem 1.3rem 1.4rem}
.pc-model{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--grey-4);margin-bottom:.25rem}
.pc-name{font-family:var(--font-display);font-size:1.1rem;color:var(--navy);line-height:1.2;margin-bottom:.55rem}
.pc-tags{display:flex;flex-wrap:wrap;gap:.25rem;margin-bottom:.8rem}
.pc-tag{font-size:.58rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:.15rem .45rem;border-radius:4px;background:rgba(30,86,200,.07);color:var(--accent);border:1px solid rgba(30,86,200,.1)}
.pc-cta{font-weight:700;font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;background:var(--navy);color:#fff;border:none;padding:.45rem .9rem;border-radius:6px;cursor:pointer;transition:all .2s;margin-top:.3rem}
.pc-cta:hover{background:var(--sky-dark)}
.mini-lk{position:relative;z-index:1}
.mlk-body{width:55px;height:140px;background:linear-gradient(155deg,#282e3d,#0d1b2a);border-radius:10px;margin:auto;border:1px solid rgba(255,255,255,.1);box-shadow:0 12px 40px rgba(13,27,42,.2);position:relative;overflow:hidden}
.mlk-body.light{background:linear-gradient(155deg,#cad9ec,#a4c0d8);border-color:rgba(255,255,255,.5)}
.mlk-led{width:32px;height:4px;border-radius:2px;background:#22c55e;margin:8px auto 0;box-shadow:0 0 8px rgba(34,197,94,.4);animation:ledB 3s infinite}
.mlk-screen{width:36px;height:32px;background:rgba(0,0,0,.35);border-radius:4px;margin:6px auto;border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center}
.mlk-screen.light{background:rgba(255,255,255,.4);border-color:rgba(255,255,255,.5)}
.mlk-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;width:34px;margin:3px auto}
.mlk-key{height:10px;border-radius:2px;background:rgba(255,255,255,.08)}
.mlk-key.light{background:rgba(13,27,42,.1)}
.mlk-fp{width:20px;height:20px;border-radius:50%;border:1.5px solid rgba(255,255,255,.2);margin:5px auto;display:flex;align-items:center;justify-content:center}
.mlk-fp.light{border-color:rgba(30,86,200,.35)}
.mlk-fp i{font-size:.52rem;color:rgba(255,255,255,.5)}
.mlk-fp.light i{color:var(--accent)}
.mlk-handle{position:absolute;right:-16px;top:50%;transform:translateY(-50%);width:18px;height:55px;border-radius:0 7px 7px 0;background:linear-gradient(180deg,#3a4050,#1e2333);border:1px solid rgba(255,255,255,.1);border-left:none}
.mlk-handle.light{background:linear-gradient(180deg,#a4c0d8,#7aa3bc)}
.mlk-txt{font-family:var(--font-accent);font-size:.55rem;letter-spacing:.14em;color:rgba(255,255,255,.22);text-transform:uppercase;position:absolute;bottom:8px;left:50%;transform:translateX(-50%);white-space:nowrap}
.mlk-txt.light{color:rgba(13,27,42,.22)}

/* SPOTLIGHT */
.spotlight{overflow:hidden}
.sp-inner{max-width:1240px;margin:auto;padding:6rem 2rem;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.sp-inner.rev{direction:rtl}
.sp-inner.rev>*{direction:ltr}
.sp-card{background:linear-gradient(145deg,#dce9f5,#c4d9ee);border-radius:28px;height:480px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 20px 60px rgba(10,31,53,.1)}
.sp-card.dark{background:linear-gradient(145deg,#1c2e44,#0a1e34)}
.sp-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,rgba(30,86,200,.08) 0%,transparent 60%)}
.sp-card.dark::before{background:radial-gradient(circle at 50% 35%,rgba(30,86,200,.15) 0%,transparent 60%)}
.sp-lock-art{position:relative;z-index:2}
.big-lock{width:95px;height:250px;background:linear-gradient(155deg,#282e3d,#0d1b2a);border-radius:14px;border:1px solid rgba(255,255,255,.12);box-shadow:0 30px 70px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.06);position:relative;overflow:hidden}
.big-lock.lt{background:linear-gradient(155deg,#cad9ec,#a4c0d8);border-color:rgba(255,255,255,.6);box-shadow:0 20px 50px rgba(10,31,53,.15)}
.bl-led{width:46px;height:5px;border-radius:2.5px;background:linear-gradient(90deg,#16a34a,#22c55e);margin:11px auto 0;box-shadow:0 0 10px rgba(34,197,94,.5);animation:ledB 3s infinite}
.bl-screen{width:68px;height:66px;background:rgba(0,0,0,.4);border-radius:8px;margin:7px auto;border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.bl-screen.lt{background:rgba(255,255,255,.5);border-color:rgba(255,255,255,.6)}
.bl-screen::after{content:'';position:absolute;width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(30,86,200,.25);animation:pulseR 2.5s ease-in-out infinite}
@keyframes pulseR{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.5);opacity:0}}
.bl-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;width:66px;margin:5px auto}
.bl-key{height:14px;border-radius:3px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:.45rem;color:rgba(255,255,255,.3)}
.bl-key.lt{background:rgba(13,27,42,.1);color:rgba(13,27,42,.3)}
.bl-fp{width:30px;height:30px;border-radius:50%;border:1.5px solid rgba(255,255,255,.2);margin:7px auto;display:flex;align-items:center;justify-content:center}
.bl-fp.lt{border-color:rgba(30,86,200,.3)}
.bl-fp i{font-size:.8rem;color:rgba(255,255,255,.5)}
.bl-fp.lt i{color:var(--accent);opacity:.8}
.bl-handle{position:absolute;right:-28px;top:50%;transform:translateY(-50%);width:30px;height:75px;border-radius:0 10px 10px 0;background:linear-gradient(180deg,#3a4050,#1e2333);border:1px solid rgba(255,255,255,.1);border-left:none}
.bl-handle.lt{background:linear-gradient(180deg,#a4c0d8,#7aa3bc)}
.bl-txt{font-family:var(--font-accent);font-size:.65rem;letter-spacing:.18em;color:rgba(255,255,255,.22);text-transform:uppercase;position:absolute;bottom:10px;left:50%;transform:translateX(-50%);white-space:nowrap}
.bl-txt.lt{color:rgba(13,27,42,.22)}
.sp-chip{position:absolute;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.7);border-radius:10px;padding:.5rem .85rem;display:flex;align-items:center;gap:.5rem;z-index:3;box-shadow:0 4px 20px rgba(10,31,53,.1)}
.sp-chip.dchip{background:rgba(14,28,50,.92);border-color:rgba(255,255,255,.1)}
.sc-i{color:var(--accent);font-size:.8rem}
.dchip .sc-i{color:var(--gold)}
.sc-l{font-size:.58rem;color:var(--grey-4);letter-spacing:.06em;text-transform:uppercase}
.dchip .sc-l{color:rgba(255,255,255,.4)}
.sc-v{font-weight:700;font-size:.88rem;color:var(--navy);line-height:1.2}
.dchip .sc-v{color:#fff}
.sp-specs{list-style:none;display:flex;flex-direction:column;gap:.8rem;margin:1.8rem 0 2rem}
.sp-specs li{display:flex;align-items:flex-start;gap:.8rem;font-size:.92rem;color:var(--grey-5)}
.ss-ico{width:32px;height:32px;background:var(--accent-light);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--accent);flex-shrink:0;font-size:.78rem}
.ss-t{font-weight:700;color:var(--navy);display:block}
.ss-s{font-size:.82rem;color:var(--grey-4)}

/* LINEUP */
.lineup-sec{ background: #ffffff !important;padding:6rem 0;overflow:hidden}
.lineup-scroll{display:flex;gap:1.4rem;overflow-x:auto;padding:1rem 2rem 2rem;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--grey-3) transparent;max-width:1240px;margin:auto}
.lineup-scroll::-webkit-scrollbar{height:4px}
.lineup-scroll::-webkit-scrollbar-thumb{background:var(--grey-3);border-radius:4px}
.lc-card{flex-shrink:0;width:240px;scroll-snap-align:start;background:#fff;border-radius:16px;overflow:hidden;border:1px solid var(--grey-2);transition:all .25s;cursor:pointer}
.lc-card:hover{box-shadow:0 12px 40px rgba(10,31,53,.1);transform:translateY(-4px)}
.lc-vis{height:190px;background:linear-gradient(135deg,#efefef,#e2e2e2) !important;display:flex;align-items:center;justify-content:center;position:relative}
.lc-vtag{position:absolute;top:.6rem;right:.6rem;font-weight:700;font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;padding:.18rem .45rem;border-radius:4px;background:var(--red);color:#fff}
.lc-body{padding:1rem 1.1rem 1.2rem}
.lc-mod{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--grey-4);margin-bottom:.2rem}
.lc-nm{font-family:var(--font-display);font-size:1rem;color:var(--navy);margin-bottom:.45rem;line-height:1.2}
.lc-feats{display:flex;flex-wrap:wrap;gap:.2rem;margin-bottom:.7rem}
.lc-ft{font-size:.58rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.12rem .4rem;border-radius:3px;background:var(--accent-light);color:var(--accent)}
.lc-btn{font-weight:700;font-size:.67rem;letter-spacing:.09em;text-transform:uppercase;background:var(--navy);color:#fff;border:none;padding:.38rem .8rem;border-radius:5px;cursor:pointer;transition:background .2s;margin-top:.3rem}
.lc-btn:hover{background:var(--sky-dark)}

/* TECH */
.tech-sec{background:#efefef;padding:7rem 0}
.tech-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:3rem}
.tech-card{background:#2F343A;border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:1.8rem 1.4rem;position:relative;overflow:hidden;transition:all .25s}
.tech-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--accent),transparent);opacity:0;transition:opacity .25s}
.tech-card:hover{transform:translateY(-4px);
  border-color:#4F6D8A;background:#4F6D8A;}
.tech-card:hover::before{opacity:1}
.tc-ico{width:48px;height:48px;background:rgb(192 199 215 / 15%);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:rgb(237 243 255 / 90%);margin-bottom:1rem;border:1px solid rgba(30,86,200,.2)}
.tc-name{font-family:var(--font-display);font-size:1rem;color:#fff;margin-bottom:.4rem}
.tc-desc{font-size:.82rem;color:rgba(255,255,255,.42);line-height:1.6}

/* COMPARE */
.compare-sec{background:var(--grey-1);padding:7rem 0}
.ct-wrap{overflow-x:auto;margin-top:3rem;border-radius:16px;border:1px solid var(--grey-2);overflow:hidden;background:#fff}
.ct-table{width:100%;min-width:700px;border-collapse:collapse}
.ct-table thead tr{background:var(--grey-1)}
.ct-table thead th{padding:1rem 1.2rem;text-align:center;font-weight:700;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--grey-5);border-bottom:1px solid var(--grey-2)}
.ct-table thead th:first-child{text-align:left}
.ct-table thead th.hl{color:var(--accent);background:rgba(30,86,200,.03)}
.ct-table tbody tr{border-bottom:1px solid rgba(0,0,0,.04);transition:background .15s}
.ct-table tbody tr:last-child{border-bottom:none}
.ct-table tbody tr:hover{background:rgba(30,86,200,.02)}
.ct-table td{padding:.85rem 1.2rem;text-align:center;font-size:.87rem;color:var(--grey-5)}
.ct-table td:first-child{text-align:left;color:var(--grey-6);font-weight:500}
.ct-table td.hl{background:rgba(30,86,200,.02)}
.ct-table .fa-check{color:#16a34a;font-size:.88rem}
.ct-table .fa-xmark{color:var(--grey-3);font-size:.88rem}

/* FURNITURE */
.furn-sec{background:var(--navy);padding:6rem 0}
.furn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:3rem}
.furn-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;overflow:hidden;transition:all .25s;cursor:pointer}
.furn-card:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.07)}
.furn-vis{height:180px;
background: linear-gradient(135deg,rgba(100,100,100,.07),rgba(50,50,50,.1)) !important;display:flex;align-items:center;justify-content:center}
.furn-ring{    width: 59%;
    /* height: 72px; */
    /* border-radius: 50%; */
    /* background: rgba(255, 255, 255, .06); */
    /* border: 2px solid rgba(255, 255, 255, .12); */
    display: flex;
    align-items: center;
    justify-content: center;}


.furn-ring i{font-size:1.6rem;color:rgba(255,255,255,.5)}
.furn-info{padding:1.2rem 1.3rem 1.4rem}
.furn-mod{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:.3rem}
.furn-nm{font-family:var(--font-display);font-size:1.1rem;color:#fff;margin-bottom:.4rem}
.furn-desc{font-size:.82rem;color:rgba(255,255,255,.42);line-height:1.5;margin-bottom:.9rem}
.furn-btn{font-weight:700;font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;background:rgba(30,86,200,.15);color:rgba(255,255,255,.8);border:1px solid rgba(30,86,200,.2);padding:.38rem .8rem;border-radius:5px;cursor:pointer;transition:all .2s}
.furn-btn:hover{background:rgba(30,86,200,.3)}

/* ABOUT */
.about-sec{background:#efefef;padding:7rem 0}
.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.about-card{background:#fff;border-radius:24px;padding:3rem;border:1px solid var(--grey-2);box-shadow:0 20px 60px rgba(10,31,53,.07);position:relative;overflow:hidden}
.about-yr-bg{position:absolute;top:.5rem;right:1.5rem;font-family:var(--font-accent);font-size:8rem;color:rgba(13,27,42,.03);line-height:1;pointer-events:none;letter-spacing:.05em}
.about-nm{font-family:var(--font-display);font-size:1.6rem;color:var(--navy);margin-bottom:.2rem}
.about-ttl{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--grey-4);margin-bottom:1.4rem}
.about-q{font-family:var(--font-display);font-style:italic;font-size:1.08rem;color:var(--grey-5);line-height:1.6;border-left:3px solid var(--accent);padding-left:1.1rem}
.about-stats{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:2rem}
.ast{background:var(--grey-1);border:1px solid var(--grey-2);border-radius:10px;padding:.9rem 1.1rem}
.ast-num{font-family:var(--font-accent);font-size:2rem;color:var(--navy);letter-spacing:.05em}
.ast-lbl{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--grey-4)}
.about-txt p{font-size:.95rem;color:var(--grey-5);line-height:1.72;margin-bottom:1rem}
.about-list{list-style:none;margin:1.5rem 0 2rem;display:flex;flex-direction:column;gap:.5rem}
.about-list li{display:flex;align-items:center;gap:.6rem;font-size:.88rem;color:var(--grey-5)}
.about-list li i{color:var(--accent);font-size:.75rem;width:14px}

/* BLOG */
.blog-sec{background:var(--white);padding:6rem 0}
.blog-hdr{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:1rem;margin-bottom:2.5rem}
.blog-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1.4rem}
.blog-grid a{text-decoration: none; color: unset;}
.bc{background:var(--grey-1);border:1px solid var(--grey-2);border-radius:16px;overflow:hidden;cursor:pointer;transition:all .25s}
.bc:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(10,31,53,.08);border-color:var(--grey-3)}
.bc.big .bc-vis{height:280px}
.bc-vis{height:160px;   background:#efefef !important;
display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.bc-vis i{font-size:2.8rem;color:rgba(30,86,200,.15)}
.bc-cat{position:absolute;bottom:.6rem;left:.6rem;font-weight:700;font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;padding:.2rem .5rem;border-radius:4px;background:var(--red);color:#fff}
.bc-body{padding:1.1rem 1.3rem 1.4rem}

.bc-dt{font-size:.68rem;color:var(--grey-4);margin-bottom:.4rem;letter-spacing:.04em}
.bc-ttl{font-family:var(--font-display);font-size:1rem;color:var(--navy);line-height:1.3;margin-bottom:.4rem}
.bc.big .bc-ttl{font-size:1.35rem}
.bc-ex{font-size:.89rem;color:var(--grey-5);line-height:1.55}

/* CTA */
.cta-sec{background:linear-gradient(135deg,var(--sky-dark) 0%,var(--sky-mid) 50%,#1a4070 100%);padding:8rem 0;position:relative;overflow:hidden}
.cta-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 20% 50%,rgba(30,86,200,.15) 0%,transparent 60%)}
.cta-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px}
.cta-inner{max-width:760px;margin:auto;padding:0 2rem;text-align:center;position:relative;z-index:2}
.cta-kicker{font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:.7rem;display:flex;align-items:center;justify-content:center;gap:.5rem}
.cta-h2{font-family:var(--font-display);font-size:clamp(2.8rem,5vw,5rem);color:#fff;line-height:1;margin:.6rem 0 1.1rem;letter-spacing:-.01em}
.cta-h2 em{font-style:italic;color:var(--gold)}
.cta-sub{font-size:1rem;color:rgba(255,255,255,.55);line-height:1.65;margin-bottom:2.4rem}
.cta-form{display:flex;gap:.7rem;max-width:460px;margin:0 auto 1.1rem;flex-wrap:wrap}
.cta-inp{flex:1;min-width:170px;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.15);border-radius:8px;color:#fff;font-family:var(--font-body);font-size:.9rem;padding:.75rem 1rem;outline:none;transition:border-color .2s}
.cta-inp:focus{border-color:rgba(255,255,255,.4)}
.cta-inp::placeholder{color:rgba(255,255,255,.32)}
.cta-sub-btn{font-weight:700;font-size:.85rem;letter-spacing:.09em;text-transform:uppercase;background:#fff;color:var(--navy);border:none;padding:.75rem 1.5rem;border-radius:8px;cursor:pointer;transition:all .2s;white-space:nowrap}
.cta-sub-btn:hover{background:var(--sky);transform:translateY(-1px)}
.cta-note{font-size:.7rem;color:rgba(255,255,255,.38)}
.cta-note a{color:rgba(255,255,255,.6);text-decoration:none}

/* FOOTER */
footer{background:var(--ink);border-top:1px solid rgba(255,255,255,.05);padding:4rem 0 2rem}
.ft-grid{
  display:grid;
  grid-template-columns: 1.1fr 0.7fr 0.9fr 0.9fr 1.4fr;
  gap:1.5rem;
  align-items:start;
}

.ft-brand .logo-mark img{
  max-width:222px;
  height:auto;
}

.ft-brand p{
  font-size:.8rem;
  line-height:1.5;
}

.ft-col h4,
.ft-contact h4{
  font-size:.9rem;
  margin-bottom:.8rem;
}

.ft-col ul li,
.ft-contact-list li{
  font-size:.78rem;
}

.width-col{width: 209px !important;}

@media (max-width: 992px){
  .ft-grid{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px){
  .width-col{width: auto !important;}
    #mainLockImg{width: 69%;}
  .ft-grid{
    grid-template-columns: 1fr;
  }
  footer{text-align: center;}
.app-card i{display: block; text-align: center;}
.app-label{display: block;     margin: 10px auto 0px; text-align: center;}
}
.soc-row{display:flex;gap:.5rem}
.soc-a{width:34px;height:34px;border:1px solid rgba(255,255,255,.1);border-radius:7px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.32);text-decoration:none;transition:all .2s;font-size:.8rem}
.soc-a:hover{border-color:rgba(30,86,200,.6);color:rgba(30,86,200,.9)}
.ft-col h4{font-weight:700;font-size:.72rem;letter-spacing:.18em;
  text-transform:uppercase;color:rgb(255 255 255 / 72%);margin-bottom:1rem}
.ft-col ul{list-style:none;display:flex;flex-direction:column;gap:.45rem}
.ft-col ul li a{color:rgba(255,255,255,.66);text-decoration:none;
  font-size:.89rem;transition:color .2s}
.ft-col ul li a:hover{color:rgba(255,255,255,.72)}
.ft-bottom {
    border-top: 1px solid rgba(255, 255, 255, .06);
    padding-top: 1.6rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 31px;
}
.ft-bottom p{font-size:.79rem;color:rgba(255,255,255,.66);}
.iso-pill {
/*    background: rgba(201, 151, 58, .1);
    border: 1px solid rgb(126 126 126);*/
    border-radius: 4px;
    padding: .18rem 0rem;
    font-weight: 700;
    font-size: .7rem;
    color: #e3e3e3;
    letter-spacing: .06em;
}

/* SCROLL REVEAL */
.rv{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.rv.vis{opacity:1;transform:none}
.rv.fl{transform:translateX(-24px)}
.rv.fr{transform:translateX(24px)}
.rv.fl.vis,.rv.fr.vis{transform:none}

.text-centre{text-align: center; display: block;}
.text-center-b{    display: block !important;
    text-align: center !important;
    margin: 0 auto !important;}
.tab-main{display: block !important; margin-bottom: 15px;}

/* RESPONSIVE */
@media(max-width:1100px){
  .tech-grid,.prod-grid{grid-template-columns:repeat(2,1fr)}
  .pc.span2{grid-column:span 1}
  .design-features{grid-template-columns:repeat(2,1fr)}
  .furn-grid{grid-template-columns:1fr 1fr}
  .ft-grid{grid-template-columns:1fr 1fr;gap:2rem}
}
@media(max-width:860px){
  .hero-inner,.sp-inner,.about-inner,.fb-inner,.how-inner,.keyless-inner{grid-template-columns:1fr}
  .hero-visual,.fb-visual,.keyless-visual{display:block;}
  .sp-inner.rev{direction:ltr}
  .blog-grid{display: block;}
  .bc.big{grid-column:span 2}
}
@media(max-width:640px){
  /*.sa-right img{ text-align: center; margin: 0px auto; display: block;}*/
  .sa-h{ display: block;font-size: 2.1rem; margin-bottom: 13px;}
  .hero-device-stage{height: auto;}
  .app-grid{ display: block !important;}
  .img-build{width: 81%;}
  .p-mob{padding: 0px !important;
        width: 90% !important; text-align: center !important;
      margin: 0 auto !important;}
  .app-card{    width: 46%;display: inline-table;min-height: 91px; margin-bottom: 15px;}
  .active-tab{margin-bottom: 12px;}
  .ddl-lock{display: none !important;}
  .nav-menu{display:none;}
  .hamburger{display:flex}
  .tech-grid,.prod-grid,.furn-grid{grid-template-columns:1fr}
  .design-features{grid-template-columns:1fr}
  .df-cell{border-right:none;border-bottom:1px solid var(--grey-2)}
  .blog-grid,.app-grid{ display: block;}
  .bc.big{grid-column:span 1}
  .ft-grid{grid-template-columns:1fr; text-align: left;}
  .app-grid{grid-template-columns:repeat(3,1fr)}
  .keyless-access{grid-template-columns:1fr}
  .pb-stats{gap:1.5rem}
}



/* ══════════════════════════════════════════
   SECTION 2 — DIGITAL DOOR LOCKS BANNER
══════════════════════════════════════════ */
.ddl{position:relative;min-height:94vh;overflow:hidden;display:flex;
  background: url(../images/door-lock-tab.webp); background-repeat: no-repeat;
  align-items:center}

/* layered dark room bg */
.ddl-bg{position:absolute;inset:0;z-index:0}
.ddl-room{
 /* position:absolute;inset:0;
  background:linear-gradient(105deg,#100c05 0%,#1e1508 30%,#2c1e0c 55%,#1c1208 80%,#0d0a04 100%)*/
}
.room-glow{
/*  position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 80% at 22% 48%,rgba(200,150,60,.055) 0%,transparent 65%)*/
}

/* door geometry */
.ddl-door{position:absolute;right:0;top:0;bottom:0;width:320px;background:linear-gradient(178deg,#5a3a1a 0%,#48300f 30%,#3c2610 62%,#2c1c08 100%);border-left:3px solid rgba(120,85,42,.8);box-shadow:-28px 0 70px rgba(0,0,0,.7),inset 3px 0 14px rgba(255,255,255,.03)}
.door-grain{position:absolute;inset:0;background:repeating-linear-gradient(176deg,transparent 0,transparent 13px,rgba(255,255,255,.013) 13px,rgba(255,255,255,.013) 14px)}
.dp{position:absolute;border:1px solid rgba(0,0,0,.35);box-shadow:inset 0 2px 5px rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.04);border-radius:3px;left:22px;right:22px}
.dp1{top:52px;height:115px}
.dp2{top:188px;height:115px}
.dp3{top:326px;bottom:32px}
.door-edge{position:absolute;right:320px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,rgba(0,0,0,.0) 0%,rgba(0,0,0,.5) 50%,rgba(0,0,0,.0) 100%)}
.floor{position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(0deg,rgba(0,0,0,.75) 0%,transparent 100%)}

/* lock on door */
.ddl-lock{position:absolute;right:96px;top:50%;transform:translateY(-52%);z-index:8}
.ddl-lk-body{
border-radius:13px;
  border:1px solid rgba(255,255,255,.13);
  box-shadow:3px 0 28px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.06);
  position:relative;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;
  /*padding:11px 8px 9px;*/
}
.ddl-lk-body::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 20%,rgba(61,154,110,.07),transparent 55%);pointer-events:none}
.ddl-led{width:36px;height:3.5px;border-radius:2px;background:#22c55e;box-shadow:0 0 10px rgba(34,197,94,.6);animation:ledB 3s ease-in-out infinite;margin-bottom:9px}
.ddl-screen{width:52px;height:46px;background:#000;border-radius:7px;border:1px solid rgba(255,255,255,.07);margin-bottom:7px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.ddl-screen::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 100%,rgba(61,154,110,.07),transparent);pointer-events:none}
.ddl-face{width:28px;height:28px;border-radius:50%;border:1.5px solid rgba(61,154,110,.32);display:flex;align-items:center;justify-content:center}
.ddl-face::before{content:'';width:10px;height:10px;border-radius:50%;background:rgba(61,154,110,.15);border:1px solid rgba(61,154,110,.28)}
.ddl-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;width:52px;margin-bottom:7px}
.ddl-key{height:11px;border-radius:3px;background:rgba(255,255,255,.07)}
.ddl-key.on{background:rgba(61,154,110,.14)}
.ddl-fp{width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center}
.ddl-fp svg{width:12px;height:12px;stroke:rgba(255,255,255,.48);fill:none;stroke-width:1.5;stroke-linecap:round}
.ddl-lv{position:absolute;left:-40px;top:50%;transform:translateY(-50%);width:42px;height:15px;background:linear-gradient(90deg,#1a1a1a,#282828);border-radius:8px 0 0 8px;border:1px solid rgba(255,255,255,.1);border-right:none;box-shadow:-3px 0 10px rgba(0,0,0,.6)}
.ddl-lv-knob{position:absolute;right:100%;top:50%;transform:translateY(-50%);width:7px;height:7px;border-radius:50%;background:#1c1c1c;border:1px solid rgba(255,255,255,.14)}
.ddl-brand{font-family:'Bebas Neue',sans-serif;font-size:7px;letter-spacing:.2em;color:rgba(255,255,255,.18);position:absolute;bottom:8px}

/* text content */
.ddl-content{position:relative;z-index:5;padding:0 0 0 30px;max-width:560px}
.ddl-eyebrow{font-size:11px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:#121316;margin-bottom:14px;
  display:flex;align-items:center;gap:9px}
.ddl-eyebrow::before{content:'';width:22px;height:1.5px;
  background:#121316;border-radius:2px;flex-shrink:0}
.ddl-h2{font-family:'Playfair Display',serif;
  font-size:clamp(36px,5.2vw,42px);
  line-height:1.02;color:#212225;letter-spacing:-.02em;margin-bottom:14px}
.ddl-h2 em{font-style:italic;color:#e51e23;display:block}
.ddl-sub{font-size:14.5px;color:rgba(255,255,255,.42);line-height:1.7;max-width:400px;margin-bottom:28px}
.ddl-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.ddl-btn-g{font-family:'DM Sans',sans-serif;font-weight:600;font-size:12.5px;letter-spacing:.09em;text-transform:uppercase;background:#e51e23;color:#fff;border:none;padding:13px 30px;border-radius:8px;cursor:pointer;transition:all .2s}
.ddl-btn-g:hover{background:#222;transform:translateY(-2px)}
.ddl-btn-o{font-family:'DM Sans',sans-serif;font-weight:600;font-size:12.5px;letter-spacing:.09em;text-transform:uppercase;background:transparent;color:rgba(255,255,255,.55);border:1.5px solid rgba(255,255,255,.2);padding:13px 30px;border-radius:8px;cursor:pointer;transition:all .2s}
.ddl-btn-o:hover{border-color:rgba(255,255,255,.5);color:#fff}
.ddl-trust{display:flex;gap:20px;flex-wrap:wrap}
.ddl-ti{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:500;color:rgba(255,255,255,.36)}
.ddl-ti svg{width:13px;height:13px;stroke:rgba(255,255,255,.36);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

/* ══════════════════════════════════════════
   RESPONSIVE BREAKPOINTS
══════════════════════════════════════════ */
@media(max-width:1024px){
  .hiw-container{gap:48px;padding:0 32px}
  .orbit-wrap{width:320px;height:320px}
  .ch1{left:-10px}
  .ch2{left:-6px}
  .ch3{right:-6px}
  .ch4{right:-4px}
  .ddl{height:440px;background-position: center;}
 .ddl-door{width:280px}
  .dp1{top:44px;height:100px}
  .dp2{top:162px;height:100px}
  .dp3{top:280px;bottom:26px}
  .ddl-lock{right:72px}
  .ddl-content{padding-left:44px}
}

.img-fluid{max-width: 100%;
height: auto;
}

.img-door-locks{    width: 32%;
    margin: 0 auto;
    text-align: center;
    display: block;}

.img-door-locks2{    width: 91.3%;
    margin: 0 auto;
    text-align: center;
    display: block;}
    .img-door-locks3{    width: 73.3%;
    margin: 0 auto;
    text-align: center;
    display: block;}


.img-build{    width: 63%;
    border-radius: 33px;
}

.all-range{    width: 40%;
    margin: 0 auto;
    text-align: center;
    display: block;
}

/* PRODUCT CATEGORY TABS */
.prod-tab-btn {
  transition: background .2s, color .2s, border-color .2s;
}
.prod-tab-btn:hover {
  color: var(--navy);
  background: var(--white);
}
.active-tab{    background: #efefef !important;
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);}

#panel-nvento,
#panel-furnito {
  animation: tabFadeIn .25s ease;
}
@keyframes tabFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.clr-furnit{color: #121316 !important;}

    /* ─────funiture-lock HERO ───── */
    .funiture-lock-tabsec {
      /*background: #0f0c07;*/
        background: url(../images/furniture-lock-tab.webp);
      position: relative;
      min-height:94vh;
      background-repeat: no-repeat;
      display: flex;
      align-items: center;
      overflow: hidden;
    }

    /* background atmosphere */
    .funiture-lock-bg {
      position: absolute; inset: 0; z-index: 0;
      background:
        radial-gradient(ellipse 55% 70% at 72% 50%, rgba(160,110,20,0.18) 0%, transparent 65%),
        radial-gradient(ellipse 30% 50% at 5%  90%, rgba(200,164,74,0.06) 0%, transparent 55%),
        linear-gradient(160deg, #0f0c07 0%, #1a1408 50%, #0f0c07 100%);
    }
    /* wood-grain noise */
    .funiture-lock-bg::after {
      content: '';
      position: absolute; inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
      opacity: 1;
    }

    .funiture-lock-inner {
      position: relative; z-index: 1;
      width: 100%; max-width: 1380px;
      margin: 0 auto;
      padding: 30px 52px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      gap: 40px;
    }

    /* ── LEFT ── */
    .funiture-lock-left { max-width: 560px; }

    .eyebrow {
      display: flex; align-items: center; gap: 10px;
      font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase;
      color:#e3e1db; font-weight: 500; margin-bottom: 26px;
      animation: fadeUp .65s ease both;
    }
    .funiture-lock-line { width: 30px; height: 1px; background: #121316; flex-shrink: 0; }

    .funiture-lock-heading {
      font-family: 'Playfair Display', serif;
    line-height: 1.05;
       margin-bottom: 22px;
      animation: fadeUp .65s .1s ease both;
    }
    .funiture-lock-heading .italic {
      font-style: italic;
       color:  #e51e23; display: block;
      font-size: clamp(42px, 5vw, 42px);
    }
    .funiture-lock-heading .solid {
      display: block; font-size: clamp(42px, 5vw, 42px); 
      color: #212225; font-style: normal;
    }

    .funiture-lock-desc {
      font-size: 14.5px; line-height: 1.75; color: #9a8a6a;
      max-width: 420px; margin-bottom:19px;
      animation: fadeUp .65s .18s ease both;
    }
    .funiture-lock-desc strong { color: #c8a44a; font-weight: 500; }
  .funiture-lock-desc span{color: #c8a84b;}
    .funiture-lock-btns {
      display: flex; gap: 14px; flex-wrap: wrap;
      animation: fadeUp .65s .26s ease both;
    }
    .funiture-lock-fill {
      background:#e51e23; color: #fff;
      border: none; padding: 13px 26px;
      font-family: 'DM Sans', sans-serif;
      font-size: 11px; font-weight: 700;
      letter-spacing: 0.13em; text-transform: uppercase;
      cursor: pointer; text-decoration: none;
      display: inline-block;
      transition: background .2s, transform .2s;
      clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px));
    }
    .funiture-lock-fill:hover { background: #222; transform: translateY(-2px); }
    .funiture-lock-outline {
      background: transparent; color: #ffffff;
      border: 1px solid rgba(244,237,224,0.25);
      padding: 13px 26px;
      font-family: 'DM Sans', sans-serif;
      font-size: 11px; font-weight: 600;
      letter-spacing: 0.13em; text-transform: uppercase;
      cursor: pointer; text-decoration: none;
      display: inline-block;
      transition: border-color .2s, color .2s, transform .2s;
    }
    .funiture-lock-outline:hover { border-color: #c8a44a; color:#c8a44a; transform: translateY(-2px); }

    .funiture-lock-badges {
      display: flex; gap: 22px; flex-wrap: wrap; margin-top: 38px;
      animation: fadeUp .65s .34s ease both;
    }
    .funiture-lock-item {
      display: flex; align-items: center; gap: 7px;
      font-size: 11.5px; color: #9a8a6a; font-weight: 500;
    }
    .funiture-lock-item svg { flex-shrink: 0; }

    /* ── RIGHT: VISUAL ── */
    .funiture-lock-right {
      position: relative;
      display: flex; align-items: center; justify-content: center;
      min-height: 520px;
      animation: fadeIn 1s .15s ease both;
    }

    /* vertical panel strips (cabinet door illusion) */
    .funiture-lock-panels {
      position: absolute;
      right: -52px; top: 0; bottom: 0;
      width: 52%;
      display: flex; gap: 8px;
    }
    .funiture-lock-panel {
      flex: 1; border-radius: 3px;
      background: linear-gradient(180deg, #2b1e0c 0%, #1a1208 60%, #120d05 100%);
      border: 1px solid rgba(200,164,74,0.07);
      position: relative; overflow: hidden;
    }
    .funiture-lock-panel::before {
      content: ''; position: absolute; inset: 0;
      background: repeating-linear-gradient(
        90deg,
        transparent 0px, transparent 18px,
        rgba(200,164,74,0.02) 18px, rgba(200,164,74,0.02) 19px
      );
    }
    .funiture-lock-panel::after {
      content: ''; position: absolute; inset: 0;
      background: linear-gradient(180deg, rgba(200,164,74,0.06) 0%, transparent 30%, transparent 70%, rgba(0,0,0,0.3) 100%);
    }
    .funiture-lock-panel:nth-child(2) { opacity: 0.6; }
    .panel:nth-child(3) { opacity: 0.3; }

    /* gold accent line on left edge of first panel */
    .funiture-lock-panel:first-child::before {
      border-left: 1px solid rgba(200,164,74,0.2);
    }

    /* ── SVG LOCK ILLUSTRATION ── */
    .funiture-lock-wrap {
      position: relative; z-index: 2;
      filter: drop-shadow(0 32px 64px rgba(0,0,0,0.7)) drop-shadow(0 0 32px rgba(200,164,74,0.06));
    }

    /* floating chips */
    .chip {
      position: absolute; z-index: 3;
      background: rgba(15,12,7,0.88);
      border: 1px solid  rgba(200,164,74,0.15);
      border-radius: 10px; padding: 9px 14px;
      backdrop-filter: blur(10px);
      white-space: nowrap;
    }
    .chip-label { font-size: 9.5px; color: #9a8a6a; margin-bottom: 3px; letter-spacing: 0.06em; }
    .chip-value { font-size: 13px; font-weight: 600; }
    .chip-value.green { color:  #4ade80; }
    .chip-value.gold  { color:#c8a44a; }
    .chip-value.white { color: #ffffff; }

    .chip-1 { top: 13%; left: -14px; animation: floatChip1 3.6s ease-in-out infinite; }
    .chip-2 { bottom: 20%; left: -22px; animation: floatChip2 4.2s .4s ease-in-out infinite; }
    .chip-3 { top: 32%; right: -16px; animation: floatChip3 3.9s .8s ease-in-out infinite; }

    /* ── ANIMATIONS ── */
    @keyframes fadeUp  { from { opacity:0; transform:translateY(22px);} to{opacity:1;transform:translateY(0);} }
    @keyframes fadeIn  { from { opacity:0; } to { opacity:1; } }
    @keyframes floatY  { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-14px);} }
    @keyframes floatChip1 { 0%,100%{transform:translateX(0);} 50%{transform:translateX(-5px);} }
    @keyframes floatChip2 { 0%,100%{transform:translateX(0);} 50%{transform:translateX(-7px);} }
    @keyframes floatChip3 { 0%,100%{transform:translateX(0);} 50%{transform:translateX(5px);} }
    @keyframes glow { 0%,100%{opacity:.6;} 50%{opacity:1;} }
    @keyframes blink { 0%,90%,100%{opacity:1;} 95%{opacity:.2;} }

.founder-img { display: block; width: 300px; padding:16px;border: 1px solid #ccc; }
    /* ── RESPONSIVE ── */
    @media (max-width: 900px) {
      .funiture-lock-inner { grid-template-columns: 1fr; padding: 60px 24px; text-align: center; }
      .funiture-lock-left { max-width: 100%; margin: 0 auto; }
      .funiture-lock-desc  { max-width: 100%; }
      .funiture-lock-btns, .funiture-lock-badges { justify-content: center; }
      .funiture-lock-right { min-height: 380px; margin-top: 16px; }
      .funiture-lock-panels { right: 0; width: 45%; }
      .chip-1 { left: 2px; }
      .chip-2 { left: 2px; }
      .chip-3 { right: 2px; }
    }
    @media (max-width: 480px) {
      .ddl-eyebrow{color: #dce4fb;}
      .ddl-h2{color: #fff; text-align: center; font-size: 29px;}
      .ddl-eyebrow::before{color: #fff;}
      .funiture-lock-line{background: #fff;}
      .clr-furnit{color: #000 !important;}
      .funiture-lock-heading .solid{color: #000;}
     .funiture-lock-panels { display: none; }
      .funiture-lock-heading .italic { font-size: 40px; }
      .funiture-lock-heading .solid  { font-size: 36px; }
      .chip { display: none; }
    }




.h-accordion{display:flex;width:100%;overflow:hidden;border-top:1.5px solid var(--grey-3);}

.h-accordion-item{position:relative;flex:1 1 0%;min-width:72px;overflow:hidden;
  transition:flex .6s cubic-bezier(.4,0,.2,1);border-right:1px solid var(--grey-3);background:var(--grey-1);}
.h-accordion-item:last-child{border-right:none;}

/* Pure CSS hover behavior */
.h-accordion-item:hover{flex:2.2 1 0%;background:var(--white);}
.h-accordion:hover .h-accordion-item:not(:hover){flex:0.8 1 0%;}

/* label strip pinned to the left edge, always visible */
.h-accordion-header{position:absolute;top:9%;left:0;bottom:0;
  width:60px;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-start;gap:1.1rem;
  padding-top:3.2rem;z-index:3;
  background:var(--grey-1);
  /*border-right:1px solid var(--grey-3);*/
}
.h-accordion-item:hover .h-accordion-header{background:var(--white);}
.h-accordion-header i{font-size:1.15rem;color:var(--navy);}
.h-accordion-title{writing-mode:vertical-rl;transform:rotate(180deg);font-weight:700;font-size:.8rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--grey-5);white-space:nowrap;}

/* body always visible, offset for the label strip */
.h-accordion-body{width:100%;height:100%;padding-left:60px;}

@media(max-width:900px){
  .h-accordion{flex-direction:column;min-height:unset;}
  .h-accordion-item{flex:none !important;width:100%;min-width:unset;border-right:none;border-bottom:1px solid var(--grey-3);}
  .h-accordion-item:hover{flex:none !important;}
  .h-accordion-header{position:relative;flex-direction:row;width:100%;height:56px;padding:0 3rem;
    justify-content:flex-start;border-right:none;border-bottom:1px solid var(--grey-3);}
  .h-accordion-title{writing-mode:horizontal-tb;transform:none;}
  .h-accordion-body{padding-left:0;}
}


/* ────────────────────────────────────────────
   FLOATING CTA BUTTON — RIGHT SIDE
──────────────────────────────────────────── */
.float-cta {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%) rotate(180deg);

  /* pill shape, rotated vertical */
  display: flex;
  align-items: center;
  gap: .55rem;

  background: #2B2B2B;
  color: #fff;
  text-decoration: none;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  white-space: nowrap;

  padding: .65rem 1.05rem;
  border-radius: 10px 10px 0 0; /* rounded on the "top" (visually left) */
  box-shadow: -4px 0 24px rgba(43, 45, 142, .35), 0 2px 8px rgba(0,0,0,.18);

  writing-mode: vertical-rl;
  text-orientation: mixed;

  z-index: 999;
  cursor: pointer;
  border: none;
  outline: none;
  transition: padding .25s ease, background .25s ease, box-shadow .25s ease, transform .25s ease;
}
.float-cta i {
  font-size: .85rem;
  writing-mode: horizontal-tb;
  text-orientation: mixed;
  transform: rotate(180deg); /* re-upright the icon */
  flex-shrink: 0;
  transition: transform .3s ease;
}
.float-cta:hover {
  background: linear-gradient(135deg, #D0021B 0%, #a80116 100%);
  padding: .65rem 1.45rem;
  box-shadow: -6px 0 32px rgba(208, 2, 27, .4), 0 2px 8px rgba(0,0,0,.18);
  transform: translateY(-50%) rotate(180deg) translateX(-4px);
}
.float-cta:hover i {
  transform: rotate(180deg) translateX(-3px);
}

/* Optional: gold accent top strip */
.float-cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #C9A86C, #e8cc99);
  border-radius: 10px 10px 0 0;
}

/* ────────────────────────────────────────────
   SCROLL TO TOP BUTTON
──────────────────────────────────────────── */
.go-top {
  position: fixed;
  right: 1.3rem;
  bottom: 1.6rem;
  z-index: 999;

  width: 46px;
  height: 46px;
  border-radius: 12px;
  border: 1.5px solid rgba(43,45,142,.18);
  background: #fff;
  color: #2B2D8E;
  font-size: .85rem;

  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(0,0,0,.12);

  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  transition: opacity .3s ease, visibility .3s ease, transform .3s ease,
              background .25s ease, color .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.go-top.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.go-top:hover {
  background: #2B2D8E;
  color: #fff;
  border-color: transparent;
  box-shadow: 0 6px 28px rgba(43,45,142,.38);
  transform: translateY(-3px);
}

/* ── Subtle progress ring on scroll-top btn ── */
.go-top svg.ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  pointer-events: none;
}
.go-top svg.ring circle {
  fill: none;
  stroke: #2B2D8E;
  stroke-width: 2;
  stroke-dasharray: 0 999;
  stroke-linecap: round;
  transition: stroke-dasharray .2s linear;
}
.go-top:hover svg.ring circle {
  stroke: rgba(255,255,255,.45);
}

/* ── DEMO only: page scroll indicator ── */
@media (max-width: 600px) {
.mob-pd{padding-left: 0px !important;}
  .ft-bottom{display: block; text-align: center;}
  .float-cta { font-size: .65rem; padding: .55rem .9rem; }
  .go-top { width: 42px; height: 42px; right: 1rem; bottom: 1.2rem; }
  .ft-bottom span{text-align: center !important;}
  .ft-brand .logo-mark img{margin: 0 auto;}
}




  /* ── PRODUCT HERO BANNER ── */
  .product-hero-banner {
    position: relative;
    min-height: 320px;
    background: linear-gradient(135deg, #0d1b2a 0%, #1a3050 60%, #0d2238 100%);
    display: flex;
    align-items: center;
    overflow: hidden;
  }
  .product-hero-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 70% 80% at 80% 50%, rgba(200,164,74,.13) 0%, transparent 70%),
      url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23c8a44a' fill-opacity='0.04'%3E%3Ccircle cx='30' cy='30' r='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }
.hero-inner2 {
    /* display: grid; */
    /* grid-template-columns: 1fr 380px; */
    /* align-items: center; */
    gap: 2rem;
    padding: 2.5rem 0;
    position: absolute;
    left: 6%;
    bottom: 9%;
    right: auto;
    z-index: 9;
    }

  .hero-text-col {}
  .hero-img-col {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }
  .hero-img-col::before {
    content: '';
    position: absolute;
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(200,164,74,.18) 0%, transparent 70%);
    border-radius: 50%;
  }
  .hero-lock-img {
    width: 100%;
    /*max-width: 233px;*/
    height: auto;
    object-fit: contain;
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 24px 40px rgba(0,0,0,.45)) drop-shadow(0 0 60px rgba(200,164,74,.15));
    animation: floatLock 4s ease-in-out infinite;
  }
  @keyframes floatLock {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-12px); }
  }
  @media(max-width:900px) {
    .hero-inner2 { grid-template-columns: 1fr;     bottom: -5%;}
    .hero-img-col { display: block; width: 266px; margin: 0 auto; }
    .product-hero-banner { min-height: 260px; }
  }
  .hero-badge {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    background: rgba(200,164,74,.15);
    border: 1px solid rgba(200,164,74,.35);
    color: #fff9f9;
    font-size: .72rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: .3rem .9rem;
    border-radius: 100px;
    margin-bottom: 1.2rem;
  }
  .product-hero-banner h1 {
    font-family: 'Syne', sans-serif;
    font-weight: 800;
    font-size: clamp(1.6rem, 3vw, 2.4rem);
    line-height: 1.15;
    color: #fff;
    margin-bottom: .75rem;
  }
  .product-hero-banner h1 em { font-style: normal; color: #e31e24; }
  .product-hero-banner p.sub {
    color: rgba(255,255,255,.65);
    font-size: .95rem;
    line-height: 1.65;
    max-width: 500px;
    margin-bottom: 1.5rem;
  }
  .btn-gold {
    background: #e51e23;
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: .9rem;
    letter-spacing: .04em;
    padding: .8rem 2rem;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-transform: uppercase;
    transition: background .25s, transform .2s, box-shadow .25s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
  }
  .btn-gold:hover {
    background: #e2c070;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(200,164,74,.35);
    color:  #0d1b2a;
  }
  .btn-gold-cat {
    background:#e31e24;
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    position: relative;
    font-size: .9rem;
    cursor: pointer;
    letter-spacing: .04em;
    padding: .8rem 2rem;
    border: none;
    border-radius: 4px;

    text-transform: uppercase;
    transition: background .25s, transform .2s, box-shadow .25s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
  }
  .btn-gold-cat:hover {
    background: #e2c070;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(200,164,74,.35);
    color:  #0d1b2a;
  }
  /* ── BREADCRUMB ── */
  .breadcrumb-bar {
    background: #fff;
    border-bottom: 1px solid #e4e0d8;
    padding: .6rem 1.5rem;
    font-size: .9rem;
    color:  #6b7a8d;
  }
  .breadcrumb-bar a { color: #e51e23; text-decoration: none; }

  /* ── LAYOUT ── */
  .listing-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 1.75rem;
    padding: 2rem 1.5rem 4rem;
    max-width: 1400px;
    margin: 0 auto;
  }
  @media(max-width:900px) {
    .listing-layout { grid-template-columns: 1fr; }
    .filter-panel { position: static !important; }
  }

  /* ── FILTER PANEL ── */
  .filter-panel {
    position: sticky;
    top: 16px;
    align-self: start;
    height: calc(100vh - 100px);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #e4e0d8 transparent;
  }
  .filter-panel::-webkit-scrollbar { width: 4px; }
  .filter-panel::-webkit-scrollbar-thumb { background: #e4e0d8; border-radius: 4px; }

  .filter-card {
    background: #fff;
    border-radius: 10px;
    border: 1px solid #e4e0d8;
    padding: 1.4rem;
    margin-bottom: 1rem;
    transition: box-shadow .2s;
  }
  .filter-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.07); }

  .filter-head {
    font-family: 'Syne', sans-serif;
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color:  #6b7a8d;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .filter-head .icon { color: #e31e24; font-size: 1rem; }

  .filter-item {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem .5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background .15s;
    margin-bottom: .15rem;
  }
  .filter-item:hover { background: #f5f3ef; }
  .filter-item label {
    font-size: .85rem;
    color:  #0d1b2a;
    cursor: pointer;
    user-select: none;
    flex: 1;
  }
  .filter-item .fi-icon {
    font-size: .95rem;
    color:  #6b7a8d;
    width: 18px;
    text-align: center;
  }
  .filter-item input[type=checkbox] { accent-color: #e51e23; width: 15px; height: 15px; flex-shrink: 0; }
  .filter-item input[type=checkbox]:checked + .fi-icon { color:  #e51e23; }

  .filter-reset {
    font-size: .78rem;
    color: #e31e24;
    cursor: pointer;
    text-decoration: none;
    font-weight: 600;
  }
  .filter-reset:hover { text-decoration: underline; }

  .active-count {
    background: #c8a44a;
    color: #0d1b2a;
    font-size: .65rem;
    font-weight: 700;
    padding: .1rem .45rem;
    border-radius: 100px;
    margin-left: .3rem;
  }

  /* ── PRODUCTS AREA ── */
  .products-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: .75rem;
  }
  .products-header h2 {
    font-family: 'Syne', sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0;
  }
  .products-header h2 span { color: #e31e24; }

  .sort-select {
    border: 1px solid #e4e0d8;
    border-radius: 6px;
    padding: .45rem .8rem;
    font-size: .82rem;
    color: #e31e24;
    background: #fff;
    outline: none;
    cursor: pointer;
  }

  /* ── PRODUCT CARD ── */
  .products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 1.25rem;
  }

  .product-card {
    background:  #ffffff;
    border: 1px solid #e4e0d8;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .28s cubic-bezier(.25,.8,.25,1), box-shadow .28s cubic-bezier(.25,.8,.25,1);
    position: relative;
  }
  .product-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(13,27,42,.12), 0 4px 12px rgba(200,164,74,.1);
  }
  .ht-autop{height: auto;}

  .product-card .badge-new {
    position: absolute;
    top: 12px;
    left: 12px;
    background: #e31e24;
    color: #fff;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .2rem .55rem;
    border-radius: 4px;
    z-index: 2;
  }

  .product-img-wrap {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    /*height: 200px;*/
    position: relative;
    overflow: hidden;
  }
  .product-img-wrap::before {
    content: '';
    position: absolute;
    width: 160px;
    height: 160px;
    background: radial-gradient(circle, rgba(200,164,74,.13) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
  }
  .product-img-wrap  img {
    /*width: 100%;*/
    /*height: 100%;*/
    object-fit: cover;
    object-position: center;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.25,.8,.25,1);
  }
  .product-card:hover img{
    transform: scale(1.06);
  }


   .product-img-wrap2 {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    position: relative;
    overflow: hidden;
  }
  .product-img-wrap2::before {
    content: '';
    position: absolute;
    width: 160px;
    height: 160px;
    background: radial-gradient(circle, rgba(200,164,74,.13) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
  }
  .product-img-wrap2 .prod-img2 {
    /*width: 100%;*/
    /*height: 100%;*/
    object-fit: cover;
    object-position: center;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.25,.8,.25,1);
  }
  .product-card2:hover .prod-img2 {
    transform: scale(1.06);
  }


  .product-body {
    padding: 1.1rem 1.1rem .9rem;
    flex: 1;
    display: flex;
    flex-direction: column;
  }
  .product-body .model-id {
    font-size: .68rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color:  #6b7a8d;
    margin-bottom: .2rem;
  }
  .product-body .product-name {
    font-family: 'Syne', sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: #0d1b2a;
    margin-bottom: .6rem;
    line-height: 1.3;
  }
  .product-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    margin-bottom: .9rem;
  }
  .product-tags .tag {
    background:#f5f3ef;
    border: 1px solid #e4e0d8;
    color:  #6b7a8d;
    font-size: .62rem;
    font-weight: 500;
    letter-spacing: .04em;
    padding: .18rem .5rem;
    border-radius: 100px;
  }
  /*.product-tags .tag.gold { background: rgba(200,164,74,.1); border-color: rgba(200,164,74,.3); color:#e31e24; }*/

  .btn-explore {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    background: transparent;
    border: 1.5px solid  #0d1b2a;
    color:  #0d1b2a;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: .8rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: .6rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: background .22s, color .22s, border-color .22s, transform .2s;
    margin-top: auto;
    width: 100%;
  }
 .btn-explore:hover {
    background: #e51e23;
    color: #fff;
    border-color: #e51e23;
    transform: translateY(-1px);
}
  .btn-explore i { transition: transform .2s; }
  .btn-explore:hover i { transform: translateX(3px); }

  /* ── NO RESULTS ── */
  .no-results {
    grid-column: 1/-1;
    text-align: center;
    padding: 4rem 2rem;
    color:  #6b7a8d;
  }
  .no-results i { font-size: 3rem; display: block; margin-bottom: .75rem; color:#e4e0d8; }

  /* ── SCROLL ANIMATIONS ── */
  .fade-up {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .5s ease, transform .5s ease;
  }
  .fade-up.visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* ── MOBILE FILTER TOGGLE ── */
  .filter-toggle-btn {
    display: none;
    align-items: center;
    gap: .5rem;
    background:  #0d1b2a;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: .6rem 1.1rem;
    font-size: .85rem;
    font-weight: 600;
    cursor: pointer;
  }
  @media(max-width:900px) {
    .filter-toggle-btn { display: inline-flex; }
    .filter-panel { display: none; }
    .filter-panel.mobile-open { display: block; }
    .listing-layout { padding: 1rem; }
  }


  /* ── DOWNLOAD CATALOGUE CTA ── */
  .catalogue-cta {
    margin-top: 2.5rem;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 1.75rem;
    background: linear-gradient(135deg, #0d1b2a 0%, #1a3050 60%, #0d2238 100%);
    border-radius: 14px;
    padding: 2.25rem 2.5rem;
  }
  .catalogue-cta::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 70% 90% at 88% 50%, rgba(200,164,74,.16) 0%, transparent 70%),
      url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23c8a44a' fill-opacity='0.04'%3E%3Ccircle cx='30' cy='30' r='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }
  .catalogue-icon {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(200,164,74,.15);
    border: 1px solid rgba(200,164,74,.35);
    color: #e2c070;
    font-size: 1.7rem;
  }
  .catalogue-content {
    position: relative;
    z-index: 1;
    flex: 1;
    min-width: 0;
  }
  .catalogue-content h3 {
    font-family: 'Syne', sans-serif;
    font-weight: 700;
    font-size: 1.3rem;
    color: #fff;
    margin: 0 0 .4rem;
  }
  .catalogue-content p {
    color: rgba(255,255,255,.65);
    font-size: .9rem;
    line-height: 1.65;
    max-width: 520px;
    margin: 0;
  }
  .catalogue-cta .btn-gold {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
  }
  @media(max-width:700px) {
    .mob-pd{padding-left: 0px !important;}
    .catalogue-cta {
      flex-direction: column;
      text-align: center;
      padding: 2rem 1.5rem;
    }
    .catalogue-content p { max-width: 100%; }
    .catalogue-cta .btn-gold { width: 100%; justify-content: center; }
  }
  
dl, ol, ul {
    margin-top: 0;
    margin-bottom: inherit;
}
ol, ul {
     padding-left: 0rem; 
}


/* MEDIA / VIDEOS */
.media-video-section{
  background:#f4f4f4;
  padding:4rem 0;
}

.video-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:2rem 1.75rem;
}

.video-card{
  display:block;
  text-decoration:none;
  color:inherit;
}

.video-thumb{
  position:relative;
  border-radius:10px;
  overflow:hidden;
  aspect-ratio:16/9;
  background:#111;
  box-shadow:0 4px 14px rgba(0,0,0,.12);
}

.video-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}

.video-card:hover .video-thumb img{
  transform:scale(1.05);
}

.video-play{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:56px;
  height:56px;
  background:#ff0000;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:1.1rem;
  box-shadow:0 4px 10px rgba(0,0,0,.35);
  transition:transform .25s ease, background .25s ease;
}

.video-card:hover .video-play{
  transform:translate(-50%,-50%) scale(1.1);
  background:#e60000;
}

.video-card h4{
  margin-top:.9rem;
  font-size:1rem;
  font-weight:700;
  line-height:1.35;
  color:#1a1a1a;
}

/* RESPONSIVE */
@media (max-width:1199px){
  .video-grid{ grid-template-columns:repeat(3,1fr); }
}

@media (max-width:767px){
    .how-sec{padding:0px; margin-top: 66px;}
    .how-inner{gap: 0px;}
  .how-visual{height: auto; margin: 54px 0px;}
    .funiture-lock-tabsec{background-position: center !important;}
  .video-grid{ grid-template-columns:repeat(2,1fr); gap:1.5rem 1rem; }
  .media-video-section{ padding:3rem 0; }
  .ddl-content{position: absolute;    top: 62%; left: 98px;}
        .funiture-lock-inner{position: absolute; top:46%;}
}

@media (max-width:479px){
    .how-sec{padding:0px; margin-top: 66px;}
      .how-inner{gap: 0px;}
      .ddl{min-height: 65vh;}
      .how-visual{height: auto; margin: 54px 0px;}
  .video-grid{ grid-template-columns:1fr; }
    .funiture-lock-tabsec{background-position:center !important;     min-height: 64vh;}
      .ddl-content{position: absolute;    top: 56%;}
      .funiture-lock-inner{position: absolute; top:46%; }
}

/*****Product details page css******/

/* ═══════════ TOKENS ═══════════ */

/* ═══════════ HERO SLIDER ═══════════ */
#product-page-details-slider{position:relative;}
.hero-slide{
  position:relative;
  /*height:580px;*/
  display:flex;
  align-items:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background:linear-gradient(135deg,#0B0C0E 0%,#1A1C22 60%,#0F1115 100%);
}
.hero-bg::after{
  content:'';
  position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  opacity:0.6;
  pointer-events:none;
}
.hero-orb{
  position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;
}
.hero-orb-1{width:500px;height:500px;background:radial-gradient(circle,rgba(192,154,82,0.25) 0%,transparent 70%);right:-80px;top:-80px;}
.hero-orb-2{width:320px;height:320px;background:radial-gradient(circle,rgba(100,120,180,0.12) 0%,transparent 70%);left:10%;bottom:-60px;}
.hero-grid{
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.03) 1px,transparent 1px);
  background-size:60px 60px;
}
.hero-content{position:relative;z-index:2;}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(192,154,82,0.12);
  border:1px solid rgba(192,154,82,0.25);
  border-radius:30px;
  padding:5px 14px 5px 10px;
  font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:#E8C97A;
  margin-bottom:20px;
}
.hero-eyebrow i{font-size:13px;}
.hero-headline{
  font-family:'Sora',sans-serif;
  font-size:clamp(2.2rem,4.5vw,3.6rem);
  font-weight:800;
  color:#fff;
  line-height:1.08;
  letter-spacing:-0.04em;
  margin-bottom:18px;
}
.hero-headline .accent{
  background:linear-gradient(135deg,#C09A52 0%,#E8C97A 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hero-sub{
  font-size:15px;color:rgba(255,255,255,0.5);
  max-width:400px;margin-bottom:32px;font-weight:300;line-height:1.7;
}
.hero-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px;}
.hero-pill{
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:30px;padding:4px 12px;
  font-size:11.5px;color:rgba(255,255,255,0.6);
}
.hero-cta-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.btn-gold2{
  display:inline-flex;align-items:center;gap:8px;
  /*background:linear-gradient(135deg,#C09A52 0%,#A8823E 100%);*/
  background:#e31e24;
  color:#fff;border:none;
  padding:13px 28px;border-radius:8px;
  font-family:'Sora',sans-serif;font-size:13px;font-weight:600;letter-spacing:0.03em;
  cursor:pointer;text-decoration:none;
  box-shadow:0 4px 20px rgba(192,154,82,0.4);
  transition:all 0.25s;
}
.btn-gold2:hover{
  background: #222; color:#fff;transform:translateY(-2px);box-shadow:0 8px 28px rgba(192,154,82,0.5);}
.btn-ghost{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.15);
  color:rgba(255,255,255,0.75);
  padding:12px 22px;border-radius:8px;
  font-size:13px;font-weight:500;
  cursor:pointer;text-decoration:none;
  transition:all 0.2s;backdrop-filter:blur(6px);
}
.btn-ghost:hover{background:rgba(255,255,255,0.12);color:#fff;border-color:rgba(255,255,255,0.3);}

.hero-visual-wrap{
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.hero-visual-glow{
  position:absolute;width:340px;height:340px;
  background:radial-gradient(circle,rgba(192,154,82,0.18) 0%,transparent 70%);
  border-radius:50%;
}
#product-page-details-slider .carousel-control-prev,
#product-page-details-slider .carousel-control-next{
  width:46px;height:46px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:50%;backdrop-filter:blur(8px);
  top:50%;transform:translateY(-50%);
  opacity:1;transition:all 0.2s;
}
#product-page-details-slider .carousel-control-prev{left:24px;}
#product-page-details-slider .carousel-control-next{right:24px;}
#product-page-details-slider .carousel-control-prev:hover,
#product-page-details-slider .carousel-control-next:hover{background:rgba(192,154,82,0.2);border-color:rgba(192,154,82,0.4);}
#product-page-details-slider .carousel-indicators{bottom:24px;}
#product-page-details-slider .carousel-indicators [data-bs-target]{
  width:24px;height:3px;border-radius:2px;
  background:rgba(255,255,255,0.9);border:none;
  transition:all 0.3s;
}
#product-page-details-slider .carousel-indicators .active{background:#e51e23;width:40px;}
.carousel-item{transition:transform 0.7s ease;}

/* ═══════════ BREADCRUMB ═══════════ */
.breadcrumb-product{
  padding:13px 0;
  background:#FFFFFF;
  border-bottom:1px solid #F0F1F4;
}
.breadcrumb{margin:0;font-size:12.5px;}
.breadcrumb-item a{color:#e51e23;text-decoration:none;}
.breadcrumb-item a:hover{color:#000;}
.breadcrumb-item.active{color:#1A1C21;font-weight:500;}
.breadcrumb-item+.breadcrumb-item::before{color:#C5C8D0;}

/* ═══════════ PRODUCT DETAIL ═══════════ */
.product-detail{padding:64px 0 30px;background:#FFFFFF;}

.gallery-main{
  background:linear-gradient(145deg,#F9FAFB 0%,#F1F3F6 100%);
  border-radius:var(--r-xl);
  border:1px solid #E4E6EB;
  aspect-ratio:1/1;
  cursor:zoom-in;
  display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
  box-shadow:var(--shadow-md);
}
.gallery-main::before{
  content:'';position:absolute;
  top:-60px;right:-60px;
  width:240px;height:240px;
  background:radial-gradient(circle,rgba(192,154,82,0.08) 0%,transparent 70%);
  border-radius:50%;
}
.gallery-badge-float{
  position:absolute;top:16px;left:16px;
  background:rgba(22,163,74,0.1);border:1px solid rgba(22,163,74,0.2);
  border-radius:30px;padding:4px 12px;
  font-size:11px;font-weight:600;color:#16A34A;
  display:flex;align-items:center;gap:5px;
}
.gallery-thumb-strip{
  display:flex;gap:8px;margin-top:12px;
}
.g-thumb{
  flex:1;aspect-ratio:1/1;
  background:#F8F9FB;
  border:2px solid #F0F1F4;
  border-radius:var(--r-md);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;overflow:hidden;
  transition:all 0.22s;
}
.g-thumb:hover{border-color:#e51e23;box-shadow:0 0 0 3px rgba(192,154,82,0.12);}
.g-thumb.active{border-color:#e51e23;box-shadow:0 0 0 3px rgba(192,154,82,0.15);}

.year-yr{width: 130px;}
.madeinindia{width: 129px;}
/* ── Magnifier ── */
.zoom-lens{
  position:absolute; top:0; left:0; width:100%; height:100%;
  background-repeat:no-repeat;
  background-size:56%;
  opacity:0; pointer-events:none;
  transition:opacity .2s ease;
  z-index:5;
}
.gallery-main.zoom-active .zoom-lens{ opacity:1; }
.gallery-main.zoom-active #mainLockImg{ opacity:0 !important; }
.zoom-hint{
  position:absolute; bottom:14px; left:50%; transform:translateX(-50%);
  background:rgba(0,0,0,0.65); color:#fff; font-size:11px; font-weight:600;
  padding:5px 12px; border-radius:20px; letter-spacing:.02em;
  pointer-events:none; opacity:0; transition:opacity .25s ease; z-index:6;
}
.gallery-main:hover .zoom-hint{ opacity:1; }
.gallery-main.zoom-active .zoom-hint{ opacity:0; }

/* ── Thumb slider ── */
.gallery-thumb-slider{
  display:flex; align-items:center; gap:8px;
}
.gallery-thumb-strip{
  display:flex; gap:10px; overflow-x:auto; scroll-behavior:smooth;
  flex:1; scrollbar-width:none; cursor:grab; user-select:none;
}
.gallery-thumb-strip::-webkit-scrollbar{ display:none; }
.gallery-thumb-strip.dragging{ cursor:grabbing; scroll-behavior:auto; }
.g-thumb{
  flex:0 0 72px; height:72px; border-radius:10px; overflow:hidden;
  border:2px solid transparent; transition:border-color .2s ease;
}
.g-thumb.active{ border-color:#C8A44A; }
.thumb-nav{
  flex:0 0 auto; width:32px; height:32px; border-radius:50%;
  border:1px solid #e2e2e2; background:#fff; display:flex;
  align-items:center; justify-content:center; cursor:pointer;
  transition:all .2s ease;
}
.thumb-nav:hover{ background:#C8A44A; border-color:#C8A44A; color:#fff; }
.thumb-nav:disabled{ opacity:.35; cursor:default; pointer-events:none; }

.prod-badge{
  display:inline-flex;align-items:center;gap:6px;
  background:#e51e23;border:1px solid rgb(228 42 49);
  color:#fff;border-radius:30px;
  font-size:11.5px;font-weight:600;padding:5px 14px;margin-bottom:18px;
}
.prod-title{
  font-size:clamp(1.9rem,3.5vw,2.8rem);
  font-weight:800;letter-spacing:-0.04em;
  color:#1A1C21;line-height:1.1;margin-bottom:6px;
}
.prod-title span{
  background:linear-gradient(135deg, #2b2b2b 0%, #623b3b 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.code-row{
  display:flex;align-items:center;gap:10px;margin-bottom:22px;
}
.code-label{font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:#6B7280;}
.code-chip{
  font-family:'Sora',sans-serif;
  font-size:13px;
  font-weight:700;
  background:linear-gradient(135deg, #101213 0%, #000000 100%);
  color:#fff;
  padding:4px 12px;border-radius:6px;letter-spacing:0.05em;
}
.divider{height:1px;background:#F0F1F4;margin:22px 0;}

.finish-row{display:flex;gap:14px;align-items:flex-start;}
.swatch-item{display:flex;flex-direction:column;align-items:center;gap:6px;}
.swatch{
  width:38px;height:38px;border-radius:50%;cursor:pointer;
  border:2px solid transparent;
  box-shadow:inset 0 1px 2px rgba(0,0,0,0.15);
  transition:all 0.2s;position:relative;
}
.swatch::after{
  content:'';position:absolute;inset:-5px;border-radius:50%;
  border:2px solid transparent;transition:border-color 0.2s;
}
.swatch.active::after{border-color:#C09A52;}
.swatch:hover{transform:scale(1.08);}
.swatch-black{background:#1a1a1a;}
.swatch-silver{background:linear-gradient(135deg,#BFC2C8,#E8EAED);}
.swatch-gold{background:linear-gradient(135deg,#C9A84C,#E5C97A);}
.swatch-label{font-size:10.5px;color:#6B7280;font-weight:500;}

.prod-desc{
  font-size:14.5px;color:#6B7280;line-height:1.78;
}
.prod-desc strong{color:#1A1C21;font-weight:600;}

.access-pills{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0;}
.a-pill {
    display: block;
    /* display: inline-flex; */
    align-items: center;
    gap: 6px;
   /* background: #F8F9FB;
    border: 1px solid #E4E6EB;*/
    border-radius: 30px;
    /*padding: 9px 32px;*/
    font-size: 14px;
    text-align: center;
    margin:0px 0px 15px 4px;
    font-weight: 500;
    color: #3C3F48;
    transition: all 0.2s;
}
.mr-left-z{margin-left: 0px;}


.a-pill img {
    display: block;
    margin: 0 auto 5px;
}
.a-pill i{color:#e51e23;font-size:21px;}
.a-pill:hover{border-color:#e51e23;background:#FBF6EC;color:#1A1C21;}

.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}
.btn-dark-brand{
  display:inline-flex;align-items:center;gap:8px;
  background:#0E0F11;color:#fff;
  padding:13px 24px;border-radius:var(--r-sm);
  font-family:'Sora',sans-serif;font-size:13px;font-weight:600;
  text-decoration:none;letter-spacing:0.02em;
  transition:all 0.22s;border:1.5px solid #0E0F11;
}
.btn-dark-brand:hover{background:#3C3F48;color:#fff;transform:translateY(-1px);}
.btn-outline-brand{
  display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:#1A1C21;
  border:1.5px solid #E4E6EB;
  padding:12px 20px;border-radius:var(--r-sm);
  font-size:13px;font-weight:500;
  text-decoration:none;transition:all 0.2s;
}
.btn-outline-brand:hover{border-color:#C09A52;color:#C09A52;}

.trust-strip{
  display:flex;flex-wrap:wrap;gap:0;
  border:1px solid #F0F1F4;
  border-radius:var(--r-md);
  overflow:hidden;margin-top:24px;
}
.trust-item{
  flex:1;display:flex;align-items:center;gap:10px;
  padding:14px 16px;
  background:#F8F9FB;
  border-right:1px solid #F0F1F4;
  min-width:140px;
}
.trust-item:last-child{border-right:none;}
.trust-item i{font-size:18px;color:#e51e23;}
.trust-item-title{font-size:12px;font-weight:600;color:#1A1C21;margin-bottom:1px;}
.trust-item-sub{font-size:11px;color:#6B7280;}

/* ═══════════ SECTION HEADERS ═══════════ */
.sec-eyebrow{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.15em;
  color:#e51e23;margin-bottom:10px;
}
.sec-eyebrow::before{
  content:'';display:inline-block;width:20px;height:2px;
  background:linear-gradient(90deg,#e51e23,#e51e23);border-radius:1px;
}
.sec-title{
  font-size:clamp(1.5rem,2.8vw,2.1rem);
  font-weight:800;letter-spacing:-0.03em;
  color:#1A1C21;line-height:1.2;margin-bottom:14px;
}
.sec-desc{font-size:14.5px;color:#6B7280;line-height:1.75;max-width:500px;}

/* ═══════════ VIDEO SECTION ═══════════ */
.video-section{
  padding:80px 0;
  background:linear-gradient(180deg,#F8F9FB 0%,#FFFFFF 100%);
  position:relative;overflow:hidden;
}
.video-section::before{
  content:'';position:absolute;
  top:-1px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,#E4E6EB,transparent);
}
.video-tab-nav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:28px;}
.vtab{
  background:#FFFFFF;border:1.5px solid #E4E6EB;
  border-radius:30px;padding:8px 20px;
  font-size:12.5px;font-weight:500;color:#6B7280;
  cursor:pointer;transition:all 0.2s;
}
.vtab.active,.vtab:hover{
  background:#0E0F11;color:#fff;border-color:#0E0F11;
  box-shadow:var(--shadow-sm);
}
.vtab.active{border-color:#0E0F11;}
.video-frame{
  background:linear-gradient(145deg,#111318,#1a1d24);
  border-radius:var(--r-xl);
  aspect-ratio:16/9;
  display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
  box-shadow:var(--shadow-lg);
  border:1px solid rgba(255,255,255,0.06);
}
.video-frame-grid{
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,0.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.015) 1px,transparent 1px);
  background-size:40px 40px;
}
.video-frame-orb{
  position:absolute;width:300px;height:300px;border-radius:50%;
  background:radial-gradient(circle,rgba(192,154,82,0.12) 0%,transparent 70%);
  top:50%;left:50%;transform:translate(-50%,-50%);
}
.play-btn{
  width:74px;height:74px;
  background:rgba(255,255,255,0.08);
  border:2px solid rgba(255,255,255,0.2);
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  cursor:pointer;position:relative;z-index:2;
  transition:all 0.25s;backdrop-filter:blur(6px);
}
.play-btn:hover{background:rgba(192,154,82,0.2);border-color:#C09A52;transform:scale(1.06);}
.play-btn i{font-size:28px;color:#fff;margin-left:3px;}
.video-label{
  position:relative;z-index:2;
  margin-top:12px;text-align:center;
  font-size:13px;color:rgba(255,255,255,0.45);
}
.video-corner{
  position:absolute;width:22px;height:22px;
  border:2px solid rgba(192,154,82,0.35);
}
.vc-tl{top:16px;left:16px;border-right:none;border-bottom:none;border-radius:4px 0 0 0;}
.vc-tr{top:16px;right:16px;border-left:none;border-bottom:none;border-radius:0 4px 0 0;}
.vc-bl{bottom:16px;left:16px;border-right:none;border-top:none;border-radius:0 0 0 4px;}
.vc-br{bottom:16px;right:16px;border-left:none;border-top:none;border-radius:0 0 4px 0;}
.video-info-card{
  background:#FFFFFF;border:1px solid #F0F1F4;
  border-radius:var(--r-lg);padding:28px 28px;
  height:100%;box-shadow:var(--shadow-sm);
}
.video-info-title{font-family:'Sora',sans-serif;font-size:1.2rem;font-weight:700;color:#1A1C21;margin-bottom:10px;}
.video-info-desc{font-size:13.5px;color:#6B7280;line-height:1.7;margin-bottom:20px;}
.vpoint{display:flex;gap:10px;margin-bottom:10px;font-size:13.5px;color:#6B7280;}
.vpoint i{color:#e51e23;font-size:15px;flex-shrink:0;margin-top:2px;}

/* ═══════════════════════════════════════════
   SPECS + FEATURES — COMBINED TAB + ACCORDION
═══════════════════════════════════════════ */
.specs-features-section{
  padding:80px 0;
  background:linear-gradient(180deg,#F8F9FB 0%,#FFFFFF 100%);
}

/* Pill-style tab switcher */
.sf-tab-bar{
  display:inline-flex;
  background:#FFFFFF;
  border:1px solid #E4E6EB;
  border-radius:14px;
  padding:5px;
  gap:4px;
  box-shadow:var(--shadow-sm);
  margin-bottom:36px;
}
.sf-tab{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 24px;
  border-radius:10px;
  border:none;background:transparent;
  font-family:'Sora',sans-serif;font-size:13px;font-weight:600;
  color:#6B7280;cursor:pointer;
  transition:all 0.25s;white-space:nowrap;
}
.sf-tab i{font-size:15px;}
.sf-tab.active{
  background:#0E0F11;
  color:#fff;
  box-shadow:0 3px 12px rgba(14,15,17,0.18);
}
.sf-tab:not(.active):hover{color:#1A1C21;background:#F8F9FB;}

/* Tab pane visibility */
.sf-pane{display:none;}
.sf-pane.active{display:block;}

/* ── SPECS ACCORDION ── */
.spec-acc-wrap{
  border:1px solid #E4E6EB;  border-radius:var(--r-xl);
  overflow:hidden;
  box-shadow:var(--shadow-md);
}
.spec-acc-group{border-bottom:1px solid #F0F1F4;}
.spec-acc-group:last-child{border-bottom:none;}

.spec-acc-head{
  width:100%;display:flex;align-items:center;gap:14px;
  padding:18px 26px;
  background:#FFFFFF;border:none;cursor:pointer;text-align:left;
  transition:background 0.18s;
}
.spec-acc-head:hover{background:#FAFBFC;}
.spec-acc-head.open{background:#0E0F11;}

.spec-acc-num {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Sora', sans-serif;
    font-size: 12px;
    font-weight: 800;
    background: #F8F9FB;
    border: 1px solid #e51e23;
    color: #e51e23;
    transition: all 0.22s;
}
.spec-acc-head.open .spec-acc-num {
    background: #e51e23;
    border-color: rgba(192, 154, 82, 0.3);
    color: #fff;
}
.spec-acc-label-wrap{flex:1;}
.spec-acc-category{
  font-family:'Sora',sans-serif;font-size:13.5px;font-weight:700;
  color:#1A1C21;transition:color 0.18s;margin-bottom:1px;
}
.spec-acc-head.open .spec-acc-category{color:#fff;}
.spec-acc-sub{font-size:11.5px;color:#6B7280;transition:color 0.18s;}
.spec-acc-head.open .spec-acc-sub{color:rgba(255,255,255,0.42);}

.spec-acc-arrow{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:#F8F9FB;border:1px solid #E4E6EB;
  font-size:13px;color:#6B7280;
  transition:all 0.3s;
}
.spec-acc-head.open .spec-acc-arrow{
  background:rgba(255,255,255,0.1);
  border-color:rgba(255,255,255,0.15);
  color:#fff;
  transform:rotate(180deg);
}

.spec-acc-body{
  max-height:0;overflow:hidden;
  transition:max-height 0.4s cubic-bezier(0.4,0,0.2,1);
  background:#FFFFFF;
}
.spec-acc-body.open{max-height:800px;}

.spec-table{width:100%;border-collapse:collapse;}
.spec-table tr{border-bottom:1px solid #F0F1F4;transition:background 0.14s;}
.spec-table tr:last-child{border-bottom:none;}
.spec-table tr:hover{background:#FBF6EC;}
.spec-table td{padding:13px 26px;vertical-align:top;}
.spec-table td:first-child{
  width:40%;font-size:13px;font-weight:600;color:#3C3F48;
  padding-right:8px;
}
.spec-table td:last-child{font-size:13px;color:#6B7280;}
.spec-chip{
  display:inline-block;
  font-family:'Sora',sans-serif;font-size:12px;font-weight:700;
  background:#e51e23;color:#fff;
  padding:2px 10px;border-radius:5px;letter-spacing:0.04em;
}
.cap-table-inner{width:100%;border-collapse:collapse;}
.cap-table-inner td{font-size:12.5px;padding:3px 0;color:#6B7280;}
.cap-table-inner td:first-child{
  font-weight:600;
  color:#3C3F48;
  width:60%;}


.feat-acc-wrap{
  border:1px solid #E4E6EB;
  border-radius:var(--r-xl);
  overflow:hidden;
  box-shadow:var(--shadow-md);
}
.feat-acc-item{border-bottom:1px solid #F0F1F4;}
.feat-acc-item:last-child{border-bottom:none;}

.feat-acc-head{
  width:100%;display:flex;align-items:center;gap:16px;
  padding:20px 26px;
  background:#FFFFFF;border:none;cursor:pointer;text-align:left;
  transition:background 0.18s;
}
.feat-acc-head:hover{background:#FAFBFC;}
.feat-acc-head.open{background:#0E0F11;}

.feat-acc-icon{
  width:44px;height:44px;border-radius:12px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:19px;color:#e51e23;
  background:#F8F9FB;border:1px solid #e51e23;
  transition:all 0.22s;
}
.feat-acc-head.open .feat-acc-icon{
  background:#e51e23;
  border-color:#e51e23;
  color:#fff;
}

.feat-acc-label{flex:1;}
.feat-acc-title{
  font-family:'Sora',sans-serif;font-size:14px;font-weight:700;
  color:#1A1C21;margin-bottom:2px;transition:color 0.18s;
}
.feat-acc-head.open .feat-acc-title{color:#fff;}
.feat-acc-badge{
  display:inline-flex;align-items:center;gap:4px;
  font-size:10.5px;font-weight:600;
  background:rgba(192,154,82,0.1);
  border:1px solid #e51e23;
  color:#e51e23;
  border-radius:20px;padding:2px 10px;
  transition:all 0.18s;
}


.feat-acc-head.open .feat-acc-badge{
  background:#e51e23;
  border-color:#e51e23;
  color: #fff;
}

.feat-acc-arrow{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:#F8F9FB;border:1px solid #E4E6EB;
  font-size:13px;color:#6B7280;transition:all 0.3s;
}
.feat-acc-head.open .feat-acc-arrow{
  background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.15);
  color:#fff;transform:rotate(180deg);
}

.feat-acc-body{
  max-height:0;overflow:hidden;
  transition:max-height 0.4s cubic-bezier(0.4,0,0.2,1);
  background:#FFFFFF;
}
.feat-acc-body.open{max-height:600px;}
.feat-acc-inner{
  padding:20px 26px 24px 86px;
  border-top:1px solid #F0F1F4;
}
.feat-acc-desc{
  font-size:13.5px;color:#6B7280;line-height:1.75;margin-bottom:14px;
}
.feat-points{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:7px;}
.feat-points li{
  display:flex;align-items:flex-start;gap:8px;
  font-size:13px;color:#3C3F48;
}
.feat-points li i{color:#16A34A;font-size:13px;flex-shrink:0;margin-top:2px;}

/* Right-side stat card in features tab */
.feat-stat-card{
  background:#FFFFFF;
  border:1px solid #E4E6EB;
  border-radius:var(--r-xl);
  padding:32px 28px;
  box-shadow:var(--shadow-sm);
  position:sticky;top:24px;
}
.fsc-row{margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid #F0F1F4;}
.fsc-row:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none;}
.fsc-val{font-family:'Sora',sans-serif;font-size:2.2rem;font-weight:800;line-height:1;color:var(--ink);}
.fsc-val.gold{color:#e51e23;}
.fsc-label{font-size:12px;color:#6B7280;margin-top:4px;}

@media(max-width:991px){
  .feat-stat-card{position:static;margin-bottom:24px;}
  .feat-acc-inner{padding-left:26px;}
}
@media(max-width:767px){
  .sf-tab{padding:9px 16px;font-size:12px;}
  .spec-acc-head,.feat-acc-head{padding:16px 18px;}
  .spec-table td{padding:12px 18px;}
  .feat-acc-inner{padding:16px 18px 20px;}
  .mr-left-z{margin-left: 13px;}
}

/* ═══════════ FEATURE ICON GRID ═══════════ */
.icon-grid-section{padding:80px 0;background:#FFFFFF;}
.fi-card{
  background:#FFFFFF;
  border:1px solid #F0F1F4;
  border-radius:var(--r-lg);
  padding:22px 14px 18px;
  text-align:center;height:100%;
  transition:all 0.28s;
  position:relative;overflow:hidden;
}
.fi-card::before{
  content:'';position:absolute;
  bottom:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,#C09A52,#E8C97A);
  transform:scaleX(0);transition:transform 0.3s;
}
.fi-card:hover{
  box-shadow:0 8px 32px rgba(0,0,0,0.09);
  border-color:rgba(192,154,82,0.3);
  transform:translateY(-4px);
}
.fi-card:hover::before{transform:scaleX(1);}
.fi-icon-wrap{
  width:54px;height:54px;border-radius:14px;
  background:linear-gradient(135deg,#F5F0E8,#FAF6F0);
  border:1px solid rgba(192,154,82,0.2);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 12px;font-size:22px;color:#C09A52;
  transition:all 0.25s;
}
.fi-card:hover .fi-icon-wrap{
  background:linear-gradient(135deg,#0E0F11,#252830);
  color:#E8C97A;border-color:transparent;
}
.fi-label{font-size:12px;font-weight:600;color:#3C3F48;line-height:1.4;}

/* ═══════════ COLLATERAL ═══════════ */
.collateral-section{
  padding:80px 0;
  background:linear-gradient(135deg,#0E0F11 0%,#141720 100%);
  position:relative;overflow:hidden;
}
.collateral-section::before{
  content:'';position:absolute;
  top:-120px;right:-120px;
  width:480px;height:480px;
  background:radial-gradient(circle,rgba(192,154,82,0.12) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.dl-card{
  display:flex;align-items:center;gap:16px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--r-md);padding:20px 22px;
  transition:all 0.25s;
}
.dl-card:hover{
  background:rgba(255,255,255,0.08);
  border-color:rgba(192,154,82,0.3);
  transform:translateX(4px);
}
.dl-icon{
  width:46px;height:46px;border-radius:10px;
  background:linear-gradient(135deg,#C09A52 0%,#A8783E 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:20px;color:#fff;flex-shrink:0;
  box-shadow:0 4px 12px rgba(192,154,82,0.3);
}
.dl-name{font-size:13.5px;font-weight:600;color:#fff;margin-bottom:2px;}
.dl-meta{font-size:11.5px;color:rgba(255,255,255,0.38);}
.btn-dl{
  margin-left:auto;flex-shrink:0;
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,0.07);
  border:1px solid rgba(255,255,255,0.15);
  color:rgba(255,255,255,0.75);
  border-radius:var(--r-sm);padding:8px 16px;
  font-size:12px;font-weight:600;letter-spacing:0.03em;
  cursor:pointer;text-decoration:none;transition:all 0.2s;
  white-space:nowrap;
}
.btn-dl:hover{background:#C09A52;border-color:#C09A52;color:#fff;}

/* ═══════════ WARRANTY ═══════════ */
.warranty-section{
  padding:80px 0;
  background:#F8F9FB;
  border-top:1px solid #F0F1F4;
}
.w-card{
  background:#FFFFFF;border:1px solid #E4E6EB;
  border-radius:var(--r-xl);padding:36px 32px;
  text-align:center;transition:all 0.25s;
  line-height: 27px;
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
}
.w-card::after{
  content:'';position:absolute;
  top:0;left:0;right:0;height:3px;
background:linear-gradient(90deg,#e51e23,#e51e23);
}
.w-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px);}
.w-icon{font-size:42px;color:#e51e23;margin-bottom:12px;display:block;}
.w-value{;font-size:1.3rem;font-weight:bolder;color:#e51e23;margin-bottom:4px;}
.w-label{font-size:19px;color:#e51e23; font-weight: bolder;}

/* ═══════════ REVEAL ANIMATIONS ═══════════ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity 0.55s ease,transform 0.55s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
.reveal-delay-1{transition-delay:0.1s;}
.reveal-delay-2{transition-delay:0.18s;}
.reveal-delay-3{transition-delay:0.26s;}
.reveal-delay-4{transition-delay:0.34s;}

@media(max-width:767px){
  /*.hero-slide{height:460px;}*/
  .hero-visual-wrap{display:none;}
  .trust-item{min-width:100%;border-right:none;border-bottom:1px solid #F0F1F4;}
  .trust-item:last-child{border-bottom:none;}
  .product-detail{padding:36px 0 56px;}
  .video-section,.specs-features-section,.icon-grid-section,.collateral-section,.warranty-section{padding:56px 0;}
  .hero-headline{font-size:2rem;}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}

.sa-app-sub {
  font-size: .75rem;
  color: rgba(255,255,255,.4);
  margin-top: 2px;
}

.sa-store-btns {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 1.6rem;
}

.sa-store-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  color: #111;
  border-radius: 10px;
  padding: 9px 16px;
  text-decoration: none;
  min-width: 148px;
  transition: background .2s, transform .15s;
}

.sa-store-btn:hover {
  background: #f0f0f0;
  transform: translateY(-2px);
}

.sa-store-text {
  display: flex;
  flex-direction: column;
}

.sa-store-label {
  font-size: 9px;
  color: #555;
  letter-spacing: .04em;
  text-transform: uppercase;
  line-height: 1.2;
}

.sa-store-name {
  font-size: 14px;
  font-weight: 700;
  color: #111;
  line-height: 1.2;
}

.btn-buy-now {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #e51e23; /* gold accent */
    color: #fff;
    font-weight: 600;
    padding: 12px 28px;
    border-radius: 6px;
    border: none;
    transition: background-color 0.2s ease;
}

.btn-buy-now:hover {
    background-color: #000;
    color: #fff;
}

.btn-buy-now i {
    font-size: 16px;
}


/*****product listing tabs css*****/
/* ── Series Filter Tab Bar ── */
.series-tab-bar-wrap {
  background:#393186;
  border-bottom: 1px solid #E5E7EB;
  position: sticky;
  top: 72px; /* adjust to match your navbar height */
  z-index: 90;
  margin-bottom: 16px;
  padding: 0;
}

.series-tab-bar {
  display: flex;
  align-items: center;
  gap: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.series-tab-bar::-webkit-scrollbar { display: none; }

.series-tab {
    flex-shrink: 0;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 14px 51px;
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16.5px;
    font-weight: 500;
    color: #fff;
    cursor: pointer;
    white-space: nowrap;
    transition: color .2s ease, border-color .2s ease;
    letter-spacing: 0.02em;
    margin-bottom: -1px;
}

.series-tab:hover {
  color: #ccc;
}

.series-tab.active {
    color: #393186;
    border-bottom-color: #393186;
    font-weight: 600;
    background: #dddddd;
}
/* Mobile: equal-width tabs on narrow screens */
@media (max-width: 480px) {
  .series-tab {
    flex: 1;
    text-align: center;
    padding: 13px 10px;
    font-size: 12.5px;
  }
  .a-pill {display: block; padding: 10px 11px; width: 40%;}
.a-pill img{display: block;}
}


/****About us page css****/

.em { font-style: italic; color: #e51e23; }

.eyebrow2 {

  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #e51e23;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1rem;
}
.eyebrow2::before {
  content: '';
  display: inline-block;
  width: 28px; height: 2px;
  background:#e51e23;
  border-radius: 2px;
}


/* ── RED RULE DIVIDER ── */
.red-rule {
  width: 48px; height: 3px;
  background: #e51e23;
  border-radius: 2px;
  margin: 1.1rem 0 1.8rem;
}

/* ── SECTION BASE ── */


/* ── HERO ── */
.about-hero {
  position: relative;
  min-height: 76vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #ffffff;
  border-bottom: 1px solid #d8dce6;
}
.about-hero::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 70% 80% at 100% 50%, rgba(229,30,35,.05) 0%, transparent 65%),
    radial-gradient(ellipse 40% 60% at 0% 0%, rgba(229,30,35,.04) 0%, transparent 55%);
  pointer-events: none;
}
.hero-year-tag {
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%);

  font-size: clamp(7rem, 16vw, 14rem);
  font-weight: 900;
  color: rgba(229,30,35,.05);
  line-height: 1;
  user-select: none;
  pointer-events: none;
  letter-spacing: -.04em;
}
.about-hero h1 {
  font-size: clamp(2.2rem, 5vw, 4rem);
  font-weight: 700;
  margin-bottom: 1.4rem;
  max-width: 680px;
  color:#1a1c22;
}
.about-hero .lead-text {
  font-size: 1.02rem;
  color: #3d4150;
  max-width: 560px;
  line-height: 1.82;
}
.hero-badges2 {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: 2rem;
}
.hero-badge2 {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  border: 1px solid #d8dce6;
  background: #f4f6f9;
  color: #3d4150;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .03em;
  padding: .38rem .9rem;
  border-radius: 3px;
}
.hero-badge2 i { color: #e51e23; }

/* ── STATS STRIP ── */
.legacy-strip {
  background: #e51e23;
  padding: 2.2rem 0;
}
.legacy-strip-inner { display: flex; gap: 0; }
.legacy-stat {
  flex: 1;
  text-align: center;
  padding: 1rem 0.99rem;
  border-right: 1px solid rgba(255,255,255,.2);
}
.legacy-stat:last-child { border-right: none; }
.legacy-stat .num {

  font-size: clamp(1.66rem, 4vw, 1rem);
  font-weight: 700;
  color:#ffffff;
  line-height: 1;
}
.legacy-stat .lbl {
  font-size: .75rem;
  font-weight: 500;
  color: rgba(255,255,255,.75);
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: .4rem;
}

/* ── VISION MISSION ── */
.vm-section { background:#f4f6f9; padding:5.4rem 0rem; }
.vm-card {
  background: #ffffff;
  border: 1px solid #d8dce6;
  border-radius: 6px;
  padding: 2.4rem 2rem;
  height: 100%;
  position: relative;
  overflow: hidden;
  box-shadow:0 2px 12px rgba(0,0,0,.06);
  transition: box-shadow .35s cubic-bezier(.4,0,.2,1), transform .35s cubic-bezier(.4,0,.2,1), border-color .35s cubic-bezier(.4,0,.2,1);
}
.vm-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background:#e51e23;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .5s ease;
}
.vm-card:hover::before { transform: scaleX(1); }
.vm-card:hover {
  box-shadow: 0 6px 28px rgba(0,0,0,.09);
  border-color: rgba(229,30,35,.2);
  transform: translateY(-4px);
}
.vm-icon {
  width: 48px; height: 48px;
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem;
  color: #e51e23;
  background: rgba(229,30,35,.08);
  margin-bottom: 1.4rem;
}
.vm-card h3 { font-size: 1.4rem; font-weight: 700; margin-bottom: .6rem; }
.vm-card p { font-size: .95rem; color: #3d4150; line-height: 1.82; }
/* ════════════════════════════════════════
   VISION & MISSION — split panel style
════════════════════════════════════════ */
.vm-section-v2{padding:0;}
.vm-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:480px;
}
.vm-panel{
  position:relative;
  display:flex;
  align-items:center;
  padding:3.5rem 3rem;
  overflow:hidden;
}

/* Vision — image side */
.vm-panel-img{
  background:#1a1c22;
}
.vm-img-bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transform:scale(1.02);
}
.vm-img-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgb(0 0 0 / 17%) 32%, rgb(0 0 0 / 45%) 100%);

}

/* Mission — dark gradient side */
.vm-panel-dark{
  background:linear-gradient(135deg, #1a1c22 0%, #2b2d36 100%);
}

.vm-panel-inner{
  position:relative;
  z-index:2;
  max-width:440px;
}

.vm-tag{
  display:inline-block;
  background:#e51e23;
  color:#fff;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.04em;
  padding:.45rem 1rem;
  border-radius:3px;
  margin-bottom:1.2rem;
}
.vm-tag-light{
  background:rgba(229,30,35,.18);
  color:#ff6b6f;
  border:1px solid rgba(229,30,35,.35);
}

.vm-panel-title{
  color:#fff;
  font-family:'Playfair Display',serif;
  font-weight:700;
  font-size:clamp(1.9rem,3vw,2.6rem);
  line-height:1.15;
  margin:0;
}

.vm-panel-text{
  color:#e6e7ec;
  font-size:1.05rem;
  line-height:1.85;
  margin:0;
}
.vm-panel-text strong{
  color:#fff;
}

@media (max-width:991px){
  .vm-split{grid-template-columns:1fr;}
  .vm-panel{min-height:340px;padding:3rem 1.75rem;}
}
/* ── MADE IN INDIA ── */
.mii-section { background: #ffffff; padding:5.4rem 0rem; }
.mii-img-frame {
  border: 1px solid #d8dce6;
  border-radius: 6px;
  overflow: hidden;
  aspect-ratio: 4/3;
  background: #f4f6f9;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.mii-img-frame img { width: 100%; height: 100%; object-fit: cover; }
.mii-flag-badge {
  margin-top: 1rem;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  background: rgba(229,30,35,.08);
  border: 1px solid rgba(229,30,35,.15);
  border-radius: 4px;
  padding: .55rem 1rem;
  font-size: .82rem; font-weight: 600; color: #e51e23;
}

.feature-list { list-style: none; padding: 0; margin: 1.4rem 0 0; }
.feature-list li {
  display: flex; align-items: flex-start; gap: .75rem;
  font-size: .95rem; color: #3d4150;
  padding: .7rem 0;
  border-bottom: 1px solid #d8dce6;
  line-height: 1.65;
}
.feature-list li:last-child { border-bottom: none; }
.feature-list .fli {
  width: 28px; height: 28px; min-width: 28px;
  border-radius: 50%;
  background: rgba(229,30,35,.08);
  display: flex; align-items: center; justify-content: center;
  font-size: .78rem; color: #e51e23;
  margin-top: .1rem;
}
.feature-list strong { color: #1a1c22; }

/* ── HERITAGE TIMELINE ── */
.heritage-section { background: #f4f6f9; padding:5.4rem 0rem; }
.timeline-row {
  display: grid;
  grid-template-columns: 1fr 60px 1fr;
  align-items: stretch;
}
.tl-left { text-align: right; padding: 0 1.5rem 2.8rem 0; }
.tl-right { padding: 0 0 2.8rem 1.5rem; }
.tl-spine { display: flex; flex-direction: column; align-items: center; }
.tl-dot {
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #e51e23;
  border: 3px solid #f4f6f9;
  box-shadow: 0 0 0 2px #e51e23;
  flex-shrink: 0;
  margin-top: .2rem;
}
.tl-line { width: 1px; flex: 1; background: linear-gradient(to bottom, #e51e23, #d8dce6); margin-top: .3rem; }
.tl-year { font-size: 1.6rem; font-weight: 700; color: #e51e23; line-height: 1.1; }
.tl-label { font-size: .9rem; font-weight: 700; color:#1a1c22; margin: .3rem 0 .25rem; }
.tl-desc { font-size: .86rem; color: #6b7080; line-height: 1.7; }

/* ── ENGINEERED DIFFERENCE ── */
.diff-section { background: #ffffff; padding:5.4rem 0rem; }
.feat-tile {
  background: #f4f6f9;
  border: 1px solid v#d8dce6;
  border-radius: 6px;
  padding: 1.6rem;
  text-align: center;
  transition: border-color .35s cubic-bezier(.4,0,.2,1), box-shadow .35s cubic-bezier(.4,0,.2,1);
}
.feat-tile:hover { border-color: rgba(229,30,35,.25); box-shadow:0 2px 12px rgba(0,0,0,.06); }
.feat-tile i { font-size: 2rem; color: #e51e23; display: block; margin-bottom: .6rem; }
.feat-tile .ft-label { font-size: .84rem; font-weight: 600; color: #3d4150; }

/* ── WARRANTY ── */
.warranty-section2 { background:#f4f6f9; padding: 5.4rem 0rem;}
.warranty-card2 {
  background: #ffffff;
  border: 1px solid #d8dce6;
  border-radius: 6px;
  padding: 2.2rem 1.8rem;
  text-align: center;
  height: 100%;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  transition: border-color .35s cubic-bezier(.4,0,.2,1), box-shadow .35s cubic-bezier(.4,0,.2,1), transform .35s cubic-bezier(.4,0,.2,1);
}
.warranty-card2:hover {
  border-color: rgba(229,30,35,.25);
  box-shadow:0 6px 28px rgba(0,0,0,.09);
  transform: translateY(-3px);
}
.warranty-card2 .wi { font-size: 2rem; color: #e51e23; margin-bottom: 1rem; }
.warranty-card2 .wnum {  font-size: 3.4rem; font-weight: 900; color: #e51e23; line-height: 1; }
.warranty-card2 .wyears { font-size: .78rem; font-weight: 600; color: #6b7080; letter-spacing: .1em; text-transform: uppercase; display: block; margin-bottom: .8rem; }
.warranty-card2 .wtype { font-size: 1.15rem; font-weight: 600; color: #1a1c22; }
.warranty-card2 .wdesc { font-size: .86rem; color: #6b7080; margin-top: .5rem; line-height: 1.65; }

/* ── PROMISE SECTION ── */
.promise-section { background: #e51e23; padding: 5.4rem 0rem;}
.promise-box {
  text-align: center;
  position: relative;
  padding: 3rem 2rem;
}
.promise-box::before {
  content: '"';
  position: absolute;
  top: -1rem; left: 1rem;
 
  font-size: 9rem;
  color: rgba(255,255,255,.1);
  line-height: 1;
  pointer-events: none;
}
.promise-box blockquote {

  font-size: clamp(1.2rem, 2.5vw, 1.65rem);
  font-weight: 400;
  font-style: italic;
  color:#ffffff;
  line-height: 1.65;
  max-width: 740px;
  margin: 0 auto 1.2rem;
}
.promise-box cite {
  font-style: normal;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
}

/* ── CTA STRIP ── */
.cta-strip {
  background:#ffffff;
  border-top: 1px solid #d8dce6;
  padding: 3.5rem 0;
}



/* ── RESPONSIVE ── */
@media (max-width: 991px) {
  .timeline-row { grid-template-columns: 1fr; }
  .tl-left { text-align: left; padding: 0 0 .4rem 1.2rem; border-left: 2px solid #d8dce6; }
  .tl-right { padding: 0 0 2rem 1.2rem; border-left: 2px solid #d8dce6; }
  .tl-spine { display: none; }
  .legacy-strip-inner { flex-wrap: wrap; }
  .legacy-stat { flex: 0 0 50%; border-right: none; border-bottom: 1px solid rgba(255,255,255,.15); }
  .legacy-stat:last-child { border-bottom: none; }
}
@media (max-width: 767px) {

  .promise-box { padding: 2.2rem 1rem; }
}


/*****Contact us page css*****/

/* ================= INTERACTIVE HERO ================= */
.ihero{
  position:relative;
  min-height:72vh;
  background:linear-gradient(160deg,#161B33 0%,#1F2748 100%);
  overflow:hidden;
  display:flex;
  align-items:center;
  isolation:isolate;
}
.ihero::before{
  content:'';
  position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:26px 26px;
  z-index:0;
}
.ihero-glow{
  position:absolute;
  width:520px;height:520px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(201,168,108,.22), transparent 70%);
  top:20%;left:60%;
  transform:translate(-50%,-50%);
  transition:left .35s ease-out, top .35s ease-out;
  pointer-events:none;
  z-index:0;
}
.iblob{
  position:absolute;border-radius:50%;filter:blur(2px);opacity:.5;z-index:0;
  animation:floatY 7s ease-in-out infinite;
}
.iblob.b1{width:14px;height:14px;background:#C9A86C;top:18%;left:8%;animation-duration:6s;}
.iblob.b2{width:9px;height:9px;background:#D0021B;top:65%;left:18%;animation-duration:8s;animation-delay:1s;}
.iblob.b3{width:11px;height:11px;background:#fff;top:30%;left:88%;animation-duration:7s;animation-delay:.5s;}
.iblob.b4{width:7px;height:7px;background:#C9A86C;top:78%;left:80%;animation-duration:9s;animation-delay:1.4s;}
.iblob.b5{width:13px;height:13px;background:#fff;opacity:.25;top:50%;left:50%;animation-duration:10s;animation-delay:.8s;}
@keyframes floatY{0%,100%{transform:translateY(0) translateX(0);}50%{transform:translateY(-22px) translateX(8px);}}

.ihero-content{position:relative;z-index:2;width:100%;}
.hero-eyebrow2{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;
  color:#e51e23;font-weight:700;
  border:1px solid rgba(201,168,108,.4);
  padding:.35rem .9rem;border-radius:50px;
  background:#fff;
  opacity:0;transform:translateY(14px);animation:fadeUp .6s ease forwards;
}
.ihero h1{
  color:#fff;font-weight:700;font-size:clamp(2rem,4.2vw,3rem);
  line-height:1.22;margin:1.3rem 0 1rem;max-width:780px;
  opacity:0;transform:translateY(14px);animation:fadeUp .6s ease .12s forwards;
}
.ihero h1 .accent{color:#e31e24;}
.ihero .lead-sub{
  color:rgba(255,255,255,.62);font-size:1.02rem;max-width:540px;margin-bottom:2.2rem;
  opacity:0;transform:translateY(14px);animation:fadeUp .6s ease .22s forwards;
}
@keyframes fadeUp{to{opacity:1;transform:translateY(0);}}

.quick-actions{
  display:flex;flex-wrap:wrap;gap:.8rem;
  opacity:0;transform:translateY(14px);animation:fadeUp .6s ease .32s forwards;
}
.qa-chip{
  display:inline-flex;align-items:center;gap:.6rem;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);
  border-radius:50px;padding:.7rem 1.3rem .7rem .7rem;
  color:#fff;text-decoration:none;font-weight:600;font-size:.86rem;
  backdrop-filter:blur(6px);transition:.3s ease;
}
.qa-chip .qa-ic {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #fff;
    color: #e51e23;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    flex: none;
    transition: .3s ease;
}
.qa-chip:hover{background:#fff;color:#1A1D29;transform:translateY(-3px);box-shadow:0 14px 28px -10px rgba(0,0,0,.35);}
.qa-chip:hover .qa-ic{background:#D0021B;color:#fff;}

.status-pill{
  position:absolute;bottom:2.2rem;right:2.2rem;
  display:flex;align-items:center;gap:.6rem;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);
  border-radius:50px;padding:.55rem 1.1rem;color:#fff;font-size:.82rem;font-weight:600;
  z-index:3;backdrop-filter:blur(6px);
}
.status-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;animation:pulseDot 1.8s infinite;}
@keyframes pulseDot{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55);}70%{box-shadow:0 0 0 8px rgba(34,197,94,0);}100%{box-shadow:0 0 0 0 rgba(34,197,94,0);}}
@media (max-width:767px){
  .status-pill{position:static;margin-top:1.6rem;display:inline-flex;}
  .ihero{min-height:auto;padding:4.5rem 0 3rem;}
}


/* ============ CONTACT DETAILS + GET IN TOUCH — SPLIT LAYOUT ============ */
.contact-split{
  display:grid;
  grid-template-columns: 0.88fr 1.12fr;
  gap:1.75rem;
  align-items:stretch;
  margin-top:.5rem;
}
@media (max-width:991px){
  .contact-split{grid-template-columns:1fr;}
}

/* ---- LEFT: Contact Details card ---- */
.cd-card{
  background:linear-gradient(180deg,#101c30,#0b1424);
  border:1px solid rgba(255,255,255,.07);
  border-radius:22px;
  padding:2.5rem 2.25rem;
  box-shadow:0 25px 60px -30px rgba(0,0,0,.65);
  height:100%;
}
.cd-card h3{
  color:#fff;
  font-family:'Playfair Display',serif;
  font-weight:700;
  font-size:1.55rem;
  margin-bottom:1.85rem;
}
.cd-row{
  display:flex;
  gap:1rem;
  align-items:flex-start;
}
.cd-ic{
  flex:0 0 42px;
  width:42px;height:42px;
  border-radius:11px;
  background:#fff;
  color:#e51e23;
  display:flex;align-items:center;justify-content:center;
  font-size:1.02rem;
}
.cd-row .cd-body h4{
  color:#fff;
  font-size:.98rem;
  font-weight:600;
  margin-bottom:.35rem;
  font-family:'Instrument Sans',sans-serif;
}
.cd-row .cd-body p{
  color:#98a3b8;
  font-size:.87rem;
  line-height:1.55;
  margin-bottom:.15rem;
}
.cd-row .cd-body p a{
  color:#c7cedb;
  text-decoration:none;
}
.cd-row .cd-body p a:hover{color:#d6a342;}
.cd-sub{color:#6f7c92 !important; font-size:.8rem !important;}
.cd-maps-link{
  display:inline-flex;align-items:center;gap:.4rem;
  color:#b7b6b4;font-size:.85rem;font-weight:600;text-decoration:none;
}
.cd-maps-link:hover{text-decoration:underline;}
.cd-maps-link i{font-size:.68rem;}
.cd-divider{
  height:1px;
  background:rgba(255,255,255,.08);
  margin:1.35rem 0;
}

/* ---- RIGHT: Get in touch card (light) ---- */
.gt-card{
  background:#f4f4f6;
  border:1px solid rgba(15,23,42,.06);
  border-radius:22px;
  padding:2.5rem 2.25rem;
  display:flex;
  flex-direction:column;
  gap:1.6rem;
  height:100%;
  box-shadow:0 25px 60px -35px rgba(15,23,42,.25);
}
.gt-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.gt-header-left h3{
  color:#181c24;font-family:'Playfair Display',serif;font-weight:700;font-size:1.55rem;margin-bottom:.4rem;
}
.gt-header-left p{color:#6b7280;font-size:.88rem;max-width:340px;margin:0;}
.gt-hours-pill{
  display:inline-flex;align-items:center;gap:.5rem;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  color:#e51e23;
  padding:.55rem 1rem;
  border-radius:100px;
  font-size:.8rem;font-weight:600;
  white-space:nowrap;
  box-shadow:0 6px 14px -8px rgba(15,23,42,.12);
}
.gt-hours-pill i{color:#e51e23;}

.gt-list{display:flex;flex-direction:column;gap:.85rem;flex:1;}
.gt-item{
  display:flex;align-items:center;gap:1rem;
  background:#fff;
  border:1px solid rgba(15,23,42,.06);
  border-radius:16px;
  padding:1.1rem 1.3rem;
  text-decoration:none;
  transition:.25s ease;
  box-shadow:0 8px 20px -16px rgba(15,23,42,.35);
}
.gt-item:hover{
  background:#fffaf1;
  border-color:rgba(201,154,61,.35);
  box-shadow:0 14px 28px -18px #e51e23;
  transform:translateX(4px);
}
.gt-item-ic{
  flex:0 0 46px;width:46px;height:46px;border-radius:12px;
  background:rgba(201,154,61,.12);color:#e51e23;
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;
}
.gt-item-txt{flex:1;}
.gt-item-txt h5{color:#181c24;font-size:.95rem;font-weight:600;margin:0 0 .2rem;font-family:'Instrument Sans',sans-serif;}
.gt-item-txt span{color:#8a8f9a;font-size:.8rem;}
.gt-item-arrow{color:#c7cad1;transition:.25s ease;font-size:.85rem;}
.gt-item:hover .gt-item-arrow{color:#b3822f;transform:translateX(3px);}

@media (max-width:576px){
  .cd-card,.gt-card{padding:1.9rem 1.5rem;}
  .gt-header{flex-direction:column;align-items:flex-start;}
}

/* ================= BENTO GRID ================= */
.bento-wrap{padding:5rem 0 6rem;}
.bento-eyebrow{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:#D0021B;font-weight:700;margin-bottom:.5rem;display:block;text-align:center;
}
.bento-title{
  font-weight:700;font-size:clamp(1.6rem,3vw,2.2rem);text-align:center;
  max-width:560px;margin:0 auto 3.2rem;
}

/* Make Head Office cell span full width, on its own row */
.bento-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* adjust to match your existing column count */
  gap: 1.5rem;
}

.bcell.office {
  grid-column: 1 / -1;   /* span full width of the grid */
  grid-row: 1;           /* pin it to the first row */

  /* since it's now full-width, let its internal content lay out horizontally */
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
    background:#161B33;
  flex-wrap: wrap;
}

.bcell.office > div {
  flex: 1;
  min-width: 280px;
}

/* Everything else automatically flows into subsequent rows since 
   .office now occupies the entire first row */
@media (max-width:991px){
  .bento-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:575px){
  .bento-grid{grid-template-columns:1fr;}
}

.bcell{
  border-radius:18px;
  padding:1.7rem;
  position:relative;
  overflow:hidden;
  transition:.3s ease;
}

/* big head office card - spans 2 cols 2 rows */

.bcell.office::after{
  content:'';position:absolute;
  width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle, rgba(201,168,108,.18), transparent 70%);
  top:-100px;right:-100px;
}
@media (max-width:991px){.bcell.office{grid-column:span 2;grid-row:span 1;}}
@media (max-width:575px){.bcell.office{grid-column:span 1;}}

.bcell .b-ic{
  width:46px;height:46px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;font-size:1.05rem;margin-bottom:1rem;
}
.bcell.office .b-ic {
    background: #fff;
    color: #D0021B;
}

.bcell.office h3{font-weight:700;font-size:1.2rem;margin-bottom:.5rem;position:relative;z-index:1;}
.bcell.office .addr{color:rgba(255,255,255,.55);font-size:.9rem;line-height:1.7;margin-bottom:1.4rem;position:relative;z-index:1;}
.bcell.office .ol-line{
  display:flex;gap:.6rem;align-items:flex-start;font-size:.85rem;
  color:#f9f9f9;
  margin-bottom:.5rem;position:relative;z-index:1;
}
.bcell.office .ol-line i{color:#f9f9f9;width:16px;text-align:center;margin-top:.18rem;font-size:.8rem;}
.bcell.office .ol-line a{color:inherit;text-decoration:none;}
.bcell.office .ol-line a:hover{color:#C9A86C;}
.maps-link{
  display:inline-flex;align-items:center;gap:.5rem;
  color:#f9f9f9;font-weight:700;font-size:.85rem;text-decoration:none;
  margin-top:.6rem;position:relative;z-index:1;
}
.maps-link:hover{color:#fff;}

/* toll-free card */
.bcell.tollfree{
  grid-column:span 1;grid-row:span 1;
  background:#F6F4EF;
  border:1px solid #E7E3D8;
}
.bcell.tollfree .b-ic{background:#fff;color:#D0021B;}
.bcell.tollfree h4{font-weight:700;font-size:.95rem;margin-bottom:.4rem;}
.bcell.tollfree p{font-size:.8rem;color:#6B7280;margin-bottom:.6rem;}
.tollfree-num{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.15rem;color:#1A1D29;}

/* missed call card */
.bcell.callback{
  grid-column:span 1;grid-row:span 1;
  background:#fff;border:1px solid #E7E3D8;
}
.bcell.callback .b-ic{background:#F6F4EF;color:#D0021B;}
.bcell.callback h4{font-weight:700;font-size:.95rem;margin-bottom:.4rem;}
.bcell.callback p{font-size:.8rem;color:#6B7280;margin-bottom:.6rem;}
.note-pill{
  display:inline-flex;align-items:center;gap:.4rem;background:#F6F4EF;
  border-radius:50px;padding:.3rem .8rem;font-size:.72rem;font-weight:600;color:#1A1D29;margin-top:.4rem;
}
.note-pill i{color:#D0021B;font-size:.68rem;}

/* email card */
.bcell.email{
  grid-column:span 1;grid-row:span 1;
  background:#D0021B;color:#fff;
}
.bcell.email .b-ic{background:rgba(255,255,255,.18);color:#fff;}
.bcell.email h4{font-weight:700;font-size:.95rem;margin-bottom:.6rem;}
.bcell.email a{
  display:block;color:#fff;text-decoration:none;font-size:.82rem;
  opacity:.92;margin-bottom:.3rem;border-bottom:1px solid rgba(255,255,255,.25);
  padding-bottom:.3rem;width:fit-content;
}
.bcell.email a:hover{opacity:1;border-color:#fff;}

/* hours card */
.bcell.hours{
  grid-column:span 1;grid-row:span 1;
  background:#fff;border:1px solid #E7E3D8;
  text-align:center;justify-content:center;align-items:center;display:flex;flex-direction:column;
}
.bcell.hours .b-ic{background:#F6F4EF;color:#161B33;margin-bottom:.7rem;}
.bcell.hours .hr-val{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.1rem;}
.bcell.hours .hr-lbl{font-size:.76rem;color:#6B7280;margin-top:.2rem;}

/* get in touch wide card — now full width */
.bcell.touch{
  grid-column:span 4;grid-row:span 1;
  background:linear-gradient(135deg,#fff 0%,#F6F4EF 100%);
  border:1px solid #E7E3D8;
  display:flex;
  gap:1.4rem;
  padding:1.6rem 1.8rem;
}
@media (max-width:991px){
  .bcell.touch{grid-column:span 2;}
}
@media (max-width:575px){
  .bcell.touch{grid-column:span 1;flex-direction:column;}
}
.touch-head{
  flex:0 0 26%;
  display:flex;flex-direction:column;justify-content:center;
}
@media (max-width:991px){.touch-head{flex:0 0 38%;}}
.touch-head .b-ic{
  background:#D0021B;color:#fff;margin-bottom:.8rem;
}
.touch-head h4{font-weight:700;font-size:1rem;margin-bottom:.4rem;line-height:1.35;}
.touch-head p{font-size:.78rem;color:#6B7280;margin-bottom:0;}

.touch-row{
  flex:1;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.7rem;
  align-content:center;
}
@media (max-width:991px){.touch-row{grid-template-columns:1fr 1fr;}}
@media (max-width:575px){.touch-row{grid-template-columns:1fr;}}

.touch-pill{
  position:relative;
  display:flex;align-items:center;gap:.7rem;
  background:#fff;border:1px solid #E7E3D8;border-radius:12px;
  padding:.7rem .9rem;font-weight:600;font-size:.8rem;color:#1A1D29;
  text-decoration:none;transition:.25s;
  overflow:hidden;
}
.touch-pill .tp-ic{
  width:32px;height:32px;border-radius:9px;background:#F6F4EF;
  color:#D0021B;
  display:flex;align-items:center;justify-content:center;font-size:.82rem;flex:none;
  transition:.25s;
}
.touch-pill .tp-arrow{
  margin-left:auto;font-size:.7rem;color:#6B7280;
  transition:.25s;
}
.touch-pill::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:#D0021B;transform:scaleY(0);transition:.25s;
}
.touch-pill:hover{
  border-color:transparent;
  box-shadow:0 12px 26px -14px rgba(22,27,51,.25);
  transform:translateY(-2px);
  color:#1A1D29;
}
.touch-pill:hover::before{transform:scaleY(1);}
.touch-pill:hover .tp-ic{background:#D0021B;color:#fff;}
.touch-pill:hover .tp-arrow{color:#D0021B;transform:translateX(2px);}

/* ====== ENQUIRY MODAL ====== */
.enquiry-modal .modal-content{
  border:none;border-radius:20px;overflow:hidden;
}
.enquiry-modal .modal-header{
  background:linear-gradient(135deg,#161B33,#1F2748);
  border:none;padding:1.6rem 1.8rem;position:relative;
}
.enquiry-modal .modal-header::after{
  content:'';position:absolute;width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle, rgba(201,168,108,.2), transparent 70%);
  top:-90px;right:-60px;
}
.enquiry-modal .modal-title{
  color:#fff;font-weight:700;font-size:1.15rem;
  position:relative;z-index:1;
}
.enquiry-modal .modal-subtitle{
  color:rgba(255,255,255,.55);font-size:.82rem;margin-top:.25rem;position:relative;z-index:1;
}
.enquiry-modal .btn-close{filter:invert(1);position:relative;z-index:1;}
.enquiry-modal .modal-body{padding:1.8rem;}
.enquiry-modal .form-label{
  font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#1A1D29;
}
.enquiry-modal .form-control,.enquiry-modal .form-select{
  border:1.5px solid #E7E3D8;border-radius:10px;padding:.65rem .9rem;font-size:.9rem;
}
.enquiry-modal .form-control:focus,.enquiry-modal .form-select:focus{
  border-color:#C9A86C;box-shadow:0 0 0 .2rem rgba(201,168,108,.18);
}
.btn-submit-enquiry{
  background:linear-gradient(135deg,#D0021B,#A8010F);
  border:none;color:#fff;font-weight:700;border-radius:10px;
  padding:.75rem 1.4rem;font-size:.9rem;transition:.25s;width:100%;
}
.btn-submit-enquiry:hover{
  box-shadow:0 14px 28px -10px rgba(208,2,27,.5);transform:translateY(-2px);color:#fff;
}
.success-check{
  width:64px;height:64px;border-radius:50%;background:#dcfce7;color:#16a34a;
  display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin:0 auto 1rem;
}

/* map card wide */
.bcell.mapcell{
  grid-column:span 4;grid-row:span 1;
  padding:0;border:1px solid #E7E3D8;
  min-height:240px;
}
@media (max-width:991px){.bcell.mapcell{grid-column:span 2;}}
@media (max-width:575px){.bcell.mapcell{grid-column:span 1;}}
.bcell.mapcell iframe{width:100%;height:100%;min-height:240px;border:0;display:block;}

.bcell:hover{transform:translateY(-3px);box-shadow:0 18px 38px -20px rgba(22,27,51,.22);}
.bcell.office:hover, .bcell.email:hover, .bcell.mapcell:hover{box-shadow:0 18px 38px -20px rgba(22,27,51,.35);}


/*****Service page CSS*****/

  .btn-gold-s{
    background:linear-gradient(135deg,#e51e23,#e51e23);
    color:#fff;
    border:none;
  }
  .btn-gold-s:hover{color:#ccc;filter:brightness(1.05);transform:translateY(-1px);}
  .btn-outline-line{
    border:1.5px solid rgba(255,255,255,.45);
    color:#fff;
    background:transparent;
  }
  .btn-outline-line:hover{background:rgba(255,255,255,.08);color:#fff;border-color:#fff;}

  .eyebrown{
    text-transform:uppercase;
    font-size:.76rem;
    letter-spacing:.18em;
    font-weight:700;
    color:#e51e23;
  }
  .eyebrown.dark{color:#0d1b2a;}

  /* ================= Top assurance strip ================= */
  .assure-strip{
    background:#fff;
    padding-top:0;
    padding-bottom:3.2rem;
  }
  .assure-overlap{
    position:relative;
    z-index:5;
    margin-top:-92px;
  }
  .assure-card{
    background:#0d1b2a;
    border-radius:14px;
    padding:1.6rem 1.2rem 1.4rem;
    height:100%;
    color:#fff;
    position:relative;
    overflow:visible;
    text-align:center;
  }
  .assure-icon{
    width:58px;height:58px;
    border-radius:50%;
    background:#fff;
    color:#0d1b2a;
    display:flex;align-items:center;justify-content:center;
    font-size:1.5rem;
    margin:0 auto 1rem;
    border:2px solid #c9a86c;
    box-shadow:0 6px 16px rgba(0,0,0,.18);
  }
  .assure-card h3{
    font-size:1.02rem;
    margin-bottom:.25rem;
    color:#fff;
  }
  .assure-card p{
    font-size:.83rem;
    margin:0;
    color:rgba(255,255,255,.75);
  }
  .assure-card small{
    display:block;
    font-size:.72rem;
    color:#e6cd97;
    margin-top:.35rem;
  }

  /* ================= Hero ================= */
  .hero-service{
    background:radial-gradient(120% 140% at 85% 0%, #132437 0%, #0d1b2a 55%, #081220 100%);
    color:#fff;
    padding:5.5rem 0 8rem;
    position:relative;
    overflow:hidden;
  }
  .hero-service::before{
    content:"";
    position:absolute;
    right:-120px;top:-120px;
    width:420px;height:420px;
    border:1px solid rgba(201,168,108,.18);
    border-radius:50%;
  }
  .hero-service::after{
    content:"";
    position:absolute;
    right:-40px;top:60px;
    width:260px;height:260px;
    border:1px solid rgba(201,168,108,.15);
    border-radius:50%;
  }
  .hero-service h1{
    font-size:clamp(2.1rem, 4vw, 3.1rem);
    font-weight:700;
    line-height:1.15;
  }
  .hero-service .gold-underline{
    display:inline-block;
    height:4px;width:76px;
    background:linear-gradient(90deg,#e51e23,#e51e23);
    border-radius:4px;
    margin:1.1rem 0 1.4rem;
  }
  .hero-service p.lead{
    color:rgba(255,255,255,.82);
    font-size:1.08rem;
    max-width:640px;
  }

  .hero-badge-row{
    display:flex;
    gap:1.4rem;
    margin-top:2.4rem;
    flex-wrap:wrap;
  }
  .hero-badge-s{
    display:flex;
    align-items:center;
    gap:.6rem;
    color:rgba(255,255,255,.85);
    font-size:.85rem;
    font-weight:600;
  }
  .hero-badge-s i{color:#e51e23;font-size:1.1rem;}

  /* ================= Section headings ================= */
  .section-title-s{
    font-weight:700;
    font-size:clamp(1.6rem,2.6vw,2.2rem);
    color:#0d1b2a;
  }
  .section-sub{
    color:#5b6472;
    max-width:640px;
  }
.hero-contact-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(230,205,151,.25);
  border-radius:16px;
  padding:1.75rem;
  backdrop-filter:blur(6px);
  height:100%;
}
.hcc-head{
  display:flex;align-items:center;gap:.9rem;
  margin-bottom:1.4rem;padding-bottom:1.2rem;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.hcc-icon{
  width:46px;height:46px;flex:0 0 46px;border-radius:50%;
  background:#fff;color:#e51e23;
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;
}
.hcc-head h3{color:#fff;font-size:1.05rem;margin:0;font-weight:600;}
.hcc-head p{color:rgba(255,255,255,.55);font-size:.82rem;margin:.15rem 0 0;}
.hcc-row{margin-bottom:1rem;}
.hcc-row-top{
  display:flex;align-items:center;gap:.5rem;color:#e1cfcf;
  font-size:.78rem;letter-spacing:.03em;text-transform:uppercase;margin-bottom:.4rem;
}
.hcc-row-top i{font-size:.85rem;}
.hcc-number{
  display:block;color:#fff;font-size:1.15rem;font-weight:600;
  text-decoration:none;letter-spacing:.02em;
  transition:color .2s ease;
}
.hcc-number:hover{color:#e6cd97;}
.hcc-meta{display:block;color:rgba(255,255,255,.5);font-size:.8rem;margin-top:.2rem;}
.hcc-divider{position:relative;text-align:center;margin:1.2rem 0;}
.hcc-divider::before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:rgba(255,255,255,.1);}
.hcc-divider span{position:relative;background:#0d1b2a;padding:0 .8rem;color:rgba(255,255,255,.45);font-size:.75rem;font-style:italic;}
.hcc-email{
  display:flex;align-items:center;gap:.5rem;margin-top:.4rem;padding-top:1rem;
  border-top:1px solid rgba(255,255,255,.1);color:#fff;font-size:.9rem;font-weight:500;
  text-decoration:none;transition:color .2s ease;
}
.hcc-email i{color:#e51e23;}
.hcc-email:hover{color:#d95e61;}

@media (max-width:991.98px){
  .hero-contact-card{margin-top:2rem;}
}
  /* ================= Coverage / signature diagram ================= */
  .coverage-section{padding:5rem 0;background:#fff;}

  .ring-stage{
    position:relative;
    max-width:400px;
    margin:0 auto;
    padding:1.6rem;
    border-radius:24px;
    background:radial-gradient(circle at 50% 42%, #fbf8f2 0%, #f6f5f2 55%, #f6f5f2 100%);
    border:1px solid #e4e1da;
  }
  .ring-stage::before{
    content:"";
    position:absolute;
    inset:14px;
    border:1px dashed rgba(201,168,108,.35);
    border-radius:50%;
    pointer-events:none;
  }

  .ring-wrap{
    position:relative;
    width:100%;
    aspect-ratio:1/1;
    filter:drop-shadow(0 10px 22px rgba(13,27,42,.10));
  }
  .ring-wrap svg{width:100%;height:100%;display:block;}

  .ring-center-label{
    position:absolute;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    text-align:center;
    width:158px;
  }
  .ring-center-label .num{
    font-family:'Sora',sans-serif;
    font-weight:800;
    font-size:2.6rem;
    letter-spacing:-0.02em;
    line-height:1;
    background:linear-gradient(135deg,#0d1b2a 35%,#c9a86c 130%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .ring-center-label .rule{
    width:34px;height:2px;
    background:#c9a86c;
    margin:.5rem auto .5rem;
    border-radius:2px;
  }
  .ring-center-label .cap{
    font-family:'Sora',sans-serif;
    font-size:.72rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#7a828d;
    font-weight:700;
  }

  .coverage-legend{
    display:flex;
    gap:.7rem;
    justify-content:center;
    margin-top:1.8rem;
    flex-wrap:wrap;
  }
  .legend-dot{
    display:inline-flex;align-items:center;gap:.5rem;
    font-family:'Sora',sans-serif;
    font-size:.8rem;font-weight:600;color:#1c2530;
    background:#fff;
    border:1px solid #e4e1da;
    padding:.42rem .9rem;
    border-radius:999px;
    box-shadow:0 3px 10px rgba(13,27,42,.05);
  }
  .legend-dot span.sw{
    width:10px;height:10px;border-radius:50%;display:inline-block;
    box-shadow:0 0 0 3px rgba(0,0,0,.04);
  }
  .ring-footnote{
    text-align:center;
    font-size:.76rem;
    color:#9aa0a8;
    margin-top:.9rem;
    font-style:italic;
  }

  .coverage-card{
    border:1px solid #e4e1da;
    border-radius:14px;
    padding:1.6rem 1.5rem;
    height:100%;
    background:#f6f5f2;
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .coverage-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(13,27,42,.08);}
  .coverage-card .yr{
    font-family:'Sora',sans-serif;
    font-weight:800;
    font-size:2.1rem;
    line-height:1;
  }
  .coverage-card.electronic .yr{color:#0d1b2a;}
  .coverage-card.mechanical .yr{color:#e51e23;}
  .coverage-card .yr-cap{
    font-size:.8rem;
    text-transform:uppercase;
    letter-spacing:.06em;
    font-weight:700;
    color:#8a8f97;
  }
  .coverage-card h4{font-size:1.05rem;margin:.6rem 0 .4rem;}
  .coverage-card p{font-size:.9rem;color:#5b6472;margin-bottom:0;}
  .coverage-note{
    border-left:3px solid #c9a86c;
    padding:.9rem 1.1rem;
    background:#fbf8f2;
    border-radius:0 8px 8px 0;
    font-size:.92rem;
    color:#4c4634;
  }

  /* ================= What this means ================= */
  .means-section{
    padding:5rem 0;
    background:#0d1b2a;
    color:#fff;
    position:relative;
  }
  .means-card{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.1);
    border-radius:14px;
    padding:1.7rem 1.4rem;
    height:100%;
  }
  .means-check{
    width:42px;height:42px;
    border-radius:50%;
    background:linear-gradient(135deg, #e51e23, #e51e23);
    color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:1.1rem;
    margin-bottom:1rem;
  }
  .means-card h4{font-size:1rem;color:#fff;margin-bottom:.4rem;}
  .means-card p{font-size:.87rem;color:rgba(255,255,255,.65);margin:0;}

  /* ================= Customer delight ================= */
  .delight-section{padding:5rem 0;background:#fff;}
  .delight-badge{
    width:190px;
    margin:0 auto 1.4rem;
    display:block;
  }
  .delight-badge svg{width:100%;height:auto;}
  .delight-text h3{
    font-size:1.4rem;
    color:#0d1b2a;
    font-weight:700;
  }
  .delight-text .accent{color:#e51e23;}
  .delight-list{list-style:none;padding:0;margin:0;}
  .delight-list li{
    display:flex;
    gap:.75rem;
    padding:.7rem 0;
    border-bottom:1px dashed #e4e1da;
    font-size:.95rem;
  }
  .delight-list li:last-child{border-bottom:none;}
  .delight-list i{color:#e51e23;font-size:1rem;margin-top:.15rem;}

  /* ================= Promise / CTA ================= */
  .promise-section-s{
    padding:4.5rem 0;
    background:linear-gradient(120deg,#132437,#0d1b2a 60%,#081220);
    color:#fff;
    text-align:center;
  }
  .promise-section-s h2{
    font-size:clamp(1.5rem,3vw,2.1rem);
    font-weight:700;
  }
  .promise-section-s p{
    color:rgba(255,255,255,.8);
    max-width:640px;
    margin:0 auto 1.8rem;
  }
  .promise-tag{
    font-family:'Sora',sans-serif;
    color:#FFF8F0;
    font-weight:700;
    letter-spacing:.04em;
    margin-top:1.6rem;
    font-size:1.05rem;
  }

  @media (max-width:767.98px){
    .hero-service{padding:3.6rem 0 4.6rem;text-align:left;}
    .assure-overlap{margin-top:-56px;}
    .assure-card{padding:1.3rem 1rem 1.1rem;}
    .assure-card h3{font-size:.92rem;}
    .assure-strip{padding-bottom:2.2rem;}
    .coverage-section,.means-section,.delight-section{padding:3.2rem 0;}
    .promise-section-s{padding:3.2rem 0;}
  }

/*****Downloads page css******/
 .downloads-section{
  
    padding:5rem 0 3rem;
    background:#fbfaf7;
  }

  .downloads-header{ max-width:720px; margin:0 auto 3rem; text-align:center; }
  .downloads-header .eyebrow{
    font-family:'Bebas Neue',sans-serif;
    letter-spacing:.28em;
    font-size:.85rem;
    color:#C9A86C;
    text-transform:uppercase;
    display:block;
    margin-bottom:.6rem;
  }
  .downloads-header h2{
    font-weight:700;
    font-size:clamp(1.9rem,3.4vw,2.7rem);
    color:#182234;
    margin-bottom:.7rem;
  }
  .downloads-header p{
    color:#5b6270;
    font-size:1.02rem;
    margin:0 auto;
  }

  /* ---- Catalogue cards (top, 2-up) ---- */
  .dl-catalogue-row{ max-width:940px; margin:0 auto; }

  .dl-card-d{
    position:relative;
    display:flex;
    gap:1.1rem;
    align-items:flex-start;
    background:#fff;
    border:1px solid rgba(24,34,52,.10);
    border-radius:16px;
    padding:1.9rem 1.7rem;
    height:100%;
    box-shadow:0 4px 18px rgba(24,34,52,.05);
    transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
    overflow:hidden;
  }
  .dl-card-d::before{
    content:'';
    position:absolute; inset:0 auto 0 0;
    width:4px;
    background:linear-gradient(180deg,#C9A86C,#D0021B);
    opacity:0;
    transition:opacity .35s ease;
  }
  .dl-card-d:hover{
    transform:translateY(-6px);
    box-shadow:0 16px 34px rgba(24,34,52,.13);
    border-color:transparent;
  }
  .dl-card-d:hover::before{ opacity:1; }

  .dl-icon-d{
    position:relative;
    flex:0 0 auto;
    /*width:58px; height:58px;*/
    border-radius:14px;
    background:linear-gradient(135deg,#182234,#0e1420);
    display:flex; align-items:center; justify-content:center;
    color:#E7D6AE;
    font-size:1.5rem;
  }
  .dl-icon-d .dl-badge{
    position:absolute;
    bottom:-8px; right:-10px;
    background:#D0021B;
    color:#fff;
    font-family:'Instrument Sans',sans-serif;
    font-weight:700;
    font-size:.58rem;
    letter-spacing:.05em;
    padding:.18rem .4rem;
    border-radius:5px;
    line-height:1;
  }

  .dl-body{ flex:1 1 auto; }
  .dl-body h3{

    font-weight:700;
    font-size:1.18rem;
    color:#182234;
    margin-bottom:.5rem;
  }
  .dl-meta-d{
    display:flex; flex-wrap:wrap; gap:.9rem;
    font-family:'Instrument Sans',sans-serif;
    font-size:.8rem;
    color:#8a8f99;
    margin-bottom:1.1rem;
  }
  .dl-meta-d i{ color:#C9A86C; margin-right:.3rem; }

  .dl-btn{
    display:inline-flex; align-items:center; gap:.55rem;
    font-family:'Instrument Sans',sans-serif;
    font-weight:600;
    font-size:.86rem;
    color:#182234;
    text-decoration:none;
    background:transparent;
    border:1.5px solid #182234;
    padding:.55rem 1.2rem;
    border-radius:40px;
    transition:all .3s ease;
  }
  .dl-btn i{ font-size:.75rem; transition:transform .3s ease; }
  .dl-btn:hover{
    background:#182234;
    color:#fff;
  }
  .dl-btn:hover i{ transform:translateY(2px); }

  /* ============================================================
     MANUALS LIBRARY (tabbed)
  ============================================================ */
  .manuals-section{
    background:#182234;
    background:linear-gradient(180deg,#182234 0%, #0e1420 100%);
    padding:5rem 0 5.5rem;
    position:relative;
    overflow:hidden;
  }
  .manuals-section::before{
    content:'';
    position:absolute;
    top:-120px; right:-120px;
    width:340px; height:340px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(201,168,108,.15),transparent 70%);
    pointer-events:none;
  }

  .manuals-header{ text-align:center; max-width:680px; margin:0 auto 2.6rem; position:relative; z-index:1; }
  .manuals-header .eyebrow{

    letter-spacing:.28em;
    font-size:.85rem;
    color:#C9A86C;
    text-transform:uppercase;
    display:block;
    margin-bottom:.6rem;
  }
  .manuals-header h2{

    font-weight:700;
    font-size:clamp(1.9rem,3.4vw,2.7rem);
    color:#fff;
    margin-bottom:.7rem;
  }
  .manuals-header p{

    color:rgba(255,255,255,.65);
    font-size:1.02rem;
  }

  /* Tab switcher */
  .manual-tabs{
    display:flex;
    justify-content:center;
    gap:.6rem;
    margin-bottom:2.8rem;
    position:relative;
    z-index:1;
    flex-wrap:wrap;
  }
  .manual-tab-btn{

    font-weight:600;
    font-size:.92rem;
    letter-spacing:.02em;
    color:rgba(255,255,255,.7);
    background:rgba(255,255,255,.05);
    border:1.5px solid rgba(255,255,255,.15);
    padding:.75rem 1.8rem;
    border-radius:40px;
    display:inline-flex;
    align-items:center;
    gap:.55rem;
    cursor:pointer;
    transition:all .3s ease;
  }
  .manual-tab-btn i{ font-size:.95rem; }
  .manual-tab-btn:hover{
    color:#fff;
    border-color:#C9A86C;
  }
  .manual-tab-btn.active{
    background:#C9A86C;
    border-color:#C9A86C;
    color:#182234;
  }

  .manual-panel{ display:none; position:relative; z-index:1; }
  .manual-panel.active{
    display:block;
    animation:manualFade .45s ease;
  }
  @keyframes manualFade{
    from{ opacity:0; transform:translateY(10px); }
    to{ opacity:1; transform:translateY(0); }
  }

  .manual-item{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.09);
    border-radius:14px;
    padding:1.3rem 1.3rem;
    display:flex;
    align-items:center;
    gap:1rem;
    height:100%;
    transition:transform .3s ease, background .3s ease, border-color .3s ease;
  }
  .manual-item:hover{
    transform:translateY(-4px);
    background:rgba(255,255,255,.08);
    border-color:rgba(201,168,108,.5);
  }
  .manual-ico{
    flex:0 0 auto;
    width:46px; height:46px;
    border-radius:10px;
    background:rgba(208,2,27,.15);
    color:#ff6b7a;
    display:flex; align-items:center; justify-content:center;
    font-size:1.15rem;
  }
  .manual-info{ flex:1 1 auto; min-width:0; }
  .manual-info h4{

    font-weight:600;
    font-size:.98rem;
    color:#fff;
    margin:0 0 .2rem;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .manual-info span{

    font-size:.76rem;
    color:rgba(255,255,255,.5);
  }
  .manual-dl{
    flex:0 0 auto;
    width:38px; height:38px;
    border-radius:50%;
    border:1.5px solid rgba(255,255,255,.25);
    color:#fff;
    display:flex; align-items:center; justify-content:center;
    text-decoration:none;
    transition:all .3s ease;
  }
  .manual-dl:hover{
    background:#C9A86C;
    border-color:#C9A86C;
    color:#182234;
  }

  @media (max-width:767px){
    .downloads-section{ padding:3.5rem 0 2rem; }
    .dl-card-d{ padding:1.5rem 1.3rem; }
    .manuals-section{ padding:3.5rem 0 3.5rem; }
    .manual-tabs{ gap:.5rem; }
    .manual-tab-btn{ padding:.65rem 1.3rem; font-size:.85rem; }
    .mob-process-vdo{height: auto;}
  }


.process-video-section{padding:80px 0;background:#0b0f19;}
.process-video-section .sec-eyebrow{color:#d3d3d3;}
.process-video-section .sec-title{color:#fff;}
.process-video-section .sec-desc{color:rgba(255,255,255,0.55);max-width:560px;}

.pv-video-frame{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.45);border:1px solid rgba(200,164,74,0.25);}
.pv-video-grid{width:100%;height:100%;}
.pv-video-grid iframe{display:block;border:0;}
.pv-corner{position:absolute;width:22px;height:22px;border-color:#c8a44a;border-style:solid;opacity:0.8;pointer-events:none;}
.pv-tl{top:10px;left:10px;border-width:2px 0 0 2px;}
.pv-tr{top:10px;right:10px;border-width:2px 2px 0 0;}
.pv-bl{bottom:10px;left:10px;border-width:0 0 2px 2px;}
.pv-br{bottom:10px;right:10px;border-width:0 2px 2px 0;}


/*****thank you page css******/
  /* fine architectural backdrop — concentric arcs, like a lock bezel */
  .backdrop-th{
    position:fixed; inset:0; z-index:0; pointer-events:none;
    background:
      repeating-linear-gradient(90deg, transparent 0 119px, rgba(17,17,16,.06) 119px 120px),
      repeating-linear-gradient(0deg, transparent 0 119px, rgba(17,17,16,.06) 119px 120px);
    opacity:.55;
  }
  .arc{
    position:fixed; right:-18vw; top:50%; transform:translateY(-50%);
    width:60vw; height:60vw; max-width:820px; max-height:820px;
    border-radius:50%; border:1px solid rgba(17,17,16,.10);
    z-index:0; pointer-events:none;
  }
  .arc::before{
    content:''; position:absolute; inset:70px; border-radius:50%; border:1px solid rgba(17,17,16,.10);
  }
  .arc::after{
    content:''; position:absolute; inset:140px; border-radius:50%; border:1px solid rgba(17,17,16,.06);
  }
  @media (max-width: 860px){ .arc{ display:none; } }

  .shell{
    position:relative; z-index:2;
    min-height:100vh;
    display:flex; align-items:center; justify-content:center;
    padding:6rem 1.5rem;
  }

  .card-tha{
    width:100%; max-width:620px;
    text-align:center;
  }

  .brandline{
    display:flex; align-items:center; gap:.6rem;
    margin-bottom:3.2rem;
}
  .brandline .sq{
    width:8px; height:8px; background:#e51e23;
  }
  .brandline span{
    font-size:.72rem; letter-spacing:.28em; text-transform:uppercase;
    color:#4a4844; font-weight:600;
  }

  /* ── SIGNATURE: lock mark that turns from open to secured ── */
  .mark{
    width:76px; height:76px; margin:0 auto 2.4rem;
    position:relative;
    text-align: center;
    background-color:  transparent;
  }
  .mark svg{ width:100%; height:100%; overflow:visible; }
  .shackle{
    transform-origin: 38px 30px;
    transform: translateY(-7px) rotate(-10deg);
    animation: lock-shut .55s cubic-bezier(.4,0,.2,1) .75s forwards;
  }
  @keyframes lock-shut{ to{ transform: translateY(0) rotate(0deg); } }
  .bezel{
    stroke-dasharray: 210; stroke-dashoffset: 210;
    animation: draw 1s cubic-bezier(.65,0,.35,1) .35s forwards;
  }
  @keyframes draw{ to{ stroke-dashoffset: 0; } }
  .pip{
    opacity:0; transform:scale(0);
    transform-origin:38px 44px;
    animation: pip-in .35s cubic-bezier(.4,0,.2,1) 1.15s forwards;
  }
  @keyframes pip-in{ to{ opacity:1; transform:scale(1); } }

  .eyebrow-th{
    font-size:.78rem; letter-spacing:.18em; text-transform:uppercase;
    color:#e51e23; font-weight:700; margin-bottom:1.1rem;
 
  }

   .thank-heading{
    font-family:'Playfair Display', serif;
    font-weight:600;
    font-size:clamp(2.4rem, 6vw, 3.6rem);
    line-height:1.08;
    letter-spacing:-.01em;
    margin-bottom:1.4rem;
    color:#111110;

  }
  .em-th{ font-style:italic; color:#e51e23; font-weight:500; }

  p.lead-tha{
    color:#4a4844;
    font-size:1.08rem;
    line-height:1.75;
    text-align: center;
   margin-bottom:2.4rem;

  }

  .ref{
    display:inline-flex; align-items:center; gap:.7rem;
    padding:.75rem 1.2rem;
    background:#f2efe8;
    border-left:2px solid v#e51e23;
    font-size:.85rem; color:#4a4844;
    margin-bottom:3rem;

  }
  .ref b{ color:#111110; font-weight:700; letter-spacing:.03em; }

  .actions-th{
    display:block; text-align: center; gap:1rem; flex-wrap:wrap;

  }
    .actions-th .btn-th{
    padding:1rem 1.9rem;
    font-size:.86rem; font-weight:700; letter-spacing:.02em;
    text-decoration:none;
    transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
    display:inline-flex; align-items:center; gap:.6rem;
  }
  .btn-primary-th{ background:#111110; color:#faf8f4; }
  .btn-primary-th:hover{ background:#e51e23; transform:translateY(-2px); }
  .btn-ghost{ border:1px solid rgba(17,17,16,.10); color:#111110; }
  .btn-ghost:hover{ border-color:#111110; transform:translateY(-2px); }



