:root{
   --bg:#0a0906;
   --bg-panel:#131109;
   --bg-panel-2:#1b1811;
   --gold:#c9a24d;
   --gold-light:#e8ca86;
   --gold-dim:#8a713a;
   --ivory:#f3ecdd;
   --muted:#a89d86;
   --divider:#2a2618;
   --radius:10px;
   --serif: 'Vazirmatn', sans-serif;
  }
*{
   box-sizing:border-box; 
   margin:0; padding:0;
  }
html{
  scroll-behavior:smooth;
  }
body{
   background:var(--bg); 
   color:var(--ivory); 
   font-family:var(--serif); 
   font-weight:400; 
   line-height:1.9; 
   overflow-x:hidden; 
   padding-bottom:64px;
  }
a{
   color:inherit;
   text-decoration:none;
  }
img{
   max-width:100%; 
   display:block;
  }
.container{
   max-width:1180px; 
   margin:0 auto; 
   padding:0 20px;
  }
.eyebrow{
   display:flex; 
   align-items:center; 
   gap:10px; 
   color:var(--gold); 
   font-size:13px; 
   letter-spacing:2px; 
   text-transform:uppercase; 
   font-weight:600; 
   margin-bottom:10px; 
   justify-content:center;
  }
.eyebrow::before, .eyebrow::after{
   content:""; 
   width:22px; 
   height:1px; 
   background:var(--gold-dim);
  }
h1,h2,h3{
   font-weight:800; 
   color:var(--ivory);
  }
.section{
   padding:72px 0;
  }
.section.alt{
   background:var(--bg-panel);
  }
.btn{
   display:inline-flex; 
   align-items:center; 
   justify-content:center; 
   gap:8px; 
   padding:14px 30px; 
   border-radius:var(--radius); 
   font-size:14px; 
   font-weight:700; 
   cursor:pointer; 
   border:1px solid transparent; 
   transition:.25s; 
   letter-spacing:.3px;
  }
.btn-gold{
   background:linear-gradient(180deg,var(--gold-light),var(--gold)); 
   color:#1a1408;
  }
.btn-gold:hover{
  border-color: var(--gold-dim);
  color: var(--gold-light);
  background: #0000009c;
  }
.btn-outline{
   border-color:var(--gold-dim); 
   color:var(--gold-light); 
   background:#0000009c;
  }
.btn-outline:hover{ 
   border-color: var(--gold);
   background: linear-gradient(180deg, var(--gold-light), var(--gold));
   color: #1a1408;
  }



/* Header */
header{
   position:fixed; 
   top:0; 
   right:0; 
   left:0; 
   z-index:100; 
   background:rgba(10,9,6,.9); 
   backdrop-filter:blur(10px); 
   border-bottom:1px solid var(--divider);
  }
header .container{
   display:flex; 
   align-items:center; 
   justify-content:space-between; 
   height:78px;
  }
.brand{
   display:flex; 
   align-items:center; 
   gap:12px;
  }
.brand-mark{
   width:44px; 
   height:44px; 
   border:1px solid var(--gold-dim); 
   border-radius:50%; 
   display:flex; 
   align-items:center; 
   justify-content:center; 
   color:var(--gold); 
   font-family:serif; 
   font-size:20px;
  }
.brand-text .name{
   font-size:16px; 
   font-weight:800; 
   color:var(--ivory);
  }
.brand-text .sub{
   font-size:9px; 
   letter-spacing:3px; 
   color:var(--muted); 
   text-transform:uppercase;
  }
nav.main-nav{
   display:flex; 
   gap:34px;
  }
nav.main-nav a{
   font-size:14px; 
   color:var(--muted); 
   position:relative; 
   padding:6px 0;
  }
nav.main-nav a:hover, nav.main-nav a.active{
   color:var(--gold-light);
  }
nav.main-nav a.active::after{
   content:""; 
   position:absolute; 
   bottom:-3px; 
   right:0; 
   left:0; 
   height:1px; 
   background:var(--gold);
}
.header-actions{
   display:flex; 
   align-items:center; 
   gap:16px;
  }
.phone-pill{
   display:flex; 
   align-items:center; 
   gap:8px; 
   color:var(--ivory); 
   font-size:14px; 
   font-weight:600;
  }
.phone-pill span.ico{
   color:var(--gold);
  }
.burger{
   display:none; 
   background:none; 
   border:none; 
   color:var(--ivory); 
   font-size:22px; 
   cursor:pointer;
  }



/* Drawer */
.drawer-overlay{
   position:fixed; 
   inset:0; 
   background:rgba(0,0,0,.55); 
   z-index:200; 
   opacity:0; 
   pointer-events:none; 
   transition:.3s;
  }
.drawer-overlay.open{
   opacity:1; 
   pointer-events:auto;
  }
.drawer{
   position:fixed; 
   top:0; 
   bottom:0; 
   right:0; 
   width:min(300px,80vw); 
   z-index:201; 
   background:var(--bg-panel); 
   border-left:1px solid var(--divider); 
   transform:translateX(100%); 
   transition:.35s cubic-bezier(.4,0,.2,1); 
   display:flex; 
   flex-direction:column; 
   padding:26px 24px;
  }
.drawer.open{
   transform:translateX(0);
  }
.drawer-close{
   align-self:flex-start; 
   background:none; 
   border:none; 
   color:var(--ivory); 
   font-size:22px; 
   margin-bottom:30px; 
   cursor:pointer;
  }
.drawer nav{
   display:flex; 
   flex-direction:column; 
   gap:22px; 
   margin-bottom:auto;
  }
.drawer nav a{
   font-size:16px; 
   color:var(--ivory);
  }
.drawer .btn{
   margin-top:30px; 
   width:100%;
  }



/* Status badges (shared room status vocabulary across pages) */
.status{
   display:flex; 
   align-items:center; 
   gap:6px; 
   font-size:11px; 
   padding:5px 10px; 
   border-radius:20px;
  }
.status .dot{
   width:7px; 
   height:7px; 
   border-radius:50%;
  }
.status.free .dot{
   background:#5fbf7a;
  }
.status.busy .dot{
   background:#d1594f;
  }
.status.preparing .dot{
   background:#d8b34a;
  }
.status.out_of_service .dot{
   background:#8a8579;
  }



/* Footer */
footer{
   background:#060502; 
   border-top:1px solid var(--divider); 
   padding:64px 0 24px;
  }
.footer-grid{
   display:grid; 
   grid-template-columns:1.4fr 1fr 1fr 1.2fr; 
   gap:40px; 
   margin-bottom:50px;
  }
.footer-col h4{
   font-size:14px; 
   color:var(--gold-light); 
   margin-bottom:18px;
  }
.footer-col ul{
   list-style:none; 
   display:flex; 
   flex-direction:column; 
   gap:11px;
  }
.footer-col ul a{
   font-size:13px; 
   color:var(--muted);
  }
.footer-col ul a:hover{
   color:var(--gold-light);
  }
.footer-col p{
   font-size:13px; 
   color:var(--muted); 
   margin-bottom:16px;
  }
.footer-bottom{
   border-top:1px solid var(--divider); 
   padding-top:22px; 
   display:flex; 
   justify-content:space-between; 
   color:var(--muted); 
   font-size:12px; 
   flex-wrap:wrap; 
   gap:10px;
  }



/* Sticky mobile call bar */
.mobile-call-bar{
   display:none; 
   position:fixed; 
   bottom:0; 
   right:0; 
   left:0; 
   z-index:150; 
   background:linear-gradient(180deg,var(--gold-light),var(--gold));
   color:#1a1408;
   padding:14px 20px; 
   text-align:center; 
   font-weight:700; 
   font-size:14.5px; 
   box-shadow:0 -6px 20px rgba(0,0,0,.4);
  }

@media (max-width:860px){
  nav.main-nav{
    display:none;
  }
  .header-actions .phone-pill{
    display:none;
  }
  .burger{
    display:block;
  }
  .mobile-call-bar{
    display:block;
  }
  body{
    padding-bottom:70px;
  }
}
@media (max-width:1024px){
   .footer-grid{
       grid-template-columns:1fr 1fr;
      } 
    }