/* ——— TOP BAR ——— */
 #topbar {
     background: var(--dark);
     color: #ccc;
     font-size: 13px;
     padding: 7px 0;
 }

 #topbar .inner {
     display: flex;
     justify-content: space-between;
     align-items: center;
     gap: 12px;
     flex-wrap: wrap;
 }

 #topbar a {
     color: #e8d8bf;
 }

 #topbar .social a {
     margin-left: 10px;
     font-size: 14px;
 }

 #topbar .social a:hover {
     color: var(--gold-light);
 }

 /* ——— HEADER ——— */
 #header {
     background: #fff;
     border-bottom: 1px solid var(--border);
     position: sticky;
     top: 0;
     z-index: 1000;
     box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
 }

 #header .inner {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 14px 20px;
     gap: 20px;
 }

 .logo-txt {
     font-family: "Playfair Display", serif;
     font-size: 22px;
     font-weight: 700;
     color: var(--dark);
     line-height: 1.2;
 }

 .logo-txt span {
     color: var(--gold);
 }

 .logo-sub {
     font-size: 11px;
     color: var(--text-light);
     font-family: "DM Sans", sans-serif;
     letter-spacing: 1px;
 }

 nav {
     display: flex;
     align-items: center;
     gap: 6px;
     flex-wrap: wrap;
 }

 nav a {
     font-size: 14px;
     font-weight: 500;
     color: var(--text);
     padding: 7px 12px;
     border-radius: 5px;
     transition:
         color 0.15s,
         background 0.15s;
 }

 nav a:hover {
     color: var(--gold);
     background: #fff8ec;
 }

 .nav-dropdown {
     position: relative;
 }

 .nav-dropdown .nav-trigger {
     display: inline-flex;
     align-items: center;
     gap: 5px;
     font-size: 14px;
     font-weight: 500;
     color: var(--text);
     padding: 7px 12px;
     border-radius: 5px;
     cursor: pointer;
     transition:
         color 0.15s,
         background 0.15s;
 }

 .nav-dropdown .nav-trigger:hover,
 .nav-dropdown:hover .nav-trigger {
     color: var(--gold);
     background: #fff8ec;
 }

 .nav-dropdown .chevron {
     font-size: 11px;
     color: var(--text-light);
     transition: transform 0.2s;
 }

 .nav-dropdown:hover .chevron {
     transform: rotate(180deg);
 }

 .nav-dropdown .dropdown-menu {
     display: none;
     position: absolute;
     top: 100%;
     left: 0;
     background: #fff;
     border: 1px solid var(--border);
     border-radius: 8px;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
     min-width: 220px;
     padding: 6px 0;
     z-index: 2000;
     list-style: none;
 }

 .nav-dropdown:hover .dropdown-menu {
     display: block;
 }

 .nav-dropdown .dropdown-menu li a {
     display: block;
     padding: 11px 18px;
     font-size: 14px;
     font-weight: 500;
     color: var(--text);
     border-bottom: 1px solid var(--border);
     transition:
         background 0.15s,
         color 0.15s;
 }

 .nav-dropdown .dropdown-menu li:last-child a {
     border-bottom: none;
 }

 .nav-dropdown .dropdown-menu li a:hover {
     background: #fff8ec;
     color: var(--gold);
 }

 .header-cta {
     display: flex;
     align-items: center;
     gap: 14px;
     flex-shrink: 0;
 }

 .phone-badge {
     display: flex;
     align-items: center;
     gap: 8px;
     background: var(--cream);
     border: 1px solid var(--border);
     padding: 8px 16px;
     border-radius: 8px;
     white-space: nowrap;
 }

 .phone-badge i {
     color: var(--gold);
     font-size: 16px;
 }

 .phone-badge .num {
     font-weight: 700;
     font-size: 15px;
     color: var(--dark);
 }

 .phone-badge .lbl {
     font-size: 11px;
     color: var(--text-light);
 }

 /* ——— HAMBURGER BUTTON ——— */
 .hamburger {
     display: none;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     width: 42px;
     height: 42px;
     background: var(--cream);
     border: 1px solid var(--border);
     border-radius: 8px;
     cursor: pointer;
     gap: 5px;
     flex-shrink: 0;
     transition: background 0.2s;
     z-index: 1100;
 }

 .hamburger:hover {
     background: #fff3dc;
 }

 .hamburger span {
     display: block;
     width: 20px;
     height: 2px;
     background: var(--dark);
     border-radius: 2px;
     transition:
         transform 0.3s,
         opacity 0.3s,
         width 0.3s;
     transform-origin: center;
 }

 .hamburger.open span:nth-child(1) {
     transform: translateY(7px) rotate(45deg);
 }

 .hamburger.open span:nth-child(2) {
     opacity: 0;
     width: 0;
 }

 .hamburger.open span:nth-child(3) {
     transform: translateY(-7px) rotate(-45deg);
 }

 /* ——— MOBILE NAV OVERLAY ——— */
 .mobile-nav-overlay {
     display: none;
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.4);
     z-index: 1050;
     opacity: 0;
     transition: opacity 0.3s;
 }

 .mobile-nav-overlay.open {
     opacity: 1;
 }

 /* ——— MOBILE DRAWER ——— */
 .mobile-drawer {
     position: fixed;
     top: 0;
     right: -320px;
     width: 300px;
     height: 100%;
     background: #fff;
     z-index: 1100;
     overflow-y: auto;
     transition: right 0.32s cubic-bezier(0.4, 0, 0.2, 1);
     box-shadow: -4px 0 24px rgba(0, 0, 0, 0.13);
     display: flex;
     flex-direction: column;
 }

 .mobile-drawer.open {
     right: 0;
 }

 .mobile-drawer-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 16px 18px;
     border-bottom: 1px solid var(--border);
     background: var(--dark);
 }

 .mobile-drawer-header .logo-txt {
     color: #fff;
     font-size: 18px;
 }

 .mobile-drawer-header .logo-txt span {
     color: var(--gold-light);
 }

 .mobile-drawer-close {
     background: none;
     border: none;
     color: #fff;
     font-size: 22px;
     cursor: pointer;
     width: 34px;
     height: 34px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 6px;
     transition: background 0.2s;
 }

 .mobile-drawer-close:hover {
     background: rgba(255, 255, 255, 0.15);
 }

 .mobile-nav-list {
     list-style: none;
     padding: 10px 0;
     flex: 1;
 }

 .mobile-nav-list>li {
     border-bottom: 1px solid var(--border);
 }

 .mobile-nav-list>li:last-child {
     border-bottom: none;
 }

 .mobile-nav-list>li>a,
 .mobile-nav-trigger {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 14px 20px;
     font-size: 15px;
     font-weight: 600;
     color: var(--dark);
     cursor: pointer;
     transition:
         background 0.15s,
         color 0.15s;
     background: none;
     border: none;
     width: 100%;
     text-align: left;
     font-family: "DM Sans", sans-serif;
 }

 .mobile-nav-list>li>a:hover,
 .mobile-nav-trigger:hover {
     background: #fff8ec;
     color: var(--gold);
 }

 .mobile-nav-trigger .m-chevron {
     font-size: 12px;
     color: var(--text-light);
     transition: transform 0.25s;
 }

 .mobile-nav-trigger.open .m-chevron {
     transform: rotate(180deg);
     color: var(--gold);
 }

 .mobile-submenu {
     display: none;
     background: #fdf9f3;
     border-top: 1px solid var(--border);
     list-style: none;
 }

 .mobile-submenu.open {
     display: block;
 }

 .mobile-submenu li a {
     display: block;
     padding: 11px 20px 11px 34px;
     font-size: 14px;
     color: var(--text);
     border-bottom: 1px solid #f0e6d3;
     transition:
         background 0.15s,
         color 0.15s;
 }

 .mobile-submenu li:last-child a {
     border-bottom: none;
 }

 .mobile-submenu li a:hover {
     background: #fff3dc;
     color: var(--gold);
 }

 .mobile-drawer-cta {
     padding: 16px 18px;
     border-top: 1px solid var(--border);
     display: flex;
     flex-direction: column;
     gap: 10px;
 }

 .mobile-drawer-cta .btn-primary {
     text-align: center;
     display: block;
 }

 .mobile-drawer-cta .phone-badge {
     justify-content: center;
 }

 /* ——— RESPONSIVE BREAKPOINTS ——— */
 @media (max-width: 1024px) {

     nav,
     .header-cta {
         display: none;
     }

     .hamburger {
         display: flex;
     }
 }

 @media (max-width: 480px) {
     .mobile-drawer {
         width: 100%;
         right: -100%;
     }
 }