@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,700;1,400;1,500&family=Source+Serif+4:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --cream:        #F5F0E6;
  --cream-dark:   #EDE6D6;
  --cream-light:  #FAF7F2;
  --ink:          #1A1208;
  --ink-mid:      #3D2E1A;
  --saffron:      #C8751A;
  --saffron-deep: #9E5A0E;
  --saffron-pale: #FDF3E3;
  --warm-grey:    #7A6E5E;
  --border:       #D4C9B4;
  --border-dark:  #8A7A60;
  --white:        #FFFFFF;
  --green:        #2D5A3A;

  --serif:        'Playfair Display', 'Source Serif 4', Georgia, serif;
  --body:         'DM Sans', system-ui, sans-serif;

  /* aliases used by inner pages */
  --font-display: 'Playfair Display', 'Source Serif 4', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  --nav-h:        68px;
  --px:           clamp(1.5rem, 5vw, 5rem);
  --py:           clamp(4rem, 7vw, 6rem);

  /* aliases used by inner pages */
  --page-px:      clamp(1.5rem, 5vw, 5rem);
  --section-py:   clamp(4rem, 7vw, 6rem);
}

html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--body);background:var(--cream);color:var(--ink);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}

/* ── CURSOR ── */
.cursor{width:8px;height:8px;background:var(--saffron);border-radius:50%;position:fixed;top:0;left:0;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width .2s,height .2s,opacity .2s;mix-blend-mode:multiply}
.cursor.big{width:36px;height:36px;background:rgba(200,117,26,.12)}
@media(pointer:coarse){.cursor{display:none}}

/* ── NAV ── */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--px);transition:background .4s,border-color .4s,box-shadow .4s;background:rgba(245,240,230,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);box-shadow:0 1px 20px rgba(26,18,8,.06)}
.nav.over-video{background:transparent;border-bottom:1px solid rgba(255,255,255,0);box-shadow:none}
.nav.scrolled{background:rgba(245,240,230,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);box-shadow:0 1px 20px rgba(26,18,8,.06)}
/* QA FIX: When drawer is open, nav bar blends seamlessly with the cream drawer background */
.nav.drawer-open{background:var(--cream) !important;border-bottom-color:transparent !important;box-shadow:none !important;backdrop-filter:none !important}
.nav-logo-wrap{display:flex;align-items:center;gap:.7rem}
.nav-logo-wrap img{height:44px;width:auto;display:block;object-fit:contain}

.nav-logo-text{display:none}
.nav-logo-name{display:none}
.nav-logo-name span{color:var(--saffron)}
.nav-logo-tag{display:none}
.nav.over-video .nav-logo-name{color:var(--white)}
.nav.over-video .nav-logo-name span{color:#E8C87A}
.nav.over-video .nav-logo-tag{color:rgba(255,255,255,.5)}
.nav-center{display:flex;gap:2rem;list-style:none}
.nav-center a{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);opacity:.65;transition:opacity .2s}
.nav-center a:hover,.nav-center a.active{opacity:1}
.nav-center a.active{border-bottom:1.5px solid var(--saffron);padding-bottom:1px}
.nav.over-video .nav-center a{color:rgba(255,255,255,.75)}
.nav.over-video .nav-center a:hover{color:white;opacity:1}
.nav-right{display:flex;gap:.75rem;align-items:center}
.lang-toggle{display:flex;gap:.2rem;align-items:center}
.lang-btn{background:none;border:none;cursor:pointer;font-family:var(--body);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);opacity:.4;padding:.2rem .35rem;transition:opacity .2s}
.lang-btn.active{opacity:1;border-bottom:1.5px solid var(--saffron)}
.nav.over-video .lang-btn{color:white}
.nav.over-video .lang-btn.active{border-bottom-color:#E8C87A}
.lang-sep{opacity:.2;font-size:.65rem;color:var(--ink)}
.btn-book{background:var(--ink);color:var(--white);padding:.5rem 1.1rem;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;font-family:var(--body);border:none;cursor:pointer;transition:background .2s;white-space:nowrap}
.btn-book:hover{background:var(--saffron)}
.btn-order{background:transparent;color:var(--ink);padding:.5rem 1.1rem;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;font-family:var(--body);border:1.5px solid var(--border-dark);cursor:pointer;transition:border-color .2s,color .2s;white-space:nowrap}
.btn-order:hover{border-color:var(--saffron);color:var(--saffron)}
.nav.over-video .btn-book{background:#E8C87A;color:#1A0A00}
.nav.over-video .btn-order{border-color:rgba(255,255,255,.4);color:white}
/* QA FIX: Hamburger is outside <nav> so z-index:310 now works at page level, above drawer(300) and nav(200) */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:.75rem;position:fixed;top:calc((var(--nav-h) - 30px) / 2);right:var(--px);z-index:310}
.hamburger span{display:block;width:22px;height:1.5px;background:var(--ink);transition:transform .3s,opacity .3s,background .3s}
.hamburger.over-hero span{background:white}
/* QA FIX: When drawer is open, hamburger stays dark (cream background behind it) */
.hamburger.open span{background:var(--ink)}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ── MOBILE DRAWER ── */
/* QA FIX: Raised drawer z-index above nav (200→300) so it covers page content properly.
   Added padding-top to push links below the fixed nav bar, preventing content overlap. */
.drawer{position:fixed;inset:0;background:var(--cream);z-index:300;display:flex;flex-direction:column;justify-content:center;padding:3rem var(--px);padding-top:calc(var(--nav-h) + 2rem);transform:translateX(100%);transition:transform .4s cubic-bezier(.25,.46,.45,.94)}
.drawer.open{transform:translateX(0)}
.drawer-links{list-style:none;display:flex;flex-direction:column;gap:1.75rem}
.drawer-links a{font-family:var(--serif);font-size:2.25rem;font-weight:400;color:var(--ink)}
.drawer-links a.active{color:var(--saffron)}
.drawer-bottom{margin-top:2.5rem;padding-top:2rem;border-top:1px solid var(--border);display:flex;gap:1rem;flex-wrap:wrap}
/* ── DRAWER LANGUAGE SWITCHER ── */
.drawer-lang{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}
.drawer-lang-label{font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:var(--warm-grey);font-family:var(--body);display:block;margin-bottom:.75rem}
.drawer-lang-btns{display:flex;align-items:center;gap:.5rem}
.drawer-lang-btns .lang-btn{font-size:1rem;padding:.4rem .75rem;opacity:.4;color:var(--ink);border:1.5px solid transparent;border-radius:3px;transition:all .2s}
.drawer-lang-btns .lang-btn:hover,.drawer-lang-btns .lang-btn.active{opacity:1;border-color:var(--saffron);color:var(--saffron)}
.drawer-lang-btns .lang-sep{opacity:.2;font-size:.8rem}

/* ── EDITORIAL RULE ── */
.rule-double{border:none;border-top:3px double var(--ink);margin:0}
.rule-single{border:none;border-top:1px solid var(--border);margin:0}
.rule-saffron{border:none;border-top:2px solid var(--saffron);margin:0}
.ornament{text-align:center;font-size:.9rem;color:var(--saffron);letter-spacing:.5em;padding:.5rem 0}

/* ── SECTION HEADERS ── */
.sec-label{font-size:.68rem;letter-spacing:.25em;text-transform:uppercase;color:var(--saffron);margin-bottom:.75rem;font-family:var(--body)}
.sec-title{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3.25rem);font-weight:400;line-height:1.1;color:var(--ink);margin-bottom:1.25rem}
.sec-title em{font-style:italic;color:var(--saffron)}
.sec-title strong{font-weight:700}
.sec-sub{font-size:.9375rem;line-height:1.8;color:var(--warm-grey);max-width:540px}

/* ── BUTTONS ── */
.btn{display:inline-block;font-family:var(--body);font-size:.8125rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;border:none}
.btn-primary{background:var(--ink);color:var(--white);padding:.875rem 2rem}
.btn-primary:hover{background:var(--saffron)}
.btn-secondary{background:transparent;color:var(--ink);padding:.8rem 1.75rem;border:1.5px solid var(--border-dark)}
.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-gold{background:#E8C87A;color:#1A0A00;padding:.875rem 2rem}
.btn-gold:hover{background:#D4A84A}
.btn-outline-white{background:transparent;color:white;padding:.8rem 1.75rem;border:1px solid rgba(255,255,255,.4)}
.btn-outline-white:hover{border-color:white;background:rgba(255,255,255,.08)}
.btn-sm{font-size:.72rem;padding:.6rem 1.25rem}

/* aliases used by inner pages */
.btn-saffron{background:var(--saffron);color:var(--white);padding:.875rem 2rem}
.btn-saffron:hover{background:var(--saffron-deep)}
.btn-outline{background:transparent;color:var(--ink);padding:.8rem 1.75rem;border:1.5px solid var(--border-dark)}
.btn-outline:hover{border-color:var(--saffron);color:var(--saffron)}
.nav-order-btn{background:transparent;color:var(--ink);padding:.5rem 1.1rem;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;font-family:var(--body);border:1.5px solid var(--border-dark);cursor:pointer;transition:border-color .2s,color .2s;white-space:nowrap}
.nav-order-btn:hover{border-color:var(--saffron);color:var(--saffron)}
.nav-book-btn{background:var(--ink);color:var(--white);padding:.5rem 1.1rem;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;font-family:var(--body);border:none;cursor:pointer;transition:background .2s;white-space:nowrap}
.nav-book-btn:hover{background:var(--saffron)}

/* ── MARQUEE ── */
.marquee-bar{background:var(--ink);padding:.875rem 0;overflow:hidden;white-space:nowrap}
.marquee-track{display:inline-flex;gap:3rem;animation:marquee 30s linear infinite}
.marquee-item{display:inline-flex;align-items:center;gap:3rem;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(245,240,230,.45)}
.marquee-dot{width:4px;height:4px;border-radius:50%;background:var(--saffron);flex-shrink:0}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── WHATSAPP ── */
.wa-fab{position:fixed;bottom:2rem;right:2rem;z-index:600;width:54px;height:54px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(37,211,102,.35);transition:transform .2s,box-shadow .2s;animation:waPulse 3s infinite}
/* On mobile (touch devices), push WhatsApp button above the sticky CTA bar (~70px) */
@media (pointer:coarse){.wa-fab{bottom:5.5rem}}
.wa-fab:hover{transform:scale(1.1);box-shadow:0 6px 28px rgba(37,211,102,.5)}
.wa-fab svg{width:26px;height:26px;fill:white}
@keyframes waPulse{0%,100%{box-shadow:0 4px 20px rgba(37,211,102,.35)}50%{box-shadow:0 4px 28px rgba(37,211,102,.6)}}

/* ── FOOTER ── */
.footer{background:var(--ink);padding:5rem var(--px) 2.5rem;color:rgba(245,240,230,.5)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:4rem;margin-bottom:4rem}
.footer-logo-wrap{display:flex;align-items:center;gap:.7rem;margin-bottom:1rem}
.footer-logo-wrap img{height:56px;width:auto;filter:none;opacity:.95}
.footer-logo-name{display:none}
.footer-logo-name span{color:#E8C87A}
.footer-brand-text{font-size:.875rem;line-height:1.75;max-width:260px}
.footer-socials{display:flex;gap:.75rem;margin-top:1.5rem}
.footer-social{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:rgba(245,240,230,.4);font-size:.8rem;transition:border-color .2s,color .2s}
.footer-social:hover{border-color:#E8C87A;color:#E8C87A}
.footer-col-title{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:white;margin-bottom:1.25rem;font-family:var(--body)}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:.625rem}
.footer-links a{font-size:.875rem;color:rgba(245,240,230,.45);transition:color .2s}
.footer-links a:hover{color:#E8C87A}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:1.75rem;display:flex;justify-content:space-between;align-items:center;font-size:.8rem;flex-wrap:wrap;gap:1rem}
.footer-bottom-links{display:flex;gap:2rem}
.footer-bottom-links a{color:rgba(245,240,230,.3);transition:color .2s}
.footer-bottom-links a:hover{color:#E8C87A}

/* ── REVEAL ── */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-24px);transition:opacity .7s ease,transform .7s ease}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(24px);transition:opacity .7s ease,transform .7s ease}
.reveal-right.visible{opacity:1;transform:translateX(0)}

/* ── SHARED SCRIPT SNIPPET ── */
/* included inline in each page */

/* ── RESPONSIVE ── */
@media(max-width:1024px){.footer-grid{grid-template-columns:1fr 1fr;gap:2.5rem}}
@media(max-width:768px){:root{--px:1.5rem}.nav-center,.nav-right .btn-book,.nav-right .btn-order,.lang-toggle{display:none}.hamburger{display:flex}.footer-grid{grid-template-columns:1fr;gap:2rem}.footer-bottom{flex-direction:column;align-items:flex-start}}

/* ── PAGE HEADER TITLES (used by inner pages) ── */
.page-header-title{font-family:var(--serif);font-size:clamp(2.25rem,4vw,3.75rem);font-weight:400;line-height:1.1;color:var(--ink);margin-bottom:1rem}
.page-header-title em{font-style:italic;color:var(--saffron)}
.page-header-sub{font-size:.9375rem;line-height:1.8;color:var(--warm-grey);max-width:560px}
.section-label{font-size:.68rem;letter-spacing:.25em;text-transform:uppercase;color:var(--saffron);margin-bottom:.75rem;font-family:var(--body)}
.section-title{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3.25rem);font-weight:400;line-height:1.1;color:var(--ink);margin-bottom:1.25rem}
.section-title em{font-style:italic;color:var(--saffron)}
.section-sub{font-size:.9375rem;line-height:1.8;color:var(--warm-grey);max-width:540px}

/* ── NAV LOGO (inner pages use .nav-logo, home uses .nav-logo-wrap) ── */
.nav-logo{display:flex;align-items:center;gap:.7rem}
.nav-logo img,.nav-logo-img{height:44px;width:auto;display:block}
