/* ==========================================================================
   葡萄牙 × 西班牙 20天旅遊企劃書 — 旅遊雜誌風樣式
   01 tokens / 02 base / 03 hero / 04 toc / 05 magazine heads & covers
   06 cards / 07 galleries & lightbox / 08 tables & tabs / 09 map
   10 footer / 11 responsive & motion
   ========================================================================== */

/* ---------- 01 Design tokens ---------- */
:root{
  /* 既有地中海色（保留原名，地圖圖例等依賴） */
  --azulejo-blue:#1d4e6b;
  --azulejo-blue-dark:#123648;
  --azulejo-light:#e8f2f5;
  --sun-yellow:#e8a13c;
  --terracotta:#c96a3f;
  --cork:#f4ede2;
  --ink:#2a2a2a;
  --muted:#6b7280;
  --card-bg:#ffffff;
  --border:#e2ddd2;
  --radius:14px;
  /* 雜誌風新增 */
  --paper:#faf6ee;
  --ink-deep:#171a1c;
  --gold:#c9a24b;
  --scrim:linear-gradient(180deg,rgba(10,14,18,0.08) 0%,rgba(10,14,18,0.28) 55%,rgba(10,14,18,0.78) 100%);
  --shadow-sm:0 1px 3px rgba(23,26,28,0.06);
  --shadow-md:0 10px 30px -12px rgba(23,26,28,0.22);
  --shadow-lg:0 24px 60px -20px rgba(23,26,28,0.35);
  --radius-sm:8px;
  --radius-lg:22px;
  --space-section:clamp(72px,10vh,128px);
  --fs-display:clamp(2.4rem,6.5vw,4.8rem);
  --fs-h2:clamp(1.9rem,4vw,3rem);
  --fs-eyebrow:0.78rem;
  --font-serif:"Playfair Display","Noto Serif TC",Georgia,serif;
  --font-sans:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
}

/* ---------- 02 Base ---------- */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:72px;}
body{
  margin:0;
  font-family:var(--font-sans);
  background:var(--paper);
  color:var(--ink);
  line-height:1.7;
  overflow-x:clip;
}
h1,h2,h3{font-family:var(--font-serif);}
main{
  max-width:1180px;
  margin:0 auto;
  padding:0 20px 80px;
}
section{margin-bottom:var(--space-section);}
h3.sub-title{
  font-size:1.25rem;color:var(--azulejo-blue-dark);margin:32px 0 14px;
  display:flex;align-items:center;gap:12px;
}
h3.sub-title::after{content:"";flex:1;height:1px;background:var(--border);}
.night-note{font-size:0.82rem;color:var(--muted);margin-top:12px;}

/* 破格滿版工具類 */
.full-bleed{
  width:100vw;
  margin-left:calc(50% - 50vw);
}

/* ---------- 03 Hero ---------- */
header.hero{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  color:#fff;
  isolation:isolate;
}
.hero-bg{
  position:absolute;
  inset:-6% 0;
  width:100%;height:112%;
  object-fit:cover;
  z-index:-2;
  will-change:transform;
}
.hero-scrim{
  position:absolute;inset:0;z-index:-1;
  background:var(--scrim);
}
.hero-content{
  width:min(1180px,100%);
  margin:0 auto;
  padding:0 24px clamp(48px,9vh,96px);
}
.hero .eyebrow{
  font-family:var(--font-serif);
  font-size:var(--fs-eyebrow);
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 18px;
  display:flex;align-items:center;gap:14px;
}
.hero .eyebrow::after{content:"";width:64px;height:1px;background:var(--gold);opacity:0.7;}
.hero h1{
  font-size:var(--fs-display);
  font-weight:900;
  line-height:1.18;
  letter-spacing:0.02em;
  margin:0 0 20px;
  text-shadow:0 2px 24px rgba(0,0,0,0.35);
}
.hero h1 .line{display:block;overflow:hidden;}
.hero h1 .line-inner{display:inline-block;}
header.hero p.sub{
  font-size:clamp(0.95rem,1.6vw,1.12rem);
  color:rgba(255,255,255,0.88);
  margin:0 0 34px;
  max-width:640px;
}
.trip-facts{
  display:flex;
  flex-wrap:wrap;
  gap:0;
  border-top:1px solid rgba(255,255,255,0.28);
  padding-top:18px;
}
.fact-chip{
  font-size:0.85rem;
  color:rgba(255,255,255,0.92);
  padding:2px 22px 2px 0;
  margin-right:22px;
  border-right:1px solid rgba(255,255,255,0.22);
}
.fact-chip:last-child{border-right:none;margin-right:0;padding-right:0;}
.scroll-cue{
  position:absolute;
  left:50%;bottom:18px;
  transform:translateX(-50%);
  color:rgba(255,255,255,0.85);
  display:flex;flex-direction:column;align-items:center;gap:4px;
  font-size:0.68rem;letter-spacing:0.28em;text-transform:uppercase;
  font-family:var(--font-serif);
  pointer-events:none;
}
.scroll-cue svg{width:20px;height:20px;}

/* ---------- 04 TOC + progress ---------- */
nav.toc{
  background:rgba(255,255,255,0.94);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  position:sticky;
  top:0;
  z-index:50;
  box-shadow:var(--shadow-sm);
}
.progress-bar{
  position:absolute;top:0;left:0;
  width:100%;height:3px;
  background:var(--gold);
  transform:scaleX(0);
  transform-origin:left center;
  will-change:transform;
}
nav.toc ul{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:2px;
  margin:0;
  padding:10px 16px;
  max-width:1180px;
  margin-inline:auto;
  justify-content:center;
}
nav.toc a{
  display:inline-block;
  padding:8px 13px;
  color:var(--azulejo-blue-dark);
  text-decoration:none;
  font-size:0.86rem;
  font-weight:600;
  white-space:nowrap;
  position:relative;
  transition:color 0.2s ease;
}
nav.toc a::after{
  content:"";
  position:absolute;left:13px;right:13px;bottom:4px;
  height:2px;background:var(--gold);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 0.25s ease;
}
nav.toc a:hover{color:var(--terracotta);}
nav.toc a:hover::after,
nav.toc a.active::after{transform:scaleX(1);}
nav.toc a.active{color:var(--terracotta);}

/* ---------- 05 Magazine heads & chapter covers ---------- */
.kicker{
  font-family:var(--font-serif);
  font-size:var(--fs-eyebrow);
  letter-spacing:0.3em;
  text-transform:uppercase;
  color:var(--gold);
  display:flex;align-items:center;gap:12px;
  margin:0 0 14px;
}
.kicker::before{content:"";width:44px;height:1px;background:var(--gold);}

/* 開篇頁（#overview）與一般段落標題（#map） */
.mag-intro{padding-top:var(--space-section);margin-bottom:44px;}
.mag-intro h2.section-title,
.mag-head h2.section-title{
  font-size:var(--fs-h2);
  font-weight:900;
  color:var(--ink-deep);
  line-height:1.25;
  border:none;padding:0;
  margin:0 0 16px;
}
.mag-intro .lede{
  font-size:1.02rem;
  color:#4b4f54;
  max-width:820px;
  margin:0;
}
.mag-head{margin-bottom:28px;}
.mag-head .lede{color:var(--muted);max-width:820px;margin:0 0 6px;font-size:0.95rem;}

/* 深色標題帶（#budget、#tips） */
.dark-band{
  background:var(--ink-deep);
  color:#fff;
  padding:clamp(44px,7vh,72px) 24px;
  margin-bottom:40px;
}
.dark-band-inner{max-width:1180px;margin:0 auto;padding:0 0;}
.dark-band h2.section-title{
  font-size:var(--fs-h2);font-weight:900;color:#fff;
  border:none;padding:0;margin:0 0 12px;line-height:1.25;
}
.dark-band .lede{color:rgba(255,255,255,0.78);max-width:860px;margin:0;font-size:0.95rem;}
.dark-band .lede b{color:var(--gold);}

/* 章節封面 */
.chapter-cover{
  position:relative;
  height:clamp(440px,64vh,660px);
  overflow:hidden;
  margin-bottom:48px;
  isolation:isolate;
}
.chapter-cover--slim{height:clamp(300px,42vh,420px);}
.chapter-cover .cover-img{
  position:absolute;
  inset:-12% 0;
  width:100%;height:124%;
  object-fit:cover;
  z-index:-2;
}
.chapter-cover .cover-scrim{
  position:absolute;inset:0;z-index:-1;
  background:var(--scrim);
}
.chapter-cover .cover-text{
  position:absolute;
  left:50%;bottom:0;
  transform:translateX(-50%);
  width:min(1180px,100%);
  padding:0 24px clamp(30px,5vh,52px);
  color:#fff;
}
.chapter-cover .ch-no{
  position:absolute;
  right:24px;bottom:-0.18em;
  font-family:var(--font-serif);
  font-weight:900;
  font-size:clamp(6rem,15vw,11rem);
  line-height:1;
  color:rgba(255,255,255,0.14);
  pointer-events:none;
  user-select:none;
}
.chapter-cover .ch-en{
  font-family:var(--font-serif);
  font-size:var(--fs-eyebrow);
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 12px;
  display:flex;align-items:center;gap:12px;
}
.chapter-cover .ch-en::before{content:"";width:44px;height:1px;background:var(--gold);}
.chapter-cover h2.section-title{
  font-size:clamp(1.8rem,4.4vw,3.2rem);
  font-weight:900;
  color:#fff;
  line-height:1.25;
  border:none;padding:0;
  margin:0 0 14px;
  text-shadow:0 2px 18px rgba(0,0,0,0.35);
}
.chapter-cover .lede{
  font-size:0.95rem;
  color:rgba(255,255,255,0.88);
  max-width:680px;
  margin:0;
}

/* 舊 section-title 後援樣式（未包進封面的標題） */
h2.section-title{
  font-size:1.7rem;
  color:var(--azulejo-blue-dark);
  margin-bottom:8px;
}
p.section-desc{color:var(--muted);margin-top:0;margin-bottom:24px;font-size:0.95rem;}

/* ---------- 06 Cards ---------- */
.option-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:22px;
}
.option-card{
  position:relative;
  background:var(--card-bg);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:24px 22px 20px;
  box-shadow:var(--shadow-sm);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  transition:transform 0.35s cubic-bezier(0.22,1,0.36,1);
}
.option-card::before{ /* 方案色條 */
  content:"";
  position:absolute;top:0;left:0;right:0;height:4px;
  background:var(--plan-color,var(--azulejo-blue));
}
.option-card::after{ /* hover 陰影層（不 tween box-shadow） */
  content:"";
  position:absolute;inset:0;
  border-radius:inherit;
  box-shadow:var(--shadow-md);
  opacity:0;
  transition:opacity 0.35s ease;
  pointer-events:none;
}
.option-card:hover{transform:translateY(-6px);}
.option-card:hover::after{opacity:1;}
.option-card:nth-child(1){--plan-color:#1d4e6b;}
.option-card:nth-child(2){--plan-color:#2f9e8f;}
.option-card:nth-child(3){--plan-color:#c96a3f;}
.option-card:nth-child(4){--plan-color:#8b3a9e;}
.option-card:nth-child(5){--plan-color:#b5342c;}
.option-card .plan-letter{
  position:absolute;
  top:-14px;right:2px;
  font-family:var(--font-serif);
  font-weight:900;
  font-size:5.4rem;
  line-height:1;
  color:var(--plan-color,var(--azulejo-blue));
  opacity:0.09;
  pointer-events:none;user-select:none;
}
.option-card .badge{
  display:inline-block;
  background:var(--azulejo-light);
  color:var(--azulejo-blue-dark);
  font-size:0.75rem;
  font-weight:700;
  padding:4px 10px;
  border-radius:6px;
  margin-bottom:10px;
  width:fit-content;
}
.option-card h4{margin:0 0 6px;font-size:1.18rem;color:var(--ink);font-family:var(--font-serif);font-weight:700;}
.option-card .tagline{color:var(--terracotta);font-weight:600;font-size:0.92rem;margin-bottom:12px;}
.option-card ul{margin:0 0 14px;padding-left:20px;font-size:0.9rem;}
.option-card ul li{margin-bottom:5px;}
.option-card .stats{
  margin-top:auto;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding-top:12px;
  border-top:1px dashed var(--border);
  font-size:0.8rem;
}
.stat-pill{background:var(--cork);padding:4px 10px;border-radius:6px;color:var(--azulejo-blue-dark);}

/* destination blocks */
.dest-block{
  background:#fff;
  border-radius:var(--radius-lg);
  border:1px solid var(--border);
  padding:30px;
  margin-bottom:40px;
  box-shadow:var(--shadow-sm);
}
.dest-header{
  display:flex;flex-direction:column;gap:2px;
  margin-bottom:8px;
}
.dest-header .en{
  order:-1;
  font-family:var(--font-serif);
  font-size:var(--fs-eyebrow);
  letter-spacing:0.26em;
  text-transform:uppercase;
  color:var(--gold);
}
.dest-header h3{
  margin:0;
  font-size:clamp(1.5rem,2.6vw,2rem);
  font-weight:900;
  color:var(--ink-deep);
}
.dest-header::after{content:"";width:56px;height:2px;background:var(--gold);margin-top:10px;}
.dest-intro{color:#444;margin:14px 0 22px;}

.two-col{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:26px;
}

.spot-list{list-style:none;margin:0;padding:0;}
.spot-list li{
  padding:13px 0;
  border-bottom:1px solid var(--border);
}
.spot-list li:last-child{border-bottom:none;}
.spot-list .spot-name{font-weight:700;color:var(--ink);}
.spot-list .spot-name .en{font-weight:400;color:var(--muted);font-size:0.82rem;margin-left:6px;}
.spot-list .spot-desc{font-size:0.88rem;color:#444;margin-top:3px;}
.spot-list .spot-price{
  font-size:0.8rem;color:var(--terracotta);margin-top:3px;font-weight:600;
  font-family:var(--font-serif);
}

.info-box{
  background:var(--azulejo-light);
  border-radius:var(--radius-sm);
  border-left:3px solid var(--azulejo-blue);
  padding:16px 18px;
  margin-bottom:14px;
  font-size:0.88rem;
}
.info-box h4{margin:0 0 8px;color:var(--azulejo-blue-dark);font-size:0.95rem;}
.info-box.food{background:#fdf0e4;border-left-color:var(--terracotta);}
.info-box.food h4{color:var(--terracotta);}
.info-box.transit{background:#eef3ea;border-left-color:#4a7c3a;}
.info-box.transit h4{color:#4a7c3a;}

/* tips */
.tip-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;counter-reset:tip;}
.tip-card{
  position:relative;
  background:#fff;border:1px solid var(--border);
  border-radius:var(--radius);
  padding:20px 18px 18px;
  font-size:0.88rem;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  transition:transform 0.35s cubic-bezier(0.22,1,0.36,1);
}
.tip-card::before{
  counter-increment:tip;
  content:counter(tip,decimal-leading-zero);
  position:absolute;top:6px;right:12px;
  font-family:var(--font-serif);
  font-weight:900;font-size:2rem;
  color:var(--gold);opacity:0.35;
  pointer-events:none;
}
.tip-card::after{
  content:"";position:absolute;inset:0;border-radius:inherit;
  box-shadow:var(--shadow-md);opacity:0;
  transition:opacity 0.35s ease;pointer-events:none;
}
.tip-card:hover{transform:translateY(-5px);}
.tip-card:hover::after{opacity:1;}
.tip-card h4{margin:0 0 8px;color:var(--azulejo-blue-dark);font-size:0.98rem;}

/* ---------- 07 Galleries & lightbox ---------- */
.gallery{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
  margin-bottom:24px;
}
.gallery figure{
  margin:0;
  border-radius:12px;
  overflow:hidden;
  background:#e9e4da;
  position:relative;
  aspect-ratio:4/3;
  cursor:zoom-in;
  box-shadow:var(--shadow-sm);
}
.gallery figure img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 0.5s cubic-bezier(0.22,1,0.36,1);
}
.gallery figure:hover img{transform:scale(1.06);}
.gallery figcaption{
  position:absolute;left:0;right:0;bottom:0;
  background:linear-gradient(transparent,rgba(0,0,0,0.68));
  color:#fff;font-size:0.75rem;
  padding:20px 10px 7px;
}
.gallery figure::after{
  content:"⤢";
  position:absolute;top:8px;right:8px;
  width:26px;height:26px;
  background:rgba(0,0,0,0.45);
  color:#fff;
  border-radius:6px;
  font-size:0.9rem;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity 0.2s ease;
  pointer-events:none;
}
.gallery figure:hover::after{opacity:1;}

/* 雜誌拼貼版（7張圖廊） */
.gallery--collage{
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:clamp(130px,16vw,200px);
  grid-auto-flow:dense;
  gap:12px;
}
.gallery--collage figure{aspect-ratio:auto;height:100%;}
.gallery--collage figure:first-child{grid-column:span 2;grid-row:span 2;}
.gallery--collage figure:nth-child(6),
.gallery--collage figure:nth-child(7){grid-column:span 2;}
.gallery--collage figure:first-child figcaption{font-size:0.85rem;padding:26px 12px 9px;}

/* 橫向滾動圖帶（4-5張圖廊） */
.gallery--strip{
  display:flex;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  gap:12px;
  margin-inline:-30px;
  padding-inline:30px;
  padding-bottom:10px;
  scrollbar-width:thin;
}
.gallery--strip figure{
  flex:0 0 clamp(240px,30vw,400px);
  scroll-snap-align:start;
  aspect-ratio:4/3;
}

/* Lightbox */
.lightbox-overlay{
  display:none;
  position:fixed;inset:0;
  background:rgba(10,10,10,0.92);
  z-index:1000;
  align-items:center;justify-content:center;
  padding:40px 20px;
  cursor:zoom-out;
}
.lightbox-overlay.open{display:flex;}
.lightbox-overlay img{
  max-width:100%;max-height:80vh;
  object-fit:contain;
  border-radius:8px;
  box-shadow:0 10px 40px rgba(0,0,0,0.5);
}
.lightbox-caption{
  position:absolute;left:0;right:0;bottom:28px;
  text-align:center;color:#fff;font-size:0.95rem;
  padding:0 20px;
}
.lightbox-close{
  position:absolute;top:18px;right:24px;
  color:#fff;font-size:2rem;line-height:1;
  background:none;border:none;cursor:pointer;
  font-weight:300;
}
.lightbox-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(255,255,255,0.12);
  border:none;color:#fff;
  width:44px;height:44px;border-radius:50%;
  font-size:1.4rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background 0.2s ease;
}
.lightbox-nav:hover{background:rgba(255,255,255,0.25);}
.lightbox-prev{left:16px;}
.lightbox-next{right:16px;}

/* ---------- 08 Tables & tabs ---------- */
.table-scroll{
  overflow-x:auto;
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
  background:#fff;
  -webkit-overflow-scrolling:touch;
}
.table-scroll table{border:none;box-shadow:none;border-radius:0;}

table.compare{
  width:100%;
  border-collapse:collapse;
  font-size:0.88rem;
  background:#fff;
  min-width:760px;
}
table.compare th,table.compare td{
  border:1px solid var(--border);
  padding:11px 12px;
  text-align:left;
  vertical-align:top;
}
table.compare th{background:var(--ink-deep);color:#fff;font-weight:600;border-color:#33383c;}
table.compare tr:nth-child(even) td{background:#fafaf7;}
table.compare th:first-child,
table.compare td:first-child{
  position:sticky;left:0;
  background:var(--paper);
  font-weight:700;
  z-index:1;
}
table.compare th:first-child{background:var(--ink-deep);}
.compare-wrap{margin-top:28px;}

.tab-buttons{
  display:flex;gap:4px;flex-wrap:nowrap;
  overflow-x:auto;
  margin-bottom:20px;
  border-bottom:1px solid var(--border);
  -webkit-overflow-scrolling:touch;
}
.tab-btn{
  position:relative;
  padding:12px 18px 14px;
  border:none;background:none;
  color:var(--muted);
  font-weight:700;
  font-size:0.9rem;
  font-family:var(--font-sans);
  cursor:pointer;
  white-space:nowrap;
  transition:color 0.2s ease;
}
.tab-btn::after{
  content:"";
  position:absolute;left:14px;right:14px;bottom:-1px;
  height:3px;background:var(--terracotta);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 0.25s ease;
}
.tab-btn:hover{color:var(--ink);}
.tab-btn.active{color:var(--ink-deep);}
.tab-btn.active::after{transform:scaleX(1);}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

table.itinerary{
  width:100%;
  border-collapse:collapse;
  font-size:0.87rem;
  background:#fff;
  min-width:620px;
}
table.itinerary th{
  background:var(--ink-deep);color:#fff;padding:11px 12px;text-align:left;
  font-weight:600;letter-spacing:0.04em;
}
table.itinerary td{padding:11px 12px;border-bottom:1px solid var(--border);vertical-align:top;}
table.itinerary td.day{
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:700;color:var(--azulejo-blue-dark);white-space:nowrap;
}
table.itinerary td.city{color:var(--terracotta);font-weight:600;white-space:nowrap;}
table.itinerary tr:nth-child(even) td{background:#fafaf7;}
table.itinerary th:first-child,
table.itinerary td:first-child{position:sticky;left:0;background:var(--paper);z-index:1;}
table.itinerary th:first-child{background:var(--ink-deep);}
table.itinerary tr:nth-child(even) td:first-child{background:#f2efe7;}

.budget-table{
  width:100%;border-collapse:collapse;font-size:0.9rem;background:#fff;
  min-width:560px;
}
.budget-table th{background:var(--ink-deep);color:var(--gold);padding:11px 14px;text-align:left;font-weight:600;letter-spacing:0.04em;}
.budget-table td{padding:11px 14px;border-bottom:1px solid var(--border);}
.budget-table td:nth-child(2){font-family:var(--font-serif);font-weight:700;white-space:nowrap;}
.budget-table tr:last-child td{
  font-weight:700;background:#f6f1e4;
  border-top:2px solid var(--gold);
  font-size:0.98rem;
}

/* ---------- 09 Map（功能區，樣式僅微調） ---------- */
.map-wrap{
  background:var(--card-bg);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:22px;
  box-shadow:var(--shadow-md);
}
.map-toggle{
  display:flex;flex-wrap:wrap;gap:10px;
  margin-bottom:14px;
}
.map-toggle-btn{
  padding:8px 16px;border-radius:20px;
  border:1px solid var(--border);background:#fff;
  font-size:0.85rem;font-weight:600;color:var(--muted);
  cursor:pointer;transition:background 0.15s,color 0.15s,border-color 0.15s;
}
.map-toggle-btn:hover{background:var(--azulejo-light);}
.map-toggle-btn.active{
  background:var(--azulejo-blue-dark);color:#fff;border-color:var(--azulejo-blue-dark);
}
.map-controls{
  display:flex;flex-wrap:wrap;gap:20px;
  margin-bottom:14px;
  align-items:center;
  font-size:0.85rem;
}
.map-controls .ctrl-group{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.map-controls label{display:flex;align-items:center;gap:5px;cursor:pointer;white-space:nowrap;}
.map-controls select{
  padding:6px 10px;border-radius:8px;border:1px solid var(--border);
  font-size:0.85rem;background:#fff;color:var(--ink);
}
#tripMapFrame{
  position:relative;
  width:100%;height:560px;border-radius:12px;
  border:1px solid var(--border);
  background:linear-gradient(180deg,#dcecf4 0%,#cfe6ef 100%);
  overflow:hidden;
  touch-action:none;
}
#tripMapFrame svg{width:100%;height:100%;display:block;cursor:grab;}
#tripMapFrame svg.grabbing{cursor:grabbing;}
.map-zoom-btns{
  position:absolute;right:12px;bottom:12px;
  display:flex;flex-direction:column;gap:6px;
  z-index:5;
}
.map-zoom-btns button{
  width:34px;height:34px;border-radius:8px;
  border:1px solid var(--border);background:#fff;
  font-size:1.1rem;font-weight:700;color:var(--azulejo-blue-dark);
  cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,0.15);
}
.map-zoom-btns button:hover{background:var(--azulejo-light);}
.map-tooltip{
  position:absolute;pointer-events:none;
  background:rgba(20,30,35,0.92);color:#fff;
  font-size:0.78rem;padding:6px 10px;border-radius:6px;
  max-width:220px;line-height:1.5;
  transform:translate(-50%,-115%);
  display:none;z-index:6;
  white-space:nowrap;
}
.map-note{font-size:0.78rem;color:var(--muted);margin-top:10px;}
#googleMapFrame{width:100%;}
#googleMapCanvas{
  width:100%;height:560px;border-radius:12px;
  border:1px solid var(--border);
  background:#eef1f2;
  display:flex;align-items:center;justify-content:center;
}
.gmap-tools{
  display:flex;flex-direction:column;gap:8px;
  margin-bottom:12px;
}
.gmap-tool-row{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
}
.gmap-input{
  flex:1 1 160px;min-width:140px;
  padding:8px 12px;border-radius:8px;border:1px solid var(--border);
  font-size:0.85rem;color:var(--ink);background:#fff;
  font-family:inherit;
}
.gmap-arrow{color:var(--muted);font-weight:700;}
.gmap-select{
  padding:8px 10px;border-radius:8px;border:1px solid var(--border);
  font-size:0.85rem;background:#fff;color:var(--ink);font-family:inherit;
}
.gmap-btn{
  padding:8px 14px;border-radius:8px;border:1px solid var(--border);
  background:#fff;color:var(--azulejo-blue-dark);font-weight:600;
  font-size:0.85rem;cursor:pointer;white-space:nowrap;
}
.gmap-btn:hover{background:var(--azulejo-light);}
.gmap-btn.primary{background:var(--azulejo-blue-dark);color:#fff;border-color:var(--azulejo-blue-dark);}
.gmap-btn.primary:hover{opacity:0.9;}
.gmap-btn.ghost{color:var(--muted);}
.gmap-route-summary{
  font-size:0.85rem;color:var(--ink);background:var(--azulejo-light);
  padding:8px 12px;border-radius:8px;margin:0;
}
.gmap-route-summary.error{background:#fbe9e7;color:#9a3b2e;}
.pac-container{z-index:9999;}

/* ---------- 10 Footer ---------- */
footer{
  background:var(--ink-deep);
  color:rgba(255,255,255,0.6);
  text-align:center;
  padding:56px 24px 64px;
  font-size:0.8rem;
}
footer a{color:var(--gold);}
footer .credits{
  max-width:900px;margin:20px auto 0;text-align:left;
}
footer .credits summary{
  cursor:pointer;
  text-align:center;
  color:rgba(255,255,255,0.5);
  font-size:0.78rem;
  letter-spacing:0.08em;
  padding:6px;
}
footer .credits summary:hover{color:var(--gold);}
.credit-list{font-size:0.72rem;line-height:1.9;margin-top:12px;columns:2;color:rgba(255,255,255,0.4);word-break:break-all;}

/* ---------- 11 Responsive & motion ---------- */
@media (max-width:900px){
  .chapter-cover{height:clamp(380px,52vh,520px);}
  .chapter-cover .ch-no{font-size:clamp(4.5rem,13vw,8rem);}
}
@media (max-width:800px){
  .two-col{grid-template-columns:1fr;}
}
@media (max-width:700px){
  html{scroll-padding-top:120px;}
  nav.toc ul{
    flex-wrap:nowrap;
    overflow-x:auto;
    justify-content:flex-start;
    -webkit-overflow-scrolling:touch;
  }
  .gallery--collage{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(120px,26vw,170px);}
  .gallery--collage figure:first-child{grid-column:span 2;}
  .gallery--strip{margin-inline:-20px;padding-inline:20px;}
  .gallery--strip figure{flex-basis:min(78vw,320px);}
  .dest-block{padding:20px 16px;}
  .gallery--strip{margin-inline:-16px;padding-inline:16px;}
  .credit-list{columns:1;}
  .lightbox-nav{width:38px;height:38px;font-size:1.1rem;}
  .fact-chip{border-right:none;padding:3px 0;margin-right:16px;}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{transition-duration:0.01ms !important;animation-duration:0.01ms !important;}
  .scroll-cue{display:none;}
}