/* =========================================================
   DEALER2DEALER - CLEAN PRODUCTION CSS
   Safe cleanup of current app.css
   - Existing rule order preserved
   - Redundant overridden declarations removed
   - Empty duplicate rules removed
   - Formatting/comments compacted for maintenance
   ========================================================= */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; background: #fbfaf7; color: #1d2a3a; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
.container { width: min(1120px,calc(100% - 32px)); margin: auto; }
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid #e3e6e8;
  backdrop-filter: blur(12px);
}
.nav-wrap { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { font-weight: 800; letter-spacing: -.03em; font-size: 1.25rem; }
.brand span { color: #b47a2a; }
.nav-links,.dealer-nav { display: flex; align-items: center; gap: 8px; }
.nav-links a,.dealer-nav a { padding: 9px 11px; border-radius: 8px; color: #56606b; font-size: .92rem; }
.nav-links a:hover,.dealer-nav a:hover { background: #f1f3f5; color: #182536; }
.nav-toggle { display: none; border: 1px solid #d9dde2; background: #fff; border-radius: 8px; padding: 8px 11px; }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 18px;
  border: 0;
  border-radius: 8px;
  font-weight: 700;
  cursor: pointer;
}
.btn-sm { min-height: 38px; padding: 8px 14px; }
.btn-outline { border: 1px solid #cfd5dc; }
.btn-gold { background: #ad7528; }
.hero { border-bottom: 1px solid #e1e4e7; background: linear-gradient(135deg,#f8f4ec,#fff); }
.hero-inner { padding: 76px 0 104px; position: relative; min-height: 360px; }
.hero-slide { display: none; max-width: 760px; }
.hero-slide.active { display: block; }
.eyebrow { text-transform: uppercase; letter-spacing: .16em; font-size: .76rem; font-weight: 800; color: #a96f22; }
.hero h1 { font-size: clamp(2.4rem,5vw,4.4rem); line-height: 1.02; margin: .5rem 0 1rem; letter-spacing: -.045em; color: #1c2b3e; }
.hero p { font-size: 1.08rem; color: #5a6470; max-width: 680px; }
.hero-dots { position: absolute; bottom: 48px; left: 0; display: flex; gap: 8px; }
.hero-dot { width: 9px; height: 9px; border: 0; border-radius: 50%; background: #c9cdd2; }
.search-band { background: #eff1f2; border-bottom: 1px solid #dee2e6; }
.search-card {
  position: relative;
  margin-top: -46px;
  background: #fff;
  border: 1px solid #e0e3e7;
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 10px 35px rgba(28,43,62,.08);
}
.grid { display: grid; gap: 16px; }
.grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.field label { display: block; font-size: .82rem; font-weight: 700; margin-bottom: 6px; }
.input,.select,.textarea {
  width: 100%;
  min-height: 46px;
  border: 1px solid #ccd2d9;
  border-radius: 8px;
  background: #fff;
  padding: 10px 12px;
  color: #1d2a3a;
  font: inherit;
}
.textarea { min-height: 110px; resize: vertical; }
.section { padding: 64px 0; }
.panel { background: #fff; border: 1px solid #e0e3e7; border-radius: 12px; padding: 22px; box-shadow: 0 6px 22px rgba(28,43,62,.05); }
.muted { color: #65707c; }
.cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.step-num {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
}
.alert { margin: 18px auto 0; padding: 12px 14px; border-radius: 8px; }
.alert-success { background: #eaf7ef; color: #1f6f3d; }
.alert-error { background: #fdeeee; color: #9a2e2e; }
.alert-warning { background: #fff4d9; color: #7b5a00; }
.form-errors { background: #fff1f0; border: 1px solid #f0c2bf; color: #8f2a24; border-radius: 8px; padding: 12px 16px; }
.error-text { color: #a12a25; font-size: .82rem; margin-top: 4px; }
.site-footer { border-top: 1px solid #e1e4e7; background: #f0f2f3; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 32px; padding: 42px 0; }
.footer-grid>div { display: flex; flex-direction: column; gap: 8px; }
.footer-bottom { padding: 16px 0; border-top: 1px solid #d9dde2; font-size: .84rem; color: #6a747f; }
.auth-shell { max-width: 560px; margin: 56px auto; }
.auth-shell h1 { margin-bottom: 8px; }
.status-pill {
  display: inline-flex;
  padding: 4px 9px;
  border-radius: 999px;
  background: #eef1f4;
  font-size: .75rem;
  font-weight: 800;
  text-transform: capitalize;
}
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; background: #fff; }
.table th,.table td { padding: 12px 14px; border-bottom: 1px solid #e6e8eb; text-align: left; white-space: nowrap; }
.table th { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: #6d7680; }
.staff-body { background: #f4f5f6; }
.staff-layout { min-height: 100vh; display: grid; grid-template-columns: 260px 1fr; }
.sidebar { color: #e8edf3; padding: 24px 16px; display: flex; flex-direction: column; }
.brand-light { color: #fff; margin-bottom: 28px; }
.sidebar nav { display: flex; flex-direction: column; gap: 6px; }
.sidebar nav a,.sidebar-logout { padding: 11px 12px; border-radius: 8px; color: #dce2e9; }
.sidebar-logout { margin-top: auto; }
.staff-main { min-width: 0; }
.staff-top {
  height: 68px;
  background: #fff;
  border-bottom: 1px solid #e2e5e9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
}
.staff-content { padding: 24px; }
.stat-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.stat { background: #fff; border: 1px solid #e0e3e7; border-radius: 12px; padding: 20px; }
.stat strong { font-size: 2rem; display: block; }
.dealer-header { background: #fff; border-bottom: 1px solid #e0e3e7; }
.dealer-strip { font-size: .82rem; }
.dealer-main { padding-top: 28px; padding-bottom: 88px; }
.mobile-bottom { display: none; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.actions form { margin: 0; }
.stack { display: flex; flex-direction: column; gap: 16px; }
.badge-pending { background: #fff1cf; color: #785400; }
.badge-approved { background: #e9f7ef; color: #236b3b; }
.badge-rejected,.badge-suspended { background: #fdeceb; color: #8d302b; }

@media (max-width:820px) {
  .nav-toggle { display: block; }
  .nav-links {
    display: none;
    position: absolute;
    left: 16px;
    right: 16px;
    top: 70px;
    flex-direction: column;
    align-items: stretch;
    padding: 12px;
    background: #fff;
    border: 1px solid #dde1e5;
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(0,0,0,.08);
  }
  .nav-links.open { display: flex; }
  .grid-3,.grid-2,.cards,.footer-grid,.stat-grid { grid-template-columns: 1fr; }
  .hero-inner { padding: 54px 0 92px; }
  .search-card { margin-top: -34px; }
  .staff-layout { display: block; }
  .sidebar { min-height: auto; }
  .sidebar nav { flex-direction: row; overflow: auto; }
  .sidebar-logout { margin-top: 10px; }
  .dealer-nav { display: none; }
  .mobile-bottom {
    position: fixed;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    border-top: 1px solid #dde1e5;
    z-index: 60;
  }
  .mobile-bottom a { text-align: center; padding: 12px 4px; font-size: .78rem; }
}
.inline-form { display: inline; }
.link-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  padding: 9px 11px;
}
.sidebar-logout .link-button { color: #dce2e9; padding: 0; }
.sidebar-logout { border: 0; background: transparent; }
.dealer-nav form { margin: 0; }
.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.page-head h1 { margin: .2rem 0; }
.form-section { padding: 20px 0; border-bottom: 1px solid #e7e9ec; }
.form-section:first-of-type { padding-top: 6px; }
.form-section h2 { font-size: 1.05rem; margin: 0 0 14px; color: #26384e; }
.form-actions { display: flex; gap: 10px; justify-content: flex-end; padding-top: 20px; }
.checkbox-field { display: flex; align-items: end; }
.property-list { display: grid; gap: 14px; margin-top: 16px; }
.property-card { background: #fff; border: 1px solid #e0e3e7; border-radius: 12px; padding: 20px; box-shadow: 0 5px 18px rgba(28,43,62,.04); }
.property-card-top,.property-card-bottom,.result-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.property-code { color: #9b6520; letter-spacing: .02em; }
.property-card h3 { margin: 12px 0 2px; }
.property-facts {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 10px;
  padding: 12px 0;
  margin: 12px 0;
  border-top: 1px solid #edf0f2;
  border-bottom: 1px solid #edf0f2;
}
.property-card-bottom small { color: #6a747f; }
.pagination { display: flex; justify-content: center; gap: 10px; margin-top: 20px; }
.details { display: grid; grid-template-columns: 150px 1fr; gap: 10px 16px; margin: 0; }
.details dt { font-weight: 700; color: #68727d; }
.details dd { margin: 0; }
.privacy-notice { margin-top: 20px; padding: 14px; border: 1px solid #e4d5bc; border-radius: 9px; background: #fcf8ef; }
.privacy-notice p { margin: .35rem 0 0; color: #6c6457; }
.property-actions {
  position: sticky;
  bottom: 10px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 22px 0;
  z-index: 30;
}
.property-actions form { margin: 0; }
.whatsapp-btn { background: #187a45; }
.image-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(150px,1fr)); gap: 12px; }
.image-grid img,.image-tile img { width: 100%; height: 150px; object-fit: cover; border-radius: 9px; border: 1px solid #dde2e7; }
.image-tile { display: flex; flex-direction: column; gap: 8px; }
.timeline { display: flex; flex-direction: column; }
.timeline>div { position: relative; padding: 0 0 16px 20px; border-left: 2px solid #e3e7eb; }
.timeline>div:before {
  content: "";
  position: absolute;
  left: -5px;
  top: 4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #b47a2a;
}
.timeline span { display: block; font-size: .78rem; color: #707a85; }
.timeline p { margin: .3rem 0 0; }
.notification { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.notification.unread { border-left: 4px solid #b47a2a; }
.mobile-cards { display: none; }
.list-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid #e9ecef;
}
.list-row small { display: block; color: #6a747f; }
.check-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.lookup-list { margin-top: 16px; max-height: 520px; overflow: auto; }
.prose { max-width: 850px; }
.prose h2 { margin-top: 2rem; }
.hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid #d8dce1;
  background: rgba(255,255,255,.82);
  font-size: 1.8rem;
  line-height: 1;
  color: #213248;
  cursor: pointer;
}
.hero-prev { left: -58px; }
.hero-next { right: -58px; }
.staff-content>.alert { margin: 0 0 16px; }
.staff-content .page-head { margin-top: 0; }
.sidebar { position: sticky; top: 0; height: 100vh; overflow: auto; }
.sidebar nav a { font-size: .9rem; }
.empty-state { text-align: center; padding: 48px 20px; }

@media (max-width:1240px) {
  .hero-prev { left: 8px; }
  .hero-next { right: 8px; }
  .hero-inner { padding-left: 54px; padding-right: 54px; }
}

@media (max-width:920px) {
  .staff-layout { display: block; }
  .sidebar { position: relative; height: auto; }
  .sidebar nav { display: grid; grid-template-columns: repeat(3,minmax(140px,1fr)); overflow: auto; }
  .staff-top { position: sticky; top: 0; z-index: 20; }
  .staff-content { padding: 16px; }
  .desktop-table { display: none; }
  .mobile-cards { display: grid; gap: 12px; }
  .page-head { flex-wrap: wrap; }
  .details { grid-template-columns: 120px 1fr; }
}

@media (max-width:620px) {
  .container { width: min(100% - 24px,1120px); }
  .hero-inner { padding-left: 0; padding-right: 0; }
  .hero-arrow { top: auto; bottom: 35px; }
  .hero-prev { left: auto; right: 54px; }
  .hero-next { right: 6px; }
  .hero-dots { left: 0; bottom: 50px; }
  .property-facts { grid-template-columns: 1fr 1fr; }
  .property-card-bottom { align-items: flex-end; }
  .form-actions { position: sticky; bottom: 58px; background: #fff; padding: 12px 0; z-index: 25; }
  .property-actions {
    bottom: 64px;
    background: #fff;
    padding: 8px;
    border: 1px solid #dde2e7;
    border-radius: 10px;
    box-shadow: 0 8px 25px rgba(0,0,0,.09);
  }
  .property-actions>* { flex: 1; }
  .property-actions .btn { width: 100%; }
  .details { grid-template-columns: 1fr; }
  .details dt { margin-top: 8px; }
  .details dd { padding-bottom: 7px; border-bottom: 1px solid #edf0f2; }
  .check-grid { grid-template-columns: 1fr; }
  .notification { flex-direction: column; }
  .staff-top { padding: 0 14px; }
  .staff-content { padding: 12px; }
  .sidebar nav { grid-template-columns: repeat(2,minmax(135px,1fr)); }
  .table th,.table td { white-space: normal; }
  .image-grid { grid-template-columns: repeat(2,1fr); }
}
.password-wrap { display: flex; }
.password-wrap .input { border-radius: 8px 0 0 8px; }
.password-toggle {
  border: 1px solid #ccd2d9;
  border-left: 0;
  background: #f7f8f9;
  border-radius: 0 8px 8px 0;
  padding: 0 13px;
  cursor: pointer;
}

/* ===== ===== Dealer2Dealer Homepage Refresh — paste at END of existing assets/css/app.css ===== ===== */
.hp { color: var(--hp-ink); overflow: hidden; background: #fff; }
.hp * { box-sizing: border-box; }
.hp-container { width: min(1200px,calc(100% - 48px)); margin-inline: auto; }
.hp h1,.hp h2,.hp h3 { letter-spacing: -.035em; }
.hp h2 { font-size: clamp(2rem,3.6vw,3.2rem); line-height: 1.16; font-weight: 740; margin: 12px 0 18px; }
.hp a,.hp button { text-decoration: none; }
.hp button { cursor: pointer; }
.hp-kicker { display: inline-block; font-size: .73rem; letter-spacing: .18em; font-weight: 800; }
.hp-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  border: 0;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}
.hp-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-weight: 750;
  border: 1px solid transparent;
  border-radius: 8px;
  min-height: 50px;
  padding: 13px 23px;
  line-height: 1.2;
  font-size: .92rem;
  transition: background .2s,color .2s,transform .2s;
  white-space: normal;
}
.hp-button:focus-visible,.hp button:focus-visible,.hp a:focus-visible { outline: 3px solid #e5b971; outline-offset: 3px; }
.hp-button:hover { transform: translateY(-2px); }
.hp-hero { position: relative; }
.hp-slideshow { position: relative; min-height: 625px; overflow: hidden; }
.hp-hero-slide { visibility: hidden; opacity: 0; transition: opacity .85s ease,visibility .85s; isolation: isolate; }
.hp-hero-slide.is-active { visibility: visible; opacity: 1; z-index: 1; }
.hp-hero-image,.hp-hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hp-hero-image { z-index: -2; }
.hp-slide-inner { justify-content: space-between; gap: 30px; padding: 22px 0 115px; }
.hp-hero-copy { color: white; }
.hp-topline {
  font-size: .73rem;
  letter-spacing: .15em;
  font-weight: 700;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 9px;
}
.hp-topline-dot { height: 8px; width: 8px; border-radius: 50%; display: block; }
.hp-hero h1 {
  font-size: clamp(2.7rem,5.5vw,5.6rem);
  line-height: 1.04;
  font-weight: 750;
  letter-spacing: -.052em;
  color: #fff;
  margin: 20px 0 22px;
}
.hp-hero h1 em,.hp-statement h2 em,.hp-how-aside h2 em { display: block; font-style: normal; color: #e6bd85; }
.hp-hero p { max-width: 600px; line-height: 1.75; font-size: 1.08rem; margin: 0 0 30px; }
.hp-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hp-hero-seal {
  width: 178px;
  height: 178px;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  gap: 5px;
  transform: rotate(8deg);
  backdrop-filter: blur(6px);
}
.hp-hero-seal strong { font-size: 3.2rem; line-height: 1; font-weight: 500; }
.hp-hero-seal span { font-size: .64rem; line-height: 1.5; letter-spacing: .21em; text-align: center; font-weight: 700; }
.hp-hero-controls { display: flex; justify-content: space-between; align-items: center; pointer-events: none; }
.hp-slide-dots,.hp-slide-arrows { display: flex; gap: 8px; pointer-events: auto; }
.hp-slide-dot {
  padding: 8px 11px;
  color: rgba(255,255,255,.64);
  border: 0;
  border-bottom: 2px solid rgba(255,255,255,.28);
  background: transparent;
  min-width: 43px;
}
.hp-slide-dot.is-active { color: #fff; }
.hp-slide-arrows button {
  width: 43px;
  height: 43px;
  border: 1px solid rgba(255,255,255,.42);
  background: rgba(255,255,255,.13);
  color: #fff;
  border-radius: 50%;
  font-size: 1.15rem;
}
.hp-slide-arrows button:hover { background: rgba(255,255,255,.27); }
.hp-search-wrap { padding: 0 0 35px; }
.hp-search-card {
  position: relative;
  z-index: 8;
  margin-top: -42px;
  border: 1px solid rgba(0,0,0,.04);
  background: #fff;
  border-radius: 16px;
  padding: 31px 34px 24px;
}
.hp-search-title { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.hp-search-title h2 { font-size: 1.55rem; margin: 6px 0 0; }
.hp-private-pill {
  display: inline-flex;
  align-items: center;
  font-size: .78rem;
  color: #687682;
  border: 1px solid #e6eaeb;
  padding: 7px 12px;
  border-radius: 99px;
  white-space: nowrap;
}
.hp-transaction-set { display: flex; gap: 6px; margin: 0 0 17px; padding: 0; border: 0; }
.hp-transaction-set label { position: relative; cursor: pointer; }
.hp-transaction-set input { position: absolute; opacity: 0; pointer-events: none; }
.hp-transaction-set span {
  min-height: 39px;
  min-width: 78px;
  display: grid;
  place-items: center;
  border: 1px solid #e6e9eb;
  border-radius: 6px;
  color: #58636e;
  font-size: .86rem;
  font-weight: 700;
}
.hp-transaction-set input:checked+span { color: #fff; background: #20374b; border-color: #20374b; }
.hp-transaction-set input:focus-visible+span { outline: 3px solid #d9b88d; outline-offset: 2px; }
.hp-search-fields { display: grid; grid-template-columns: 1.05fr 1.2fr 1.15fr 1fr auto; gap: 12px; align-items: end; }
.hp-control { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.hp-control span { font-size: .76rem; font-weight: 750; color: #4b5762; }
.hp-control select,.hp-control input,.hp-login-form input {
  width: 100%;
  height: 50px;
  border: 1px solid #dae0e3;
  border-radius: 7px;
  color: #24384a;
  background: #fafbfb;
  padding: 0 12px;
  font-size: .86rem;
  outline: none;
}
.hp-control select:focus,.hp-control input:focus,.hp-login-form input:focus { border-color: #ba8f59; background: white; box-shadow: 0 0 0 3px #d7b58332; }
.hp-control select:disabled { background: #f2f4f4; color: #9babb2; }
.hp-button-search { height: 50px; padding: 10px 18px; font-size: .84rem; white-space: nowrap; }
.hp-search-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 18px;
  font-size: .75rem;
  color: #78828c;
}
.hp-search-foot a { font-weight: 750; }
.hp-section { padding: 95px 0; }
.hp-section-head { display: flex; align-items: end; justify-content: space-between; gap: 55px; margin-bottom: 36px; }
.hp-section-head h2 span,.hp-bottom h2 span { color: #a58457; }
.hp-section-head>div { max-width: 680px; }
.hp-section-head>p { max-width: 360px; color: #6a7780; line-height: 1.8; margin: 0; }
.hp-benefits { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 19px; }
.hp-benefit { border: 1px solid #e6e9e9; border-radius: 14px; padding: 30px 29px 22px; background: #fff; }
.hp-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 13px;
  font-size: 2rem;
}
.hp-benefit h3 { font-size: 1.2rem; margin: 24px 0 11px; font-weight: 750; }
.hp-benefit p { color: #71808b; line-height: 1.7; min-height: 85px; font-size: .91rem; }
.hp-card-line { border-top: 1px solid #edf0ef; margin: 19px 0 17px; }
.hp-benefit>span:last-child { font-size: .68rem; font-weight: 800; letter-spacing: .13em; color: #ad915f; }
.hp-section-head-compact { margin-bottom: 26px; }
.hp-city-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.hp-city {
  border: 0;
  padding: 0;
  position: relative;
  isolation: isolate;
  aspect-ratio: 1.04/1;
  border-radius: 13px;
  overflow: hidden;
  text-align: left;
  color: #fff;
}
.hp-city>img,.hp-city-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.hp-city>img { object-fit: cover; z-index: -2; transition: transform .5s; }
.hp-city:hover>img { transform: scale(1.065); }
.hp-city-overlay { z-index: -1; background: linear-gradient(0deg,rgba(6,24,38,.90),rgba(7,25,43,.04) 72%); }
.hp-city-info {
  position: absolute;
  left: 27px;
  bottom: 25px;
  right: 35px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hp-city-info small { text-transform: uppercase; font-size: .7rem; letter-spacing: .12em; }
.hp-city-info strong { font-size: 1.8rem; letter-spacing: -.03em; }
.hp-city-info>span { font-size: .76rem; color: #e2e8ed; }
.hp-city-circle {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid #ffffff77;
  border-radius: 50%;
  font-size: 1.2rem;
}
.hp-photo-note { font-size: .75rem; color: #909aa1; text-align: right; margin: 13px 0 0; }
.hp-how-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; }
.hp-how-aside h2 { font-size: clamp(2rem,3.2vw,3.25rem); }
.hp-how-aside p { line-height: 1.8; color: #687782; max-width: 390px; }
.hp-inline-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 750;
  font-size: .9rem;
  margin-top: 17px;
}
.hp-process { border-top: 1px solid #dfe5e7; }
.hp-process-row { display: grid; grid-template-columns: 70px 1fr; gap: 16px; border-bottom: 1px solid #dfe5e7; padding: 22px 0 23px; }
.hp-process-row>span { color: #bd9e72; font-size: 1.3rem; font-weight: 700; }
.hp-process-row h3 { margin: 0 0 9px; font-size: 1.14rem; }
.hp-process-row p { margin: 0; color: #76828b; font-size: .9rem; line-height: 1.75; }
.hp-statement { color: #fff; padding: 86px 0; }
.hp-statement-layout { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.hp-statement h2 { font-size: clamp(2.35rem,4.3vw,4rem); line-height: 1.1; margin: 18px 0 22px; color: #fff; }
.hp-statement p { max-width: 630px; line-height: 1.75; }
.hp-statement-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
.hp-button-light { border-color: #cad0d5; color: #fff !important; background: transparent; }
.hp-button-light:hover { background: #ffffff18; }
.hp-privacy-symbol {
  width: 290px;
  height: 290px;
  display: flex;
  flex: 0 0 290px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px solid #e7d5bb55;
  border-radius: 50%;
  box-shadow: 0 0 0 17px #ffffff08,0 0 0 38px #ffffff04;
}
.hp-privacy-symbol>span { font-size: .65rem; letter-spacing: .25em; text-align: center; color: #e5c9a0; }
.hp-privacy-symbol strong { font-size: 4.2rem; letter-spacing: -.1em; line-height: 1.3; }
.hp-privacy-symbol small { font-size: .55rem; letter-spacing: .05em; color: #d4b990; }
.hp-bottom { padding: 83px 0 68px; }
.hp-bottom-panel {
  border: 1px solid #e8e1d8;
  border-radius: 17px;
  padding: 46px 49px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 45px;
}
.hp-bottom h2 { font-size: clamp(1.9rem,3.3vw,3rem); margin: 10px 0 15px; }
.hp-bottom p { color: #68727b; max-width: 650px; line-height: 1.8; }
.hp-bottom-actions { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; gap: 8px; }
.hp-bottom-actions .hp-inline-link { margin-top: 4px; }
.hp-faq { padding: 32px 0 100px; }
.hp-faq-layout { display: grid; grid-template-columns: 1fr 1.6fr; gap: 65px; }
.hp-faq-layout h2 { font-size: 2.6rem; margin: 9px 0; }
.hp-faq-list { border-top: 1px solid #dee4e7; }
.hp-faq-list details { border-bottom: 1px solid #dee4e7; padding: 19px 0; }
.hp-faq-list summary { font-weight: 750; cursor: pointer; padding-right: 20px; }
.hp-faq-list p { font-size: .9rem; color: #6f7e89; line-height: 1.8; margin: 11px 0 2px; }

/* ===== Private login popup; entirely external JS, compatible with script-src 'self'. ===== */
.hp-login-overlay[hidden] { display: none !important; }
.hp-login-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 18px;
}
.hp-login-backdrop { position: absolute; inset: 0; backdrop-filter: blur(5px); }
.hp-login-dialog {
  background: white;
  position: relative;
  border-radius: 16px;
  padding: 34px;
  max-width: 475px;
  width: 100%;
  max-height: min(92vh,750px);
  overflow: auto;
}
.hp-login-dialog h2 { margin: 9px 0 8px; font-size: 2.2rem; line-height: 1.1; }
.hp-login-dialog>p { color: #74808a; line-height: 1.65; margin-bottom: 23px; font-size: .9rem; }
.hp-login-close {
  position: absolute;
  right: 20px;
  top: 14px;
  background: none;
  border: 0;
  font-size: 1.8rem;
  color: #74818b;
}
.hp-login-form { display: flex; flex-direction: column; gap: 9px; }
.hp-login-form>label { font-size: .79rem; font-weight: 750; margin-top: 7px; }
.hp-password-field { position: relative; }
.hp-password-field input { padding-right: 62px; }
.hp-password-field button {
  position: absolute;
  right: 7px;
  top: 6px;
  bottom: 6px;
  border: 0;
  background: transparent;
  color: #87683f;
  font-weight: 700;
  font-size: .8rem;
  padding: 0 9px;
}
.hp-login-options {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 9px 0 14px;
  font-size: .78rem;
  color: #64707b;
}
.hp-login-options input { width: 15px; height: 15px; vertical-align: middle; }
.hp-login-options a { font-weight: 700; color: #9a723c; }
.hp-button-full { width: 100%; }
.hp-login-help { text-align: center; font-size: .83rem; margin-top: 19px; }
.hp-login-help a { color: #9b723d; font-weight: 750; }
.hp-login-note { display: block; margin-top: 22px; color: #87939b; line-height: 1.55; font-size: .7rem; }
.hp-modal-open { overflow: hidden; }

@media (max-width:1120px) {
  .hp-search-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hp-search-fields .hp-button-search { grid-column: span 2; }
  .hp-how-layout { gap: 50px; }
  .hp-hero-seal { width: 145px; height: 145px; flex-basis: 145px; }
}

@media (max-width:850px) {
  .hp-container { width: min(100% - 32px,1200px); }
  .hp-slideshow,.hp-slide-inner { min-height: 600px; }
  .hp-hero-seal { display: none; }
  .hp-section { padding: 75px 0; }
  .hp-section-head { align-items: start; flex-direction: column; gap: 3px; }
  .hp-benefits,.hp-city-grid { grid-template-columns: 1fr 1fr; }
  .hp-benefits .hp-benefit:last-child,.hp-city-grid .hp-city:last-child { grid-column: 1/-1; }
  .hp-city-grid .hp-city:last-child { aspect-ratio: 2.1/1; }
  .hp-how-layout { grid-template-columns: 1fr; gap: 35px; }
  .hp-privacy-symbol { width: 200px; height: 200px; flex-basis: 200px; }
  .hp-privacy-symbol strong { font-size: 2.8rem; }
  .hp-bottom-panel { padding: 36px; flex-wrap: wrap; }
  .hp-faq-layout { grid-template-columns: 1fr; gap: 20px; }
}

@media (max-width:620px) {
  .hp-container { width: min(100% - 28px,1200px); }
  .hp-slideshow,.hp-slide-inner { min-height: 570px; }
  .hp-slide-inner { padding: 55px 0 95px; }
  .hp-hero h1 { font-size: clamp(2.35rem,11vw,3.7rem); }
  .hp-hero p { font-size: .95rem; line-height: 1.65; }
  .hp-hero-shade { background: linear-gradient(90deg,rgba(9,24,38,.91),rgba(9,24,38,.59)); }
  .hp-hero-actions { gap: 9px; }
  .hp-hero-actions .hp-button { padding: 11px 15px; font-size: .8rem; min-height: 46px; }
  .hp-hero-controls { bottom: 38px; }
  .hp-search-card { padding: 24px 19px 20px; margin-top: -25px; }
  .hp-search-title { align-items: start; flex-direction: column; gap: 11px; }
  .hp-search-title h2 { font-size: 1.37rem; }
  .hp-search-fields { grid-template-columns: 1fr; }
  .hp-search-fields .hp-button-search { grid-column: auto; }
  .hp-transaction-set span { min-width: 70px; }
  .hp-search-foot { align-items: start; flex-direction: column; gap: 6px; }
  .hp-benefits,.hp-city-grid { grid-template-columns: 1fr; }
  .hp-benefits .hp-benefit:last-child,.hp-city-grid .hp-city:last-child { grid-column: auto; }
  .hp-city-grid .hp-city,.hp-city-grid .hp-city:last-child { aspect-ratio: 1.35/1; }
  .hp-section { padding: 22px 0; }
  .hp-section-head { margin-bottom: 25px; }
  .hp-benefit p { min-height: auto; }
  .hp-statement { padding: 70px 0; }
  .hp-statement-layout { flex-direction: column; align-items: start; }
  .hp-privacy-symbol { display: none; }
  .hp-bottom-panel { padding: 27px 23px; }
  .hp-bottom-actions { align-items: stretch; width: 100%; }
  .hp-login-dialog { padding: 27px 20px; }
  .hp-faq { padding-bottom: 0px; }
}

@media (prefers-reduced-motion:reduce) {
  .hp * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* ===== DEALER2DEALER PREMIUM PUBLIC FOOTER ===== */
.d2d-public-footer { color: #d4deea; padding: 0; margin-top: 0; font-family: inherit; }
.d2d-public-footer .d2d-public-container { width: min(1200px, calc(100% - 40px)); margin-left: auto; margin-right: auto; }

/* ===== Footer columns ===== */
.d2d-public-footer .d2d-footer-main { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr; gap: 55px; padding-top: 75px; padding-bottom: 65px; }

/* ===== Brand ===== */
.d2d-public-footer .d2d-footer-brand {
  display: inline-block;
  font-size: 27px;
  font-weight: 800;
  color: #ffffff;
  text-decoration: none;
  letter-spacing: -1px;
  margin-bottom: 20px;
}
.d2d-public-footer .d2d-footer-brand span { color: #d5a65f; }
.d2d-public-footer .d2d-footer-about p { font-size: 14px; line-height: 1.9; color: #b8c6d5; margin: 0 0 20px; max-width: 330px; }
.d2d-public-footer .d2d-footer-pill {
  display: inline-block;
  color: #e5bd80;
  background: rgba(213, 166, 95, 0.1);
  border: 1px solid rgba(213, 166, 95, 0.25);
  padding: 9px 15px;
  border-radius: 30px;
  font-size: 12px;
  font-weight: 600;
  margin-top:10px;
}

/* ===== Navigation ===== */
.d2d-public-footer .d2d-footer-col { display: flex; flex-direction: column; align-items: flex-start; gap: 13px; }
.d2d-public-footer .d2d-footer-col h2 { color: #ffffff; font-size: 16px; font-weight: 700; margin: 0 0 12px; }
.d2d-public-footer .d2d-footer-col a,
.d2d-public-footer .d2d-footer-col span {
  color: #b8c6d5;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.6;
  transition: color 0.2s ease;
}
.d2d-public-footer .d2d-footer-col a:hover { color: #e5bd80; }
.d2d-public-footer .d2d-footer-contact { margin-top: 8px; color: #e5bd80 !important; font-weight: 600; }

/* ===== Bottom bar ===== */
.d2d-public-footer .d2d-footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.12);
  padding-top: 25px;
  padding-bottom: 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.d2d-public-footer .d2d-footer-legal { display: flex; flex-wrap: wrap; gap: 15px; align-items: center; }
.d2d-public-footer .d2d-footer-legal span,
.d2d-public-footer .d2d-footer-legal a,
.d2d-public-footer .d2d-footer-credit { color: #afbfce; font-size: 12px; text-decoration: none; }
.d2d-public-footer .d2d-footer-legal a:hover { color: #ffffff; }

/* ===== Developer credit ===== */
.d2d-public-footer .d2d-footer-credit a { color: #e5bd80; font-weight: 700; text-decoration: none; margin-left: 5px; }
.d2d-public-footer .d2d-footer-credit a:hover { color: #ffffff; text-decoration: underline; }
.d2d-public-footer a:focus-visible { outline: 2px solid #e5bd80; outline-offset: 4px; }

/* ===== Tablet ===== */

@media (max-width: 991px) {
  .d2d-public-footer .d2d-footer-main { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 35px; padding-top: 55px; padding-bottom: 45px; }
}

/* ===== Mobile ===== */

@media (max-width: 575px) {
  .d2d-public-footer .d2d-public-container { width: calc(100% - 32px); }
  .d2d-public-footer .d2d-footer-main { grid-template-columns: 1fr 1fr; gap: 32px 20px; padding-top: 45px; padding-bottom: 35px; }
  .d2d-public-footer .d2d-footer-about { grid-column: 1 / -1; }
  .d2d-public-footer .d2d-footer-brand { font-size: 25px; }
  .d2d-public-footer .d2d-footer-bottom { flex-direction: column; text-align: center; gap: 15px; }
  .d2d-public-footer .d2d-footer-legal { justify-content: center; }
  .d2d-public-footer .d2d-footer-credit { text-align: center; }
}

/* ===== DEALER2DEALER PREMIUM PUBLIC HEADER ===== */
.d2d-public-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid #e7e9eb;
  box-shadow: 0 5px 25px rgba(20, 39, 59, .06);
}
.d2d-public-container { width: min(1200px, calc(100% - 40px)); margin-inline: auto; }

/* ===== Topbar ===== */
.d2d-topbar { color: #e6ddd0; }
.d2d-topbar-inner {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .10em;
}
.d2d-status-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-radius: 50%;
  background: #d5a65f;
}
.d2d-topbar-location b { color: #d5a65f; margin: 0 7px; }

/* ===== Header ===== */
.d2d-header-main {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 82px;
  gap: 20px;
}

/* ===== Brand ===== */
.d2d-public-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #14273b;
  text-decoration: none;
  flex-shrink: 0;
}
.d2d-public-brand:hover { color: #14273b; }
.d2d-brand-mark {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  color: #fff;
  border-radius: 10px;
  font-weight: 900;
  font-size: 16px;
}
.d2d-brand-mark span,
.d2d-brand-name > span { color: #c49551; }
.d2d-brand-name { display: block; font-size: 22px; font-weight: 800; letter-spacing: -1px; line-height: 1.1; }
.d2d-brand-name small {
  display: block;
  margin-top: 5px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.4px;
  color: #89919a;
}

/* ===== Desktop navigation ===== */
.d2d-public-header .d2d-public-nav { display: flex; align-items: center; gap: 3px; }
.d2d-public-header .d2d-public-nav > a {
  padding: 11px 10px;
  color: #465666;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 7px;
}
.d2d-public-header .d2d-public-nav > a:hover { color: #14273b; background: #f5f2ed; }

/* ===== Join button ===== */
.d2d-public-header .d2d-public-nav > .d2d-nav-apply { border: 1px solid #d4b58b; color: #90662e; margin-left: 5px; padding-inline: 14px; }
.d2d-public-header .d2d-public-nav > .d2d-nav-apply:hover { background: #fcf4e8; }

/* ===== Login button ===== */
.d2d-public-header .d2d-public-nav > .d2d-nav-login { padding: 12px 17px; margin-left: 6px; }
.d2d-public-header .d2d-public-nav > .d2d-nav-login:hover { color: #fff; }

/* ===== Mobile menu toggle ===== */
.d2d-public-toggle { display: none; align-items: center; gap: 8px; cursor: pointer; font-weight: 700; }

/* ===== Focus accessibility ===== */
.d2d-public-header a:focus-visible,
.d2d-public-header button:focus-visible { outline: 3px solid #d5a65f; outline-offset: 3px; }

/* ===== Tablet and mobile ===== */

@media (max-width: 1050px) {
  .d2d-public-header .d2d-public-toggle { display: inline-flex; min-height: 44px; }
  .d2d-public-header .d2d-public-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 110;
    flex-direction: column;
    align-items: stretch;
    gap: 5px;
    padding: 15px;
    background: #fff;
    border: 1px solid #e2e6eb;
    border-radius: 0 0 14px 14px;
    box-shadow: 0 20px 35px rgba(20,39,59,.14);
  }
  .d2d-public-header .d2d-public-nav.open { display: flex; }
  .d2d-public-header .d2d-public-nav > a { padding: 13px 14px; font-size: 14px; }
  .d2d-public-header .d2d-public-nav > .d2d-nav-apply,
    .d2d-public-header .d2d-public-nav > .d2d-nav-login { margin-left: 0; text-align: center; }
  .d2d-header-main { min-height: 72px; }
}

@media (max-width: 620px) {
  .d2d-public-container { width: calc(100% - 30px); }
  .d2d-topbar-inner { justify-content: center; text-align: center; font-size: 9px; letter-spacing: .04em; }
  .d2d-topbar-location { display: none; }
  .d2d-header-main { min-height: 69px; }
  .d2d-brand-mark { width: 38px; height: 38px; font-size: 14px; }
  .d2d-brand-name { font-size: 19px; }
  .d2d-brand-name small { font-size: 8px; letter-spacing: 1px; }
}

/* ===== OTP Primary - Password Secondary ===== */
.hp-password-alternative { margin-top: 20px; padding-top: 17px; border-top: 1px solid #e5e9ed; }
.hp-password-alternative > summary {
  cursor: pointer;
  text-align: center;
  color: #956d36;
  font-size: 14px;
  font-weight: 700;
  list-style: none;
}
.hp-password-alternative > summary::-webkit-details-marker { display: none; }
.hp-password-alternative[open] > summary { margin-bottom: 18px; }
.hp-password-alternative .hp-login-form { padding-top: 6px; }

/* ===== ADMIN DASHBOARD CLICKABLE STATS ===== */
.stat-link {
  display: block;
  color: inherit;
  text-decoration: none;
  position: relative;
  cursor: pointer;
  transition: transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}
.stat-link:hover { color: inherit; text-decoration: none; transform: translateY(-3px); box-shadow: 0 10px 24px rgba(18, 39, 59, .09); border-color: #d2b075; }
.stat-link:focus-visible { outline: 3px solid rgba(188, 132, 48, .25); outline-offset: 3px; }
.stat-action { display: block; margin-top: 12px; font-size: 12px; font-weight: 600; color: #9b6d29; }

/* ===== ADMIN DASHBOARD GRAPH ===== */
.dashboard-chart-panel { margin-top: 20px; }
.dashboard-panel-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 14px; }
.dashboard-panel-header h2 { margin-bottom: 4px; }
.dashboard-panel-subtitle { margin: 0; color: #75808d; font-size: 14px; }
.dashboard-report-link { flex-shrink: 0; color: #9b6d29; text-decoration: none; font-weight: 600; font-size: 14px; }
.dashboard-report-link:hover { text-decoration: underline; }

/* ===== Legend ===== */
.chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin: 20px 0 12px;
  font-size: 13px;
  color: #4d5966;
}
.chart-legend span { display: flex; align-items: center; gap: 7px; }
.legend-dot { width: 9px; height: 9px; display: inline-block; border-radius: 50%; }
.legend-dealer { background: #20384f; }
.legend-property { background: #c28b3b; }
.legend-enquiry { background: #668473; }

/* ===== Graph ===== */
.network-chart {
  display: grid;
  grid-template-columns: repeat(7, minmax(60px, 1fr));
  gap: 14px;
  height: 280px;
  padding: 20px 10px 0;
  border-bottom: 1px solid #e4e7eb;
  background: repeating-linear-gradient(
            to top,
            transparent,
            transparent 54px,
            #edf0f3 55px
        );
}
.network-chart-day { min-width: 0; display: flex; flex-direction: column; }
.network-chart-bars {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
}
.network-bar { width: 23%; max-width: 22px; min-width: 8px; border-radius: 5px 5px 0 0; transition: opacity .18s ease,
        transform .18s ease; }
.network-bar:hover { opacity: .78; transform: translateY(-2px); }
.bar-dealer { background: #20384f; }
.bar-property { background: #c28b3b; }
.bar-enquiry { background: #668473; }
.network-chart-label {
  display: block;
  text-align: center;
  padding-top: 10px;
  font-size: 12px;
  color: #6f7985;
  white-space: nowrap;
}

/* ===== Mobile ===== */

@media (max-width: 767px) {
  .dashboard-panel-header { flex-direction: column; gap: 8px; }
  .network-chart { overflow-x: auto; grid-template-columns: repeat(7, minmax(65px, 1fr)); gap: 10px; }
  .chart-legend { gap: 10px 16px; }
}

/* ===== PROPERTY FORM REQUIRED / ERRORS ===== */
.required-star { color: #b42318; font-weight: 800; }
.field.has-error .input,
.field.has-error .select,
.field.has-error .textarea { border-color: #c83b31; background: #fffafa; box-shadow: 0 0 0 2px rgba(200, 59, 49, .08); }
.property-field-error { margin-top: 5px; color: #a52c24; font-size: 12px; font-weight: 600; }
.form-errors { margin-bottom: 18px; }
.form-errors ul { margin: 8px 0 0; padding-left: 20px; }
.property-more > summary { cursor: pointer; font-weight: 700; padding: 12px 0; }

/* ===== STATUS BADGES ===== */
.badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.2;
  color: #334155;
  background: #edf0f3;
  border: 1px solid transparent;
  text-transform: capitalize;
}

/* ===== GOOD / LIVE ===== */
.badge-active,
.badge-approved,
.badge-published { background: #e8f7ee; color: #17663a; border-color: #b9e4c9; }

/* ===== WAITING ===== */
.badge-pending-approval,
.badge-under-discussion { background: #fff4d6; color: #7a5600; border-color: #ead28d; }

/* ===== NEEDS ACTION ===== */
.badge-changes-requested,
.badge-held-for-review { background: #fff0dc; color: #9a4d00; border-color: #e9c08c; }

/* ===== NEGATIVE / CLOSED ===== */
.badge-rejected,
.badge-unavailable,
.badge-sold,
.badge-rented { background: #fdebea; color: #8b2f2a; border-color: #efb9b6; }

/* ===== NEUTRAL ===== */
.badge-draft,
.badge-inactive,
.badge-unpublished { background: #eef1f4; color: #465568; border-color: #d8dee5; }

/* ===== ADMIN PANEL TYPOGRAPHY IMPROVEMENT ===== */

/* ===== General admin text ===== */
.staff-body { font-size: 15.5px; }

/* ===== Sidebar menu ===== */
.staff-body .sidebar nav a,
.staff-body .sidebar-logout { font-size: 0.96rem; font-weight: 700; }

/* ===== Top bar ===== */
.staff-body .staff-top { font-size: 0.96rem; }
.staff-body .staff-top strong { font-size: 1rem; font-weight: 700; }

/* ===== Page headings ===== */
.staff-body .staff-content h1 { font-weight: 700; font-size: 1.9rem; }
.staff-body .staff-content h2 { font-weight: 700; }
.staff-body .staff-content h3 { font-weight: 700; }

/* ===== Form labels ===== */
.staff-body .field label { font-size: 0.88rem; font-weight: 700; }

/* ===== Inputs and dropdowns ===== */
.staff-body .input,
.staff-body .select,
.staff-body .textarea { font-size: 0.96rem; }

/* ===== Tables ===== */
.staff-body .table th { font-size: 0.82rem; font-weight: 800; }
.staff-body .table td { font-size: 0.94rem; }

/* ===== Dashboard cards ===== */
.staff-body .stat span { font-size: 0.92rem; font-weight: 600; }
.staff-body .stat strong { font-weight: 800; }

/* ===== Buttons ===== */
.staff-body .btn { font-size: 0.92rem; font-weight: 700; }

/* ===== Detail labels ===== */
.staff-body .details dt { font-weight: 700; }

/* ===== Badges / statuses ===== */
.staff-body .badge { font-size: 0.78rem; font-weight: 700; }

/* ===== Lookup/list rows ===== */
.staff-body .list-row { font-size: 0.95rem; }

/* ===== DEALER2DEALER - SKY BLUE THEME Replaces major dark navy backgrounds / buttons ===== */
:root { --d2d-sky: #1976B8; --d2d-sky-hover: #145F96; --d2d-sky-light: #EAF5FC; }

/* ===== GLOBAL BUTTONS ===== */
.btn { background: var(--d2d-sky); color: #fff; }
.btn:hover { background: var(--d2d-sky-hover); }
.btn-outline { background: #fff; color: var(--d2d-sky); border-color: #B9D9EB; }

/* ===== PUBLIC TOP BAR ===== */
.d2d-topbar { background: var(--d2d-sky); }

/* ===== PUBLIC HEADER ===== */
.d2d-brand-mark { background: var(--d2d-sky); }
.d2d-public-brand,
.d2d-public-brand:hover { color: var(--d2d-sky); }
.d2d-public-header .d2d-public-nav > .d2d-nav-login { background: var(--d2d-sky); color: #fff; }
.d2d-public-header .d2d-public-nav > .d2d-nav-login:hover { background: var(--d2d-sky-hover); }
.d2d-public-toggle { color: var(--d2d-sky); }

/* ===== HOMEPAGE HERO ===== */

/* ===== HOMEPAGE SEARCH ===== */
.hp-button-search { color: #fff; }

/* ===== CITY CARDS FALLBACK ===== */

/* ===== PRIVACY / TRUST SECTION ===== */

/* ===== HOMEPAGE LOGIN ===== */
.hp-button-full { background: var(--d2d-sky); color: #fff; }
.hp-button-full:hover { background: var(--d2d-sky-hover); }

/* ===== PUBLIC FOOTER ===== */
.d2d-public-footer { background: var(--d2d-sky); }

/* ===== ADMIN SIDEBAR ===== */
.sidebar { background: var(--d2d-sky); }
.sidebar nav a:hover { background: var(--d2d-sky-hover); }

/* ===== GENERAL SKY BLUE ACCENTS ===== */
.hero-dot.active { background: var(--d2d-sky); }
.step-num { background: var(--d2d-sky); }

/* ===== DEALER2DEALER SKY BLUE HOMEPAGE SECTION SYSTEM Removes old gold styling ===== */
.hp { --hp-navy: #1976B8; --hp-ink: #153247; --hp-gold: #1976B8; --hp-border: #D9EAF5; --hp-muted: #637889; }

/* ===== SMALL HEADINGS / KICKERS ===== */
.hp-kicker { color: #1976B8; }
.hp-kicker-light { color: #D6F0FF; }
.hp-topline { color: #D8F1FF; }
.hp-topline-dot { background: #8ED6FF; }

/* ===== HERO ===== */
.hp-hero { background: #0b1726; }
.hp-hero h1 em,
.hp-statement h2 em { color: #8ED6FF; }
.hp-hero p { color: #F2F9FD; }

/* ===== Main Hero Button ===== */
.hp-button-gold { background: #FFFFFF; color: #145F96 !important; border-color: #FFFFFF; box-shadow: 0 8px 24px rgba(0, 0, 0, .10); }
.hp-button-gold:hover { background: #EAF5FC; color: #0E4F7A !important; }

/* ===== Second Hero Button ===== */
.hp-button-ghost { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .55); color: #FFFFFF !important; }
.hp-button-ghost:hover { background: rgba(255, 255, 255, .20); }

/* ===== Hero circle ===== */
.hp-hero-seal { background: rgba(14, 79, 122, .25); border-color: rgba(255, 255, 255, .55); }
.hp-hero-seal strong { color: #BEE9FF; }

/* ===== Slider active ===== */
.hp-slide-dot.is-active { border-color: #8ED6FF; }

/* ===== SEARCH SECTION ===== */
.hp-search-wrap { background: #F5FAFD; }
.hp-search-card { border-color: #DCEBF4; box-shadow: 0 20px 55px rgba(25, 118, 184, .10); }
.hp-transaction-set input:checked + span { background: #1976B8; border-color: #1976B8; color: #FFFFFF; }
.hp-control select:focus,
.hp-control input:focus,
.hp-login-form input:focus { border-color: #1976B8; box-shadow: 0 0 0 3px rgba(25, 118, 184, .13); }
.hp-button-search { background: #1976B8; border-color: #1976B8; }
.hp-button-search:hover { background: #145F96; }
.hp-search-foot a { color: #1976B8; }

/* ===== TRUST / BENEFIT SECTION ===== */
.hp-section-head h2 span,
.hp-bottom h2 span { color: #1976B8; }
.hp-benefit { border-color: #DDEBF4; box-shadow: 0 12px 34px rgba(25, 118, 184, .05); }
.hp-icon { background: #EAF5FC; color: #1976B8; }
.hp-benefit > span:last-child { color: #1976B8; }

/* ===== TRICITY SECTION ===== */
.hp-cities { background: #F1F8FC; }
.hp-city { background: #1976B8; }
.hp-city-info small { color: #BEE9FF; }

/* ===== HOW IT WORKS ===== */
.hp-how-aside h2 em { color: #1976B8; }
.hp-inline-link { color: #1976B8; }
.hp-process-row > span { color: #1976B8; }

/* ===== PRIVACY / NETWORK SECTION ===== */
.hp-statement {
  background: radial-gradient(
            circle at 88% 20%,
            #47A5DB,
            transparent 42%
        ),
        linear-gradient(
            135deg,
            #0E4F7A,
            #1976B8
        );
}
.hp-statement p { color: #E5F4FC; }
.hp-privacy-symbol { border-color: rgba(190, 233, 255, .40); }
.hp-privacy-symbol > span,
.hp-privacy-symbol small { color: #BEE9FF; }
.hp-privacy-symbol strong span { color: #8ED6FF; }

/* ===== SHARE / WHATSAPP PANEL ===== */
.hp-bottom-panel { background: #EFF8FD; border-color: #D5EAF6; }
.hp-bottom-actions .hp-button-gold { background: #1976B8; color: #FFFFFF !important; border-color: #1976B8; }
.hp-bottom-actions .hp-button-gold:hover { background: #145F96; }

/* ===== FAQ ===== */
.hp-faq-list { border-color: #DCE9F1; }
.hp-faq-list details { border-color: #DCE9F1; }
.hp-faq-list summary { color: #153247; }

/* ===== LOGIN POPUP ===== */
.hp-login-backdrop { background: rgba(9, 53, 83, .72); }
.hp-login-dialog { box-shadow: 0 35px 90px rgba(12, 68, 104, .28); }

/* ===== FOCUS STATES ===== */
.hp-button:focus-visible,
.hp button:focus-visible,
.hp a:focus-visible { outline: 3px solid #8ED6FF; outline-offset: 3px; }

/* ===== DYNAMIC HERO - STRUCTURE PROTECTION ===== */
.hp-hero,
.hp-slideshow { position: relative; overflow: hidden; }

/* ===== Every campaign keeps same hero height ===== */
.hp-hero-slide { position: absolute; inset: 0; min-height: 635px; overflow: hidden; }
.hp-hero-slide.is-active { position: relative; }

/* ===== Background picture always fills hero ===== */
.hp-hero-slide picture { position: absolute; inset: 0; width: 100%; height: 100%; }

/* ===== Advertisement image stays in background ===== */
.hp-hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 1;
}
.hp-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    90deg,
    rgba(7, 17, 29, .86) 0%,
    rgba(9, 22, 37, .72) 38%,
    rgba(9, 22, 37, .42) 70%,
    rgba(9, 22, 37, .20) 100%
  );
}

/* ===== Content remains above background ===== */
.hp-slide-inner { position: relative; z-index: 2; min-height: 635px; display: flex; align-items: center; }

/* ===== Protect text width ===== */
.hp-hero-copy { width: 100%; max-width: 700px; }
.hp-hero-copy h1 {
  max-width: 700px;
  font-size: clamp(
        3rem,
        5vw,
        5.4rem
    );
  line-height: .98;
  letter-spacing: -.035em;
  text-wrap: balance;
  margin-bottom: 22px;
}

/* ===== Highlight stays controlled ===== */
.hp-hero-copy h1 em { display: block; }

/* ===== Description cannot become extremely wide ===== */
.hp-hero-copy > p { max-width: 620px; font-size: 1.05rem; line-height: 1.65; }

/* ===== Keep language/arrows at bottom ===== */
.hp-hero-controls { position: absolute; left: 0; right: 0; bottom: 48px; z-index: 5; }

/* ===== MOBILE ===== */

@media (max-width: 767px) {
  .hp-hero-slide,
    .hp-slide-inner { min-height: 680px; }
 .hp-hero-image {
  object-position: center;
  opacity: 1;
}

.hp-hero-shade {
  background: linear-gradient(
    180deg,
    rgba(7, 17, 29, .78) 0%,
    rgba(7, 17, 29, .68) 55%,
    rgba(7, 17, 29, .55) 100%
  );
}
  .hp-hero-copy { max-width: 100%; }
  .hp-hero-copy h1 { max-width: 100%; font-size: clamp(
            2.5rem,
            11vw,
            4rem
        ); line-height: 1; }
  .hp-hero-copy > p { font-size: .98rem; }
  .hp-hero-controls { bottom: 35px; }
}

/* ===== Hero language selector ===== */
.hp-slide-dot { font-weight: 800; font-size: 15px; }
.hp-slide-dot.is-active { font-weight: 900; }

/* ===== SEARCHABLE CITY / LOCALITY DROPDOWNS ===== */
.d2d-native-select-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.d2d-search-select { position: relative; width: 100%; }
.d2d-search-select-trigger {
  width: 100%;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 13px;
  border: 1px solid #d6dee6;
  border-radius: 8px;
  background: #fff;
  color: #1f2937;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.d2d-search-select-trigger:hover { border-color: #9eb8ca; }
.d2d-search-select.is-open
.d2d-search-select-trigger { border-color: #1976b8; box-shadow: 0 0 0 3px
        rgba(25, 118, 184, .10); }
.d2d-search-select-arrow { flex: 0 0 auto; font-size: 18px; line-height: 1; transition: transform .18s ease; }
.d2d-search-select.is-open
.d2d-search-select-arrow { transform: rotate(180deg); }
.d2d-search-select-dropdown {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  z-index: 1000;
  background: #fff;
  border: 1px solid #d7e0e7;
  border-radius: 10px;
  box-shadow: 0 12px 32px
        rgba(15, 23, 42, .14);
  overflow: hidden;
}
.d2d-search-select-search { padding: 10px; border-bottom: 1px solid #e6ebef; background: #fff; }
.d2d-search-select-search input {
  display: block;
  width: 100%;
  height: 42px;
  padding: 8px 12px;
  border: 1px solid #cfd9e1;
  border-radius: 7px;
  background: #fff;
  color: #1f2937;
  font: inherit;
  outline: none;
}
.d2d-search-select-search input:focus { border-color: #1976b8; box-shadow: 0 0 0 3px
        rgba(25, 118, 184, .10); }
.d2d-search-select-options { max-height: 310px; overflow-y: auto; overscroll-behavior: contain; }
.d2d-search-select-option {
  display: block;
  width: 100%;
  padding: 11px 13px;
  border: 0;
  border-bottom: 1px solid #eef2f5;
  background: #fff;
  color: #243746;
  font: inherit;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.d2d-search-select-option:last-child { border-bottom: 0; }
.d2d-search-select-option:hover,
.d2d-search-select-option:focus { background: #eef7fc; color: #0e5f91; outline: none; }
.d2d-search-select-option.is-selected { background: #e5f3fb; color: #0c6397; font-weight: 800; }
.d2d-search-select-empty { padding: 18px 14px; color: #64748b; font-size: 14px; text-align: center; }
.d2d-search-select.is-disabled
.d2d-search-select-trigger { cursor: not-allowed; opacity: .6; background: #f5f7f9; }

/* ===== Mobile ===== */

@media (max-width: 767px) {
  .d2d-search-select-dropdown {
    position: fixed;
    left: 12px;
    right: 12px;
    top: 50%;
    bottom: auto;
    width: auto;
    transform: translateY(-50%);
    max-height: 72vh;
    border-radius: 14px;
    z-index: 99999;
  }
  .d2d-search-select-search { position: sticky; top: 0; z-index: 2; padding: 12px; }
  .d2d-search-select-search input { height: 48px; font-size: 16px; }
  .d2d-search-select-options { max-height: calc(72vh - 74px); }
  .d2d-search-select-option { padding: 14px; font-size: 15px; }
}
.d2d-contact-phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  color: #1976b8;
  text-decoration: none;
  font-size: 18px;
  font-weight: 800;
}
.d2d-contact-phone:hover { text-decoration: underline; }
.d2d-contact-phone svg { flex: 0 0 auto; }

/* ===== ADMIN MOBILE SIDEBAR ===== */
.staff-sidebar-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.staff-sidebar-close,
.staff-menu-toggle,
.staff-sidebar-overlay { display: none; }

/* ===== MOBILE / TABLET ADMIN ===== */

@media (max-width: 900px) {
  .staff-body .staff-layout { display: block; min-height: 100vh; }
  .staff-body .staff-main { width: 100%; min-width: 0; margin: 0; }

  /* ===== * Sidebar becomes off-canvas drawer. ===== */
  .staff-body .staff-sidebar {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(84vw, 320px);
    height: 100dvh;
    margin: 0;
    z-index: 10002;
    overflow-y: auto;
    overscroll-behavior: contain;
    transform: translateX(-105%);
    transition: transform .25s ease;
    box-shadow: 10px 0 30px
            rgba(0, 0, 0, .18);
  }
  .staff-body.staff-sidebar-open
    .staff-sidebar { transform: translateX(0); }

  /* ===== * Sidebar heading. ===== */
  .staff-sidebar-head { position: sticky; top: 0; z-index: 2; padding-bottom: 14px; background: inherit; }
  .staff-body
    .staff-sidebar
    .staff-sidebar-nav {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 2px;
    width: 100%;
  }
  .staff-body
    .staff-sidebar
    .staff-sidebar-nav a { display: block; width: 100%; padding: 11px 10px; margin: 0; white-space: normal; }

  /* ===== * Logout stays below navigation. ===== */
  .staff-body
    .sidebar-logout { margin-top: 12px; padding-top: 10px; }

  /* ===== * Sidebar X button. ===== */
  .staff-sidebar-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    cursor: pointer;
  }

  /* ===== * Dark page overlay. ===== */
  .staff-sidebar-overlay {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 10001;
    margin: 0;
    padding: 0;
    border: 0;
    background: rgba(15, 23, 42, .52);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease,
            visibility .2s ease;
  }
  .staff-body.staff-sidebar-open
    .staff-sidebar-overlay { opacity: 1; visibility: visible; pointer-events: auto; }
  .staff-body.staff-sidebar-open { overflow: hidden; }

  /* ===== * Mobile top admin header. ===== */
  .staff-body .staff-top {
    position: sticky;
    top: 0;
    z-index: 1000;
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 12px;
    background: #fff;
  }
  .staff-top-left { display: flex; align-items: center; min-width: 0; gap: 10px; }
  .staff-top-left strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* ===== * Hamburger. ===== */
  .staff-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid #d9e1ea;
    border-radius: 9px;
    background: #fff;
    color: #172b4d;
    cursor: pointer;
  }
  .staff-menu-toggle:active { transform: scale(.97); }
  .staff-admin-name { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }

  /* ===== * Admin page content. ===== */
  .staff-body .staff-content { width: 100%; min-width: 0; padding: 14px 12px 28px; }
}

/* ===== ADMIN DASHBOARD MOBILE STATS 2 cards per row ===== */

@media (max-width: 767px) {
  .staff-body
    .stat-grid.admin-dashboard-stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100%;
    margin: 0 0 14px;
  }
  .staff-body
    .admin-dashboard-stats
    .stat {
    min-width: 0;
    min-height: 76px;
    padding: 10px 11px !important;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 3px;
    border-radius: 9px;
  }
  .staff-body
    .admin-dashboard-stats
    .stat span {
    display: block;
    width: 100%;
    font-size: 11px !important;
    line-height: 1.25 !important;
    white-space: normal;
    overflow-wrap: break-word;
  }
  .staff-body
    .admin-dashboard-stats
    .stat strong { display: block; margin: 0 !important; font-size: 22px !important; line-height: 1.1 !important; }
}

/* ===== DEALER DASHBOARD ===== */
.dealer-dashboard { width: 100%; }
.dealer-dashboard-welcome { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.dealer-dashboard-welcome h1 { margin: 5px 0 2px; font-size: clamp(
            1.8rem,
            3vw,
            2.4rem
        ); line-height: 1.15; }
.dealer-dashboard-welcome p { margin: 5px 0 0; }
.dealer-dashboard-stats { grid-template-columns: repeat(
            4,
            minmax(0, 1fr)
        ); }
.dealer-dashboard-stats
.stat { min-width: 0; }
.dealer-dashboard-stats
.stat small {
  display: block;
  margin-top: 7px;
  color: #71808d;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
}
.dealer-dashboard-actions { margin-top: 20px; }
.dealer-dashboard-section-head { margin-bottom: 15px; }
.dealer-dashboard-section-head h2 { margin: 0; font-size: 1.2rem; }
.dealer-dashboard-section-head p { margin: 4px 0 0; font-size: 13px; }

/* ===== DEALER QUICK ACTIONS ===== */
.dealer-quick-grid { display: grid; grid-template-columns: repeat(
            4,
            minmax(0, 1fr)
        ); gap: 10px; }
.dealer-quick-action {
  min-width: 0;
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px;
  border: 1px solid #dde5eb;
  border-radius: 10px;
  background: #fff;
  color: #1d2a3a;
  text-decoration: none;
  transition: border-color .18s ease,
        background .18s ease,
        transform .18s ease;
}
.dealer-quick-action:hover { color: #1d2a3a; border-color: #8fc3e0; background: #f4faff; transform: translateY(-2px); }
.dealer-quick-icon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #eaf5fc;
  color: #1976b8;
  font-size: 20px;
  font-weight: 800;
}
.dealer-quick-action > span:last-child { min-width: 0; }
.dealer-quick-action strong { display: block; font-size: 13px; line-height: 1.25; }
.dealer-quick-action small { display: block; margin-top: 3px; color: #73808c; font-size: 11px; line-height: 1.3; }

/* ===== TABLET ===== */

@media (max-width: 900px) {
  .dealer-dashboard-stats { grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important; }
  .dealer-quick-grid { grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ); }
}

/* ===== DEALER DASHBOARD MOBILE ===== */

@media (max-width: 620px) {
  .dealer-main { padding-top: 16px; }
  .dealer-dashboard-welcome { align-items: flex-start; margin-bottom: 14px; }
  .dealer-dashboard-welcome
    .eyebrow { font-size: 10px; }
  .dealer-dashboard-welcome h1 { font-size: 1.45rem; margin-top: 3px; }
  .dealer-dashboard-welcome p { font-size: 12px; }

  /* ===== * Add button remains compact. ===== */
  .dealer-dashboard-add { min-height: 40px; padding: 8px 11px; flex: 0 0 auto; font-size: 12px; }
  .dealer-dashboard
    .dealer-dashboard-stats {
    display: grid !important;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    gap: 8px !important;
  }
  .dealer-dashboard
    .dealer-dashboard-stats
    .stat { min-height: 84px; padding: 10px 11px !important; border-radius: 9px; }
  .dealer-dashboard
    .dealer-dashboard-stats
    .stat span { font-size: 11px !important; line-height: 1.25; }
  .dealer-dashboard
    .dealer-dashboard-stats
    .stat strong { margin-top: 2px; font-size: 22px !important; line-height: 1; }
  .dealer-dashboard
    .dealer-dashboard-stats
    .stat small { margin-top: 5px; font-size: 9px; line-height: 1.25; }

  /* ===== * Compact Quick Action panel. ===== */
  .dealer-dashboard-actions { margin-top: 12px; padding: 14px 12px; }
  .dealer-dashboard-section-head { margin-bottom: 10px; }
  .dealer-dashboard-section-head h2 { font-size: 1rem; }
  .dealer-dashboard-section-head p { display: none; }

  /* ===== * 2 quick actions in every row. ===== */
  .dealer-quick-grid { grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ); gap: 8px; }
  .dealer-quick-action { min-height: 69px; padding: 9px 8px; gap: 7px; }
  .dealer-quick-icon { flex-basis: 31px; width: 31px; height: 31px; border-radius: 7px; font-size: 16px; }
  .dealer-quick-action strong { font-size: 11px; }
  .dealer-quick-action small { font-size: 9px; }
}

/* ===== DEALER PROPERTY SEARCH - MOBILE COMPACT LAYOUT ===== */
.dealer-search-panel { margin-bottom: 18px; }
.dealer-search-actions { margin-top: 14px; }
.dealer-search-submit { min-width: 150px; }

/* ===== MOBILE ===== */

@media (max-width: 620px) {
  /* ===== * Make search page heading more compact. ===== */

  /* ===== * Search panel itself. ===== */
  .dealer-search-panel { padding: 13px !important; border-radius: 10px; }
  .dealer-search-panel
    .dealer-search-main-grid {
    display: grid !important;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    gap: 10px 8px !important;
  }
  .dealer-search-panel
    .dealer-search-locality { grid-column: 1 / -1; }

  /* ===== * Budget also full width. ===== */
  .dealer-search-panel
    .dealer-search-budget { grid-column: 1 / -1; }

  /* ===== * Compact labels. ===== */
  .dealer-search-panel
    .field label { margin-bottom: 4px; font-size: 10px !important; line-height: 1.25; }
  .dealer-search-panel
    .input,
    .dealer-search-panel
    .select,
    .dealer-search-panel
    .d2d-search-select-trigger {
    min-height: 44px;
    padding: 8px 10px;
    font-size: 13px;
  }

  /* ===== * More Filters compact row. ===== */
  .dealer-search-more { margin-top: 8px !important; border-top: 1px solid #e8edf1; }
  .dealer-search-more > summary { padding: 11px 2px 8px !important; font-size: 12px; color: #1976b8; list-style-position: inside; }
  .dealer-search-more
    .grid.grid-3 {
    display: grid !important;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    gap: 10px 8px !important;
    margin-top: 8px !important;
  }

  /* ===== * Search + Clear on one row. ===== */
  .dealer-search-actions { display: grid; grid-template-columns: minmax(0, 1fr)
            auto; gap: 8px; margin-top: 10px !important; }
  .dealer-search-actions
    .btn { width: 100%; min-height: 44px; padding: 8px 12px; font-size: 12px; }
  .dealer-search-clear { min-width: 74px; }

  /* ===== * Search results heading. ===== */
  .dealer-main
    .result-head { margin: 12px 0 8px; font-size: 12px; }
  .dealer-main
    .property-list { gap: 9px; margin-top: 8px; }
  .dealer-main
    .property-card { padding: 13px; border-radius: 10px; }
  .dealer-main
    .property-card h3 { margin: 8px 0 2px; font-size: 15px; }
  .dealer-main
    .property-facts { grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ); gap: 6px 10px; margin: 8px 0; padding: 8px 0; }
  .dealer-main
    .property-card-bottom { gap: 7px; }
}

/* ===== DEALER PROPERTY DETAIL - MOBILE ===== */

@media (max-width: 620px) {
  /* ===== * Compact page spacing ===== */
  .dealer-property-layout { gap: 10px !important; }
  .dealer-property-details-panel { padding: 13px !important; }
  .dealer-property-details-panel h2 { margin: 0 0 8px; font-size: 1rem; }
  .dealer-property-details {
    display: grid !important;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    gap: 0;
    margin: 0;
  }
  .dealer-property-detail-item { min-width: 0; padding: 9px 8px; border-bottom: 1px solid #edf0f2; }
  .dealer-property-detail-wide { grid-column: 1 / -1; }
  .dealer-property-detail-item dt {
    margin: 0 0 3px !important;
    padding: 0;
    color: #687785;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.25;
  }
  .dealer-property-detail-item dd {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 0 !important;
    color: #1d2a3a;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }

  /* ===== * Second Description/contact panel. ===== */
  .dealer-property-layout
    > .panel { padding: 13px; }
  .dealer-property-layout
    > .panel h2 { margin-top: 0; font-size: 1rem; }
  .dealer-property-actions {
    position: static !important;
    display: grid !important;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            );
    gap: 8px;
    margin: 10px 0 4px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .dealer-property-actions
    > * { min-width: 0; margin: 0 !important; }
  .dealer-property-actions
    .btn { width: 100%; min-height: 44px; padding: 8px 9px; font-size: 11px; line-height: 1.3; }
  .dealer-property-actions
    form { width: 100%; }
}

/* ===== DEALER MY PROPERTIES ===== */
.dealer-my-properties-page { width: 100%; }
.dealer-my-properties-list { margin-top: 0; }
.dealer-my-property-card { min-width: 0; }
.dealer-my-property-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dealer-my-property-code { color: #1976b8; font-size: 13px; font-weight: 800; letter-spacing: .02em; }
.dealer-my-property-main { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; }
.dealer-my-property-main > div { min-width: 0; }
.dealer-my-property-main h3 { margin: 0; font-size: 15px; line-height: 1.25; }
.dealer-my-property-main p { margin: 4px 0 0; font-size: 12px; line-height: 1.35; }
.dealer-my-property-open { flex: 0 0 auto; }
.dealer-my-property-facts {
  display: grid;
  grid-template-columns: repeat(
            2,
            minmax(0, 1fr)
        );
  gap: 8px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid #edf0f2;
}
.dealer-my-property-facts > div { min-width: 0; }
.dealer-my-property-facts span { display: block; margin-bottom: 2px; color: #73808c; font-size: 10px; font-weight: 600; }
.dealer-my-property-facts strong { display: block; color: #1d2a3a; font-size: 12px; line-height: 1.3; overflow-wrap: anywhere; }

/* ===== MOBILE ===== */

@media (max-width: 620px) {
  .dealer-my-properties-page
    .page-head {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
  }
  .dealer-my-properties-page
    .page-head > div { min-width: 0; }
  .dealer-my-properties-page
    .page-head h1 { margin: 3px 0 1px; font-size: 1.45rem; }
  .dealer-my-properties-page
    .page-head p { margin: 3px 0 0; font-size: 11px; line-height: 1.35; }
  .dealer-my-properties-page
    .page-head .eyebrow { font-size: 9px; }
  .dealer-my-properties-add { flex: 0 0 auto; min-height: 40px; padding: 8px 10px; font-size: 11px; }
  .dealer-my-properties-list { gap: 8px !important; }
  .dealer-my-property-card { padding: 11px 12px !important; border-radius: 10px; }
  .dealer-my-property-top
    .badge { max-width: 125px; padding: 4px 7px; font-size: 9px; white-space: normal; text-align: center; }
  .dealer-my-property-main { margin-top: 8px; gap: 8px; }
  .dealer-my-property-main h3 { font-size: 13px; }
  .dealer-my-property-main p { margin-top: 2px; font-size: 10px; }
  .dealer-my-property-open { min-height: 38px; padding: 7px 11px; font-size: 10px; }
  .dealer-my-property-facts { margin-top: 8px; padding-top: 7px; gap: 6px; }
  .dealer-my-property-facts span { font-size: 9px; }
  .dealer-my-property-facts strong { font-size: 11px; }
  .dealer-my-properties-empty { padding: 25px 15px !important; }
}

/* ===== DEALER ADD / EDIT PROPERTY - MOBILE ===== */

@media (max-width: 620px) {
  /* ===== PAGE HEADING ===== */
  .dealer-main .page-head { margin-bottom: 12px; }
  .dealer-main .page-head h1 { margin: 3px 0 2px; font-size: 1.45rem; line-height: 1.15; }
  .dealer-main .page-head .eyebrow { font-size: 9px; }
  .dealer-main .page-head p { margin: 3px 0 0; font-size: 11px; line-height: 1.4; }

  /* ===== ADD PROPERTY - CHOOSE METHOD ===== */
  .dealer-add-choice-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px !important; margin: 0 0 12px !important; }
  .dealer-add-choice-grid
    > [class*="col-"] { width: auto !important; max-width: none !important; padding: 0 !important; }
  .dealer-add-choice-grid
    .panel { min-height: 125px; padding: 12px !important; border-radius: 10px; }
  .dealer-add-choice-grid
    .eyebrow { font-size: 8px; }
  .dealer-add-choice-grid
    strong { margin-top: 5px !important; font-size: 13px !important; line-height: 1.25; }
  .dealer-add-choice-grid
    .muted { margin-top: 5px !important; font-size: 9px; line-height: 1.4; }
  .dealer-add-choice-grid
    .fw-semibold { margin-top: 8px !important; font-size: 9px; line-height: 1.3; }

  /* ===== MANUAL PROPERTY SECTION ===== */
  #manual-property > h2 { margin: 5px 0 9px !important; font-size: 1rem !important; }

  /* ===== PROPERTY FORM CONTAINER ===== */
  .dealer-property-form { padding: 10px 12px 6px !important; border-radius: 10px; }

  /* ===== Individual form sections ===== */
  .dealer-property-form
    .form-section { padding: 12px 0 !important; }
  .dealer-property-form
    .form-section:first-of-type { padding-top: 2px !important; }
  .dealer-property-form
    .form-section h2 { margin: 0 0 9px; font-size: 13px; line-height: 1.3; }

  /* ===== TWO FIELDS PER ROW ===== */
  .dealer-property-form
    .grid.grid-3 {
    display: grid !important;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    gap: 9px 8px !important;
  }

  /* ===== * Keep description normal/full width. ===== */
  .dealer-property-form
    .textarea { width: 100%; }

  /* ===== COMPACT FIELDS ===== */
  .dealer-property-form
    .field { min-width: 0; }
  .dealer-property-form
    .field label { margin-bottom: 4px; font-size: 10px !important; line-height: 1.25; }
  .dealer-property-form
    .input,
    .dealer-property-form
    .select,
    .dealer-property-form
    .d2d-search-select-trigger {
    min-width: 0;
    min-height: 43px;
    padding: 8px 9px;
    font-size: 12px !important;
  }
  .dealer-property-form
    .textarea { min-height: 90px; padding: 9px; font-size: 12px !important; }
  .dealer-property-form
    small.muted { display: block; margin-top: 4px; font-size: 9px; line-height: 1.35; }

  /* ===== Negotiable checkbox ===== */
  .dealer-property-form
    .checkbox-field { min-height: 43px; display: flex; align-items: center; }
  .dealer-property-form
    .checkbox-field label { margin: 0; display: flex; align-items: center; gap: 5px; }

  /* ===== MORE PROPERTY DETAILS ===== */
  .dealer-property-form
    .property-more { margin-top: 8px !important; border-top: 1px solid #e5ebef; }
  .dealer-property-form
    .property-more > summary { padding: 11px 2px !important; color: #1976b8; font-size: 12px; font-weight: 700; line-height: 1.3; }
    
    
    
  .dealer-property-form
    .property-more
    > .grid {
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    gap: 9px 8px !important;
  }
  
  
/* More Property Details - mobile alignment */
.dealer-property-form
  .property-more
  > .grid
  > .field:first-child {
  grid-column: 1 / -1;
}
  /* ===== Sections inside More Details ===== */
  .dealer-property-form
    .property-more
    .form-section { padding: 11px 0 !important; }

  /* ===== SAVE / SUBMIT BAR ===== */
  .dealer-property-form
    .form-actions {
    position: sticky;
    bottom: 53px;
    z-index: 35;
    display: grid;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            );
    gap: 7px;
    margin: 12px -5px -2px;
    padding: 8px 5px;
    background: rgba(255,255,255,.97);
    border-top: 1px solid #e2e8ed;
    box-shadow: 0 -7px 16px
            rgba(18,45,65,.05);
  }
  .dealer-property-form
    .form-actions .btn { width: 100%; min-height: 42px; padding: 7px 8px; font-size: 10px; line-height: 1.3; }

  /* ===== EDIT PROPERTY - PRIVATE IMAGES ===== */
  .dealer-property-images { margin-top: 10px !important; padding: 12px !important; }
  .dealer-property-images h2 { margin: 0 0 5px; font-size: 1rem; }
  .dealer-property-images > p { margin: 0 0 10px; font-size: 10px; line-height: 1.4; }
  .dealer-property-images
    .image-grid { grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ); gap: 8px; }
  .dealer-property-images
    .image-grid img { height: 110px; }
  .dealer-property-images
    .image-tile { gap: 5px; }
  .dealer-property-images
    .image-tile .btn { width: 100%; min-height: 34px; padding: 5px 8px; font-size: 9px; }

  /* ===== * Image upload stays easy to use. ===== */
  .dealer-property-images
    > form.actions { display: grid; grid-template-columns: 1fr; gap: 7px; margin-top: 10px !important; }
  .dealer-property-images
    > form.actions
    .input { min-width: 0; width: 100%; font-size: 11px; }
  .dealer-property-images
    > form.actions
    .btn { width: 100%; min-height: 40px; font-size: 11px; }
}

/* ===== DEALER MOBILE NAV - HORIZONTAL CAROUSEL ===== */

@media (max-width: 820px) {
  .dealer-mobile-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 60;
    display: flex !important;
    grid-template-columns: none !important;
    align-items: stretch;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    background: #fff;
    border-top: 1px solid #dfe5ea;
    box-shadow: 0 -5px 18px
            rgba(17, 38, 56, .07);
    scrollbar-width: none;
  }
  .dealer-mobile-nav::-webkit-scrollbar { display: none; }
  .dealer-mobile-nav a {
    position: relative;
    flex: 0 0 auto;
    min-width: 84px;
    min-height: 52px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 9px 10px !important;
    scroll-snap-align: center;
    color: #536271;
    font-size: 10px !important;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    text-align: center;
    text-decoration: none;
  }
  .dealer-mobile-nav
    a.is-active { color: #1976b8; font-weight: 800; background: #eef8fd; }
  .dealer-mobile-nav
    a.is-active::before {
    content: "";
    position: absolute;
    top: 0;
    left: 15px;
    right: 15px;
    height: 2px;
    border-radius: 0 0 4px 4px;
    background: #1976b8;
  }
  .dealer-mobile-count {
    min-width: 16px;
    height: 16px;
    display: inline-grid;
    place-items: center;
    padding: 0 4px;
    border-radius: 999px;
    background: #1976b8;
    color: #fff;
    font-size: 8px;
    font-weight: 800;
  }
}

/* ===== DEALER MY ENQUIRIES - MOBILE ===== */
.dealer-enquiry-list { margin-top: 0; }
.dealer-enquiry-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dealer-enquiry-card-top
> strong { color: #1976b8; font-size: 13px; }
.dealer-enquiry-info {
  display: grid;
  grid-template-columns: repeat(
            2,
            minmax(0, 1fr)
        );
  gap: 8px 12px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid #edf0f2;
}
.dealer-enquiry-info
> div { min-width: 0; }
.dealer-enquiry-info span { display: block; margin-bottom: 2px; color: #768390; font-size: 10px; font-weight: 600; }
.dealer-enquiry-info strong { display: block; color: #1e2e3d; font-size: 12px; line-height: 1.3; overflow-wrap: anywhere; }
.dealer-enquiry-date { grid-column: 1 / -1; }

@media (max-width: 620px) {
  .dealer-enquiries-page
    .page-head { margin-bottom: 10px; }
  .dealer-enquiries-page
    .page-head h1 { margin: 3px 0 1px; font-size: 1.45rem; }
  .dealer-enquiries-page
    .page-head p { margin: 3px 0 0; font-size: 10px; }
  .dealer-enquiries-page
    .page-head .eyebrow { font-size: 9px; }
  .dealer-enquiry-list { gap: 8px !important; }
  .dealer-enquiry-card { padding: 11px 12px !important; border-radius: 10px; }
  .dealer-enquiry-card
    .badge { padding: 4px 7px; font-size: 9px; }
  .dealer-enquiry-info { margin-top: 8px; padding-top: 7px; }
  .dealer-enquiry-info span { font-size: 9px; }
  .dealer-enquiry-info strong { font-size: 11px; }
}

/* ===== DEALER NOTIFICATIONS ===== */
.dealer-notification-list { gap: 10px; }
.dealer-notification-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.dealer-notification-content { min-width: 0; }
.dealer-notification-title-row { display: flex; align-items: center; gap: 8px; }
.dealer-notification-title-row strong { color: #1d2a3a; font-size: 14px; }
.dealer-notification-dot { flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: #c28b3b; }
.dealer-notification-card p { margin: 5px 0; color: #566675; font-size: 13px; line-height: 1.45; }
.dealer-notification-card small { color: #85919c; font-size: 10px; }
.dealer-notification-card.unread { background: #fff; border-color: #dde4e9; border-left: 3px solid #c28b3b; }
.dealer-notification-card.is-read { background: #fff; }
.dealer-notification-action { flex: 0 0 auto; }

/* ===== MOBILE ===== */

@media (max-width: 620px) {
  .dealer-notifications-head { flex-direction: row !important; flex-wrap: nowrap !important; align-items: flex-start !important; gap: 8px; margin-bottom: 10px; }
  .dealer-notifications-head
    > div { min-width: 0; }
  .dealer-notifications-head h1 { margin: 3px 0 1px; font-size: 1.45rem; }
  .dealer-notifications-head
    .eyebrow { font-size: 9px; }
  .dealer-notifications-head p { margin: 3px 0 0; font-size: 10px; }
  .dealer-mark-all { min-height: 38px; padding: 7px 9px; font-size: 9px; white-space: nowrap; }
  .dealer-notification-list { gap: 8px !important; }
  .dealer-notification-card { position: relative; display: block !important; padding: 11px 12px !important; border-radius: 10px; }
  .dealer-notification-title-row { gap: 6px; }
  .dealer-notification-title-row strong { font-size: 12px; line-height: 1.3; }
  .dealer-notification-dot { width: 7px; height: 7px; }
  .dealer-notification-card p { margin: 5px 0 4px; font-size: 10px; line-height: 1.4; }
  .dealer-notification-card small { font-size: 9px; }
  .dealer-notification-action { margin-top: 8px; }
  .dealer-notification-action
    .btn { min-height: 34px; padding: 5px 9px; font-size: 9px; }
  .dealer-notification-empty { padding: 26px 15px !important; }
  .dealer-notification-empty h2 { font-size: 1rem; }
}

/* ===== DEALER ACCOUNT / PROFILE ===== */
.dealer-account-section-head { margin-bottom: 14px; }
.dealer-account-section-head h2 { margin: 0; font-size: 1.1rem; }
.dealer-account-section-head p { margin: 3px 0 0; font-size: 12px; }
.dealer-profile-address { margin-top: 4px; }
.dealer-profile-save { display: flex; justify-content: flex-end; }
.dealer-account-security { margin-top: 14px; }
.dealer-account-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.dealer-account-actions form { margin: 0; }
.dealer-logout-btn { color: #8d3c35; border-color: #dab9b5; }

/* ===== DEALER CHANGE PASSWORD ===== */
.dealer-password-page { width: 100%; }
.dealer-password-panel { max-width: 560px; }
.dealer-password-form { width: 100%; }
.dealer-password-submit { width: fit-content; }

/* ===== MOBILE ===== */

@media (max-width: 620px) {
  /* ===== PROFILE HEADER ===== */
  .dealer-account-head { margin-bottom: 10px !important; }
  .dealer-account-head h1,
    .dealer-password-head h1 { margin: 3px 0 1px; font-size: 1.45rem; }
  .dealer-account-head p,
    .dealer-password-head p { margin: 3px 0 0; font-size: 10px; line-height: 1.35; }
  .dealer-account-head .eyebrow,
    .dealer-password-head .eyebrow { font-size: 9px; }

  /* ===== PROFILE CARD ===== */
  .dealer-profile-form { padding: 12px !important; gap: 10px !important; }
  .dealer-account-section-head { margin-bottom: 8px; }
  .dealer-account-section-head h2 { font-size: 13px; }
  .dealer-account-section-head p { font-size: 9px; }
  .dealer-profile-grid {
    display: grid !important;
    grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    gap: 9px 8px !important;
  }
  .dealer-profile-email { grid-column: 1 / -1; }
  .dealer-profile-form
    .field label { margin-bottom: 4px; font-size: 10px; }
  .dealer-profile-form
    .input { min-width: 0; min-height: 43px; padding: 8px 9px; font-size: 11px; }
  .dealer-profile-form
    .input:disabled { color: #53616d; background: #f5f7f8; }
  .dealer-profile-form
    small { font-size: 8px; }
  .dealer-profile-form
    .textarea { min-height: 75px; padding: 9px; font-size: 11px; }
  .dealer-profile-save
    .btn { width: 100%; min-height: 42px; font-size: 11px; }

  /* ===== SECURITY ===== */
  .dealer-account-security { margin-top: 10px; padding: 12px !important; }
  .dealer-account-actions { display: grid; grid-template-columns: repeat(
                2,
                minmax(0, 1fr)
            ); gap: 8px; }
  .dealer-account-actions
    .btn { width: 100%; min-height: 41px; padding: 7px 8px; font-size: 10px; }

  /* ===== CHANGE PASSWORD ===== */
  .dealer-password-head {
    display: flex;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 8px;
    margin-bottom: 10px !important;
  }
  .dealer-password-head
    > div { min-width: 0; }
  .dealer-password-back { flex: 0 0 auto; min-height: 38px; padding: 7px 8px; font-size: 9px; white-space: nowrap; }
  .dealer-password-panel { max-width: none; padding: 12px !important; }
  .dealer-password-form { gap: 10px !important; }
  .dealer-password-form
    .field label { margin-bottom: 4px; font-size: 10px; }
  .dealer-password-form
    .input { min-height: 43px; padding: 8px 9px; font-size: 12px; }
  .dealer-password-form
    .password-toggle { min-width: 53px; padding: 0 9px; font-size: 9px; }
  .dealer-password-submit { width: 100%; min-height: 42px; font-size: 11px; }
}

/* ===== DEALER SIGNED-IN STRIP ===== */
.dealer-strip { padding: 0; background: #f7f8f9; border-bottom: 1px solid #e5e9ec; color: #52606d; }
.dealer-strip-inner { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dealer-signed-user { min-width: 0; display: flex; align-items: center; gap: 9px; }
.dealer-user-icon {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #dce3e8;
  color: #1976b8;
}
.dealer-signed-text { min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.dealer-signed-text small { color: #7b8791; font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.dealer-signed-text strong {
  margin-top: 2px;
  color: #243746;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dealer-approved-label {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 8px;
  border: 1px solid #d9e5dc;
  border-radius: 999px;
  background: #fff;
  color: #56705f;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}
.dealer-approved-dot { width: 6px; height: 6px; border-radius: 50%; background: #6e9478; }

/* ===== MOBILE ===== */

@media (max-width: 620px) {
  .dealer-strip-inner { min-height: 43px; gap: 8px; }
  .dealer-user-icon { flex-basis: 28px; width: 28px; height: 28px; }
  .dealer-user-icon svg { width: 14px; height: 14px; }
  .dealer-signed-text small { font-size: 7px; }
  .dealer-signed-text strong { max-width: 170px; font-size: 10px; }
  .dealer-approved-label { padding: 4px 6px; font-size: 8px; }
  .dealer-approved-dot { width: 5px; height: 5px; }
}


/* =========================================================
   INR PRICE READABILITY
   ========================================================= */

.inr-price-helper {
    margin-top: 5px;

    min-height: 17px;

    color: #657481;

    font-size: 11px;

    line-height: 1.35;
}

.inr-price-helper strong {
    color: #1976b8;

    font-weight: 800;
}

.inr-price-helper span {
    color: #53616d;

    font-weight: 600;
}

.inr-price-helper[hidden] {
    display: none;
}

@media (max-width: 620px) {

    .inr-price-helper {
        margin-top: 4px;

        font-size: 9px;
    }

}


/* Homepage price helper alignment */

@media (min-width: 621px) {

    .hp-control-price {
        position: relative;
    }

    .hp-control-price .inr-price-helper {
        position: absolute;

        left: 0;
        top: 100%;

        margin-top: 4px;

        white-space: nowrap;
    }

    .hp-search-fields {
        margin-bottom: 18px;
    }

}


/* =========================================================
   ABOUT PAGE
   ========================================================= */

.about-page {
    --about-navy: #14273b;
    --about-navy-soft: #20384f;
    --about-gold: #c69b5b;
    --about-gold-soft: #e8d1ad;
    --about-text: #1c2d3c;
    --about-muted: #697784;
    --about-border: #e4e8eb;
    --about-bg: #f7f8f8;

    overflow: hidden;
    background: #fff;
    color: var(--about-text);
}

.about-page * {
    box-sizing: border-box;
}

.about-container {
    width: min(1180px, calc(100% - 40px));
    margin-inline: auto;
}

.about-page h1,
.about-page h2,
.about-page h3,
.about-page p {
    margin-top: 0;
}

.about-page h1,
.about-page h2,
.about-page h3 {
    letter-spacing: -.035em;
}

.about-kicker {
    display: inline-block;
    margin-bottom: 15px;

    color: #9c7137;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
}

.about-kicker-light {
    color: #e4bd82;
}


/* HERO */

.about-hero {
    position: relative;
    padding: 95px 0 90px;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(198, 155, 91, .14),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #f8fafb 0%,
            #ffffff 52%,
            #f6f3ed 100%
        );

    border-bottom: 1px solid var(--about-border);
}

.about-hero::before {
    content: "";

    position: absolute;
    width: 360px;
    height: 360px;

    right: -190px;
    bottom: -190px;

    border: 1px solid rgba(20, 39, 59, .08);
    border-radius: 50%;
}

.about-hero-grid {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(0, 1.1fr)
        minmax(340px, .72fr);

    align-items: center;

    gap: 85px;
}

.about-hero-content {
    max-width: 690px;
}

.about-hero h1 {
    max-width: 680px;

    margin-bottom: 24px;

    color: var(--about-navy);

    font-size: clamp(42px, 5vw, 72px);
    font-weight: 780;
    line-height: 1.02;
}

.about-hero h1 em {
    display: block;

    color: #b58749;

    font-family: Georgia, serif;
    font-weight: 500;
}

.about-hero-lead {
    max-width: 650px;

    margin-bottom: 17px;

    color: #33495c;

    font-size: 19px;
    font-weight: 600;
    line-height: 1.65;
}

.about-hero-text {
    max-width: 620px;

    color: var(--about-muted);

    font-size: 15px;
    line-height: 1.8;
}

.about-hero-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 11px;

    margin-top: 32px;
}


/* BUTTONS */

.about-btn {
    min-height: 51px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    padding: 12px 21px;

    border: 1px solid transparent;
    border-radius: 8px;

    font-size: 13px;
    font-weight: 750;

    text-decoration: none;

    transition:
        transform .18s ease,
        background .18s ease,
        border-color .18s ease;
}

.about-btn:hover {
    transform: translateY(-2px);
}

.about-btn-primary {
    background: var(--about-navy);
    border-color: var(--about-navy);

    color: #fff;
}

.about-btn-primary:hover {
    background: #203b55;

    color: #fff;
}

.about-btn-secondary {
    background: rgba(255, 255, 255, .7);
    border-color: #d7dde2;

    color: var(--about-navy);
}

.about-btn-secondary:hover {
    border-color: #ba925b;

    color: var(--about-navy);
}

/* HERO RIGHT PANEL */

.about-simple-card {
    position: relative;

    padding: 38px 36px;

    border: 1px solid #e1e5e8;
    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f7f8f8
        );

    box-shadow:
        0 22px 55px
        rgba(20, 39, 59, .08);
}

.about-simple-card::before {
    content: "";

    display: block;

    width: 48px;
    height: 3px;

    margin-bottom: 24px;

    border-radius: 999px;

    background: #c69b5b;
}

.about-simple-label {
    display: block;

    margin-bottom: 13px;

    color: #9b713a;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: .16em;
}

.about-simple-card h2 {
    margin-bottom: 17px;

    color: #14273b;

    font-size: 30px;
    font-weight: 760;

    line-height: 1.18;
}

.about-simple-card > p {
    margin-bottom: 27px;

    color: #697784;

    font-size: 13px;

    line-height: 1.8;
}

.about-simple-points {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
}

.about-simple-points div {
    min-height: 72px;

    display: flex;
    flex-direction: column;

    justify-content: center;

    gap: 5px;

    padding: 13px 14px;

    border: 1px solid #e5e9ec;
    border-radius: 9px;

    background: #fff;
}

.about-simple-points span {
    color: #b4874c;

    font-size: 9px;
    font-weight: 800;
}

.about-simple-points strong {
    color: #20384f;

    font-size: 12px;
    font-weight: 750;
}

/* GLOBAL SECTION */

.about-section {
    padding: 92px 0;
}

.about-section h2 {
    color: var(--about-navy);

    font-size: clamp(32px, 4vw, 50px);
    font-weight: 760;
    line-height: 1.12;
}

.about-section h2 span {
    color: #b28345;
}


/* PURPOSE */

.about-purpose {
    background: #fff;
}

.about-purpose-grid {
    display: grid;

    grid-template-columns:
        minmax(0, .85fr)
        minmax(0, 1fr);

    gap: 90px;
}

.about-purpose h2 {
    max-width: 470px;

    margin-bottom: 0;
}

.about-purpose-copy {
    padding-top: 30px;
}

.about-purpose-copy p {
    margin-bottom: 20px;

    color: #596977;

    font-size: 16px;
    line-height: 1.9;
}


/* SECTION HEADING */

.about-section-heading {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(270px, 420px);

    align-items: end;

    gap: 60px;

    margin-bottom: 45px;
}

.about-section-heading h2 {
    max-width: 650px;

    margin-bottom: 0;
}

.about-section-heading > p {
    margin-bottom: 8px;

    color: var(--about-muted);

    font-size: 14px;
    line-height: 1.8;
}


/* PRINCIPLES */

.about-principles {
    background: var(--about-bg);
}

.about-principle-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 16px;
}

.about-principle-card {
    position: relative;

    min-height: 335px;

    padding: 30px 28px;

    border: 1px solid var(--about-border);
    border-radius: 14px;

    background: #fff;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}

.about-principle-card:hover {
    transform: translateY(-4px);

    border-color: #d6bf9d;

    box-shadow:
        0 18px 45px rgba(20, 39, 59, .07);
}

.about-icon {
    width: 45px;
    height: 45px;

    display: grid;

    place-items: center;

    margin-bottom: 47px;

    border: 1px solid #e3d2b8;
    border-radius: 10px;

    background: #fbf6ef;

    color: #9d7139;
}

.about-icon svg {
    width: 23px;
    height: 23px;

    fill: none;
    stroke: currentColor;

    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.6;
}

.about-card-number {
    position: absolute;

    top: 30px;
    right: 28px;

    color: #a5afb7;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
}

.about-principle-card h3 {
    margin-bottom: 14px;

    color: var(--about-navy);

    font-size: 21px;
    font-weight: 750;
}

.about-principle-card p {
    margin-bottom: 0;

    color: var(--about-muted);

    font-size: 13px;
    line-height: 1.8;
}


/* HOW IT WORKS */

.about-work {
    background: #fff;
}

.about-work-grid {
    display: grid;

    grid-template-columns:
        minmax(0, .75fr)
        minmax(0, 1.25fr);

    gap: 100px;
}

.about-work-intro {
    align-self: start;

    position: sticky;
    top: 150px;
}

.about-work-intro h2 {
    max-width: 420px;
}

.about-work-intro > p {
    max-width: 430px;

    color: var(--about-muted);

    font-size: 14px;
    line-height: 1.8;
}

.about-text-link {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #8d652e;

    font-size: 13px;
    font-weight: 750;

    text-decoration: none;
}

.about-text-link:hover {
    color: var(--about-navy);
}

.about-steps {
    border-top: 1px solid var(--about-border);
}

.about-step {
    display: grid;

    grid-template-columns: 55px 1fr;

    gap: 22px;

    padding: 27px 0;

    border-bottom: 1px solid var(--about-border);
}

.about-step > span {
    color: #b18345;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
}

.about-step h3 {
    margin-bottom: 8px;

    color: var(--about-navy);

    font-size: 19px;
    font-weight: 750;
}

.about-step p {
    max-width: 600px;

    margin-bottom: 0;

    color: var(--about-muted);

    font-size: 13px;
    line-height: 1.75;
}


/* TRUST BAND */

.about-trust {
    position: relative;

    padding: 88px 0;

    overflow: hidden;

    background: var(--about-navy);

    color: #fff;
}

.about-trust::after {
    content: "D2D";

    position: absolute;

    right: -40px;
    bottom: -90px;

    color: rgba(255, 255, 255, .025);

    font-size: 230px;
    font-weight: 850;
    letter-spacing: -.1em;

    pointer-events: none;
}

.about-trust-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(310px, .8fr);

    align-items: center;

    gap: 100px;
}

.about-trust h2 {
    max-width: 650px;

    margin-bottom: 20px;

    color: #fff;

    font-size: clamp(36px, 4vw, 54px);
    font-weight: 760;
    line-height: 1.1;
}

.about-trust h2 em {
    display: block;

    color: #ddb477;

    font-family: Georgia, serif;
    font-weight: 400;
}

.about-trust p {
    max-width: 680px;

    margin-bottom: 0;

    color: #aebdcc;

    font-size: 14px;
    line-height: 1.85;
}

.about-trust-points {
    display: grid;

    gap: 10px;
}

.about-trust-points > div {
    min-height: 53px;

    display: flex;

    align-items: center;

    gap: 12px;

    padding: 11px 15px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 8px;

    background: rgba(255, 255, 255, .035);

    color: #d7e0e8;

    font-size: 12px;
    font-weight: 650;
}

.about-trust-points span {
    width: 25px;
    height: 25px;

    display: grid;

    flex: 0 0 auto;

    place-items: center;

    border-radius: 50%;

    background: rgba(209, 167, 104, .12);

    color: #e0b879;
}


/* COVERAGE */

.about-coverage {
    background: #fff;
}

.about-city-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 13px;
}

.about-city-grid article {
    min-height: 175px;

    display: flex;
    flex-direction: column;

    justify-content: flex-end;

    padding: 24px;

    border: 1px solid var(--about-border);
    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f7f8f8
        );
}

.about-city-grid small {
    margin-bottom: auto;

    color: #ae8450;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
}

.about-city-grid strong {
    margin-bottom: 7px;

    color: var(--about-navy);

    font-size: 22px;
}

.about-city-grid span {
    color: var(--about-muted);

    font-size: 12px;
    line-height: 1.5;
}


/* FINAL CTA */

.about-final {
    padding: 0 0 90px;

    background: #fff;
}

.about-final-card {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 70px;

    padding: 48px 52px;

    border: 1px solid #e5e0d7;
    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            #f8f6f1,
            #fff
        );
}

.about-final-card h2 {
    max-width: 680px;

    margin-bottom: 12px;

    color: var(--about-navy);

    font-size: clamp(30px, 3.5vw, 46px);
    font-weight: 760;
    line-height: 1.12;
}

.about-final-card p {
    margin-bottom: 0;

    color: var(--about-muted);

    font-size: 13px;
}

.about-final-actions {
    flex: 0 0 auto;

    display: flex;
    flex-direction: column;

    align-items: flex-start;

    gap: 16px;
}


/* TABLET */

@media (max-width: 900px) {

    .about-hero {
        padding:
            70px 0;
    }

    .about-hero-grid,
    .about-purpose-grid,
    .about-work-grid,
    .about-trust-grid {
        grid-template-columns: 1fr;

        gap: 48px;
    }

    .about-network-card {
        width: min(100%, 520px);

        min-height: 390px;
    }

    .about-purpose-copy {
        padding-top: 0;
    }

    .about-section-heading {
        grid-template-columns: 1fr;

        gap: 15px;
    }

    .about-principle-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .about-principle-card:last-child {
        grid-column: 1 / -1;
    }

    .about-work-intro {
        position: static;
    }

    .about-trust-grid {
        gap: 40px;
    }

    .about-city-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .about-city-grid article:last-child {
        grid-column: 1 / -1;
    }

    .about-final-card {
        align-items: flex-start;
        flex-direction: column;

        gap: 30px;
    }

}


/* MOBILE */

@media (max-width: 620px) {
.about-simple-card {
    padding: 24px 20px;

    border-radius: 14px;
}

.about-simple-card h2 {
    font-size: 24px;
}

.about-simple-card > p {
    font-size: 12px;
    line-height: 1.7;
}

.about-simple-points {
    gap: 7px;
}

.about-simple-points div {
    min-height: 63px;

    padding: 10px;
}

.about-simple-points strong {
    font-size: 10px;
}
    .about-container {
        width:
            calc(100% - 30px);
    }


    .about-hero {
        padding:
            48px 0 42px;
    }


    .about-kicker {
        margin-bottom: 10px;

        font-size: 9px;
    }


    .about-hero h1 {
        margin-bottom: 18px;

        font-size: 39px;
        line-height: 1.04;
    }


    .about-hero-lead {
        margin-bottom: 12px;

        font-size: 15px;
        line-height: 1.55;
    }


    .about-hero-text {
        font-size: 12px;
        line-height: 1.7;
    }


    .about-hero-actions {
        display: grid;

        grid-template-columns: 1fr;

        margin-top: 23px;
    }


    .about-btn {
        width: 100%;

        min-height: 47px;

        font-size: 12px;
    }


    .about-network-card {
        min-height: 335px;

        padding: 18px;

        border-radius: 16px;
    }


    .about-network-ring {
        width: 160px;
        height: 160px;

        box-shadow:
            0 0 0 20px rgba(255, 255, 255, .025),
            0 0 0 39px rgba(255, 255, 255, .015);
    }


    .about-network-core strong {
        font-size: 39px;
    }


    .about-network-cities {
        gap: 5px;
    }


    .about-network-cities span {
        padding: 7px 3px;

        font-size: 7px;
    }


    .about-section {
        padding:
            55px 0;
    }


    .about-section h2 {
        font-size: 31px;
        line-height: 1.13;
    }


    .about-purpose-grid {
        gap: 22px;
    }


    .about-purpose-copy p {
        margin-bottom: 13px;

        font-size: 13px;
        line-height: 1.75;
    }


    .about-section-heading {
        margin-bottom: 26px;
    }


    .about-section-heading > p {
        font-size: 12px;
        line-height: 1.7;
    }


    .about-principle-grid {
        grid-template-columns: 1fr;

        gap: 10px;
    }


    .about-principle-card,
    .about-principle-card:last-child {
        grid-column: auto;

        min-height: 0;

        padding: 21px 20px;
    }


    .about-icon {
        width: 39px;
        height: 39px;

        margin-bottom: 28px;
    }


    .about-icon svg {
        width: 20px;
        height: 20px;
    }


    .about-card-number {
        top: 22px;
        right: 20px;
    }


    .about-principle-card h3 {
        margin-bottom: 8px;

        font-size: 18px;
    }


    .about-principle-card p {
        font-size: 12px;
        line-height: 1.7;
    }


    .about-work-grid {
        gap: 28px;
    }


    .about-work-intro > p {
        font-size: 12px;
        line-height: 1.7;
    }


    .about-step {
        grid-template-columns:
            38px 1fr;

        gap: 10px;

        padding: 20px 0;
    }


    .about-step h3 {
        margin-bottom: 5px;

        font-size: 16px;
    }


    .about-step p {
        font-size: 11px;
        line-height: 1.65;
    }


    .about-trust {
        padding:
            57px 0;
    }


    .about-trust-grid {
        gap: 28px;
    }


    .about-trust h2 {
        margin-bottom: 15px;

        font-size: 32px;
    }


    .about-trust p {
        font-size: 12px;
        line-height: 1.7;
    }


    .about-trust-points {
        gap: 7px;
    }


    .about-trust-points > div {
        min-height: 47px;

        padding: 9px 11px;

        font-size: 11px;
    }


    .about-city-grid {
        grid-template-columns: 1fr;

        gap: 8px;
    }


    .about-city-grid article,
    .about-city-grid article:last-child {
        grid-column: auto;

        min-height: 130px;

        padding: 18px;
    }


    .about-city-grid strong {
        font-size: 19px;
    }


    .about-final {
        padding-bottom: 55px;
    }


    .about-final-card {
        padding: 28px 21px;

        gap: 24px;

        border-radius: 14px;
    }


    .about-final-card h2 {
        font-size: 29px;
    }


    .about-final-card p {
        font-size: 12px;
        line-height: 1.6;
    }


    .about-final-actions {
        width: 100%;
    }

}


/* =========================================================
   CONTACT PAGE
   ========================================================= */

.contact-page {
    --contact-navy: #14273b;
    --contact-navy-soft: #20384f;
    --contact-gold: #c69b5b;
    --contact-text: #1c2d3c;
    --contact-muted: #697784;
    --contact-border: #e3e8eb;
    --contact-bg: #f7f8f8;

    overflow: hidden;

    background: #fff;

    color: var(--contact-text);
}

.contact-page * {
    box-sizing: border-box;
}

.contact-container {
    width:
        min(
            1180px,
            calc(100% - 40px)
        );

    margin-inline: auto;
}

.contact-page h1,
.contact-page h2,
.contact-page h3,
.contact-page p {
    margin-top: 0;
}

.contact-page h1,
.contact-page h2,
.contact-page h3 {
    letter-spacing: -.035em;
}


/* KICKER */

.contact-kicker {
    display: inline-block;

    margin-bottom: 14px;

    color: #9c7137;

    font-size: 10px;
    font-weight: 800;

    letter-spacing: .18em;
}

.contact-kicker-light {
    color: #e1b97d;
}


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

.contact-hero {
    position: relative;

    padding:
        82px 0 90px;

    background:
        radial-gradient(
            circle at 8% 18%,
            rgba(198, 155, 91, .10),
            transparent 24%
        ),
        linear-gradient(
            135deg,
            #ffffff,
            #f8f8f6
        );

    border-bottom:
        1px solid var(--contact-border);
}

.contact-hero::after {
    content: "";

    position: absolute;

    width: 450px;
    height: 450px;

    right: -240px;
    top: -220px;

    border:
        1px solid rgba(20, 39, 59, .07);

    border-radius: 50%;
}

.contact-hero-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, .92fr)
        minmax(400px, .78fr);

    align-items: center;

    gap: 90px;
}


/* HERO COPY */

.contact-hero-copy {
    max-width: 650px;
}

.contact-hero h1 {
    margin-bottom: 24px;

    color: var(--contact-navy);

    font-size:
        clamp(
            42px,
            5vw,
            70px
        );

    font-weight: 780;

    line-height: 1.02;
}

.contact-hero h1 em {
    display: block;

    color: #b58749;

    font-family:
        Georgia,
        serif;

    font-weight: 500;
}

.contact-hero-lead {
    max-width: 600px;

    margin-bottom: 15px;

    color: #33495c;

    font-size: 18px;
    font-weight: 600;

    line-height: 1.65;
}

.contact-hero-text {
    max-width: 570px;

    margin-bottom: 0;

    color: var(--contact-muted);

    font-size: 14px;

    line-height: 1.8;
}


/* DIRECT CONTACT */

.contact-direct-grid {
    display: grid;

    grid-template-columns: 1fr;

    gap: 9px;

    margin-top: 31px;
}

.contact-direct-card {
    min-width: 0;

    display: grid;

    grid-template-columns:
        42px
        minmax(0, 1fr)
        auto;

    align-items: center;

    gap: 13px;

    min-height: 69px;

    padding:
        11px 14px;

    border:
        1px solid #dfe5e9;

    border-radius: 10px;

    background:
        rgba(
            255,
            255,
            255,
            .78
        );

    color:
        var(--contact-navy);

    text-decoration: none;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.contact-direct-card:hover {
    transform:
        translateY(-2px);

    border-color:
        #d7bc95;

    box-shadow:
        0 12px 28px
        rgba(20, 39, 59, .07);

    color:
        var(--contact-navy);
}

.contact-direct-icon {
    width: 42px;
    height: 42px;

    display: grid;

    place-items: center;

    border-radius: 9px;

    background: #fbf5ec;

    color: #a97738;
}

.contact-direct-icon svg {
    width: 21px;
    height: 21px;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.contact-direct-card > span:nth-child(2) {
    min-width: 0;

    display: flex;
    flex-direction: column;

    gap: 2px;
}

.contact-direct-card small {
    color: #87939d;

    font-size: 8px;
    font-weight: 800;

    letter-spacing: .12em;
}

.contact-direct-card strong {
    overflow: hidden;

    color: var(--contact-navy);

    font-size: 13px;
    font-weight: 750;

    text-overflow: ellipsis;
}

.contact-direct-card b {
    color: #b38346;

    font-size: 14px;
}


/* =========================================================
   CONTACT FORM
   ========================================================= */

.contact-form-card {
    padding:
        34px 34px 30px;

    border:
        1px solid #e0e5e8;

    border-radius: 18px;

    background: #fff;

    box-shadow:
        0 25px 65px
        rgba(20, 39, 59, .10);
}

.contact-form-head {
    padding-bottom: 22px;

    border-bottom:
        1px solid #edf0f2;
}

.contact-form-head > span {
    display: block;

    margin-bottom: 7px;

    color: #a8793e;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: .15em;
}

.contact-form-head h2 {
    margin-bottom: 8px;

    color: var(--contact-navy);

    font-size: 29px;
    font-weight: 760;
}

.contact-form-head p {
    margin-bottom: 0;

    color: var(--contact-muted);

    font-size: 12px;

    line-height: 1.7;
}

.contact-form {
    display: grid;

    gap: 17px;

    padding-top: 23px;
}

.contact-field {
    min-width: 0;
}

.contact-field label {
    display: block;

    margin-bottom: 7px;

    color: #334657;

    font-size: 11px;
    font-weight: 750;
}

.contact-field label span {
    color: #b34840;
}

.contact-form .input,
.contact-form .textarea {
    width: 100%;

    border:
        1px solid #d9e0e5;

    border-radius: 8px;

    background: #fbfcfc;

    color: #243746;

    outline: none;

    font-family: inherit;

    transition:
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

.contact-form .input {
    min-height: 48px;

    padding:
        9px 12px;

    font-size: 13px;
}

.contact-form .textarea {
    min-height: 135px;

    padding: 12px;

    resize: vertical;

    font-size: 13px;

    line-height: 1.6;
}

.contact-form .input:focus,
.contact-form .textarea:focus {
    border-color:
        #bd935d;

    background: #fff;

    box-shadow:
        0 0 0 3px
        rgba(198, 155, 91, .11);
}

.contact-field small {
    display: block;

    margin-top: 6px;

    color: #8a949d;

    font-size: 9px;

    line-height: 1.5;
}

.contact-submit {
    min-height: 50px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 15px;

    padding:
        11px 17px;

    border: 0;
    border-radius: 8px;

    background:
        var(--contact-navy);

    color: #fff;

    font-family: inherit;

    font-size: 12px;
    font-weight: 750;

    cursor: pointer;

    transition:
        background .18s ease,
        transform .18s ease;
}

.contact-submit:hover {
    background:
        #203b55;

    transform:
        translateY(-1px);
}

.contact-submit span {
    color:
        #dbb57e;

    font-size: 17px;
}

.contact-form-note {
    margin-bottom: 0;

    color: #8a949d;

    font-size: 9px;

    line-height: 1.55;
}


/* SUCCESS */

.contact-success {
    display: flex;

    gap: 12px;

    margin-top: 20px;

    padding: 14px;

    border:
        1px solid #cce5d5;

    border-radius: 9px;

    background: #f1faf4;
}

.contact-success > span {
    flex: 0 0 28px;

    width: 28px;
    height: 28px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background: #dcefe3;

    color: #317247;

    font-weight: 800;
}

.contact-success strong {
    display: block;

    margin-bottom: 3px;

    color: #285e3a;

    font-size: 12px;
}

.contact-success p {
    margin: 0;

    color: #557261;

    font-size: 10px;

    line-height: 1.5;
}


/* ERRORS */

.contact-errors {
    margin-top: 20px;

    padding: 14px;

    border:
        1px solid #efc4c0;

    border-radius: 9px;

    background: #fff6f5;

    color: #8c3932;

    font-size: 11px;
}

.contact-errors strong {
    display: block;

    margin-bottom: 6px;
}

.contact-errors ul {
    margin:
        0;

    padding-left: 17px;
}


/* =========================================================
   HELP SECTION
   ========================================================= */

.contact-help {
    padding:
        88px 0;

    background:
        var(--contact-bg);
}

.contact-section-head {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(280px, 420px);

    align-items: end;

    gap: 55px;

    margin-bottom: 42px;
}

.contact-section-head h2 {
    margin-bottom: 0;

    color: var(--contact-navy);

    font-size:
        clamp(
            31px,
            4vw,
            48px
        );

    font-weight: 760;

    line-height: 1.12;
}

.contact-section-head h2 span {
    color: #b38446;
}

.contact-section-head > p {
    margin-bottom: 4px;

    color: var(--contact-muted);

    font-size: 13px;

    line-height: 1.75;
}

.contact-help-grid {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 14px;
}

.contact-help-grid article {
    position: relative;

    min-height: 310px;

    display: flex;
    flex-direction: column;

    padding: 28px;

    border:
        1px solid var(--contact-border);

    border-radius: 13px;

    background: #fff;
}

.contact-help-number {
    position: absolute;

    top: 27px;
    right: 27px;

    color: #a5afb7;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: .12em;
}

.contact-help-icon {
    width: 43px;
    height: 43px;

    display: grid;

    place-items: center;

    margin-bottom: 42px;

    border:
        1px solid #e4d2b7;

    border-radius: 9px;

    background: #fbf6ef;

    color: #a4763b;
}

.contact-help-icon svg {
    width: 22px;
    height: 22px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.6;

    stroke-linecap: round;
    stroke-linejoin: round;
}

.contact-help-grid h3 {
    margin-bottom: 10px;

    color: var(--contact-navy);

    font-size: 19px;
    font-weight: 750;
}

.contact-help-grid p {
    margin-bottom: 23px;

    color: var(--contact-muted);

    font-size: 12px;

    line-height: 1.75;
}

.contact-help-grid a {
    margin-top: auto;

    color: #93682f;

    font-size: 11px;
    font-weight: 750;

    text-decoration: none;
}

.contact-help-grid a:hover {
    color:
        var(--contact-navy);
}


/* =========================================================
   TRICITY BAND
   ========================================================= */

.contact-tricity {
    position: relative;

    padding:
        75px 0;

    overflow: hidden;

    background:
        var(--contact-navy);

    color: #fff;
}

.contact-tricity::after {
    content: "";

    position: absolute;

    width: 400px;
    height: 400px;

    right: -190px;
    top: -190px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .06
        );

    border-radius: 50%;
}

.contact-tricity-inner {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(300px, .8fr);

    align-items: center;

    gap: 80px;
}

.contact-tricity h2 {
    max-width: 650px;

    margin-bottom: 16px;

    color: #fff;

    font-size:
        clamp(
            33px,
            4vw,
            49px
        );

    font-weight: 760;

    line-height: 1.1;
}

.contact-tricity h2 em {
    display: block;

    color: #dfb578;

    font-family:
        Georgia,
        serif;

    font-weight: 400;
}

.contact-tricity p {
    max-width: 620px;

    margin-bottom: 0;

    color: #aebdca;

    font-size: 13px;

    line-height: 1.8;
}

.contact-city-list {
    display: grid;

    gap: 8px;
}

.contact-city-list span {
    min-height: 49px;

    display: flex;

    align-items: center;

    padding:
        10px 15px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .10
        );

    border-radius: 8px;

    background:
        rgba(
            255,
            255,
            255,
            .035
        );

    color: #d7e0e8;

    font-size: 12px;
    font-weight: 650;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .contact-hero-grid {
        grid-template-columns:
            1fr;

        gap: 48px;
    }

    .contact-form-card {
        width:
            min(
                100%,
                620px
            );
    }

    .contact-section-head {
        grid-template-columns:
            1fr;

        gap: 12px;
    }

    .contact-help-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .contact-help-grid article:last-child {
        grid-column:
            1 / -1;
    }

    .contact-tricity-inner {
        grid-template-columns:
            1fr;

        gap: 35px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 620px) {

    .contact-container {
        width:
            calc(
                100% - 30px
            );
    }


    .contact-hero {
        padding:
            48px 0 52px;
    }


    .contact-hero-grid {
        gap: 33px;
    }


    .contact-kicker {
        margin-bottom: 10px;

        font-size: 8px;
    }


    .contact-hero h1 {
        margin-bottom: 17px;

        font-size: 39px;

        line-height: 1.04;
    }


    .contact-hero-lead {
        margin-bottom: 11px;

        font-size: 14px;

        line-height: 1.55;
    }


    .contact-hero-text {
        font-size: 11px;

        line-height: 1.7;
    }


    .contact-direct-grid {
        margin-top: 22px;
    }


    .contact-direct-card {
        grid-template-columns:
            37px
            minmax(0, 1fr)
            auto;

        min-height: 61px;

        padding:
            9px 11px;

        gap: 9px;
    }


    .contact-direct-icon {
        width: 37px;
        height: 37px;
    }


    .contact-direct-icon svg {
        width: 18px;
        height: 18px;
    }


    .contact-direct-card strong {
        font-size: 11px;

        overflow-wrap: anywhere;
    }


    .contact-form-card {
        padding:
            24px 18px 21px;

        border-radius: 14px;
    }


    .contact-form-head {
        padding-bottom: 17px;
    }


    .contact-form-head h2 {
        font-size: 25px;
    }


    .contact-form-head p {
        font-size: 11px;
    }


    .contact-form {
        gap: 14px;

        padding-top: 18px;
    }


    .contact-field label {
        margin-bottom: 5px;

        font-size: 10px;
    }


    .contact-form .input {
        min-height: 45px;

        padding:
            8px 10px;

        font-size: 12px;
    }


    .contact-form .textarea {
        min-height: 115px;

        padding: 10px;

        font-size: 12px;
    }


    .contact-submit {
        min-height: 46px;

        font-size: 11px;
    }


    .contact-help {
        padding:
            55px 0;
    }


    .contact-section-head {
        margin-bottom: 25px;
    }


    .contact-section-head h2 {
        font-size: 30px;
    }


    .contact-section-head > p {
        font-size: 11px;

        line-height: 1.7;
    }


    .contact-help-grid {
        grid-template-columns:
            1fr;

        gap: 9px;
    }


    .contact-help-grid article,
    .contact-help-grid article:last-child {
        grid-column: auto;

        min-height: 0;

        padding: 20px;
    }


    .contact-help-number {
        top: 21px;
        right: 20px;
    }


    .contact-help-icon {
        width: 38px;
        height: 38px;

        margin-bottom: 25px;
    }


    .contact-help-icon svg {
        width: 19px;
        height: 19px;
    }


    .contact-help-grid h3 {
        margin-bottom: 7px;

        font-size: 17px;
    }


    .contact-help-grid p {
        margin-bottom: 16px;

        font-size: 11px;

        line-height: 1.65;
    }


    .contact-tricity {
        padding:
            55px 0;
    }


    .contact-tricity-inner {
        gap: 26px;
    }


    .contact-tricity h2 {
        margin-bottom: 13px;

        font-size: 31px;
    }


    .contact-tricity p {
        font-size: 11px;

        line-height: 1.7;
    }


    .contact-city-list {
        gap: 6px;
    }


    .contact-city-list span {
        min-height: 44px;

        padding:
            8px 12px;

        font-size: 11px;
    }

}


/* =========================================================
   ADMIN CONTACT MESSAGES
   ========================================================= */

.contact-messages-head {
    align-items: center;
}

.contact-message-count {
    display: inline-flex;
    align-items: center;

    padding: 6px 10px;

    border: 1px solid #ead8b8;
    border-radius: 999px;

    background: #fff8eb;

    color: #95681f;

    font-size: 11px;
    font-weight: 800;
}

.contact-message-table
.contact-message-row-new {
    background: #fffdf8;
}

.contact-message-text {
    max-width: 420px;
}

.contact-message-text summary {
    color: #334155;

    cursor: pointer;

    font-size: 12px;
}

.contact-message-text p {
    margin: 10px 0 0;

    white-space: normal;

    color: #586675;

    font-size: 12px;
    line-height: 1.6;
}

.contact-status-new,
.contact-status-read {
    display: inline-flex;

    padding: 4px 8px;

    border-radius: 999px;

    font-size: 9px;
    font-weight: 800;
}

.contact-status-new {
    background: #fff2d5;
    color: #8a5a00;
}

.contact-status-read {
    background: #eef2f5;
    color: #64717d;
}


/* MOBILE */

.contact-message-cards {
    gap: 8px;
}

.contact-message-card {
    padding: 13px;
}

.contact-message-card.is-new {
    border-left: 3px solid #c28b3b;

    background: #fffdf9;
}

.contact-message-card-top,
.contact-message-card-bottom {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 10px;
}

.contact-message-card-top > div {
    min-width: 0;
}

.contact-message-card-top strong {
    display: block;

    color: #1f3045;

    font-size: 13px;
}

.contact-message-card-top a {
    display: block;

    margin-top: 3px;

    color: #1976b8;

    font-size: 11px;
}

.contact-message-body {
    margin: 12px 0;

    padding: 10px 0;

    border-top: 1px solid #edf0f2;
    border-bottom: 1px solid #edf0f2;

    color: #53616d;

    font-size: 11px;
    line-height: 1.6;

    overflow-wrap: anywhere;
}

.contact-message-card-bottom small {
    color: #87929c;

    font-size: 9px;
}

@media (max-width: 620px) {

    .contact-messages-head {
        flex-direction: row !important;
        flex-wrap: nowrap !important;

        align-items: flex-start !important;

        gap: 8px;
    }

    .contact-messages-head h1 {
        margin: 3px 0 1px;

        font-size: 1.4rem;
    }

    .contact-messages-head p {
        font-size: 10px;
    }

    .contact-message-count {
        flex: 0 0 auto;

        padding: 5px 7px;

        font-size: 8px;
    }

    .contact-message-card-bottom .btn {
        min-height: 34px;

        padding: 5px 8px;

        font-size: 9px;
    }

}



/* ===== ADMIN AVAILABILITY VERIFICATION - MOBILE ===== */

@media (max-width: 620px) {

    .admin-verification-page {
        width: 100%;
        min-width: 0;
    }

    .admin-verification-page > .panel {
        padding: 12px;
        border-radius: 10px;
        min-width: 0;
    }

    /* Property details on left, Open button on right */
    .admin-verification-page .page-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 8px;
        margin-bottom: 12px;
    }

    .admin-verification-page .page-head > div {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .admin-verification-page .page-head strong {
        font-size: 14px;
    }

    .admin-verification-page .page-head p {
        margin: 4px 0;
        font-size: 11px;
        line-height: 1.45;
        overflow-wrap: anywhere;
    }

    .admin-verification-page .page-head > a.btn {
        min-height: 36px;
        padding: 7px 11px;
        font-size: 12px;
        white-space: nowrap;
    }

    /* Verification form */
    .admin-verification-page form.grid.grid-3 {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
    }

    .admin-verification-page form .select,
    .admin-verification-page form .input {
        width: 100%;
        min-width: 0;
        min-height: 43px;
        padding: 8px 10px;
        font-size: 13px;
    }

    .admin-verification-page form .btn {
        width: 100%;
        min-height: 43px;
        font-size: 13px;
    }

}

/* Custom Facing / BHK inputs */
.d2d-suggestion-input-hidden {
    display: none !important;
}

/* Mobile property form - prevent iPhone input auto-zoom */
@media (max-width: 767px) {

    form.property-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
    form.property-form select,
    form.property-form textarea,
    form.property-form .d2d-search-select-search input {
        font-size: 16px !important;
    }

    form.property-form .d2d-search-select-value {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

}


/* ==========================================
   PREMIUM HOMEPAGE HERO - FINAL REFINEMENT
========================================== */

/* Reduce banner height */
.hp-hero .hp-slideshow,
.hp-hero .hp-hero-slide,
.hp-hero .hp-slide-inner {
    min-height: 575px;
}

/* Better content positioning */
.hp-hero .hp-slide-inner {
    padding: 42px 0 105px;
}

/* Control headline width */
.hp-hero .hp-hero-copy {
    width: 100%;
    max-width: 625px;
}

/* Premium readable headline */
.hp-hero .hp-hero-copy h1 {
    max-width: 625px;
    font-size: clamp(2.8rem, 4.1vw, 4rem);
    line-height: 1.26;
    letter-spacing: -0.035em;
    margin: 17px 0;
    text-wrap: balance;
}

/* Description */
.hp-hero .hp-hero-copy > p {
    max-width: 550px;
    font-size: 1rem;
    line-height: 1.55;
    margin-bottom: 22px;
}

/* Dark left, visible building on right */
.hp-hero .hp-hero-shade {
    background: linear-gradient(
        90deg,
        rgba(6, 15, 27, 0.88) 0%,
        rgba(6, 15, 27, 0.69) 38%,
        rgba(7, 16, 29, 0.28) 70%,
        rgba(7, 16, 29, 0.12) 100%
    );
}

/* Premium gold primary CTA - hero only */
.hp-hero .hp-hero-actions .hp-button-gold {
    background: #F4BC36;
    border-color: #F4BC36;
    color: #102338 !important;
    box-shadow: 0 12px 26px rgba(0,0,0,0.18);
}

.hp-hero .hp-hero-actions .hp-button-gold:hover {
    background: #FFD46C;
    border-color: #FFD46C;
    color: #102338 !important;
}

/* Glass-style secondary CTA */
.hp-hero .hp-hero-actions .hp-button-ghost {
    background: rgba(255,255,255,0.10);
    border-color: rgba(255,255,255,0.65);
    backdrop-filter: blur(7px);
}

/* ==========================================
   MOBILE HERO
========================================== */

@media (max-width: 767px) {

    .hp-hero .hp-slideshow,
    .hp-hero .hp-hero-slide,
    .hp-hero .hp-slide-inner {
        min-height: 615px;
    }

    .hp-hero .hp-slide-inner {
        padding: 42px 0 105px;
    }

    .hp-hero .hp-hero-copy {
        max-width: 100%;
    }

    .hp-hero .hp-hero-copy h1 {
        max-width: 100%;
        font-size: clamp(2.2rem, 8vw, 3.1rem);
        line-height: 1.34;
        margin: 15px 0;
    }

    .hp-hero .hp-hero-copy > p {
        font-size: 0.95rem;
        line-height: 1.55;
        margin-bottom: 20px;
    }

    .hp-hero .hp-hero-shade {
        background: linear-gradient(
            180deg,
            rgba(6,15,27,0.83) 0%,
            rgba(6,15,27,0.67) 55%,
            rgba(6,15,27,0.48) 100%
        );
    }

    .hp-hero .hp-hero-actions {
        gap: 10px;
    }

    .hp-hero .hp-hero-actions .hp-button {
        min-height: 44px;
        padding: 10px 16px;
        font-size: 0.85rem;
    }
}


/* ============================================
   DEALER2DEALER - PREMIUM NETWORK STATS
   COMPLETE REPLACEMENT CSS
============================================ */

.hp .hp-search-wrap {
    padding-bottom: 20px;
}

/* MAIN SECTION */

.hp-stats-strip {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 30px 0 28px;
    background: linear-gradient(
        180deg,
        #f3f8fc 0%,
        #ffffff 100%
    );
    border-top: 1px solid #e3ebf2;
    border-bottom: 1px solid #e3ebf2;
}

/* MOVING TOP LIGHT */

.hp-stats-strip::after {
    content: "";
    position: absolute;
    z-index: 1;
    pointer-events: none;
    top: 0;
    left: -30%;
    width: 30%;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        #5bbce9,
        #1976b8,
        transparent
    );
    box-shadow: 0 0 11px rgba(25,118,184,.22);
    animation: d2d-stats-light 7s linear infinite;
}

/* DESKTOP FOUR CARDS */

.hp-stats-row {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 16px;
}

/* CONNECTING LINE - ABOVE CARDS, BELOW ICONS */

.hp-stats-row::before {
    content: "";
    position: absolute;
    z-index: 2;
    pointer-events: none;
    top: 20px;
    left: 12.5%;
    right: 12.5%;
    height: 2px;

    background: linear-gradient(
        90deg,
        #c4e4f7,
        #1976b8 50%,
        #c4e4f7
    );

    box-shadow: 0 0 8px rgba(25,118,184,.16);

    transform: scaleX(0);
    transform-origin: left center;

    transition: transform 1.3s
        cubic-bezier(.22,1,.36,1);
}

/* LINE GROWS ON SCROLL */

.hp-stats-strip.is-visible .hp-stats-row::before {
    transform: scaleX(1);
}

/* INDIVIDUAL CARD */

.hp-stats-item {
    position: relative;
    min-width: 0;
    margin-top: 20px;
    padding: 35px 12px 20px;

    text-align: center;

    border: 1px solid #e0eaf2;
    border-radius: 16px;

    background: linear-gradient(
        155deg,
        #ffffff 0%,
        #f8fbfe 100%
    );

    box-shadow: 0 8px 25px rgba(14,48,76,.06);

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}

/* HOVER EFFECT */

.hp-stats-item:hover {
    position: relative;
    z-index: 4;
    transform: translateY(-4px);
    border-color: #9bcfee;
    box-shadow: 0 14px 31px rgba(20,84,131,.12);
}

/* ICON CIRCLES */

.hp-stats-icon {
    position: absolute;
    z-index: 3;

    top: -22px;
    left: 50%;

    transform: translateX(-50%);

    display: grid;
    place-items: center;

    width: 44px;
    height: 44px;

    border: 2px solid #1976b8;
    border-radius: 50%;

    color: #1976b8;
    background: #ffffff;

    box-shadow:
        0 0 0 5px #eef6fc,
        0 5px 13px rgba(25,118,184,.10);

    transition:
        color .25s,
        background .25s,
        box-shadow .25s;
}

.hp-stats-icon svg {
    width: 19px;
    height: 19px;
}

/* ICON HOVER */

.hp-stats-item:hover .hp-stats-icon {
    color: #ffffff;
    background: #1976b8;

    box-shadow:
        0 0 0 7px #e2f2fc,
        0 4px 19px rgba(25,118,184,.20);
}

/* COUNTER NUMBERS */

.hp-stats-item strong {
    display: block;

    font-size: clamp(30px,3vw,44px);
    font-weight: 850;

    letter-spacing: -.04em;
    line-height: 1.08;

    font-variant-numeric: tabular-nums;
    color: #122e49;
}

/* PLUS SIGN */

.hp-stats-item strong em {
    color: #268bca;
    font-style: normal;
}

/* LABELS */

.hp-stats-label {
    display: block;
    margin-top: 9px;

    color: #526e86;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    line-height: 1.5;
}

/* NEXT SECTION SPACING */

.hp .hp-stats-strip + .hp-intro {
    padding-top: 52px;
}

/* LIGHT ANIMATION */

@keyframes d2d-stats-light {
    to {
        transform: translateX(440%);
    }
}

/* ============================================
   MOBILE AUTO SCROLLABLE STATS
============================================ */

@media (max-width: 767px) {

    .hp-stats-strip {
        padding: 17px 0 12px;
    }

    /* HORIZONTAL CAROUSEL */

    .hp .hp-stats-strip .hp-stats-row {
        display: flex !important;
        flex-wrap: nowrap !important;

        grid-template-columns: none !important;

        gap: 12px;

        width: 100%;
        max-width: 100%;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        padding: 28px 4px 15px;

        scroll-snap-type: x mandatory;
        scroll-padding-left: 4px;

        overscroll-behavior-x: contain;

        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    /* HIDE SCROLLBAR */

    .hp-stats-row::-webkit-scrollbar {
        display: none;
    }

    /* HIDE DESKTOP CONNECTING LINE */

    .hp-stats-row::before {
        display: none !important;
    }

    /* PREVENT CARDS FROM SHRINKING */

    .hp .hp-stats-strip .hp-stats-row > .hp-stats-item {
        flex: 0 0 80% !important;

        width: 80% !important;
        max-width: none !important;
        min-width: 0 !important;

        box-sizing: border-box;

        margin-top: 22px;
        padding: 34px 10px 20px;

        scroll-snap-align: start;
    }

    /* SPACE AFTER LAST CARD */

    .hp-stats-row::after {
        content: "";
        flex: 0 0 19%;
    }

    /* MOBILE TEXT */

    .hp-stats-item strong {
        font-size: 36px;
    }

    .hp-stats-label {
        font-size: 11px;
    }

    .hp .hp-stats-strip + .hp-intro {
        padding-top: 36px;
    }
}

/* TOUCH DEVICES */

@media (hover: none) {
    .hp-stats-item:hover {
        transform: none;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {

    .hp-stats-strip::after {
        animation: none;
    }

    .hp-stats-row::before {
        transition: none;
    }

    .hp-stats-item,
    .hp-stats-icon {
        transition: none;
    }

    .hp-stats-strip.is-visible .hp-stats-row::before {
        transform: scaleX(1);
    }

    .hp-stats-row {
        scroll-behavior: auto;
    }
}



/* ==========================================
   DEALER2DEALER - PREMIUM V5 GLOBAL FOOTER
========================================== */

.site-footer.d2d-public-footer {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse at 92% 8%,
            rgba(56, 125, 164, .15),
            transparent 42%
        ),
        linear-gradient(
            120deg,
            #091d2e 0%,
            #102c42 100%
        );
    color: #c3d3df;
    border-top: 2px solid #caa675;
}

.d2d-public-footer .d2d-footer-inner {
    background: transparent;
    position: relative;
}

/* MAIN FOUR COLUMN LAYOUT */

.d2d-public-footer .d2d-footer-main {
    display: grid;
    grid-template-columns:
        minmax(0, 1.55fr)
        repeat(3, minmax(0, 1fr));

    align-items: start;
    column-gap: clamp(24px, 3vw, 55px);

    padding-top: 70px;
    padding-bottom: 53px;
}

.d2d-public-footer .d2d-footer-main > div {
    min-width: 0;
}

/* BRAND */

.d2d-public-footer .d2d-footer-brand {
    display: inline-block;
    color: #ffffff;
    font-size: clamp(25px, 2.5vw, 30px);
    font-weight: 850;
    line-height: 1.15;
    letter-spacing: -.055em;
    text-decoration: none;
}

.d2d-public-footer .d2d-footer-brand span {
    color: #dbb780;
}

.d2d-public-footer .d2d-footer-brand:hover {
    color: #ffffff;
}

.d2d-public-footer .d2d-footer-tagline {
    display: block;
    color: #8eafc3;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .17em;
    margin-top: 7px;
}

/* ABOUT DESCRIPTION */

.d2d-public-footer .d2d-footer-about p {
    max-width: 350px;
    margin: 19px 0 20px;
    color: #b0c5d4;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.85;
}

/* PRIVACY BADGE */

.d2d-public-footer .d2d-footer-pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    width: fit-content;
    max-width: 100%;

    padding: 9px 13px;
    border-radius: 30px;

    color: #e4c392;
    background: rgba(226, 195, 146, .065);
    border: 1px solid rgba(226, 195, 146, .29);

    font-size: 10px;
    font-weight: 750;
    letter-spacing: .025em;
}

/* SMALL BADGE INDICATOR */

.d2d-public-footer .d2d-footer-pill::before {
    content: "";
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: #d6b17e;
}

/* LINK COLUMNS */

.d2d-public-footer .d2d-footer-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
}

.d2d-public-footer .d2d-footer-col h2 {
    margin: 3px 0 9px;
    padding: 0;
    color: #ffffff;

    font-size: 14px;
    font-weight: 800;
    line-height: 1.4;
    letter-spacing: -.015em;
}

/* NAVIGATION LINKS */

.d2d-public-footer .d2d-footer-col > a {
    display: inline-flex;
    align-items: center;

    padding: 0;
    color: #adc3d2;
    background: transparent;

    font-size: 13px;
    font-weight: 450;
    line-height: 1.5;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}

.d2d-public-footer .d2d-footer-col > a:hover {
    color: #ffffff;
    transform: translateX(4px);
}

.d2d-public-footer .d2d-footer-col > a:focus-visible,
.d2d-public-footer .d2d-footer-bottom a:focus-visible {
    outline: 2px solid #9ed9f5;
    outline-offset: 5px;
    border-radius: 3px;
}

/* CITY LABELS */

.d2d-public-footer .d2d-footer-col > span {
    display: block;
    color: #adc3d2;
    font-size: 13px;
    line-height: 1.5;
}

/* CONTACT LINK */

.d2d-public-footer .d2d-footer-col
a.d2d-footer-contact {
    color: #e0bd89;
    font-weight: 800;
    margin-top: 5px;
}

.d2d-public-footer .d2d-footer-col
a.d2d-footer-contact:hover {
    color: #ffffff;
}

/* ==========================================
   COPYRIGHT AND DEVELOPER CREDIT
========================================== */

.d2d-public-footer .d2d-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;

    padding-top: 22px;
    padding-bottom: 25px;

    border-top: 1px solid rgba(210,230,243,.17);
}

.d2d-public-footer .d2d-footer-legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 20px;
    min-width: 0;
}

.d2d-public-footer .d2d-footer-legal span,
.d2d-public-footer .d2d-footer-legal a,
.d2d-public-footer .d2d-footer-credit {
    color: #92adbf;
    font-size: 11px;
    line-height: 1.6;
}

.d2d-public-footer .d2d-footer-legal a {
    text-decoration: none;
    transition: color .25s;
}

.d2d-public-footer .d2d-footer-legal a:hover {
    color: #ffffff;
}

/* TECHSMASH CREDIT */

.d2d-public-footer .d2d-footer-credit {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}

.d2d-public-footer .d2d-footer-credit a {
    color: #e0bd89;
    font-weight: 800;
    text-decoration: none;
    transition: color .25s;
}

.d2d-public-footer .d2d-footer-credit a:hover {
    color: #ffffff;
}

/* ==========================================
   BACK TO TOP
========================================== */

.d2d-public-footer .d2d-footer-top {
    position: absolute;
    top: 22px;
    right: clamp(18px, 4vw, 55px);
    z-index: 2;

    display: grid;
    place-items: center;

    width: 38px;
    height: 38px;

    background: rgba(255,255,255,.08);
    color: #d6e8f4;

    border: 1px solid rgba(204,229,244,.25);
    border-radius: 50%;

    font-size: 20px;
    line-height: 1;
    cursor: pointer;

    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;
}

.d2d-public-footer .d2d-footer-top:hover {
    background: #ffffff;
    color: #112d43;
    transform: translateY(-4px);
}

.d2d-public-footer .d2d-footer-top:focus-visible {
    outline: 2px solid #a6dffd;
    outline-offset: 4px;
}

/* ==========================================
   SCROLL REVEAL ANIMATIONS
========================================== */

/* Hidden only after JS is successfully initialized */

.d2d-public-footer.d2d-footer-reveal-ready
.d2d-footer-main > div {
    opacity: 0;
    transform: translateY(22px);

    transition:
        opacity .75s cubic-bezier(.2,.8,.2,1),
        transform .75s cubic-bezier(.2,.8,.2,1);
}

/* Reveal on scroll */

.d2d-public-footer.d2d-footer-revealed
.d2d-footer-main > div {
    opacity: 1;
    transform: translateY(0);
}

/* Stagger each column */

.d2d-public-footer .d2d-footer-main
> div:nth-child(2) {
    transition-delay: 90ms;
}

.d2d-public-footer .d2d-footer-main
> div:nth-child(3) {
    transition-delay: 170ms;
}

.d2d-public-footer .d2d-footer-main
> div:nth-child(4) {
    transition-delay: 250ms;
}

/* ==========================================
   TABLET
========================================== */

@media (max-width: 900px) {

    .d2d-public-footer .d2d-footer-main {
        grid-template-columns: repeat(3, minmax(0,1fr));
        gap: 38px 28px;
        padding-top: 65px;
        padding-bottom: 40px;
    }

    .d2d-public-footer .d2d-footer-about {
        grid-column: 1 / -1;
    }

    .d2d-public-footer .d2d-footer-about p {
        max-width: 580px;
    }
}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

    .d2d-public-footer .d2d-footer-main {
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 30px 18px;

        padding-top: 65px;
        padding-bottom: 32px;
    }

    .d2d-public-footer .d2d-footer-about {
        grid-column: 1 / -1;
    }

    .d2d-public-footer .d2d-footer-brand {
        font-size: 28px;
    }

    .d2d-public-footer .d2d-footer-about p {
        font-size: 13px;
        line-height: 1.75;
        margin: 15px 0 17px;
    }

    .d2d-public-footer .d2d-footer-col {
        gap: 14px;
    }

    .d2d-public-footer .d2d-footer-col h2 {
        font-size: 13px;
        margin-bottom: 5px;
    }

    .d2d-public-footer .d2d-footer-col > a,
    .d2d-public-footer .d2d-footer-col > span {
        font-size: 12px;
    }

    .d2d-public-footer .d2d-footer-bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 13px;
        padding-top: 22px;
        padding-bottom: 26px;
        justify-content:center;
        align-items: center;
    }

    .d2d-public-footer .d2d-footer-legal {
        gap: 8px 14px;
    }

    .d2d-public-footer .d2d-footer-top {
        top: 17px;
        right: 18px;
    }
}

/* REDUCE FAQ-FOOTER EMPTY SPACE ON HOMEPAGE */

@media (min-width: 768px) {
    .d2d-home-v5 .hpv5-faq {
        padding-bottom: 62px;
    }
}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

    .d2d-public-footer.d2d-footer-reveal-ready
    .d2d-footer-main > div {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .d2d-public-footer .d2d-footer-top,
    .d2d-public-footer .d2d-footer-col > a {
        transition: none;
    }
}



/* ==========================================
   DEALER2DEALER V5 - GLOBAL PREMIUM HEADER
   SAME DESIGN ON ALL PUBLIC PAGES
========================================== */

/* Main header */
.site-header.d2d-public-header {
    background: rgba(255, 255, 255, .97);
    border-bottom: 1px solid #e5ebef;
    box-shadow: 0 8px 30px rgba(8, 32, 52, .045);
}

/* Dark premium topbar */
.d2d-topbar {
    background: #0c2336;
    color: #d9e9f3;
}

.d2d-topbar-location b {
    color: #ddba83;
}

.d2d-status-dot {
    background: #ddba83;
}

/* Header height */
.d2d-header-main {
    min-height: 76px;
}

/* Navigation hover */
.d2d-public-header
.d2d-public-nav > a:not(.d2d-nav-login):hover {
    background: #edf5fa;
    color: #145d8e;
}

/* Dealer Login / Dashboard button */
.d2d-public-header
.d2d-public-nav > .d2d-nav-login {
    background: #102e45;
    border-color: #102e45;
    color: #ffffff;
    border-radius: 9px;
}

.d2d-public-header
.d2d-public-nav > .d2d-nav-login:hover {
    background: #1b618f;
    color: #ffffff;
}

/* Join as Dealer button */
.d2d-public-header
.d2d-public-nav > .d2d-nav-apply {
    border-color: #d4b58b;
    color: #90662e;
    border-radius: 9px;
}

.d2d-public-header
.d2d-public-nav > .d2d-nav-apply:hover {
    background: #fcf4e8;
    color: #90662e;
}

/* Mobile navigation */
@media (max-width: 1050px) {

    .d2d-public-header .d2d-public-nav {
        background: #ffffff;
        border-color: #e2eaf0;
        box-shadow: 0 20px 35px rgba(8,32,52,.14);
    }

    .d2d-public-header .d2d-public-nav.open {
        display: flex;
    }

    .d2d-public-header
    .d2d-public-nav > .d2d-nav-login {
        text-align: center;
        margin-left: 0;
    }
}

/* Dealer2Dealer — Staff mobile polish (Admin + Operator) */
@media (max-width: 900px) {
    .staff-body .staff-sidebar-head .brand {
        margin-bottom: 0;
    }

    .staff-body .staff-main,
    .staff-body .staff-content,
    .staff-body .staff-content > .panel,
    .staff-body .staff-content > form,
    .staff-body .staff-content .table-wrap {
        min-width: 0;
        max-width: 100%;
    }

    /* Keep private inventory readable instead of crushing columns. */
    .staff-body .table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .staff-body .table-wrap > table.table {
        min-width: 660px;
    }

    /* Prevent large form controls from creating page-wide overflow. */
    .staff-body .staff-content input,
    .staff-body .staff-content select,
    .staff-body .staff-content textarea {
        max-width: 100%;
    }
    .staff-body .staff-content .grid > *,
    .staff-body .staff-content .stat-grid > * {
        min-width: 0;
    }

    /* iPhone safe area and easier sidebar scrolling. */
    .staff-body .staff-sidebar {
        padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
    }
    .staff-body .staff-sidebar-nav a {
        min-height: 44px;
    }
}

@media (max-width: 767px) {
    /* Operator gets the same compact 2-column stats as Admin. */
    .staff-body.staff-role-operator .stat-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }
    .staff-body.staff-role-operator .stat-grid .stat {
        min-width: 0;
        padding: 12px;
        min-height: 86px;
    }
    .staff-body.staff-role-operator .stat-grid .stat span {
        font-size: 12px;
        line-height: 1.35;
        overflow-wrap: anywhere;
    }
    .staff-body.staff-role-operator .stat-grid .stat strong {
        font-size: clamp(22px, 6vw, 28px);
        line-height: 1.15;
    }

    .staff-body .staff-content .page-head {
        align-items: flex-start;
        gap: 12px;
    }
    .staff-body .staff-content .page-head h1 {
        font-size: clamp(22px, 6vw, 27px);
        line-height: 1.2;
    }
    .staff-body .staff-content .page-head > .btn {
        max-width: 100%;
    }
    .staff-body .staff-content .form-actions {
        flex-wrap: wrap;
        gap: 9px;
        bottom: 0;
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }
    .staff-body .staff-content .form-actions > .btn,
    .staff-body .staff-content .form-actions > button {
        flex: 1 1 125px;
        min-height: 44px;
    }
}


/* ============================================================
   Dealer2Dealer STAFF UX V2 — desktop table repair + real
   mobile record cards. Loaded only in Admin/Operator layouts.
   Existing form and permission functionality is untouched.
   ============================================================ */

.staff-body.d2d-staff-ux-v2 .staff-content {
  min-width: 0;
}
.staff-body.d2d-staff-ux-v2 .staff-content > .panel,
.staff-body.d2d-staff-ux-v2 .staff-content > .page-head,
.staff-body.d2d-staff-ux-v2 .staff-content > .grid,
.staff-body.d2d-staff-ux-v2 .staff-content > .stack {
  min-width: 0;
  max-width: 100%;
}
.staff-body.d2d-staff-ux-v2 .staff-content .panel .table-wrap,
.staff-body.d2d-staff-ux-v2 .staff-content .panel .table-responsive,
.staff-body.d2d-staff-ux-v2 .staff-content > .table-wrap {
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}

/* DESKTOP/LAPTOP — Homepage Hero: enough room for three actions */
@media (min-width: 701px) {
  .staff-body.d2d-staff-hero-page .staff-content .table-responsive > .table,
  .staff-body.d2d-staff-hero-page .staff-content .table-wrap > .table {
    width: 100%;
    min-width: 1060px;
    table-layout: auto;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table th,
  .staff-body.d2d-staff-hero-page .staff-content .table td {
    padding: 14px 10px;
    vertical-align: middle;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table th:first-child,
  .staff-body.d2d-staff-hero-page .staff-content .table td:first-child {
    min-width: 62px;
    width: 62px;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table th:nth-child(2),
  .staff-body.d2d-staff-hero-page .staff-content .table td:nth-child(2) {
    min-width: 250px;
    max-width: 350px;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table td:nth-child(2) > .muted {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table th:last-child,
  .staff-body.d2d-staff-hero-page .staff-content .table td:last-child {
    min-width: 225px;
    width: 225px;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table td:last-child > .actions {
    display: flex;
    flex-flow: row nowrap;
    gap: 6px;
    align-items: center;
    width: max-content;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table td:last-child > .actions form {
    margin: 0;
    display: inline-flex !important;
  }
  .staff-body.d2d-staff-hero-page .staff-content .table td:last-child .btn {
    min-height: 36px;
    padding: 7px 10px;
    font-size: 12px;
    white-space: nowrap;
  }
}

/* PHONE — change every normal staff data table to readable cards. */
@media (max-width: 700px) {
  .staff-body.d2d-staff-ux-v2 .staff-content .d2d-staff-card-wrap {
    overflow: visible !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border-radius: 0;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border: 0;
    border-collapse: separate;
    background: transparent;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table thead {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody {
    display: grid !important;
    gap: 12px;
    width: 100%;
    min-width: 0;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr {
    display: block !important;
    min-width: 0;
    width: 100%;
    border: 1px solid #dce6ed;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(14, 45, 67, .055);
    overflow: hidden;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td {
    position: relative;
    display: block !important;
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 39px;
    margin: 0;
    padding: 10px 13px 10px 116px !important;
    border: 0;
    border-bottom: 1px solid #eef2f5;
    background: #fff;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.55;
    font-size: 12px;
    vertical-align: middle;
    text-align: left;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td::before {
    content: attr(data-d2d-label);
    position: absolute;
    top: 11px;
    left: 12px;
    display: block;
    width: 95px;
    color: #617b90;
    font-size: 10px;
    line-height: 1.35;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td:first-child {
    background: #f6fafc;
    color: #142e42;
    font-size: 13px;
    font-weight: 700;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td:first-child::before {
    color: #176da4;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td:last-child {
    border-bottom: 0;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table .d2d-staff-empty-row > td {
    padding: 15px !important;
    text-align: center;
    background: #fff;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table .d2d-staff-empty-row > td::before,
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table .d2d-staff-empty-cell::before {
    display: none;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td .actions,
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td:last-child .actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px;
    align-items: center;
    width: 100%;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td .actions > form {
    margin: 0;
    display: inline-flex !important;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td .btn {
    width: auto;
    max-width: 100%;
    min-height: 40px;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 12px;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td form,
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td select,
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td input {
    max-width: 100%;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content .d2d-staff-card-wrap.panel,
  .staff-body.d2d-staff-ux-v2 .staff-content .panel:has(> .d2d-staff-card-wrap) {
    padding: 0 !important;
    background: transparent;
    box-shadow: none;
    border: 0;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content .d2d-staff-card-wrap .badge {
    display: inline-block;
    white-space: normal;
    max-width: 100%;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content .d2d-staff-card-table .muted,
  .staff-body.d2d-staff-ux-v2 .staff-content .d2d-staff-card-table small {
    font-size: 11px;
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  /* Compact registration status tabs, even on 320px phones. */
  .staff-body.d2d-staff-registrations-page .staff-content > .actions:first-child {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .staff-body.d2d-staff-registrations-page .staff-content > .actions:first-child > a {
    width: 100%;
    min-width: 0;
    justify-content: center;
    padding-inline: 7px;
  }

  /* Enquiries search controls stack cleanly; no cramped filter. */
  .staff-body.d2d-staff-enquiries-page .staff-content > form.panel.actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 9px;
  }
  .staff-body.d2d-staff-enquiries-page .staff-content > form.panel.actions > .btn {
    min-height: 44px;
    width: 100%;
  }

  /* Make long titles, email addresses and phone fields wrap. */
  .staff-body.d2d-staff-ux-v2 .staff-content .panel,
  .staff-body.d2d-staff-ux-v2 .staff-content .page-head {
    overflow-wrap: anywhere;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content input:not([type='checkbox']):not([type='radio']),
  .staff-body.d2d-staff-ux-v2 .staff-content select,
  .staff-body.d2d-staff-ux-v2 .staff-content textarea {
    max-width: 100%;
    font-size: 16px;
  }
}

@media (max-width: 380px) {
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td {
    padding-left: 104px !important;
  }
  .staff-body.d2d-staff-ux-v2 .staff-content table.d2d-staff-card-table tbody > tr > td::before {
    width: 83px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .staff-body.d2d-staff-ux-v2 * {
    scroll-behavior: auto;
  }
}

/* ==========================================
   DEALER REGISTRATION - PREMIUM DESIGN
   DESKTOP + TABLET + MOBILE
========================================== */

.d2d-reg-page {
    padding: 48px 0 72px;
    background:
        radial-gradient(
            circle at 5% 10%,
            rgba(31, 135, 198, .06),
            transparent 35%
        ),
        #f7f9fc;
}

.d2d-reg-page .container {
    max-width: 1240px;
}

/* MAIN LAYOUT */

.d2d-reg-layout {
    display: grid;
    grid-template-columns:
        minmax(0, .82fr)
        minmax(0, 1.18fr);
    align-items: start;
    gap: 26px;
    max-width: 1180px;
    margin: 0 auto;
}

/* LEFT BRANDING PANEL */

.d2d-reg-intro {
    position: sticky;
    top: 100px;
    overflow: hidden;
    min-width: 0;
    min-height: 570px;
    padding: 42px 36px;
    border-radius: 22px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #fff;
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(54, 157, 218, .22),
            transparent 55%
        ),
        linear-gradient(
            155deg,
            #102b3e 0%,
            #0a2235 100%
        );
    box-shadow: 0 18px 50px rgba(9, 31, 49, .12);
}

.d2d-reg-kicker {
    display: inline-block;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 100px;
    color: #aadcf8;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 1.3px;
}

.d2d-reg-intro h2 {
    margin: 26px 0 15px;
    color: #fff;
    font-size: clamp(29px, 3vw, 42px);
    line-height: 1.15;
    font-weight: 750;
    letter-spacing: -1.3px;
}

.d2d-reg-intro h2 span {
    display: block;
    color: #70c4f5;
}

.d2d-reg-intro-top > p {
    max-width: 360px;
    margin: 0;
    color: #c1d1de;
    font-size: 14px;
    line-height: 1.8;
}

/* BENEFIT ITEMS */

.d2d-reg-benefits {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin: 42px 0;
}

.d2d-reg-benefit {
    display: flex;
    align-items: flex-start;
    gap: 13px;
}

.d2d-reg-check {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: rgba(68, 167, 225, .17);
    color: #83d0ff;
    font-size: 16px;
    font-weight: 700;
}

.d2d-reg-benefit strong {
    display: block;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
}

.d2d-reg-benefit small {
    display: block;
    margin-top: 5px;
    color: #b6c9d7;
    font-size: 12px;
    line-height: 1.6;
}

.d2d-reg-intro-footer {
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.13);
    color: #fff;
    font-size: 19px;
    font-weight: 800;
}

.d2d-reg-intro-footer span {
    display: block;
    margin-top: 5px;
    color: #85a4bb;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* RIGHT FORM CARD */

.d2d-reg-layout .d2d-reg-card.auth-shell.panel {
    width: 100%;
    max-width: none;
    min-width: 0;
    margin: 0;
    padding: 34px;
    border: 1px solid #e1e8ee;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 15px 50px rgba(22, 44, 61, .06);
    box-sizing: border-box;
}

/* HEADING */

.d2d-reg-heading {
    margin-bottom: 25px;
    padding-bottom: 22px;
    border-bottom: 1px solid #edf1f5;
}

.d2d-reg-heading .eyebrow {
    margin-bottom: 9px;
    color: #177ebd;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
}

.d2d-reg-heading h1 {
    margin: 0 0 9px;
    color: #102d42;
    font-size: clamp(26px, 2.7vw, 34px);
    line-height: 1.2;
    font-weight: 750;
    letter-spacing: -.8px;
}

.d2d-reg-heading p {
    margin: 0;
    font-size: 13px;
    line-height: 1.7;
}

/* FORM SPACING */

.d2d-reg-card form.stack {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.d2d-reg-card .grid.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.d2d-reg-card .field {
    min-width: 0;
    margin: 0;
}

.d2d-reg-card .field > label {
    display: block;
    margin-bottom: 8px;
    color: #24394a;
    font-size: 12px;
    line-height: 1.5;
    font-weight: 700;
}

/* FORM INPUTS */

.d2d-reg-card .input,
.d2d-reg-card .select,
.d2d-reg-card .textarea {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    border: 1px solid #dce5ec;
    border-radius: 11px;
    background: #fbfcfe;
    color: #172e41;
    font-size: 16px;
    box-shadow: none;
    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}

.d2d-reg-card .input,
.d2d-reg-card .select {
    min-height: 48px;
    padding: 11px 13px;
}

.d2d-reg-card .textarea {
    min-height: 84px;
    padding: 13px;
    resize: vertical;
    line-height: 1.6;
}

.d2d-reg-card .input:focus,
.d2d-reg-card .select:focus,
.d2d-reg-card .textarea:focus {
    outline: none;
    background: #fff;
    border-color: #288bc8;
    box-shadow: 0 0 0 3px rgba(40, 139, 200, .10);
}

/* ERROR MESSAGES */

.d2d-reg-card .error-text {
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.5;
}

.d2d-reg-card .form-errors {
    margin-bottom: 18px;
    border-radius: 10px;
}

/* CONFIRMATION CHECKBOX */

.d2d-reg-card form.stack > label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 12px;
    line-height: 1.6;
    color: #405569;
    cursor: pointer;
}

.d2d-reg-card input[type="checkbox"] {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 2px;
    accent-color: #1687c9;
}

/* SUBMIT BUTTON */

.d2d-reg-card button[type="submit"] {
    width: 100%;
    min-height: 50px;
    padding: 13px 20px;
    border-radius: 11px;
    background: #1685c7;
    color: #fff;
    font-size: 14px;
    font-weight: 750;
    transition:
        background .2s ease,
        transform .2s ease;
}

.d2d-reg-card button[type="submit"]:hover {
    background: #086ca8;
    transform: translateY(-1px);
}

/* TABLET */

@media (max-width: 1000px) {

    .d2d-reg-layout {
        grid-template-columns:
            minmax(0, .8fr)
            minmax(0, 1.2fr);
        gap: 18px;
    }

    .d2d-reg-intro {
        padding: 30px 24px;
    }

    .d2d-reg-layout .d2d-reg-card.auth-shell.panel {
        padding: 25px;
    }

}

/* MOBILE */

@media (max-width: 760px) {

    .d2d-reg-page {
        padding: 20px 0 38px;
    }

    .d2d-reg-page .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .d2d-reg-layout {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .d2d-reg-intro {
        position: relative;
        top: auto;
        width: 100%;
        min-height: 0;
        padding: 25px 22px;
        border-radius: 16px;
        box-sizing: border-box;
    }

    .d2d-reg-intro h2 {
        margin: 16px 0 10px;
        font-size: 27px;
        letter-spacing: -.8px;
    }

    .d2d-reg-intro-top > p {
        font-size: 12px;
        line-height: 1.7;
    }

    .d2d-reg-benefits,
    .d2d-reg-intro-footer {
        display: none;
    }

    .d2d-reg-layout .d2d-reg-card.auth-shell.panel {
        width: 100%;
        padding: 24px 20px;
        border-radius: 16px;
    }

    .d2d-reg-card .grid.grid-2 {
        grid-template-columns: minmax(0, 1fr);
        gap: 15px;
    }

    .d2d-reg-card form.stack {
        gap: 15px;
    }

    .d2d-reg-heading {
        margin-bottom: 20px;
        padding-bottom: 18px;
    }

    .d2d-reg-heading h1 {
        font-size: 26px;
    }

}

/* SMALL MOBILE */

@media (max-width: 380px) {

    .d2d-reg-page .container {
        padding-left: 10px;
        padding-right: 10px;
    }

    .d2d-reg-layout .d2d-reg-card.auth-shell.panel {
        padding: 20px 15px;
    }

    .d2d-reg-intro {
        padding: 22px 18px;
    }

}


/* ==========================================
   DEALER LOGIN - PREMIUM RESPONSIVE DESIGN
========================================== */

.d2d-login-page .d2d-reg-layout {
    max-width: 1050px;
    grid-template-columns:
        minmax(0, .9fr)
        minmax(0, 1.1fr);
    align-items: stretch;
}

.d2d-login-page .d2d-reg-intro {
    position: relative;
    top: auto;
    min-height: 540px;
}

.d2d-login-page .d2d-login-card {
    align-self: center;
}

.d2d-login-card .password-wrap {
    display: block;
    position: relative;
}

.d2d-login-card .password-wrap .input {
    width: 100%;
    border-radius: 11px;
    padding-right: 84px;
}

.d2d-login-card .password-toggle {
    position: absolute;
    right: 7px;
    top: 7px;
    bottom: 7px;
    z-index: 1;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: #edf4f9;
    color: #15547b;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.d2d-login-card .password-toggle:hover {
    background: #dceef8;
}

.d2d-login-links {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.d2d-login-links a,
.d2d-login-register a {
    color: #167cb8;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.d2d-login-links a:hover,
.d2d-login-register a:hover {
    text-decoration: underline;
}

.d2d-login-register {
    margin-top: 26px;
    padding: 20px 10px 0;
    border-top: 1px solid #e6edf2;
    color: #607486;
    font-size: 12px;
    text-align: center;
}

/* TABLET */

@media (max-width: 900px) {

    .d2d-login-page .d2d-reg-intro {
        min-height: 480px;
    }

}

/* MOBILE */

@media (max-width: 760px) {

    .d2d-login-page .d2d-reg-layout {
        display: flex;
        flex-direction: column;
    }

    .d2d-login-page .d2d-reg-intro {
        min-height: 0;
    }

    .d2d-login-page .d2d-login-card {
        align-self: stretch;
    }

    .d2d-login-links {
        align-items: flex-start;
        gap: 14px;
    }

}


/* ==========================================
   EMAIL OTP LOGIN - PREMIUM DESIGN
========================================== */

.d2d-otp-page .d2d-reg-layout {
    max-width: 1050px;
}

.d2d-otp-page .d2d-otp-card {
    width: 100%;
    align-self: center;
}

.d2d-otp-card .alert {
    margin-bottom: 20px;
    border-radius: 11px;
    padding: 13px 15px;
    font-size: 13px;
    line-height: 1.6;
}

.d2d-otp-card #otp-code {
    text-align: center;
    letter-spacing: 6px;
    font-size: 22px;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
}

.d2d-otp-card form.stack > .btn {
    width: 100%;
    min-height: 50px;
}

.d2d-otp-card button[name="action"][value="change_email"] {
    width: 100%;
    min-height: 46px;
    background: #f4f8fb;
    color: #174b6c;
    border: 1px solid #dce7ef;
    border-radius: 11px;
    font-size: 13px;
    font-weight: 700;
    box-shadow: none;
}

.d2d-otp-card button[name="action"][value="change_email"]:hover {
    background: #eaf3f9;
    color: #103a57;
    transform: none;
}

.d2d-otp-card > p:last-child {
    margin: 24px 0 0;
    padding-top: 20px;
    border-top: 1px solid #e7edf3;
    text-align: center;
    font-size: 13px;
}

.d2d-otp-card > p:last-child a {
    color: #167cb8;
    font-weight: 700;
    text-decoration: none;
}

.d2d-otp-card > p:last-child a:hover {
    text-decoration: underline;
}

@media (max-width: 760px) {

    .d2d-otp-page .d2d-otp-card {
        align-self: stretch;
    }

    .d2d-otp-card #otp-code {
        font-size: 20px;
        letter-spacing: 5px;
    }
}