    /* ===== Base ===== */
    body {
    font-family: "Inter", sans-serif;
  font-weight: 400;
  font-style: normal;
      color: #1a1a1a;
      background: #fff;
      font-size: 16px;
    }

    :root {
      --bg-dark: #05030e;
      --card-bg: #000;
      --card-border: rgba(69, 57, 23);
      --text-white: #ffffff;
      --text-muted: #9aa2ba;
      --neon-magenta: #e026df;
      --neon-cyan: #00d2ff;
      --neon-purple: #9d4edd;
      --bar-track: #493b1a;
      --gradient-bar: #c9a24d;
    }

    a { text-decoration: none; }

    .text-gold { color: #c9a24d !important; }

    .section { padding: 100px 0; }
    .section-cream { background: #f8f6f1; }
    .section-dark { background: #0b0b0b; color: #fff; }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: #c9a24d;
      margin-bottom: 14px;
    }

    .eyebrow::before,
    .eyebrow.both::after {
      content: "";
      width: 28px;
      height: 1px;
      background: #c9a24d;
    }

    .section-title {
      font-size: clamp(1.9rem, 3.2vw, 2.6rem);
      font-weight: 600;
      line-height: 1.15;
      margin-bottom: 16px;
    }

    .section-sub {
      color: #6b6b6b;
      line-height: 1.8;
      max-width: 560px;
    }

    /* Placeholder-friendly image boxes: replace the url() with your images */
    .img-box {
      background-size: cover;
      background-position: center;
      background-color: #2a2a2a;
    }

    /* ===== Buttons ===== */
    .btn-gold,
    .btn-dark-sq,
    .btn-outline-sq {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      border-radius: 0;
      padding: 14px 26px;
      display: inline-flex;
      align-items: center;
      gap: 10px;
    }

    .btn-gold { background: #c9a24d; border: 1px solid #c9a24d; color: #111; }
    .btn-gold:hover { background: #b38c38; border-color: #b38c38; color: #111; }

    .btn-dark-sq { background: #111; border: 1px solid #111; color: #fff; }
    .btn-dark-sq:hover { background: #c9a24d; border-color: #c9a24d; color: #111; }

    .btn-outline-sq { background: transparent; border: 1px solid #1a1a1a; color: #1a1a1a; }
    .btn-outline-sq:hover { background: #1a1a1a; color: #fff; }

    .btn-link-light {
      color: #fff;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      display: inline-flex;
      align-items: center;
      gap: 10px;
    }
    .btn-link-light:hover { color: #c9a24d; }

    /* ===== Header ===== */
    .site-header {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 20;
      padding: 18px 0;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #fff;
    }

    .brand img {max-width: 140px;
    }

    .site-header .nav-link {
      color: rgba(255, 255, 255, 0.85);
      font-size: 16px;
      padding: 8px 18px !important;
    }
    .site-header .nav-link:hover { color: #c9a24d; }

    .lang-btn {
      border: 1px solid rgba(201, 162, 77, 0.6);
      color: #c9a24d;
      font-size: 12px;
      padding: 5px 12px;
    }
    .lang-btn:hover { background: #c9a24d; color: #111; }

    .header-cta {
      color: #c9a24d;
      font-size: 16px;
      font-weight: 600;
    }
    .header-cta:hover { color: #fff; }

    .navbar-toggler { border-color: rgba(255,255,255,0.4); }
    .navbar-toggler-icon { filter: invert(1); }

    @media (max-width: 991.98px) {
      .site-header .navbar-collapse {
        background: rgba(10, 10, 10, 0.96);
        padding: 16px;
        margin-top: 12px;
      }
    }

    /* ===== Hero ===== */
    .hero {
      position: relative;
      min-height: 760px;
      display: flex;
      align-items: center;
      padding: 140px 0 80px;
      color: #fff;
      background-image: url("https://images.unsplash.com/photo-1512453979798-5ea266f8880c?auto=format&fit=crop&w=2000&q=80");
      background-size: cover;
      background-position: center;
      background-color: #1b1a17;
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.55) 55%, rgba(0,0,0,0.25) 100%);
    }

    .hero .container { position: relative; z-index: 1; }

    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(201, 162, 77, 0.15);
      border: 1px solid rgba(201, 162, 77, 0.5);
      color: #c9a24d;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      padding: 6px 14px;
      margin-bottom: 22px;
    }

    .hero-badge::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #c9a24d;
    }

    .hero h1 {
      font-size: clamp(2.4rem, 5vw, 3.9rem);
      font-weight: 600;
      line-height: 1.08;
      margin-bottom: 22px;
    }

    .hero p.lead-text {
      color: rgba(255, 255, 255, 0.78);
      line-height: 1.8;
      max-width: 650px;
      margin-bottom: 24px;
    }

    .hero-perks {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 22px;
      margin-bottom: 32px;
      font-size: 14px;
      color: rgba(255, 255, 255, 0.85);
    }

    .hero-perks i { color: #c9a24d; margin-right: 6px; }

    .hero-devs {
      margin-top: 48px;
      font-size: 11px;
      color: rgba(255, 255, 255, 0.55);
      letter-spacing: 0.04em;
    }

    /* ===== Stats + developers ===== */
    .stats-bar { background: #0b0b0b; color: #fff; padding: 40px 0 50px; }

    .stat {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 10px 0;
    }

    .stat-icon {
      width: 38px;
      height: 38px;
      border: 1px solid rgba(201, 162, 77, 0.4);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #c9a24d;
      flex-shrink: 0;
    }

    .stat-num { font-size: 22px; font-weight: 700; line-height: 1.1; }
    .stat-label { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.55); }

    .devs-title {
      text-align: center;
      font-size: 12px;
      letter-spacing: 0.25em;
      text-transform: uppercase;
      color: rgba(255, 255, 255, 0.4);
      margin: 50px 0 26px;
    }

    .devs-list {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 18px 46px;
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .devs-list li {
      color: rgba(255, 255, 255, 0.6);
      font-weight: 600;
      font-size: 16px;
      letter-spacing: 0.04em;
    }

    /* ===== Projects ===== */
    .project-card {
      background: #fff;
      height: 100%;
      transition: transform 0.25s ease, box-shadow 0.25s ease;
    }

    .project-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0,0,0,0.08); }

    .project-img {
      position: relative;
      height: 240px;
    }

    .project-tag {
      position: absolute;
      top: 14px;
      left: 14px;
      background: #c9a24d;
      color: #111;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.14em;
      padding: 4px 10px;
      text-transform: uppercase;
    }

    .project-body { padding: 22px; }

    .project-dev { font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: #c9a24d; margin-bottom: 6px; }
    .project-name { font-size: 18px; font-weight: 600; margin-bottom: 2px; }
    .project-loc { font-size: 14px; color: #8a8a8a; margin-bottom: 18px; }

    .project-foot {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      border-top: 1px solid #eee;
      padding-top: 14px;
    }

    .price-label { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: #8a8a8a; }
    .price { font-size: 16px; font-weight: 700; }

    .details-link {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #1a1a1a;
      border-bottom: 1px solid #1a1a1a;
      padding-bottom: 2px;
    }
    .details-link:hover { color: #c9a24d; border-color: #c9a24d; }

    /* ===== Feature boxes ===== */
    .feature-box {
      background: #fff;
      border: 1px solid #ece8de;
      padding: 26px 22px;
      height: 100%;
    }

    .feature-icon {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: rgba(201, 162, 77, 0.12);
      color: #c9a24d;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 14px;
    }

    .feature-box h3 { font-size: 15px; font-weight: 600; margin-bottom: 6px; }
    .feature-box p { font-size: 14px; color: #777; line-height: 1.7; margin: 0; }

    /* ===== Story ===== */
    .story {
      position: relative;
      overflow: hidden;
      text-align: center;
      padding: 130px 0;
    }

    .story::after {
      content: "";
      background: url('../images/icon.svg') no-repeat;
      position: absolute;
      right: -68px;
  top: 12%;
  width: 300px;
  height: 100%;
  background-size: contain;
  pointer-events: none;
  opacity: 0.1;
    }

    .story h2 { font-size: clamp(2.2rem, 4.2vw, 3.4rem); font-weight: 600; line-height: 1.2; }

    .story blockquote {
      font-family: "Inter", sans-serif;
      font-style: italic;
      font-size: 17px;
      color: rgba(255, 255, 255, 0.6);
      max-width: 480px;
      margin: 28px auto 0;
    }

    /* ===== Timeline ===== */
    .timeline {
      position: relative;
      max-width: 820px;
      margin: 60px auto 0;
    }

    .timeline::before {
      content: "";
      position: absolute;
      left: 50%;
      top: 0;
      bottom: 0;
      width: 1px;
      background: #e3ded2;
    }

    .tl-item {
      position: relative;
      width: 50%;
      padding: 0 50px 70px 0;
    }

    .tl-item:nth-child(even) { margin-left: 50%; padding: 0 0 70px 50px; }

    .tl-item::after {
      content: "";
      position: absolute;
      top: 50%;
      right: -5px;
      width: 9px;
      height: 9px;
      border-radius: 50%;
      background: #c9a24d;
      box-shadow: 0 0 0 4px #fff;
    }

    .tl-item:nth-child(even)::after { right: auto; left: -4px; }

    .tl-card {
      background: #fff;
      border: 1px solid #ece8de;
      padding: 28px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    }

    .tl-meta {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.2em;
      color: #c9a24d;
      text-transform: uppercase;
      margin-bottom: 12px;
    }

    .tl-meta i {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: rgba(201, 162, 77, 0.12);
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .tl-card h3 { font-size: 17px; font-weight: 600; margin-bottom: 8px; }
    .tl-card p { font-size: 14px; color: #777; line-height: 1.75; margin: 0; }

    @media (max-width: 767.98px) {
      .timeline::before { left: 8px; }
      .tl-item,
      .tl-item:nth-child(even) { width: 100%; margin-left: 0; padding: 0 0 36px 36px; }
      .tl-item::after,
      .tl-item:nth-child(even)::after { left: 4px; right: auto; top: 30px; }
    }

    /* ===== Value cards (What drives us) ===== */
    .value-card {
      position: relative;
      height: 400px;
      display: flex;
      align-items: flex-end;
      color: #fff;
      overflow: hidden;
    }

    .value-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,0.88) 100%);
      transition: background 0.3s ease;
    }

    .value-card:hover::before { background: linear-gradient(180deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.92) 100%); }

    .value-body { position: relative; padding: 26px; }

    .value-body .tag { font-size: 12px; letter-spacing: 0.2em; color: #c9a24d; text-transform: uppercase; margin-bottom: 6px; display: block; }
    .value-body h3 { font-size: 19px; font-weight: 600; margin-bottom: 8px; }
    .value-body p { font-size: 14px; color: rgba(255,255,255,0.72); line-height: 1.7; margin: 0; }

    /* ===== Meaning cards ===== */
    .meaning-card {
      position: relative;
      background: #fff;
      border: 1px solid #ece8de;
      padding: 34px 28px;
      height: 100%;
      overflow: hidden;
    }

    .meaning-card::after {
      content: "";
  background: url('../images/icon.svg') no-repeat;
      position: absolute;top: 0px;
  right: 0px;
  width: 60px;
  height: 80px;
  background-size: contain;
  opacity: .5;
    }

    .meaning-card .feature-icon { margin-bottom: 18px; }
    .meaning-card h3 { font-size: 16px; font-weight: 600; margin-bottom: 8px; }
    .meaning-card p { font-size: 13px; color: #777; line-height: 1.7; margin: 0; }

    /* ===== Founder band ===== */
    .founder-band {
      background: #0b0b0b;
      color: #fff;
      text-align: center;
      padding: 60px 0;
    }

    .founder-band .small-line { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(255,255,255,0.45); }
    .founder-band .sign { margin-top: 14px; font-size: 14px; font-weight: 600; }

    /* ===== Advisors ===== */
    .advisor-card { max-width: 240px; }
    .advisor-img { height: 300px; filter: grayscale(100%); margin-bottom: 14px; }
    .advisor-card h3 { font-size: 15px; font-weight: 600; margin: 0; }
    .advisor-card span { font-size: 12px; color: #c9a24d; }

    /* ===== Testimonials ===== */
    .testimonials { text-align: center; }

    .quote-mark {
      font-family: "Inter", sans-serif;
      font-size: 90px;
      line-height: 0.6;
      color: rgba(201, 162, 77, 0.3);
      margin: 40px 0 30px;
    }

    .testimonial-text {
      font-size: clamp(1.1rem, 2vw, 1.4rem);
      line-height: 1.75;
      max-width: 720px;
      margin: 0 auto 26px;
    }

    .testimonial-name { color: #c9a24d; font-size: 16px; font-weight: 600; }
    .testimonial-role { font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.45); }

    .t-controls {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 18px;
      margin-top: 44px;
    }

    .t-arrow {
      background: none;
      border: 0;
      color: rgba(255, 255, 255, 0.5);
      font-size: 14px;
    }
    .t-arrow:hover { color: #c9a24d; }

    .testimonials .carousel-indicators {
      position: static;
      margin: 0;
      gap: 6px;
    }

    .testimonials .carousel-indicators [data-bs-target] {
      width: 18px;
      height: 2px;
      border: 0;
      margin: 0;
      background: rgba(255, 255, 255, 0.3);
      opacity: 1;
    }

    .testimonials .carousel-indicators .active { width: 34px; background: #c9a24d; }

    /* ===== Property finder (step form) ===== */
    .pf-card {
      max-width: 670px;
      margin: 40px auto 0;
      background: #fff;
      border: 1px solid #efece5;
      padding: 50px 56px 56px;
    }

    .pf-step { border-bottom: 1px solid #efece5; }
    .pf-step.is-active { border-bottom: 0; }
    .pf-step.is-hidden { display: none; }

    .pf-q {
      font-size: 14px;
      font-weight: 500;
      color: #111;
      margin: 0;
    }

    /* Collapsed row: question + chosen answer */
    .pf-summary {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      background: none;
      border: 0;
      padding: 30px 0;
      text-align: left;
      cursor: pointer;
    }

    .pf-step:first-child .pf-summary { padding-top: 6px; }

    .pf-answer {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: #dcbf6e;
      font-size: 14px;
      white-space: nowrap;
    }

    .pf-answer i { font-size: 11px; }
    .pf-summary:hover .pf-answer,
    .pf-summary:focus-visible .pf-answer { color: #c9a24d; }
    .pf-summary:focus-visible { outline: 2px solid #dcbf6e; outline-offset: 4px; }

    .pf-step.is-active .pf-summary { display: none; }
    .pf-step:not(.is-active) .pf-body { display: none; }

    /* Open step */
    .pf-body { padding: 30px 0 0; }
    .pf-step:first-child .pf-body { padding-top: 6px; }
    .pf-body .pf-q { margin-bottom: 20px; }

    .pf-options {
      display: grid;
      gap: 16px 12px;
    }

    .pf-cols-2 { grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .pf-cols-3 { grid-template-columns: repeat(3, 1fr); }
    .pf-cols-4 { grid-template-columns: repeat(4, 1fr); }

    .pf-option {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-height: 54px;
      padding: 12px;
      background: #fff;
      border: 1px solid #e3e0d9;
      color: #555;
      font-size: 14px;
      cursor: pointer;
      transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
    }

    .pf-option i { font-size: 17px; color: #777; transition: color 0.2s ease; }

    .pf-option.stacked { flex-direction: column; gap: 10px; min-height: 106px; }
    .pf-cols-4 .pf-option.stacked { min-height: 80px; gap: 6px; }

    .pf-option:hover,
    .pf-option.is-selected { border-color: #dcbf6e; color: #111; }
    .pf-option:hover i,
    .pf-option.is-selected i { color: #c9a24d; }
    .pf-option.is-selected { background: #fdfaf2; }
    .pf-option:focus-visible { outline: 2px solid #dcbf6e; outline-offset: 2px; }

    /* Final */
    .pf-final {
      text-align: center;
      padding-top: 56px;
    }

    .pf-final p {
      font-size: 16px;
      color: #666;
      margin-bottom: 18px;
    }

    .pf-submit {
      background: #dfc06b;
      border: 0;
      color: #fff;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      padding: 17px 32px;
      transition: background 0.2s ease;
    }

    .pf-submit:hover { background: #c9a24d; }
    .pf-submit:focus-visible { outline: 2px solid #111; outline-offset: 3px; }

    @media (max-width: 767.98px) {
      .pf-card { padding: 32px 22px 36px; }
      .pf-cols-3,
      .pf-cols-4 { grid-template-columns: repeat(2, 1fr); }
      .pf-summary { flex-direction: column; align-items: flex-start; gap: 6px; }
    }

    /* ===== Scroll animations ===== */
    .js [data-reveal] {
      opacity: 0;
      transition: opacity 0.9s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1);
    }

    .js [data-reveal="up"] { transform: translateY(40px); }
    .js [data-reveal="left"] { transform: translateX(-50px); }
    .js [data-reveal="right"] { transform: translateX(50px); }
    .js [data-reveal="zoom"] { transform: scale(0.92); }

    .js [data-reveal].is-visible { opacity: 1; transform: none; }

    /* Images: gentle zoom on hover */
    .project-card { overflow: hidden; }
    .project-card .project-img { transition: transform 0.8s ease; }
    .project-card:hover .project-img { transform: scale(1.04); }
    .project-body { position: relative; background: #fff; }
    .value-card { transition: transform 0.4s ease; }
    .value-card:hover { transform: translateY(-6px); }

    /* Hero background slow zoom */
    .hero { overflow: hidden; background-image: none !important; }
    .hero-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
      animation: heroZoom 18s ease-out forwards;
    }
    @keyframes heroZoom { from { transform: scale(1.12); } to { transform: scale(1); } }
    .hero::before { z-index: 1; }
    .hero .container { z-index: 2; }

    @media (prefers-reduced-motion: reduce) {
      .js [data-reveal] { opacity: 1; transform: none; transition: none; }
      .hero-bg { animation: none; }
      .project-card:hover .project-img,
      .value-card:hover { transform: none; }
    }

    /* ===== Footer ===== */
    .site-footer { background: #0b0b0b; color: rgba(255,255,255,0.6); padding: 80px 0 30px; font-size: 14px; }

    .footer-title { font-size: 16px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: #fff; margin-bottom: 18px; }

    .footer-links { list-style: none; padding: 0; margin: 0; }
    .footer-links li { margin-bottom: 10px; }
    .footer-links a { color: rgba(255,255,255,0.6); }
    .footer-links a:hover { color: #c9a24d; }

    .footer-contact li { display: flex; gap: 10px; margin-bottom: 12px; line-height: 1.6; }
    .footer-contact i { color: #c9a24d; }

    .social a {
      width: 36px;
      height: 36px;
      border: 1px solid rgba(255,255,255,0.2);
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      margin-right: 8px;
    }
    .social a:hover { border-color: #c9a24d; color: #c9a24d; }

    .footer-bottom {
      border-top: 1px solid rgba(255,255,255,0.1);
      margin-top: 60px;
      padding-top: 24px;
      font-size: 14px;
    }

    .footer-bottom a { color: rgba(255,255,255,0.5); margin-left: 18px; }
    .footer-bottom a:hover { color: #c9a24d; }

    .disclaimer { font-size: 11px; color: rgba(255,255,255,0.35); margin-top: 18px; line-height: 1.7; }

    /* WhatsApp floating button */
    .whatsapp-float {
      position: fixed;
      right: 24px;
      bottom: 24px;
      width: 56px;
      height: 56px;
      border-radius: 50%;
      background: #25d366;
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      box-shadow: 0 8px 24px rgba(0,0,0,0.25);
      z-index: 50;
    }
    .whatsapp-float:hover { color: #fff; transform: scale(1.05); }

    @media (max-width: 767.98px) {
      .section { padding: 70px 0; }
      .hero { min-height: auto; padding: 130px 0 70px; }
      .story::after { font-size: 220px; }
    }




     /* ===== Project hero ===== */
    .project-hero {
      position: relative;
      min-height: 520px;
      display: flex;
      align-items: flex-end;
      padding: 150px 0 50px;
      color: #fff;
      overflow: hidden;
      background-color: #222;
    }

    .project-hero-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
      animation: heroZoom 18s ease-out forwards;
    }

    .project-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0) 25%),
        linear-gradient(90deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.35) 55%, rgba(0,0,0,0.1) 100%);
    }

    .project-hero .container { position: relative; z-index: 2; }

    @keyframes heroZoom { from { transform: scale(1.12); } to { transform: scale(1); } }

    .crumbs { font-size: 13px; margin-bottom: 14px; }
    .crumbs a { color: rgba(255,255,255,0.85); }
    .crumbs a:hover { color: #c9a24d; }
    .crumbs .sep { margin: 0 6px; color: rgba(255,255,255,0.6); }
    .crumbs .current { color: #dcbf6e; }

    .hero-tag {
      display: inline-block;
      background: #dcbf6e;
      color: #111;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      padding: 7px 14px;
      margin-bottom: 16px;
    }

    .project-hero h1 {
      font-size: clamp(2.4rem, 5vw, 3.6rem);
      font-weight: 700;
      line-height: 1.05;
      margin-bottom: 10px;
    }

    .hero-location { font-size: 18px; font-weight: 300; color: rgba(255,255,255,0.9); margin-bottom: 26px; }

    .hero-facts { display: flex; flex-wrap: wrap; gap: 18px 0; }

    .hero-fact { padding: 0 26px; border-left: 1px solid rgba(255,255,255,0.3); }
    .hero-fact:first-child { padding-left: 0; border-left: 0; }

    .hero-fact .label { font-size: 12px; text-transform: uppercase; color: rgba(255,255,255,0.7); letter-spacing: 0.04em; }
    .hero-fact .value { font-size: 17px; font-weight: 600; margin-top: 2px; }
    .hero-fact .value.price { font-size: 28px; font-weight: 700; color: #dcbf6e; line-height: 1.1; }

    /* ===== Details layout ===== */
    .details-wrap { background: #f8f9fa; padding: 60px 0 70px; }

    .block { margin-bottom: 52px; }

    .block-title { font-size: 22px; font-weight: 600; margin-bottom: 20px; }

    .lead-copy { color: #555; line-height: 1.8; font-size: 16px; margin: 0; }

    .highlights { list-style: none; padding: 0; margin: 0; }
    .highlights li { display: flex; gap: 12px; align-items: baseline; color: #444; margin-bottom: 14px; }
    .highlights i { color: #c9a24d; }

    .unit-chip {
      background: #fff;
      border: 1px solid #e3e3e3;
      padding: 12px 20px;
      font-size: 14px;
      font-weight: 600;
      color: #222;
      transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
    }
    .unit-chip:hover,
    .unit-chip.is-active { border-color: #c9a24d; background: #fdfaf2; color: #111; }

    .amenity {
      background: #fff;
      border: 1px solid #ececec;
      padding: 13px 18px;
      font-size: 14px;
      color: #444;
      display: flex;
      gap: 12px;
      align-items: center;
      height: 100%;
      transition: border-color 0.2s ease, transform 0.2s ease;
    }
    .amenity i { color: #c9a24d; }
    .amenity:hover { border-color: #dcbf6e; transform: translateY(-2px); }

    .pay-box {
      background: #fff;
      border: 1px solid #e3e3e3;
      text-align: center;
      padding: 28px 12px;
      height: 100%;
    }
    .pay-box .pct { font-size: 34px; font-weight: 600; color: #dcbf6e; line-height: 1.1; }
    .pay-box .what { font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; color: #666; margin-top: 8px; }

    .gallery-thumb {
      display: block;
      width: 100%;
      height: 200px;
      border: 0;
      padding: 0;
      position: relative;
      overflow: hidden;
      background: #ddd;
    }
    .gallery-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
    .gallery-thumb::after {
      content: "\F52A";
      font-family: "bootstrap-icons";
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      color: #fff;
      background: rgba(0,0,0,0.35);
      opacity: 0;
      transition: opacity 0.3s ease;
    }
    .gallery-thumb:hover img { transform: scale(1.08); }
    .gallery-thumb:hover::after,
    .gallery-thumb:focus-visible::after { opacity: 1; }

    .gallery-modal .modal-content { background: transparent; border: 0; }
    .gallery-modal .carousel-item img { width: 100%; max-height: 80vh; object-fit: contain; }
    .gallery-modal .btn-close { position: absolute; top: -40px; right: 0; filter: invert(1); opacity: 1; }

    .info-card { background: #fff; border: 1px solid #e5e5e5; padding: 28px; }
    .info-card h2 { font-size: 18px; font-weight: 600; margin-bottom: 16px; }
    .info-card p { font-size: 14px; color: #555; line-height: 1.75; }

    .dev-logo {
      width: 80px;
      height: 80px;
      flex-shrink: 0;
      background: #f3f3f3;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: Georgia, serif;
      font-size: 17px;
      letter-spacing: 0.04em;
      color: #333;
    }
    .dev-logo img {width: 35px;}

    .dev-name { font-size: 16px; font-weight: 600; margin-bottom: 6px; }
    .info-card .dev-desc { font-size: 13px; margin-bottom: 14px; }

    .gold-link { font-size: 13px; color: #c9a24d; }
    .gold-link:hover { color: #9c7a2f; }
    .gold-link i { transition: transform 0.2s ease; display: inline-block; }
    .gold-link:hover i { transform: translateX(3px); }

    .area-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
    .area-tags span { background: #f3f3f3; border: 1px solid #ebebeb; font-size: 11px; color: #555; padding: 4px 10px; }

    /* ===== Sidebar ===== */
    .enquiry-side {
      position: sticky;
      top: 24px;
      background: #f7f5f0;
      padding: 26px 22px;
    }

    .enquiry-side h2 { font-size: 18px; font-weight: 600; margin-bottom: 6px; }
    .enquiry-side .side-sub { font-size: 13px; color: #555; line-height: 1.6; margin-bottom: 22px; }

    .call-box { text-align: center; border-top: 1px solid #dedad0; margin-top: 28px; padding-top: 22px; }
    .call-box span { font-size: 13px; color: #777; }
    .call-box a { display: block; font-size: 18px; font-weight: 600; color: #dcbf6e; margin-top: 4px; }
    .call-box a:hover { color: #c9a24d; }

    /* ===== Property finder (step form) ===== */
    .pf-card {
      max-width: 670px;
      margin: 40px auto 0;
      background: #fff;
      border: 1px solid #efece5;
      padding: 50px 56px 56px;
    }

    .pf-step { border-bottom: 1px solid #efece5; }
    .pf-step.is-active { border-bottom: 0; }
    .pf-step.is-hidden { display: none; }

    .pf-q {
      font-size: 14px;
      font-weight: 500;
      color: #111;
      margin: 0;
    }

    /* Collapsed row: question + chosen answer */
    .pf-summary {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      background: none;
      border: 0;
      padding: 30px 0;
      text-align: left;
      cursor: pointer;
    }

    .pf-step:first-child .pf-summary { padding-top: 6px; }

    .pf-answer {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: #dcbf6e;
      font-size: 14px;
      white-space: nowrap;
    }

    .pf-answer i { font-size: 11px; }
    .pf-summary:hover .pf-answer,
    .pf-summary:focus-visible .pf-answer { color: #c9a24d; }
    .pf-summary:focus-visible { outline: 2px solid #dcbf6e; outline-offset: 4px; }

    .pf-step.is-active .pf-summary { display: none; }
    .pf-step:not(.is-active) .pf-body { display: none; }

    /* Open step */
    .pf-body { padding: 30px 0 0; }
    .pf-step:first-child .pf-body { padding-top: 6px; }
    .pf-body .pf-q { margin-bottom: 20px; }

    .pf-options {
      display: grid;
      gap: 16px 12px;
    }

    .pf-cols-2 { grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .pf-cols-3 { grid-template-columns: repeat(3, 1fr); }
    .pf-cols-4 { grid-template-columns: repeat(4, 1fr); }

    .pf-option {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-height: 54px;
      padding: 12px;
      background: #fff;
      border: 1px solid #e3e0d9;
      color: #555;
      font-size: 14px;
      cursor: pointer;
      transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
    }

    .pf-option i { font-size: 17px; color: #777; transition: color 0.2s ease; }

    .pf-option.stacked { flex-direction: column; gap: 10px; min-height: 106px; }
    .pf-cols-4 .pf-option.stacked { min-height: 80px; gap: 6px; }

    .pf-option:hover,
    .pf-option.is-selected { border-color: #dcbf6e; color: #111; }
    .pf-option:hover i,
    .pf-option.is-selected i { color: #c9a24d; }
    .pf-option.is-selected { background: #fdfaf2; }
    .pf-option:focus-visible { outline: 2px solid #dcbf6e; outline-offset: 2px; }

    /* Final */
    .pf-final {
      text-align: center;
      padding-top: 56px;
    }

    .pf-final p {
      font-size: 16px;
      color: #666;
      margin-bottom: 18px;
    }

    .pf-submit {
      background: #dfc06b;
      border: 0;
      color: #fff;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      padding: 17px 32px;
      transition: background 0.2s ease;
    }

    .pf-submit:hover { background: #c9a24d; }
    .pf-submit:focus-visible { outline: 2px solid #111; outline-offset: 3px; }

    @media (max-width: 767.98px) {
      .pf-card { padding: 32px 22px 36px; }
      .pf-cols-3,
      .pf-cols-4 { grid-template-columns: repeat(2, 1fr); }
      .pf-summary { flex-direction: column; align-items: flex-start; gap: 6px; }
    }

    /* Compact version of the step form for the sidebar */
    .pf-compact.pf-card { max-width: none; margin: 0; padding: 0; border: 0; background: transparent; }
    .pf-compact .pf-q { font-size: 13px; }
    .pf-compact .pf-body .pf-q { margin-bottom: 14px; }
    .pf-compact .pf-summary { padding: 16px 0; flex-direction: column; align-items: flex-start; gap: 4px; }
    .pf-compact .pf-step:first-child .pf-summary { padding-top: 0; }
    .pf-compact .pf-step { border-color: #e4e0d6; }
    .pf-compact .pf-body { padding-top: 16px; }
    .pf-compact .pf-step:first-child .pf-body { padding-top: 0; }
    .pf-compact .pf-answer { font-size: 13px; }
    .pf-compact .pf-options,
    .pf-compact .pf-cols-3,
    .pf-compact .pf-cols-4 { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .pf-compact .pf-option { font-size: 13px; min-height: 48px; padding: 10px 8px; }
    .pf-compact .pf-option.stacked { min-height: 76px; gap: 8px; }
    .pf-compact .pf-cols-4 .pf-option.stacked { min-height: 70px; }
    .pf-compact .pf-final { padding-top: 26px; }
    .pf-compact .pf-final p { font-size: 14px; }
    .pf-compact .pf-submit { width: 100%; }

    /* ===== Similar projects ===== */
    .similar { padding: 80px 0 90px; }
    .similar h2 { font-size: 26px; font-weight: 600; margin-bottom: 26px; }

    .sim-card { display: block; color: #1a1a1a; }
    .sim-img { height: 250px; overflow: hidden; margin-bottom: 14px; }
    .sim-img div { height: 100%; transition: transform 0.8s ease; }
    .sim-card:hover .sim-img div { transform: scale(1.06); }
    .sim-card h3 { font-size: 17px; font-weight: 600; margin-bottom: 2px; transition: color 0.2s ease; }
    .sim-card:hover h3 { color: #dcbf6e; }
    .sim-loc { font-size: 13px; color: #777; }
    .sim-price {font-size: 12px;
  font-weight: 500;
  color: #dcbf6e;
  margin-top: 8px;
  margin-bottom: 5px; }

   .advisor-section::after{display: none;} 

    /* ===== Scroll animations ===== */
    .js [data-reveal] {
      opacity: 0;
      transition: opacity 0.9s cubic-bezier(0.2,0.7,0.2,1), transform 0.9s cubic-bezier(0.2,0.7,0.2,1);
    }
    .js [data-reveal="up"] { transform: translateY(36px); }
    .js [data-reveal="left"] { transform: translateX(-46px); }
    .js [data-reveal="right"] { transform: translateX(46px); }
    .js [data-reveal="zoom"] { transform: scale(0.92); }
    .js [data-reveal].is-visible { opacity: 1; transform: none; }

    @media (max-width: 991.98px) {
      .enquiry-side { position: static; margin-top: 10px; }
    }

    @media (max-width: 575.98px) {
      .hero-fact { padding: 0 16px; }
      .hero-fact .value.price { font-size: 23px; }
      .gallery-thumb { height: 230px; }
    }

    @media (prefers-reduced-motion: reduce) {
      .js [data-reveal] { opacity: 1; transform: none; transition: none; }
      .project-hero-bg, .whatsapp-float { animation: none; }
      .gallery-thumb:hover img, .sim-card:hover .sim-img div, .amenity:hover { transform: none; }
    }


    /* Ambient Neon Glows */
    .glow-blob {
      position: absolute;
      border-radius: 50%;
      filter: blur(100px);
      pointer-events: none;
      z-index: 0;
    }

    .glow-blob-1 {
      top: -80px;
      left: -80px;
      width: 450px;
      height: 450px;
      background: radial-gradient(circle, rgb(201, 162, 77) 0%, rgb(9, 8, 5) 60%, transparent 80%);
    }

    .glow-blob-2 {
      top: -100px;
      right: -80px;
      width: 500px;
      height: 450px;
      background: radial-gradient(circle, rgb(110, 96, 65) 0%, rgb(30, 24, 9) 60%, transparent 80%);
    }

    .glow-blob-3 {
      bottom: -100px;
      right: -50px;
      width: 500px;
      height: 400px;
      background: radial-gradient(circle, rgb(201, 162, 77) 0%, rgb(9, 8, 5) 60%, transparent 80%);
    }

    /* Subtle Dot Patterns */
    .dots-grid {
      position: absolute;
      width: 80px;
      height: 60px;
      background-image: radial-gradient(rgba(147, 197, 253, 0.45) 1.5px, transparent 1.5px);
      background-size: 14px 14px;
      z-index: 1;
      opacity: 0.6;
    }

    .dots-left {
      top: 240px;
      left: 20px;
    }

    .dots-right {
      bottom: 240px;
      right: 25px;
    }

    /* Content Wrapper */
    .team-content {
      position: relative;
      z-index: 2;
    }
    /* ================= TEAM CARDS GRID ================= */
    .cards-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 28px;
      margin-bottom: 50px;
    }

    .team-card {
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      border-radius: 26px;
      padding: 30px;
      display: flex;text-align: left;
      gap: 28px;
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
      position: relative;
      transition: border-color 0.3s ease, transform 0.3s ease;
    }

    .team-card:hover {
      border-color: #c9a24d;
      transform: translateY(-3px);
    }

    /* Image Stack Wrapper */
    .card-photo-wrapper {
      position: relative;
      width: 205px;
      min-width: 205px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .team-card .hero-badge{font-size: 14px;border-radius: 3px;}
    .team-card .hero-badge::before{display: none;}

    /* Layered backdrop frame effect */
    .photo-backdrop {
      position: absolute;
      inset: -6px;
      border-radius: 22px;
      border: 1.5px solid rgba(139, 92, 246, 0.45);
      z-index: 1;
      pointer-events: none;
    }

    .photo-backdrop-tilted {
      transform: rotate(-3.5deg) scale(0.97);border-color: rgb(108, 89, 48);
  background: rgb(26, 21, 9);
    }

    .photo-backdrop-neon {
      transform: rotate(2deg) scale(1.02);
      border-color: rgb(108, 89, 48);
  background: rgb(26, 21, 9);
    }

    .card-photo {
      position: relative;
      width: 100%;
      height: 290px;
      object-fit: cover;
      border-radius: 18px;
      z-index: 2;
      box-shadow: 0 10px 25px rgba(0, 0, 0, 0.6);
    }

    /* Card Details Right */
    .card-info {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .member-role {
      font-size: 12px;
      font-weight: 600;
      color: #c9a24d;
      letter-spacing: 2px;
      text-transform: uppercase;
      margin-bottom: 6px;
    }

    .member-name {
      font-size: 24px;
      font-weight: 800;
      letter-spacing: 0.5px;
      margin-bottom: 14px;
    }

    .member-name span.gradient-name {color: #fff;font-weight: 500;
    }

    .bio-title {
      font-size: 13.5px;
      font-weight: 500;
      color: #ffffff;
      margin-bottom: 6px;
    }

    .bio-text {
      font-size: 12.5px;
      line-height: 1.55;
      color: var(--text-muted);
      margin-bottom: 20px;
    }

    /* Skills Progress Bars */
    .skills-list {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .skill-item {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .skill-label {
      font-size: 11.5px;
      font-weight: 600;
      color: #e2e8f0;
      min-width: 130px;
    }

    .skill-track {
      flex: 1;
      height: 7px;
      background: var(--bar-track);
      border-radius: 999px;
      overflow: hidden;
      position: relative;
    }

    .skill-progress {
      height: 100%;
      border-radius: 999px;
      background: var(--gradient-bar);
    }

    .skill-percent {
      font-size: 12px;
      font-weight: 600;
      color: #cbd5e1;
      width: 32px;
      text-align: right;
    }
    /* ================= RESPONSIVE ================= */
    @media (max-width: 1024px) {
      .cards-grid {
        grid-template-columns: 1fr;
        max-width: 650px;
        margin-left: auto;
        margin-right: auto;
      }
    }

    @media (max-width: 600px) {
      .team-card {
        flex-direction: column;
        align-items: center;
        padding: 24px 20px;
      }

      .card-photo-wrapper {
        width: 100%;
        max-width: 240px;
      }

      .card-photo {
        height: 260px;
      }

      .skill-label {
        min-width: 110px;
      }

      .section-title {
        font-size: 32px;
      }
    }