/* Jawai Mumal — public site. Palette taken from the logo: espresso, antique gold, cream, forest. */
:root{
  --gut:1rem;
  --ink:#2b180e; --ink-2:#4a3426; --ink-3:#1b0f08;
  --gold:#c9973f; --gold-2:#e3b866; --gold-d:#8a6420;
  --cream:#ffffff; --sand:#f7f6f3; --paper:#ffffff;
  --forest:#1f3a2a; --muted:#66554a; --line:rgba(43,24,14,.14);
  --ok:#2f6b3f; --err:#a3281f;
  --r:14px; --r-lg:22px;
  --sh:0 10px 30px -12px rgba(43,24,14,.28); --sh-lg:0 28px 60px -24px rgba(43,24,14,.45);
  --serif:'Playfair Display',Georgia,'Times New Roman',serif; --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.22,.8,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:400 1rem/1.7 var(--sans);font-variant-numeric:lining-nums;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color:var(--ink);background:var(--cream);overflow-x:hidden}
img{max-width:100%;display:block}
figure{margin:0}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.18;margin:0 0 .55em;letter-spacing:-.01em}
h1{font-size:clamp(2.3rem,5.4vw,4.4rem)} h2{font-size:clamp(1.8rem,3.5vw,2.7rem)} h3{font-size:1.3rem}
p{margin:0 0 1em}
.i{flex:none;vertical-align:middle}
.wrap{width:min(1200px,100% - 2rem);margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.7rem 1rem;z-index:200}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
::selection{background:var(--gold);color:var(--ink)}

/* ---------- Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;padding:.75rem 1.5rem;border-radius:999px;border:1.5px solid transparent;font:500 .98rem var(--sans);letter-spacing:.04em;text-decoration:none;cursor:pointer;transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s,box-shadow .25s}
.btn:hover{transform:translateY(-2px)}
.btn--gold{background:var(--gold);color:var(--ink-3);box-shadow:0 8px 22px -10px rgba(201,151,63,.9)}
.btn--gold:hover{background:var(--gold-2)}
.btn--dark{background:var(--ink);color:var(--cream)} .btn--dark:hover{background:var(--ink-2)}
.btn--ghost{border-color:currentColor;background:transparent}
.btn--ghost:hover{background:rgba(255,255,255,.12)}
.btn--line{border-color:var(--ink);color:var(--ink)} .btn--line:hover{background:var(--ink);color:var(--cream)}
.btn--sm{min-height:42px;padding:.5rem 1.1rem;font-size:.92rem}
.btn--block{width:100%}
.link{display:inline-flex;align-items:center;gap:.4rem;color:var(--gold-d);font-weight:500;text-decoration:none;letter-spacing:.03em}
.link:hover{gap:.7rem}.link{transition:gap .25s var(--ease)}

/* ---------- Preloader */
/* Loading screen: the Jawai Mumal logo inside a turning gold ring */
.loader{position:fixed;inset:0;z-index:300;background:#fff;display:grid;place-items:center;transition:opacity .45s var(--ease),visibility .45s;animation:loader-failsafe .4s 6s forwards}
.loader.is-done{opacity:0;visibility:hidden;pointer-events:none}
.loader__mark{position:relative;width:min(58vw,230px);aspect-ratio:1}
.loader__mark img{position:absolute;inset:11%;width:78%;height:78%;object-fit:contain;border-radius:50%;animation:loader-breathe 2.4s ease-in-out infinite}
.loader__ring{position:absolute;inset:0;width:100%;height:100%;animation:loader-spin 1.15s linear infinite}
.loader__ring circle{fill:none;stroke-linecap:round}
.loader__ring .track{stroke:rgba(201,151,63,.18);stroke-width:3}
.loader__ring .arc{stroke:var(--gold);stroke-width:3.5;stroke-dasharray:96 260}
@keyframes loader-spin{to{transform:rotate(360deg)}}
@keyframes loader-breathe{0%,100%{transform:scale(1)}50%{transform:scale(.965)}}
@keyframes loader-failsafe{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion:reduce){.loader__ring{animation-duration:2.6s}.loader__mark img{animation:none}}
@keyframes ring{to{stroke-dashoffset:0}}
@keyframes pre-in{from{opacity:0;transform:scale(.88)}to{opacity:1;transform:none}}

/* ---------- Header */
.nav{position:fixed;inset:0 0 auto 0;z-index:100;transition:background .3s,box-shadow .3s,padding .3s;padding:.9rem 0;color:#fff}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav__logo img{height:44px;width:auto}
.nav .logo-dark{display:none}
.nav.is-solid,.nav.is-open{background:rgba(255,255,255,.97);backdrop-filter:saturate(1.4) blur(12px);box-shadow:0 1px 0 var(--line);color:var(--ink);padding:.55rem 0}
.nav.is-solid .logo-light,.nav.is-open .logo-light{display:none}
.nav.is-solid .logo-dark,.nav.is-open .logo-dark{display:block}
.nav__links{display:flex;align-items:center;gap:clamp(.9rem,1.8vw,1.9rem)}
.nav__links a:not(.btn){text-decoration:none;font-weight:500;font-size:.96rem;letter-spacing:.05em;padding:.4rem 0;position:relative}
.nav__links a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav__links a:not(.btn):hover::after,.nav__links a[aria-current]::after{transform:scaleX(1)}
.nav__toggle{display:none;background:none;border:0;color:inherit;width:48px;height:48px;border-radius:12px;cursor:pointer}
@media (max-width:1020px){
  .nav__toggle{display:grid;place-items:center}
  .nav__links{position:fixed;inset:64px 0 auto 0;background:var(--cream);color:var(--ink);flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.2rem 1.4rem;box-shadow:var(--sh-lg);transform:translateY(-12px);opacity:0;visibility:hidden;transition:.3s var(--ease)}
  .nav.is-open .nav__links{transform:none;opacity:1;visibility:visible}
  .nav__links a:not(.btn){padding:.9rem .2rem;border-bottom:1px solid var(--line);font-size:1.05rem}
  .nav__links a:not(.btn)::after{display:none}
  .nav__cta{margin-top:1rem}
}

/* ---------- Hero (slides) */
.hero{position:relative;display:grid;min-height:min(100svh,880px);color:#fff;isolation:isolate;overflow:hidden;background:var(--ink-3)}
.hslide{grid-area:1/1;position:relative;display:grid;align-items:end;padding:9rem 0 8.5rem;opacity:0;visibility:hidden;transition:opacity 1s var(--ease),visibility 1s;z-index:0}
.hslide.is-active{opacity:1;visibility:visible;z-index:1}
.hslide__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}

.hslide::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(27,15,8,.55) 0%,rgba(27,15,8,.18) 40%,rgba(27,15,8,.8) 100%)}
@keyframes kb{from{transform:scale(1.08)}to{transform:scale(1)}}
.hslide .hero__in>*{opacity:0;transform:translateY(18px)}
.hslide.is-active .hero__in>*{animation:rise .9s var(--ease) both}
.hslide.is-active .hero__in>*:nth-child(2){animation-delay:.1s}.hslide.is-active .hero__in>*:nth-child(3){animation-delay:.2s}.hslide.is-active .hero__in>*:nth-child(4){animation-delay:.3s}.hslide.is-active .hero__in>*:nth-child(5){animation-delay:.4s}
@keyframes rise{to{opacity:1;transform:none}}
.hero__in{max-width:780px}
.h1{font-family:var(--serif);font-weight:600;line-height:1.15;margin:0 0 .5em;font-size:clamp(2.3rem,5.4vw,4.4rem);letter-spacing:-.01em}
.hero__ctl{position:absolute;z-index:6;right:max(1rem,calc((100% - 1200px)/2));bottom:6.4rem;display:flex;align-items:center;gap:.6rem;padding:.35rem .5rem;border-radius:999px;background:rgba(27,15,8,.45);backdrop-filter:blur(8px)}
.hctl{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .2s,color .2s}
.hctl:hover{background:var(--gold);color:var(--ink-3);border-color:var(--gold)}
.hdots{display:flex;gap:.2rem}
.hdots button{width:28px;height:40px;border:0;background:none;cursor:pointer;position:relative}
.hdots button::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:rgba(255,255,255,.45);transition:.3s var(--ease)}
.hdots button[aria-selected=true]::after{background:var(--gold);width:24px;margin-left:-12px;border-radius:6px}
@media (max-width:700px){.hero__ctl{bottom:5.6rem;right:1rem}.hslide{padding:8rem 0 9rem}}
.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font:500 .82rem var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--gold-2);margin-bottom:1.1rem}
.eyebrow::before{content:"";width:34px;height:1px;background:currentColor}
.eyebrow--dark{color:var(--gold-d)}
.hero .eyebrow{color:#fff;text-shadow:0 1px 14px rgba(0,0,0,.55)}.hero .eyebrow::before{background:var(--gold-2)}
.hero h1,.hero .h1{text-wrap:balance;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.hero p{font-size:clamp(1.05rem,1.6vw,1.25rem);max-width:600px;color:rgba(255,255,255,.92)}
.hero__cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.badge-soon{display:flex;width:fit-content;align-items:center;gap:.5rem;padding:.4rem .9rem;border-radius:999px;border:1px solid rgba(227,184,102,.7);background:rgba(27,15,8,.35);backdrop-filter:blur(6px);color:var(--gold-2);font:500 .8rem var(--sans);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1.2rem}
.badge-soon i{width:8px;height:8px;border-radius:50%;background:var(--gold);animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(201,151,63,0)}0%{box-shadow:0 0 0 0 rgba(201,151,63,.7)}}

/* Inner page banner */
.pagehead{position:relative;color:#fff;padding:10rem 0 4.5rem;isolation:isolate;text-align:center}
.pagehead img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.pagehead::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(27,15,8,.62),rgba(27,15,8,.72))}
.pagehead .eyebrow::before{display:none}
.pagehead p{max-width:640px;margin:0 auto;color:rgba(255,255,255,.9)}
.crumbs{font-size:.9rem;opacity:.85;margin-bottom:1rem;letter-spacing:.05em}.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}

/* ---------- Booking panel */
.book{position:relative;z-index:5;margin-top:-4.8rem}
.book--page{margin-top:-3rem}
.bookbox{background:var(--paper);border-radius:var(--r-lg);box-shadow:var(--sh-lg);border:1px solid var(--line);overflow:hidden}
.tabs{display:flex;overflow-x:auto;scrollbar-width:none;background:var(--sand);border-bottom:1px solid var(--line)}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:1 0 auto;display:flex;align-items:center;justify-content:center;gap:.55rem;min-height:56px;padding:.7rem 1.3rem;background:none;border:0;border-bottom:3px solid transparent;color:var(--muted);font:500 .95rem var(--sans);letter-spacing:.06em;cursor:pointer;white-space:nowrap;transition:color .2s,background .2s}
.tab:hover{color:var(--ink)}
.tab[aria-selected=true]{background:var(--paper);color:var(--ink);border-bottom-color:var(--gold)}
.panel{padding:1.4rem clamp(1rem,2.5vw,1.8rem) 1.6rem}
.panel[hidden]{display:none}
.fgrid{display:grid;grid-template-columns:repeat(12,1fr);gap:.9rem}
.f{grid-column:span 3;display:flex;flex-direction:column;gap:.35rem;min-width:0}
.f--2{grid-column:span 2}.f--4{grid-column:span 4}.f--6{grid-column:span 6}.f--12{grid-column:span 12}
@media (max-width:900px){.f,.f--2,.f--4{grid-column:span 6}}
@media (max-width:560px){.f--4,.f--6,.f--12{grid-column:span 12}.fgrid{gap:.75rem}}
label,.lbl{font:500 .82rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
input,select,textarea{width:100%;min-height:50px;padding:.75rem .95rem;border:1.5px solid var(--line);border-radius:12px;background:#fff;font:400 1rem var(--sans);color:var(--ink);transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%232b180e' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m3 6 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9rem center;padding-right:2.4rem}
textarea{min-height:104px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,151,63,.22)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.seg{display:flex;gap:.6rem;flex-wrap:wrap}
.seg label{display:inline-flex;align-items:center;gap:.5rem;text-transform:none;letter-spacing:.02em;font-size:.98rem;padding:.7rem 1rem;border:1.5px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;min-height:48px}
.seg input{width:auto;min-height:0;accent-color:var(--ink)}
.seg label:has(input:checked){border-color:var(--gold);background:rgba(201,151,63,.12)}
.formfoot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.1rem}
.formfoot p{margin:0;font-size:.92rem;color:var(--muted);max-width:640px;display:flex;gap:.5rem;align-items:flex-start}
.formfoot p .i{margin-top:.2rem;color:var(--gold-d)}
.est{font:600 1.15rem var(--serif);color:var(--ink)}
.alert{padding:.9rem 1.1rem;border-radius:12px;margin:0 0 1rem;font-size:.98rem}
.alert--err{background:#fbe9e6;color:var(--err);border:1px solid #f0c7c1}
.alert--ok{background:#e8f3ea;color:var(--ok);border:1px solid #c5e0cb}

/* ---------- Sections */
.sec{padding:clamp(4rem,8vw,7rem) 0}
.sec--sand{background:var(--sand)}
.sec--dark{background:var(--ink);color:var(--cream)}
.sec--dark h2,.sec--dark h3{color:#fff}
.sec--dark .eyebrow{color:var(--gold-2)}
.sechead{max-width:720px;margin:0 auto 3rem;text-align:center}
.sechead .eyebrow::before{display:none}
.sechead p{color:var(--muted)}
.sec--dark .sechead p{color:rgba(250,246,236,.75)}
.sechead--left{margin-left:0;text-align:left}
.sechead--left .eyebrow::before{display:inline-block}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.split--rev>:first-child{order:2}
@media (max-width:860px){.split{grid-template-columns:1fr}.split--rev>:first-child{order:0}}
.frame{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-lg)}
.frame img{width:100%;height:100%;object-fit:cover}
.frame figcaption{position:absolute;left:1rem;bottom:1rem;background:rgba(27,15,8,.72);color:#fff;font-size:.82rem;letter-spacing:.08em;padding:.35rem .8rem;border-radius:999px;backdrop-filter:blur(6px)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.duo .frame:first-child{margin-top:2.5rem}
.duo .frame{aspect-ratio:3/4}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-top:3rem}
.stat{background:var(--paper);padding:1.6rem 1rem;text-align:center}
.stat b{display:block;font:600 clamp(2rem,4vw,3rem)/1 var(--serif);color:var(--gold-d)}
.stat span{font-size:.92rem;color:var(--muted)}
@media (max-width:700px){.stats{grid-template-columns:1fr 1fr}}

.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
@media (max-width:900px){.cards3{grid-template-columns:1fr}}
.pillar{position:relative;display:block;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;color:#fff;text-decoration:none;isolation:isolate;box-shadow:var(--sh)}
.pillar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s var(--ease)}
.pillar::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 35%,rgba(27,15,8,.88))}
.pillar:hover img{transform:scale(1.06)}
.pillar__in{position:absolute;inset:auto 0 0 0;padding:1.6rem}
.pillar__ic{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:var(--ink-3);margin-bottom:.9rem}
.pillar h3{color:#fff;margin-bottom:.3rem}
.pillar p{margin:0 0 .6rem;color:rgba(255,255,255,.85);font-size:.98rem}
.pillar .link{color:var(--gold-2)}

.grid{display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr)}
.grid--2{grid-template-columns:repeat(2,1fr)}
@media (max-width:980px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.grid,.grid--2{grid-template-columns:1fr}}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .35s var(--ease),box-shadow .35s}
.card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg)}
.card__img{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--sand)}
.card__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.card:hover .card__img img{transform:scale(1.05)}
.tag{position:absolute;left:.9rem;top:.9rem;background:var(--ink);color:var(--gold-2);font:500 .72rem var(--sans);letter-spacing:.16em;text-transform:uppercase;padding:.35rem .75rem;border-radius:999px}
.card__body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1}
.card__body h3{margin-bottom:.3rem}
.card__body p{color:var(--muted);font-size:.98rem}
.meta{display:flex;flex-wrap:wrap;gap:.45rem 1.1rem;font-size:.9rem;color:var(--ink-2);margin:0 0 1rem;padding:0;list-style:none}
.meta li{display:inline-flex;align-items:center;gap:.4rem}
.meta .i{color:var(--gold-d)}
.card__foot{margin-top:auto;display:flex;align-items:end;justify-content:space-between;gap:1rem;padding-top:1rem;border-top:1px solid var(--line)}
.price{font:600 1.7rem/1 var(--serif);color:var(--ink)}
.price small{display:block;font:400 .78rem var(--sans);color:var(--muted);letter-spacing:.06em;margin-bottom:.2rem}
.price span{font:400 .88rem var(--sans);color:var(--muted)}
.demo-note{display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;color:var(--muted)}

.fac{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8rem 2rem}
@media (max-width:900px){.fac{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.fac{grid-template-columns:1fr}}
.fac__item{display:flex;gap:1rem}
.fac__ic{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--gold);color:var(--gold-d)}
.fac h3{font-size:1.25rem;margin:0 0 .15rem}.fac p{margin:0;color:var(--muted);font-size:.96rem}

/* Safari list */
.row{display:grid;grid-template-columns:340px 1fr;gap:2rem;padding:1.4rem;border:1px solid rgba(250,246,236,.18);border-radius:var(--r-lg);background:rgba(255,255,255,.04);margin-bottom:1.2rem}
.row__img{border-radius:var(--r);overflow:hidden;aspect-ratio:4/3}
.row__img img{width:100%;height:100%;object-fit:cover}
.row h3{margin-bottom:.4rem}
.row p{color:rgba(250,246,236,.78)}
.row .meta{color:rgba(250,246,236,.9)}.row .meta .i{color:var(--gold-2)}
.row .price{color:#fff}.row .price small,.row .price span{color:rgba(250,246,236,.65)}
.row__foot{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:1rem;margin-top:1rem}
@media (max-width:820px){.row{grid-template-columns:1fr}}
.sec:not(.sec--dark) .row{background:var(--paper);border-color:var(--line)}
.sec:not(.sec--dark) .row p{color:var(--muted)}.sec:not(.sec--dark) .row .meta{color:var(--ink-2)}.sec:not(.sec--dark) .row .meta .i{color:var(--gold-d)}
.sec:not(.sec--dark) .row .price{color:var(--ink)}.sec:not(.sec--dark) .row .price small,.sec:not(.sec--dark) .row .price span{color:var(--muted)}
.checks{list-style:none;padding:0;margin:0 0 1rem;display:grid;grid-template-columns:1fr 1fr;gap:.4rem .8rem;font-size:.96rem}
.checks li{display:flex;gap:.5rem;align-items:flex-start}.checks .i{color:var(--gold-2);margin-top:.28rem}
.sec:not(.sec--dark) .checks .i{color:var(--gold-d)}
@media (max-width:560px){.checks{grid-template-columns:1fr}}

/* Menu */
.chips{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-bottom:2rem}
.chip{min-height:44px;padding:.5rem 1.15rem;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font:500 .93rem var(--sans);letter-spacing:.05em;cursor:pointer;transition:.2s}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed=true]{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.menu{display:grid;grid-template-columns:1fr 1fr;gap:0 3rem}
@media (max-width:820px){.menu{grid-template-columns:1fr}}
.dish{display:grid;grid-template-columns:1fr auto;gap:.3rem 1rem;padding:1.15rem 0;border-bottom:1px dashed rgba(43,24,14,.25)}
.dish h3{font-size:1.3rem;margin:0;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.dish p{grid-column:1;margin:0;color:var(--muted);font-size:.96rem}
.dish .price{font-size:1.3rem;grid-row:1;grid-column:2}
.vd{display:inline-block;width:15px;height:15px;border:1.5px solid var(--ok);border-radius:3px;position:relative;flex:none}
.vd::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--ok)}
.vd--nv{border-color:var(--err)}.vd--nv::after{background:var(--err)}
.pill{font:500 .68rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d);border:1px solid var(--gold);padding:.15rem .55rem;border-radius:999px}
.dish[hidden]{display:none}

/* Attractions */
.attr{display:flex;flex-direction:column}
.attr .card__img{aspect-ratio:3/2}
.dist{display:inline-flex;align-items:center;gap:.35rem;font:500 .82rem var(--sans);color:var(--gold-d);margin-bottom:.4rem;letter-spacing:.05em}
.season{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media (max-width:860px){.season{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.season{grid-template-columns:1fr}}
.season div{padding:1.4rem;border:1px solid rgba(250,246,236,.2);border-radius:var(--r);background:rgba(255,255,255,.04)}
.season .i{color:var(--gold-2);margin-bottom:.6rem}
.season h3{font-size:1.3rem;margin-bottom:.1rem}.season small{color:var(--gold-2);letter-spacing:.1em;text-transform:uppercase;font-size:.75rem}
.season p{margin:.5rem 0 0;font-size:.95rem;color:rgba(250,246,236,.78)}

/* Gallery */
.mason{columns:3 280px;column-gap:1rem}
.mason a{display:block;margin-bottom:1rem;border-radius:var(--r);overflow:hidden;break-inside:avoid;position:relative;cursor:zoom-in}
.mason img{width:100%;transition:transform .8s var(--ease)}
.mason a:hover img{transform:scale(1.05)}
.mason a[hidden]{display:none}
.mason a span{position:absolute;inset:auto 0 0 0;padding:1.4rem .9rem .7rem;background:linear-gradient(transparent,rgba(27,15,8,.78));color:#fff;font-size:.88rem;opacity:0;transition:opacity .3s}
.mason a:hover span,.mason a:focus-visible span{opacity:1}
.lb{position:fixed;inset:0;z-index:250;background:rgba(15,8,4,.94);display:none;place-items:center;padding:1.2rem}
.lb.is-open{display:grid}
.lb img{max-height:86vh;max-width:min(1100px,92vw);border-radius:10px}
.lb button{position:absolute;width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.35);color:#fff;display:grid;place-items:center;cursor:pointer}
.lb button:hover{background:var(--gold);color:var(--ink)}
.lb__x{top:1rem;right:1rem}.lb__p{left:1rem;top:50%}.lb__n{right:1rem;top:50%}
.lb p{position:absolute;bottom:1rem;left:0;right:0;text-align:center;color:#fff;margin:0}

/* Quotes / FAQ */
.quote{padding:2rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg)}
.quote::before{content:"“";font:700 4rem/0.6 var(--serif);color:var(--gold)}
.quote .stars{color:var(--gold);display:flex;gap:2px;margin:.3rem 0 .8rem}
.faq{max-width:820px;margin-inline:auto}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem 0;font:600 1.35rem var(--serif);min-height:56px}
summary::-webkit-details-marker{display:none}
summary .i{transition:transform .3s var(--ease);color:var(--gold-d);flex:none}
details[open] summary .i{transform:rotate(180deg)}
details p{color:var(--muted);padding-bottom:1.2rem;margin:0}

/* Events / CTA */
.cta{position:relative;isolation:isolate;color:#fff;border-radius:var(--r-lg);overflow:hidden;padding:clamp(2.5rem,6vw,4.5rem)}
.cta>img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.cta::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(27,15,8,.9),rgba(27,15,8,.45))}
.cta h2{color:#fff;max-width:640px}.cta p{max-width:560px;color:rgba(255,255,255,.9)}
.cta .hero__cta{margin-top:1.4rem}

/* Contact */
.ccards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media (max-width:860px){.ccards{grid-template-columns:1fr}}
.ccard{padding:1.7rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg)}
.ccard .pillar__ic{margin-bottom:.8rem}
.ccard h3{margin-bottom:.2rem}.ccard p{margin:0;color:var(--muted)}
.ccard a.big{display:block;font:600 1.5rem var(--serif);text-decoration:none;margin:.3rem 0}
.map{border:0;width:100%;height:100%;min-height:380px;border-radius:var(--r-lg);filter:sepia(.25) saturate(.9)}
.note{display:flex;gap:.7rem;align-items:flex-start;padding:1rem 1.2rem;border-radius:var(--r);background:rgba(201,151,63,.14);border:1px solid rgba(201,151,63,.45);font-size:.96rem;margin-bottom:1.2rem}
.note .i{color:var(--gold-d);margin-top:.2rem}
.done{max-width:640px;margin:0 auto;text-align:center;padding:2.5rem 1.5rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh)}
.done .pillar__ic{margin:0 auto 1rem;width:68px;height:68px}
.code{display:inline-block;font:600 1.4rem var(--serif);letter-spacing:.14em;padding:.4rem 1.2rem;border:1.5px dashed var(--gold);border-radius:10px;margin:.4rem 0 1rem}

/* Footer */
.footer{background:var(--ink-3);color:rgba(250,246,236,.8);padding:4rem 0 0}
.footer__grid{display:grid;grid-template-columns:1.3fr .8fr 1.2fr;gap:3rem}
@media (max-width:860px){.footer__grid{grid-template-columns:1fr;gap:2rem}}
.footer h3{font:500 .82rem var(--sans);letter-spacing:.25em;text-transform:uppercase;color:var(--gold-2);margin-bottom:1rem}
.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.55rem}
.footer a{text-decoration:none}.footer a:hover{color:var(--gold-2)}
.footer__contact li{display:flex;gap:.8rem;align-items:flex-start}.footer__contact .i{color:var(--gold-2);margin-top:.3rem}
.footer__contact small{display:block;opacity:.65}
.footer__brand p{margin:1rem 0;max-width:340px}
.social{display:flex;gap:.6rem}
.social a{width:44px;height:44px;border-radius:50%;border:1px solid rgba(250,246,236,.28);display:grid;place-items:center;transition:.25s}
.social a:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.footer__bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-top:3rem;padding:1.3rem 0;border-top:1px solid rgba(250,246,236,.14);font-size:.88rem;opacity:.75}

/* Reveal */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.is-in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}
@media print{.nav,.mnav,.loader{display:none}}

/* =====================================================================
   Round 2: animation layer, Jawai scene, route map, mobile app-style UI
   ===================================================================== */
html{scroll-padding-top:84px}
body{animation:pagein .6s var(--ease) both}
@keyframes pagein{from{opacity:0}to{opacity:1}}
.progress{position:fixed;left:0;top:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--gold-d),var(--gold-2));z-index:400;pointer-events:none}

/* word-by-word headings */
.words>span{display:inline-block;opacity:0;transform:translateY(.55em) rotate(2deg);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--w)*55ms)}
.is-in .words>span,.words.is-in>span{opacity:1;transform:none}

/* marquee band */
.marq{background:var(--ink);color:var(--gold-2);overflow:hidden;padding:1rem 0;border-block:1px solid rgba(255,255,255,.08)}
.marq__in{display:flex;width:max-content;animation:marq 38s linear infinite}
.marq:hover .marq__in{animation-play-state:paused}
.marq span{display:inline-flex;align-items:center;gap:1.6rem;padding-right:1.6rem;font:600 1.35rem var(--serif);letter-spacing:.06em;white-space:nowrap}
.marq span::after{content:"";width:7px;height:7px;transform:rotate(45deg);background:var(--gold)}
@keyframes marq{to{transform:translateX(-50%)}}


/* routes: animated radial map + journey list */
.routes{background:var(--forest);color:var(--cream);position:relative;overflow:hidden}
.routes::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 1px 1px,rgba(255,255,255,.09) 1px,transparent 0) 0 0/26px 26px;pointer-events:none}
.routes .wrap{position:relative}
.routes h2{color:#fff}.routes .sechead p{color:rgba(250,246,236,.75)}.routes .eyebrow{color:var(--gold-2)}
.rmap{max-width:880px;margin:0 auto 2.5rem}
.rmap svg{width:100%;height:auto;display:block;overflow:visible}
.rmap .ring{fill:none;stroke:rgba(250,246,236,.2);stroke-dasharray:3 7}
.rmap .ringlbl{fill:rgba(250,246,236,.5);font:500 11px var(--sans);letter-spacing:.1em}
.rmap .rline{stroke:var(--gold);stroke-width:1.6;fill:none;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s var(--ease);transition-delay:calc(var(--i)*.18s)}
.rmap.is-in .rline{stroke-dashoffset:0}
.rmap .rdot{fill:#fff;filter:drop-shadow(0 0 5px var(--gold-2))}
.rmap .rpin{fill:var(--ink-3);stroke:var(--gold);stroke-width:1.5;transition:fill .25s,transform .3s var(--ease);transform-box:fill-box;transform-origin:center}
.rmap .rico{color:var(--gold-2);pointer-events:none}
.rmap .rkm{fill:#fff;font:600 21px var(--serif)}.rmap .rname{fill:rgba(250,246,236,.7);font:500 12px var(--sans);letter-spacing:.12em;text-transform:uppercase}
.rmap .rnode{cursor:pointer;opacity:0;transition:opacity .7s calc(var(--i)*.18s + .5s)}
.rmap.is-in .rnode{opacity:1}
.rmap .rnode.is-hot .rpin{fill:var(--gold);transform:scale(1.15)}.rmap .rnode.is-hot .rico{color:var(--ink-3)}.rmap .rnode.is-hot .rline{stroke-width:3}
.rmap .pulse{fill:none;stroke:var(--gold);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:ping 3.2s ease-out infinite}
.rmap .pulse.p2{animation-delay:1.6s}
@keyframes ping{from{transform:scale(1);opacity:.8}to{transform:scale(2.6);opacity:0}}
.routes__foot{display:flex;gap:.5rem;justify-content:center;align-items:center;margin:1.6rem 0 0;font-size:.9rem;color:rgba(250,246,236,.65);text-align:center}
@media (max-width:640px){
  .rmap{display:none}
}

/* ---------- Mobile app-style UI ---------- */
.mnav,.nav__bd,.nav__extra{display:none}
@media (max-width:1020px){
  .nav.is-solid,.nav.is-open{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,255,255,.99)}
  .nav.is-open{z-index:130}
  .nav__links{inset:0 0 0 auto;width:min(86vw,360px);height:100dvh;padding:5.2rem 1.4rem 2rem;overflow:auto;transform:translateX(104%);opacity:1;visibility:hidden;border-radius:24px 0 0 24px;transition:transform .45s var(--ease),visibility .45s}
  .nav.is-open .nav__links{transform:none;visibility:visible}
  .nav__links a:not(.btn){font:600 1.7rem var(--serif);letter-spacing:.01em;padding:.8rem .2rem}
  .nav__toggle{position:relative;z-index:3}
  .nav.is-open .nav__toggle{color:var(--ink)}
  .nav__bd{display:block;position:fixed;inset:0;background:rgba(15,8,4,.55);opacity:0;visibility:hidden;transition:.35s;z-index:-1;backdrop-filter:blur(2px)}
  .nav.is-open .nav__bd{opacity:1;visibility:visible}
  .nav__extra{display:grid;gap:.6rem;margin-top:1.4rem}
  .nav__extra a{display:flex!important;align-items:center;gap:.7rem;font:500 1rem var(--sans)!important;border:1px solid var(--line)!important;border-radius:14px;padding:.8rem 1rem!important;min-height:48px;text-decoration:none}
  .nav__links .nav__cta{display:none}
}
@media (max-width:900px){
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .mnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:.6rem;right:.6rem;bottom:calc(.6rem + env(safe-area-inset-bottom));z-index:120;background:rgba(27,15,8,.94);backdrop-filter:blur(14px);border-radius:22px;padding:.35rem;box-shadow:0 14px 34px -10px rgba(0,0,0,.6)}
  .mnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;border-radius:16px;color:rgba(250,246,236,.72);text-decoration:none;font:500 .68rem var(--sans);letter-spacing:.06em;transition:color .2s,background .2s,transform .2s}
  .mnav a[aria-current]{color:var(--gold-2);background:rgba(255,255,255,.08)}
  .mnav a:active{transform:scale(.94)}
  .mnav .mnav__book{background:var(--gold);color:var(--ink-3);margin:-18px 4px 0;border-radius:18px;box-shadow:0 10px 22px -6px rgba(201,151,63,.8);min-height:64px}
  .footer{padding-bottom:1rem}
  .sec{padding:3.2rem 0}
  .sechead{margin-bottom:2rem}
  .hero{min-height:100svh}
  .book{margin-top:-3.6rem}
  .tab{min-height:52px;padding:.6rem 1rem;font-size:.9rem}
  .panel{padding:1.1rem 1rem 1.3rem}
  .btn{min-height:50px}
  .formfoot{flex-direction:column;align-items:stretch}.formfoot .btn{width:100%}.formfoot>div{display:grid;gap:.6rem}.est{text-align:center}
  .pagehead{padding:7.5rem 0 3rem}
  /* swipe carousels */
  .snap-m{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:1rem;margin-inline:calc(var(--gut) * -1);padding:0 var(--gut) 1rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .snap-m::-webkit-scrollbar{display:none}
  .snap-m>*{flex:0 0 82%;scroll-snap-align:center;max-width:340px}
  .snap-m.cards3>.pillar{flex-basis:78%}
  .stats{margin-top:2rem}
  .mason{columns:2 150px}
  .hero__ctl{bottom:5.2rem;right:auto;left:.8rem}
  .eyebrow{letter-spacing:.2em;font-size:.76rem}
  .menu{gap:0}
}
@media (max-width:420px){
  h1,.h1{font-size:clamp(2.2rem,10.5vw,2.8rem)}
  :root{--gut:.8rem}
  .wrap{width:min(1200px,100% - 1.6rem)}
  .nav__logo img{height:38px}
  .badge-soon{font-size:.72rem}
}
@media (prefers-reduced-motion:reduce){.marq__in,.grass path,.rmap .pulse{animation:none!important}.words>span{opacity:1;transform:none}.rmap .rline{stroke-dashoffset:0}.rmap .rnode{opacity:1}body{animation:none}}
.season--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:860px){.season--3{grid-template-columns:1fr}}
@media (max-width:900px){
  .link{min-height:44px}
  .footer li a,.footer__contact a{display:inline-flex;align-items:center;min-height:44px}
  .footer ul{gap:0}.footer__contact li{align-items:center}
  .card__body h3 a,.crumbs a{display:inline-block;padding:.5rem 0}
  .nav__logo{display:flex;align-items:center;min-height:44px}
  .hdots button{width:32px;height:44px}
  .ccard a.big{min-height:44px;display:flex;align-items:center}
}

/* ---------- Routes section: white theme, real map, wheel ---------- */
.routes{background:#fff;color:var(--ink)}
.routes::before{display:none}
.routes h2{color:var(--ink)}.routes .sechead p{color:var(--muted)}.routes .eyebrow{color:var(--gold-d)}
.rtabs{display:flex;justify-content:center;gap:.5rem;margin:0 auto 1.2rem;padding:.3rem;width:fit-content;border:1px solid var(--line);border-radius:999px;background:#fff}
.rtabs button{display:inline-flex;align-items:center;gap:.5rem;min-height:46px;padding:.5rem 1.2rem;border:0;border-radius:999px;background:none;color:var(--muted);font:500 .95rem var(--sans);cursor:pointer;transition:.2s}
.rtabs button[aria-selected=true]{background:var(--ink);color:#fff}
.rpanel[hidden]{display:none}
.rfilter{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1rem}
.chip--hotel{display:inline-flex;align-items:center;gap:.35rem}
.rlive{position:relative;z-index:0;isolation:isolate;height:min(560px,70vh);min-height:380px;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#eef1ef;box-shadow:var(--sh)}
.rlive__fallback{position:absolute;inset:0;display:grid;place-content:center;text-align:center;margin:0;padding:1rem;color:var(--muted)}
.rlegend{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;justify-content:center;margin:.9rem 0 0;font-size:.88rem;color:var(--muted)}
.rlegend .lg{display:inline-block;width:26px;height:0;border-top:4px solid var(--gold-d);vertical-align:middle;margin-right:.35rem;border-radius:2px}
.rlegend .lg--line{border-top:2px dashed var(--gold-d)}
.rmap{max-width:860px;margin:0 auto 1rem}
.rmap svg{width:100%;height:auto;display:block;overflow:visible}
.rmap .ring{stroke:rgba(43,24,14,.2)}.rmap .ringlbl{fill:var(--muted)}
.rmap .cmp path{stroke:rgba(43,24,14,.18);stroke-width:1;fill:none}.rmap .cmp text{fill:var(--ink);font:600 15px var(--sans)}
.rmap .rline{stroke:var(--gold-d)}.rmap .rdot{fill:var(--gold);filter:none}
.rmap .rpin{fill:#fff;stroke:var(--gold-d);stroke-width:2}.rmap .rico{color:var(--gold-d)}
.rmap .rkm{fill:var(--ink)}.rmap .rname{fill:var(--muted)}
.rmap .rnode.is-hot .rpin{fill:var(--gold)}.rmap .rnode.is-hot .rico{color:var(--ink-3)}
.rmap .pulse{stroke:var(--gold)}
.jarrow{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--gold);color:var(--ink-3);transition:transform .4s var(--ease)}
.routes__foot{color:var(--muted)}
/* leaflet markers */
.mk{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;border:2px solid var(--gold-d);color:var(--gold-d);box-shadow:0 4px 12px rgba(0,0,0,.28);transition:transform .25s var(--ease)}
.mk--hotel{width:52px;height:52px;border-color:var(--gold);overflow:hidden;padding:0}
.mk--hotel img{width:48px!important;height:48px!important;max-width:48px!important;border-radius:50%;object-fit:cover;display:block}
.mk.is-hot{transform:scale(1.2);background:var(--gold);color:var(--ink-3)}
.mk__lbl{position:absolute;left:46px;top:6px;white-space:nowrap;background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:8px;padding:.1rem .5rem;font:600 .78rem var(--sans);color:var(--ink);box-shadow:0 2px 6px rgba(0,0,0,.15)}
.leaflet-popup-content{font:400 .92rem/1.45 var(--sans);margin:.8rem 1rem}.leaflet-popup-content h4{font:600 1.15rem var(--serif);margin:0 0 .2rem}
.leaflet-popup-content a{color:var(--gold-d);font-weight:500}
.leaflet-container{font-family:var(--sans)}
@media (max-width:640px){
  .rtabs{width:100%}.rtabs button{flex:1;justify-content:center;padding:.5rem}
  .rlive{height:430px}
}


/* ---------- Always-white theme (round 3) ---------- */
body{background:#fff}
.sec + .sec{border-top:1px solid rgba(43,24,14,.06)}
.sec--sand{background:var(--sand)}
.sec--dark{background:#fff;color:var(--ink)}
.sec--dark h2,.sec--dark h3{color:var(--ink)}
.sec--dark .eyebrow{color:var(--gold-d)}
.sec--dark .sechead p{color:var(--muted)}
.sec--dark .row{background:#fff;border-color:var(--line)}
.sec--dark .row p{color:var(--muted)}
.sec--dark .row .meta{color:var(--ink-2)}.sec--dark .row .meta .i{color:var(--gold-d)}
.sec--dark .row .price{color:var(--ink)}.sec--dark .row .price small,.sec--dark .row .price span{color:var(--muted)}
.sec--dark .checks .i{color:var(--gold-d)}
.sec--dark .season div{background:#fff;border-color:var(--line)}
.sec--dark .season .i{color:var(--gold-d)}.sec--dark .season small{color:var(--gold-d)}.sec--dark .season p{color:var(--muted)}
.sec--dark .footer__contact .i{color:var(--gold-d)}
.marq{background:#fff;color:var(--gold-d);border-block:1px solid var(--line)}
.footer{background:#fff;color:var(--ink-2);border-top:1px solid var(--line)}
.footer h3{color:var(--gold-d)}
.footer a:hover{color:var(--gold-d)}
.footer__contact .i{color:var(--gold-d)}
.footer__bar{border-top:1px solid var(--line);opacity:1;color:var(--muted)}
.social a{border:1px solid var(--line);color:var(--ink)}
.social a:hover{background:var(--gold);border-color:var(--gold);color:var(--ink-3)}
.pagehead,.hero{background:#fff}
.btn--wa{background:#1f8f4e;color:#fff;box-shadow:0 8px 22px -10px rgba(31,143,78,.9)}.btn--wa:hover{background:#26a45a}
.formfoot>div{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;justify-content:flex-end}
@media (max-width:900px){.formfoot>div{display:grid;grid-template-columns:1fr;justify-content:stretch}.formfoot .btn,.formfoot .btn--wa{width:100%}}

.cbtns{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.9rem}
.cbtns .btn{min-height:44px;padding:.45rem 1rem;font-size:.92rem}

/* WhatsApp: icon-only everywhere (no call links) */
.wa-ico{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;border:0;background:#1f8f4e;color:#fff;cursor:pointer;text-decoration:none;box-shadow:0 8px 20px -8px rgba(31,143,78,.9);transition:transform .25s var(--ease),background .25s;flex:none}
.wa-ico:hover{transform:scale(1.08);background:#26a45a}
.wa-ico--sm{width:44px;height:44px;box-shadow:none}
.wa-ico--lg{width:72px;height:72px}
.wa-ico--light{box-shadow:0 0 0 3px rgba(255,255,255,.55)}
.wa-ico--submit{width:54px;height:54px}
.wa-float{position:fixed;right:1rem;bottom:1rem;z-index:110;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#1f8f4e;color:#fff;box-shadow:0 12px 28px -8px rgba(0,0,0,.5);transition:transform .25s var(--ease),opacity .25s;text-decoration:none}
.wa-float:hover{transform:scale(1.08)}
.wa-float::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #1f8f4e;animation:wapulse 2.6s ease-out infinite}
@keyframes wapulse{from{transform:scale(1);opacity:.7}to{transform:scale(1.55);opacity:0}}
.footer__contact .wa-ico{margin-left:auto}
.nav__extra .wa-ico{width:56px;height:56px;border:0!important;padding:0!important;min-height:56px;justify-self:start}
.ccard .big{display:block;font:600 1.4rem var(--serif);margin:.3rem 0}
.formfoot>div{align-items:center}
@media (max-width:900px){
  body.fab-hide .wa-float{opacity:0;pointer-events:none;transform:scale(.6)}
  .wa-float{bottom:calc(88px + env(safe-area-inset-bottom));right:.8rem;width:52px;height:52px}
  .wa-ico--submit{width:100%;border-radius:999px;height:52px}
}
@media (prefers-reduced-motion:reduce){.wa-float::after{animation:none}}
@media print{.wa-float{display:none}}

.prevpill{position:fixed;left:.8rem;bottom:.8rem;z-index:140;display:flex;align-items:center;gap:.5rem;padding:.45rem .9rem;border-radius:999px;background:var(--ink);color:#fff;font:500 .82rem var(--sans);box-shadow:0 10px 24px -8px rgba(0,0,0,.5)}
.prevpill a{color:var(--gold-2);text-decoration:underline;margin-left:.3rem}
@media (max-width:900px){.prevpill{bottom:calc(88px + env(safe-area-inset-bottom));left:.6rem;right:auto;max-width:calc(100% - 5.5rem);font-size:.76rem}}

/* Always lining figures (prices, dates, distances read cleanly) */
*,*::before,*::after{font-variant-numeric:lining-nums!important;font-feature-settings:"lnum" 1}


/* ---------- How far is Jawai: list + map (round 5) ---------- */
.rgrid{display:grid;grid-template-columns:minmax(330px,430px) minmax(0,1fr);gap:1.6rem;align-items:start}
.rview{position:sticky;top:92px;min-width:0}
.rlist{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
.ritem{display:grid;grid-template-columns:auto 1fr auto;gap:.9rem;align-items:start;padding:1.1rem 1.1rem 1rem;border:1px solid var(--line);border-radius:18px;background:#fff;cursor:pointer;transition:border-color .25s,box-shadow .25s,transform .25s var(--ease),opacity .25s}
.ritem:hover,.ritem.is-hot{border-color:var(--gold);box-shadow:0 12px 28px -18px rgba(43,24,14,.5);transform:translateY(-2px)}
.ritem.is-sel{border-color:var(--gold);background:#fffaf0;box-shadow:0 0 0 3px rgba(201,151,63,.25)}
.ritem.is-dim{opacity:.62}
.rnum{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;font:600 .95rem var(--sans);margin-top:.15rem}
.rkind{display:inline-flex;align-items:center;gap:.35rem;font:600 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d)}
.rtxt h3{font-size:1.12rem;line-height:1.25;margin:.2rem 0 .45rem;color:var(--ink)}
.rtxt p{margin:.45rem 0 0;font-size:.9rem;color:var(--muted)}
.rdirchip{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .6rem .2rem .25rem;border-radius:999px;background:var(--sand);font-size:.8rem;color:var(--ink-2);font-weight:500}
.jarrow{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--gold);color:var(--ink-3);flex:none;transition:transform .4s var(--ease)}
.rlinks{display:flex;flex-wrap:wrap;gap:.1rem 1.1rem;margin-top:.55rem}
.rlinks .link{font-size:.9rem;min-height:36px}
.link--btn{background:none;border:0;padding:0;font:inherit;font-size:.9rem;cursor:pointer;color:var(--gold-d);font-weight:500;display:inline-flex;align-items:center;gap:.4rem}
.rdist{text-align:right;line-height:1.1;min-width:84px}
.rdist b{font:600 2rem var(--serif);color:var(--ink)}
.rdist small{font-size:.8rem;color:var(--gold-d);margin-left:.15rem;font-weight:600}
.rdist span{display:block;font-size:.8rem;color:var(--muted);margin-top:.3rem}
.rdist em{display:block;font-style:normal;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d);margin-top:.1rem}
.rview .rtabs{margin:0 0 .8rem;width:100%}
.rview .rtabs button{flex:1;justify-content:center}
.rview .rlive{height:clamp(420px,62vh,600px)}
.rview .rmap{max-width:none;margin:0}
.rlegend{align-items:center}
.rlegend .lg--hotel{width:14px;height:14px;border:3px solid var(--gold);border-radius:50%;background:#fff}
.mk--n{width:32px;height:32px;background:var(--ink);color:#fff;border-color:#fff;font:600 .9rem var(--sans)}
.mk--n.is-hot{background:var(--gold);color:var(--ink-3)}
.rmap .rn{fill:var(--gold-d);font:700 16px var(--sans)}
.rmap .rnode.is-hot .rn{fill:var(--ink-3)}
.rmap .rnode{cursor:pointer}
.routes__foot{margin-top:2rem}
@media (max-width:980px){
  .rgrid{grid-template-columns:1fr}
  .rview{position:static;order:-1}
}
@media (max-width:640px){
  .ritem{grid-template-columns:auto 1fr;padding:1rem}
  .rdist{grid-column:1/-1;display:flex;align-items:baseline;flex-wrap:wrap;gap:.25rem .5rem;text-align:left;border-top:1px dashed var(--line);padding-top:.7rem;margin-top:.2rem}
  .rdist b{font-size:1.7rem}.rdist span{margin:0 0 0 auto}.rdist em{margin:0}
  .rview .rlive{height:400px}
  .rview .rtabs button{padding:.5rem .4rem;font-size:.9rem}
}
@media (max-width:640px){.rfilter{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;margin-inline:calc(var(--gut) * -1);padding:0 var(--gut) .2rem}.rfilter::-webkit-scrollbar{display:none}.rfilter .chip{flex:none}}

/* ---- Journal (blog) ---- */
.wrap--narrow{max-width:820px}
.bgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem}
.bgrid--3{margin-top:1.2rem}
.bcard{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--sh)}
.bcard__img{display:block;aspect-ratio:16/10;overflow:hidden}
.bcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.bcard:hover .bcard__img img{transform:scale(1.04)}
.bcard__body{padding:1.1rem 1.2rem 1.3rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.bcard__body h2,.bcard__body h3{font-size:1.2rem;line-height:1.3;margin:0}
.bcard__body a{text-decoration:none;color:inherit}
.bcard__body p{color:var(--muted);font-size:.95rem;margin:0}
.bcard__body .link{margin-top:auto;color:var(--gold-d);display:inline-flex;gap:.3rem;align-items:center}
.bcard__meta,.bmeta{font:600 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d)}
.prose{font-size:1.06rem;line-height:1.8;color:var(--ink-2)}
.prose h2{font-size:1.65rem;margin:2.2rem 0 .6rem}
.prose h3{font-size:1.25rem;margin:1.6rem 0 .4rem}
.prose p{margin:0 0 1.1rem}
.prose ul,.prose ol{margin:0 0 1.2rem 1.2rem;padding:0;display:grid;gap:.4rem}
.prose a{color:var(--gold-d);text-decoration:underline;text-underline-offset:3px}
.bcta{margin:2.6rem 0;padding:1.6rem;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--sh)}
.bcta h2{margin:0 0 .3rem;font-size:1.5rem}
.bmore{margin:2.4rem 0 0;font-size:1.5rem}
@media (max-width:900px){.bgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.bgrid{grid-template-columns:minmax(0,1fr)}.prose{font-size:1rem}}

.toc{margin:0 0 1.6rem;padding:1rem 1.2rem;border:1px solid var(--line);border-radius:14px;background:#fff}
.toc strong{font:600 .75rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d)}
.toc ol{margin:.5rem 0 0 1.2rem;padding:0;display:grid;gap:.25rem;font-size:.97rem}
.toc a{color:var(--ink-2);text-decoration:none}.toc a:hover{color:var(--gold-d);text-decoration:underline}
.prose h2{scroll-margin-top:90px}
.footer li a{display:inline-block;padding:.25rem 0}.crumbs a{display:inline-block;padding:.2rem 0}
/* places without a real photo yet show the emblem, uncropped */
.card__img img[src*="emblem-512"],.bcard__img img[src*="emblem-512"],.mason img[src*="emblem-512"]{object-fit:contain;background:#faf6ee;padding:12%}
.fromnote{display:flex;gap:.5rem;align-items:center;justify-content:center;margin:2rem 0 0;font-size:1.1rem;color:var(--ink-2)}.fromnote strong{font-family:var(--serif);font-size:1.5rem;color:var(--gold-d)}
.duo--one{grid-template-columns:minmax(0,1fr);max-width:460px;margin-left:auto}.duo--one .frame:first-child{margin-top:0}.duo--one .frame{aspect-ratio:3/4}
.ferr{margin:.35rem 0 0;font-size:.85rem;color:var(--err,#b3261e);line-height:1.35}.bform .is-bad{border-color:var(--err,#b3261e)!important}
/* footer WhatsApp buttons: white icon on green (the generic footer icon colour made it invisible) */
.footer .wa-ico,.footer .wa-ico:hover{color:#fff}
.footer__contact .wa-ico .i{color:#fff;margin:0}
.footer__contact .wa-ico{align-self:center;flex:0 0 auto}

/* separate banner sets for phones and for computers / big screens */
@media (max-width:700px){.hslide:not(.dv-m){display:none!important}}
@media (min-width:701px){.hslide:not(.dv-d){display:none!important}}
.hero__ctl[hidden]{display:none!important}

/* ===== WhatsApp: the official logo image is the button (no drawn circle) ===== */
.wa-ico,.wa-float{background:none!important;box-shadow:none!important;border:0;padding:0;color:inherit;display:inline-grid;place-items:center;border-radius:0}
.wa-ico:hover,.wa-float:hover{background:none!important}
.wa-ico .i,.wa-float .i{width:100%;height:100%;display:block;flex:none}
.wa-ico{width:48px;height:48px;filter:drop-shadow(0 6px 10px rgba(18,140,126,.35));transition:transform .25s var(--ease)}
.wa-ico--sm{width:44px;height:44px;filter:none}
.wa-ico--lg{width:72px;height:72px}
.wa-ico--submit{width:54px;height:54px}
.wa-float{width:58px;height:58px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.35))}
.wa-float::after{display:none}
.footer .wa-ico{display:inline-grid!important;padding:0!important;min-height:0}
.footer .wa-ico--sm{width:44px;height:44px}

/* ===== Mobile polish ===== */
@media (max-width:900px){
  .nav.is-solid,.nav.is-open{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
  /* booking tabs: all five visible, icon above label, no sideways scrolling */
  .tabs{overflow:visible}
  .tab{flex:1 1 0;min-width:0;flex-direction:column;gap:.25rem;padding:.6rem .15rem;min-height:58px;font-size:.7rem;letter-spacing:.01em;line-height:1.15;text-align:center;border-bottom-width:3px}
  .tab .i{width:20px;height:20px}
  /* footer: compact rows, room for the bottom bar and the floating button */
  .footer{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
  .footer li a:not(.wa-ico),.footer__contact a:not(.wa-ico){display:inline-flex;align-items:center;min-height:44px;padding:0}
  .footer ul{gap:0}
  .footer__contact{gap:.2rem}
  .footer__contact li{align-items:center;gap:.8rem;padding:.4rem 0}
  .footer__contact li>span{flex:1;min-width:0}
  .footer__contact li:last-child{align-items:flex-start}
  .footer__bar{flex-direction:column;align-items:flex-start;gap:.2rem;padding-bottom:.4rem}
  .footer h3{margin-bottom:.4rem}
  .wa-float{width:54px;height:54px}
  .wa-ico--submit{background:#fff!important;border:1px solid var(--line);border-radius:999px;height:54px;width:100%;filter:none}
  .wa-ico--submit .i{width:34px;height:34px}
}

/* ===== Bottom bar: five equal items, Book highlighted inside the bar ===== */
@media (max-width:900px){
  body{padding-bottom:calc(86px + env(safe-area-inset-bottom))}
  .mnav{left:.75rem;right:.75rem;padding:.3rem;gap:.2rem;border-radius:20px;overflow:hidden}
  .mnav a{min-height:54px;min-width:0;padding:.2rem 0;font-size:.66rem;gap:3px;border-radius:15px}
  .mnav a .i{width:22px;height:22px}
  .mnav .mnav__book{margin:0;min-height:54px;border-radius:15px;box-shadow:none;background:var(--gold);color:var(--ink-3)}
}
/* slider arrows and dots are for computers only; phones swipe */
@media (max-width:700px){.hero__ctl{display:none!important}}

.hslide picture{position:absolute;inset:0;display:block;z-index:-2}.hslide picture .hslide__bg{z-index:auto}
.call-ico{display:inline-grid;place-items:center;flex:0 0 auto;width:48px;height:48px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold-d);background:#fff;text-decoration:none;transition:background .2s,color .2s,transform .2s}.call-ico:hover{background:var(--gold);color:var(--ink-3);transform:scale(1.06)}

/* "Book on WhatsApp": logo plus text on every screen size */
.wa-ico--submit{display:inline-flex!important;align-items:center;justify-content:center;gap:.7rem;width:auto;min-width:0;height:54px;padding:0 1.3rem!important;border-radius:999px;background:#fff!important;border:1px solid var(--line);color:var(--ink)!important;font:600 1rem var(--sans);letter-spacing:.02em;filter:none;white-space:nowrap}
.wa-ico--submit:hover{border-color:#25d366}
.wa-ico--submit .i{width:30px;height:30px;flex:none}
.wa-ico--submit .wa-lbl{display:inline}
@media (max-width:900px){.wa-ico--submit{width:100%}}
.call-ico{background:var(--gold);border-color:var(--gold);color:var(--ink-3);box-shadow:0 8px 18px -8px rgba(201,151,63,.9)}
.call-ico .i{stroke-width:2}
.call-ico:hover{background:var(--gold-d);border-color:var(--gold-d);color:#fff}
.call-ico .i{stroke-width:2.2}
.call-ico,.call-ico .i{color:#1b0f08!important}
.call-ico:hover,.call-ico:hover .i{color:#fff!important}
.call-ico{display:flex!important;align-items:center;justify-content:center;padding:0!important;min-height:0!important;line-height:0}
.call-ico .i{display:block;margin:0!important;flex:none}

/* Image credits page */
.footer__bar a{text-decoration:underline;text-underline-offset:3px}
.credit-list{list-style:none;margin:2rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.6rem}
.credit{display:flex;flex-direction:column;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden}
.credit img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.credit__body{padding:1rem 1.1rem 1.2rem;font-size:.92rem;line-height:1.5}
.credit__body h3{margin:0 0 .35rem;font-size:1.05rem}
.credit__body p{margin:.15rem 0}
.credit__body a{text-decoration:underline;text-underline-offset:2px}