:root {
      --gold: #C9A84C;
      --ivory: #FAF7F2;
      --champagne: #F5ECD7;
    }

    * { scroll-behavior: smooth; }

    body {
      background-color: #FAF7F2;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-size: 16px;
      font-weight: 400;
      line-height: 24px;
      color: rgb(84, 84, 84);
    }

    /* ── Navbar glassmorphism ── */
    .navbar-glass {
      background: rgba(250, 247, 242, 0.92);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(201,168,76,0.2);
    }

    /* ── Gold gradient button ── */
    .btn-gold {
      background: linear-gradient(135deg, #D4AF5C 0%, #C9A84C 50%, #B8930A 100%);
      color: #fff;
      letter-spacing: 0.08em;
      transition: all 0.35s ease;
      box-shadow: 0 4px 20px rgba(201,168,76,0.35);
    }
    .btn-gold:hover {
      transform: translateY(-2px);
      box-shadow: 0 8px 30px rgba(201,168,76,0.5);
      filter: brightness(1.08);
    }

    /* ── Outline gold button ── */
    .btn-outline-gold {
      border: 1.5px solid #C9A84C;
      color: #C9A84C;
      letter-spacing: 0.08em;
      transition: all 0.35s ease;
    }
    .btn-outline-gold:hover {
      background: #C9A84C;
      color: #fff;
      transform: translateY(-2px);
    }

    /* ── Hero ── */
    .hero-gradient {
      background: linear-gradient(160deg, rgba(10,8,5,0.65) 0%, rgba(20,14,5,0.4) 60%, rgba(201,168,76,0.15) 100%);
    }

    /* ── Service card ── */
    .service-card {
      transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    }
    .service-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 20px 60px rgba(0,0,0,0.12), 0 0 0 1px rgba(201,168,76,0.2);
    }
    .service-card:hover .card-icon { transform: scale(1.15); }

    /* ── Section divider ornament ── */
    .ornament::before,
    .ornament::after {
      content: '';
      display: inline-block;
      width: 60px;
      height: 1px;
      background: linear-gradient(to right, transparent, #C9A84C);
      vertical-align: middle;
      margin: 0 12px;
    }
    .ornament::after { background: linear-gradient(to left, transparent, #C9A84C); }

    /* ── Review card ── */
    .review-card { transition: transform 0.3s ease, box-shadow 0.3s ease; }
    .review-card:hover { transform: translateY(-5px); box-shadow: 0 16px 50px rgba(0,0,0,0.1); }

    /* ── Package card ── */
    .package-card { transition: all 0.4s ease; }
    .package-card:hover { transform: translateY(-6px); }
    .package-card.featured {
      background: linear-gradient(145deg, #1a130a, #2a1f0e);
      border-color: #C9A84C;
    }

    /* ── WhatsApp float ── */
    .whatsapp-float {
      position: fixed; bottom: 28px; right: 28px; z-index: 1000;
      width: 60px; height: 60px; border-radius: 50%;
      background: linear-gradient(135deg, #25D366, #128C7E);
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 6px 25px rgba(37,211,102,0.45);
      transition: all 0.3s ease;
    }
    .whatsapp-float:hover { transform: scale(1.12); box-shadow: 0 10px 35px rgba(37,211,102,0.6); }
    .whatsapp-float svg { width: 32px; height: 32px; fill: white; }

    /* ── Gold underline heading ── */
    .gold-underline { position: relative; display: inline-block; }
    .gold-underline::after {
      content: '';
      position: absolute; bottom: -8px; left: 50%; transform: translateX(-50%);
      width: 60px; height: 2px;
      background: linear-gradient(to right, #D4AF5C, #C9A84C, #B8930A);
    }

    /* ── Scroll reveal animation ── */
    .reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.7s ease, transform 0.7s ease; }
    .reveal.visible { opacity: 1; transform: translateY(0); }

    /* ── Nav link ── */
    .nav-link {
      position: relative;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-size: 16px;
      font-weight: 400;
      line-height: normal;
      color: rgb(84, 84, 84);
      transition: color 0.3s;
    }
    .nav-link::after {
      content: ''; position: absolute; bottom: -8px; left: 0; width: 0; height: 1.5px;
      background: #C9A84C; transition: width 0.35s ease;
    }
    .nav-link:hover { color: #C9A84C; }
    .nav-link:hover::after { width: 100%; }

    /* ── Branch card ── */
    .branch-card { transition: all 0.35s ease; }
    .branch-card:hover { transform: translateY(-5px); box-shadow: 0 20px 50px rgba(0,0,0,0.1); }

    /* ── Mobile menu ── */
    #mobile-menu { transition: all 0.35s ease; }

    /* ── Instagram grid hover ── */
    .insta-item { transition: all 0.3s ease; overflow: hidden; }
    .insta-item:hover .insta-overlay { opacity: 1; }
    .insta-overlay { opacity: 0; transition: opacity 0.3s ease; }