/* ==============================
   ROOT VARIABLES
============================== */
:root {
  /* — Colors — */
      /* Functional */
  --raw-success:            #28A745;
  --raw-warning:            #FE9A00;
  --raw-blue:               #2563EB;
  --raw-wa-green:           #25D366;
  --raw-error:              #CC0033;

  --body-bg:               var(--color-white);
  --header-bg:               #E5EFEE;
  --color-primary:           #005B52;
  --color-primary-dark:      #003B35;
  --color-primary-deep:      #002D2C;
  --color-primary-light:     #009966;
  --color-primary-10:        rgba(0, 91, 82, 0.1);
  --color-primary-90:        rgba(0, 91, 82, 0.9);
  --color-bg-dark:           #001716;
  --color-bg-light:          #F9F9FB;
  --color-bg-light-green:    #E8F5ED;
  --color-white:             #FFFFFF;
  --color-black:             #000000;
  --color-text-primary:      #001716;
  /* --color-text-primary:      #101828; */
  --color-text-para:         #6A7282;
  --color-border-light:      #CCD8D7;
  --color-accent-gold:       #EFB100;
  --color-gold-dark:         #D39F51;
  --color-gold-mid:          #E5B566;
  --color-gold-light:        #FFF7A9;
  --color-success:           var(--raw-success);
  --color-success-dark:      #1E7E34;
  --color-warning:           var(--raw-warning);
  --color-warning-dark:      #E17100;
  --color-neutral-900:       #111111;
  --footer-color-text:       rgba(255, 255, 255, 0.8);



  --color-error:          var(--raw-error);
  --color-success:        var(--color-primary);
  --color-warning:        var(--raw-warning);

  /* — Gradients — */
  --gradient-gold-premium:   linear-gradient(90deg, var(--color-gold-mid) 0%, var(--color-gold-light) 50%, var(--color-gold-dark) 100%);
  --gradient-gold:           linear-gradient(135deg, var(--color-gold-mid) 0%, var(--color-gold-light) 100%);
  --gradient-btn:            linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-deep) 100%);
  --gradient-btn-cta:        linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  --gradient-btn-2:          linear-gradient(135deg, var(--color-primary-light) 0%, var(--color-primary) 100%);
  --gradient-btn-3:          linear-gradient(135deg, var(--color-success) 0%, var(--color-success-dark) 100%);
  --gradient-btn-4:          linear-gradient(135deg, var(--color-warning) 0%, var(--color-warning-dark) 100%);
  --gradient-btn-5:          linear-gradient(180deg, var(--color-primary-dark) 0%, var(--color-primary-deep) 100%);
  --gradient-top-header:     linear-gradient(90deg, var(--color-bg-dark) 0%, var(--color-primary-dark) 50%, var(--color-bg-dark) 100%);
  --gradient-footer:         linear-gradient(0deg, var(--color-bg-dark) 0%, var(--color-primary) 100%);
  --gradient-tile:           linear-gradient(180deg, var(--color-primary-90) 0%, var(--color-bg-dark) 100%);
  --gradient-cta-bg:         linear-gradient(180deg, var(--color-primary) 0%, var(--color-bg-dark) 100%);
  --gradient-orange:         linear-gradient(135deg, var(--color-warning) 0%, var(--color-warning-dark) 100%);

  /* — Fonts — */
  --font-primary:   'Inter', sans-serif;
  --font-secondary: 'Playfair Display', serif;

  /* — Font Sizes — */
    /* --fs-2xs:  clamp(7.5px, 0.5263vw, 12.5px);
  --fs-xs:   clamp(9px, 0.6316vw, 15px);
  --fs-sm:   clamp(10.5px, 0.7368vw, 17.5px);
  --fs-md:   clamp(12px, 0.8421vw, 20px);
  --fs-lg:   clamp(15px, 1.0526vw, 25px);
  --fs-xl:   clamp(18px, 1.2632vw, 30px);
  --fs-2xl:  clamp(22.5px, 1.5789vw, 37.5px);
  --fs-3xl:  clamp(36px, 2.5263vw, 60px);

  --fs-h1: clamp(36px, 2.5263vw, 60px);
  --fs-h2: clamp(22.5px, 1.5789vw, 37.5px);
  --fs-h3: clamp(18px, 1.2632vw, 30px);
  --fs-h4: clamp(15px, 1.0526vw, 25px);
  --fs-h5: clamp(12px, 0.8421vw, 20px);
  --fs-h6: clamp(10.5px, 0.7368vw, 17.5px);
  --fs-p:  clamp(10.5px, 0.7368vw, 17.5px);

  --fs-btn:       clamp(12px, 0.8421vw, 20px);
  --fs-btn-sm:    clamp(10.5px, 0.7368vw, 17.5px);
  --fs-badge:     clamp(7.5px, 0.5263vw, 12.5px);
  --fs-badge-lg:  clamp(9px, 0.6316vw, 15px);
  --fs-badge-cap: clamp(7.5px, 0.5263vw, 12.5px);

  --fs-small:     clamp(9px, 0.6316vw, 15px); */
  /* --lh-btn:         clamp(18px, 1.2632vw, 30px);
  --lh-btn-sm:      clamp(15px, 1.0526vw, 25px);
  --lh-p:           clamp(15px, 1.0526vw, 25px);
  --lh-h5:          clamp(18px, 1.2632vw, 30px);
  --lh-h6:          clamp(15px, 1.0526vw, 25px);
  --lh-small:       clamp(12px, 0.8421vw, 20px);
  --lh-xs:          clamp(12px, 0.8421vw, 20px);
  --lh-badge:       clamp(12px, 0.8421vw, 20px); */

  --fs-2xs:  10px;
  --fs-xs:   12px;
  --fs-sm:   14px;
  --fs-md:   16px;
  --fs-lg:   20px;
  --fs-xl:   24px;
  --fs-2xl:  30px;
  --fs-3xl:  48px;

  --fs-h1: 48px;
  --fs-h2: 30px;
  --fs-h3: 24px;
  --fs-h4: 20px;
  --fs-h5: 16px;
  --fs-h6: 14px;
  --fs-p:  14px;

  --fs-btn:       16px;
  --fs-btn-sm:    14px;
  --fs-badge:     10px;
  --fs-badge-lg:  12px;
  --fs-badge-cap: 8.25px;
  --fs-small:     12px;
  --fs-input-label: 10px;

  /* — Font Weights — */
  --fw-bold:     700;
  --fw-semibold: 600;
  --fw-medium:   500;
  --fw-regular:  400;

  /* — Line Heights — */
  --lh-btn:         24px;
  --lh-btn-sm:      20px;
  --lh-p:           20px;
  --lh-h5:          24px;
  --lh-h6:          20px;
  --lh-small:       16px;
  --lh-xs:          16px;
  --lh-badge:       16px;
  --lh-badge-lg:    16px;
  --lh-input-label: 16px;

  /* — Letter Spacing — */
  --ls-tight:     0.5%;
  --ls-badge-cap: 0.6px;

  /* — Component tokens — */
  --breadcrumb-height:    250px;
  --hero-height:    100svh;
  --nav-height:     95px;
  --ticker-height:  45px;
  --mob-bar-height: 90px;
  --radius-sm:      6px;
  --radius-md:      10px;
  --radius-lg:      14px;
  --radius-xl:      18px;
  --radius-pill:     999px;
  --shadow-sm:      0 2px 12px rgba(0, 0, 0, 0.07);
  --shadow-md:      0 8px 32px rgba(0, 0, 0, 0.13);
  --transition:     0.16s ease;
  --transition-fast: 0.22s cubic-bezier(0.4,0,0.2,1);
  --transition-med: 0.38s cubic-bezier(0.4,0,0.2,1);
  --transition-slow: 0.52s cubic-bezier(0.4,0,0.2,1);

    /* Hero-specific tokens */
  --hero-overlay:     rgba(0,23,22,0.54);
  --hero-pill-bg:     rgba(255,255,255,0.11);
  --hero-pill-border: rgba(255,255,255,0.2);
  --hero-text-muted:  rgba(255,255,255,0.7);
  --hero-search-bg:   rgba(255,255,255,0.97);
}

h1,h2,h3,h4,h5,h6,p,dd,dt { margin-bottom: 0px; }
dl, ol, ul {
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
}

@keyframes dw-ticker-pulse-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes dw-contact-drop-in {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ==============================
   TYPOGRAPHY CLASSES
============================== */

/* Headings */
.h1 {
  font-family: var(--font-primary);
  font-size: var(--fs-h1);
  font-weight: var(--fw-bold);
}

.h2 {
  font-family: var(--font-primary);
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
}

.h3 {
  font-family: var(--font-primary);
  font-size: var(--fs-h3);
  font-weight: var(--fw-bold);
}

.h4 {
  font-family: var(--font-primary);
  font-size: var(--fs-h4);
  font-weight: var(--fw-semibold);
}

.h5 {
  font-family: var(--font-primary);
  font-size: var(--fs-h5);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-h5);
}

.h6 {
  font-family: var(--font-primary);
  font-size: var(--fs-h6);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-h6);
}

/* Paragraph */
.p {
  font-family: var(--font-primary);
  font-size: var(--fs-p);
  font-weight: var(--fw-regular);
  line-height: var(--lh-p);
  color: var(--color-text-para);
}

.hidden {
  display: none;
}

/* ==============================
   BUTTON
============================== */
.btn-text {
  font-family: var(--font-primary);
  font-size: var(--fs-btn);
  font-weight: var(--fw-btn);
  line-height: var(--lh-btn);
}

.btn-text-sm {
  font-family: var(--font-primary);
  font-size: var(--fs-btn-sm);
  font-weight: var(--fw-btn-sm);
  line-height: var(--lh-btn-sm);
}


/* ==============================
   BADGE
============================== */
.badge {
  font-family: var(--font-primary);
  font-size: var(--fs-badge);
  font-weight: var(--fw-badge);
  line-height: var(--lh-badge);
}

.badge-lg {
  font-family: var(--font-primary);
  font-size: var(--fs-badge-lg);
  font-weight: var(--fw-badge-lg);
  line-height: var(--lh-badge-lg);
}

.badge-cap {
  font-family: var(--font-primary);
  font-size: var(--fs-badge-cap);
  font-weight: var(--fw-badge);
  letter-spacing: var(--ls-badge-cap);
  text-transform: uppercase;
}


/* ==============================
   SMALL TEXT
============================== */
.text-small {
  font-family: var(--font-primary);
  font-size: var(--fs-small);
  font-weight: var(--fw-small);
  line-height: var(--lh-small);
}

.text-xs {
  font-family: var(--font-primary);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-xs);
  line-height: var(--lh-xs);
}


/* ==============================
   INPUT LABEL
============================== */
.input-label {
  font-family: var(--font-primary);
  font-size: var(--fs-input-label);
  font-weight: var(--fw-input-label);
  line-height: var(--lh-input-label);
}

/* ============================================================
    RESET — scoped to .dw-* elements only via body class.
    Using tag-level reset only for body/html to avoid bleed.
============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: var(--nav-height);}
body { font-family: var(--font-primary); background: var(--body-bg); color: var(--color-text-primary); }
a,a:hover    { text-decoration: none; color: inherit; }
button { font-family: var(--font-primary); cursor: pointer; }
/* ul, ol { list-style: none; } */

/* ============================================================
    TICKER BAR  —  .dw-ticker
============================================================ */
.dw-ticker {
  background: var(--gradient-gold-premium);
  /* background: var(--gradient-top-header); */
  height: var(--ticker-height);
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
  z-index: 10;
  padding: 8px;
}

.dw-ticker__cta {
  flex-shrink: 0;
  /* background: var(--gradient-gold);
  color: var(--color-bg-dark); */
      background: var(--gradient-btn);
    color: var(--color-white);
  border: 1px solid var(--color-gold-mid);
  font-family: var(--font-primary);
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 0 16px;
  border-radius: var(--radius-sm);
  height: 100%;
  border: none;
  white-space: nowrap;
  transition: opacity var(--transition);
}
.dw-ticker__cta:hover { opacity: 0.88; }

.dw-ticker__track {
  flex: 1;
  overflow: hidden;
  /* Loading state — shows before API data arrives */
  position: relative;
}

/* Skeleton pulse shown while ticker data is loading */
.dw-ticker__track--loading::after {
  content: '';
  display: block;
  height: 10px;
  width: 280px;
  border-radius: 4px;
  background: linear-gradient(90deg,
    rgba(200, 225, 200, 0.15) 25%,
    rgba(200, 225, 200, 0.3)  50%,
    rgba(200, 225, 200, 0.15) 75%
  );
  background-size: 400% 100%;
  animation: dw-shimmer 1.4s infinite, dw-ticker-pulse-in 0.3s ease;
  margin: auto 20px;
}


/* JS injects this element */
.dw-ticker__inner {
  display: inline-flex;
  white-space: nowrap;
  animation: dw-ticker-scroll 40s linear infinite;
}
.dw-ticker__inner:hover { animation-play-state: paused; }

.dw-ticker__item {
  /* color: rgba(200, 225, 200, 0.85); */
  color: var(--color-primary-deep);
  /* color: var(--color-bg-light-green); */
  font-size: var(--fs-xs);
  font-weight: var(--fw-regular);
  letter-spacing: 0.3px;
  padding-right: 30px;
}
.dw-ticker__item strong {
  color: var(--color-primary-deep);
  font-weight: var(--fw-semibold);
}

@keyframes dw-ticker-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ============================================================
    SITE HEADER (desktop)  —  .dw-header
============================================================ */
.dw-header {
  background: var(--gradient-top-header);
  /* background: var(--header-bg, var(--gradient-top-header)); */
  /* border-bottom: 1px solid var(--color-border-light); */
  position: sticky;
  top: 0;
  z-index: 200;
  box-shadow: var(--shadow-sm);
}

.dw-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 28px;
  height: var(--nav-height);
  gap: 12px;
}

/* — Logo — */
.dw-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  text-decoration: none;
}

img.dw-logo__image {
    object-fit: contain !important;
    width: auto;
    height: 80px;
}

/* — Primary Nav — */
.dw-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
  justify-content: center;
}
.dw-nav__item { position: relative; }

.dw-nav__link,
.dw-nav__trigger {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px 13px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: var(--color-white);
  /* color: var(--color-gold-mid); */
  /* color: var(--color-text-primary); */
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  white-space: nowrap;
  transition: background var(--transition), color var(--transition);
}
.dw-nav__link:hover,
.dw-nav__trigger:hover,
.dw-nav__trigger[aria-expanded="true"] {
  background: var(--color-white);
  /* background: var(--color-bg-light-green); */
  color: var(--color-primary);
}

.dw-nav__chevron {
  width: 9px;
  height: 9px;
  flex-shrink: 0;
  transition: transform 0.22s;
  color: var(--color-white);
  /* color: var(--color-text-para); */
}
.dw-nav__link:hover .dw-nav__chevron ,
.dw-nav__trigger:hover .dw-nav__chevron ,
.dw-nav__trigger[aria-expanded="true"]  .dw-nav__chevron {
  color: var(--color-primary);
}
.dw-nav__trigger[aria-expanded="true"] .dw-nav__chevron {
  transform: rotate(180deg);
}

/* — Mega Menu — */
.dw-mega {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  left: 0%;
  transform: translateX(-10%);
  background: var(--color-white);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
  z-index: 300;
  overflow: hidden;
  animation: dw-drop-in 0.18s ease;
}
.dw-mega.dw-mega--open { display: flex; }

@keyframes dw-drop-in {
  from { opacity: 0; transform: translateX(-10%) translateY(-8px); }
  to   { opacity: 1; transform: translateX(-10%) translateY(0); }
}

.dw-mega--projects { min-width: 760px; }

.dw-mega--simple {
  flex-direction: column;
  min-width: 210px;
}
.dw-mega--simple .dw-mega__simple-list { padding: 10px 0; margin-bottom: 0; }
.dw-mega--simple .dw-mega__simple-list li a {
  display: block;
  padding: 10px 20px;
  font-size: var(--fs-sm);
  color: var(--color-text-primary);
  border-radius: var(--radius-sm);
  margin: 2px 8px;
  transition: background var(--transition), color var(--transition);
}
.dw-mega--simple .dw-mega__simple-list li a:hover {
  background: var(--color-bg-light-green);
  color: var(--color-primary);
}

/* Mega columns */
.dw-mega__col {
  padding: 18px 0;
  border-right: 1px solid var(--color-bg-light-green);
}
.dw-mega__col ul {
  padding-left: 0;
}
.dw-mega__col:last-child { border-right: none; }

.dw-mega__col-label {
  font-size: var(--fs-2xs);
  font-weight: var(--fw-bold);
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--color-text-para);
  padding: 0 16px 10px;
  margin-bottom: 0;
}

/* City buttons */
.dw-mega__city-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 9px 16px;
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: var(--color-text-primary);
  background: none;
  border: none;
  text-align: left;
  transition: background var(--transition), color var(--transition);
}
.dw-mega__city-btn:hover,
.dw-mega__city-btn--active {
  background: var(--color-primary);
  color: var(--color-white);
}
.dw-mega__city-count {
  background: rgba(0, 0, 0, 0.08);
  border-radius: 20px;
  font-size: var(--fs-xs);
  padding: 1px 7px;
  font-weight: var(--fw-semibold);
}
.dw-mega__city-btn--active .dw-mega__city-count {
  background: rgba(255, 255, 255, 0.25);
}

/* Type buttons */
.dw-mega__type-btn {
  display: block;
  width: calc(100% - 16px);
  margin: 2px 8px;
  padding: 9px 12px;
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: var(--color-text-primary);
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  text-align: left;
  transition: background var(--transition), color var(--transition);
}
.dw-mega__type-btn:hover { background: var(--color-bg-light-green); }
.dw-mega__type-btn--active {
  background: var(--color-primary-10);
  color: var(--color-primary);
  font-weight: var(--fw-semibold);
}

/* Props panel */
.dw-mega__props-panel {
  flex: 1;
  padding: 18px;
  max-height: 360px;
  overflow-y: auto;
  min-width: 280px;
}
.dw-mega__props-panel::-webkit-scrollbar { width: 4px; }
.dw-mega__props-panel::-webkit-scrollbar-thumb {
  background: var(--color-border-light);
  border-radius: 4px;
}

.dw-mega__props-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}
.dw-mega__props-title {
  font-family: var(--font-secondary);
  font-size: var(--fs-md);
  font-weight: var(--fw-semibold);
  color: var(--color-primary-deep);
  margin-bottom: 0;
}
.dw-mega__props-viewall {
  font-size: var(--fs-xs);
  color: var(--color-primary);
  font-weight: var(--fw-semibold);
  transition: color var(--transition);
}
.dw-mega__props-viewall:hover { color: var(--color-primary-light); }

/* Skeleton loader */
.dw-prop-skeleton {
  display: flex;
  gap: 12px;
  padding: 10px;
  border: 1px solid var(--color-bg-light-green);
  border-radius: var(--radius-md);
  margin-bottom: 8px;
}
.dw-prop-skeleton__thumb {
  width: 74px;
  height: 58px;
  border-radius: 8px;
  background: linear-gradient(90deg, #e8f5ed 25%, #d4ece0 50%, #e8f5ed 75%);
  background-size: 200% 100%;
  animation: dw-shimmer 1.4s infinite;
  flex-shrink: 0;
}
.dw-prop-skeleton__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
  justify-content: center;
}
.dw-prop-skeleton__line {
  height: 11px;
  border-radius: 4px;
  background: linear-gradient(90deg, #e8f5ed 25%, #d4ece0 50%, #e8f5ed 75%);
  background-size: 200% 100%;
  animation: dw-shimmer 1.4s infinite;
}
.dw-prop-skeleton__line--short { width: 55%; }

@keyframes dw-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Prop card */
.dw-prop-card {
  display: flex;
  gap: 12px;
  padding: 10px;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  margin-bottom: 8px;
  text-decoration: none;
  transition: box-shadow var(--transition), background var(--transition);
}
.dw-prop-card:hover {
  box-shadow: 0 4px 16px rgba(0, 91, 82, 0.12);
  background: var(--color-bg-light-green);
}
.dw-prop-card__thumb {
  width: 74px;
  height: 58px;
  border-radius: 8px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  background: var(--gradient-tile);
  overflow: hidden;
}

.dw-prop-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dw-prop-card__body { flex: 1; min-width: 0; }
.dw-prop-card__name {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  color: var(--color-primary-deep);
  line-height: 1.4;
  margin-bottom: 3px;
}
.dw-prop-card__loc {
  font-size: var(--fs-2xs);
  color: var(--color-text-para);
  margin-bottom: 5px;
}
.dw-prop-card__price {
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  margin-bottom: 0 !important;
}

/* Error & empty states */
.dw-mega__error {
  padding: 20px;
  text-align: center;
  font-size: var(--fs-sm);
  color: var(--color-text-para);
}

/* — Header Actions — */
.dw-header__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.dw-btn-icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-primary);
  transition: background var(--transition), color var(--transition), border-color var(--transition);
}
.dw-btn-icon:hover {
  background: var(--color-bg-light-green);
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.dw-btn-icon svg { width: 16px; height: 16px; }

.dw-btn-call {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--gradient-gold);
  color: var(--color-bg-dark);
  /* background: var(--gradient-btn);
  color: var(--color-white); */
  border: none;
  border-radius: var(--radius-sm);
  padding: 9px 16px;
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  white-space: nowrap;
  text-decoration: none;
  transition: opacity var(--transition);
}
.dw-btn-call:hover { opacity: 0.88; }

/* ── Get in touch dropdown  —  .dw-contact-drop ── */
.dw-contact-drop {
  position: relative;
}

.dw-contact-drop__chevron {
  width: 9px;
  height: 9px;
  flex-shrink: 0;
  margin-left: 2px;
  transition: transform 0.22s;
  opacity: 0.8;
}
.dw-btn-call[aria-expanded="true"] .dw-contact-drop__chevron {
  transform: rotate(180deg);
}

.dw-contact-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 210px;
  background: var(--color-white);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
  padding: 8px;
  z-index: 300;
  animation: dw-contact-drop-in 0.18s ease;
}
.dw-contact-menu[hidden] { display: none; }

.dw-contact-menu__item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 11px 14px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: var(--color-text-primary);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: background var(--transition), color var(--transition);
  white-space: nowrap;
}
.dw-contact-menu__item:hover {
  background: var(--color-bg-light-green);
  color: var(--color-primary);
}
.dw-contact-menu__item:hover .dw-contact-menu__icon {
  color: var(--color-primary);
}

.dw-contact-menu__icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--color-bg-light-green);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--color-primary);
  transition: color var(--transition);
}

/* Overlay */
#dw-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 150;
  background: rgba(0, 0, 0, 0.18);
}
#dw-overlay.dw-overlay--active { display: block; }

/* ============================================================
    MOBILE BAR  —  .dw-mob-bar
============================================================ */
.dw-mob-bar {
  display: none;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  height: var(--mob-bar-height);
  background:  var(--gradient-top-header);
  /* background:  var(--header-bg, var(--gradient-top-header));; */
  position: sticky;
  top: 0;
  z-index: 200;
  box-shadow: var(--shadow-sm);
}
.dw-mob-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}


img.dw-mob-logo__image {
  width: auto;
  height: 80px;
  object-fit: contain !important;
}

.dw-mob-actions { display: flex; align-items: center; gap: 6px; }
.dw-mob-icon-btn {
  width: 36px;
  height: 36px;
  background: var(--color-white);
  border: 1px solid var(--color-primary-10);
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-primary);
  position: relative;
  transition: background var(--transition);
}
.dw-mob-icon-btn:hover { background: var(--color-primary);color: var(--color-white); }
.dw-mob-icon-btn svg { width: 18px; height: 18px; }
.dw-mob-badge {
  position: absolute;
  top: -3px;
  right: -3px;
  background: var(--gradient-gold);
  color: var(--color-bg-dark);
  font-size: 9px;
  font-weight: var(--fw-bold);
  width: 15px;
  height: 15px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dw-mob-ham {
  width: 36px;
  height: 36px;
  background: var(--gradient-gold);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity var(--transition);
}
.dw-mob-ham:hover { opacity: 0.88; }
.dw-mob-ham svg { width: 18px; height: 18px; color: var(--color-bg-dark); }

/* ============================================================
    MOBILE DRAWER  —  .dw-drawer
============================================================ */
.dw-drawer {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  top: calc(var(--ticker-height) + var(--mob-bar-height));
  background: var(--color-white);
  z-index: 190;
  overflow-y: auto;
  flex-direction: column;
}
.dw-drawer.dw-drawer--open { display: flex; }
.dw-drawer__section { border-bottom: 1px solid var(--color-bg-light-green); }

.dw-drawer__toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 20px;
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-text-primary);
  background: none;
  border: none;
  text-align: left;
}
.dw-drawer__toggle svg {
  width: 11px;
  height: 11px;
  transition: transform 0.2s;
  flex-shrink: 0;
}
.dw-drawer__toggle[aria-expanded="true"] { color: var(--color-primary); }
.dw-drawer__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

.dw-drawer__link {
  display: block;
  padding: 15px 20px;
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-text-primary);
  text-decoration: none;
}
.dw-drawer__link:hover { color: var(--color-primary); background: var(--color-bg-light-green); }

.dw-drawer__sub {
  display: none;
  background: var(--color-bg-light);
  border-top: 1px solid var(--color-bg-light-green);
}
.dw-drawer__sub.dw-drawer__sub--open { display: block; }

.dw-drawer__sub-links a {
  display: block;
  padding: 11px 28px;
  font-size: var(--fs-sm);
  color: var(--color-neutral-900);
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  transition: color var(--transition), background var(--transition);
}
.dw-drawer__sub-links a:hover {
  background: var(--color-bg-light-green);
  color: var(--color-primary);
}


/* — Mobile contact items  —  .dw-mob-contact__item — */
.dw-mob-contact__item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 20px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: var(--color-text-primary);
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  background: var(--color-bg-light);
  transition: background var(--transition), color var(--transition);
}
.dw-mob-contact__item:last-child { border-bottom: none; }
.dw-mob-contact__item:hover {
  background: var(--color-bg-light-green);
  color: var(--color-primary);
}
.dw-mob-contact__item:hover .dw-mob-contact__icon {
  color: var(--color-primary);
}

.dw-mob-contact__icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--color-white);
  border: 1px solid var(--color-border-light);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--color-primary);
  transition: color var(--transition), border-color var(--transition);
}
.dw-mob-contact__item:hover .dw-mob-contact__icon {
  border-color: var(--color-primary);
}
/* — Mobile Projects Panel — */
.dw-mob-projects { padding: 16px; }

.dw-mob-city-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 10px;
  scrollbar-width: none;
}
.dw-mob-city-tabs::-webkit-scrollbar { display: none; }

.dw-mob-city-tab {
  flex-shrink: 0;
  padding: 6px 13px;
  border-radius: 20px;
  border: 1.5px solid var(--color-border-light);
  font-family: var(--font-primary);
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  color: var(--color-text-para);
  background: var(--color-white);
  white-space: nowrap;
  transition: all var(--transition);
}
.dw-mob-city-tab:hover { border-color: var(--color-primary); color: var(--color-primary); }
.dw-mob-city-tab--active:hover { border-color: var(--color-primary); color: var(--color-white); }
.dw-mob-city-tab--active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white);
}

.dw-mob-type-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 10px 0 14px;
}
.dw-mob-type-pill {
  padding: 5px 12px;
  border-radius: 20px;
  border: 1px solid var(--color-border-light);
  font-family: var(--font-primary);
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  color: var(--color-text-para);
  background: var(--color-white);
  transition: all var(--transition);
}
.dw-mob-type-pill:hover { color: var(--color-primary); border-color: var(--color-primary); }
.dw-mob-type-pill--active {
  background: var(--color-primary-10);
  border-color: var(--color-primary);
  color: var(--color-primary);
  font-weight: var(--fw-semibold);
}

.dw-mob-prop-cards { display: flex; flex-direction: column; gap: 10px; }

.dw-mob-prop-card {
  display: flex;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  background: var(--color-white);
  text-decoration: none;
  transition: box-shadow var(--transition);
}
.dw-mob-prop-card:hover { box-shadow: 0 4px 16px rgba(0, 91, 82, 0.12); }

.dw-mob-prop-card__thumb {
  width: 70px;
  height: 56px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: var(--gradient-tile);
  flex-shrink: 0;
  overflow: hidden;
}

.dw-mob-prop-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dw-mob-prop-card__name {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  color: var(--color-primary-deep);
  line-height: 1.35;
  margin-bottom: 3px;
}
.dw-mob-prop-card__loc {
  font-size: var(--fs-2xs);
  color: var(--color-text-para);
  margin-bottom: 4px;
}
.dw-mob-prop-card__price {
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  margin-bottom: 0;
}

.dw-mob-viewall {
  display: block;
  text-align: center;
  margin-top: 14px;
  padding: 11px;
  border: 1.5px solid var(--color-primary);
  border-radius: var(--radius-md);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  transition: background var(--transition);
}
.dw-mob-viewall:hover { background: var(--color-primary-10); }

/* Skeleton for mobile */
.dw-mob-skeleton {
  display: flex;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--color-bg-light-green);
  border-radius: var(--radius-md);
}
.dw-mob-skeleton__thumb {
  width: 70px;
  height: 56px;
  border-radius: 8px;
  background: linear-gradient(90deg, #e8f5ed 25%, #d4ece0 50%, #e8f5ed 75%);
  background-size: 200% 100%;
  animation: dw-shimmer 1.4s infinite;
  flex-shrink: 0;
}
.dw-mob-skeleton__body { flex: 1; display: flex; flex-direction: column; gap: 8px; justify-content: center; }
.dw-mob-skeleton__line {
  height: 11px;
  border-radius: 4px;
  background: linear-gradient(90deg, #e8f5ed 25%, #d4ece0 50%, #e8f5ed 75%);
  background-size: 200% 100%;
  animation: dw-shimmer 1.4s infinite;
}
.dw-mob-skeleton__line--short { width: 50%; }

/* CTA row */
.dw-drawer__cta-row {
  padding: 16px;
  margin-top: auto;
  border-top: 1px solid var(--color-border-light);
}
.dw-drawer__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px;
  background: var(--gradient-btn);
  color: var(--color-white);
  border: none;
  border-radius: var(--radius-md);
  font-family: var(--font-primary);
  font-size: var(--fs-md);
  font-weight: var(--fw-semibold);
  text-decoration: none;
  transition: opacity var(--transition);
}
.dw-drawer__cta:hover { opacity: 0.88; }



/* ============================================================
   ENQUIRY POPUP  —  .dw-enquiry-*
   All values reference :root tokens. No raw hex outside :root.
============================================================ */

/* Overlay */
.dw-enquiry-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.55);
  align-items: center;
  justify-content: center;
  padding: 16px;
  overflow-y: auto;
}
.dw-enquiry-overlay.dw-enquiry-overlay--open {
  display: flex;
}

/* Modal shell */
.dw-enquiry-modal {
  display: flex;
  width: 100%;
  max-width: 860px;
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: var(--color-white);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.22);
  animation: dw-enquiry-in 0.22s ease;
  position: relative;
}

@keyframes dw-enquiry-in {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Left brand panel ── */
.dw-enquiry-panel {
  width: 42%;
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-10) 100%) , url('../images/enquiry-bg.jpg') center/cover no-repeat;
  /* background: var(--gradient-btn); */
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.dw-home-loan .dw-enquiry-panel {
    background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-10) 100%), url(../images/home-loan-property-keys-house-ownership.webp) center / cover no-repeat;
}

.dw-enquiry-panel__eyebrow {
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-gold-mid);
  margin-bottom: 10px;
}

.dw-enquiry-panel__title {
  font-family: var(--font-secondary);
  font-size: var(--fs-2xl);
  font-weight: var(--fw-bold);
  color: var(--color-white);
  line-height: 1.2;
  margin-bottom: 12px;
}

.dw-enquiry-panel__sub {
  font-size: var(--fs-sm);
  color: rgba(255, 255, 255, 0.72);
  line-height: var(--lh-p);
  margin-bottom: 28px;
}

/* Benefits list */
.dw-enquiry-benefits {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dw-enquiry-benefits__item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: rgba(255, 255, 255, 0.9);
}

.dw-enquiry-benefits__icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  color: var(--color-gold-light);
  flex-shrink: 0;
}

/* City pills */
.dw-enquiry-cities {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.dw-enquiry-cities span {
  padding: 4px 10px;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  color: rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.08);
}

/* ── Right form panel ── */
.dw-enquiry-form-wrap {
  flex: 1;
  padding: 36px 32px 28px;
  position: relative;
  overflow-y: auto;
  max-height: 90vh;
}

.dw-enquiry-form-wrap::-webkit-scrollbar { width: 4px; }
.dw-enquiry-form-wrap::-webkit-scrollbar-thumb {
  background: var(--color-border-light);
  border-radius: 4px;
}

/* Close button */
.dw-enquiry-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--color-border-light);
  background: var(--color-white);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-para);
  cursor: pointer;
  transition: background var(--transition), color var(--transition);
}
.dw-enquiry-close:hover {
  background: var(--color-bg-light-green);
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.dw-enquiry-form__title {
  font-family: var(--font-secondary);
  font-size: var(--fs-h3);
  font-weight: var(--fw-bold);
  color: var(--color-primary-deep);
  margin-bottom: 4px;
}

.dw-enquiry-form__sub {
  font-size: var(--fs-sm);
  color: var(--color-text-para);
  margin-bottom: 24px;
}

/* Form groups */
.dw-ef-group {
  margin-bottom: 16px;
}

.dw-ef-label {
  display: block;
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  color: var(--color-text-primary);
  margin-bottom: 6px;
  letter-spacing: 0.3px;
}
.dw-ef-label span {
  color: #e03;
}

.dw-ef-input ,.dw-ef-select{
  width: 100%;
  padding: 10px 14px;
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  color: var(--color-text-primary);
  background: var(--color-white);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  transition: border-color var(--transition), box-shadow var(--transition);
  outline: none;
  appearance: none;
  -webkit-appearance: none;
}
.dw-ef-input:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-10);
}
.dw-ef-input--error {
  border-color: #e03;
  box-shadow: 0 0 0 3px rgba(238, 0, 51, 0.08);
}
.dw-ef-input::placeholder { color: var(--color-text-para); }

/* Select arrow */
.dw-ef-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236A7282' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
  cursor: pointer;
}

/* Phone row */
.dw-ef-phone-row {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.dw-ef-phone-row:focus-within {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-10);
}
.dw-ef-phone-row .dw-ef-input--phone {
  border: none;
  border-radius: 0;
  box-shadow: none !important;
  flex: 1;
}
.dw-ef-phone-code {
  display: flex;
  align-items: center;
  padding: 0 12px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-text-primary);
  background: var(--color-bg-light-green);
  border-right: 1px solid var(--color-border-light);
  white-space: nowrap;
  flex-shrink: 0;
}

/* Error text */
.dw-ef-error {
  display: block;
  font-size: var(--fs-xs);
  color: #e03;
  margin-top: 4px;
  min-height: 16px;
}
.dw-ef-error:empty {
  display: none;
}

/* Consent checkbox row */
.dw-ef-group--check {
  margin-bottom: 20px;
}
.dw-ef-check-label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
}
.dw-ef-check-label input[type="checkbox"] {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  accent-color: var(--color-primary);
  cursor: pointer;
}
.dw-ef-check-label span {
  font-size: var(--fs-xs);
  color: var(--color-text-para);
  line-height: 1.5;
}
.dw-ef-check-label a {
  color: var(--color-primary);
  text-decoration: underline;
}

/* Submit button */
.dw-ef-submit {
  width: 100%;
  padding: 13px;
  background: var(--gradient-btn-2);
  color: var(--color-white);
  border: none;
  border-radius: var(--radius-md);
  font-family: var(--font-primary);
  font-size: var(--fs-md);
  font-weight: var(--fw-bold);
  cursor: pointer;
  transition: opacity var(--transition);
  margin-bottom: 12px;
}
.dw-ef-submit:hover { opacity: 0.88; }
.dw-ef-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* WhatsApp button */
.dw-ef-whatsapp {
  width: 100%;
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1.5px solid var(--color-primary);
  border-radius: var(--radius-md);
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  text-decoration: none;
  transition: background var(--transition);
}
.dw-ef-whatsapp:hover { background: var(--color-bg-light-green);color: var(--color-primary); }

/* Success state */
.dw-enquiry-success {
  display: none;
  text-align: center;
  padding: 32px 16px;
}
.dw-enquiry-success--show {
  display: block;
  background: var(--color-bg-light-green);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-xl);
}
.dw-enquiry-success__icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--color-bg-light-green);
  border: 2px solid var(--color-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  font-size: 22px;
  color: var(--color-primary);
}
.dw-enquiry-success__title {
  font-family: var(--font-secondary);
  font-size: var(--fs-xl);
  font-weight: var(--fw-bold);
  color: var(--color-primary-deep);
  margin-bottom: 8px;
}
.dw-enquiry-success__msg {
  font-size: var(--fs-sm);
  color: var(--color-neutral-900);
  line-height: var(--lh-p);
  margin-bottom: 0;
}

/* ── Responsive ── */
@media (max-width: 1100px) {
  img.dw-logo__image {
    object-fit: contain !important;
    width: auto;
    height: 60px;
  }

  .dw-nav__link, .dw-nav__trigger {
    padding: 8px 10px;
  }
}

@media (max-width: 680px) {
  .dw-enquiry-modal { flex-direction: column; max-width: 440px; border-radius: var(--radius-xl) var(--radius-xl) 0 0; }
  .dw-enquiry-panel { display: none; }
  .dw-enquiry-panel__title { font-size: var(--fs-xl); }
  .dw-enquiry-benefits { gap: 8px; }
  .dw-enquiry-form-wrap { padding: 24px 20px 20px; max-height: none; }
  .dw-enquiry-overlay {
    padding: 0;
    align-items: flex-end;
  }
}


/* ============================================================
   STICKY SOCIAL BAR  —  .dw-social-bar
============================================================ */
.dw-social-bar {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 500;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  padding: 12px 24px;
}

.dw-social-bar__link {
  border-radius: var(--radius-pill);
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-white);
  text-decoration: none;
  transition: width var(--transition), opacity var(--transition), transform var(--transition);
  opacity: 0.92;
  margin-bottom: 12px;
}
.dw-social-bar__link:hover {
  /* width: 48px; */
  color: var(--color-white);
  transform: scale(1.1);
  opacity: 1;
}

.dw-social-bar__link--instagram { background: linear-gradient(45deg, #F9CE34 0%, #EE2A7B 50%, #6228D7 100%); }
.dw-social-bar__link--youtube    { background: #FF0000; }
.dw-social-bar__link--linkedin   { background: #0A66C2; }
.dw-social-bar__link--whatsapp   { background: #25D366; }

.dw-social-bar__link svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.dw-social-bar__divider {
  width: 1px;
  height: 40px !important;
  background: var(--color-text-para);
  margin: 0 auto;
}

.dw-social-bar__label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-text-para);
  text-shadow: 0 0 6px rgba(0,0,0,0.2);
  margin-top: 8px;
  padding-left: 2px;
}

@media (max-width: 900px) {
  .dw-social-bar { display: none; }
}



/* ============================================================
   SITE FOOTER  —  footer.css
   All classes prefixed .sf-  (site-footer)
   All color/font values reference :root tokens from variables.css
   No raw hex values — only CSS custom properties.
   Zero bleed: nothing here targets elements outside .site-footer
============================================================ */

/* ── Shell ──────────────────────────────────────────────── */
.site-footer {
  background: var(--gradient-footer);
  color: var(--color-white);
  position: relative;
  overflow: hidden;
  font-family: var(--font-primary);
}

/* Subtle noise texture */
.site-footer::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.025'/%3E%3C/svg%3E");
  pointer-events: none;
  opacity: 0.4;
}

/* ── Gold top accent ────────────────────────────────────── */
.sf-accent {
  height: 2px;
  background: linear-gradient(90deg,
    transparent,
    var(--color-gold-mid),
    var(--color-primary-light),
    transparent
  );
}

/* ──  Top Links ──────────────────────────────────────────── */
/* TOP LINKS */
.sf-footer__top {
  padding: 40px 0;
  background: var(--color-bg-light-green);
}

.sf-footer__heading {
  font-family: var(--font-primary);
  font-size: var(--fs-h4);
  font-weight: var(--fw-bold);
  color: var(--color-neutral-900);
  line-height: 1.2;
  margin-bottom: 8px
}

/* .sf-footer__grid-links {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 20px;
} */

.sf-footer__grid-links ul {
  padding: 0;
  column-count: 4;
  gap: 20px;
  margin: 0;
  margin-top: 16px;
  list-style: none;
}

.sf-footer__grid-links ul li {
    margin-bottom: 6px;
}

.sf-footer__grid-links a {
  font-size: var(--fs-sm);
  color: var(--color-neutral-900);
  transition: var(--transition);
}

.sf-footer__grid-links a:hover {
  color: var(--color-primary);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .sf-footer__grid-links {
    grid-template-columns: repeat(2,1fr);
  }
}

@media (max-width: 576px) {
  .sf-footer__grid-links ul li {
    margin-bottom: 0px;
  }
  .sf-footer__grid-links ul {
    column-count: 2;
  }
}

/* ── Main grid ──────────────────────────────────────────── */
.sf-main {
  max-width: 1280px;
  margin: 0 auto;
  padding: 56px 32px 40px;
  display: grid;
  grid-template-columns: 340px 1fr 1fr 360px;
  gap: 48px;
  position: relative;
}

/* ── Brand column ───────────────────────────────────────── */
.sf-brand__trust {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  margin-bottom: 18px;
}

.sf-brand__trust-num {
  font-family: var(--font-secondary);
  font-size: 88px;
  font-weight: var(--fw-bold);
  line-height: 0.85;
  color: var(--color-gold-mid);
  letter-spacing: -4px;
}

.sf-brand__trust-label {
  padding-bottom: 10px;
  line-height: 1.2;
}
.sf-brand__trust-label strong {
  display: block;
  font-size: var(--fs-lg);
  font-weight: var(--fw-bold);
  color: var(--color-gold-light);
  letter-spacing: 1px;
  text-transform: uppercase;
}
.sf-brand__trust-label span {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--footer-color-text);
}

.sf-brand__rera {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--gradient-gold-premium);
  border-radius: var(--radius-sm);
  padding: 7px 12px;
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  color: var(--color-black);
  margin-bottom: 20px;
  letter-spacing: 0.3px;
}
.sf-brand__rera svg { flex-shrink: 0; }

.sf-brand__desc {
  font-size: var(--fs-sm);
  line-height: 1.75;
  color: var(--footer-color-text);
  margin-bottom: 22px;
}

/* Contact list */
.sf-contact {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
  padding: 0;
}
.sf-contact li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--fs-sm);
  color: #c8ddd4;
}
.sf-contact li svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--color-gold-mid);
}
.sf-contact li a {
  color: #c8ddd4;
  text-decoration: none;
  transition: color var(--transition);
}
.sf-contact li a:hover { color: var(--color-gold-light); }

/* Social row */
.sf-social {
  display: flex;
  align-items: center;
  gap: 8px;
}
.sf-social__link {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--footer-color-text);
  text-decoration: none;
  transition: background var(--transition), color var(--transition), border-color var(--transition), transform var(--transition);
}
.sf-social__link:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white);
  transform: translateY(-2px);
}
.sf-social__link svg { width: 15px; height: 15px; }

/* ── Nav columns (Quick Links + Legal) ──────────────────── */
.sf-nav-col__title {
  font-family: var(--font-primary);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-bold);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-gold-mid);
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(201, 165, 90, 0.2);
}

.sf-nav-col__list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sf-nav-col__list li a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  font-size: var(--fs-sm);
  color: var(--footer-color-text);
  text-decoration: none;
  border-radius: var(--radius-sm);
  transition: color var(--transition), padding-left var(--transition);
}

.sf-nav-col__list li a:hover {
  color: var(--color-gold-light);
  padding-left: 4px;
}


/* ── Newsletter column ──────────────────────────────────── */
.sf-newsletter__title {
  font-family: var(--font-primary);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-bold);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-gold-mid);
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(201, 165, 90, 0.2);
}

.sf-newsletter__desc {
  font-size: var(--fs-sm);
  line-height: 1.7;
  color: var(--footer-color-text);
  margin-bottom: 18px;
}

/* Success state */
.sf-newsletter__success {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(0, 91, 82, 0.25);
  border: 1px solid rgba(0, 91, 82, 0.45);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  font-size: var(--fs-sm);
  color: #7adfc0;
  margin-bottom: 8px;
}
.sf-newsletter__success[hidden] { display: none; }

/* Error state */
.sf-newsletter__error {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(224, 51, 51, 0.12);
  border: 1px solid rgba(224, 51, 51, 0.3);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  font-size: var(--fs-sm);
  color: #f08080;
  margin-bottom: 8px;
}
.sf-newsletter__error[hidden] { display: none; }

/* Form */
.sf-newsletter__form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 8px;
}
.sf-newsletter__row {
  display: flex;
  gap: 8px;
}
.sf-newsletter__input {
  flex: 1;
  padding: 11px 14px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--radius-md);
  font-size: var(--fs-sm);
  color: var(--color-white);
  font-family: var(--font-primary);
  outline: none;
  transition: border-color var(--transition), background var(--transition);
}
.sf-newsletter__input::placeholder { color: var(--footer-color-text); }
.sf-newsletter__input:focus {
  border-color: var(--color-gold-mid);
  background: rgba(255, 255, 255, 0.1);
}
.sf-newsletter__input--error {
  border-color: #e03;
}

.sf-newsletter__btn {
  padding: 11px 18px;
  background: var(--gradient-orange);
  color: var(--color-white);
  border: none;
  border-radius: var(--radius-md);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  cursor: pointer;
  white-space: nowrap;
  font-family: var(--font-primary);
  display: flex;
  align-items: center;
  gap: 6px;
  transition: opacity var(--transition), transform var(--transition);
}
.sf-newsletter__btn:hover { opacity: 0.88; transform: translateY(-1px); }
.sf-newsletter__btn:disabled { opacity: 0.55; cursor: not-allowed; transform: none; }

.sf-newsletter__privacy {
  font-size: var(--fs-xs);
  color: var(--footer-color-text);
  display: flex;
  align-items: center;
  gap: 5px;
}
.sf-newsletter__privacy svg { flex-shrink: 0; }

/* ── Visitor counter ────────────────────────────────────── */
.sf-visitor {
  margin-top: 20px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: var(--radius-md);
  padding: 14px 16px;
}

.sf-visitor__label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: var(--fs-2xs);
  font-weight: var(--fw-semibold);
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--footer-color-text);
  margin-bottom: 12px;
}

.sf-visitor__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-primary-light);
  animation: sf-pulse 2s ease-in-out infinite;
  flex-shrink: 0;
}

@keyframes sf-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.5; transform: scale(0.75); }
}

.sf-visitor__digits {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.sf-digit-box {
  width: 30px;
  height: 36px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-primary);
  font-size: 17px;
  font-weight: var(--fw-bold);
  color: var(--color-white);
  position: relative;
  overflow: hidden;
  /* entrance animation applied via JS */
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
/* Horizontal midline divider inside each digit box */
.sf-digit-box::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: rgba(255, 255, 255, 0.06);
}

.sf-digit-sep {
  display: flex;
  align-items: center;
  font-size: var(--fs-sm);
  color: var(--footer-color-text);
  padding-bottom: 2px;
}

/* ── Divider ────────────────────────────────────────────── */
.sf-divider {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  max-width: 1280px;
  margin: 0 auto;
}

/* ── Bottom bar ─────────────────────────────────────────── */
.sf-bottom {
  max-width: 1280px;
  margin: 0 auto;
  padding: 20px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.sf-bottom__copy {
  font-size: var(--fs-xs);
  color: var(--footer-color-text);
}
.sf-bottom__copy a {
  color: var(--footer-color-text);
  text-decoration: none;
  transition: color var(--transition);
}
.sf-bottom__copy a:hover { color: var(--color-gold-light); }

.sf-bottom__powered {
  font-size: var(--fs-xs);
  color: var(--footer-color-text);
}
.sf-bottom__powered a {
  color: var(--color-primary-light);
  text-decoration: none;
  font-weight: var(--fw-medium);
  transition: color var(--transition);
}
.sf-bottom__powered a:hover { color: var(--color-gold-light); }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 1100px) {
  .sf-main {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
  }
  .sf-brand      { grid-column: 1 / -1; }
  .sf-newsletter { grid-column: 1 / -1; }
  .sf-newsletter__row { flex-direction: row; }
}

@media (max-width: 640px) {
  .sf-main {
    grid-template-columns: 1fr;
    padding: 36px 20px 28px;
    gap: 28px;
  }
  .sf-brand       { grid-column: auto; }
  .sf-newsletter  { grid-column: auto; }
  .sf-brand__trust-num { font-size: 72px; }
  .sf-newsletter__row  { flex-direction: column; }
  .sf-newsletter__btn  { width: 100%; justify-content: center; }
  .sf-bottom {
    flex-direction: column;
    align-items: flex-start;
    padding: 16px 20px;
    gap: 8px;
  }
  .sf-visitor__digits { gap: 3px; }
  .sf-digit-box { width: 26px; height: 32px; font-size: 15px; }
  .sf-nav-col__list li a { font-size: var(--fs-md); padding: 8px 0; }
}

@media (max-width: 400px) {
  .sf-brand__trust-num       { font-size: 60px; }
  .sf-brand__trust-label strong { font-size: var(--fs-sm); }
}




/* ============================================================
    HERO SECTION
============================================================ */

    /* ============================================================
       DW-HERO SECTION
    ============================================================ */
    .dw-hero {
      position: relative;
      width: 100%;
      min-height: var(--hero-height);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      /* overflow: hidden; */
    }

    /* ── Media Layer ── */
    .dw-hero__media {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 0;
    }
    .dw-hero__video,
    .dw-hero__img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }
    .dw-hero__fallback {
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, rgba(0,23,22,0.15) 0%, rgba(0,23,22,0.5) 100%),
        url('../images/hero-bg.png') center/cover no-repeat;
    }
    .dw-hero__media-shimmer {
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, var(--color-bg-dark) 0%, #0a1f1e 50%, var(--color-bg-dark) 100%);
      z-index: 1;
      transition: opacity 0.6s ease;
    }
    .dw-hero__media-shimmer.dw-hidden { opacity: 0; pointer-events: none; }

    /* Cinematic overlay */
    .dw-hero__overlay {
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(180deg, rgba(0,23,22,0.22) 0%, rgba(0,23,22,0.42) 45%, rgba(0,23,22,0.72) 100%),
        radial-gradient(ellipse 80% 60% at 50% 40%, transparent 30%, rgba(0,23,22,0.32) 100%);
    }
    /* Grain texture */
    .dw-hero__grain {
      position: absolute;
      inset: 0;
      z-index: 2;
      opacity: 0.034;
      pointer-events: none;
      /* background-image: url("../images/hero-bg.png"); */
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' 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)'/%3E%3C/svg%3E");
    }

    /* ── Content ── */
    .dw-hero__content {
      position: relative;
      z-index: 10;
      width: 100%;
      max-width: 860px;
      padding: 0 20px;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    /* Badge */
    .dw-hero__badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(0,91,82,0.22);
      border: 1px solid var(--color-primary);
      color: var(--color-white);
      font-size: 0.7rem;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      padding: 6px 14px;
      border-radius: var(--radius-pill);
      margin-bottom: 18px;
      backdrop-filter: blur(8px);
      animation: dw-fadeDown 0.6s ease both;
    }
    .dw-hero__badge::before {
      content: '';
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--color-primary-light);
      animation: dw-pulse 2s ease infinite;
    }
    @keyframes dw-pulse {
      0%,100% { opacity:1; transform:scale(1); }
      50% { opacity:0.4; transform:scale(0.65); }
    }

    /* Headline */
    .dw-hero__headline {
      font-family: var(--font-primary);
      /* font-size: ; */
      /* font-size: clamp(var(--fs-h3), var(--fs-h2), var(--fs-h1)); */
      font-size: clamp(2.2rem, 4.5vw, 3rem);
      font-weight: 700;
      line-height: 1.08;
      letter-spacing: -0.01em;
      color: var(--color-white);
      margin-bottom: 14px;
      animation: dw-fadeDown 0.6s 0.1s ease both;
    }
    .dw-hero__headline mark {
      background: var(--gradient-gold-premium);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      padding: 0;
    }
    .dw-hero__headline em {
      font-style: italic;
      color: var(--color-gold-light);
    }

    /* Subheadline */
    .dw-hero__sub {
      font-size: clamp(0.88rem, 1.7vw, 1.02rem);
      font-weight: 300;
      color: var(--hero-text-muted);
      max-width: 510px;
      line-height: 1.65;
      margin-bottom: 28px;
      animation: dw-fadeDown 0.6s 0.18s ease both;
    }

    .dw-hero__search-container{
      width: 100%;
      background: rgba(255,255,255,0.09);
      border: 1px solid rgba(255,255,255,0.16);
      border-radius: var(--radius-md);
      padding: 10px;
            backdrop-filter: blur(12px);
      animation: dw-fadeDown 0.6s 0.24s ease both;
      margin-bottom: 22px;

    }

    /* ── Filter Tabs ── */
    .dw-hero__filters {
      display: flex;
      align-items: center;
      gap: 3px;
      /* background: rgba(255,255,255,0.09); */
      /* border: 1px solid rgba(255,255,255,0.16); */
      /* border-radius: var(--radius-pill); */
      /* padding: 4px; */
      margin-bottom: 6px;
      /* backdrop-filter: blur(12px); */
      /* animation: dw-fadeDown 0.6s 0.24s ease both; */
      flex-wrap: wrap;
      justify-content: center;
    }
    .dw-hero__filter-btn {
      background: transparent;
      border: none;
      border-bottom: 2px solid transparent;
      color: rgba(255,255,255,0.68);
      font-family: var(--font-body);
      font-size: 0.8rem;
      font-weight: 500;
      padding: 7px 17px;
      /* border-radius: var(--radius-pill); */
      cursor: pointer;
      transition: var(--transition);
      white-space: nowrap;
      letter-spacing: 0.02em;
    }
    .dw-hero__filter-btn:hover {
      color: var(--color-white);
      background: transparent;
    }
    .dw-hero__filter-btn.dw-active {
      border-bottom: 2px solid var(--color-white);
      background: transparent;
      color: var(--color-white);
      font-weight: 600;
      /* box-shadow: 0 2px 12px rgba(0,91,82,0.5); */
    }

    /* ── Search Bar ── */
    .dw-hero__search-wrap {
      position: relative;
      width: 100%;
      /* max-width: 650px; */
      animation: dw-fadeDown 0.6s 0.3s ease both;
    }
    .dw-hero__search-box {
      display: flex;
      align-items: center;
      background: var(--hero-search-bg);
      border-radius: var(--radius-md);
      box-shadow: 0 4px 32px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.14);
      overflow: visible;
      position: relative;
    }
    .dw-hero__search-icon {
      flex-shrink: 0;
      width: 19px; height: 19px;
      margin-left: 18px;
      color: #888;
    }
    .dw-hero__search-input {
      flex: 1;
      border: none;
      outline: none;
      background: transparent;
      font-family: var(--font-body);
      font-size: 0.93rem;
      color: var(--color-text-primary);
      padding: 15px 10px;
      min-width: 0;
    }
    .dw-hero__search-input::placeholder { color: #aaa; }
    .dw-hero__search-clear {
      background: none;
      border: none;
      padding: 0 8px;
      cursor: pointer;
      color: #bbb;
      font-size: 1.1rem;
      line-height: 1;
      display: none;
      align-items: center;
      transition: color 0.2s;
    }
    .dw-hero__search-clear:hover { color: #555; }
    .dw-hero__search-clear.dw-visible { display: flex; }
    .dw-hero__search-btn {
      flex-shrink: 0;
      background: var(--gradient-btn-2);
      color: var(--color-white);
      border: none;
      border-radius: var(--radius-md);
      font-family: var(--font-body);
      font-size: 0.88rem;
      font-weight: 600;
      padding: 11px 26px;
      margin: 4px;
      cursor: pointer;
      transition: var(--transition);
      white-space: nowrap;
      letter-spacing: 0.02em;
    }
    .dw-hero__search-btn:hover {
      background: var(--color-primary-dark);
      transform: translateY(-1px);
      box-shadow: 0 4px 16px rgba(0,91,82,0.45);
    }

    /* Autocomplete dropdown */
    .dw-hero__autocomplete {
      position: absolute;
      top: calc(100% + 8px);
      left: 0; right: 0;
      background: var(--color-white);
      border-radius: var(--radius-lg);
      box-shadow: 0 8px 40px rgba(0,0,0,0.22);
      overflow: hidden;
      z-index: 100;
      display: none;
      max-height: 250px;
      /* max-height: 340px; */
      overflow-y: auto;
    }
    .dw-hero__autocomplete.dw-open { display: block; }
    .dw-hero__ac-section {
      padding: 8px 0;
      border-bottom: 1px solid #f0f0f0;
      text-align: left;
    }
    .dw-hero__ac-section:last-child { border-bottom: none; }
    .dw-hero__ac-label {
      font-size: 0.67rem;
      font-weight: 600;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: #aaa;
      padding: 4px 16px 6px;
    }
    .dw-hero__ac-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 16px;
      cursor: pointer;
      transition: background 0.14s;
      color: #222;
      font-size: 0.87rem;
      text-decoration: none;
    }
    .dw-hero__ac-item:hover,
    .dw-hero__ac-item.dw-highlighted { background: #edf5f3; }
    .dw-hero__ac-icon {
      width: 30px; height: 30px;
      border-radius: 8px;
      background: #e8f5f0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.95rem;
      flex-shrink: 0;
      color: var(--color-primary);
    }
    .dw-hero__ac-name { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .dw-hero__ac-sub { font-size: 0.73rem; color: #999; margin-top: 1px; }
    .dw-hero__ac-tag {
      font-size: 0.67rem;
      background: #e8f5f0;
      color: var(--color-primary-dark);
      padding: 2px 7px;
      border-radius: 4px;
      font-weight: 600;
      flex-shrink: 0;
    }
    .dw-hero__ac-loading {
      padding: 16px;
      text-align: center;
      color: #aaa;
      font-size: 0.84rem;
    }
    .dw-hero__ac-highlight { color: var(--color-primary); font-weight: 600; }

    /* ── Recent Searches ── */
    .dw-hero__recent {
      width: 100%;
      max-width: 650px;
      display: flex;
      align-items: center;
      gap: 7px;
      flex-wrap: wrap;
      justify-content: center;
      animation: dw-fadeDown 0.6s 0.36s ease both;
      margin-bottom: 22px;
    }
    .dw-hero__recent-label {
      font-size: 0.74rem;
      color: var(--hero-text-muted);
    }
    .dw-hero__recent-tag {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      background: var(--hero-pill-bg);
      border: 1px solid var(--hero-pill-border);
      color: rgba(255,255,255,0.86);
      font-size: 0.77rem;
      padding: 5px 12px;
      border-radius: var(--radius-pill);
      cursor: pointer;
      transition: var(--transition);
      backdrop-filter: blur(6px);
      text-decoration: none;
    }
    .dw-hero__recent-tag:hover {
      background: rgba(0,91,82,0.22);
      border-color: rgba(0,153,102,0.45);
      color: #6ee8d4;
    }

    .dw-header-search-popup  .dw-hero__recent-label {
      font-size: 0.74rem;
      color: var(--para);
    }
    .dw-header-search-popup  .dw-header-recent-wrap {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      background: var(--color-primary-10);
      border: 1px solid var(--color-primary);
      color: var(--color-primary);
      font-size: 0.77rem;
      padding: 5px 12px;
      border-radius: var(--radius-pill);
      cursor: pointer;
      transition: var(--transition);
      backdrop-filter: blur(6px);
      text-decoration: none;
    }
    .dw-header-search-popup  .dw-header-recent-wrap:hover {
      background: rgba(0,91,82,0.22);
      border-color: rgba(0,153,102,0.45);
      color: var(--color-primary);
    }
    .dw-header-search-popup .dw-hero__recent-tag {
      background: #ffffff00 !important;
    padding: 0;
    backdrop-filter: none;
    color: var(--color-primary);
    border: none;
    border-radius: 0;
    }
    .dw-header-search-popup  .dw-hero__recent-remove {
          background: none;
          border: none;
          color: var(--raw-error);
      }

    /* ── Popular Localities ── */
    .dw-hero__localities {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-start;
      animation: dw-fadeDown 0.6s 0.42s ease both;
    }
    .dw-hero__loc-label {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 0.74rem;
      color: var(--hero-text-muted);
      white-space: nowrap;
    }
    .dw-hero__loc-label svg { width: 13px; height: 13px; opacity: 0.65; }
    .dw-hero__loc-chip {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      background: var(--hero-pill-bg);
      border: 1px solid var(--hero-pill-border);
      color: rgba(255,255,255,0.86);
      font-size: 0.77rem;
      font-weight: 400;
      padding: 5px 12px;
      border-radius: var(--radius-sm);
      cursor: pointer;
      transition: var(--transition);
      backdrop-filter: blur(6px);
      text-decoration: none;
      white-space: nowrap;
    }
    .dw-hero__loc-chip:hover {
      background: rgba(0,91,82,0.2);
      border-color: rgba(0,153,102,0.42);
      color: #6ee8d4;
    }
    /* .dw-hero__loc-chip::after { content: '→'; font-size: 0.68rem; opacity: 0.55; } */

    .dw-hero__loc-chip::after {
      content: '';
      width: 12px;
      height: 12px;
      display: inline-block;
      margin-left: 4px;
      opacity: 0.6;
      background-color: currentColor;

      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E") no-repeat center;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E") no-repeat center;

      -webkit-mask-size: contain;
      mask-size: contain;
    }

    /* ── Scroll Indicator ── */
    .dw-hero__scroll {
      position: absolute;
      bottom: 32px;
      left: 50%;
      transform: translateX(-50%) !important;
      z-index: 10;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 5px;
      animation: dw-fadeDown 1s 0.9s ease both;
    }
    .dw-hero__scroll-mouse {
      width: 21px; height: 33px;
      border: 2px solid rgba(255,255,255,0.35);
      border-radius: 11px;
      display: flex;
      justify-content: center;
      padding-top: 5px;
    }
    .dw-hero__scroll-dot {
      width: 3px; height: 6px;
      background: var(--color-gold-mid);
      border-radius: 2px;
      animation: dw-scrollDot 1.8s ease infinite;
    }
    .dw-hero__scroll-label {
      font-size: 0.63rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.4);
    }
    @keyframes dw-scrollDot {
      0%   { opacity:1; transform:translateY(0); }
      80%  { opacity:0; transform:translateY(12px); }
      100% { opacity:0; transform:translateY(0); }
    }

    /* ── Animations ── */
    @keyframes dw-fadeDown {
      from { opacity:0; transform:translateY(-14px); }
      to   { opacity:1; transform:translateY(0); }
    }

/* ============================================================
   AD SLIDER SECTION
============================================================ */
.dw-ads {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.dw-ads__track-wrap {
  width: 100%;
  overflow: hidden;
}
.dw-ads__track {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.dw-ads__slide {
  flex: 0 0 100%;
  width: 100%;
  box-shadow: var(--shadow-md);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.dw-ads__slide-link {
  display: block;
  width: 100%;
  line-height: 0; /* removes bottom gap under img */
}
/* .dw-ads__slide-img {
  width: 100%;
  min-height: 220px;
  object-fit: cover;
  object-position: center;
  display: block;
} */
.dw-ads__slide-img {
  width: 100%;
  height: auto;        /* ← full natural height, nothing cut */
  object-fit: unset;   /* ← remove cover cropping */
  display: block;
  border-radius: var(--radius-md);
}

.dw-ads__container {
  position: relative;
}

/* Nav arrows */
.dw-ads__arrow ,.dw-swiper-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  background: var(--color-white);
  border: none;
  color: var(--color-primary);
  width: 38px; height: 38px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  backdrop-filter: blur(6px);
  box-shadow: var(--shadow-md);
}
.dw-ads__arrow:hover ,.dw-swiper-btn:hover { background: var(--color-primary);color: var(--color-white); }
.dw-ads__arrow-prev ,#dw-swiper-prev  { left: -12px; }
.dw-ads__arrow-next ,#dw-swiper-next { right: -12px; }

/* Dots */
.dw-ads__dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  padding: 10px 0 12px;
  position: relative;
  /* background: var(--color-bg-dark, #111); */
}
.dw-ads__dot{
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--color-primary-10);
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  padding: 0;
}
.dw-ads__dot.dw-active {
  background: var(--color-primary-light, #009966);
  width: 22px;
  border-radius: 20px;
}


/* ============================================================
    RESPONSIVE
============================================================ */
@media (min-width: 768px) {
  .dw-hero__scroll { bottom: 10px; }
  .dw-hero__content { padding: 0 40px; }
}
@media (max-width: 600px) {
.dw-ads__slide-img { height: 160px; }

  .dw-hero__filter-btn { padding: 6px 11px; font-size: 0.76rem; }
  .dw-hero__search-btn { padding: 10px 18px; font-size: 0.83rem; }
  .dw-hero__scroll { bottom: 5px; }
}


/* ============================================================
    new launch section
============================================================ */
.dw-section {
  padding: 48px 0 60px;
  position: relative
}

/* .dw-container {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 24px
} */

.dw-section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap
}

.dw-section-header__text {}

.dw-section-header__eyebrow ,.dw-video__eyebrow {
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-gold-mid);
  margin-bottom: 8px
}

.dw-section-header__title {
  font-family: var(--font-primary);
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
  color: var(--color-bg-dark);
  line-height: 1.2;
  margin-bottom: 8px
}

.cta-section .dw-section-header__title {
  color: var(--color-white);
}

.dw-section-header__title mark {
  background: var(--color-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  padding: 0;
}

.cta-section .dw-section-header__title mark {
  background: var(--gradient-gold-premium);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  padding: 0;
}

.dw-section-header__sub {
  font-size: var(--fs-sm);
  color: var(--color-text-para);
  max-width: 800px;
  line-height: 1.6;
  margin-bottom: 0;
}


.dw-section-header__cta {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--gradient-btn-2);
  color: var(--color-white);
  border: none;
  border-radius: var(--radius-sm);
  padding: 11px 20px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  white-space: nowrap;
  transition: opacity var(--transition);
  /* align-self: flex-start; */
  margin-top: 4px
}
.dw-section-header__anchor,.dw-video-card__anchor  {
  color: var(--color-primary);
  font-size: var(--fs-p);
  font-weight: var(--fw-semibold);
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 5px;
  transition: opacity var(--transition);
}

.dw-section-header__anchor svg,.dw-video-card__anchor svg {
  width: 16px;
  height: 16px;
  margin-left: 4px;
}

.dw-video-card__meta {
  font-size: var(--fs-xs);
  color: var(--color-text-para);
  margin-bottom: 10px;
}

.dw-section-header__cta:hover {
  opacity: .88
}

.dw-section-header__cta svg {
  width: 16px;
  height: 16px
}

  .dw-grid {
    display: flex;
    gap: 16px;
    align-items: stretch;
  }

  /* ── BASE CARD ── */
  .dw-expand-card {
    flex-grow: 1;
    position: relative;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255,255,255,0.1);
    background: #1a2f2e;
    cursor: pointer;
    overflow: hidden;
    transition:
      box-shadow var(--transition-fast),
      transform var(--transition-fast),
      grid-column var(--transition-slow),
      grid-row var(--transition-slow);
  }
  .dw-expand-card:hover { box-shadow: 0 16px 48px rgba(0,0,0,0.4); transform: translateY(-2px); }

  /* ── COLLAPSED STATE ── */
  .dw-expand-card__collapsed-inner {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }

  .dw-expand-card__media {
    position: absolute;
    inset: 0;
    overflow: hidden;
  }
  .dw-expand-card__img {
    width: 100%; height: 100%;
    /* max-height: 400px; */
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
  }
  .dw-expand-card:hover .dw-expand-card__img { transform: scale(1.04); }

  .dw-expand-card__overlay {
    position: absolute;
    inset: 0;
    /* background: linear-gradient(0deg, rgba(0,15,14,0.88) 0%, rgba(0,15,14,0.3) 50%, transparent 100%); */
    z-index: 1;
  }

  /* Info shown in collapsed state */
  .dw-expand-card__collapsed-info {
    position: relative;
    z-index: 2;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  .dw-expand-card__builder-logo {
    width: 60px;
    height: 60px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(255,255,255,0.15);
    margin-bottom: 8px;
  }
  .dw-expand-card__builder-logo img {
    width: 100%; height: 100%; object-fit: contain;
  }

  .dw-expand-card__featured-name {
    font-family: var(--font-primary);
    font-size: var(--fs-h3);
    font-weight: var(--fw-semibold);
    color: var(--color-white);
    line-height: 1.2;
  }
  .dw-expand-card__featured-loc {
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.65);
  }

  /* Expand hint */
  .dw-expand-card__expand-hint {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition-fast), transform var(--transition-fast);
  }
  .dw-expand-card:hover .dw-expand-card__expand-hint { background: rgba(255,255,255,0.25); transform: scale(1.1); }
  .dw-expand-card__expand-hint svg { width: 12px; height: 12px; stroke: var(--color-white); fill: none; }

  /* ── ACTIVE / EXPANDED CARD ── */
  .dw-expand-card--active {
    flex: 0 1 70%;
    /* grid-column: 1 / 3;
    grid-row: 1 / 2; */
    display: flex;
    /* grid-template-columns: 1fr 1fr; */
    background: var(--color-border-light);
    border: 5px solid var(--color-border-light);
    overflow: visible;
    cursor: default;
  }
  .dw-expand-card--active:hover { transform: none; }

  .dw-expand-card__info-panel {
    flex: 0 1 40%;
    padding: 48px 24px 28px 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: var(--color-border-light);
    position: relative;
  }

  .dw-expand-card--active .dw-expand-card__media {
    flex-grow: 1;
    position: relative;
    height: 400px;
    max-height: 400px;
    /* min-height: 400px; */
    overflow: hidden;
    border-radius: var(--radius-lg);
  }

  /* Featured badge (ribbon) */
  .dw-expand-card__featured-badge {
    position: absolute;
    top: 16px;
    left: -16px;
    display: inline-block;
    background: #ff003c;
    color: var(--color-white);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    padding: 4px 10px;
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  }
  .dw-expand-card__featured-badge::after {
    content: "";
    position: absolute;
    left: 0; bottom: -12px;
    width: 0; height: 0;
    border-top: 12px solid #b8002c;
    border-left: 12px solid transparent;
  }

  .dw-expand-card__featured-name--panel {
    font-family: var(--font-primary);
    font-size: var(--fs-h3);
    font-weight: var(--fw-bold);
    color: var(--color-primary-deep);
    line-height: 1.15;
    margin-bottom: 6px;
  }
  .dw-expand-card__featured-loc--panel {
    font-size: var(--fs-p);
    color: var(--color-text-para);
    margin-bottom: 16px;
  }
  .dw-expand-card__featured-price {
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    color: var(--color-primary);
    margin-bottom: 0px;
  }
  .dw-expand-card__featured-price-note {
    font-size: var(--fs-p);
    color: var(--color-text-para);
    margin-bottom: 16px;
  }
  .dw-expand-card__types {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 20px;
  }
  .dw-expand-card__type-pill {
    border: 1.5px solid var(--color-border-light);
    border-radius: var(--radius-pill);
    padding: 4px 12px;
    font-size: var(--fs-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-para);
    background: var(--color-white);
  }
  .dw-expand-card__btn-primary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--gradient-gold-premium);
    color: var(--color-bg-dark);
    border: none;
    border-radius: var(--radius-md);
    padding: 13px 20px;
    font-size: var(--fs-sm);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: opacity var(--transition-fast);
    width: 100%;
  }
  .dw-expand-card__btn-primary:hover { opacity: 0.88; }
  .dw-expand-card__btn-primary svg { width: 16px; height: 16px; }

  /* builder container on active card */
  .dw-expand-card__builder-container {
    position: absolute;
    bottom: 12px; left: 12px; right: 12px;
    z-index: 3;
    background: rgba(255,255,255,0.4);
    border: 1px solid rgba(255,255,255,0.16);
    backdrop-filter: blur(12px);
    border-radius: var(--radius-md);
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .dw-expand-card__builder-logo--lg {
    width: 60px; height: 60px;
    border-radius: var(--radius-sm);
    background: var(--color-white);
    border: 1px solid #eee;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
  }
  .dw-expand-card__builder-logo--lg img { width: 100%; height: 100%; object-fit: contain; }
  .dw-expand-card__builder-wrapper { display: flex; flex-direction: column; gap: 2px; }
  .dw-expand-card__builder-name {
    font-size: var(--fs-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-primary);
  }
  .dw-expand-card__builder-viewall {
    font-size: var(--fs-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-primary);
    text-decoration: none;
  }

  /* share button */
  .dw-expand-card__featured-share {
    position: absolute;
    top: 14px; right: 14px;
    z-index: 4;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,0.92);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    cursor: pointer;
    transition: background var(--transition-fast), transform var(--transition-fast);
  }
  .dw-expand-card__featured-share:hover { background: var(--color-white); transform: scale(1.1); }
  .dw-expand-card__featured-share svg { width: 16px; height: 16px; }

  /* close btn */
  .dw-expand-card__close-btn {
    position: absolute;
    top: 10px; right: 10px;
    z-index: 10;
    width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(0,45,44,0.12);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background var(--transition-fast), transform var(--transition-fast);
  }
  .dw-expand-card__close-btn:hover { background: rgba(0,45,44,0.2); transform: scale(1.1); }
  .dw-expand-card__close-btn svg { width: 12px; height: 12px; stroke: var(--color-primary-deep); fill: none; stroke-width: 2.5; }

  /* ── CONTENT ANIMATION CLASSES ── */
  .dw-anim-fade {
    opacity: 0;
    transform: translateY(10px);
    transition:
      opacity var(--transition-med),
      transform var(--transition-med);
  }
  .dw-anim-fade.visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* stagger delays */
  .dw-anim-fade:nth-child(1) { transition-delay: 0.05s; }
  .dw-anim-fade:nth-child(2) { transition-delay: 0.12s; }
  .dw-anim-fade:nth-child(3) { transition-delay: 0.19s; }
  .dw-anim-fade:nth-child(4) { transition-delay: 0.26s; }
  .dw-anim-fade:nth-child(5) { transition-delay: 0.33s; }
  .dw-anim-fade:nth-child(6) { transition-delay: 0.40s; }

  /* collapsed info fade */
  .dw-expand-card__collapsed-info { transition: opacity var(--transition-med); }
  .dw-expand-card--expanding .dw-expand-card__collapsed-info { opacity: 0; }

  @media(max-width: 700px) {
    .dw-grid,.dw-expand-card--active, .dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__builder-wrapper { flex-direction: column !important; }
    /* .dw-expand-card--active { grid-column: 1/-1; grid-template-columns: 1fr; } */
    .dw-expand-card--active .dw-expand-card__media { height: 220px; max-height: 220px; border-radius: var(--radius-lg); }
    .dw-expand-card--active .dw-expand-card__info-panel { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }

    .dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__featured-name, .dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__featured-loc {
      writing-mode: inherit !important;
      transform: unset !important;
      margin-bottom: 0 !important;
    }

    .dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__collapsed-info {
      flex-direction: row !important;
    }
    .dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__builder-logo img {
        transform: unset !important;
    }

    .dw-expand-card__collapsed-inner {
        min-height: 80px !important;
    }
  }

.dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__collapsed-info {
    flex-direction: column-reverse;
    align-items: center;
}

.dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__builder-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 2px;
}

.dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__featured-name,
.dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__featured-loc {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__builder-logo {
  margin-bottom: 0px;
}

.dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__builder-logo img {
  transform: rotate(270deg);
}

.dw-expand-card:not(.dw-expand-card--active) .dw-expand-card__overlay {
  background: rgb(0 0 0 / 60%);
}

.dw-share-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--color-primary-deep);
  color: #fff;
  border-radius: var(--radius-md);
  padding: 10px 20px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  z-index: 9999;
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
  white-space: nowrap;
  box-shadow: var(--shadow-md)
}

.dw-share-toast.visible {
  opacity: 1
}

.dw-card__link {
  position: absolute;
  inset: 0;
  z-index: 2;
}

.dw-expand-card__btn-primary,
/* .dw-expand-card__featured-share, */
.dw-expand-card__builder-container a {
  position: relative;
  z-index: 5;
}



/* ============================================================
   VIDEO CARD (unchanged styles — your exact CSS)
============================================================ */
.dw-video-card {
  cursor: pointer;
}

.dw-video-card__media {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

.dw-video-card__media img {
  width: 100%;
  min-height: 180px;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  transition: transform var(--transition-med);
  display: block;
}

.dw-video-card:hover img {
  transform: scale(1.06);
}

.dw-video-card__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--transition);
}

.dw-video-card:hover .dw-video-card__overlay {
  background: rgba(0,0,0,0.45);
}

.dw-video-card__play {
  width: 48px;
  height: 48px;
  background: rgba(255,255,255,0.9);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-primary);
  font-size: 14px;
  transition: transform var(--transition), background var(--transition);
}

.dw-video-card:hover .dw-video-card__play {
  transform: scale(1.12);
  background: var(--color-white);
}

.dw-video-card__caption {
  margin-top: 0.5rem;
}

.dw-video-card__meta {
  font-size: var(--fs-xs);
  color: var(--color-text-para);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.dw-video-card__caption .dw-video-card__title {
  font-size: var(--fs-h5);
  font-weight: var(--fw-semibold);
  color: var(--color-black);
  margin-bottom: 8px;
}

/* ============================================================
   VIDEO GRID — 4 cards or fewer: CSS grid, no swiper
============================================================ */
.dw-video__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

/* ============================================================
   SWIPER WRAPPER — active when > 4 cards
============================================================ */
.dw-video__swiper-wrapper {
  display: none;
  position: relative;
}

.dw-video__swiper-wrapper.active {
  display: block;
}

.dw-video__grid.hidden {
  display: none;
}

.dw-video #dw-video-pagination .swiper-pagination-bullet {
  background: var(--color-bg-dark);
}

.dw-video #dw-video-pagination .swiper-pagination-bullet-active {
      background: var(--color-primary);
}

/* Swiper custom nav */
/* .dw-swiper-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  justify-content: center;
}

.dw-swiper-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid var(--color-primary);
  background: var(--color-white);
  color: var(--color-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background var(--transition), color var(--transition);
  flex-shrink: 0;
}

.dw-swiper-btn:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

.dw-swiper-btn svg {
  width: 18px;
  height: 18px;
}

.dw-video__swiper .swiper-slide {
  height: auto;
}

/* Swiper pagination dots */
/* .dw-video-pagination .swiper-pagination-bullet {
  background: var(--color-border-light);
  opacity: 1;
  width: 8px;
  height: 8px;
  transition: background var(--transition), width var(--transition);
}

.dw-video-pagination .swiper-pagination-bullet-active {
  background: var(--color-primary);
  width: 24px;
  border-radius: 4px;
} */

/* ============================================================
   SKELETON LOADER
============================================================ */
.dw-video-skeleton-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.dw-skeleton-card {
  animation: dw-shimmer 1.5s infinite;
}

.dw-skeleton-img {
  border-radius: var(--radius-lg);
  background: linear-gradient(90deg, #e8eceb 25%, #d4dedd 50%, #e8eceb 75%);
  background-size: 200% 100%;
  aspect-ratio: 3 / 4;
  width: 100%;
  min-height: 180px;
  animation: dw-shimmer 1.5s infinite;
}

.dw-skeleton-line {
  height: 12px;
  border-radius: 4px;
  background: linear-gradient(90deg, #e8eceb 25%, #d4dedd 50%, #e8eceb 75%);
  background-size: 200% 100%;
  animation: dw-shimmer 1.5s infinite;
  margin-top: 10px;
}

.dw-skeleton-line.short { width: 60%; }
.dw-skeleton-line.med { width: 80%; }

@keyframes dw-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   ERROR / EMPTY STATE
============================================================ */
.dw-video-error {
  text-align: center;
  padding: 40px 20px;
  color: var(--color-text-para);
  font-size: var(--fs-sm);
}

.dw-video-error svg {
  width: 48px;
  height: 48px;
  margin-bottom: 12px;
  color: var(--color-border-light);
}

/* ============================================================
   VIDEO MODAL PLAYER
============================================================ */
.dw-video-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}

.dw-video-modal.open {
  opacity: 1;
  pointer-events: all;
}

.dw-video-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 23, 22, 0.88);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  cursor: pointer;
}

.dw-video-modal__panel {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 900px;
  background: var(--color-bg-dark);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,0.7);
  transform: translateY(24px) scale(0.97);
  transition: transform 0.32s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.dw-video-modal.open .dw-video-modal__panel {
  transform: translateY(0) scale(1);
}

/* Close button */
.dw-video-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 10;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.15);
  color: var(--color-white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  backdrop-filter: blur(4px);
  transition: background var(--transition);
}

.dw-video-modal__close:hover {
  background: rgba(255,255,255,0.28);
}

.dw-video-modal__close svg {
  width: 18px;
  height: 18px;
}

/* Video frame */
.dw-video-modal__video-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}

.dw-video-modal__video-wrap iframe,
.dw-video-modal__video-wrap video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* Thumbnail fallback (when no embed URL — shows image + info) */
.dw-video-modal__thumb-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.dw-video-modal__thumb-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.dw-video-modal__thumb-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,23,22,0.92) 0%, rgba(0,23,22,0.2) 60%, transparent 100%);
  display: flex;
  align-items: flex-end;
  padding: 28px;
}

.dw-video-modal__thumb-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 72px;
  height: 72px;
  background: rgba(255,255,255,0.15);
  border: 2px solid rgba(255,255,255,0.4);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);
  color: white;
}

/* Info row below video */
.dw-video-modal__info {
  padding: 20px 24px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.dw-video-modal__title {
  font-size: var(--fs-h4);
  font-weight: var(--fw-bold);
  color: var(--color-white);
  margin-bottom: 4px;
  line-height: 1.3;
}

.dw-video-modal__sub {
  font-size: var(--fs-sm);
  color: rgba(255,255,255,0.6);
}

.dw-video-modal__date {
  font-size: var(--fs-xs);
  color: var(--color-gold-mid);
  font-weight: var(--fw-medium);
  white-space: nowrap;
  margin-top: 4px;
}

.dw-video-modal__view-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--gradient-btn-2);
  color: var(--color-white);
  border: none;
  border-radius: var(--radius-sm);
  padding: 10px 18px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: opacity var(--transition);
}

.dw-video-modal__view-btn:hover { opacity: 0.88; }

.dw-video-modal__view-btn svg {
  width: 15px;
  height: 15px;
}

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width: 1024px) {
  .dw-video__grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .dw-video-skeleton-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .dw-video__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .dw-video-skeleton-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .dw-section-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .dw-video-modal__panel {
    border-radius: var(--radius-lg);
  }
  .dw-video-modal__info {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .dw-video__grid {
    grid-template-columns: 1fr;
  }
  .dw-video-skeleton-grid {
    grid-template-columns: 1fr;
  }
  /* .dw-section-header__anchor {
    display: none;
  } */
  .dw-video-modal {
    padding: 12px;
    align-items: flex-end;
  }
  .dw-video-modal__panel {
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }
}

.bg-custom {
  background: var(--color-bg-light);
}


.dw-listing-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
  flex-wrap: wrap
}

.dw-listing-tab {
  padding: 8px 18px;
  border-radius: 999px;
  border: 1.5px solid var(--color-border-light);
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text-primary, var(--color-neutral-900));
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap
}

.dw-listing-tab:hover {
  border-color: var(--color-primary);
  color: var(--color-primary)
}

.dw-listing-tab.active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white)
}

.dw-listing-carousel-wrap {
  position: relative
}

.dw-listing-track-outer {
  overflow: hidden
}

.dw-listing-track {
  display: flex;
  gap: 16px;
  transition: transform .45s cubic-bezier(.4, 0, .2, 1)
}

.dw-listing-card {
  flex: 0 0 calc(25% - 12px);
  min-width: 0;
  background: var(--color-background-primary, var(--color-white));
  border: 1px solid #e0e0e0;
  border-radius: 14px;
  overflow: hidden;
  transition: box-shadow .2s, transform .2s
}

.dw-listing-card:hover {
  box-shadow: 0 8px 32px rgba(0, 91, 82, .13);
  transform: translateY(-2px)
}

.dw-listing-img-wrap {
  position: relative;
  overflow: hidden;
  cursor: pointer
}

.dw-listing-img-wrap img {
  width: 100%;
  height: 210px;
  object-fit: cover;
  display: block;
  transition: transform .4s
}

.dw-listing-card:hover .dw-listing-img-wrap img {
  transform: scale(1.04)
}

.dw-listing-badge {
  position: absolute;
  top: 12px;
  left: 0;
  padding: 4px 10px 4px 10px;
  font-size: var(--fs-badge);
  font-weight: 700;
  border-radius: 0 6px 6px 0;
  color: var(--color-white);
  letter-spacing: .5px;
  text-transform: uppercase;
  z-index: 2
}


.dw-project-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: var(--radius-pill);
  font-size: var(--fs-badge);
  font-weight: var(--fw-semibold);
      text-transform: uppercase;
    letter-spacing: 1px;
  /* background: var(--color-primary-10); */
  color: var(--color-white);
}


.badge-featured,.badge-ready,.badge-sold {
  background: #e03
}

.badge-new ,.badge-ongoing{
  background: linear-gradient(135deg, #007BFF 0%, #0056B3 100%);
}

.badge-senior {
  background: #7c3aed
}

.dw-listing-img-actions {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 6px;
  z-index: 2
}

.dw-listing-img-btn {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .88);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #444;
  transition: background .15s
}

.dw-listing-img-btn:hover {
  background: var(--color-white)
}

.dw-listing-img-btn svg {
  width: 14px;
  height: 14px
}

.dw-listing-img-count {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0, 0, 0, .5);
  color: var(--color-white);
  font-size: 11px;
  font-weight: 500;
  padding: 3px 8px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  gap: 4px
}

.dw-listing-img-count svg {
  width: 12px;
  height: 12px
}

.dw-listing-builder {
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-sm);
  background: var(--color-white);
  outline: 1px solid var(--color-white) !important;
  outline-offset: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden
}

.dw-listing-builder img {
  width: 38px;
  height: 38px;
  object-fit: contain
}

.dw-listing-body {
  padding: 14px 14px 16px
}

.dw-listing-price {
  font-size: var(--fs-h4);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  margin-bottom: 2px
}

.dw-listing-price span {
  font-size: 13px;
  font-weight: 400;
  color: var(--color-text-secondary, var(--color-text-primary))
}

.dw-listing-name {
  font-size: var(--fs-h5);
  font-weight: 700;
  color: var(--color-text-primary, var(--color-neutral-900));
  margin-bottom: 4px
}

.dw-listing-loc {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: var(--fs-small);
  color: var(--color-text-secondary, var(--color-text-primary));
  margin-bottom: 8px
}

.dw-listing-loc svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0
}

.dw-listing-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 12px
}

.dw-listing-pill {
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid var(--color-border-light);
  font-size: var(--fs-xs);
  color: var(--color-text-secondary, var(--color-text-primary));
  background: transparent
}

.dw-listing-actions {
  display: flex;
  gap: 6px;
  align-items: center
}

.dw-listing-btn-main {
  flex: 1;
  padding: 10px 0;
  background: var(--gradient-btn);
  color: var(--color-white);
  border: none;
  border-radius: var(--radius-md);
  font-size: var(--fs-btn-sm);
  font-weight: var(--fw-medium);
  cursor: pointer;
  transition: opacity .2s;
  letter-spacing: .2px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dw-listing-btn-main:hover {
  color: var(--color-white);
  opacity: .87
}

.dw-listing-btn-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0
}

.dw-listing-btn-icon svg {
  width: 15px;
  height: 15px
}

.btn-call {
  background: #2563eb;
  color: var(--color-white)
}

.btn-wa {
  background: #25d366;
  color: var(--color-white)
}

.dw-car-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 20px;
  position:relative !important;
}

.dw-car-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-border-light);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: all .2s
}

.dw-car-dot.on {
  background: var(--color-primary);
  width: 22px;
  border-radius: 20px
}

.dw-car-arrow {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1.5px solid var(--color-border-light);
  background: var(--color-background-primary, var(--color-white));
  color: var(--color-primary);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s
}

.dw-car-arrow:hover {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary)
}

.dw-car-arrow svg {
  width: 14px;
  height: 14px
}

@media(max-width:1024px) {
  .dw-listing-card {
    flex: 0 0 calc(50% - 8px)
  }
}

@media(max-width:580px) {
  .dw-listing-card {
    flex: 0 0 calc(100% - 0px)
  }
}


/* =========================
   GRID (MATCH IMAGE)
========================= */
.dw-locations__grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

/* =========================
   CARD
========================= */
.dw-loc-card {
  flex: 1 0 210px;
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: block;
  min-height: 280px;
  height: 280px;
  max-height: 280px;
  transition: transform var(--transition), box-shadow var(--transition);
}
.dw-loc-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.2) 30%, transparent 100%);
  z-index: 1;
}

.dw-loc-card img {
  transition: var(--transition);
}
.dw-loc-card:hover img {
  transform: scale(1.08);
}
/*
.dw-loc-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
} */

/* BIG CARD */
/* .dw-loc-card--lg {
  flex: 1 1 calc(60% - 16px);
} */

/* IMAGE */
.dw-loc-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* OVERLAY */
.dw-loc-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.2) 30%, transparent 100%);
}

/* BADGE */
.dw-loc-card__badge {
  position: absolute;
  top: 16px;
  left: -4px;
  display: inline-block;
  background: var(--color-success);
  color: var(--color-white);
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  padding: 4px 10px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  box-shadow: var(--shadow-md);
}

/* .dw-loc-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--color-success);
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  padding: 4px 10px;
  border-radius: var(--radius-sm);
  z-index: 2;
} */

/* INFO */
.dw-loc-card__info {
  position: absolute;
  bottom: 14px;
  left: 14px;
  z-index: 2;
}


.dw-loc-card__info h3 {
  color: #fff;
  font-size: var(--fs-h5);
  font-weight: var(--fw-bold);
}

.dw-loc-card__info p {
  color: rgba(255,255,255,0.7);
  font-size: var(--fs-xs);
  margin-bottom: 0;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 768px) {
  .dw-locations__grid {
    grid-template-columns: 1fr;
  }

  .dw-loc-card--lg {
    min-height: 220px;
  }
}







    .btn-primary,.dw-project-floor-card__cta {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--gradient-btn-2);
      color: var(--color-white);
      padding: 11px 22px;
      border-radius: var(--radius-md);
      font-size: var(--fs-sm);
      font-weight: var(--fw-semibold);
      transition: opacity var(--transition);
      border: none;
    }
    .btn-primary:hover,.dw-project-floor-card__cta:hover { opacity: 0.88; }
    .btn-outline {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: transparent;
      color: var(--color-primary);
      border: 1.5px solid var(--color-primary);
      padding: 10px 22px;
      border-radius: var(--radius-md);
      font-size: var(--fs-sm);
      font-weight: var(--fw-semibold);
      transition: background var(--transition), color var(--transition);
    }
    .btn-outline:hover { background: var(--color-primary); color: var(--color-white); }

    /* ==============================
       WHY CHOOSE US
    ============================== */



    .why-features { display: flex; flex-direction: column; gap: 14px; }
    .why-feature {
      display: flex;
      align-items: center;
      gap: 16px;
      background: var(--gradient-tile);
      border: 1px solid var(--color-primary);
      border-radius: var(--radius-lg);
      padding: 18px 20px;
      transition: all var(--transition);
    }
    .why-feature:hover {
      border-color: var(--color-primary-deep);
      background: var(--gradient-btn-5);
    }
    .why-feature--active {
      background: var(--gradient-btn-5);
      border-color: var(--color-primary);
    }
    .why-feature__icon {
      width: 42px; height: 42px;
      border-radius: var(--radius-pill);
      background: rgba(255,255,255,0.15);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
      font-size: 18px;
      padding: 30px;
    }
    .why-feature--active .why-feature__icon { background: rgba(255,255,255,0.2); }
    .why-feature__title {
      font-size: var(--fs-sm);
      font-weight: var(--fw-semibold);
      color: var(--color-white);
      margin-bottom: 4px;
    }
    .why-feature__sub {
      font-size: var(--fs-xs);
      color: rgba(255,255,255,0.65);
      line-height: 1.5;
      margin-bottom: 0;
    }
    .why-feature--active .why-feature__sub { color: rgba(255,255,255,0.8); }

    .why-right { display: flex; flex-direction: column; gap: 20px; }
    .why-contact-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: transparent;
      color: var(--color-primary);
      border: 1.5px solid var(--color-primary);
      padding: 10px 22px;
      border-radius: var(--radius-pill);
      font-size: var(--fs-sm);
      font-weight: var(--fw-medium);
      margin-bottom: 24px;
      transition: border-color var(--transition);
    }
    .why-contact-btn:hover {
      border-color: var(--color-primary-deep);
      background: var(--color-primary);
      color: var(--color-white);
     }

    .partner-label {
      text-align: center;
      font-size: var(--fs-h6);
      font-weight: var(--fw-bold);
      letter-spacing: 1px;
      text-transform: uppercase;
      color: var(--color-text-para);
      margin-bottom: 14px;
    }
    .partner-label mark {
        background: var(--color-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
  padding: 0;
    }
    .partner-grid {
      display: flex;
      flex-wrap: wrap;
      /* grid-template-columns: repeat(4, 1fr); */
      gap: 10px;
      margin-bottom: 6px;
    }
    .partner-logo {
      flex-grow: 1;
      background: rgba(255,255,255,0.07);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      /* height: 52px; */
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 12px;
      transition: background var(--transition), border-color var(--transition), box-shadow var(--transition);
      cursor: pointer;
      box-shadow: var(--shadow-sm);
    }
    .partner-logo:hover {
      background: rgba(255,255,255,0.12);
      border-color: rgba(255,255,255,0.2);
      box-shadow: var(--shadow-md);
    }
    .partner-logo img {
      min-width: 120px;
      max-width: 120px;
      min-height: 60px;
      max-height: 60px;
      object-fit: contain;
      /* filter: brightness(0) invert(1); */
      opacity: 0.75;
    }
    .partner-logo:hover img { opacity: 1; }
    .partner-logo span {
      font-size: var(--fs-xs);
      font-weight: var(--fw-bold);
      color: var(--color-black);
      letter-spacing: 1px;
    }

    /* ==============================
       LOCAL EXPERTS / STATS
    ============================== */

    .stats-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
      margin-bottom: 32px;
    }
    .stat-card {
      background: var(--gradient-tile);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 20px 22px;
      display: flex;
      align-items: center;
      gap: 14px;
      transition: box-shadow var(--transition), transform var(--transition);
    }
    .stat-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
    .stat-card__icon {
      width: 54px; height: 54px;
      padding: 10px;
      background: rgba(225, 225, 225, .2);
      border-radius: var(--radius-pill);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
      font-size: 20px;
    }
    .stat-card__num {
      font-family: var(--font-secondary);
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
      /* color: var(--color-primary-deep); */
          background: var(--gradient-gold-premium);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
      line-height: 1;
      margin-bottom: 2px;
    }
    .stat-card__label {
      font-size: var(--fs-xs);
      color: var(--color-white);
    }

    .stats-cta { display: flex; gap: 12px; align-items: center; }

    /* Image side */
    .stats-right { position: relative; }
    .stats-img {
      width: 100%;
      height: 480px;
      object-fit: cover;
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-md);
    }
    .stats-badge {
      position: absolute;
      top: -18px;
      right: -18px;
      background: var(--gradient-gold-premium);
      border-radius: var(--radius-lg);
      padding: 18px 22px;
      box-shadow: var(--shadow-md);
      text-align: center;
    }
    .stats-badge__num {
      font-family: var(--font-secondary);
      font-size: var(--fs-2xl);
      font-weight: var(--fw-bold);
      color: var(--color-primary-deep);
      line-height: 1;
    }
    .stats-badge__label {
      font-size: var(--fs-2xs);
      font-weight: var(--fw-bold);
      color: var(--color-primary-deep);
      letter-spacing: 0.5px;
    }

    /* ==============================
       TESTIMONIALS
    ============================== */

    /* Google badge */
    .g-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-pill);
      padding: 8px 14px;
      font-size: var(--fs-xs);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      margin-bottom: 16px;
      /* box-shadow: var(--shadow-sm); */
    }
    .g-dot { width: 8px; height: 8px; border-radius: 50%; background: #4285F4; }

    .reviews-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      position: relative;
    }
    .review-card {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      padding: 28px;
      box-shadow: var(--shadow-sm);
      transition: box-shadow var(--transition), transform var(--transition);
      min-height: 380px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
    .review-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
    .review-stars { color: var(--color-warning); font-size: 16px; margin-bottom: 14px; }
    .review-text {
      font-size: var(--fs-sm);
      color: var(--color-text-para);
      line-height: 1.75;
      margin-bottom: 20px;
    }
    .review-author {
      display: flex;
      align-items: center;
      gap: 12px;
      padding-top: 16px;
      border-top: 1px solid var(--color-border-light);
      margin-top: auto;
    }
    .review-avatar {
      width: 40px; height: 40px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: var(--fs-sm);
      font-weight: var(--fw-bold);
      color: var(--color-white);
      flex-shrink: 0;
    }
    .review-name { font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--color-text-primary); }
    .review-role { font-size: var(--fs-2xs); color: var(--color-text-para); }
    .review-g-icon {
      margin-left: auto;
      /* width: 22px; height: 22px;
      border-radius: 50%;
      background: #4285F4;
      display: flex; align-items: center; justify-content: center;
      color: white;
      font-size: 12px;
      font-weight: var(--fw-bold); */
    }
    .reviews-nav ,#dw-video-pagination{
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
      margin-top: 28px;
      position: relative !important;
    }
    .reviews-dot ,#dw-video-pagination .swiper-pagination-bullet {
      width: 8px; height: 8px;
      border-radius: 50%;
      background: var(--color-border-light);
      border: none;
      cursor: pointer;
      transition: all 0.2s;
      padding: 0;
    }
    .reviews-dot.active,#dw-video-pagination  .swiper-pagination-bullet-active {
      background: var(--color-primary);
      width: 24px;
      border-radius: 20px;
    }
    /* ==============================
       CTA BANNER
    ============================== */
    .cta-section {
      background: var(--gradient-cta-bg);
      padding: 64px 0;
    }
    .cta-inner {
      display: grid;
      grid-template-columns: 1fr 380px;
      gap: 48px;
      align-items: center;
    }
    .cta-left .section-title {
      color: var(--color-white);
      font-size: var(--fs-h2);
      margin-bottom: 10px;
    }
    .cta-left .section-title mark {
      color: var(--color-accent-gold);
      background: none;
      -webkit-text-fill-color: unset;
    }
    .cta-left .section-sub { color: rgba(255,255,255,0.6); margin-bottom: 28px; }
    .cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }
    .cta-btn-ghost {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: transparent;
      color: var(--color-white);
      border: 1.5px solid rgba(255,255,255,0.3);
      padding: 10px 22px;
      border-radius: var(--radius-md);
      font-size: var(--fs-sm);
      font-weight: var(--fw-semibold);
      transition: border-color var(--transition), background var(--transition);
    }

    .cta-btn-ghost:hover {
      border-color: var(--color-primary-light);
      background: var(--color-white);
      color: var(--color-primary);
    }

    .cta-section .btn-primary {
      border-color: var(--color-primary-light);
      background: var(--color-white);
      color: var(--color-primary);
    }

    .cta-right {
      position: relative;
    }
    .cta-img {
      width: 100%;
      height: 340px;
      object-fit: cover;
      object-position: top center;
      border-radius: var(--radius-xl);
    }

    /* ==============================
       FAQs
    ============================== */
    .faq-inner {
      display: grid;
      grid-template-columns: 320px 1fr;
      gap: 64px;
    }
    .faq-left .section-title { color: var(--color-text-primary); }
    .faq-left .section-sub { margin-bottom: 24px; }

    /* ==============================
       BLOG
    ============================== */
    .blog-link {
      font-size: var(--fs-sm);
      font-weight: var(--fw-semibold);
      color: var(--color-primary);
      display: flex;
      align-items: center;
      gap: 5px;
      white-space: nowrap;
    }
    .blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
    .blog-card {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      overflow: hidden;
      box-shadow: var(--shadow-sm);
      transition: box-shadow var(--transition), transform var(--transition);
    }
    .blog-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
    .blog-img-wrap { overflow: hidden; height: 250px; }
    .blog-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.4s ease;
    }
    .blog-card:hover .blog-img { transform: scale(1.06); }
    .blog-body { padding: 20px; }
    .blog-tag {
      display: inline-block;
      font-size: var(--fs-2xs);
      font-weight: var(--fw-bold);
      letter-spacing: 0.5px;
      text-transform: uppercase;
      padding: 3px 10px;
      border-radius: var(--radius-sm);
      margin-bottom: 10px;
    }
    .tag-market { background: var(--color-bg-light-green); color: var(--color-primary); }
    .tag-home { background: #FEF9EC; color: #b45309; }
    .tag-commercial { background: #EFF6FF; color: #1d4ed8; }
    .blog-title {
      font-size: var(--fs-h5);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      line-height: 1.4;
      margin-bottom: 8px;
    }
    .blog-excerpt {
      font-size: var(--fs-p);
      color: var(--color-text-para);
      line-height: 1.65;
      margin-bottom: 16px;
    }
    .blog-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .blog-date { font-size: var(--fs-2xs); color: var(--color-text-para); }
    .blog-read {
      font-size: var(--fs-h6);
      font-weight: var(--fw-semibold);
      color: var(--color-primary);
    }
    a.blog-read svg {
      width: 16px;
      height: 16px;
    }

    /* ==============================
       RESPONSIVE
    ============================== */
    @media (max-width: 968px) {
      .why-section .container,
      .stats-section .container,
      .cta-inner,
      .faq-inner { grid-template-columns: 1fr; gap: 40px; }
      .stats-right { display: none; }
      .reviews-grid { grid-template-columns: 1fr; }
      .blog-grid { grid-template-columns: repeat(2,1fr); }
    }
    @media (max-width: 600px) {
      .blog-grid { grid-template-columns: 1fr; }
      .stats-grid { grid-template-columns: 1fr 1fr; }
      .partner-logo img {
            min-width: 70px;
            max-width: 70px;
            min-height: 40px;
            max-height: 60px;
            object-fit: contain;
            /* filter: brightness(0) invert(1); */
            opacity: 0.75;
        }
        .stat-card {
          padding: 10px 12px;
        }

        .stat-card__icon {
            padding: 5px;
          }
    }

    /* ── ANIMATIONS ── */
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(20px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    .animate-in { opacity: 0; }
    .animate-in.visible { animation: fadeUp 0.55s ease both; }
    .animate-in:nth-child(1) { animation-delay: 0.05s; }
    .animate-in:nth-child(2) { animation-delay: 0.15s; }
    .animate-in:nth-child(3) { animation-delay: 0.25s; }
    .animate-in:nth-child(4) { animation-delay: 0.35s; }


.dw-uni-hero {
    position: relative;
    width: 100%;
    min-height: var(--breadcrumb-height);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.dw-uni-hero__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.dw-uni-hero__img {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
}

.dw-uni-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    backdrop-filter: blur(2px);
    background: linear-gradient(180deg, rgba(0, 23, 22, 0.22) 0%, rgba(0, 23, 22, 0.42) 45%, rgba(0, 23, 22, 0.72) 100%), radial-gradient(ellipse 80% 60% at 50% 40%, transparent 30%, rgba(0, 23, 22, 0.32) 100%);
}

.dw-uni-hero__content {
    z-index: 2;
    max-width: 800px;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.dw-uni-hero__headline {
    font-family: var(--font-primary);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    color: var(--color-white);
    line-height: 1.2;
    margin-bottom: 8px;
}

.dw-uni-hero__headline mark {
    background: var(--gradient-gold-premium);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.dw-uni-hero__content .breadcrumb-item {
    color: var(--color-border-light);
}

.dw-uni-hero__content .breadcrumb-item.active {
    color: var(--color-white);
}

.dw-stats-section {
  background: var(--gradient-tile);
}

.dw-stats-section .stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 0px;
}

.dw-stats-section .stat-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: transparent;
    border: none;
    gap: 10px;
    padding: 0;
}

.dw-stats-section .stat-card:hover {
    box-shadow: none;
}

.dw-stats-section .stat-card__num {
    font-size: var(--fs-h2);
    margin-bottom: 14px;
}

.dw-stats-section .stat-card__icon {
    width: 60px;
    height: 60px;
}

.dw-stats-section .stat-card__icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dw-who-section .features-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    margin-bottom: 0px;
}

.dw-who-section .feature-card {
  border-left: 6px solid transparent;
  border-radius:  0 var(--radius-lg) 0 var(--radius-lg);
  background: var(--gradient-tile) padding-box,var(--gradient-gold) border-box; /* solid background */
  padding: 20px;
  position: relative;
  overflow: hidden;
}

.dw-who-section .feature-card .feature-card__title{
  color: var(--color-white);
  font-size: var(--fs-h5);
}

.dw-who-section .feature-card .feature-card__description{
  color: rgba(255,255,255,0.6);
  font-size: var(--fs-p);
  font-weight: var(--fw-medium);
  margin-bottom: 0;
}

.dw-who-section .stats-badge {
  aspect-ratio: 1/1;
  border-radius: var(--radius-pill);
  z-index: 3;
}

/* .dw-who-section img.stats-img {
    width: 100%;
    height: 100%;
} */

.dw-who-media {
    position: relative;
    width: 100%;
}

/* .dw-uni-hero__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
} */

.dw-who-media__img {
    width: 100%;
    height: 100%;
    position: relative;
    inset: 0;
    object-fit: cover;
    z-index: 0;
    border-radius: var(--radius-lg);
}

.dw-who-media__overlay {
  border-radius: var(--radius-lg);
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgb(14 40 32 / 0%) 40%, rgb(14 40 32 / 90%) 100%);
}

.dw-who-media__quote {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    color: var(--color-white);
    font-size: var(--fs-h4);
    font-weight: var(--fw-bold);
    text-align: left;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

.blockquote h3 {
  font-size: var(--fs-h3);
  font-weight: var(--fw-bold);
      background: var(--gradient-gold-premium);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.blockquote-footer  {
  color: var(--color-white);
  font-weight: var(--fw-medium);
  font-size: var(--fs-h5);
}

.dw-why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 0px;
}

.dw-why-grid .dw-why-card {
  background: var(--gradient-tile);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-lg);
  padding: 30px 24px;
  transition: all var(--transition);
}


.dw-why-grid .dw-why-card .dw-why-card__icon {
  width: 54px; height: 54px;
  padding: 10px;
  background: rgba(225, 225, 225, .2);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  margin-bottom: 20px;
}


.dw-why-grid .dw-why-card h3 {
  font-size: var(--fs-h4);
  font-weight: var(--fw-semibold);
  color: var(--color-white);
}

.dw-why-grid .dw-why-card p {
  font-size: var(--fs-p);
  color: rgba(255,255,255,0.6);
  margin-bottom: 0;
}


.mission-vision-section .mission-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    margin-bottom: 0px;
}

.mission-vision-section .mission-grid .mission-box {
  position: relative;
  overflow: hidden;
  background: var(--color-white);
  color: var(--color-bg-dark);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  padding: 40px 34px;
  transition: all var(--transition);
}

.mission-vision-section .mission-grid .mission-box:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-5px);
}

.mission-vision-section .mission-grid .mission-box::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translate(50px, 50px);
  width: 160px;
  height: 160px;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  opacity: 0.1;
}
.mission-vision-section .mission-grid .mission-box p {
  margin-bottom: 0;
  color: var(--color-text-para);
  font-size: var(--fs-p);
}

.mission-vision-section .mission-grid .mission-box h3 {
  color: var(--color-bg-dark);
  font-size: var(--fs-h3);
  font-weight: var(--fw-bold);
  margin-bottom: 20px;
}

.divider-separator {
    position: relative;
    display: flex;
    gap: 14px;
    width: 100%;
    /* height: 1px; */
    margin-bottom: 20px;
    flex-direction: row;
    align-items: center;
    color: var(--color-gold-mid);
    white-space: nowrap;
}

.divider-separator::after {
  content: '';
  position: relative;
  width: 100%;
  height: 1px;
  background: var(--color-gold-mid);
}

.mission-vision-section .mission-grid .mission-box.mission-dark {
  background: var(--gradient-cta-bg);
  color: var(--color-white);
}

.mission-vision-section .mission-grid .mission-box.mission-dark h3{
  color: var(--color-white);
}
.mission-vision-section .mission-grid .mission-box.mission-dark p{
  color: rgba(255,255,255,0.6);
}






.dw-cta-section {
    position: relative;
    width: 100%;
    min-height: var(--breadcrumb-height);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.dw-cta__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.dw-cta__img {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
}

.dw-cta__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    backdrop-filter: blur(2px);
    opacity: 0.8;
    background: var(--gradient-cta-bg);
}

.dw-cta__content {
    z-index: 2;
    max-width: 800px;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.dw-cta-section .dw-section-header__title {
    font-family: var(--font-primary);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    color: var(--color-white);
    line-height: 1.2;
    margin-bottom: 8px;
}

.dw-cta-section .dw-section-header__title mark {
    background: var(--gradient-gold-premium);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}



.dw-cta-section  .btn-primary {
    border-color: var(--color-primary-light);
    background: var(--color-white);
    color: var(--color-primary);
}

.dw-contact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 0px;
}

.dw-contact-grid .dw-contact-card {
  background: var(--gradient-tile);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-lg);
  padding: 30px 24px;
      display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  transition: all var(--transition);
}


.dw-contact-grid .dw-contact-card .dw-contact-card__icon {
  width: 54px; height: 54px;
  padding: 10px;
  background: rgba(225, 225, 225, .2);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  margin-bottom: 20px;
}


.dw-contact-grid .dw-contact-card h3 {
  font-size: var(--fs-h4);
  font-weight: var(--fw-semibold);
  color: var(--color-white);
}

.dw-contact-grid .dw-contact-card p {
  font-size: var(--fs-p);
  color: rgba(255,255,255,0.6);
  margin-bottom: 0;
}

.dw-contact-form-section {}

.dw-contact-tab {
  width: 100%;
  padding: 9px 12px;
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: var(--color-text-para);
  background: transparent;
  border: none;
  border-radius: var(--radius-pill);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--transition), color var(--transition);
  text-align: center;
}

.dw-contact-tab:hover {
  color: var(--color-primary);
}

.dw-contact-tab--active {
  background: var(--color-white);
  color: var(--color-primary);
  font-weight: var(--fw-semibold);
  box-shadow: var(--shadow-sm);
}

.dw-contact-form-section .dw-contact-tabs ul {
  display:flex;
  border:1.5px solid var(--color-border-light);
  border-radius:var(--radius-pill);
  overflow:hidden;
  max-width:750px;
  margin:0 auto;
  list-style:none;
  padding:4px;
  gap:4px;
  background:var(--color-border-light);
}

.dw-contact-form-wrapper {
  background:var(--color-white);
  border:1px solid var(--color-border-light);
  border-radius:var(--radius-xl);
  padding:32px;
  max-width:860px;
  margin:0 auto;
  box-shadow:var(--shadow-sm);
}

@media (max-width: 560px) {
  .dw-contact-form-section [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}


@media (max-width: 600px) {
  .dw-contact-grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .dw-stats-section .stats-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px 0;
  }
  .stats-badge {
    right: -4px;
  }
  .dw-who-section .features-grid {
    grid-template-columns: repeat(1, 1fr);
  }

  .dw-why-grid,.mission-vision-section .mission-grid  {
    grid-template-columns: repeat(1, 1fr);
  }
  .dw-section {
      padding: 28px 0 40px;
      position: relative;
  }

  .dw-cta__content {
    text-align: center;
  }
  .cta-btns {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
      flex-direction: row;
      width: 100%;
      justify-content: center;
  }
  .dw-contact-form-wrapper {
    box-shadow: none;
    padding: 20px;
  }
  .dw-ef-submit {
    padding: 8px;
  }
  .dw-ef-submit svg{
    width: 16px;
    height: 16px;
    margin-left: 4px;
  }
}



    /* ==============================
       SEARCH / FILTER BAR
    ============================== */

    .dw-search-list-page, .dw-project-view-page{
      background-color: var(--color-bg-light);
    }
    .dw-search-list-search-bar {
      background: var(--color-white);
      /* border-bottom: 1px solid var(--color-border-light); */
      position: sticky;
      top: var(--nav-height);
      z-index: 100;
      box-shadow: var(--shadow-sm);
    }

    .dw-search-list-search-bar__inner {
      max-width: 1280px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      gap: 0;
    }

    .dw-search-list-search-bar__keyword {
      display: flex;
      align-items: center;
      gap: 8px;
      flex: 1 1 220px;
      padding: 0 16px;
      height: 56px;
      border-right: 1px solid var(--color-border-light);
    }

    .dw-search-list-search-bar__keyword svg { color: var(--color-text-para); flex-shrink: 0; }

    .dw-search-list-search-bar__keyword input {
      border: none;
      outline: none;
      width: 100%;
      font-family: var(--font-primary);
      font-size: var(--fs-sm);
      color: var(--color-text-primary);
      background: transparent;
    }

    .dw-search-list-search-bar__keyword input::placeholder { color: var(--color-text-para); }

    .dw-search-list-search-bar__filter {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 0 20px;
      width: 140px;
      height: 56px;
      border: none;
      border-right: 1px solid var(--color-border-light);
      background: transparent;
      cursor: pointer;
      font-family: var(--font-primary);
      font-size: var(--fs-sm);
      font-weight: var(--fw-medium);
      color: var(--color-text-primary);
      white-space: nowrap;
      transition: background var(--transition);
    }

    .dw-search-list-search-bar__filter:hover { background: var(--color-bg-light); }

    .dw-search-list-search-bar__filter .label-sub {
      display: block;
      font-size: var(--fs-2xs);
      color: var(--color-text-para);
      font-weight: var(--fw-regular);
      line-height: 1;
    }

    .dw-search-list-search-bar__filter .label-main {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      gap: 4px;
      font-size: var(--fs-sm);
      font-weight: var(--fw-medium);
    }

    .filter-text-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; }

    .chevron-icon { color: var(--color-text-para); flex-shrink: 0; }

    /* ==============================
       MAIN LAYOUT
    ============================== */
    .dw-search-list-properties-section {
      max-width: 1280px;
      margin: 0 auto;
      padding: 32px 20px 60px;
      display: grid;
      grid-template-columns: 1fr 340px;
      gap: 28px;
      align-items: start;
    }

    /* ==============================
       LISTINGS COLUMN
    ============================== */
    .listings-col {}


    .listings-header {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      margin-bottom: 20px;
    }

    .listings-header__title {
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      line-height: 1.2;
    }

    .listings-header__count {
      font-size: var(--fs-p);
      color: var(--color-text-para);
      margin-top: 4px;
      margin-bottom: 0;
    }

    .listings-header__sort {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: var(--fs-sm);
      color: var(--color-text-para);
    }

    .listings-header__sort select {
      background-color: var(--color-white);
    }


    /* ==============================
       dw-search-list-propertY CARD
    ============================== */
    .dw-search-list-property-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 16px;
      margin: 0;
      padding: 0;
    }

    .dw-search-list-property-card {
      background: var(--color-white);
      border-radius: var(--radius-lg);
      border: 1px solid var(--color-border-light);
      overflow: hidden;
      display: grid;
      grid-template-columns: 260px 1fr auto;
      box-shadow: var(--shadow-sm);
      transition: box-shadow var(--transition-fast), transform var(--transition-fast);
    }

    .dw-search-list-property-card .dw-listing-builder {
      left: 10px;
    }

    .dw-search-list-property-card:hover {
      box-shadow: var(--shadow-md);
      transform: translateY(-2px);
    }

    /* — Card Image — */
    .dw-search-list-property-card__img-wrap {
      position: relative;
      overflow: hidden;
      height: 100%;
      min-height: 260px;
      max-height: 260px;
    }

    .dw-search-list-property-card__img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform var(--transition-med);
    }

    .dw-search-list-property-card:hover .dw-search-list-property-card__img { transform: scale(1.05); }

    /* — Card Body — */
    .dw-search-list-property-card__body {
      padding: 16px 18px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .dw-search-list-property-card__name {
      font-size: var(--fs-h4);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      line-height: 1.3;
      margin-bottom: 0;
    }

    .dw-search-list-property-card__location {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: var(--fs-sm);
      color: var(--color-text-para);
      margin: 0;
    }

    .dw-search-list-property-card__rera {
      display: flex;
      align-items: center;
      gap: 6px;
      background-color: var(--color-bg-light);
      padding: 10px;
      border-radius: var(--radius-sm);
      margin: 0;
    }

    .rera-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      background: var(--color-bg-light-green);
      color: var(--color-primary);
      font-size: var(--fs-2xs);
      font-weight: var(--fw-semibold);
      padding: 3px 8px;
      border-radius: var(--radius-pill);
      border: 1px solid rgba(0, 91, 82, 0.2);
    }

    .rera-number {
      font-size: var(--fs-2xs);
      color: var(--color-primary);
      font-weight: var(--fw-medium);
      text-decoration: underline;
      text-decoration-style: dotted;
      cursor: pointer;
      transition: color var(--transition);
    }

    .rera-number:hover { color: var(--color-primary-dark); }

    .dw-search-list-property-card__meta {
      display: flex;
      align-items: center;
      gap: 20px;
      margin-top: auto;
      padding-top: 8px;
      border-top: 1px solid var(--color-border-light);
    }

    .meta-item {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: var(--fs-sm);
      color: var(--color-text-para);
    }

    .meta-item svg {
      color: var(--color-primary);
      flex-shrink: 0;
      width: 30px;
      height: 30px;
    }
    .meta-item strong { font-weight: var(--fw-semibold); color: var(--color-text-primary); }

    /* — Card Pricing — */
    .dw-search-list-property-card__pricing {
      padding: 16px 18px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      border-left: 1px solid var(--color-border-light);
      min-width: 200px;
    }

    .pricing-type {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      text-align: center;
    }

    .pricing-amount {
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
      color: var(--color-primary);
      line-height: 1.1;
      text-align: center;
    }

    .pricing-onwards {
      font-size: var(--fs-p);
      color: var(--color-text-para);
      text-align: center;
      margin-top: 2px;
    }

    .pricing-actions {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 100%;
    }

    .btn--whatsapp {
      background: var(--gradient-btn-3);
      color: var(--color-white);
      border-color: transparent;
      flex: 1;
    }

    .btn-row {
      display: flex;
      gap: 8px;
      width: 100%;
    }

    /* ==============================
       SIDEBAR COLUMN
    ============================== */
    .sidebar-col {
      display: flex;
      flex-direction: column;
      gap: 24px;
      position: sticky;
      top: calc(var(--nav-height) + 10px);
    }

    /* — Lead Form — */
    .lead-form-card {
      border-radius: var(--radius-sm);
      color: var(--color-white);
      box-shadow: var(--shadow-md);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      overflow: hidden;
      background: var(--color-white);
    }

    .lead-form-card form {
      background: var(--color-white);
      padding: 20px;
    }

    .lead-form-card__header {
      background: var(--gradient-top-header);
      padding: 14px 16px;
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 0px;
    }

    .lead-form-card__icon {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      background: var(--gradient-orange);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      flex-shrink: 0;
      box-shadow: var(--shadow-sm);
    }

    .lead-form-card__title {
      font-family: var(--font-primary);
      font-size: var(--fs-h5);
      font-weight: var(--fw-semibold);
      line-height: 1.3;
      margin: 0;
    }

    /* — Locations Card — */
    .locations-card {
      background: var(--color-white);
      border-radius: var(--radius-md);
      padding: 16px;
      border: 1px solid var(--color-border-light);
      box-shadow: var(--shadow-sm);
    }

    .locations-card__title {
      font-size: var(--fs-h4);
      font-weight: var(--fw-semibold);
      color: var(--color-black);
      margin-bottom: 4px;
    }

    .locations-card__title mark {
      background: var(--color-primary);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      padding: 0;
    }

    .locations-card__subtitle {
      font-size: var(--fs-sm);
      color: var(--color-text-para);
      margin-bottom: 16px;
    }

    .locations-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .location-tile {
      position: relative;
      border-radius: var(--radius-md);
      overflow: hidden;
      aspect-ratio: 4/3;
      cursor: pointer;
    }

    .location-tile img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform var(--transition-med);
      display: block;
    }

    .location-tile:hover img { transform: scale(1.07); }

    .location-tile__overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 40%, rgba(0,23,22,0.75) 100%);
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 10px 12px;
    }

    .location-tile__name {
      font-size: var(--fs-h5);
      font-weight: var(--fw-semibold);
      color: var(--color-white);
      line-height: 1.2;
      margin: 0;
    }

    .location-tile__link {
      font-size: var(--fs-p);
      color: rgba(255,255,255,0.75);
      margin-top: 2px;
      margin-bottom: 0;
    }

    /* ==============================
       RESPONSIVE
    ============================== */
    @media (max-width: 1024px) {
      .dw-search-list-properties-section {
        grid-template-columns: 1fr;
      }
      .sidebar-col {
        position: static;
        display: grid;
        grid-template-columns: 1fr 1fr;
      }
    }

    @media (max-width: 768px) {
      .dw-search-list-property-card .pricing-actions {
          flex-direction: row;
      }
      .pricing-amount-wrapper {
            display: flex;
            align-items: flex-end;
            margin-top: 5px;
        }
      .dw-search-list-property-card .pricing-actions .btn-row a span,
      .dw-search-list-property-card .pricing-actions .btn-row button span{
          display: none;
      }
      .dw-search-list-property-card .pricing-actions .btn-row a ,
      .dw-search-list-property-card .pricing-actions .btn-row button {
          /* display: none; */
          padding: 10px;
      }
      .dw-search-list-property-card .pricing-actions .btn-primary {
        flex-grow: 2;
        width: 100%;
      }
      .dw-search-list-property-card .pricing-actions .btn-row {
            width: auto;
        }

      .dw-search-list-search-bar__filter .label-sub { display: none; }
      .dw-search-list-property-card {
        grid-template-columns: 160px 1fr;
        grid-template-rows: 1fr auto;
      }
      .dw-search-list-property-card__pricing {
        /* grid-column: 1 / -1; */
        flex-direction: column;
        gap: 10px;
        border-left: none;
        border-top: 1px solid var(--color-border-light);
        align-items: center;
      }
      .sidebar-col { grid-template-columns: 1fr; }

      /* .dw-search-list-property-card__rera {
            position: absolute;
            top: 210px;
            right: 6px;
            z-index: 222;
            background: rgb(249 249 251 / 65%);
            padding: 5px;
        } */
    }

    @media (max-width: 480px) {
      .dw-search-list-property-card {
        grid-template-columns: 1fr;
      }
      .dw-search-list-property-card__img-wrap { min-height: 200px; }
      .dw-search-list-search-bar__inner { overflow-x: auto; }
    }

    .lead-form-card .dw-ef-submit {
      font-size: var(--fs-h6) !important;
      width: auto;
      padding: 10px 20px;
    }

    .lead-form-card .dw-ef-submit svg {
      width: 18px;
      height: 18px;
    }

.dw-search-list-property-list dd {
  font-size: var(--fs-xs);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.dw-search-list-property-list dd strong{
  font-size: var(--fs-sm);
}



    /* ==============================
       UTILITIES
    ============================== */
    .dw-project-section-title {
      /* font-family: var(--font-secondary); */
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      margin-bottom: 1.25rem;
      position: relative;
      display: flex;
      gap: 14px;
      width: 100%;
      /* height: 1px; */
      flex-direction: row;
      align-items: center;
      /* white-space: nowrap; */
    }

    .dw-project-section-title::after {
      content: '';
      position: relative;
      /* width: 100%; */
      height: 1px;
      background: var(--color-border-light);
      flex-grow: 1;
    }


    .dw-project-btn-outline {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      border: 1.5px solid var(--color-primary);
      color: var(--color-primary);
      font-size: var(--fs-btn);
      font-weight: var(--fw-semibold);
      padding: 9px 20px;
      border-radius: var(--radius-pill);
      transition: background var(--transition-fast), color var(--transition-fast);
    }
    .dw-project-btn-outline:hover { background: var(--color-primary); color: var(--color-white); }


    /* ==============================
       BREADCRUMB
    ============================== */
    .dw-project-breadcrumb {
      background: var(--header-bg);
      padding: 14px 0;
      border-bottom: 1px solid var(--color-border-light);
      font-size: var(--fs-xs);
      color: var(--color-text-para);
    }
    .dw-project-breadcrumb__item a { color: var(--color-primary); transition: opacity var(--transition); }
    .dw-project-breadcrumb__item a:hover { opacity: 0.75; }

    /* ==============================
       HERO / GALLERY + META
    ============================== */
    .dw-project-project-hero {
      background-color: var(--body-bg);
      padding: 20px 0;
    }

    .dw-project-project-hero__inner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: clamp(20px, 2.5vw, 40px);
      align-items: start;
    }

    /* Gallery */
    .dw-project-gallery-grid {
      position: relative;
      border-radius: var(--radius-xl);
      overflow: hidden;
      aspect-ratio: 4/3;
      background: var(--color-bg-dark);
    }
    .dw-project-gallery-grid__main {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform var(--transition-slow);
    }
    .dw-project-gallery-grid__main:hover { transform: scale(1.02); }

    .dw-project-gallery-badges {
      position: absolute;
      top: 14px; left: 14px;
      display: flex; flex-wrap: wrap; gap: 6px;
      z-index: 5;
    }

    .dw-project-gallery-grid .dw-project-gallery-overlay-btn {
      position: absolute;
      z-index: 5;
      bottom: 14px; right: 14px;
      border: none;
      background: rgba(0,0,0,0.65);
      backdrop-filter: blur(6px);
      color: var(--color-white);
      font-size: var(--fs-xs);
      font-weight: var(--fw-medium);
      padding: 7px 14px;
      border-radius: var(--radius-pill);
      display: flex; align-items: center; gap: 6px;
      cursor: pointer;
      transition: background var(--transition-fast);
    }
    .dw-project-gallery-grid .dw-project-gallery-overlay-btn:hover { background: rgba(0,0,0,0.85); }

    /* Meta block */
    .dw-project-project-meta { display: flex; flex-direction: column; gap: 10px; }

    .dw-project-project-meta__location {
      display: flex; align-items: center; gap: 6px;
      font-size: var(--fs-xs);
      color: var(--color-primary);
      font-weight: var(--fw-medium);
    }
    .dw-project-project-meta__location svg { flex-shrink: 0; }

    .dw-project-project-meta__title {
      font-family: var(--font-secondary);
      font-size: var(--fs-h1);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      line-height: 1.15;
    }
    .dw-project-project-meta__by {
      font-size: var(--fs-sm);
      color: var(--color-text-para);
    }
    .dw-project-project-meta__by strong { color: var(--color-primary); font-weight: var(--fw-semibold); }

    /* Spec grid */
    .dw-project-spec-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
    }
    .dw-project-spec-item {
      background: var(--color-bg-light);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      padding: 12px 14px;
    }
    .dw-project-spec-item__label {
      font-size: var(--fs-2xs);
      color: var(--color-text-para);
      font-weight: var(--fw-medium);
      text-transform: uppercase;
      letter-spacing: 0.04em;
      margin-bottom: 4px;
    }
    .dw-project-spec-item__value {
      font-size: var(--fs-sm);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
    }
    .dw-project-spec-item__value--primary { color: var(--color-primary); }

    /* Feature tags */
    /* .dw-project-feature-tags {
      display: flex; flex-wrap: wrap; gap: 8px;
    }
    .dw-project-feature-tag {
      display: inline-flex; align-items: center; gap: 5px;
      font-size: var(--fs-xs);
      font-weight: var(--fw-medium);
      color: var(--color-primary-dark);
      background: var(--color-bg-light-green);
      border: 1px solid rgba(0,91,82,0.15);
      padding: 5px 12px;
      border-radius: var(--radius-pill);
    } */

    /* Price block */
    .dw-project-price-block {
      display: flex;
      align-items: flex-start;
      gap: 0px;
      flex-wrap: wrap;
      flex-direction: column;
    }
    .dw-project-price-block__label {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      font-weight: var(--fw-medium);
    }
    .dw-project-price-block__amount {
      /* font-family: var(--font-secondary); */
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
      color: var(--color-primary);
    }
    .dw-project-price-block__note {
      font-size: var(--fs-p);
      color: var(--color-text-para);
    }

    .dw-project-hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; }

    /* ==============================
       STICKY NAV
    ============================== */
    .dw-project-sticky-nav {
      position: sticky;
      top: var(--nav-height);
      z-index: 100;
      background: var(--color-white);
      border-top: 1px solid var(--color-border-light);
      border-bottom: 1px solid var(--color-border-light);
      box-shadow: 0px 18px 14px rgb(26 107 58 / 8%);
    }
    .dw-project-sticky-nav__inner {
      display: flex;
      align-items: center;
      gap: clamp(16px, 3vw, 36px);
      overflow-x: auto;
      scrollbar-width: none;
      padding-block: 0;
    }
    .dw-project-sticky-nav__inner::-webkit-scrollbar { display: none; }
    .dw-project-sticky-nav__link {
      font-size: var(--fs-sm);
      font-weight: var(--fw-medium);
      color: var(--color-text-para);
      padding: 16px 0;
      border-bottom: 2.5px solid transparent;
      white-space: nowrap;
      transition: color var(--transition), border-color var(--transition);
    }
    .dw-project-sticky-nav__link:hover,
    .dw-project-sticky-nav__link.dw-project-active {
      color: var(--color-primary);
      border-color: var(--color-primary);
    }

    /* ==============================
       MAIN LAYOUT  (content + sidebar)
    ============================== */
    .dw-project-project-body {
      padding-top: clamp(28px, 4vw, 56px);
      padding-bottom: clamp(40px, 6vw, 80px);
    }
    .dw-project-project-body__inner {
      display: grid;
      grid-template-columns: 1fr 340px;
      gap: clamp(20px, 3vw, 48px);
      align-items: start;
    }

    /* ==============================
       SECTIONS  (shared)
    ============================== */
    .dw-project-section {
      scroll-margin-top: 70px;
      padding: 20px;
      background-color: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      margin-bottom: clamp(32px, 5vw, 60px);
    }
    .dw-project-section:last-child { margin-bottom: 0; }

    /* ==============================
       OVERVIEW SECTION
    ============================== */
    .dw-project-overview__text {
      font-size: var(--fs-p);
      color: var(--color-text-para);
      line-height: 1.75;
      margin-bottom: 18px;
    }

    /* ==============================
       HIGHLIGHTS SECTION
    ============================== */
    .dw-project-highlights-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      margin-top: 20px;
    }
    .dw-project-highlight-card {
      list-style-type: none;
      background: var(--color-bg-light-green);
      border: 1px solid rgba(0,91,82,0.12);
      border-radius: var(--radius-lg);
      padding: clamp(16px, 2vw, 28px) clamp(14px, 1.5vw, 22px);
      text-align: center;
      transition: box-shadow var(--transition-fast), transform var(--transition-fast);
    }
    .dw-project-highlight-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
    .dw-project-highlight-card__value {
      font-family: var(--font-secondary);
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
      color: var(--color-primary);
      line-height: 1.1;
    }
    .dw-project-highlight-card__label {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      margin-top: 6px;
      font-weight: var(--fw-medium);
    }

    /* ==============================
       FLOOR PLANS SECTION
    ============================== */
    .dw-project-floor-plans-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      margin-top: 20px;
    }
    .dw-project-floor-card {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      overflow: hidden;
      transition: box-shadow var(--transition-fast);
    }
    .dw-project-floor-card:hover { box-shadow: var(--shadow-md); }
    .dw-project-floor-card__img-wrap {
      aspect-ratio: 4/3;
      background: var(--color-bg-light);
      overflow: hidden;
      position: relative;
    }
    .dw-project-floor-card__img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform var(--transition-med);
    }
    .dw-project-floor-card:hover .dw-project-floor-card__img { transform: scale(1.04); }
    .dw-project-floor-card__body { padding: 14px 16px; }
    .dw-project-floor-card__type {
      font-size: var(--fs-h5);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
    }
    .dw-project-floor-card__size {
      font-size: var(--fs-p);
      color: var(--color-text-para);
      margin-top: 2px;
    }

    .dw-project-floor-card-overlay-btn {
      position: absolute;
      top: 0;
      right: 0;
      margin: 8px;
      border: none;
      background: rgba(0,0,0,0.65);
      backdrop-filter: blur(6px);
      color: var(--color-white);
      font-size: var(--fs-xs);
      font-weight: var(--fw-medium);
      padding: 7px 14px;
      border-radius: var(--radius-pill);
      display: flex; align-items: center; gap: 6px;
      cursor: pointer;
      transition: background var(--transition-fast);
    }
    .dw-project-floor-card-overlay-btn:hover {
      color: var(--color-white);
      background: rgba(0,0,0,0.85);
     }

    /* Expert CTA banner */
    .dw-project-expert-banner {
      margin-top: 20px;
      background: linear-gradient(135deg, var(--color-primary-10) 0%, var(--color-bg-light-green) 100%);
      border: 1px solid rgba(0,91,82,0.15);
      border-radius: var(--radius-lg);
      padding: clamp(16px, 2vw, 24px) clamp(16px, 2vw, 28px);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      flex-wrap: wrap;
    }
    .dw-project-expert-banner__text h3 {
      font-size: var(--fs-h5);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
    }
    .dw-project-expert-banner__text p {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      margin-top: 4px;
      max-width: 400px;
    }

    /* ==============================
       AMENITIES SECTION
    ============================== */
    .dw-project-amenities-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
      margin-top: 20px;
      list-style-type: none;
    }
    .dw-project-amenity-card {
      background: var(--color-bg-light);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 20px 14px;
      text-align: center;
      transition: background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
    }
    .dw-project-amenity-card:hover {
      background: var(--color-bg-light-green);
      border-color: rgba(0,91,82,0.2);
      box-shadow: var(--shadow-sm);
    }
    .dw-project-amenity-card__icon {
      font-size: 28px;
      margin-bottom: 8px;
    }
    .dw-project-amenity-card__name {
      font-size: var(--fs-xs);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
    }

    /* ==============================
       LOCATION SECTION
    ============================== */
    .dw-project-location-map {
      margin-top: 20px;
      border-radius: var(--radius-xl);
      overflow: hidden;
      border: 1px solid var(--color-border-light);
      aspect-ratio: 16/7;
      background: var(--color-bg-light);
      position: relative;
    }
    .dw-project-location-map iframe {
      width: 100%; height: 100%;
      border: 0;
    }
    .dw-project-location-map img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border: 0;
    }

    .dw-project-location-points {
      margin-top: 20px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px 32px;
    }
    .dw-project-location-point {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: var(--fs-sm);
      color: var(--color-text-para);
    }
    .dw-project-location-point__dot {
      width: 7px; height: 7px;
      border-radius: 50%;
      background: var(--color-primary);
      flex-shrink: 0;
    }
    .dw-project-location-point strong { color: var(--color-text-primary); font-weight: var(--fw-semibold); }

    /* ==============================
       GALLERY SECTION
    ============================== */
    .dw-project-gallery-section-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
      margin-top: 20px;
    }
    .dw-project-gallery-section-item {
      border-radius: var(--radius-md);
      overflow: hidden;
      aspect-ratio: 1;
      position: relative;
      cursor: pointer;
    }
    .dw-project-gallery-section-item img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform var(--transition-med);
    }
    .dw-project-gallery-section-item:hover img { transform: scale(1.06); }
    .dw-project-gallery-section-item__overlay {
      position: absolute; inset: 0;
      background: rgba(0,23,22,0.55);
      display: flex; align-items: center; justify-content: center;
      color: var(--color-white);
      font-size: var(--fs-h4);
      font-weight: var(--fw-bold);
    }

    /* ==============================
       WHY SECTION
    ============================== */
    .dw-project-why-list {
      margin-top: 16px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .dw-project-why-item {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: var(--fs-p);
      color: var(--color-text-para);
      line-height: 1.6;
    }
    .dw-project-why-item__check {
      flex-shrink: 0;
      width: 20px; height: 20px;
      border-radius: 50%;
      background: var(--color-primary-10);
      color: var(--color-primary);
      display: flex; align-items: center; justify-content: center;
      font-size: 11px;
      margin-top: 2px;
    }

    /* ==============================
       BROCHURE BANNER
    ============================== */
    .dw-project-brochure-banner {
      margin-top: clamp(28px, 4vw, 48px);
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      padding: 20px;
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .dw-project-brochure-banner__icon {
      width: 90px; height: 90px;
      border-radius: var(--radius-md);
      /* background: var(--color-primary-10); */
      background: var(--gradient-gold);
      display: flex; align-items: center; justify-content: center;
      font-size: 24px;
      flex-shrink: 0;
    }
    .dw-project-brochure-banner__icon svg {
      width: 50px;height: 50px;
      color: var(--color-black);
    }
    .dw-project-brochure-banner__text h3 {
      font-size: var(--fs-h4);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
    }
    .dw-project-brochure-banner__text p {
      font-size: var(--fs-p);
      color: var(--color-text-para);
      margin-top: 3px;
    }
    .dw-project-brochure-banner__cta {
      margin-left: auto;
      flex-shrink: 0;
     }

    /* ==============================
       SIMILAR PROJECTS
    ============================== */
    .dw-project-similar-section {
      padding-block: clamp(36px, 5vw, 64px);
      background: var(--color-bg-light);
      border-top: 1px solid var(--color-border-light);
    }
    .dw-project-similar-section .dw-project-section-title { margin-bottom: 24px; }
    .dw-project-similar-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }
    .dw-project-similar-card {
      background: var(--color-white);
      border-radius: var(--radius-lg);
      overflow: hidden;
      border: 1px solid var(--color-border-light);
      transition: box-shadow var(--transition-fast), transform var(--transition-fast);
    }
    .dw-project-similar-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }
    .dw-project-similar-card__img-wrap {
      aspect-ratio: 4/3;
      position: relative;
      overflow: hidden;
    }
    .dw-project-similar-card__img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform var(--transition-med);
    }
    .dw-project-similar-card:hover .dw-project-similar-card__img { transform: scale(1.04); }
    .dw-project-similar-card__badge {
      position: absolute;
      top: 10px; left: 10px;
    }
    .dw-project-similar-card__body { padding: 14px 16px; }
    .dw-project-similar-card__price {
      font-size: var(--fs-sm);
      font-weight: var(--fw-bold);
      color: var(--color-primary);
      margin-bottom: 4px;
    }
    .dw-project-similar-card__name {
      font-size: var(--fs-md);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      margin-bottom: 2px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .dw-project-similar-card__loc {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      margin-bottom: 2px;
    }
    .dw-project-similar-card__config {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      margin-bottom: 14px;
    }
    .dw-project-similar-card__actions {
      display: flex; gap: 8px;
    }
    .dw-project-similar-card__actions .dw-project-btn-primary { flex: 1; justify-content: center; padding: 8px 10px; font-size: var(--fs-xs); }
    .dw-project-similar-card__icon-btn {
      width: 36px; height: 36px;
      border-radius: var(--radius-md);
      border: 1.5px solid var(--color-border-light);
      display: flex; align-items: center; justify-content: center;
      font-size: 16px;
      transition: border-color var(--transition), background var(--transition);
    }
    .dw-project-similar-card__icon-btn:hover { border-color: var(--color-primary); background: var(--color-primary-10); }

    /* ==============================
       SIDEBAR
    ============================== */
    .dw-project-sidebar {
      position: sticky;
      top: 80px;
      display: flex;
      flex-direction: column;
      gap: 18px;
    }

    .dw-project-sidebar-price-card {
      background: var(--gradient-btn);
      border-radius: var(--radius-xl);
      padding: 20px 22px;
      color: var(--color-white);
    }
    .dw-project-sidebar-price-card__label {
      font-size: var(--fs-xs);
      opacity: 0.8;
      margin-bottom: 4px;
    }
    .dw-project-sidebar-price-card__value {
      font-family: var(--font-secondary);
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
    }
    .dw-project-sidebar-price-card__sub {
      font-size: var(--fs-xs);
      opacity: 0.75;
      margin-top: 2px;
    }

    .dw-project-sidebar-form-card {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      padding: 22px;
      box-shadow: var(--shadow-sm);
    }
    .dw-project-sidebar-form-card__title {
      font-size: var(--fs-h5);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      margin-bottom: 4px;
    }
    .dw-project-sidebar-form-card__sub {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      margin-bottom: 16px;
    }
/*
    .dw-project-form-group { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
    .dw-project-form-group label {
      font-size: var(--fs-2xs);
      font-weight: var(--fw-semibold);
      color: var(--color-text-para);
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }
    .dw-project-form-group input,
    .dw-project-form-group select,
    .dw-project-form-group textarea {
      font-family: var(--font-primary);
      font-size: var(--fs-sm);
      color: var(--color-text-primary);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-md);
      padding: 10px 13px;
      outline: none;
      transition: border-color var(--transition), box-shadow var(--transition);
      width: 100%;
      background: var(--color-white);
    }
    .dw-project-form-group input:focus,
    .dw-project-form-group select:focus,
    .dw-project-form-group textarea:focus {
      border-color: var(--color-primary);
      box-shadow: 0 0 0 3px var(--color-primary-10);
    }
    .dw-project-form-group textarea { resize: vertical; min-height: 80px; }

    .dw-project-form-submit {
      width: 100%;
      background: var(--gradient-btn-cta);
      color: var(--color-white);
      font-size: var(--fs-btn);
      font-weight: var(--fw-bold);
      padding: 13px;
      border-radius: var(--radius-pill);
      transition: opacity var(--transition-fast);
      margin-top: 4px;
    }
    .dw-project-form-submit:hover { opacity: 0.88; } */

    .dw-project-form-meta {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      text-align: center;
      margin-top: 10px;
    }

    .dw-project-sidebar-contact {
        background: var(--color-white);
        border: 1px solid var(--color-border-light);
        border-radius: var(--radius-xl);
        padding: 11px 14px;
        margin-top: 10px;
        display: flex;
        align-items: center;
        gap: 12px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .dw-project-sidebar-contact__btn {
      flex: 1;
      min-width: 120px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 7px;
      background: var(--gradient-btn);
      color: var(--color-white);
      font-size: var(--fs-xs);
      font-weight: var(--fw-semibold);
      padding: 10px 14px;
      border-radius: var(--radius-pill);
      transition: opacity var(--transition-fast);
    }
    .dw-project-sidebar-contact__btn:hover { opacity: 0.85; }
    .dw-project-sidebar-contact__btn--wa {
      background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    }

    /* ==============================
       RESPONSIVE
    ============================== */
    @media (max-width: 1100px) {
      .dw-project-project-body__inner { grid-template-columns: 1fr; }
      .dw-project-sidebar { position: static; }
      .dw-project-similar-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 900px) {
      .dw-project-project-hero__inner { grid-template-columns: 1fr; }
      .dw-project-amenities-grid { grid-template-columns: repeat(3, 1fr); }
      .dw-project-gallery-section-grid { grid-template-columns: repeat(3, 1fr); }
      .dw-project-floor-plans-grid { grid-template-columns: repeat(2, 1fr); }
      .dw-project-highlights-grid { grid-template-columns: repeat(3, 1fr); }
    }

    @media (max-width: 640px) {
      .dw-project-spec-grid { grid-template-columns: repeat(2, 1fr); }
      .dw-project-highlights-grid { grid-template-columns: repeat(2, 1fr); }
      .dw-project-floor-plans-grid { grid-template-columns: 1fr; }
      .dw-project-amenities-grid { grid-template-columns: repeat(2, 1fr); }
      .dw-project-gallery-section-grid { grid-template-columns: repeat(2, 1fr); }
      .dw-project-similar-grid { grid-template-columns: 1fr 1fr; }
      .dw-project-location-points { grid-template-columns: 1fr; }
      .dw-project-brochure-banner { flex-direction: column; align-items: flex-start; }
      .dw-project-brochure-banner__cta { margin-left: 0; }
      .dw-project-expert-banner { flex-direction: column; align-items: flex-start; }
    }

    @media (max-width: 420px) {
      .dw-project-similar-grid { grid-template-columns: 1fr; }
      .dw-project-spec-grid { grid-template-columns: 1fr 1fr; }
    }


.dw-project-project-builder {
  width: 44px;
  height: 44px;
  border-radius: var(--radius-sm);
  background: var(--color-white);
  outline: 1px solid var(--color-border-light) !important;
  outline-offset: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden
}

.dw-project-project-builder img {
  width: 38px;
  height: 38px;
  object-fit: contain
}

.dw-project-project-builder-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dw-project-price-block__icon {
    width: 50px;
    height: 50px;
    padding: 8px;
    border-radius: var(--radius-pill);
    color: var(--color-primary);
    background-color: var(--color-bg-light-green);
}

.dw-project-price-block__icon svg{
    color: var(--color-primary);
}

.dw-project-similar-section .dw-project-section-title::after {
  content: unset;
}

/* ============================================================
    RESPONSIVE
============================================================ */
@media (max-width: 900px) {
  .dw-header  { display: none; }
  .dw-mob-bar { display: flex; }
  .dw-project-sticky-nav {
    top: var(--mob-bar-height);
  }
}
@media (min-width: 901px) {
  .dw-mob-bar,
  .dw-drawer  { display: none !important; }
}


/* ── Form Banners ─────────────────────────────────────────────── */
.dw-form-banner {
  display: block;
  width: 100%;
  padding: 14px 18px;
  margin-top: 16px;
  border-radius: var(--radius-md);
  font-family: var(--font-primary);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  line-height: 1.5;
  border-left: 4px solid transparent;
}

.dw-form-banner--success {
  background: #EAF5EF;
  color: var(--color-success);
  border: 1px solid #A8D5BA;
}

.dw-form-banner--error {
  background: #FDECEA;
  color: var(--color-error);
  border: 1px solid #F5B7B1;
}

#dw-cf-success-guest,#dw-rl-success {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ==============================
   SUCCESS STATE — dw-cf-success
============================== */
.dw-cf-success {
  display: none; /* show via JS */
  text-align: center;
  padding: 28px 22px;
  border-radius: var(--radius-lg);
  background: var(--color-bg-light-green);
  border: 1px solid var(--color-primary-10);
  /* box-shadow: var(--shadow-sm); */
  animation: dw-contact-drop-in 0.3s ease;
  /* max-width: 420px; */
  margin: 0 auto;
}

/* Active state */
.dw-cf-success--show {
  display: block;
}

/* Icon */
.dw-cf-success__icon {
  width: 54px;
  height: 54px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: var(--gradient-btn-3); /* success gradient */
  color: var(--color-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: var(--fw-bold);
  box-shadow: 0 6px 18px rgba(0, 91, 82, 0.2);
}

/* Title */
.dw-cf-success__title {
  font-size: var(--fs-h4);
  font-weight: var(--fw-bold);
  color: var(--color-primary-deep);
  margin-bottom: 6px;
}

/* Message */
.dw-cf-success__msg {
  font-size: var(--fs-sm);
  color: var(--color-text-para);
  line-height: var(--lh-p);
  max-width: 300px;
  margin: 0 auto;
}


.dw-project-amenity-card img {
  width: 50px;
  height: 50px;
  background: var(--color-primary);
  padding: 6px;
  border-radius: var(--radius-sm);
  object-fit: contain;
}

.dw-project-hero-swiper {
  width: 100%;
  height: 100%;
  position: relative;
}

.dw-project-hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
}

.dw-project-hero-nav {
      position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 20;
    background: var(--color-white);
    border: none;
    color: var(--color-primary);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
    backdrop-filter: blur(6px);
    box-shadow: var(--shadow-md);
}

.dw-project-hero-prev { left: 10px; }
.dw-project-hero-next { right: 10px; }

.dw-project-hero-pagination {
    position: absolute;
    bottom: 0 !important;
    left: 0 !important;
    transform: translateX(0%);
    z-index: 99999;
    display: flex;
    justify-content: center;
    padding: 8px;
}

.dw-project-hero-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--color-primary-10);
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
}

.dw-project-hero-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
        background: var(--color-primary-light, #009966);
    width: 22px;
    border-radius: 20px;
}

#dw-header-search-popup{position:fixed;inset:0;z-index:10000;display:flex;
align-items:flex-start;justify-content:center;padding-top:70px;
pointer-events:none;opacity:0;transition:opacity .22s ease}
#dw-header-search-popup.dw-open{pointer-events:auto;opacity:1}
#dw-header-search-popup[hidden]{display:none!important}

.dw-header-search-popup__backdrop{position:absolute;inset:0;
background:rgba(0,23,22,.6);backdrop-filter:blur(4px)}

.dw-header-search-popup__box{position:relative;width:100%;max-width:700px;
background:#fff;border-radius:14px;padding:16px;box-shadow:0 20px 60px rgba(0,0,0,.3)}

.dw-header-search-popup__tabs{display:flex;gap:2px;margin-bottom:10px;flex-wrap:wrap}

.dw-header-search-popup__tab{background:transparent;border:none;
border-bottom:2px solid transparent;color:#6A7282;font-size:.82rem;
font-weight:500;padding:6px 14px;cursor:pointer;transition:.16s ease;
border-radius:0}
.dw-header-search-popup__tab:hover{color:#005B52}
.dw-header-search-popup__tab.dw-active{border-bottom-color:#005B52;color:#005B52;font-weight:600}

.dw-header-search-popup__row{display:flex;align-items:center;gap:8px;
background:#F9F9FB;border:1.5px solid #CCD8D7;border-radius:10px;padding:4px 4px 4px 14px}

.dw-header-search-popup__icon{flex-shrink:0;width:17px;height:17px;color:#6A7282}

.dw-header-search-popup__input{flex:1;border:none;outline:none;background:transparent;
font-size:.93rem;color:#001716;padding:10px 8px;min-width:0}
.dw-header-search-popup__input::placeholder{color:#aaa}

.dw-header-search-popup__btn{background:linear-gradient(135deg,#009966,#005B52);
color:#fff;border:none;border-radius:8px;font-size:.88rem;font-weight:600;
padding:10px 22px;cursor:pointer;white-space:nowrap;transition:.16s ease}
.dw-header-search-popup__btn:hover{background:#003B35}

.dw-header-search-popup__close{
  background:none;
  border:none;
  font-size:1.1rem;
  color:#6A7282;
  cursor:pointer;
  padding:8px;
  border-radius:50%;
  line-height:1;
  position: absolute;
  top: 10px;right: 10px;
  transition:background .16s ease
}
.dw-header-search-popup__close:hover{background:#f0f0f0;color:#001716}

.dw-header-search-popup__locs{display:flex;align-items:center;flex-wrap:wrap;
gap:7px;margin-top:12px}

/* ── Filter dropdowns on search-list page ── */
.dw-filter-dropdown{position:absolute;top:100%;left:0;min-width:220px;
background:#fff;border-radius:10px;border:1px solid #CCD8D7;
box-shadow:0 8px 32px rgba(0,0,0,.13);z-index:999;margin-top:4px}
.dw-filter-dropdown__inner{padding:8px 0;max-height:260px;overflow-y:auto}
.dw-filter-option{padding:10px 16px;font-size:.88rem;color:#001716;cursor:pointer;
transition:background .14s;display:flex;align-items:center;gap:8px}
.dw-filter-option::before{content:"";width:16px;height:16px;border:1.5px solid #CCD8D7;
border-radius:4px;flex-shrink:0;transition:all .14s}
.dw-filter-option:hover{background:#F9F9FB}
.dw-filter-option.dw-active{color:#005B52;font-weight:600;background:#E8F5ED}
.dw-filter-option.dw-active::before{background:#005B52;border-color:#005B52;
background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
background-size:10px;background-repeat:no-repeat;background-position:center}

/* City + status = single select: hide checkbox look */
#dw-fd-city .dw-filter-option::before,#dw-fd-status .dw-filter-option::before{border-radius:50%}
#dw-fd-city .dw-filter-option.dw-active::before,#dw-fd-status .dw-filter-option.dw-active::before{
background:#005B52;border-color:#005B52;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
}

/* Price/Area range panel */
.dw-price-range-panel{padding:16px;min-width:300px}
.dw-range-section{margin-bottom:0}
.dw-range-title{font-size:.8rem;font-weight:600;color:#001716;text-transform:uppercase;
letter-spacing:.06em;margin-bottom:6px}
.dw-range-display{font-size:.88rem;font-weight:600;color:#005B52;margin-bottom:10px}
.dw-range-row{display:flex;align-items:center;gap:8px}
.dw-range-select{flex:1;border:1.5px solid #CCD8D7;border-radius:8px;padding:7px 10px;
font-size:.84rem;color:#001716;background:#fff;cursor:pointer;outline:none}
.dw-range-select:focus{border-color:#005B52}
.dw-range-sep{font-size:.8rem;color:#6A7282;flex-shrink:0}
.dw-range-divider{height:1px;background:#CCD8D7;margin:14px 0}
.dw-range-actions{display:flex;gap:8px;margin-top:14px;justify-content:flex-end}
.dw-range-clear{background:none;border:1.5px solid #CCD8D7;border-radius:8px;
padding:8px 16px;font-size:.84rem;color:#6A7282;cursor:pointer;transition:.14s}
.dw-range-clear:hover{border-color:#005B52;color:#005B52}
.dw-range-apply{background:linear-gradient(135deg,#009966,#005B52);color:#fff;border:none;
border-radius:8px;padding:8px 20px;font-size:.84rem;font-weight:600;cursor:pointer;transition:.14s}
.dw-range-apply:hover{background:#003B35}

/* More panel */
.dw-more-panel{padding:4px 0;min-width:260px}
.dw-more-section{padding:8px 0}
.dw-more-title{font-size:.75rem;font-weight:700;color:#6A7282;text-transform:uppercase;
letter-spacing:.08em;padding:0 16px 8px}
.dw-more-divider{height:1px;background:#CCD8D7;margin:4px 0}
.dw-bedroom-grid{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 8px}
.dw-bed-btn{background:#F9F9FB;border:1.5px solid #CCD8D7;border-radius:8px;
padding:7px 14px;font-size:.84rem;color:#001716;cursor:pointer;transition:.14s;font-weight:500}
.dw-bed-btn:hover{border-color:#005B52;color:#005B52}
.dw-bed-btn.dw-active{background:#E8F5ED;border-color:#005B52;color:#005B52;font-weight:600}

/* Type tabs on search-list bar */
.dw-search-list-type-tabs{display:flex;align-items:center;gap:0;border-right:1px solid #CCD8D7;
padding:0 4px;height:56px;flex-shrink:0}
.dw-sl-tab{background:transparent;border:none;border-bottom:2px solid transparent;
color:#6A7282;font-size:.82rem;font-weight:500;padding:6px 14px;height:100%;
cursor:pointer;transition:.16s ease;white-space:nowrap;font-family:var(--font-primary)}
.dw-sl-tab:hover{color:#005B52}
.dw-sl-tab.dw-active{border-bottom-color:#005B52;color:#005B52;font-weight:600}

/* Mobile: tabs scroll, filter bar scrolls horizontally */
@media(max-width:768px){
.dw-search-list-search-bar__inner{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.dw-search-list-search-bar__inner::-webkit-scrollbar{display:none}
.dw-search-list-type-tabs{flex-shrink:0}
.dw-sl-tab{padding:6px 10px;font-size:.78rem}
.dw-search-list-search-bar__filter{min-width:80px}
}

/* Position filter buttons relatively for dropdown */
.dw-search-list-search-bar__filter{position:relative}

/* Body scroll lock when popup open */
body.dw-search-open{overflow:hidden}

/* Nav arrows */
.dw-ps__arrow ,.reviews__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  background: var(--color-white);
  border: none;
  color: var(--color-primary);
  width: 38px; height: 38px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  backdrop-filter: blur(6px);
  box-shadow: var(--shadow-md);
}
.dw-ps__arrow:hover, .reviews__arrow:hover { background: var(--color-primary);color: var(--color-white); }
.dw-ps__arrow-prev, .reviews__arrow-prev { left: -30px; }
.dw-ps__arrow-next, .reviews__arrow-next { right: -30px; }

/* ── Recent remove button ── */
.dw-hero__recent-remove {
  background: none;
  border: none;
  color: rgba(255,255,255,0.45);
  font-size: 1rem;
  line-height: 1;
  padding: 0 2px 0 0;
  cursor: pointer;
  margin-left: -4px;
  transition: color 0.2s;
  vertical-align: middle;
}
.dw-hero__recent-remove:hover {
  color: rgba(255,100,100,0.85);
}

@media (max-width: 767px) {
  .reviews__arrow {
    display:none;
  }
  .dw-ps__arrow-next, .reviews__arrow-next {
      right: 0px;
  }
  .dw-ps__arrow-prev, .reviews__arrow-prev {
      left: 0px;
  }
}

/* ==============================
   MAPS PAGE CSS
============================== */

.dw-maps{
    background:var(--color-bg-light);
}
/* ── Breadcrumb hero ── */
.page-hero {
    position: relative;
    height: 250px;
    background: linear-gradient(120deg, var(--color-bg-dark) 0%, var(--color-primary-dark) 55%, var(--color-bg-dark) 100%);
    display: flex;
    align-items: center;
    overflow: hidden;
}

.page-hero__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.page-hero__img {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
}

.page-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    backdrop-filter: blur(2px);
    background: linear-gradient(120deg, var(--color-bg-dark) 0%, var(--color-primary-dark) 55%, var(--color-bg-dark) 100%);
    opacity: 0.8;
}

.page-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: 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='%23009966' fill-opacity='0.06'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    opacity: .5;
}

.page-hero-content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px;
}

.page-hero .breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: rgba(255, 255, 255, .55);
    margin-bottom: 12px;
}

.page-hero .breadcrumb a {
    color: rgba(255, 255, 255, .55);
    transition: color var(--transition)
}

.page-hero .breadcrumb a:hover {
    color: var(--color-accent-gold)
}

.page-hero .breadcrumb span {
    color: rgba(255, 255, 255, .85)
}

.page-hero .breadcrumb-sep {
    opacity: .4
}

.page-hero h1 {
    font-family: var(--font-secondary);
    font-size: clamp(28px, 3.5vw, 52px);
    font-weight: 700;
    color: #fff;
    line-height: 1.1;
    letter-spacing: -0.5px;
}

.page-hero h1 em {
    font-style: normal;
    background: var(--gradient-gold);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ── Toolbar / Filter bar ── */
.dw-maps .toolbar {
    background: #fff;
    border-bottom: 1px solid var(--color-border-light);
    position: relative;
    /* top: 0; */
    z-index: 100;
    box-shadow: var(--shadow-sm);
}

.dw-maps .toolbar-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 12px 40px;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    min-height: 64px;
}

.dw-maps .toolbar-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-para);
    white-space: nowrap
}

.dw-maps .filter-chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    flex: 1
}

.dw-maps .chip {
    padding: 6px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border: 1.5px solid var(--color-border-light);
    background: #fff;
    color: var(--color-text-para);
    transition: all var(--transition);
    white-space: nowrap;
}

.dw-maps .chip:hover {
    border-color: var(--color-primary);
    color: var(--color-primary)
}

.dw-maps .chip.active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff
}

.dw-maps .search-box {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--color-bg-light);
    border: 1.5px solid var(--color-border-light);
    border-radius: 999px;
    padding: 6px 16px;
    transition: border-color var(--transition);
}

.dw-maps .search-box:focus-within {
    border-color: var(--color-primary)
}

.dw-maps .search-box input {
    border: none;
    background: transparent;
    outline: none;
    font-family: var(--font-primary);
    font-size: 13px;
    color: var(--color-text-primary);
    width: 160px;
}

.dw-maps .search-box svg {
    flex-shrink: 0;
    opacity: .5
}


/* ── Section ── */
.dw-maps .section-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
}

.dw-maps .section-line {
    flex: 1;
    height: 1.5px;
    background: linear-gradient(90deg, var(--color-border-light) 0%, transparent 100%);
}

.dw-maps .section-count {
    background: var(--color-primary-10);
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

/* ── Grid ── */
.dw-maps .maps-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 20px;
}

/* ── Map Card ── */
.dw-maps .map-card {
    background: #fff;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.22s cubic-bezier(.4, 0, .2, 1), box-shadow 0.22s cubic-bezier(.4, 0, .2, 1), border-color var(--transition);
    position: relative;
}

.dw-maps .map-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 48px rgba(0, 91, 82, .14);
    border-color: rgba(0, 91, 82, .25);
}

.dw-maps .map-card:hover .card-overlay {
    opacity: 1
}

.dw-maps .map-card:hover .card-zoom {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1)
}

.dw-maps .card-img-wrap {
    position: relative;
    aspect-ratio: 4/3;
    overflow: hidden;
    background: var(--color-bg-light);
}

.dw-maps .card-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: var(--color-bg-light);
    transition: transform 0.45s cubic-bezier(.4, 0, .2, 1);
}

.dw-maps .map-card:hover .card-img-wrap img {
    transform: scale(1.07)
}

.dw-maps .card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 27, 22, 0) 30%, rgba(0, 27, 22, .7) 100%);
    opacity: 0;
    transition: opacity 0.22s ease;
}

.dw-maps .card-zoom {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(.8);
    opacity: 0;
    transition: all 0.22s cubic-bezier(.4, 0, .2, 1);
    background: rgba(255, 255, 255, .92);
    border-radius: 999px;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    box-shadow: 0 4px 20px rgba(0, 0, 0, .18);
    z-index: 2;
}

.dw-maps .card-new-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: var(--gradient-gold);
    color: var(--color-primary-deep);
    font-size: 10px;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 999px;
    letter-spacing: .4px;
    text-transform: uppercase;
    z-index: 3;
}

.dw-maps .card-body {
    padding: 14px 16px;
    border-top: 1px solid var(--color-border-light);
}

.dw-maps .card-title {
    font-size: var(--fs-h5);
    font-weight: 600;
    color: var(--color-text-primary);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.dw-maps .card_anchor  {
  color: var(--color-primary);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 5px;
  transition: opacity var(--transition);
}

.dw-maps .card-tag {
    background: var(--color-primary-90) !important;
    color: var(--color-white) !important;
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 999;
    box-shadow: var(--shadow-sm);
}

.dw-maps .card_anchor svg {
  width: 16px;
  height: 16px;
  margin-left: 4px;
}

.dw-maps .card-meta {
    font-size: 11.5px;
    color: var(--color-text-para);
    margin-top: 5px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.dw-maps .card-tag,.dw-map .md-category-badge {
    display: inline-flex;
    align-items: center;
    background: var(--color-primary-10);
    color: var(--color-primary);
    font-size: 10px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 999px;
    margin-bottom: 8px;
}

/* ── Lightbox ── */
.dw-maps #lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, .9);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
    display: flex;
    flex-direction: column;
}

.dw-maps #lightbox.open {
    opacity: 1;
    pointer-events: all
}

    /* ── Lightbox image loader ── */
    .dw-maps .lb-loader {
        position: absolute;
        inset: 0;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
        pointer-events: none;
        background: rgba(0,0,0,0.9);
        opacity: 0;
        transition: opacity 0.2s ease;
    }
    .dw-maps .lb-loader.visible {
        opacity: 1;
        pointer-events: all;
    }
    .dw-maps .lb-loader-ring,.dw-map .md-loader-ring {
        width: 48px;
        height: 48px;
        border: 3.5px solid rgba(255,255,255,0.12);
        border-top-color: var(--color-primary-light);
        border-radius: 50%;
        animation: lbSpin 0.75s linear infinite;
    }
    @keyframes lbSpin {
        to { transform: rotate(360deg); }
    }

/* Top bar */
.dw-maps .lb-top-bar {
    flex-shrink: 0;
    height: 56px;
    background: rgba(0, 18, 15, 0.95);
    border-bottom: 1px solid rgba(255, 255, 255, .07);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    gap: 12px;
    z-index: 10;
}

.dw-maps .lb-title {
    font-family: var(--font-primary);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dw-maps .lb-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-shrink: 0
}

.dw-maps .lb-btn {
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .12);
    color: #fff;
    border-radius: var(--radius-sm);
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    transition: background var(--transition);
    font-size: 16px;
    font-family: var(--font-primary);
    white-space: nowrap;
}

.dw-maps .lb-btn:hover {
    background: rgba(255, 255, 255, .18)
}

.dw-maps .lb-btn.close-btn {
    background: rgba(204, 0, 51, .15);
    border-color: rgba(204, 0, 51, .22)
}

.dw-maps .lb-btn.close-btn:hover {
    background: rgba(204, 0, 51, .45)
}

.dw-maps .lb-btn svg {
    flex-shrink: 0
}

.dw-maps .lb-btn-label {
    font-size: 12px;
    display: none
}

@media(min-width:600px) {
    .dw-maps .lb-btn-label {
        display: inline
    }
}

/* Middle: image area + sidebar */
.dw-maps .lb-body {
    flex: 1;
    display: flex;
    overflow: hidden;
    min-height: 0;
}

/* Image viewport */
.dw-maps .lb-img-wrap {
    flex: 1;
    position: relative;
    overflow: hidden;
    cursor: grab;
    touch-action: none;
    user-select: none;
    -webkit-user-select: none;
    background: transparent;
    min-width: 0;
}

.dw-maps .lb-img-wrap.dragging {
    cursor: grabbing;
}

.dw-maps #lbImg {
    position: absolute;
    /* centered via JS transform */
    display: block;
    max-width: none;
    pointer-events: none;
    will-change: transform;
}

/* Nav arrows */
.dw-maps .lb-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, .45);
    border: 1px solid rgba(255, 255, 255, .15);
    color: #fff;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background var(--transition);
    z-index: 5;
    font-size: 22px;
    flex-shrink: 0;
}

.dw-maps .lb-nav:hover {
    background: rgba(0, 91, 82, .7);
    border-color: rgba(0, 91, 82, .6)
}

.dw-maps .lb-prev {
    left: 12px
}

.dw-maps .lb-next {
    right: 12px
}

/* Zoom hint */
.dw-maps .lb-zoom-hint {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, .55);
    border-radius: 999px;
    color: rgba(255, 255, 255, .7);
    font-size: 11px;
    padding: 4px 12px;
    pointer-events: none;
    z-index: 4;
    transition: opacity .3s;
    white-space: nowrap;
}

/* Thumbnail sidebar */
.dw-maps .lb-sidebar {
    width: 110px;
    flex-shrink: 0;
    background: rgba(0, 12, 10, .97);
    border-left: 1px solid rgba(255, 255, 255, .07);
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 6px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .15) transparent;
}

.dw-maps .lb-sidebar::-webkit-scrollbar {
    width: 4px
}

.dw-maps .lb-sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .15);
    border-radius: 4px
}

.dw-maps .lb-thumb {
    flex-shrink: 0;
    width: 100%;
    aspect-ratio: 4/3;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color .15s, opacity .15s;
    opacity: .55;
    position: relative;
}

.dw-maps .lb-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none
}

.dw-maps .lb-thumb:hover {
    opacity: .85
}

.dw-maps .lb-thumb.active {
    border-color: var(--color-primary-light);
    opacity: 1
}

.dw-maps .lb-thumb-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, .65);
    color: #fff;
    font-size: 9px;
    padding: 3px 4px;
    line-height: 1.2;
    text-align: center;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Bottom bar */
.dw-maps .lb-bottom {
    flex-shrink: 0;
    height: 44px;
    background: rgba(0, 18, 15, 0.95);
    border-top: 1px solid rgba(255, 255, 255, .07);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 0 16px;
    z-index: 10;
}

.dw-maps .lb-counter {
    color: rgba(255, 255, 255, .55);
    font-size: 12px;
    font-weight: 500
}

.dw-maps .lb-zoom-level {
    color: var(--color-primary-light);
    font-size: 12px;
    font-weight: 600;
    min-width: 42px;
    text-align: center;
}

.dw-maps .lb-reset-btn {
    color: rgba(255, 255, 255, .45);
    font-size: 11px;
    cursor: pointer;
    padding: 3px 10px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 999px;
    transition: all var(--transition);
    background: transparent;
    font-family: var(--font-primary);
}

.dw-maps .lb-reset-btn:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, .35)
}

/* Mobile: sidebar becomes horizontal strip at bottom */
@media(max-width:640px) {
    .dw-maps .lb-body {
        flex-direction: column
    }

    .dw-maps .lb-sidebar {
        width: 100%;
        height: 80px;
        flex-direction: row;
        border-left: none;
        border-top: 1px solid rgba(255, 255, 255, .07);
        overflow-x: auto;
        overflow-y: hidden;
        padding: 6px;
        gap: 5px;
    }

    .dw-maps .lb-thumb {
        width: auto;
        height: 100%;
        aspect-ratio: 4/3;
        flex-shrink: 0;
    }

    .dw-maps .lb-thumb-label {
        display: none
    }

    .dw-maps .lb-nav {
        width: 36px;
        height: 36px;
        font-size: 18px
    }

    .dw-maps .lb-prev {
        left: 6px
    }

    .dw-maps .lb-next {
        right: 6px
    }
}

/* ── Empty state ── */
.dw-maps .empty-state {
    text-align: center;
    padding: 80px 20px;
    color: var(--color-text-para);
}

.dw-maps .empty-state svg {
    margin: 0 auto 20px;
    opacity: .3
}

.dw-maps .empty-state p {
    font-size: 15px
}

/* ── Back-to-top ── */
#scrollTop {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 500;
    background: var(--gradient-btn);
    color: #fff;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 6px 24px rgba(0, 91, 82, .35);
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.3s ease;
    pointer-events: none;
    border: none;
}

#scrollTop.visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all
}

#scrollTop:hover {
    transform: translateY(-3px)
}

/* ── Responsive ── */
@media(max-width:768px) {
    .page-hero {
        height: 160px
    }

    .page-hero-content {
        padding: 0 20px
    }

    .dw-maps .toolbar-inner {
        padding: 0 16px;
        height: auto;
        padding-top: 10px;
        padding-bottom: 10px;
        gap: 10px
    }

    .dw-maps .maps-grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 14px
    }

    .dw-maps .lb-nav {
        display: none
    }

    .dw-maps .search-box input {
        width: 100px
    }
}

/* ── Fade-in animation ── */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(18px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.dw-maps .map-section {
    animation: fadeUp .5s ease both
}

.dw-maps .map-section:nth-child(1) {
    animation-delay: .05s
}

.dw-maps .map-section:nth-child(2) {
    animation-delay: .1s
}

.dw-maps .map-section:nth-child(3) {
    animation-delay: .15s
}

.dw-maps .map-section:nth-child(4) {
    animation-delay: .2s
}

.dw-maps .map-section:nth-child(5) {
    animation-delay: .25s
}

.dw-maps .map-section:nth-child(6) {
    animation-delay: .3s
}

.dw-maps .map-section:nth-child(7) {
    animation-delay: .35s
}


/* ==============================
   NRI SERVICES PAGE CSS
============================== */

    /* ── Founder letter ── */
    .dw-nri-services .founder-card {
      background: linear-gradient(135deg, var(--color-bg-light-green), #fff);
      border: 1px solid var(--color-border-light);
      border-left: 4px solid var(--color-primary);
      border-radius: var(--radius-lg);
      padding: 36px 40px;
      position: relative;
      overflow: hidden;
    }
    .dw-nri-services .founder-card::before {
      content: '\201C';
      font-family: var(--font-secondary);
      font-size: 120px;
      color: var(--color-primary-10);
      position: absolute;
      top: -10px;
      left: 16px;
      line-height: 1;
      pointer-events: none;
    }
    .dw-nri-services .founder-card p {
      font-size: 15px;
      line-height: 1.85;
      color: var(--color-text-para);
      margin-bottom: 16px;
    }
    .dw-nri-services .founder-sig {
      font-family: var(--font-secondary);
      font-size: 18px;
      font-weight: 600;
      color: var(--color-primary);
    }
    .dw-nri-services .founder-title {
      font-size: 12px;
      color: var(--color-text-para);
      margin-top: 2px;
    }
    .dw-nri-services .founder-avatar {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: var(--color-primary);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: var(--font-secondary);
      font-size: 18px;
      font-weight: 600;
      flex-shrink: 0;
    }

    /* ── Service cards ── */
    .dw-nri-services .service-card {
      background: #fff;
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 28px 24px;
      height: 100%;
      transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
    }
    .dw-nri-services .service-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 12px 40px rgba(0,91,82,0.12);
      border-color: var(--color-primary);
    }
    .dw-nri-services .service-icon {
      width: 52px;
      height: 52px;
      background: var(--color-primary-10);
      border-radius: var(--radius-md);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 18px;
    }
    .dw-nri-services .service-icon svg { width: 26px; height: 26px; stroke: var(--color-primary); }
    .dw-nri-services .service-card h3 {
      font-size: 16px;
      font-weight: 600;
      color: var(--color-text-primary);
      margin-bottom: 10px;
    }
    .dw-nri-services .service-card p {
      font-size: 14px;
      color: var(--color-text-para);
      line-height: 1.7;
      margin: 0;
    }

    /* ── Location badges ── */
    .dw-nri-services .location-tag {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: var(--color-primary-10);
      color: var(--color-primary-dark);
      font-size: 13px;
      font-weight: 500;
      padding: 8px 16px;
      border-radius: 999px;
      border: 1px solid rgba(0,91,82,0.2);
    }
    .dw-nri-services .location-tag svg { width: 14px; height: 14px; }

    /* ── RBI Accounts accordion ── */
    .dw-nri-services .rbi-section { background: var(--color-bg-light); }
    .dw-nri-services .rbi-notice {
      background: rgba(239,177,0,0.1);
      border: 1px solid rgba(239,177,0,0.3);
      border-radius: var(--radius-md);
      padding: 14px 18px;
      font-size: 13px;
      color: #6B4C00;
      line-height: 1.6;
    }
    .dw-nri-services .rbi-notice svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; }

    .dw-nri-services .account-tabs {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 24px;
    }
    .dw-nri-services .account-tab {
      background: #fff;
      border: 1.5px solid var(--color-border-light);
      color: var(--color-text-para);
      font-size: 13px;
      font-weight: 600;
      padding: 10px 20px;
      border-radius: 999px;
      cursor: pointer;
      transition: all var(--transition);
      white-space: nowrap;
    }
    .dw-nri-services .account-tab:hover, .dw-nri-services .account-tab.active {
      background: var(--color-primary);
      border-color: var(--color-primary);
      color: #fff;
    }

    .dw-nri-services .account-panel { display: none; }
    .dw-nri-services .account-panel.active { display: block; }
    .dw-nri-services .account-panel-inner {
      background: #fff;
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 28px 32px;
    }
    .dw-nri-services .account-panel-inner h3 {
      font-family: var(--font-secondary);
      font-size: 20px;
      font-weight: 600;
      color: var(--color-primary-dark);
      margin-bottom: 20px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--color-border-light);
    }
    .dw-nri-services .feature-list { list-style: none; padding: 0; margin: 0; }
    .dw-nri-services .feature-list li {
      display: flex;
      gap: 12px;
      padding: 10px 0;
      font-size: 14px;
      color: var(--color-text-para);
      line-height: 1.65;
      border-bottom: 1px solid rgba(0,0,0,0.05);
    }
    .dw-nri-services .feature-list li:last-child { border-bottom: none; }
    .dw-nri-services .feature-list li::before {
      content: '';
      display: block;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--color-primary);
      margin-top: 7px;
      flex-shrink: 0;
    }

    /* Responsive */
    @media (max-width: 576px) {
      .dw-nri-services .founder-card { padding: 24px 20px; }
      .dw-nri-services .account-panel-inner { padding: 20px 18px; }
    }


/* ==============================
   INVESTMENT CONSULTANCY PAGE CSS
============================== */
    .dw-investment-consultancy .intro-image-wrap {
      position: relative;
      border-radius: var(--radius-xl);
      overflow: hidden;
      box-shadow: var(--shadow-md);
    }
    .dw-investment-consultancy .intro-image-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      min-height: 320px;
    }
    /* Gold accent corner badge on image */
    .dw-investment-consultancy .intro-image-badge {
      position: absolute;
      bottom: 20px;
      left: 20px;
      background: linear-gradient(135deg, var(--color-accent-gold), var(--color-gold-dark));
      color: var(--color-bg-dark);
      font-weight: 700;
      font-size: 13px;
      padding: 10px 18px;
      border-radius: var(--radius-md);
      display: flex;
      align-items: center;
      gap: 8px;
      box-shadow: 0 4px 16px rgba(0,0,0,0.22);
    }
    .dw-investment-consultancy .intro-image-badge svg { width: 16px; height: 16px; }

    .dw-investment-consultancy .intro-content { padding: 8px 0 8px 12px; }
    @media (min-width: 992px) { .dw-investment-consultancy .intro-content { padding: 0 0 0 48px; } }

    .dw-investment-consultancy .intro-check-list {
      list-style: none;
      padding: 0;
      margin: 24px 0 0;
    }
    .dw-investment-consultancy .intro-check-list li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-size: 15px;
      color: var(--color-text-para);
      margin-bottom: 14px;
      line-height: 1.6;
    }
    .dw-investment-consultancy .check-icon {
      width: 22px;
      height: 22px;
      background: var(--color-primary-10);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin-top: 1px;
    }
    .dw-investment-consultancy .check-icon svg { width: 12px; height: 12px; stroke: var(--color-primary); }

    /* ══════════════════════════════
       GOAL SECTION (dark band)
    ══════════════════════════════ */
    .dw-investment-consultancy .goal-section {
      background: linear-gradient(135deg, var(--color-bg-dark) 0%, var(--color-primary-dark) 100%);
      position: relative;
      overflow: hidden;
    }
    .dw-investment-consultancy .goal-section::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse at 20% 50%, rgba(0,153,102,0.12) 0%, transparent 55%);
      pointer-events: none;
    }
    .dw-investment-consultancy .goal-section .dw-section-header__title { color: #fff; }
    .dw-investment-consultancy .goal-section .dw-section-header__sub { color: rgba(255,255,255,0.68); }

    /* Process steps inside goal section */
    .dw-investment-consultancy .process-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 20px;
      margin-top: 48px;
    }
    .dw-investment-consultancy .process-step {
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: var(--radius-lg);
      padding: 28px 22px;
      position: relative;
      transition: background var(--transition), border-color var(--transition), transform var(--transition);
    }
    .dw-investment-consultancy .process-step:hover {
      background: rgba(255,255,255,0.1);
      border-color: rgba(0,153,102,0.4);
      transform: translateY(-4px);
    }
    .dw-investment-consultancy .step-number {
      font-family: var(--font-secondary);
      font-size: 42px;
      font-weight: 700;
      color: rgba(239,177,0,0.2);
      line-height: 1;
      margin-bottom: 12px;
    }
    .dw-investment-consultancy .process-step h3 {
      font-size: 15px;
      font-weight: 600;
      color: #fff;
      margin-bottom: 10px;
      line-height: 1.4;
    }
    .dw-investment-consultancy .process-step p {
      font-size: 13px;
      color: rgba(255,255,255,0.6);
      margin: 0;
      line-height: 1.7;
    }

    /* ══════════════════════════════
       EXPERTISE CARDS
    ══════════════════════════════ */
    .dw-investment-consultancy .expertise-section { background: var(--color-bg-light); }

    .dw-investment-consultancy .expertise-card {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 30px 26px;
      height: 100%;
      transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
      position: relative;
      overflow: hidden;
    }
    .dw-investment-consultancy .expertise-card::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--color-primary), var(--color-primary-light));
      transform: scaleX(0);
      transform-origin: left;
      transition: transform var(--transition-med);
    }
    .dw-investment-consultancy .expertise-card:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-md);
      border-color: transparent;
    }
    .dw-investment-consultancy .expertise-card:hover::after { transform: scaleX(1); }

    .dw-investment-consultancy .expertise-icon {
      width: 54px;
      height: 54px;
      background: var(--color-primary-10);
      border-radius: var(--radius-md);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
      transition: background var(--transition);
    }
    .dw-investment-consultancy .expertise-card:hover .expertise-icon { background: var(--color-primary); }
    .expertise-icon svg { width: 26px; height: 26px; stroke: var(--color-primary); transition: stroke var(--transition); }
    .dw-investment-consultancy .expertise-card:hover .expertise-icon svg { stroke: #fff; }
    .dw-investment-consultancy .expertise-card h3 {
      font-size: 16px;
      font-weight: 600;
      color: var(--color-text-primary);
      margin-bottom: 10px;
    }
    .dw-investment-consultancy .expertise-card p {
      font-size: 14px;
      color: var(--color-text-para);
      line-height: 1.75;
      margin: 0;
    }

    /* ══════════════════════════════
       CLIENT TYPES
    ══════════════════════════════ */

    .dw-investment-consultancy .client-pill {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-md);
      padding: 14px 20px;
      font-size: 14px;
      font-weight: 500;
      color: var(--color-text-primary);
      transition: all var(--transition);
      text-align: left;
      width: 100%;
    }
    .dw-investment-consultancy .client-pill:hover {
      border-color: var(--color-primary);
      background: var(--color-primary-10);
      color: var(--color-primary-dark);
    }
    .dw-investment-consultancy .client-pill .pill-dot {
      width: 10px; height: 10px;
      border-radius: 50%;
      background: var(--color-primary);
      flex-shrink: 0;
      transition: transform var(--transition);
    }
    .dw-investment-consultancy .client-pill:hover .pill-dot { transform: scale(1.4); }

    /* Highlight box */
    .dw-investment-consultancy .highlight-box {
      background: var(--color-bg-light-green);
      border-left: 4px solid var(--color-primary);
      border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
      padding: 28px 30px;
    }
    .dw-investment-consultancy .highlight-box p {
      font-size: 15px;
      color: var(--color-text-para);
      line-height: 1.85;
      margin: 0;
    }
    .dw-investment-consultancy .highlight-box strong { color: var(--color-primary-dark); }

    /* ── Responsive tweaks ── */
    @media (max-width: 576px) {
      .dw-investment-consultancy .highlight-box { padding: 22px 20px; }
    }

/* ==============================
   HOME LOAN PAGE CSS
============================== */    /* ══════════════
       MAIN CONTENT + STICKY CALCULATOR
    ══════════════ */
    .dw-home-loan .hl-main { padding: 72px 0; }

    /* ── Content side ── */
    .dw-home-loan .hl-content h2 {
      font-family: var(--font-primary); font-size: clamp(20px,2vw,28px); font-weight: 600;
      color: var(--color-text-primary); margin-bottom: 14px; margin-top: 36px;
    }
    .dw-home-loan .hl-content h2:first-child { margin-top: 0; }
    .dw-home-loan .hl-content p { font-size: 15px; color: var(--color-text-para); line-height: 1.85; margin-bottom: 0; }

    /* Component cards */
    .dw-home-loan .component-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 16px; margin-top: 24px; }
    .dw-home-loan .component-card {
      background: var(--color-bg-light-green);
      border: 1px solid var(--color-border-light);
      border-left: 3px solid var(--color-primary);
      border-radius: var(--radius-md);
      padding: 18px 20px;
    }
    .dw-home-loan .component-card strong { display: block; font-size: 14px; font-weight: 600; color: var(--color-primary-dark); margin-bottom: 6px; }
    .dw-home-loan .component-card span { font-size: 13px; color: var(--color-text-para); line-height: 1.7; }

    /* ── EMI Calculator sticky card ── */
    .dw-home-loan .calc-sticky { position: sticky; top: 24px; }

    .dw-home-loan .emi-card {
      background: #fff;
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-md);
      overflow: hidden;
    }
    .dw-home-loan .emi-card-header {
      background: linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
      padding: 24px 28px 20px;
    }
    .dw-home-loan .emi-card-header h2 {
      font-family: var(--font-secondary); font-size: 22px; font-weight: 600;
      color: #fff; margin: 0 0 4px;
    }
    .dw-home-loan .emi-card-header p { font-size: 13px; color: rgba(255,255,255,0.65); margin: 0; }

    .dw-home-loan .emi-card-body { padding: 26px 28px; }

    /* Range + label row */
    .dw-home-loan .emi-field { margin-bottom: 22px; }
    .dw-home-loan .emi-field-top {
      display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px;
    }
    .dw-home-loan .emi-field-top label { font-size: 12px; font-weight: 600; color: var(--color-text-para); letter-spacing: .4px; text-transform: uppercase; }
    .dw-home-loan .emi-val-box {
      background: var(--color-primary-10);
      border: 1px solid rgba(0,91,82,0.2);
      border-radius: var(--radius-sm);
      padding: 4px 10px;
      font-size: 13px; font-weight: 600; color: var(--color-primary-dark);
      min-width: 90px; text-align: right;
    }

    /* Custom range slider */
    .dw-home-loan input[type="range"] {
      -webkit-appearance: none; appearance: none;
      width: 100%; height: 5px;
      background: var(--color-border-light);
      border-radius: 999px; outline: none; cursor: pointer;
    }
    .dw-home-loan input[type="range"]::-webkit-slider-thumb {
      -webkit-appearance: none; appearance: none;
      width: 20px; height: 20px; border-radius: 50%;
      background: var(--color-primary);
      border: 3px solid #fff;
      box-shadow: 0 0 0 1px var(--color-primary);
      cursor: pointer; transition: transform var(--transition);
    }
    .dw-home-loan input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.2); }
    .dw-home-loan input[type="range"]::-moz-range-thumb {
      width: 20px; height: 20px; border-radius: 50%;
      background: var(--color-primary); border: 3px solid #fff;
      box-shadow: 0 0 0 1px var(--color-primary); cursor: pointer;
    }
    /* Dynamic fill using CSS custom property */
    .dw-home-loan input[type="range"].filled {
      background: linear-gradient(to right, var(--color-primary) 0%, var(--color-primary) var(--pct, 50%), var(--color-border-light) var(--pct, 50%), var(--color-border-light) 100%);
    }

    /* Result block */
    .dw-home-loan .emi-result {
      background: linear-gradient(135deg, var(--color-bg-dark), var(--color-primary-dark));
      border-radius: var(--radius-lg);
      padding: 22px 24px;
      text-align: center;
      margin-bottom: 20px;
    }
    .dw-home-loan .emi-result .result-label { font-size: 12px; color: rgba(255,255,255,0.6); letter-spacing: .5px; margin-bottom: 6px; }
    .dw-home-loan .emi-result .result-amount {
      font-family: var(--font-secondary); font-size: clamp(30px,3vw,42px);
      font-weight: 700; color: var(--color-accent-gold); line-height: 1;
      margin-bottom: 4px;
    }
    .dw-home-loan .emi-result .result-sub { font-size: 12px; color: rgba(255,255,255,0.5); }

    /* Mini breakdown row */
    .dw-home-loan .emi-breakdown {
      display: flex; gap: 10px; margin-bottom: 20px;
    }
    .dw-home-loan .breakdown-item {
      flex: 1; background: var(--color-bg-light); border-radius: var(--radius-md);
      padding: 12px 14px; text-align: center;
    }
    .dw-home-loan .breakdown-item .bd-label { font-size: 11px; color: var(--color-text-para); margin-bottom: 4px; }
    .dw-home-loan .breakdown-item .bd-val { font-size: 14px; font-weight: 600; color: var(--color-text-primary); }

    /* Donut chart */
    .dw-home-loan .donut-wrap { display:flex; align-items:center; gap:18px; margin-bottom:20px; }
    .dw-home-loan .donut-svg { flex-shrink:0; }
    .dw-home-loan .donut-legend { flex: 1; }
    .dw-home-loan .legend-row { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
    .dw-home-loan .legend-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
    .dw-home-loan .legend-text { font-size:12px; color: var(--color-text-para); }
    .dw-home-loan .legend-text strong { color: var(--color-text-primary); display:block; }

    /* CTA button */
    .dw-home-loan .btn-apply-loan {
      display: flex; align-items: center; justify-content: center; gap: 8px;
      width: 100%;
      background: linear-gradient(135deg, var(--color-accent-gold), var(--color-gold-dark));
      color: var(--color-bg-dark); font-weight: 700; font-size: 15px;
      padding: 15px 24px; border-radius: var(--radius-md);
      text-decoration: none; border: none; cursor: pointer;
      transition: opacity var(--transition), transform var(--transition);
    }
    .dw-home-loan .btn-apply-loan:hover { opacity: .88; transform: translateY(-2px); color: var(--color-bg-dark); }
    .dw-home-loan .btn-apply-loan svg { width:16px; height:16px; }

    /* ══════════════
       BANK PARTNERS
    ══════════════ */
    .dw-home-loan .banks-section { padding: 64px 0; background: var(--color-bg-light); }
    .dw-home-loan .bank-chip {
      display: inline-flex; align-items: center; gap: 8px;
      background: #fff; border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md); padding: 10px 18px;
      font-size: 14px; font-weight: 500; color: var(--color-text-primary);
      transition: border-color var(--transition), box-shadow var(--transition);
    }
    .dw-home-loan .bank-chip:hover { border-color: var(--color-primary); box-shadow: var(--shadow-sm); }
    .dw-home-loan .bank-chip .bank-dot { width:8px; height:8px; border-radius:50%; background:var(--color-primary); }

    /* ══════════════
       MODAL
    ══════════════ */
    .dw-home-loan .loan-modal .modal-content {
      border-radius: var(--radius-xl); overflow: hidden; border: none;
      box-shadow: 0 24px 60px rgba(0,0,0,0.2);
    }
    .dw-home-loan .loan-modal .modal-header {
      background: linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
      border: none; padding: 22px 28px;
    }
    .dw-home-loan .loan-modal .modal-header h2 { font-family:var(--font-secondary); color:#fff; font-size:22px; margin:0; }
    .dw-home-loan .loan-modal .modal-header .btn-close { filter: invert(1); opacity:.7; }
    .dw-home-loan .loan-modal .modal-body { padding: 28px; }

    .dw-home-loan .modal-input {
      width: 100%; border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-md); padding: 11px 14px;
      font-size: 14px; font-family: var(--font-primary); color: var(--color-text-primary);
      outline: none; transition: border-color var(--transition), box-shadow var(--transition);
      background: var(--color-bg-light);
    }
    .dw-home-loan .modal-input:focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-10); background:#fff; }
    .dw-home-loan .modal-input::placeholder { color: #aaa; }
    .dw-home-loan .modal-label { font-size:12px; font-weight:600; color:var(--color-text-para); letter-spacing:.4px; text-transform:uppercase; margin-bottom:6px; display:block; }
    .dw-home-loan .field-error { font-size:12px; color:#CC0033; margin-top:4px; display:none; }
    .dw-home-loan .field-error.show { display:block; }

    .dw-home-loan .btn-submit-modal {
      width:100%; background: var(--color-primary); color:#fff;
      font-weight:700; font-size:15px; padding:13px; border-radius:var(--radius-md);
      border:none; cursor:pointer; transition: background var(--transition);
      font-family: var(--font-primary);
    }
    .dw-home-loan .btn-submit-modal:hover { background: var(--color-primary-light); }


    @media(max-width:576px){
      .dw-home-loan .emi-card-body { padding: 20px 18px; }
      .dw-home-loan .emi-breakdown { flex-direction:column; }
    }


/* ==============================
   ASSET MANAGEMENT PAGE CSS
============================== */

    .section-divider {
      width: 48px; height: 3px;
      background: var(--gradient-btn-cta, linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%));
      border-radius: 2px;
      margin: 16px 0 20px;
    }
    .section-divider.gold {
      background: var(--gradient-gold);
    }

    /* ============================================================
       INTRO SECTION — What Is Real Estate Asset Management
    ============================================================ */
    .dw-asset-management #what-is-asset-management { background: var(--color-white); }
    .dw-asset-management .intro-image-wrap {
      position: relative;
      border-radius: var(--radius-xl);
      overflow: hidden;
      box-shadow: var(--shadow-md);
    }
    .dw-asset-management .intro-image-wrap img {
      width: 100%;
      height: 420px;
      object-fit: cover;
      transition: transform 0.6s ease;
    }
    .dw-asset-management .intro-image-wrap:hover img { transform: scale(1.03); }
    .dw-asset-management .intro-image-badge {
      position: absolute;
      bottom: 24px; left: 24px;
      background: rgba(0,23,22,0.82);
      backdrop-filter: blur(12px);
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: var(--radius-md);
      padding: 14px 18px;
      display: flex;
      align-items: center;
      gap: 12px;
      color: var(--color-white);
    }
    .dw-asset-management .intro-image-badge .badge-icon {
      width: 42px; height: 42px;
      border-radius: var(--radius-sm);
      background: var(--gradient-btn-cta, linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%));
      display: flex; align-items: center; justify-content: center;
      font-size: 20px; flex-shrink: 0;
    }
    .dw-asset-management .intro-image-badge .badge-text strong { display: block; font-size: 14px; font-weight: var(--fw-semibold); }
    .dw-asset-management .intro-image-badge .badge-text span { font-size: 12px; color: rgba(255,255,255,0.65); }

    /* ============================================================
       WHAT DOES A MANAGER DO — Timeline style
    ============================================================ */
    .dw-asset-management #manager-role { background: var(--color-bg-light); }
    .dw-asset-management .role-card {
      background: var(--color-white);
      border-radius: var(--radius-lg);
      padding: 28px 28px 28px 24px;
      box-shadow: var(--shadow-sm);
      border: 1px solid var(--color-border-light);
      display: flex;
      gap: 20px;
      align-items: flex-start;
      transition: transform var(--transition-med), box-shadow var(--transition-med);
      height: 100%;
    }
    .dw-asset-management .role-card:hover {
      transform: translateY(-4px);
      box-shadow: var(--shadow-md);
    }
    .dw-asset-management .role-card-icon {
      width: 52px; height: 52px;
      border-radius: var(--radius-md);
      background: var(--color-primary-10);
      display: flex; align-items: center; justify-content: center;
      font-size: 22px;
      color: var(--color-primary);
      flex-shrink: 0;
      transition: background var(--transition), color var(--transition);
    }
    .dw-asset-management .role-card:hover .role-card-icon {
      background: var(--gradient-btn);
      color: var(--color-white);
    }
    .dw-asset-management .role-card h3 {
      font-family: var(--font-primary);
      font-size: clamp(14px, 1vw, 18px);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      margin-bottom: 6px;
    }
    .dw-asset-management .role-card p { font-size: 13.5px; color: var(--color-text-para); margin: 0; line-height: 1.65; }

    /* ============================================================
       STATS BAND
    ============================================================ */
    .dw-asset-management .stats-band {
      background: var(--gradient-tile);
      padding: 60px 0;
      position: relative;
      overflow: hidden;
    }
    .dw-asset-management .stats-band::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse 50% 100% at 50% 50%, rgba(0,153,102,0.15) 0%, transparent 70%);
      pointer-events: none;
    }
    .dw-asset-management .stat-item { text-align: center; position: relative; z-index: 1; }
    .dw-asset-management .stat-number {
      font-family: var(--font-secondary);
      font-size: clamp(36px, 3vw, 56px);
      font-weight: var(--fw-bold);
      background: var(--gradient-gold-premium);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1.1;
      display: block;
    }
    .dw-asset-management .stat-label { font-size: 13px; color: rgba(255,255,255,0.7); margin-top: 6px; font-weight: var(--fw-medium); }
    .dw-asset-management .stat-divider {
      width: 1px;
      background: rgba(255,255,255,0.12);
      height: 60px;
      margin: auto;
    }
    @media (max-width: 767px) { .dw-asset-management .stat-divider { display: none; } }

    /* ============================================================
       WORKING WITH DREAMWORLD — Process Steps
    ============================================================ */
    .dw-asset-management #working-with-us { background: var(--color-white); }
    .dw-asset-management .process-step {
      position: relative;
      padding: 36px 28px;
      background: var(--color-bg-light);
      border-radius: var(--radius-lg);
      border: 1px solid var(--color-border-light);
      overflow: hidden;
      transition: transform var(--transition-med), box-shadow var(--transition-med), border-color var(--transition-med);
    }
    .dw-asset-management .process-step:hover {
      transform: translateY(-4px);
      box-shadow: var(--shadow-md);
      border-color: var(--color-primary);
    }
    .dw-asset-management .process-step::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: var(--gradient-btn);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform var(--transition-med);
    }
    .dw-asset-management .process-step:hover::before { transform: scaleX(1); }
    .step-number {
      font-family: var(--font-secondary);
      font-size: 64px;
      font-weight: var(--fw-bold);
      color: var(--color-primary-10);
      line-height: 1;
      position: absolute;
      top: 14px; right: 18px;
      transition: color var(--transition-med);
    }
    .dw-asset-management .process-step:hover .step-number { color: rgba(0,91,82,0.15); }
    .step-icon {
      width: 48px; height: 48px;
      background: var(--gradient-btn);
      border-radius: var(--radius-md);
      display: flex; align-items: center; justify-content: center;
      color: var(--color-white);
      font-size: 20px;
      margin-bottom: 16px;
    }
    .dw-asset-management .process-step h3 {
      font-size: clamp(14px, 1vw, 17px);
      font-family: var(--font-secondary);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      margin-bottom: 8px;
    }
    .dw-asset-management .process-step p { font-size: 13px; color: var(--color-text-para); margin: 0; line-height: 1.65; }

    /* ============================================================
       BUTTONS
    ============================================================ */
    .dw-asset-management .btn-primary-dw {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--gradient-btn);
      color: var(--color-white);
      border: none;
      border-radius: var(--radius-md);
      padding: 13px 28px;
      font-size: 14px;
      font-weight: var(--fw-semibold);
      font-family: var(--font-primary);
      cursor: pointer;
      transition: opacity var(--transition), transform var(--transition);
      text-decoration: none;
    }
    .dw-asset-management .btn-primary-dw:hover { opacity: 0.9; transform: translateY(-1px); color: var(--color-white); }

    .dw-asset-management .btn-gold-dw {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--gradient-gold);
      color: var(--color-text-primary);
      border: none;
      border-radius: var(--radius-md);
      padding: 13px 28px;
      font-size: 14px;
      font-weight: var(--fw-bold);
      font-family: var(--font-primary);
      cursor: pointer;
      transition: opacity var(--transition), transform var(--transition);
      text-decoration: none;
    }
    .dw-asset-management .btn-gold-dw:hover { opacity: 0.92; transform: translateY(-1px); color: var(--color-text-primary); }

    .dw-asset-management .btn-outline-dw {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: transparent;
      color: var(--color-white);
      border: 1.5px solid rgba(255,255,255,0.45);
      border-radius: var(--radius-md);
      padding: 12px 26px;
      font-size: 14px;
      font-weight: var(--fw-semibold);
      font-family: var(--font-primary);
      cursor: pointer;
      transition: border-color var(--transition), background var(--transition);
      text-decoration: none;
    }
    .dw-asset-management .btn-outline-dw:hover { border-color: rgba(255,255,255,0.9); background: rgba(255,255,255,0.08); color: var(--color-white); }

    /* ============================================================
       TRUST BADGES
    ============================================================ */
    .dw-asset-management .trust-strip {
      background: var(--color-bg-light-green);
      border-top: 1px solid var(--color-border-light);
      border-bottom: 1px solid var(--color-border-light);
      padding: 20px 0;
    }
    .dw-asset-management .trust-item {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 13px;
      font-weight: var(--fw-medium);
      color: var(--color-primary);
    }
    .dw-asset-management .trust-item i { font-size: 18px; color: var(--color-primary-light); }

    /* ============================================================
       ANIMATIONS
    ============================================================ */
    @keyframes fadeInUp {
      from { opacity: 0; transform: translateY(28px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    .dw-asset-management .animate-in { animation: fadeInUp 0.6s ease both; }
    .dw-asset-management .delay-1 { animation-delay: 0.1s; }
    .dw-asset-management .delay-2 { animation-delay: 0.2s; }
    .dw-asset-management .delay-3 { animation-delay: 0.3s; }
    .dw-asset-management .delay-4 { animation-delay: 0.4s; }

    /* ============================================================
       RESPONSIVE TWEAKS
    ============================================================ */
    @media (max-width: 991px) {
      .dw-asset-management .cta-banner { padding: 40px 28px; }
      .dw-asset-management .intro-image-wrap img { height: 320px; }
    }
    @media (max-width: 767px) {
      .page-breadcrumb { padding: 80px 0 50px; min-height: 220px; }
      section { padding: 48px 0; }
      .dw-asset-management .cta-banner { padding: 32px 22px; }
      .dw-asset-management .intro-image-wrap img { height: 260px; }
      .dw-asset-management .role-card { flex-direction: column; }
    }
    @media (max-width: 575px) {
      .dw-asset-management .cta-banner { text-align: center; }
    }

/* ==============================
   RENTAL AND LEASING PAGE CSS
============================== */
    .rental-and-leasing .section--green { background: var(--color-bg-light-green); }

    /* ── About section prose ── */
    .rental-and-leasing .about-img-wrapper {
      position: relative;
      border-radius: var(--radius-lg);
      overflow: hidden;
      box-shadow: var(--shadow-md);
    }
    .rental-and-leasing .about-img-wrapper img { width: 100%; height: 100%; object-fit: cover; display: block; min-height: 340px; }
    .rental-and-leasing .about-img-badge {
      position: absolute;
      bottom: 24px; left: 24px;
      background: var(--color-white);
      border-radius: var(--radius-md);
      padding: 14px 18px;
      box-shadow: var(--shadow-md);
      display: flex; align-items: center; gap: 12px;
    }
    .rental-and-leasing .about-img-badge__icon {
      width: 44px; height: 44px;
      background: var(--color-primary);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      color: var(--color-white); font-size: 20px;
      flex-shrink: 0;
    }
    .rental-and-leasing .about-img-badge__text p { margin: 0; font-size: 12px; color: var(--color-text-para); }
    .rental-and-leasing .about-img-badge__text strong { font-size: 15px; color: var(--color-text-primary); }

    /* ── Form card ── */
    .rental-and-leasing .form-card {
      background: var(--color-white);
      border-radius: var(--radius-lg);
      box-shadow: var(--shadow-md);
      border: 1px solid var(--color-border-light);
      overflow: hidden;
    }
    .rental-and-leasing .form-card__header {
      background: var(--gradient-btn);
      padding: 22px 28px 18px;
    }
    .rental-and-leasing .form-card__header h2 {
      font-size: 20px;
      color: var(--color-white);
      margin: 0;
    }
    .rental-and-leasing .form-card__header p {
      font-size: 13px;
      color: rgba(255,255,255,0.7);
      margin: 4px 0 0;
    }
    .rental-and-leasing .form-card__body { padding: 24px 28px 28px; }

    /* Radio toggle */
    .rental-and-leasing .type-toggle { display: flex; gap: 8px; margin-bottom: 20px; }
    .rental-and-leasing .type-toggle input[type="radio"] { display: none; }
    .rental-and-leasing .type-toggle label {
      flex: 1;
      text-align: center;
      padding: 9px 12px;
      border-radius: var(--radius-sm);
      border: 1.5px solid var(--color-border-light);
      font-size: 14px;
      font-weight: 500;
      color: var(--color-text-para);
      cursor: pointer;
      transition: var(--transition);
      user-select: none;
    }
    .rental-and-leasing .type-toggle input[type="radio"]:checked + label {
      background: var(--color-primary);
      border-color: var(--color-primary);
      color: var(--color-white);
    }

    /* ── DW Form System styles (matches your site's dw-ef-* classes) ── */

    /* Row layout for phone + email side-by-side */
    .dw-ef-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }
    @media (max-width: 480px) { .dw-ef-row { grid-template-columns: 1fr; } }


    /* Rent/Lease toggle (kept from design) */
    .rental-and-leasing .type-toggle { display: flex; gap: 8px; margin-bottom: 18px; }
    .rental-and-leasing .type-toggle input[type="radio"] { display: none; }
    .rental-and-leasing .type-toggle label {
      flex: 1;
      text-align: center;
      padding: 9px 12px;
      border-radius: var(--radius-sm);
      border: 1.5px solid var(--color-border-light);
      font-size: 13px;
      font-weight: 500;
      color: var(--color-text-para);
      cursor: pointer;
      transition: var(--transition);
      user-select: none;
    }
    .rental-and-leasing .type-toggle input[type="radio"]:checked + label {
      background: var(--color-primary);
      border-color: var(--color-primary);
      color: var(--color-white);
    }

    /* ── Service cards ── */
    .rental-and-leasing .service-card {
      border-radius: var(--radius-lg);
      border: 1px solid var(--color-border-light);
      padding: 32px 28px;
      height: 100%;
      background: var(--color-white);
      transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition);
      position: relative;
      overflow: hidden;
    }
    .rental-and-leasing .service-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: var(--gradient-btn);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform var(--transition);
    }
    .rental-and-leasing .service-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); border-color: var(--color-primary-10); }
    .rental-and-leasing .service-card:hover::before { transform: scaleX(1); }
    .rental-and-leasing .service-card__icon {
      width: 56px; height: 56px;
      border-radius: var(--radius-md);
      background: var(--color-primary-10);
      display: flex; align-items: center; justify-content: center;
      font-size: 26px;
      color: var(--color-primary);
      margin-bottom: 20px;
      transition: background var(--transition), color var(--transition);
    }
    .rental-and-leasing .service-card:hover .service-card__icon { background: var(--color-primary); color: var(--color-white); }
    .rental-and-leasing .service-card h3 { font-size: 17px; font-weight: 700; color: var(--color-text-primary); margin-bottom: 10px; }
    .rental-and-leasing .service-card p { font-size: 14px; color: var(--color-text-para); line-height: 1.7; margin: 0; }

    /* ── Process steps ── */
    .rental-and-leasing .process-step {
      display: flex;
      gap: 20px;
      align-items: flex-start;
      padding: 24px;
      border-radius: var(--radius-md);
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      transition: box-shadow var(--transition);
    }
    .rental-and-leasing .process-step:hover { box-shadow: var(--shadow-sm); }
    .rental-and-leasing .step-num {
      width: 48px; height: 48px;
      border-radius: 50%;
      background: var(--color-primary);
      color: var(--color-white);
      font-size: 18px;
      font-weight: 700;
      font-family: var(--font-secondary);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .rental-and-leasing .process-step h4 { font-size: 16px; color: var(--color-text-primary); margin-bottom: 6px; }
    .rental-and-leasing .process-step p { font-size: 14px; color: var(--color-text-para); margin: 0; line-height: 1.6; }
    /* ── Responsive tweaks ── */
    @media (max-width: 767.98px) {
      .rental-and-leasing .form-card__body { padding: 20px 20px 24px; }
    }


/* ==============================
   CAREERS PAGE CSS
============================== */
    /* ═══════════════════════════════════
       WHY JOIN US
    ═══════════════════════════════════ */
    .cr-why {  background: var(--color-bg-light); }
    .cr-perks-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-top: 40px;
    }
    @media (max-width: 991px) { .cr-perks-grid { grid-template-columns: repeat(2,1fr); } }
    @media (max-width: 575px) { .cr-perks-grid { grid-template-columns: 1fr; } }
    .cr-perk {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 28px 24px;
      transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast);
    }
    .cr-perk:hover {
      transform: translateY(-4px);
      box-shadow: var(--shadow-md);
      border-color: var(--color-primary-light);
    }
    .cr-perk__icon {
      width: 48px; height: 48px;
      border-radius: var(--radius-md);
      background: var(--color-bg-light-green);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 16px;
    }
    .cr-perk__icon svg { width: 24px; height: 24px; color: var(--color-primary); }
    .cr-perk__title {
      font-size: var(--fs-h5);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      margin-bottom: 6px;
    }
    .cr-perk__desc {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      line-height: 1.6;
    }

    /* ═══════════════════════════════════
       JOB LISTINGS
    ═══════════════════════════════════ */
    .cr-jobs {  background: var(--color-white); }
    .cr-jobs-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 24px;
      margin-top: 40px;
    }
    @media (max-width: 767px) { .cr-jobs-grid { grid-template-columns: 1fr; } }

    .cr-job-card {
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      overflow: hidden;
      background: var(--color-white);
      transition: box-shadow var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
      display: flex;
      flex-direction: column;
    }
    .cr-job-card:hover {
      box-shadow: 0 12px 40px rgba(0,91,82,.12);
      border-color: var(--color-primary);
      transform: translateY(-3px);
    }
    .cr-job-card__head {
      padding: 24px 24px 16px;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 12px;
    }
    .cr-job-card__title {
      font-size: var(--fs-h4);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      margin: 0;
    }
    .cr-job-card__date {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      white-space: nowrap;
      display: flex;
      align-items: center;
      gap: 5px;
    }
    .cr-job-card__badges { display: flex; gap: 8px; flex-wrap: wrap; padding: 0 24px 16px; }
    .cr-badge {
      font-size: var(--fs-badge);
      font-weight: var(--fw-semibold);
      padding: 4px 12px;
      border-radius: var(--radius-pill);
      display: inline-block;
    }
    .cr-badge--green {
      background: var(--color-bg-light-green);
      color: var(--color-primary);
      border: 1px solid rgba(0,153,102,.2);
    }
    .cr-badge--orange {
      background: rgba(254,154,0,.1);
      color: var(--color-warning-dark);
      border: 1px solid rgba(254,154,0,.25);
    }
    .cr-job-card__meta {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px 16px;
      padding: 16px 24px;
      border-top: 1px solid var(--color-border-light);
      background: var(--color-bg-light);
    }
    .cr-meta-item {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: var(--fs-xs);
      color: var(--color-text-para);
    }
    .cr-meta-item svg {
      width: 15px; height: 15px;
      color: var(--color-primary-light);
      flex-shrink: 0;
    }
    .cr-job-card__body {
      padding: 20px 24px;
      flex: 1;
    }
    .cr-job-card__desc {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      line-height: 1.7;
      margin: 0;
    }
    .cr-job-card__footer {
      padding: 16px 24px 24px;
    }
    .cr-btn-apply {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--gradient-btn-2);
      color: var(--color-white) !important;
      font-size: var(--fs-btn-sm);
      font-weight: var(--fw-semibold);
      padding: 11px 24px;
      border-radius: var(--radius-md);
      text-decoration: none !important;
      transition: opacity var(--transition), transform var(--transition);
      border: none;
      cursor: pointer;
    }
    .cr-btn-apply:hover { opacity: .88; transform: translateX(2px); }
    .cr-btn-apply svg { width: 16px; height: 16px; transition: transform var(--transition); }
    .cr-btn-apply:hover svg { transform: translateX(3px); }

    /* ═══════════════════════════════════
       APPLY FORM SECTION
    ═══════════════════════════════════ */
    .cr-apply {  background: var(--color-bg-light); }
    .cr-apply-wrap {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
      align-items: start;
    }
    @media (max-width: 991px) { .cr-apply-wrap { grid-template-columns: 1fr; } }

    /* Left info panel */
    .cr-apply-info { position: sticky; top: 100px; }
    .dw-section-header__title {
      font-size: var(--fs-h2);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      margin-bottom: 12px;
    }
    .cr-apply-info__para {
      font-size: var(--fs-p);
      color: var(--color-text-para);
      line-height: 1.7;
      margin-bottom: 28px;
    }
    .cr-apply-info__steps { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; }
    .cr-step {
      display: flex;
      gap: 14px;
      align-items: flex-start;
    }
    .cr-step__num {
      width: 32px; height: 32px;
      background: var(--gradient-btn-2);
      color: var(--color-white);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: var(--fs-xs);
      font-weight: var(--fw-bold);
      flex-shrink: 0;
    }
    .cr-step__text strong {
      display: block;
      font-size: var(--fs-sm);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      margin-bottom: 2px;
    }
    .cr-step__text span {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
    }

    /* Form card */
    .cr-form-card {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      padding: clamp(24px, 4vw, 40px);
      box-shadow: var(--shadow-sm);
    }
    .cr-form-card__title {
      font-size: var(--fs-h3);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      margin-bottom: 4px;
    }
    .cr-form-card__sub {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      margin-bottom: 28px;
    }

    /* File upload */
    .dw-ef-file-wrap {
      position: relative;
      border: 1.5px dashed var(--color-border-light);
      border-radius: var(--radius-md);
      background: var(--color-bg-light);
      transition: border-color var(--transition), background var(--transition);
      cursor: pointer;
    }
    .dw-ef-file-wrap:hover, .dw-ef-file-wrap.has-file {
      border-color: var(--color-primary);
      background: var(--color-bg-light-green);
    }
    .dw-ef-file-ui {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 24px 16px;
      gap: 8px;
      pointer-events: none;
    }
    .dw-ef-file-ui svg { width: 28px; height: 28px; color: var(--color-primary); }
    .dw-ef-file-ui span {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      text-align: center;
    }
    .dw-ef-file-ui strong { color: var(--color-primary); font-weight: var(--fw-semibold); }
    .dw-ef-file-name {
      font-size: var(--fs-xs);
      color: var(--color-primary);
      font-weight: var(--fw-semibold);
    }
    input[type="file"].dw-ef-real-file {
      position: absolute; inset: 0;
      width: 100%; height: 100%;
      opacity: 0; cursor: pointer;
    }

    /* Error */
    .dw-ef-error {
      display: block;
      font-size: var(--fs-xs);
      color: var(--color-error);
      margin-top: 5px;
      min-height: 0;
    }

    /* 2-col row */
    .dw-ef-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
    }
    @media (max-width: 575px) { .dw-ef-row { grid-template-columns: 1fr; } }


    /* Consent */
    .dw-ef-group--check { margin-bottom: 22px; }
    .dw-ef-check-label {
      display: flex; align-items: flex-start;
      gap: 10px; cursor: pointer;
    }
    .dw-ef-check-label input[type="checkbox"] {
      flex-shrink: 0; width: 16px; height: 16px;
      margin-top: 2px;
      accent-color: var(--color-primary);
      cursor: pointer;
    }
    .dw-ef-check-label span {
      font-size: var(--fs-xs);
      color: var(--color-text-para);
      line-height: 1.5;
    }
    .dw-ef-check-label a {
      color: var(--color-primary);
      text-decoration: underline;
    }

    /* Submit button */
    .dw-ef-submit {
      width: 100%;
      padding: 14px;
      background: var(--gradient-btn-2);
      color: var(--color-white);
      border: none;
      border-radius: var(--radius-md);
      font-family: var(--font-primary);
      font-size: var(--fs-md);
      font-weight: var(--fw-bold);
      cursor: pointer;
      transition: opacity var(--transition), transform var(--transition);
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }
    .dw-ef-submit:hover { opacity: .88; transform: translateY(-1px); }
    .dw-ef-submit:disabled { opacity: .6; cursor: not-allowed; transform: none; }
    .dw-ef-submit svg { width: 18px; height: 18px; }

    /* Success state */
    .cr-form-success {
      display: none;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 40px 20px;
      gap: 12px;
    }
    .cr-form-success__icon {
      width: 64px; height: 64px;
      background: var(--color-bg-light-green);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
    }
    .cr-form-success__icon svg { width: 32px; height: 32px; color: var(--color-primary); }
    .cr-form-success h3 {
      font-size: var(--fs-h4);
      font-weight: var(--fw-bold);
      color: var(--color-text-primary);
      margin: 0;
    }
    .cr-form-success p {
      font-size: var(--fs-sm);
      color: var(--color-text-para);
      max-width: 340px;
      margin: 0;
      line-height: 1.6;
    }

    /* ── Responsive utilities ── */
    @media (max-width: 575px) {

      .cr-apply-info {
        position: relative;
        top: unset;
      }
    }

/* ==============================
   AREA CALCULATOR PAGE CSS
============================== */

    /* ── MAIN LAYOUT ── */
    .ac-main { background: var(--color-bg-light); }
    .ac-layout {
      display: grid;
      grid-template-columns: 1fr 420px;
      gap: 36px;
      align-items: start;
    }
    @media (max-width: 1100px) { .ac-layout { grid-template-columns: 1fr 380px; } }
    @media (max-width: 900px)  { .ac-layout { grid-template-columns: 1fr; } }

    /* ════════════════════════════════
       CALCULATOR CARD (right sticky)
    ════════════════════════════════ */
    .ac-calc-wrap { position: sticky; top: calc(var(--nav-height, 95px) + 20px); }
    .ac-calc-card {
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      overflow: hidden;
      box-shadow: var(--shadow-md);
    }
    .ac-calc-head {
      background: var(--gradient-btn);
      padding: 20px 24px 18px;
      display: flex; align-items: center; gap: 12px;
    }
    .ac-calc-head__icon {
      width: 40px; height: 40px;
      background: rgba(255,255,255,.12);
      border-radius: var(--radius-md);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ac-calc-head__icon svg { width: 20px; height: 20px; color: #fff; }
    .ac-calc-head__title {
      font-size: var(--fs-h4); font-weight: var(--fw-bold);
      color: var(--color-white); margin: 0;
    }
    .ac-calc-head__sub {
      font-size: var(--fs-xs); color: rgba(255,255,255,.7); margin: 2px 0 0;
    }
    .ac-calc-body { padding: 24px; }

    /* Field label */
    .ac-field-label {
      display: flex; align-items: center; justify-content: space-between;
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      color: var(--color-text-primary); margin-bottom: 7px; letter-spacing: .3px;
    }
    .ac-field-tag {
      font-size: var(--fs-2xs); font-weight: var(--fw-medium);
      color: var(--color-primary-light);
      background: var(--color-bg-light-green);
      border: 1px solid rgba(0,153,102,.2);
      padding: 2px 8px; border-radius: var(--radius-pill);
    }

    /* Input + Select combo */
    .ac-input-group {
      display: flex;
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-md);
      overflow: hidden;
      transition: border-color var(--transition), box-shadow var(--transition);
      background: var(--color-white);
      margin-bottom: 0;
    }
    .ac-input-group:focus-within {
      border-color: var(--color-primary);
      box-shadow: 0 0 0 3px var(--color-primary-10);
    }
    .ac-input-group input {
      flex: 1; min-width: 0;
      padding: 11px 14px;
      font-family: var(--font-primary);
      font-size: var(--fs-sm); font-weight: var(--fw-medium);
      color: var(--color-text-primary);
      border: none; outline: none; background: transparent;
    }
    .ac-input-group input::placeholder { color: var(--color-text-para); font-weight: var(--fw-regular); }
    .ac-input-group select {
      width: 148px; flex-shrink: 0;
      padding: 11px 30px 11px 12px;
      font-family: var(--font-primary);
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      background: var(--color-bg-light)
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236A7282' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")
        no-repeat right 10px center;
      border: none; border-left: 1.5px solid var(--color-border-light);
      outline: none; appearance: none; -webkit-appearance: none;
      cursor: pointer;
    }
    @media (max-width: 480px) { .ac-input-group select { width: 130px; font-size: 11px; } }

    /* Swap button */
    .ac-swap-row {
      display: flex; align-items: center;
      gap: 12px; margin: 14px 0;
    }
    .ac-swap-line { flex: 1; height: 1px; background: var(--color-border-light); }
    .ac-swap-btn {
      width: 38px; height: 38px; flex-shrink: 0;
      background: var(--color-bg-light-green);
      border: 1.5px solid var(--color-border-light);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      cursor: pointer;
      transition: background var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
    }
    .ac-swap-btn:hover {
      background: var(--color-primary);
      border-color: var(--color-primary);
      transform: rotate(180deg);
    }
    .ac-swap-btn:hover svg { color: #fff; }
    .ac-swap-btn svg { width: 16px; height: 16px; color: var(--color-primary); transition: color var(--transition-fast); }

    /* Result box */
    .ac-result {
      background: var(--color-bg-light);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 18px 20px;
      margin-top: 18px;
      text-align: center;
      transition: background var(--transition-med), border-color var(--transition-med);
    }
    .ac-result.has-result {
      background: var(--color-bg-light-green);
      border-color: rgba(0,153,102,.3);
    }
    .ac-result__label {
      font-size: var(--fs-xs); color: var(--color-text-para);
      margin-bottom: 6px;
    }
    .ac-result__label span { font-weight: var(--fw-semibold); color: var(--color-text-primary); }
    .ac-result__value {
      font-size: var(--fs-2xl); font-weight: var(--fw-bold);
      color: var(--color-primary); line-height: 1.1;
      margin-bottom: 4px;
      transition: transform var(--transition-fast);
    }
    .ac-result.has-result .ac-result__value { transform: scale(1.03); }
    .ac-result__unit {
      font-size: var(--fs-xs); color: var(--color-text-para); font-weight: var(--fw-medium);
    }

    /* Quick conversions */
    .ac-quick { margin-top: 20px; }
    .ac-quick__title {
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      color: var(--color-text-para); text-transform: uppercase;
      letter-spacing: .5px; margin-bottom: 10px;
    }
    .ac-quick-grid {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 8px;
    }
    .ac-quick-pill {
      background: var(--color-bg-light);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      padding: 8px 10px;
      cursor: pointer;
      transition: background var(--transition), border-color var(--transition), transform var(--transition);
      text-align: center;
    }
    .ac-quick-pill:hover {
      background: var(--color-bg-light-green);
      border-color: rgba(0,153,102,.3);
      transform: translateY(-1px);
    }
    .ac-quick-pill__from {
      font-size: var(--fs-p); color: var(--color-text-para); margin-bottom: 1px;
    }
    .ac-quick-pill__arrow {
      font-size: var(--fs-p); color: var(--color-primary-light); margin: 0 4px;
    }

    /* ════════════════════════════════
       CONTENT AREA (left)
    ════════════════════════════════ */
    .ac-content-col { min-width: 0; }


    /* Conversion table */
    .ac-table-wrap {
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      overflow: hidden;
      margin-top: 32px;
    }
    .ac-table-head {
      background: var(--gradient-btn);
      padding: 14px 20px;
      display: flex; align-items: center; gap: 10px;
    }
    .ac-table-head svg { width: 18px; height: 18px; color: rgba(255,255,255,.8); }
    .ac-table-head span {
      font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: #fff;
    }
    .ac-table { width: 100%; border-collapse: collapse; }
    .ac-table th {
      background: var(--color-bg-light);
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      padding: 11px 16px; text-align: left;
      border-bottom: 1px solid var(--color-border-light);
    }
    .ac-table td {
      font-size: var(--fs-xs); color: var(--color-text-para);
      padding: 10px 16px;
      border-bottom: 1px solid var(--color-border-light);
      vertical-align: middle;
    }
    .ac-table tr:last-child td { border-bottom: none; }
    .ac-table tbody tr:hover td { background: var(--color-bg-light-green); color: var(--color-text-primary); }
    .ac-table td:first-child { font-weight: var(--fw-medium); color: var(--color-text-primary); }
    .ac-table td code {
      background: var(--color-bg-light);
      border: 1px solid var(--color-border-light);
      border-radius: 4px;
      padding: 2px 7px;
      font-size: var(--fs-2xs);
      font-family: monospace;
      color: var(--color-primary);
    }

    /* Region cards */
    .ac-regions { margin-top: 40px; }
    .ac-regions-grid {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 16px; margin-top: 20px;
    }
    @media (max-width: 600px) { .ac-regions-grid { grid-template-columns: 1fr; } }

    .ac-region-card {
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      overflow: hidden;
      transition: box-shadow var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
    }
    .ac-region-card:hover {
      box-shadow: var(--shadow-md);
      border-color: var(--color-primary);
      transform: translateY(-3px);
    }
    .ac-region-card__head {
      padding: 16px 18px 12px;
      display: flex; align-items: center; gap: 10px;
      border-bottom: 1px solid var(--color-border-light);
    }
    .ac-region-card__dot {
      width: 10px; height: 10px; border-radius: 50%;
      background: var(--gradient-btn-2); flex-shrink: 0;
    }
    .ac-region-card__name {
      font-size: var(--fs-h5); font-weight: var(--fw-bold);
      color: var(--color-text-primary); margin: 0;
    }
    .ac-region-card__body { padding: 14px 18px; }
    .ac-region-card__units {
      display: flex; flex-wrap: wrap; gap: 6px;
    }
    .ac-unit-tag {
      font-size: var(--fs-2xs); font-weight: var(--fw-medium);
      color: var(--color-primary);
      background: var(--color-bg-light-green);
      border: 1px solid rgba(0,153,102,.2);
      padding: 3px 10px; border-radius: var(--radius-pill);
    }
    .ac-region-card__note {
      font-size: var(--fs-xs); color: var(--color-text-para);
      line-height: 1.65; margin-top: 10px; margin-bottom: 0;
    }
    /* Mobile order swap */
    @media (max-width: 900px) {
      .ac-calc-wrap { position: static; order: -1; }
    }

    .ac-input-group input:disabled, .ac-input-group input[readonly] {
        cursor: not-allowed;
        background-color: #e9ecef;
        opacity: 1;
    }

/* ==============================
   FAQS PAGE CSS
============================== */

    /* ── Category tabs ── */
    .faq-page .faq-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 40px;
      margin-bottom: 12px;
    }
    .faq-page .faq-tab {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 8px 18px;
      border-radius: 999px;
      border: 1.5px solid var(--color-border-light);
      background: var(--color-white);
      font-size: 13px;
      font-weight: 500;
      color: var(--color-text-para);
      cursor: pointer;
      transition: all var(--transition);
    }
    .faq-page .faq-tab:hover {
      border-color: var(--color-primary);
      color: var(--color-primary);
    }
    .faq-page .faq-tab.active {
      background: var(--color-primary);
      border-color: var(--color-primary);
      color: var(--color-white);
    }
    .faq-page .faq-tab i { font-size: 14px; }

    /* ── FAQ accordion ── */
    .faq-page .faq-section { display: none; }
    .faq-page .faq-section.active { display: block; }

    .faq-page .faq-item {
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      background: var(--color-white);
      margin-bottom: 12px;
      overflow: hidden;
      transition: box-shadow var(--transition), border-color var(--transition);
    }
    .faq-page .faq-item:hover { box-shadow: var(--shadow-sm); }
    .faq-page .faq-item.open {
      border-color: var(--color-primary);
      box-shadow: 0 4px 20px rgba(0,91,82,.10);
    }

    .faq-page .faq-question {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 20px 22px;
      cursor: pointer;
      user-select: none;
      background: none;
      border: none;
      width: 100%;
      text-align: left;
    }
    .faq-page .faq-icon {
      flex-shrink: 0;
      width: 36px; height: 36px;
      border-radius: 50%;
      background: var(--color-bg-light-green);
      display: flex; align-items: center; justify-content: center;
      color: var(--color-primary);
      font-size: 16px;
      transition: background var(--transition), color var(--transition);
    }
    .faq-page .faq-item.open .faq-icon {
      background: var(--color-primary);
      color: var(--color-white);
    }
    .faq-page .faq-q-text {
      flex: 1;
      font-size: clamp(14px, 1.2vw, 16px);
      font-weight: 500;
      color: var(--color-text-primary);
      line-height: 1.45;
    }
    .faq-page .faq-chevron {
      flex-shrink: 0;
      width: 28px; height: 28px;
      border-radius: 50%;
      border: 1.5px solid var(--color-border-light);
      display: flex; align-items: center; justify-content: center;
      color: var(--color-text-para);
      font-size: 13px;
      transition: transform var(--transition), background var(--transition), border-color var(--transition), color var(--transition);
    }
    .faq-page .faq-item.open .faq-chevron {
      transform: rotate(180deg);
      background: var(--color-primary-10);
      border-color: var(--color-primary);
      color: var(--color-primary);
    }

    .faq-page .faq-answer {
      max-height: 0;
      overflow: hidden;
      transition: max-height .35s cubic-bezier(.4,0,.2,1), padding .35s ease;
    }
    .faq-page .faq-answer-inner {
      padding: 0 22px 20px 72px;
      font-size: clamp(13px, 1.1vw, 15px);
      color: var(--color-text-para);
      line-height: 1.75;
    }
    .faq-page .faq-answer-inner a {
      color: var(--color-primary);
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    /* ── Count badge ── */
    .faq-page .count-badge {
      display: inline-block;
      font-size: 11px;
      font-weight: 600;
      padding: 2px 8px;
      border-radius: 999px;
      background: var(--color-primary-10);
      color: var(--color-primary);
      margin-left: 6px;
      vertical-align: middle;
    }

    /* ── No results state ── */
    .faq-page #no-results {
      display: none;
      text-align: center;
      padding: 48px 0;
    }
    .faq-page #no-results .nr-icon {
      font-size: 40px;
      color: var(--color-border-light);
      display: block;
      margin-bottom: 12px;
    }
    .faq-page #no-results p {
      color: var(--color-text-para);
      font-size: 15px;
    }

    /* ── Stats row ── */
    .faq-page .faq-stats {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 48px;
      margin-bottom: 48px;
    }
    .faq-page .stat-card {
      flex: 1;
      min-width: 140px;
      background: var(--color-bg-light-green);
      border: 1.5px solid rgba(0,91,82,.12);
      border-radius: var(--radius-lg);
      padding: 22px 20px;
      text-align: center;
    }
    .faq-page .stat-num {
      font-family: var(--font-secondary);
      font-size: clamp(24px, 3vw, 36px);
      font-weight: 700;
      color: var(--color-primary);
      line-height: 1;
      margin-bottom: 4px;
    }
    .faq-page .stat-label {
      font-size: 13px;
      color: var(--color-text-para);
    }

    /* ── Responsive ── */
    @media (max-width: 767px) {
      .faq-page .faq-answer-inner { padding-left: 22px; }
      .faq-page .faq-cta { padding: 32px 24px; }
      .faq-page .faq-question { padding: 16px 16px; gap: 10px; }
    }

/* ==============================
   PRIVACY AND POLICY PAGE CSS
============================== */

    /* ── TOC Sidebar ── */
    .pp-toc {
      position: sticky; top: 100px;
      background: var(--color-bg-light-green);
      border: 1.5px solid rgba(0,91,82,.12);
      border-radius: var(--radius-lg);
      padding: 24px 20px;
    }
    .pp-toc h2 {
      font-size: 11px; font-weight: 600;
      letter-spacing: .12em; text-transform: uppercase;
      color: var(--color-primary); margin-bottom: 14px;
    }
    .pp-toc ul { list-style: none; padding: 0; margin: 0; }
    .pp-toc ul li { margin-bottom: 2px; }
    .pp-toc ul li a {
      display: flex; align-items: flex-start; gap: 8px;
      font-size: 13px; color: var(--color-text-para);
      text-decoration: none; padding: 7px 10px;
      border-radius: var(--radius-sm);
      border-left: 2px solid transparent;
      transition: all var(--transition); line-height: 1.4;
    }
    .pp-toc ul li a:hover,
    .pp-toc ul li a.active {
      color: var(--color-primary);
      background: var(--color-primary-10);
      border-left-color: var(--color-primary);
    }
    .pp-toc ul li a i { font-size: 13px; margin-top: 1px; flex-shrink: 0; }

    /* ── Policy sections ── */
    .pp-section {
      scroll-margin-top: 110px;
      padding: 36px 0;
      border-bottom: 1px solid var(--color-border-light);
    }
    .pp-section:last-of-type { border-bottom: none; }

    .pp-section-header {
      display: flex; align-items: flex-start; gap: 16px;
      margin-bottom: 18px;
    }
    .pp-section-icon {
      flex-shrink: 0;
      width: 44px; height: 44px;
      border-radius: var(--radius-md);
      background: var(--color-bg-light-green);
      border: 1.5px solid rgba(0,91,82,.12);
      display: flex; align-items: center; justify-content: center;
      color: var(--color-primary); font-size: 20px;
    }
    /* .pp-section-header p.dw-section-header__eyebrow mb-0 {
      font-size: 11px; font-weight: 600;
      letter-spacing: .1em; text-transform: uppercase;
      color: var(--color-primary); margin: 0 0 4px;
    } */

    .pp-section p:not(.dw-section-header__eyebrow) {
      font-size: clamp(13px, 1.1vw, 15px);
      color: var(--color-text-para);
      line-height: 1.85; margin-bottom: 14px;
    }
    .pp-section p:last-child { margin-bottom: 0; }
    .pp-section a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; }
    .pp-section strong { color: var(--color-text-primary); font-weight: 600; }

    /* Highlight box */
    .pp-highlight {
      background: var(--color-bg-light-green);
      border-left: 3px solid var(--color-primary);
      border-radius: 0 var(--radius-md) var(--radius-md) 0;
      padding: 16px 20px; margin: 18px 0;
      font-size: 14px; color: var(--color-text-para); line-height: 1.75;
    }
    .pp-highlight strong { color: var(--color-primary); }

    /* Info grid cards */
    .pp-info-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      gap: 12px; margin: 18px 0;
    }
    .pp-info-card {
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-md);
      padding: 16px;
    }
    .pp-info-card i { font-size: 20px; color: var(--color-primary); margin-bottom: 8px; display: block; }
    .pp-info-card p { font-size: 13px; color: var(--color-text-para); margin: 0; line-height: 1.6; }
    .pp-info-card strong { display: block; font-size: 13px; font-weight: 600; color: var(--color-text-primary); margin-bottom: 4px; }

    /* Opt-out notice */
    .pp-opt-out {
      display: flex; gap: 14px; align-items: flex-start;
      background: #FFF8E6;
      border: 1.5px solid #EFB100;
      border-radius: var(--radius-md);
      padding: 16px 18px; margin-top: 16px;
    }
    .pp-opt-out i { font-size: 20px; color: #D39F51; flex-shrink: 0; margin-top: 2px; }
    .pp-opt-out p { font-size: 13px; color: #6A5A20; margin: 0; line-height: 1.7; }
    .pp-opt-out a { color: var(--color-primary); }

    /* ── Mobile ── */
    @media (max-width: 991px) {
      .pp-toc { position: static; margin-bottom: 32px; }
      .pp-update-box { padding: 28px 22px; }
    }
    @media (max-width: 575px) {
      .pp-section-header { flex-direction: column; gap: 10px; }
    }

/* ==============================
   TERMS AND CONDITIONS PAGE CSS
============================== */
    /* ── Acceptance banner ── */
    .tc-accept-banner {
      background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
      border-radius: var(--radius-lg);
      padding: 18px 24px;
      display: flex; align-items: flex-start; gap: 14px;
      margin-bottom: 48px;
    }
    .tc-accept-banner svg { font-size: 22px; color: rgba(255,255,255,.85); flex-shrink: 0; margin-top: 1px; }
    .tc-accept-banner p { margin: 0; font-size: 14px; color: rgba(255,255,255,.9); line-height: 1.7; }
    .tc-accept-banner strong { color: var(--color-white); }

    /* ── Layout ── */
    .tc-layout { padding: 56px 0 72px; }

    /* ── TOC Sidebar ── */
    .tc-toc {
      position: sticky; top: 100px;
      background: var(--color-bg-light-green);
      border: 1.5px solid rgba(0,91,82,.12);
      border-radius: var(--radius-lg);
      padding: 24px 20px;
    }
    .tc-toc h2 {
      font-size: 11px; font-weight: 600;
      letter-spacing: .12em; text-transform: uppercase;
      color: var(--color-primary); margin-bottom: 14px;
    }
    .tc-toc ul { list-style: none; padding: 0; margin: 0; }
    .tc-toc ul li { margin-bottom: 2px; }
    .tc-toc ul li a {
      display: flex; align-items: flex-start; gap: 8px;
      font-size: 13px; color: var(--color-text-para);
      text-decoration: none; padding: 7px 10px;
      border-radius: var(--radius-sm);
      border-left: 2px solid transparent;
      transition: all var(--transition); line-height: 1.4;
    }
    .tc-toc ul li a:hover,
    .tc-toc ul li a.active {
      color: var(--color-primary);
      background: var(--color-primary-10);
      border-left-color: var(--color-primary);
    }
    .tc-toc ul li a .toc-num {
      flex-shrink: 0;
      width: 18px; height: 18px;
      border-radius: 50%;
      background: var(--color-border-light);
      font-size: 10px; font-weight: 600;
      display: flex; align-items: center; justify-content: center;
      color: var(--color-text-para);
      margin-top: 1px;
      transition: background var(--transition), color var(--transition);
    }
    .tc-toc ul li a:hover .toc-num,
    .tc-toc ul li a.active .toc-num {
      background: var(--color-primary);
      color: var(--color-white);
    }

    /* ── Term items ── */
    .tc-item {
      scroll-margin-top: 110px;
      padding: 32px 0;
      border-bottom: 1px solid var(--color-border-light);
      display: flex;
      gap: 24px;
      align-items: flex-start;
    }
    .tc-item:last-of-type { border-bottom: none; padding-bottom: 0; }

    .tc-item-num {
      flex-shrink: 0;
      width: 48px; height: 48px;
      border-radius: var(--radius-md);
      background: var(--color-bg-light-green);
      border: 1.5px solid rgba(0,91,82,.15);
      display: flex; align-items: center; justify-content: center;
      font-family: var(--font-secondary);
      font-size: 18px; font-weight: 700;
      color: var(--color-primary);
      line-height: 1;
    }

    .tc-item-body { flex: 1; min-width: 0; }

    .tc-item-body h2 {
      font-family: var(--font-secondary);
      font-size: clamp(16px, 1.5vw, 20px);
      font-weight: 700;
      color: var(--color-text-primary);
      margin-bottom: 10px; line-height: 1.35;
    }
    .tc-item-body p {
      font-size: clamp(13px, 1.1vw, 15px);
      color: var(--color-text-para);
      line-height: 1.85; margin: 0;
    }
    .tc-item-body a {
      color: var(--color-primary);
      text-decoration: underline;
      text-underline-offset: 2px;
    }
    .tc-item-body strong { color: var(--color-text-primary); font-weight: 600; }

    /* Tag badges on some items */
    .tc-tag {
      display: inline-block;
      font-size: 10px; font-weight: 600;
      letter-spacing: .08em; text-transform: uppercase;
      padding: 3px 9px; border-radius: 999px;
      margin-bottom: 8px;
    }
    .tc-tag-warning {
      background: #FFF8E6;
      color: #B8860B;
      border: 1px solid #EFB100;
    }
    .tc-tag-info {
      background: var(--color-primary-10);
      color: var(--color-primary);
      border: 1px solid var(--color-border-light);
    }

    /* Highlight box */
    .tc-highlight {
      background: var(--color-bg-light-green);
      border-left: 3px solid var(--color-primary);
      border-radius: 0 var(--radius-md) var(--radius-md) 0;
      padding: 14px 18px;
      margin-top: 14px;
      font-size: 13px; color: var(--color-text-para); line-height: 1.75;
    }

    /* ── Mobile ── */
    @media (max-width: 991px) {
      .tc-toc { position: static; margin-bottom: 32px; }
      .tc-cta { padding: 28px 22px; }
    }
    @media (max-width: 575px) {
      .tc-item { flex-direction: column; gap: 12px; }
      .tc-item-num { width: 40px; height: 40px; font-size: 15px; }
    }

/* ==============================
   CUSTOMER CENTRIC PAGE CSS
============================== */

    /* ── INTRO SECTION ── */
    /* Gold quote block */
    .cc-quote {
      border-left: 4px solid var(--color-accent-gold);
      background: linear-gradient(90deg, rgba(239,177,0,.08) 0%, transparent 100%);
      border-radius: 0 var(--radius-md) var(--radius-md) 0;
      padding: 20px 24px; margin: 28px 0;
    }
    .cc-quote p {
      font-family: var(--font-secondary);
      font-size: clamp(15px, 1.4vw, 19px);
      font-style: italic;
      color: var(--color-text-primary);
      margin: 0; line-height: 1.65;
    }
    .cc-quote cite {
      display: block; margin-top: 10px;
      font-size: 12px; font-style: normal; font-weight: 600;
      letter-spacing: .08em; text-transform: uppercase;
      color: var(--color-primary);
    }

    /* Intro visual card */
    .cc-intro-visual {
      background: var(--color-bg-light-green);
      border: 1.5px solid rgba(0,91,82,.12);
      border-radius: var(--radius-xl);
      padding: 40px 36px;
      height: 100%;
      display: flex; flex-direction: column; justify-content: center;
      position: relative; overflow: hidden;
    }
    .cc-intro-visual::before {
      content: '';
      position: absolute; right: -40px; bottom: -40px;
      width: 180px; height: 180px; border-radius: 50%;
      background: var(--color-primary-10);
    }
    .cc-intro-visual .big-icon {
      width: 52px;
      height: 52px;
      color: var(--color-primary);
      margin-bottom: 20px; display: block; line-height: 1;
    }
    .cc-intro-visual h2 {
      font-family: var(--font-secondary);
      font-size: clamp(20px, 2vw, 28px);
      font-weight: 700; color: var(--color-text-primary);
      margin-bottom: 12px; line-height: 1.3;
    }
    .cc-intro-visual p {
      font-size: 14px; color: var(--color-text-para);
      line-height: 1.75; margin: 0;
    }

    /* ── VALUES GRID ── */
    .cc-values { padding: 0 0 72px; }
    .cc-values-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
      gap: 20px; margin-top: 40px;
    }
    .cc-value-card {
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 28px 24px;
      transition: box-shadow var(--transition), border-color var(--transition), transform var(--transition);
      position: relative; overflow: hidden;
    }
    .cc-value-card::before {
      content: '';
      position: absolute; top: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
      transform: scaleX(0); transform-origin: left;
      transition: transform .32s cubic-bezier(.4,0,.2,1);
    }
    .cc-value-card:hover {
      box-shadow: var(--shadow-md);
      border-color: var(--color-primary);
      transform: translateY(-3px);
    }
    .cc-value-card:hover::before { transform: scaleX(1); }

    .cc-value-icon {
      width: 48px; height: 48px;
      border-radius: var(--radius-md);
      background: var(--color-bg-light-green);
      border: 1.5px solid rgba(0,91,82,.14);
      display: flex; align-items: center; justify-content: center;
      color: var(--color-primary); font-size: 22px;
      margin-bottom: 18px;
      transition: background var(--transition), color var(--transition);
    }
    .cc-value-card:hover .cc-value-icon {
      background: var(--color-primary);
      color: var(--color-white);
    }
    .cc-value-card h3 {
      font-family: var(--font-secondary);
      font-size: clamp(16px, 1.4vw, 19px);
      font-weight: 700; color: var(--color-text-primary);
      margin-bottom: 10px;
    }
    .cc-value-card p {
      font-size: clamp(13px, 1.05vw, 15px);
      color: var(--color-text-para); line-height: 1.8; margin: 0;
    }

    /* ── PROMISE SECTION ── */
    .cc-promise {
      background: var(--color-bg-light);
      padding: 72px 0;
      position: relative; overflow: hidden;
    }
    .cc-promise::before {
      content: '';
      position: absolute; right: -100px; top: -100px;
      width: 400px; height: 400px; border-radius: 50%;
      background: var(--color-primary-10);
    }

    .cc-promise-list { margin-top: 40px; }
    .cc-promise-item {
      display: flex; gap: 20px; align-items: flex-start;
      padding: 24px 0;
      border-bottom: 1px solid var(--color-border-light);
    }
    .cc-promise-item:last-child { border-bottom: none; }
    .cc-promise-num {
      flex-shrink: 0;
      width: 40px; height: 40px;
      border-radius: 50%;
      background: var(--color-primary);
      color: var(--color-white);
      font-size: 14px; font-weight: 700;
      display: flex; align-items: center; justify-content: center;
      font-family: var(--font-secondary);
    }
    .cc-promise-body h3 {
      font-size: clamp(15px, 1.3vw, 17px);
      font-weight: 600; color: var(--color-text-primary);
      margin-bottom: 6px;
    }
    .cc-promise-body p {
      font-size: clamp(13px, 1.05vw, 15px);
      color: var(--color-text-para); line-height: 1.8; margin: 0;
    }

    .cc-promise-aside {
      background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-deep) 100%);
      border-radius: var(--radius-xl);
      padding: 40px 36px;
      color: var(--color-white);
      height: 100%;
      display: flex; flex-direction: column; justify-content: center;
      position: relative; overflow: hidden;
    }
    .cc-promise-aside::after {
      content: '';
      position: absolute; right: -50px; bottom: -50px;
      width: 200px; height: 200px; border-radius: 50%;
      background: rgba(255,255,255,.05);
    }
    .cc-promise-aside .aside-label {
      font-size: 11px; font-weight: 600;
      letter-spacing: .12em; text-transform: uppercase;
      color: rgba(255,255,255,.6); margin-bottom: 12px;
    }
    .cc-promise-aside h2 {
      font-family: var(--font-secondary);
      font-size: clamp(22px, 2.2vw, 32px);
      font-weight: 700; line-height: 1.25; margin-bottom: 16px;
    }
    .cc-promise-aside p {
      font-size: 14px; opacity: .85; line-height: 1.8; margin-bottom: 28px;
    }
    .cc-aside-contacts { display: flex; flex-direction: column; gap: 12px; }
    .cc-aside-contact {
      display: flex; align-items: center; gap: 10px;
      background: rgba(255,255,255,.10);
      border: 1px solid rgba(255,255,255,.18);
      border-radius: var(--radius-md);
      padding: 12px 16px;
      text-decoration: none; color: var(--color-white);
      font-size: 14px; font-weight: 500;
      transition: background var(--transition);
    }
    .cc-aside-contact:hover { background: rgba(255,255,255,.20); color: var(--color-white); }
    .cc-aside-contact i { font-size: 18px; opacity: .85; }

    /* ── Responsive ── */
    @media (max-width: 991px) {
      .cc-cta { padding: 36px 28px; }
      .cc-promise-aside { margin-top: 40px; }
    }
    @media (max-width: 767px) {
      .cc-stat-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.12); }
      .cc-stat-item:last-child { border-bottom: none; }
      .cc-intro-visual { margin-top: 32px; padding: 30px 24px; }
    }

  /* ==============================
      Privacy & Integrity PAGE CSS
  ============================== */
    /* ── TOC sidebar ── */
    .privacy-integrity-page .toc-card {
      position: sticky;
      top: 24px;
      background: var(--color-bg-light);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 24px;
    }
    .privacy-integrity-page .toc-card__title {
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--color-primary);
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .privacy-integrity-page .toc-list {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    .privacy-integrity-page .toc-list li a {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 9px 12px;
      border-radius: var(--radius-sm);
      font-size: 13px;
      font-weight: 500;
      color: var(--color-text-para);
      text-decoration: none;
      transition: background var(--transition), color var(--transition);
      line-height: 1.4;
    }
    .privacy-integrity-page .toc-list li a i {
      font-size: 15px;
      color: var(--color-primary);
      flex-shrink: 0;
    }
    .privacy-integrity-page .toc-list li a:hover,
    .privacy-integrity-page .toc-list li a.active {
      background: var(--color-primary-10);
      color: var(--color-primary);
    }

    /* Updated date badge */
    .privacy-integrity-page .updated-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      color: var(--color-text-para);
      background: var(--color-bg-light-green);
      border: 1px solid var(--color-border-light);
      padding: 5px 12px;
      border-radius: 999px;
      margin-top: 16px;
    }
    .privacy-integrity-page .updated-badge i { color: var(--color-primary); font-size: 13px; }

    /* ── Policy content ── */
    .privacy-integrity-page .policy-content { max-width: 100%; }

    .privacy-integrity-page .policy-section {
      scroll-margin-top: 32px;
      padding-bottom: 40px;
      margin-bottom: 40px;
      border-bottom: 1px solid var(--color-border-light);
    }
    .privacy-integrity-page .policy-section:last-child {
      border-bottom: none;
      margin-bottom: 0;
      padding-bottom: 0;
    }

    .privacy-integrity-page .policy-section__header {
      display: flex;
      align-items: flex-start;
      gap: 16px;
      margin-bottom: 20px;
    }
    .privacy-integrity-page .policy-section__icon {
      width: 48px;
      height: 48px;
      border-radius: var(--radius-md);
      background: var(--color-primary-10);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      color: var(--color-primary);
      flex-shrink: 0;
      margin-top: 2px;
    }
    .privacy-integrity-page .policy-section h2 {
      font-size: clamp(18px, 2vw, 24px);
      font-weight: 700;
      color: var(--color-text-primary);
      margin: 0 0 4px;
      line-height: 1.3;
    }
    .privacy-integrity-page .policy-section__num {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--color-primary);
    }
    .privacy-integrity-page .policy-section p {
      font-size: 15px;
      color: var(--color-text-para);
      line-height: 1.85;
    }
    .privacy-integrity-page .policy-section p + p { margin-top: 14px; }

    /* Highlight box */
    .privacy-integrity-page .highlight-box {
      background: var(--color-bg-light-green);
      border-left: 4px solid var(--color-primary);
      border-radius: 0 var(--radius-md) var(--radius-md) 0;
      padding: 18px 22px;
      margin-top: 20px;
    }
    .privacy-integrity-page .highlight-box p {
      font-size: 15px;
      color: var(--color-text-para);
      margin: 0;
      line-height: 1.8;
    }
    .privacy-integrity-page .highlight-box strong { color: var(--color-text-primary); }

    /* Contact box */
    .privacy-integrity-page .contact-box {
      background: var(--color-primary);
      border-radius: var(--radius-lg);
      padding: 28px 32px;
      display: flex;
      align-items: center;
      gap: 20px;
      margin-top: 20px;
    }
    .privacy-integrity-page .contact-box__icon {
      width: 52px; height: 52px;
      border-radius: 50%;
      background: rgba(255,255,255,0.12);
      display: flex; align-items: center; justify-content: center;
      font-size: 24px; color: var(--color-white);
      flex-shrink: 0;
    }
    .privacy-integrity-page .contact-box__text p { color: rgba(255,255,255,0.75); margin: 0; font-size: 14px; }
    .privacy-integrity-page .contact-box__text a {
      color: var(--color-accent-gold);
      font-weight: 600;
      font-size: 16px;
      text-decoration: none;
    }
    .privacy-integrity-page .contact-box__text a:hover { color: var(--color-gold-mid); }

    @media (max-width: 767px) {
      .privacy-integrity-page .contact-box { flex-direction: column; text-align: center; }
      .privacy-integrity-page .toc-card { position: static; margin-bottom: 32px; }
    }

/* ==============================
   REVIEWS PAGE CSS
============================== */
    /* ══════════════════════════════════
       PAGE SCOPE
    ══════════════════════════════════ */

    /* ── STATS STRIP ── */
    .rv-stats-strip {
      position: relative; z-index: 10;
      margin-top: -38px;
    }
    .rv-stats-card {
      background: var(--color-white);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-md);
      border: 1px solid var(--color-border-light);
      display: grid;
      grid-template-columns: repeat(4, 1fr);
    }
    @media (max-width: 767px) { .rv-stats-card { grid-template-columns: repeat(2,1fr); } }
    .rv-stat {
      padding: 22px 18px;
      text-align: center;
      border-right: 1px solid var(--color-border-light);
    }
    .rv-stat:last-child { border-right: none; }
    @media (max-width: 767px) {
      .rv-stat:nth-child(2) { border-right: none; }
      .rv-stat:nth-child(1),.rv-stat:nth-child(2) { border-bottom: 1px solid var(--color-border-light); }
      .rv-stat:nth-child(3) { border-right: 1px solid var(--color-border-light); }
    }
    .rv-stat__num {
      font-size: var(--fs-2xl); font-weight: var(--fw-bold);
      color: var(--color-primary); line-height: 1; margin-bottom: 4px;
    }
    .rv-stat__stars { color: var(--color-accent-gold); font-size: 14px; margin-bottom: 4px; letter-spacing: 1px; }
    .rv-stat__label { font-size: var(--fs-xs); color: var(--color-text-para); font-weight: var(--fw-medium); }

    /* ── FILTER BAR ── */
    .rv-filter-bar {
      display: flex; align-items: center; flex-wrap: wrap;
      gap: 10px; margin-bottom: 36px;
    }
    .rv-filter-bar__label {
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      color: var(--color-text-para); margin-right: 4px;
    }
    .rv-filter-btn {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 7px 16px;
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-pill);
      background: var(--color-white);
      color: var(--color-text-para);
      cursor: pointer;
      transition: all var(--transition-fast);
    }
    .rv-filter-btn:hover {
      border-color: var(--color-primary);
      color: var(--color-primary);
      background: var(--color-bg-light-green);
    }
    .rv-filter-btn.active {
      background: var(--gradient-btn-2);
      border-color: transparent;
      color: var(--color-white);
    }
    .rv-filter-btn .star-icon { font-size: 11px; color: var(--color-accent-gold); }
    .rv-filter-btn.active .star-icon { color: rgba(255,255,255,.85); }

    /* Sort + Search row */
    .rv-toolbar {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 28px; flex-wrap: wrap;
    }
    .rv-search-wrap {
      flex: 1; min-width: 220px; max-width: 360px;
      position: relative;
    }
    .rv-search-wrap svg {
      position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
      width: 16px; height: 16px; color: var(--color-text-para);
      pointer-events: none;
    }
    .rv-search-input {
      width: 100%;
      padding: 10px 14px 10px 36px;
      font-family: var(--font-primary);
      font-size: var(--fs-xs);
      color: var(--color-text-primary);
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-pill);
      outline: none;
      transition: border-color var(--transition), box-shadow var(--transition);
    }
    .rv-search-input:focus {
      border-color: var(--color-primary);
      box-shadow: 0 0 0 3px var(--color-primary-10);
    }
    .rv-sort-select {
      padding: 10px 32px 10px 14px;
      font-family: var(--font-primary);
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      background: var(--color-white)
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236A7282' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")
        no-repeat right 12px center;
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-pill);
      outline: none; appearance: none; cursor: pointer;
      transition: border-color var(--transition);
    }
    .rv-sort-select:focus { border-color: var(--color-primary); }
    .rv-count-badge {
      margin-left: auto;
      font-size: var(--fs-xs); color: var(--color-text-para);
      white-space: nowrap;
    }
    .rv-count-badge strong { color: var(--color-text-primary); }

    /* ── MASONRY GRID ── */
    .rv-grid {
      columns: 3;
      column-gap: 20px;
    }
    @media (max-width: 991px) { .rv-grid { columns: 2; } }
    @media (max-width: 575px) { .rv-grid { columns: 1; } }

    /* ── REVIEW CARD ── */
    .rv-card {
      break-inside: avoid;
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      padding: 22px 20px;
      margin-bottom: 20px;
      display: flex; flex-direction: column; gap: 14px;
      transition: box-shadow var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
      animation: rv-fade-in 0.4s ease both;
    }
    .rv-card:hover {
      box-shadow: 0 12px 40px rgba(0,91,82,.1);
      border-color: var(--color-primary);
      transform: translateY(-2px);
    }

    @keyframes rv-fade-in {
      from { opacity: 0; transform: translateY(12px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    /* Stars */
    .rv-card__stars {
      display: flex; gap: 3px; align-items: center;
    }
    .rv-card__stars svg { width: 14px; height: 14px; }
    .rv-card__stars .filled { color: var(--color-accent-gold); }
    .rv-card__stars .empty  { color: var(--color-border-light); }
    .rv-card__rating-num {
      font-size: var(--fs-xs); font-weight: var(--fw-bold);
      color: var(--color-text-primary); margin-left: 6px;
    }

    /* Quote */
    .rv-card__quote-icon {
      width: 28px; height: 28px;
      background: var(--color-bg-light-green);
      border-radius: var(--radius-md);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .rv-card__quote-icon svg { width: 14px; height: 14px; color: var(--color-primary); }

    /* Text */
    .rv-card__text {
      font-size: var(--fs-xs); color: var(--color-text-para);
      line-height: 1.75; margin: 0;
      /* Expand / collapse */
    }
    .rv-card__text.clamped {
      display: -webkit-box;
      -webkit-line-clamp: 5;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .rv-card__read-more {
      font-size: var(--fs-xs); font-weight: var(--fw-semibold);
      color: var(--color-primary);
      background: none; border: none; padding: 0;
      cursor: pointer; display: inline;
      margin-top: -6px;
    }
    .rv-card__read-more:hover { text-decoration: underline; }

    /* Author row */
    .rv-card__author {
      display: flex; align-items: center;
      gap: 10px;
      padding-top: 12px;
      border-top: 1px solid var(--color-border-light);
    }
    .rv-card__avatar {
      width: 40px; height: 40px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: var(--fs-xs); font-weight: var(--fw-bold);
      color: var(--color-white);
      flex-shrink: 0;
      letter-spacing: .5px;
    }
    .rv-card__info { flex: 1; min-width: 0; }
    .rv-card__name {
      font-size: var(--fs-sm); font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .rv-card__role {
      font-size: var(--fs-xs); color: var(--color-text-para);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .rv-card__g-icon {
      width: 28px; height: 28px;
      background: var(--color-bg-light);
      border: 1px solid var(--color-border-light);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .rv-card__g-icon img { display: block; }

    /* ── SKELETON LOADER ── */
    .rv-skeleton-grid {
      columns: 3; column-gap: 20px;
    }
    @media (max-width: 991px) { .rv-skeleton-grid { columns: 2; } }
    @media (max-width: 575px) { .rv-skeleton-grid { columns: 1; } }
    .rv-skel-card {
      break-inside: avoid;
      background: var(--color-white);
      border: 1.5px solid var(--color-border-light);
      border-radius: var(--radius-xl);
      padding: 22px 20px; margin-bottom: 20px;
      display: flex; flex-direction: column; gap: 12px;
    }
    .rv-skel {
      background: linear-gradient(90deg, #e8f0ef 25%, #d4e5e3 50%, #e8f0ef 75%);
      background-size: 200% 100%;
      animation: rv-shimmer 1.4s infinite;
      border-radius: var(--radius-md);
    }
    @keyframes rv-shimmer {
      0% { background-position: 200% 0; }
      100% { background-position: -200% 0; }
    }
    .rv-skel--line { height: 12px; }
    .rv-skel--short { width: 60%; }
    .rv-skel--para { height: 10px; }
    .rv-skel--circle { width: 40px; height: 40px; border-radius: 50%; }

    /* ── EMPTY / ERROR STATE ── */
    .rv-empty {
      text-align: center; padding: 60px 20px;
      display: none; /* shown by JS */
    }
    .rv-empty__icon {
      width: 64px; height: 64px; border-radius: 50%;
      background: var(--color-bg-light-green);
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 16px;
    }
    .rv-empty__icon svg { width: 28px; height: 28px; color: var(--color-primary); }
    .rv-empty h3 {
      font-size: var(--fs-h4); font-weight: var(--fw-bold);
      color: var(--color-text-primary); margin-bottom: 6px;
    }
    .rv-empty p { font-size: var(--fs-sm); color: var(--color-text-para); }

    /* ── LOAD MORE ── */
    .rv-load-more-wrap { text-align: center; margin-top: 12px; }
    .rv-load-more-btn {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 12px 32px;
      background: var(--color-white);
      border: 1.5px solid var(--color-primary);
      border-radius: var(--radius-pill);
      font-family: var(--font-primary);
      font-size: var(--fs-btn-sm); font-weight: var(--fw-semibold);
      color: var(--color-primary);
      cursor: pointer;
      transition: all var(--transition-fast);
    }
    .rv-load-more-btn:hover {
      background: var(--gradient-btn-2);
      color: #fff; border-color: transparent;
    }
    .rv-load-more-btn:disabled { opacity: .5; cursor: not-allowed; }


    /* ── Responsive tweaks ── */
    @media (max-width: 575px) {
      .rv-toolbar { flex-direction: column; align-items: stretch; }
      .rv-search-wrap { max-width: 100%; }
      .rv-count-badge { margin-left: 0; }
    }



    /* ── Universal CTA ── */
.dw-cta2 {
  margin-top: 40px;
  margin-bottom: 40px;
}

.dw-cta2 .btn-primary {
    border-color: var(--color-primary-light);
    background: var(--color-white);
    color: var(--color-primary);
}

.dw-cta2__inner {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-xl);
  padding: 48px 40px;
  background: linear-gradient(135deg, #005B52 0%, #003C36 100%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  color: #fff;
}

/* subtle glow effect */
.dw-cta2__inner::before {
  content: '';
  position: absolute;
  width: 320px;
  height: 320px;
  background: rgba(255,255,255,0.05);
  border-radius: 50%;
  top: -80px;
  right: -80px;
}

.dw-cta2__inner::after {
  content: '';
  position: absolute;
  width: 220px;
  height: 220px;
  background: rgba(255,255,255,0.04);
  border-radius: 50%;
  bottom: -60px;
  left: -60px;
}

/* Content */
.dw-cta2__content {
  max-width: 540px;
  z-index: 2;
}

.dw-cta2__tag {
  display: inline-block;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .7;
  margin-bottom: 12px;
}

.dw-cta2__title {
  font-size: clamp(24px, 2.5vw, 34px);
  font-weight: 700;
  margin-bottom: 12px;
}

.dw-cta2__desc {
  font-size: 15px;
  opacity: .85;
  margin-bottom: 28px;
}

/* Buttons */
.dw-cta2__actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}


/* Contacts */
.dw-cta2__contacts {
  font-size: 13px;
  opacity: .75;
}

.dw-cta2__contacts a {
  color: #fff;
  text-decoration: none;
}

/* Right Visual */
.dw-cta2__visual {
  flex-shrink: 0;
  z-index: 2;
}
.dw-cta2__visual .icon {
  font-size:72px;
  opacity:.1;
  font-family:var(--font-secondary);
  font-weight:700;
  line-height:1;
  pointer-events:none;
}

/* Responsive */
@media (max-width: 768px) {
  .dw-cta2__inner {
    flex-direction: column;
    text-align: center;
  }

  .dw-cta2__visual {
    display: none;
  }

  .dw-cta2__actions {
    justify-content: center;
  }
}


    /* ── FAQ ── */
    .accordion-item {
      border: 1px solid var(--color-border-light) !important;
      border-radius: var(--radius-md) !important;
      margin-bottom: 12px;
      overflow: hidden;
      background: var(--color-white);
    }
    .accordion-button {
      font-family: var(--font-primary);
      font-size: var(--fs-h5);
      font-weight: var(--fw-semibold);
      color: var(--color-text-primary);
      background: var(--color-white);
      padding: 15px 20px;
      box-shadow: none !important;
    }
    .accordion-button:not(.collapsed) {
      color: var(--color-primary);
      background: var(--color-bg-light-green);
    }
    .accordion-button::after {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23005B52' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
    }
    .accordion-body {
      font-size: var(--fs-sm);

      padding: 24px 20px;
      color: var(--color-neutral-900);
      background: var(--color-bg-light);
      line-height: 1.8;
    }



/* ==============================
   EARN WITHOUT INVESTMENT PAGE CSS
============================== */
    /* ── Section spacing ── */

    .ewi-page .section--gray  { background: var(--color-bg-light); }
    .ewi-page .section--green { background: var(--color-bg-light-green); }
    .ewi-page .section--dark  { background: var(--color-bg-dark); }

    /* ── Section heading ── */
    .ewi-page .dw-section-header__title span { color: var(--color-primary); }
    .ewi-page .dw-section-header__title--white { color: var(--color-white); }
    .ewi-page .dw-section-header__title--white span { color: var(--color-accent-gold); }
    .ewi-page .section-desc { font-size: 16px; color: var(--color-text-para); line-height: 1.8; }
    .ewi-page .section-desc--light { color: rgba(255,255,255,0.72); }

    /* ── Hero intro strip ── */
    .ewi-page .intro-strip {
      background: var(--color-white);
      border-bottom: 1px solid var(--color-border-light);
      padding: 40px 0;
    }
    .ewi-page .intro-strip p {
      font-size: 16px;
      color: var(--color-text-para);
      line-height: 1.9;
      max-width: 860px;
      margin: 0 auto;
      text-align: center;
    }

    /* ── Stat strip ── */
    .ewi-page .stat-strip {
      background: var(--color-primary);
      padding: 28px 0;
    }
    .ewi-page .stat-item { text-align: center; padding: 0 20px; }
    .ewi-page .stat-number {
      font-family: var(--font-secondary);
      font-size: clamp(26px, 3.5vw, 42px);
      font-weight: 700;
      color: var(--color-accent-gold);
      line-height: 1;
    }
    .ewi-page .stat-label { font-size: 13px; color: rgba(255,255,255,0.75); margin-top: 4px; }
    .ewi-page .stat-divider { width: 1px; background: rgba(255,255,255,0.15); height: 50px; align-self: center; }

    /* ── Step cards (8 steps) ── */
    .ewi-page .step-card {
      position: relative;
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-lg);
      padding: 32px 28px 28px;
      height: 100%;
      transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition);
      overflow: hidden;
    }
    .ewi-page .step-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: var(--gradient-btn);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform var(--transition);
    }
    .ewi-page .step-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); border-color: var(--color-primary-10); }
    .ewi-page .step-card:hover::before { transform: scaleX(1); }

    .ewi-page .step-card__num {
      position: absolute;
      top: 20px; right: 20px;
      font-family: var(--font-secondary);
      font-size: 52px;
      font-weight: 700;
      line-height: 1;
      color: var(--color-primary-10);
      pointer-events: none;
      user-select: none;
      transition: color var(--transition);
    }
    .ewi-page .step-card:hover .step-card__num { color: rgba(0,91,82,0.07); }

    .ewi-page .step-card__icon {
      width: 54px; height: 54px;
      border-radius: var(--radius-md);
      background: var(--color-primary-10);
      display: flex; align-items: center; justify-content: center;
      font-size: 24px;
      color: var(--color-primary);
      margin-bottom: 18px;
      transition: background var(--transition), color var(--transition);
      flex-shrink: 0;
    }
    .ewi-page .step-card:hover .step-card__icon { background: var(--color-primary); color: var(--color-white); }

    .ewi-page .step-card h3 {
      font-size: 17px;
      font-weight: 700;
      color: var(--color-text-primary);
      margin-bottom: 10px;
      line-height: 1.4;
    }
    .ewi-page .step-card p {
      font-size: 14px;
      color: var(--color-text-para);
      line-height: 1.75;
      margin: 0;
    }

    /* ── How it works timeline (desktop horizontal) ── */
    .ewi-page .how-it-works {
      background: var(--color-bg-light-green);
    }
    .ewi-page .hiw-track {
      display: flex;
      gap: 0;
      position: relative;
    }
    .ewi-page .hiw-track::before {
      content: '';
      position: absolute;
      top: 36px;
      left: 10%;
      right: 10%;
      height: 2px;
      background: var(--color-border-light);
      z-index: 0;
    }
    .ewi-page .hiw-step {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 0 12px;
      position: relative;
      z-index: 1;
    }
    .ewi-page .hiw-step__dot {
      width: 72px; height: 72px;
      border-radius: 50%;
      background: var(--color-white);
      border: 3px solid var(--color-border-light);
      display: flex; align-items: center; justify-content: center;
      font-size: 28px;
      color: var(--color-primary);
      margin-bottom: 16px;
      transition: border-color var(--transition), background var(--transition), color var(--transition);
      box-shadow: var(--shadow-sm);
    }
    .ewi-page .hiw-step:hover .hiw-step__dot {
      border-color: var(--color-primary);
      background: var(--color-primary);
      color: var(--color-white);
    }
    .ewi-page .hiw-step h4 { font-size: 14px; font-weight: 700; color: var(--color-text-primary); margin-bottom: 6px; }
    .ewi-page .hiw-step p  { font-size: 13px; color: var(--color-text-para); line-height: 1.6; margin: 0; }

    @media (max-width: 767px) {
      .ewi-page .hiw-track { flex-direction: column; gap: 20px; }
      .ewi-page .hiw-track::before { display: none; }
      .ewi-page .hiw-step { flex-direction: row; text-align: left; align-items: flex-start; gap: 16px; }
      .ewi-page .hiw-step__dot { flex-shrink: 0; width: 52px; height: 52px; font-size: 20px; margin-bottom: 0; }
    }

    /* ── Why choose us cards ── */
    .ewi-page .why-card {
      display: flex;
      gap: 16px;
      align-items: flex-start;
      padding: 24px;
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      transition: box-shadow var(--transition), transform var(--transition);
    }
    .ewi-page .why-card:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }
    .ewi-page .why-card__icon {
      width: 46px; height: 46px;
      border-radius: var(--radius-sm);
      background: var(--color-primary-10);
      display: flex; align-items: center; justify-content: center;
      font-size: 22px;
      color: var(--color-primary);
      flex-shrink: 0;
    }
    .ewi-page .why-card h4 { font-size: 15px; font-weight: 700; color: var(--color-text-primary); margin-bottom: 5px; }
    .ewi-page .why-card p  { font-size: 13px; color: var(--color-text-para); line-height: 1.65; margin: 0; }

    /* ── Eligibility chips ── */
    .ewi-page .eligibility-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 16px;
    }
    .ewi-page .eligibility-chip {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 16px 18px;
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-md);
      transition: border-color var(--transition), box-shadow var(--transition);
    }
    .ewi-page .eligibility-chip:hover { border-color: var(--color-primary); box-shadow: var(--shadow-sm); }
    .ewi-page .eligibility-chip i {
      font-size: 22px;
      color: var(--color-primary);
      flex-shrink: 0;
    }
    .ewi-page .eligibility-chip span { font-size: 14px; font-weight: 600; color: var(--color-text-primary); }

    /* ── CTA / Form section ── */
    .ewi-page .cta-section {
      background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-bg-dark) 100%);
      position: relative;
      overflow: hidden;
    }
    .ewi-page .cta-section::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse at 30% 50%, rgba(0,153,102,0.18) 0%, transparent 60%);
      pointer-events: none;
    }

    /* ── Form card ── */
    .ewi-page .form-card {
      background: var(--color-white);
      border-radius: var(--radius-lg);
      overflow: hidden;
      box-shadow: var(--shadow-md);
    }
    .ewi-page .form-card__header {
      background: var(--gradient-btn);
      padding: 22px 28px 18px;
    }
    .ewi-page .form-card__header h2 { font-size: 20px; color: var(--color-white); margin: 0; }
    .ewi-page .form-card__header p  { font-size: 13px; color: rgba(255,255,255,0.72); margin: 4px 0 0; }
    .ewi-page .form-card__body { padding: 24px 28px 28px; }

    /* ── Closing summary box ── */
    .ewi-page .summary-box {
      background: var(--color-bg-light-green);
      border-left: 4px solid var(--color-primary);
      border-radius: 0 var(--radius-md) var(--radius-md) 0;
      padding: 24px 28px;
    }
    .ewi-page .summary-box p { margin: 0; font-size: 15px; color: var(--color-text-para); line-height: 1.85; }

    /* ── Responsive ── */
    @media (max-width: 767px) {
      .ewi-page .form-card__body { padding: 20px 20px 24px; }
      .ewi-page .stat-divider { display: none; }
      .ewi-page .stat-item { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.1); }
      .ewi-page .stat-item:last-child { border-bottom: none; }
    }

div#dw-ewi-success {
    flex-direction: column;
}
/* ==============================
   map PAGE CSS
============================== */

    /* Full-bleed image viewer */
    .dw-map .md-viewer {
      width: 100%;
      background: #f0f4f3;
      border-top: 1px solid var(--color-border-light);
      border-bottom: 1px solid var(--color-border-light);
    }

    .dw-map .md-viewer__inner {
      max-width: 1320px;
      margin: 0 auto;
      padding: 32px 40px 40px;
    }

    /* Top action bar (above image) */
    .dw-map .md-action-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 12px;
      margin-bottom: 20px;
    }

    .dw-map .md-meta {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .dw-map .md-btn-group {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }


    /* ── Image frame ── */
    .dw-map .md-img-frame {
       background: #fff;
       border: 1px solid var(--color-border-light);
      position: relative;
      width: 100%;
      border-radius: var(--radius-xl);
      overflow: hidden;
      box-shadow: 0 12px 48px rgba(0,0,0,.09);
    }

    /* Loader overlay inside frame */
    .dw-map .md-img-loader {
      position: absolute;
      inset: 0;
      background: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 5;
      transition: opacity .3s ease;
    }
    .dw-map .md-img-loader.hidden {
      opacity: 0;
      pointer-events: none;
    }


    /* The map image itself */
    .dw-map .md-map-img {
      display: block;
      width: 100%;
      height: auto;
      max-height: 80vh;
      object-fit: contain;
      padding: 16px;
    }

    /* ── Zoom controls overlay ── */
    .dw-map .md-zoom-controls {
      position: absolute;
      bottom: 16px;
      right: 16px;
      display: flex;
      flex-direction: column;
      gap: 6px;
      z-index: 10;
    }
    .dw-map .md-zoom-btn {
      width: 36px;
      height: 36px;
      background: rgba(255,255,255,.92);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-sm);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      color: var(--color-primary);
      font-size: 18px;
      font-weight: 700;
      transition: all var(--transition);
      box-shadow: 0 2px 8px rgba(0,0,0,.08);
      line-height: 1;
    }
    .dw-map .md-zoom-btn:hover {
      background: var(--color-primary);
      color: #fff;
      border-color: var(--color-primary);
    }

    /* Panzoom cursor */
    .dw-map .md-img-frame.pz-active { cursor: grab; }
    .dw-map .md-img-frame.pz-dragging { cursor: grabbing; }

    /* ── Description / info card below image ── */
    .dw-map .md-info-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 24px;
      align-items: start;
      margin-top: 28px;
    }
    /* ── Responsive ── */
    @media (max-width: 768px) {
      .dw-map .md-viewer__inner {
        padding: 20px 16px 32px;
      }
      .dw-map .md-info-row {
        grid-template-columns: 1fr;
      }
      .dw-map .md-map-img {
        max-height: 60vh;
        padding: 10px;
      }
    }



/* ==============================
   404 PAGE CSS
============================== */

    /* ── Page layout ── */
    .err-page {
      min-height: 100svh;
      display: grid;
      grid-template-rows: auto 1fr auto;
    }

    /* ── Main hero area ── */
    .err-main {
      display: flex;
      flex-direction:column;
      align-items: center;
      justify-content: center;
      padding: 60px 24px;
      position: relative;
      overflow: hidden;
    }

    /* Decorative background */
    .err-main::before {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 70% 55% at 15% 80%, rgba(0,91,82,0.06) 0%, transparent 60%),
        radial-gradient(ellipse 50% 50% at 90% 10%, rgba(239,177,0,0.05) 0%, transparent 55%);
      pointer-events: none;
    }

    /* The giant 404 watermark */
    .err-watermark {
      position: absolute;
      font-family: var(--font-secondary);
      font-size: clamp(160px, 28vw, 340px);
      font-weight: 700;
      font-style: italic;
      color: transparent;
      -webkit-text-stroke: 2px rgba(0,91,82,0.06);
      user-select: none;
      pointer-events: none;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      white-space: nowrap;
      letter-spacing: -8px;
      animation: floatWm 8s ease-in-out infinite;
    }
    @keyframes floatWm {
      0%,100% { transform: translate(-50%,-50%) translateY(0); }
      50%      { transform: translate(-50%,-50%) translateY(-14px); }
    }

    /* Content card */
    .err-card {
      position: relative;
      z-index: 2;
      text-align: center;
      max-width: 580px;
      width: 100%;
      animation: fadeUp 0.7s cubic-bezier(0.4,0,0.2,1) both;
    }
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(28px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    @keyframes pulse {
      0%,100% { opacity: 1; transform: scale(1); }
      50%      { opacity: 0.45; transform: scale(0.7); }
    }

    /* 404 headline */
    .err-code {
      font-family: var(--font-secondary);
      font-size: clamp(72px, 14vw, 130px);
      font-weight: 700;
      font-style: italic;
      line-height: 0.9;
      margin-bottom: 20px;
      background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 60%, var(--color-primary-dark) 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      animation: fadeUp 0.7s 0.1s cubic-bezier(0.4,0,0.2,1) both;
    }


    .err-desc {
      font-size: clamp(13px, 1.2vw, 15.5px);
      color: var(--color-text-para);
      line-height: 1.7;
      margin-bottom: 38px;
      animation: fadeUp 0.7s 0.28s both;
    }

    /* Quick links */
    .err-links {
      animation: fadeUp 0.7s 0.42s both;
    }
    .err-links__label {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 1.2px;
      text-transform: uppercase;
      color: var(--color-text-para);
      margin-bottom: 16px;
    }
    .err-links__grid {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
    }
    .err-links__chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: var(--color-white);
      border: 1px solid var(--color-border-light);
      border-radius: var(--radius-pill);
      padding: 8px 16px;
      font-size: 13px;
      font-weight: 500;
      color: var(--color-text-primary);
      text-decoration: none;
      box-shadow: var(--shadow-md);
      transition: border-color var(--transition), color var(--transition), transform var(--transition), box-shadow var(--transition);
    }
    .err-links__chip:hover {
      border-color: var(--color-primary);
      color: var(--color-primary);
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(0,91,82,0.12);
    }
    .err-links__chip svg { opacity: 0.55; }


@media (max-width: 680px) {
  .dw-search-list-search-bar__keyword {
      min-width: 200px;
  }
}