
  /* ---------- COLOR VARIABLES (Light Mode Default) ---------- */
  :root{
    --canvas:#F3EFE6;
    --canvas-2:#E9E0CC;
    --navy:#141F38;
    --navy-2:#1F304F;
    --maroon:#8B2635;
    --maroon-2:#6E1D2A;
    --brass:#C08829;
    --brass-light:#E0AE5C;
    --ink:#1B1712;
    --ink-soft:#54503F;
    --line: rgba(20,31,56,0.12);
    --shadow: 0 24px 60px -24px rgba(20,31,56,0.4);
    --card-bg: #ffffff;
    --header-bg: #ffffff;
  }

  /* ---------- DARK MODE THEME ---------- */
  body.dark-mode {
    --canvas: #0F172A;
    --canvas-2: #1E293B;
    --navy: #F8FAFC;
    --navy-2: #334155;
    --ink: #F1F5F9;
    --ink-soft: #94A3B8;
    --line: rgba(255,255,255,0.12);
    --shadow: 0 24px 60px -24px rgba(0,0,0,0.7);
    --card-bg: #1E293B;
    --header-bg: #0F172A;
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{ background:var(--canvas); color:var(--ink); font-family:'Inter','Noto Sans Devanagari',sans-serif; line-height:1.55; overflow-x:hidden; transition: background 0.3s ease, color 0.3s ease;}
  h1,h2,h3,.display{ font-family:'Fraunces','Noto Sans Devanagari',serif; font-weight:700; letter-spacing:-0.01em; color:var(--navy);}
  a{ color:inherit; text-decoration:none;}
  ul{ list-style:none;}
  img{ max-width:100%; display:block;}
  button{ font-family:inherit;}
  .container{ max-width:1240px; margin:0 auto; padding:0 28px;}

  /* ---------- PROMO STRIP ---------- */
  .promo-strip{
    background:var(--navy-2); color:#EFE7D3; text-align:center; font-size:12.5px; font-weight:700;
    letter-spacing:0.04em; padding:9px 20px;
  }
  .promo-strip span{ color:var(--brass-light);}

  /* ---------- HEADER / MEGA NAV ---------- */
  header{ position:sticky; top:0; z-index:100; background:var(--header-bg); border-bottom:1px solid var(--line); transition: background 0.3s ease;}
  .nav-top{ display:flex; align-items:center; justify-content:space-between; padding:16px 0;}
  .nav-top > .logo, .nav-top > .nav-actions{ flex:1; }
  .nav-top > .nav-actions{ justify-content:flex-end; }
  .center-logo{ flex:0 0 auto; margin:0 auto; max-height: 80px; }
  .logo{ font-family:'Fraunces','Noto Sans Devanagari',serif; font-weight:900; font-size:24px; color:var(--navy); display:flex; flex-direction:column; align-items:flex-start; gap:2px;}
  .logo span{ color:var(--maroon); font-size:10px; font-weight:700; letter-spacing:0.12em; font-family:'Inter','Noto Sans Devanagari',sans-serif;}
  .nav-actions{ display:flex; align-items:center; gap:18px;}
  .nav-actions a{ font-size:13px; font-weight:700; color:var(--navy); display:flex; align-items:center; gap:6px;}
  .nav-actions svg{ width:17px; fill:var(--navy);}
  .cta-pill{ background:var(--maroon); color:#fff !important; padding:9px 18px; border-radius:2px; font-size:12.5px;}
  .burger{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer;}
  .burger span{ width:24px; height:2px; background:var(--navy);}

  /* Dynamic Theme Toggle Button Style */
  .theme-toggle-btn {
    background: var(--navy-2);
    color: #fff;
    border: none;
    padding: 7px 14px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s ease;
  }

  .nav-bottom{ border-top:1px solid var(--line);}
  .nav-cats{ display:flex; gap:34px; padding:13px 0; overflow-x:auto;}
  .nav-cats a{ font-size:13px; font-weight:700; letter-spacing:0.03em; text-transform:uppercase; color:var(--ink); white-space:nowrap; position:relative; padding-bottom:3px;}
  .nav-cats a.active{ color:var(--maroon);}
  .nav-cats a::after{ content:''; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--maroon); transition:width .2s ease;}
  .nav-cats a:hover::after{ width:100%;}

  /* ---------- HERO BANNER ---------- */
  .hero{
    position:relative; min-height:78vh; display:flex; align-items:flex-end;
    background:
      linear-gradient(0deg, rgba(20,31,56,0.88) 0%, rgba(20,31,56,0.35) 55%, rgba(20,31,56,0.15) 100%),
      radial-gradient(ellipse at 70% 20%, rgba(192,136,41,0.25), transparent 55%),
      linear-gradient(155deg, #141F38 0%, #0D1526 100%);
    padding:60px 0 64px; overflow:hidden;
  }
  .hero::before{
    content:''; position:absolute; inset:0;
    background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size:24px 24px; opacity:0.45;
  }
  .hero-content{ position:relative; z-index:2; max-width:640px;}
  .hero-eyebrow{ color:var(--brass-light); font-size:12.5px; font-weight:800; letter-spacing:0.18em; text-transform:uppercase; margin-bottom:14px;}
  .hero h1{ color:#fff; font-size:clamp(40px,6vw,72px); line-height:0.98; margin-bottom:16px;}
  .hero h1 em{ font-style:normal; color:var(--brass-light);}
  .hero p{ color:#D3D8E4; font-size:16.5px; max-width:460px; margin-bottom:30px;}
  .hero-ctas{ display:flex; gap:14px; flex-wrap:wrap;}
  .btn{ display:inline-flex; align-items:center; gap:9px; padding:14px 26px; border-radius:2px; font-weight:800; font-size:13.5px; letter-spacing:0.02em; text-transform:uppercase; border:2px solid transparent; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease;}
  .btn:hover{ transform:translateY(-2px);}
  .btn-primary{ background:var(--maroon); color:#fff;}
  .btn-primary:hover{ box-shadow:0 14px 26px -10px rgba(139,38,53,0.55);}
  .btn-outline{ border-color:#fff; color:#fff;}
  .btn-outline:hover{ background:rgba(255,255,255,0.1);}
  .btn-dark{ background:var(--navy-2); color:#fff;}

  /* ---------- SECTION SHELL ---------- */
  section{ padding:74px 0;}
  .sec-head{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:36px; gap:20px; flex-wrap:wrap;}
  .sec-head h2{ font-size:clamp(26px,3.4vw,38px);}
  .sec-head .kicker{ font-size:12px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--maroon); margin-bottom:8px;}
  .sec-head .link{ font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:0.04em; color:var(--navy); border-bottom:2px solid var(--brass); padding-bottom:3px; white-space:nowrap;}
  .alt-bg{ background:var(--canvas-2);}

  /* ---------- PRODUCT CARDS ---------- */
  .strip{ display:flex; gap:20px; overflow-x:auto; padding-bottom:12px; scroll-snap-type:x mandatory;}
  .strip::-webkit-scrollbar{ height:6px;}
  .strip::-webkit-scrollbar-thumb{ background:var(--brass); border-radius:6px;}
  .p-card{
    flex:0 0 280px; background:var(--card-bg); border-radius:4px; overflow:hidden; box-shadow:var(--shadow);
    border:1px solid var(--line); scroll-snap-align:start; position:relative; transition: background 0.3s ease;
  }
  .p-card .badge{ position:absolute; top:12px; left:12px; background:var(--maroon); color:#fff; font-size:10.5px; font-weight:800; padding:5px 10px; border-radius:20px; letter-spacing:0.05em; z-index:2;}
  .p-img{ height:220px; background:linear-gradient(140deg, #141F38, #1F304F); display:flex; align-items:center; justify-content:center; position:relative;}
  .p-info{ padding:18px 20px 22px;}
  .p-info h4{ font-size:15px; font-family:'Inter','Noto Sans Devanagari',sans-serif; font-weight:800; color:var(--navy); margin-bottom:4px;}
  .p-info .sub{ font-size:12.5px; color:var(--ink-soft); margin-bottom:10px;}
  .p-info .row{ display:flex; justify-content:space-between; align-items:center;}
  .p-info .cta{ font-size:11.5px; font-weight:800; text-transform:uppercase; color:var(--maroon); letter-spacing:0.03em;}

  .coming-strip{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:20px;}
  .coming-card{ border:1.5px dashed var(--line); border-radius:4px; padding:24px; display:flex; align-items:center; gap:18px; background:var(--card-bg);}
  .coming-card .ico{ width:52px; height:52px; border-radius:50%; background:var(--canvas-2); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
  .coming-card .ico svg{ width:24px; fill:var(--maroon);}
  .coming-card h4{ font-size:15.5px; color:var(--navy); font-family:'Fraunces','Noto Sans Devanagari',serif;}
  .coming-card p{ font-size:12.5px; color:var(--ink-soft);}
  .coming-card .tag{ display:inline-block; margin-top:4px; font-size:10px; font-weight:800; color:var(--maroon); letter-spacing:0.06em; text-transform:uppercase;}

  /* ---------- SIZE CHART ---------- */
  .size-chart{ background:var(--card-bg); border-radius:4px; box-shadow:var(--shadow); padding:32px; margin-top:44px; border:1px solid var(--line);}
  .size-chart h3{ font-size:19px; margin-bottom:18px;}
  table{ width:100%; border-collapse:collapse; font-size:14px;}
  th,td{ padding:12px 10px; text-align:center; border-bottom:1px solid var(--canvas-2);}
  th{ color:var(--maroon); text-transform:uppercase; font-size:11px; letter-spacing:0.06em;}
  tr:last-child td{ border-bottom:none;}

  /* ---------- SPLIT PROMO ---------- */
  .split-promo{ display:grid; grid-template-columns:1fr 1fr; gap:0; border-radius:4px; overflow:hidden; box-shadow:var(--shadow);}
  .split-half{ padding:52px 44px; position:relative;}
  .split-half.dark{ background:linear-gradient(150deg,#141F38,#0D1526); color:#fff;}
  .split-half.light{ background:var(--card-bg); color:var(--ink);}
  .split-half .kicker{ font-size:11.5px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--brass-light); margin-bottom:12px;}
  .split-half.light .kicker{ color:var(--maroon);}
  .split-half h3{ font-size:26px; margin-bottom:14px; color:inherit;}
  .split-half.dark h3{ color:#fff;}
  .split-half p{ font-size:14.5px; opacity:0.85; margin-bottom:22px; max-width:380px;}

  .process-list{ display:flex; flex-direction:column; gap:14px; margin-top:6px;}
  .process-item{ display:flex; gap:14px; align-items:flex-start;}
  .process-item .n{ font-family:'Fraunces','Noto Sans Devanagari',serif; font-weight:800; font-size:17px; color:var(--brass-light); width:26px; flex-shrink:0;}
  .process-item .t{ font-size:13.5px; opacity:0.85;}
  .process-item .t b{ display:block; font-size:14px; color:#fff; margin-bottom:2px; font-weight:700;}

  /* ---------- TRUST STRIP ---------- */
  .trust-strip{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:30px; padding:40px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
  .trust-item{ display:flex; gap:14px; align-items:center; flex:1; min-width:220px;}
  .trust-item .ico{ width:44px; height:44px; border-radius:50%; background:var(--canvas-2); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
  .trust-item .ico svg{ width:20px; fill:var(--maroon);}
  .trust-item h5{ font-size:13.5px; font-weight:800; color:var(--navy);}
  .trust-item p{ font-size:12px; color:var(--ink-soft);}

  /* ---------- DEALER FORM ---------- */
  .dealer-wrap{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:44px;}
  .dealer-points{ display:flex; flex-direction:column; gap:20px;}
  .point{ display:flex; gap:14px; align-items:flex-start;}
  .point-ico{ width:40px; height:40px; border-radius:50%; background:var(--maroon); flex-shrink:0; display:flex; align-items:center; justify-content:center;}
  .point-ico svg{ width:18px; fill:#fff;}
  .point h4{ font-size:14.5px; color:var(--navy); margin-bottom:2px; font-family:'Fraunces','Noto Sans Devanagari',serif;}
  .point p{ font-size:13px; color:var(--ink-soft);}

  .form-card{ background:var(--card-bg); border-radius:4px; box-shadow:var(--shadow); padding:34px; border:1px solid var(--line);}
  .form-card h3{ font-size:21px; margin-bottom:6px;}
  .form-card .sub{ color:var(--ink-soft); font-size:13.5px; margin-bottom:22px;}
  .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px;}
  .field{ display:flex; flex-direction:column; gap:6px;}
  .field.full{ grid-column:1/-1;}
  .field label{ font-size:11.5px; font-weight:800; color:var(--navy); text-transform:uppercase; letter-spacing:0.04em;}
  .field input, .field select, .field textarea{ border:1.5px solid var(--canvas-2); background:var(--canvas); padding:12px 13px; border-radius:3px; font-family:'Inter','Noto Sans Devanagari',sans-serif; font-size:14px; color:var(--ink); outline:none; transition:border-color .2s;}
  .field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--brass);}
  .form-card .btn{ width:100%; justify-content:center; margin-top:6px;}

  /* ---------- GALLERY ---------- */
  .gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
  .gallery-grid .g1{ grid-column:span 2; grid-row:span 2;}
  .g-item{ background:linear-gradient(150deg,#1F304F,#141F38); border-radius:4px; position:relative; overflow:hidden; aspect-ratio:1/1; cursor:pointer; display:flex; align-items:center; justify-content:center;}
  .gallery-grid .g1{ aspect-ratio:auto;}
  .g-item img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease;}
  .g-item:hover img{ transform:scale(1.06);}
  .g-item .zoom-hint{ position:absolute; inset:0; background:rgba(139,38,53,0); transition:background .3s ease; z-index:2; pointer-events:none;}
  .g-item:hover .zoom-hint{ background:rgba(139,38,53,0.18);}

  /* ---------- CONTACT ---------- */
  .contact-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:44px;}
  .contact-card{ background:var(--navy-2); color:#EFE7D3; padding:34px; border-radius:4px;}
  .contact-card h3{ font-family:'Fraunces','Noto Sans Devanagari',serif; color:#fff; font-size:21px; margin-bottom:20px;}
  .c-row{ display:flex; gap:13px; margin-bottom:18px; align-items:flex-start;}
  .c-row svg{ width:18px; fill:var(--brass-light); flex-shrink:0; margin-top:3px;}
  .c-row .lbl{ font-size:11px; text-transform:uppercase; letter-spacing:0.06em; color:var(--brass-light); font-weight:800; margin-bottom:2px;}
  .c-row .val{ font-size:14px; color:#DDE2EC;}
  .gst-pill{ display:inline-block; margin-top:4px; background:rgba(224,174,92,0.14); border:1px solid rgba(224,174,92,0.4); padding:6px 12px; border-radius:20px; font-size:11.5px; color:var(--brass-light);}
  .map-wrap{ border-radius:4px; overflow:hidden; box-shadow:var(--shadow); min-height:360px;}
  .map-wrap iframe{ width:100%; height:100%; min-height:360px; border:0;}

  /* ---------- FOOTER ---------- */
  footer{ background:#0D1526; color:#9AA3B8; padding-top:56px;}
  .footer-cols{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,0.08);}
  .footer-logo{ font-family:'Fraunces','Noto Sans Devanagari',serif; font-weight:900; color:#fff; font-size:23px; margin-bottom:12px;}
  .footer-cols > div > p{ font-size:13px; line-height:1.7;}
  .footer-col h5{ color:#fff; font-size:12px; text-transform:uppercase; letter-spacing:0.1em; margin-bottom:16px; font-weight:800;}
  .footer-col ul li{ margin-bottom:10px;}
  .footer-col a{ font-size:13px; transition:color .2s;}
  .footer-col a:hover{ color:var(--brass-light);}
  .socials{ display:flex; gap:10px; margin-top:16px;}
  .socials a{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,0.06); display:flex; align-items:center; justify-content:center;}
  .socials svg{ width:15px; fill:#EFE7D3;}
  .footer-bottom{ padding:24px 0; display:flex; justify-content:space-between; align-items:center; font-size:12px; flex-wrap:wrap; gap:12px;}
  .pay-icons{ display:flex; gap:8px; align-items:center;}
  .pay-icons span{ background:rgba(255,255,255,0.08); padding:5px 10px; border-radius:3px; font-size:10px; font-weight:800; letter-spacing:0.03em;}

  /* ---------- FLOATING BUTTONS ---------- */
  .float-btns{ position:fixed; right:22px; bottom:22px; display:flex; flex-direction:column; gap:14px; z-index:200;}
  .fbtn{ width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 24px -6px rgba(0,0,0,0.4); transition:transform .2s ease;}
  .fbtn:hover{ transform:scale(1.08);}
  .fbtn.wa{ background:#25D366;}
  .fbtn.call{ background:var(--maroon); animation:pulse 2.4s infinite;}
  .fbtn svg{ width:24px; fill:#fff;}
  @keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(139,38,53,0.5);} 70%{box-shadow:0 0 0 14px rgba(139,38,53,0);} 100%{box-shadow:0 0 0 0 rgba(139,38,53,0);} }

  /* ---------- LEGAL MODAL ---------- */
  .legal-modal{ position:fixed; inset:0; background:rgba(13,21,38,0.72); display:none; align-items:center; justify-content:center; z-index:300; padding:20px;}
  .legal-modal.open{ display:flex;}
  .legal-box{ background:var(--card-bg); color:var(--ink); max-width:560px; width:100%; max-height:80vh; overflow-y:auto; border-radius:6px; padding:34px;}
  .legal-box h3{ margin-bottom:14px;}
  .legal-box p{ font-size:14px; color:var(--ink-soft); margin-bottom:12px;}
  .legal-close{ float:right; background:none; border:none; font-size:22px; cursor:pointer; color:var(--ink-soft);}

  @media (max-width:900px){
    .nav-actions .txt{ display:none;}
    .burger{ display:flex;}
    .nav-cats{ display:none; flex-direction:column; gap:12px; padding:12px 0;}
    .nav-cats.open{ display:flex;}
    .hero{ min-height:64vh;}
    .split-promo, .dealer-wrap, .contact-grid, .coming-strip{ grid-template-columns:1fr;}
    .footer-cols{ grid-template-columns:1fr 1fr;}
    .gallery-grid{ grid-template-columns:repeat(2,1fr);}
    .gallery-grid .g1{ grid-column:span 2; grid-row:span 1;}
    .form-row{ grid-template-columns:1fr;}
    section{ padding:50px 0;}
    .trust-strip{ flex-direction:column;}
  }

  /* ---------- LANGUAGE BUTTON / GALLERY PAGE / ORDER PAGE ---------- */
  .gallery-grid.uniform{ grid-template-columns:repeat(3,1fr);}
  .gallery-grid.uniform .g1{ grid-column:auto; grid-row:auto; aspect-ratio:1/1;}
  .lightbox{ position:fixed; inset:0; background:rgba(13,21,38,0.92); display:none; align-items:center; justify-content:center; z-index:400; padding:20px;}
  .lightbox.open{ display:flex;}
  .lightbox img{ max-width:92vw; max-height:86vh; object-fit:contain; border-radius:4px;}
  .lb-btn{ position:absolute; background:rgba(255,255,255,0.14); color:#fff; border:none; font-size:26px; width:48px; height:48px; border-radius:50%; cursor:pointer;}
  .lb-btn:hover{ background:rgba(255,255,255,0.28);}
  .lb-close{ top:20px; right:20px;}
  .lb-prev{ left:20px; top:50%; transform:translateY(-50%);}
  .lb-next{ right:20px; top:50%; transform:translateY(-50%);}
  .order-wrap{ display:grid; grid-template-columns:1.15fr 0.85fr; gap:44px; align-items:start;}
  .pay-title{ font-size:11.5px; font-weight:800; color:var(--navy); text-transform:uppercase; letter-spacing:0.04em; margin:6px 0 8px;}
  .pay-options{ display:flex; flex-direction:column; gap:10px; margin-bottom:14px;}
  .pay-opt{ display:flex; gap:10px; align-items:flex-start; border:1.5px solid var(--canvas-2); background:var(--canvas); padding:12px 14px; border-radius:3px; cursor:pointer;}
  .pay-opt input{ margin-top:4px;}
  .pay-opt b{ display:block; font-size:14px; color:var(--navy);}
  .pay-opt small{ font-size:12.5px; color:var(--ink-soft);}
  #razorpay-box{ margin-bottom:14px;}
  .how-card{ background:var(--card-bg); border:1px solid var(--line); border-radius:4px; box-shadow:var(--shadow); padding:30px;}
  .how-card h3{ font-size:20px; margin-bottom:14px;}
  ol.how-list{ list-style:decimal; padding-left:20px; margin-bottom:18px;}
  ol.how-list li{ margin-bottom:10px; font-size:14px; color:var(--ink-soft);}
  .how-card p{ font-size:13.5px; color:var(--ink-soft); margin-bottom:10px;}
  .how-card a{ color:var(--maroon); font-weight:700;}
  @media (max-width:900px){
    .order-wrap{ grid-template-columns:1fr;}
    .gallery-grid.uniform{ grid-template-columns:repeat(2,1fr);}
    .center-logo{ max-height:56px;}
  }
  @media (max-width:600px){
    .cta-pill{ display:none;}
    .nav-actions{ gap:8px;}
    .theme-toggle-btn{ padding:6px 10px;}
  }
