@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&family=Inter:wght@300;400;500;600&display=swap');

:root{--bg:#FAFAF5;--card:#fff;--t1:#2C241B;--t2:#8C8680;--gold:#C5A059;--gl:#F0E6D2;--bd:#EBEBE0;
--sf:"Playfair Display","Didot","Times New Roman",serif;--ss:"Inter",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;
--sw:300px;--fab-size:56px}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;overflow-x:hidden;position:relative}
body{background:var(--bg);color:var(--t1);font-family:var(--ss);line-height:1.6;-webkit-font-smoothing:antialiased;padding-bottom:100px}
a{text-decoration:none;color:inherit;transition:.3s}
img{max-width:100%;display:block}

/* LAYOUT */
.wrap{display:flex;min-height:100vh}
.sb{width:var(--sw);height:100vh;position:sticky;top:0;padding:2.5rem 1.5rem;border-right:1px solid rgba(0,0,0,.05);
background:rgba(250,250,245,.95);backdrop-filter:blur(10px);overflow-y:auto;z-index:50;display:flex;flex-direction:column;flex-shrink:0}
.sb .logo{font-family:var(--sf);font-size:1.4rem;font-weight:700;margin-bottom:.3rem}
.sb .sub{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--gold);margin-bottom:2rem}
.nd{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--t2);margin:1.2rem 0 .4rem .5rem}
.ni{display:flex;justify-content:space-between;align-items:center;padding:.4rem .6rem;border-radius:4px;font-size:.85rem;
color:var(--t2);border-left:2px solid transparent}
.ni:hover,.ni.act{color:var(--t1);background:rgba(0,0,0,.02)}
.ni.act{border-left-color:var(--gold);font-weight:500}
.nc{font-size:.7rem;color:var(--t2)}

/* MAIN */
.mc{flex:1;width:100%;max-width:100%;overflow-x:hidden}
.hero{height:50vh;background:linear-gradient(rgba(44,36,27,.45),rgba(44,36,27,.45)),
url('../dubai/assets/2026-02-14_迪拜_Lunch/2266c5cdd927fcad.jpg') center/cover no-repeat;
display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden}
.hero h1{font-family:var(--sf);font-size:3.5rem;font-weight:400;margin-bottom:.5rem;line-height:1.1}
.hero p{font-size:1rem;font-weight:300;opacity:.9;letter-spacing:.05em}
.cw{max-width:1100px;margin:0 auto;padding:0 3rem 6rem}

/* SECTIONS & STICKY HEADER */
.ms{margin-bottom:2rem;scroll-margin-top:70px}
.sh{position:sticky;top:0;z-index:30;background:rgba(250,250,245,0.95);backdrop-filter:blur(12px);
padding:1.5rem 0;border-bottom:1px solid var(--bd);margin-bottom:2rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
.sh-in{flex:1}
.sh:hover h2{color:var(--gold)}
.sm{font-size:.75rem;text-transform:uppercase;letter-spacing:.2em;color:var(--gold);display:block;margin-bottom:.3rem}
.sh h2{font-family:var(--sf);font-size:2.5rem;font-weight:400;color:var(--t1);line-height:1}
.sh-icon{font-size:1.5rem;color:var(--t2);width:2rem;text-align:center;transition:transform .3s}
.ms.closed .sh-icon{transform:rotate(45deg); /* + signish */}
.ms.closed .so{display:none}
.so{animation:fadein .3s ease-out}
@keyframes fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* TRAVEL-FIRST TIMELINE */
.timeline{margin:1.2rem 0 2.2rem}
.timeline-node{position:relative;display:grid;grid-template-columns:26px 1fr;column-gap:14px;margin:0 0 20px 0}
.tn-line{position:absolute;left:12px;top:18px;bottom:-10px;width:1px;background:var(--bd)}
.timeline-node:last-child .tn-line{display:none}
.tn-dot{width:26px;height:26px;border-radius:999px;background:rgba(197,160,89,.12);border:1px solid rgba(197,160,89,.35);
color:var(--gold);display:flex;align-items:center;justify-content:center;z-index:2}
.tn-ic{font-size:14px;line-height:1}
.tn-main{min-width:0}
.tn-time{font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;color:var(--gold);font-weight:700;margin-bottom:6px}
.tn-title{font-family:var(--sf);font-size:1.35rem;font-weight:400;line-height:1.15;margin-bottom:6px}
.tn-sub{color:var(--t2);font-size:.95rem;line-height:1.5;margin-bottom:8px}
.tn-body ul{margin:0;padding-left:1.15rem;color:var(--t2)}
.tn-body li{margin:0.25rem 0}

.kind-flight .tn-dot{background:rgba(59,130,246,.10);border-color:rgba(59,130,246,.25);color:#2563EB}
.kind-meal .tn-dot{background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.25);color:#059669}
.kind-checkin .tn-dot{background:rgba(168,85,247,.10);border-color:rgba(168,85,247,.25);color:#7C3AED}
.kind-logistics .tn-dot{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.25);color:#B45309}

/* SAFETY ALERT */
.safety-alert{background:#FFFBEB;border:1px solid #FDE68A;border-radius:6px;padding:14px 16px;margin:0 0 16px 0}
.safety-head{font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;color:#B45309;font-weight:800;margin-bottom:8px}
.safety-list{margin:0;padding-left:1.15rem;color:#78350F;font-size:.92rem}
.safety-list li{margin:0.25rem 0}

/* GUIDE CARDS */
.cards-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0 18px}
.cards-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:8px 0 24px}
.guide-card{background:var(--card);border:1px solid var(--bd);border-radius:6px;padding:12px 14px;box-shadow:0 8px 25px rgba(44,36,27,.03)}
.guide-card.pri-must{border-left:3px solid #EF4444}
.guide-card.pri-should{border-left:3px solid #F59E0B}
.card-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.card-ic{width:26px;height:26px;border-radius:999px;background:rgba(0,0,0,.03);display:flex;align-items:center;justify-content:center}
.card-tt{font-family:var(--sf);font-size:1.05rem;color:var(--t1)}
.card-b p{margin:0 0 6px 0;color:var(--t2);font-size:.92rem;line-height:1.55}

/* NODE CARDS (inline details) */
.node-cards{margin-top:10px;border:1px dashed rgba(0,0,0,.08);border-radius:6px;padding:10px 12px;background:rgba(250,250,245,.55)}
.node-cards summary{cursor:pointer;color:var(--t2);font-size:.82rem;letter-spacing:.04em}
.node-cards-inner{margin-top:10px;display:grid;grid-template-columns:1fr;gap:10px}
.guide-card.compact{padding:10px 12px}
.guide-card.compact .card-tt{font-size:1rem}
.guide-card.compact .card-b p{font-size:.9rem}

/* DINING DETAILS (collapsible) */
.dining-details{margin-top:10px}
.dining-details summary{cursor:pointer;color:var(--gold);font-size:.85rem;letter-spacing:.04em}
.dining-list{margin-top:12px}

/* CARDS (Unified Style) */
.rc{background:var(--card);border:1px solid var(--bd);border-radius:2px;margin-bottom:2rem;position:relative;
box-shadow:0 8px 25px rgba(44,36,27,.04);transition:transform .3s,box-shadow .3s}
.rc:hover{transform:translateY(-3px);box-shadow:0 12px 35px rgba(44,36,27,.08)}
.badge{position:absolute;top:-10px;right:20px;background:var(--t1);color:var(--gold);font-size:.65rem;
text-transform:uppercase;letter-spacing:.12em;padding:5px 10px;z-index:10}
.ch{padding:1.5rem 1.5rem 0.8rem;border-bottom:1px solid var(--bd);display:flex;justify-content:space-between;
align-items:baseline;flex-wrap:wrap;gap:.8rem}
.ch h3{font-family:var(--sf);font-size:1.4rem;font-weight:400;color:var(--t1)}
.cm{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--t2)}

/* GALLERY */
.gs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;height:250px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gs::-webkit-scrollbar{display:none}
.gi{flex:0 0 45%;height:100%;scroll-snap-align:start;cursor:zoom-in;position:relative;border-right:2px solid var(--bg)}
.gi img{width:100%;height:100%;object-fit:cover}

.cb{padding:1.5rem}
.rw{font-family:var(--sf);font-size:1rem;line-height:1.7;margin-bottom:1rem;color:var(--t1)}
.risk{display:flex;align-items:start;background:var(--gl);color:#8A6D3B;padding:.8rem;border-radius:4px;
font-size:.85rem;margin-bottom:1rem;gap:0.5rem;line-height:1.5}
.risk b{margin-right:0}

/* LIGHTBOX */
.lbo{position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:200;display:none;justify-content:center;align-items:center;flex-direction:column}
.lbo.on{display:flex}
.lbo img{max-width:100%;max-height:80vh;object-fit:contain;transition:transform .2s}
.lbx{position:absolute;top:1.5rem;right:1.5rem;color:#fff;font-size:2rem;cursor:pointer;z-index:210}
.lb-nav{position:absolute;top:50%;width:100%;display:flex;justify-content:space-between;padding:0 2rem;pointer-events:none}
.lb-btn{pointer-events:auto;background:rgba(255,255,255,0.1);color:#fff;border:none;width:50px;height:50px;border-radius:50%;
font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(5px)}
.lb-cap{position:absolute;bottom:2rem;color:#fff;font-family:var(--sf);font-size:1rem;text-align:center;max-width:80%}

/* FAB NAV */
.fab{position:fixed;bottom:2rem;right:2rem;width:var(--fab-size);height:var(--fab-size);background:var(--t1);color:var(--gold);
border-radius:50%;box-shadow:0 10px 30px rgba(0,0,0,0.3);display:none;z-index:100;align-items:center;justify-content:center;
cursor:pointer;font-size:1.5rem;transition:transform .2s}

/* MOBILE NAV SHEET */
.mn-sheet{display:none;position:fixed;inset:0;z-index:150;background:rgba(0,0,0,.4);opacity:0;transition:opacity .3s}
.mn-sheet.on{display:flex;flex-direction:column;justify-content:flex-end;opacity:1}
.mn-inner{background:var(--bg);border-radius:16px 16px 0 0;max-height:70vh;overflow-y:auto;padding:1.5rem;
transform:translateY(100%);transition:transform .3s cubic-bezier(0.2,0.8,0.2,1);-webkit-overflow-scrolling:touch}
.mn-sheet.on .mn-inner{transform:translateY(0)}

/* RESPONSIVE */
@media(max-width:1024px){
  .sb{display:none}
  .fab{display:flex}
  .cw{padding:0 1.2rem 6rem}
  .hero h1{font-size:2.2rem}
  .hero{height:40vh}
  .cards-row,.cards-grid{grid-template-columns:1fr}
  .tn-title{font-size:1.2rem}
  .tn-line{left:12px}
  /* Sticky Header Tweaks for Mobile */
  .sh{padding:1rem 1.2rem;margin:0 -1.2rem 1.5rem;width:calc(100% + 2.4rem)}
  .gs{height:260px}
  .gi{flex:0 0 85%}
}