:root{
    --navy:#0f2438;
    --navy-deep:#081420;
    --teal:#0e5c56;
    --teal-light:#166b63;
    --gold:#c9a24b;
    --gold-light:#e2c584;
    --sand:#e9dfc7;
    --ivory:#faf7ef;
    --ink:#1a1a1a;
    --line:rgba(201,162,75,0.35);
    --shadow: 0 20px 50px rgba(8,20,32,0.18);
    --display-ar: 'Aref Ruqaa', serif;
    --body-ar: 'Tajawal', sans-serif;
    --display-lat: 'Cormorant Garamond', serif;
    --body-lat: 'Jost', sans-serif;
    --radius: 2px;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--ivory);
    color:var(--navy);
    font-family:var(--body-ar);
    line-height:1.75;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
  }
  body[data-lang="en"],body[data-lang="fr"],body[data-lang="ms"]{font-family:var(--body-lat);}
  body[data-lang="ur"]{font-family:'Tajawal', 'Noto Nastaliq Urdu', serif;}
  h1,h2,h3,.display{font-family:var(--display-ar); font-weight:700;}
  body[data-lang="en"] h1, body[data-lang="en"] h2, body[data-lang="en"] h3,
  body[data-lang="fr"] h1, body[data-lang="fr"] h2, body[data-lang="fr"] h3,
  body[data-lang="ms"] h1, body[data-lang="ms"] h2, body[data-lang="ms"] h3{
    font-family:var(--display-lat); font-weight:600; letter-spacing:0.01em;
  }
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  ul{list-style:none;}
  button{font:inherit; cursor:pointer; border:none; background:none;}
  .container{max-width:1180px; margin:0 auto; padding:0 24px;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:0.72rem; letter-spacing:0.22em; text-transform:uppercase;
    color:var(--teal); font-family:var(--body-lat); font-weight:600;
    margin-bottom:14px;
  }
  .eyebrow::before{content:""; width:26px; height:1px; background:var(--gold);}
  section{position:relative; padding:96px 0;}
  .sand-bg{background:var(--sand);}
  .navy-bg{background:var(--navy); color:var(--ivory);}
  .navy-bg .eyebrow{color:var(--gold-light);}

  /* geometric star motif (signature element) */
  .star-motif{position:absolute; opacity:0.08; pointer-events:none;}
  .divider-seal{
    width:54px; height:54px; margin:0 auto 20px; opacity:0.9;
  }

  /* NAV */
  header.nav{
    position:fixed; top:0; left:0; right:0; z-index:500;
    background:rgba(8,20,32,0.55); backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(201,162,75,0.25);
    transition:background .3s ease;
  }
  header.nav.solid{background:rgba(8,20,32,0.92);}
  .nav-inner{display:flex; align-items:center; justify-content:space-between; padding:16px 24px; max-width:1180px; margin:0 auto;}
  .brand{font-family:var(--display-ar); font-size:1.5rem; color:var(--ivory); letter-spacing:0.02em;}
  .brand span{color:var(--gold-light); font-size:0.65rem; display:block; font-family:var(--body-lat); letter-spacing:0.2em; text-transform:uppercase; margin-top:2px;}
  .nav-right{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
  .lang-chips{display:flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:20px; padding:4px; background:rgba(255,255,255,0.03);}
  .lang-chip{
    color:var(--sand); padding:6px 11px; border-radius:16px; font-size:0.74rem; font-weight:600;
    letter-spacing:0.03em; font-family:var(--body-lat); transition:background .2s ease, color .2s ease;
  }
  .lang-chip:hover{color:var(--ivory);}
  .lang-chip.active{background:var(--gold); color:var(--navy-deep);}
  .nav-wa{
    background:var(--gold); color:var(--navy-deep); padding:9px 18px; border-radius:20px;
    font-size:0.82rem; font-weight:600; display:flex; align-items:center; gap:6px;
  }

  /* HERO */
  .hero{
    min-height:100svh; display:flex; align-items:flex-end;
    background:
      linear-gradient(180deg, rgba(8,20,32,0.35) 0%, rgba(8,20,32,0.55) 45%, rgba(8,20,32,0.96) 100%),
      radial-gradient(ellipse at 30% 20%, rgba(14,92,86,0.55), transparent 60%),
      var(--navy-deep);
    position:relative; overflow:hidden; padding-bottom:64px;
  }
  .hero-pattern{position:absolute; inset:0; opacity:0.15; background-size:220px; background-repeat:repeat;}
  .hero-inner{position:relative; z-index:2; max-width:900px; margin:0 auto; text-align:center; padding:0 24px;}
  .hero h1{color:var(--ivory); font-size:clamp(2.1rem, 6vw, 4rem); line-height:1.35; margin-bottom:22px; text-shadow:0 4px 30px rgba(0,0,0,0.4);}
  .hero p.subtitle{color:var(--sand); font-size:clamp(1rem,2vw,1.25rem); max-width:620px; margin:0 auto 38px; font-weight:300;}
  .cta-row{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:46px;}
  .btn{
    padding:15px 34px; border-radius:2px; font-size:0.95rem; font-weight:600; letter-spacing:0.02em;
    transition:transform .25s ease, box-shadow .25s ease; display:inline-flex; align-items:center; gap:10px;
  }
  .btn-primary{background:var(--gold); color:var(--navy-deep);}
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 12px 30px rgba(201,162,75,0.35);}
  .btn-outline{border:1px solid var(--gold-light); color:var(--ivory);}
  .btn-outline:hover{background:rgba(201,162,75,0.12); transform:translateY(-2px);}
  .hero-facts{display:flex; gap:0; flex-wrap:wrap; justify-content:center; border-top:1px solid rgba(201,162,75,0.25); padding-top:32px;}
  .fact{flex:1 1 160px; text-align:center; color:var(--sand); padding:0 14px; font-size:0.86rem;}
  .fact strong{display:block; color:var(--gold-light); font-family:var(--display-ar); font-size:1.05rem; margin-bottom:4px;}
  body[data-lang="en"] .fact strong,body[data-lang="fr"] .fact strong,body[data-lang="ms"] .fact strong{font-family:var(--display-lat);}

  /* section headers */
  .section-head{text-align:center; max-width:680px; margin:0 auto 56px;}
  .section-head h2{font-size:clamp(1.7rem, 3.4vw, 2.5rem); color:var(--navy);}
  .navy-bg .section-head h2{color:var(--ivory);}
  .section-head p{margin-top:16px; color:#4b5a66; font-size:1.02rem;}
  .navy-bg .section-head p{color:var(--sand);}

  /* WHY cards */
  .why-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:2px; background:var(--line); border:1px solid var(--line);}
  .why-card{background:var(--ivory); padding:38px 26px; text-align:start;}
  .why-card .num{font-family:var(--display-lat); font-size:0.75rem; color:var(--gold); letter-spacing:0.15em;}
  .why-card h3{font-size:1.15rem; margin:14px 0 10px; color:var(--navy);}
  .why-card p{color:#556; font-size:0.92rem;}

  /* DISCOVER */
  .discover-scroller{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px;}
  .place-card{
    background:var(--navy); border-radius:2px; overflow:hidden; position:relative; min-height:230px;
    display:flex; flex-direction:column; justify-content:flex-end; padding:22px;
    border:1px solid rgba(201,162,75,0.2);
  }
  .place-card .bg-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;}
  .place-card .ph{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(160deg, rgba(14,92,86,0.5), rgba(8,20,32,0.9)); opacity:0.9; z-index:0;
  }
  .place-card .overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,20,32,0.15) 0%, rgba(8,20,32,0.92) 100%); z-index:1;}
  .place-card .ph svg{width:46px; height:46px; opacity:0.35;}
  .place-card .content{position:relative; z-index:2;}
  .place-card h3{color:var(--ivory); font-size:1.15rem; margin-bottom:6px;}
  .place-card p{color:var(--sand); font-size:0.85rem; line-height:1.6;}

  /* STORIES */
  .story{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; margin-bottom:88px;}
  .story:last-child{margin-bottom:0;}
  .story:nth-child(even){direction:ltr;}
  .story:nth-child(even) .story-text{direction:inherit;}
  body[dir="rtl"] .story:nth-child(even){direction:ltr;}
  body[dir="rtl"] .story:nth-child(even) .story-text{direction:rtl; text-align:right;}
  body[dir="ltr"] .story:nth-child(even){direction:rtl;}
  body[dir="ltr"] .story:nth-child(even) .story-text{direction:ltr; text-align:left;}
  .story-visual{
    aspect-ratio:4/3; background:linear-gradient(150deg, var(--teal), var(--navy-deep));
    display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
  }
  .story-visual svg{width:70px; height:70px; opacity:0.5;}
  .story-visual::after{content:""; position:absolute; inset:0; border:1px solid rgba(201,162,75,0.4); margin:14px;}
  .story-text .eyebrow{color:var(--teal);}
  .story-text h3{font-size:1.7rem; margin-bottom:16px; color:var(--navy);}
  .story-text p{color:#4b5a66; margin-bottom:10px;}

  /* TIMELINE */
  .timeline{max-width:760px; margin:0 auto; position:relative;}
  .timeline::before{content:""; position:absolute; top:0; bottom:0; inset-inline-start:27px; width:1px; background:var(--line);}
  .t-item{display:flex; gap:26px; padding-bottom:52px; position:relative;}
  .t-item:last-child{padding-bottom:0;}
  .t-num{
    flex:0 0 56px; height:56px; border-radius:50%; border:1px solid var(--gold);
    display:flex; align-items:center; justify-content:center; font-family:var(--display-ar);
    color:var(--gold); background:var(--ivory); font-size:1.1rem; z-index:2;
  }
  .t-content h3{font-size:1.15rem; margin-bottom:8px; color:var(--navy);}
  .t-content p{color:#556; font-size:0.94rem;}

  /* INCLUDES */
  .includes-list{max-width:680px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:16px 34px;}
  .includes-list li{display:flex; align-items:flex-start; gap:12px; color:var(--ivory); font-size:0.98rem;}
  .includes-list li::before{content:"✓"; color:var(--gold-light); font-weight:700; flex:0 0 auto;}

  /* PRICING */
  .price-card{
    max-width:620px; margin:0 auto; background:var(--ivory); border:1px solid var(--line);
    padding:52px 40px; text-align:center; box-shadow:var(--shadow);
  }
  .price-card p.lead{font-size:1.1rem; margin-bottom:26px; color:var(--navy);}
  .price-includes{display:flex; gap:22px; flex-wrap:wrap; justify-content:center; margin-bottom:32px;}
  .price-includes span{font-size:0.85rem; color:var(--teal); border:1px solid var(--line); padding:8px 16px; border-radius:20px;}
  .price-note{margin-top:22px; font-size:0.8rem; color:#778; font-style:italic;}

  /* ABOUT */
  .about-wrap{max-width:760px; margin:0 auto; text-align:center;}
  .about-wrap .quote{font-family:var(--display-ar); font-size:clamp(1.4rem,3vw,2.1rem); color:var(--navy); margin-bottom:28px; line-height:1.6;}
  body[data-lang="en"] .about-wrap .quote,body[data-lang="fr"] .about-wrap .quote,body[data-lang="ms"] .about-wrap .quote{font-family:var(--display-lat); font-style:italic;}
  .about-wrap p.body-text{color:#4b5a66; font-size:1.03rem;}

  /* GALLERY */
  .gallery-grid{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:8px;}
  .gallery-grid .g:nth-child(1){grid-column:span 2; grid-row:span 2;}
  .gallery-grid .g:nth-child(4){grid-column:span 2;}
  .g{
    background:linear-gradient(160deg, var(--teal-light), var(--navy)); position:relative; overflow:hidden;
    display:flex; align-items:center; justify-content:center; cursor:pointer;
  }
  .g svg{width:30px; height:30px; opacity:0.4; transition:transform .4s ease;}
  .g:hover svg{transform:scale(1.15) rotate(6deg);}
  .g span.tag{position:absolute; bottom:10px; inset-inline-start:12px; color:var(--sand); font-size:0.72rem; letter-spacing:0.05em;}

  /* FAQ */
  .faq-wrap{max-width:720px; margin:0 auto;}
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-q{width:100%; display:flex; justify-content:space-between; align-items:center; padding:22px 4px; text-align:start; font-size:1.02rem; font-weight:600; color:var(--navy);}
  .faq-q .plus{color:var(--gold); font-size:1.3rem; transition:transform .3s ease; flex:0 0 auto; margin-inline-start:16px;}
  .faq-item.open .faq-q .plus{transform:rotate(45deg);}
  .faq-a{max-height:0; overflow:hidden; transition:max-height .35s ease;}
  .faq-a p{padding:0 4px 22px; color:#4b5a66; font-size:0.94rem;}

  /* FOOTER */
  footer{background:var(--navy-deep); color:var(--sand); padding:64px 0 100px; text-align:center;}
  footer .brand{margin-bottom:18px;}
  footer .foot-links{display:flex; gap:26px; justify-content:center; flex-wrap:wrap; margin:24px 0; font-size:0.85rem;}
  footer .foot-meta{font-size:0.78rem; opacity:0.6; margin-top:26px;}

  /* FLOATING WHATSAPP */
  .fab-wa{
    position:fixed; bottom:22px; inset-inline-end:22px; z-index:400;
    width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff;
    display:flex; align-items:center; justify-content:center; box-shadow:0 10px 30px rgba(0,0,0,0.3);
  }
  .fab-wa svg{width:28px; height:28px;}

  /* sticky mobile CTA */
  .mobile-cta{
    display:none; position:fixed; bottom:0; left:0; right:0; z-index:399;
    background:var(--navy-deep); border-top:1px solid var(--line); padding:12px 16px;
    gap:10px;
  }
  .mobile-cta a{flex:1; text-align:center; padding:13px; font-size:0.88rem; font-weight:600; border-radius:2px;}

  .reveal{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease;}
  .reveal.in{opacity:1; transform:translateY(0);}

  @media (max-width:860px){
    .story, .story:nth-child(even){grid-template-columns:1fr; direction:inherit !important;}
    body[dir="rtl"] .story:nth-child(even) .story-text, body[dir="ltr"] .story:nth-child(even) .story-text{direction:inherit; text-align:start;}
    .includes-list{grid-template-columns:1fr;}
    .gallery-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:130px;}
    .gallery-grid .g:nth-child(1){grid-column:span 2; grid-row:span 1;}
    section{padding:64px 0;}
    .mobile-cta{display:flex;}
    .fab-wa{bottom:78px;}
    body{padding-bottom:70px;}
  }

.reveal{opacity:1;transform:none}.skip-link{position:absolute;top:-100px;left:10px;z-index:999;background:#fff;padding:12px}.skip-link:focus{top:10px}.lang-chip{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.brand-link{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.booking-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.booking-grid label{display:block;font-weight:600}.booking-grid input,.booking-grid select,.booking-grid textarea{display:block;width:100%;min-width:0;margin-top:6px;padding:12px;border:1px solid #b5bfc3;border-radius:4px;background:#fff;color:var(--navy);font:inherit;min-height:48px}.booking-grid .full{grid-column:1/-1}.booking-box{max-width:820px;margin:auto;background:#fff;padding:28px;border:1px solid var(--line)}.booking-total{font-size:1.2rem;font-weight:700;padding:18px;background:var(--ivory);margin:22px 0}.booking-note{font-size:.92rem;margin:12px 0;color:#455765}.price-table{width:100%;border-collapse:collapse;margin:20px 0;text-align:start}.price-table th,.price-table td{padding:14px;border-bottom:1px solid var(--line)}.faq-item{padding:18px 0}.faq-item summary{cursor:pointer;font-weight:700}.faq-item p{padding:12px 0}.article{max-width:900px;margin:auto}.article p{margin:14px 0}.article h2{font-size:1.9rem;margin:26px 0 12px}.related-links{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0}.related-links a{display:block;padding:10px 16px;border:1px solid var(--line);color:var(--teal);background:var(--ivory);text-decoration:none}.topic-hero{padding-top:150px;background:var(--navy);color:var(--ivory)}.topic-hero h1{font-size:clamp(2rem,4vw,3.5rem)}.topic-hero p{color:var(--sand);margin:20px 0}.breadcrumb{font-size:.9rem;margin-bottom:22px}.breadcrumb a{color:var(--gold-light)}.home-nav-links{margin-top:26px}.hours{white-space:pre-line}.nav-inner{gap:10px}.lang-chips{flex-wrap:wrap}.nav-right{min-width:0}main{display:block}.fab-wa{display:none}.hero-facts{flex-wrap:wrap}.btn[hidden]{display:none}.place-card .ph svg{height:46px;width:46px}body{padding-bottom:0}@media(max-width:600px){.booking-grid{grid-template-columns:1fr}.booking-box{padding:18px}.nav-inner{flex-wrap:wrap;padding:10px 16px}.nav-right{width:100%;justify-content:space-between}.nav{height:auto}.hero{padding-top:180px}.brand span{font-size:.7rem}.nav-wa{font-size:.8rem}.topic-hero{padding-top:190px}.mobile-cta{padding-bottom:calc(12px + env(safe-area-inset-bottom))}body{padding-bottom:94px}input,select,textarea{font-size:16px!important}.price-card{padding:24px 16px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
header.nav{background:rgba(8,20,32,.94)}#booking{scroll-margin-top:130px}@media(max-width:600px){#booking{scroll-margin-top:170px}}

/* Guest reviews: direct link to the Google Maps business listing. */
.guest-reviews{padding:48px 0;background:var(--ivory)}
.guest-reviews-card{text-align:center;border:1px solid var(--line);border-radius:12px;padding:40px 24px;max-width:880px;margin:0 auto;background:#fff;box-shadow:0 8px 28px rgba(8,20,32,.05)}
.guest-reviews-card h2{color:var(--navy);margin-bottom:12px}
.guest-reviews-card p{max-width:640px;margin:0 auto 22px;color:var(--navy)}
.guest-reviews-card .btn{white-space:normal;max-width:100%;text-align:center;gap:10px}
.guest-reviews-card .guest-reviews-note{font-size:.85rem;margin:14px auto 0;color:#526170}
.guest-reviews-card a:focus-visible{outline:3px solid var(--teal);outline-offset:5px}
@media(max-width:600px){.guest-reviews{padding:32px 0}.guest-reviews-card{padding:28px 18px}.guest-reviews-card .btn{width:100%}}