﻿/* =================================================================
   GLOBAL STYLES — shared across all pages
   ================================================================= */

/* ── CSS Custom Properties ── */
:root {
  --ink: #151a24;
  --ink2: #151a24;
  --parchment: #F7F2EA;
  --parchment2: #EDE6D8;
  --gold: #1cb56d;
  --gold2: #4fd18f;
  --gold3: #9be7bf;
  --white: #FFFFFF;
  --ff-display: 'Playfair Display', Georgia, serif;
  --ff-body: 'Jost', sans-serif;
  --ease: cubic-bezier(.22,1,.36,1);
  --color-primary: red;
  --color-accent: #1cb56d;
  --color-gold: #1cb56d;
  --color-gold-light: #4fd18f;
  --color-gold-bg: #9be7bf;
  --color-gold-border: #9be7bf;
  --color-red: #d14c2c;
  --color-star: #ffb400;
  --color-footer-bg: #151a24;
  --color-footer-link: rgba(247,242,234,.32);
  --color-footer-link-hover: var(--color-accent);
  --color-footer-desc: rgba(247,242,234,.3);
  --color-footer-bot: rgba(247,242,234,.18);
}

/* ── Base ── */
html { scroll-behavior: smooth; font-size: 17px; margin: 0; padding: 0; overflow-x: hidden; }
body { font-family: var(--ff-body); background: var(--ink); color: var(--parchment); line-height: 1.7; overflow-x: hidden; cursor: default; margin: 0; padding: 0; }

/* ── Custom Cursor ── */
.cur { position: fixed; width: 10px; height: 10px; border-radius: 50%; background: var(--gold2); pointer-events: none; z-index: 9999; mix-blend-mode: difference; }
.cur-ring { position: fixed; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--gold2); pointer-events: none; z-index: 9998; transition: width .25s, height .25s; mix-blend-mode: difference; opacity: .6; }

/* ── Navigation ── */
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 500; display: flex; align-items: center; justify-content: space-between; padding: 1.75rem 4rem; transition: all .5s var(--ease); }
nav.solid { background: #151a24; backdrop-filter: blur(18px); padding: 1.1rem 4rem; border-bottom: 1px solid rgba(28,181,109,.12); }
.nav-logo { position: relative; padding-left: 80px; font-family: var(--ff-display); font-size: 1.15rem; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--parchment); text-decoration: none; display: flex; align-items: center; gap: .7rem; }
.nav-logo img { position: absolute; left: 0; top: 20px; transform: translateY(-50%); height: 150px; width: auto; z-index: 10; display: block; }
.logo-gem { width: 26px; height: 26px; border: 1px solid var(--gold); transform: rotate(45deg); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.logo-gem span { display: block; width: 7px; height: 7px; background: var(--gold); border-radius: 50%; transform: rotate(-45deg); }
.nav-links { display: flex; align-items: center; gap: 2.5rem; list-style: none; }
.nav-dropdown { position: relative; }
.dropdown-menu, .dropdown-menu li { list-style: none; padding-left: 0; margin: 0; }
.dropdown-menu { display: none; position: absolute; top: 100%; left: 0; background: rgba(10,8,6,0.98); border: 1px solid rgba(28,181,109,.12); min-width: 180px; box-shadow: 0 8px 24px rgba(28,181,109,.12); z-index: 1000; padding: 0.7rem 0; border-radius: 0 0 8px 8px; }
.nav-dropdown:hover > .dropdown-menu, .nav-dropdown:focus-within > .dropdown-menu { display: block; }
.dropdown-menu li { width: 100%; }
.dropdown-menu a { display: block; padding: 0.6rem 1.5rem; color: rgba(247,242,234,.85); font-size: .85em; text-transform: none; letter-spacing: 0.04em; background: none; border: none; text-decoration: none; transition: background .2s, color .2s; }
.dropdown-menu a:hover { background: rgba(28,181,109,.12); color: var(--gold3); }
.nav-links a { font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; color: rgba(247,242,234,.55); text-decoration: none; transition: color .3s; position: relative; }
.nav-links a::after { content: ''; position: absolute; bottom: -3px; left: 0; right: 100%; height: 1px; background: var(--gold2); transition: right .35s var(--ease); }
.nav-links a:hover { color: var(--gold3); }
.nav-links a:hover::after { right: 0; }
.nav-cta { border: 1px solid rgb(28 181 109 / 50%); padding: .5rem 1.4rem; font-size: .68rem; letter-spacing: .15em; text-transform: uppercase; color: var(--gold3); background: transparent; cursor: pointer; font-family: var(--ff-body); transition: all .3s; font-weight: 500; }
.nav-cta:hover { background: var(--gold); color: var(--ink); border-color: var(--gold); }
.burger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: default; padding: 4px; }
.burger span { width: 22px; height: 1px; background: var(--parchment); display: block; transition: all .35s; }

/* ── Footer ── */
footer { border-top: 1px solid var(--color-accent); padding: 5rem 4rem 2.5rem; color: var(--color-primary); background: var(--color-footer-bg); }
.foot-top { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 4rem; max-width: 1200px; margin: 0 auto 4rem; }
.flogo { font-family: var(--ff-display); font-size: 1.3rem; font-weight: 400; letter-spacing: .1em; color: var(--parchment); display: flex; align-items: center; gap: .6rem; margin-bottom: 1rem; }
.fdesc2 { font-size: .78rem; color: var(--color-footer-desc); line-height: 1.8; font-weight: 300; max-width: 240px; }
.fcol h5 { font-size: .58rem; letter-spacing: .22em; text-transform: uppercase; color: var(--color-gold); margin-bottom: 1.2rem; font-weight: 500; text-align: left !important; }
.fcol ul.flinks { padding-left: 0 !important; margin-left: 0 !important; }
.fcol ul.flinks li { margin-left: 0 !important; }
footer, .foot-top, .foot-bot, .foot-top *, .foot-bot * { text-align: left !important; }
.foot-social, .social-icon, .social-icon span { text-align: center !important; }
.flinks { list-style: none; display: flex; flex-direction: column; gap: .5rem; }
.flinks a { font-size: .78rem; color: var(--color-footer-link); text-decoration: none; transition: color .3s; font-weight: 300; }
.flinks a:hover { color: var(--color-footer-link-hover); }
.foot-social { display: flex; align-items: center; justify-content: center; gap: 1.6rem; max-width: 1200px; margin: 0 auto 2.5rem; flex-wrap: wrap; }
.social-icon { display: inline-flex; flex-direction: column; align-items: center; gap: .45rem; text-decoration: none; color: rgba(247,242,234,.38); transition: filter .2s, transform .2s, opacity .2s; }
.social-icon svg { width: 22px; height: 22px; flex-shrink: 0; }
.social-icon span { font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 400; line-height: 1; }
.social-icon:hover { filter: brightness(1.25); transform: translateY(-3px); }
.social-icon[aria-label="Facebook"]    { color: #1877F2; }
.social-icon[aria-label="Instagram"]   { color: #E1306C; }
.social-icon[aria-label="TikTok"]      { color: #FF0050; }
.social-icon[aria-label="WhatsApp"]    { color: #25D366; }
.social-icon[aria-label="Google"]      { color: #4285F4; }
.social-icon[aria-label="Tripadvisor"] { color: #34E0A1; }
.foot-bot { border-top: 1px solid rgb(155 231 191 / 24%); padding-top: 2rem; max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.foot-bot p { font-size: .7rem; color: var(--color-footer-bot); letter-spacing: .04em; }


/* ================================================================
   PAGE: HOME — #page-home
   ================================================================ */
/* ── Keyframes (must be at top level, not nested) ── */
@keyframes sp   { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }
@keyframes fu   { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:none} }
@keyframes fi   { from{opacity:0} to{opacity:1} }
@keyframes gl   { from{transform:scale(.88)} to{transform:scale(1.1)} }
#page-home {

  /* ── Shared utility ── */
  .stag { display:inline-flex;align-items:center;gap:.8rem;font-size:.63rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold2);font-weight:500;margin-bottom:1.2rem; }
  .stag::before { content:'';width:24px;height:1px;background:var(--gold2); }
  .sh2 { font-family:var(--ff-display);font-size:clamp(2.4rem,4.5vw,3.8rem);font-weight:400;line-height:1.1;color:var(--parchment); }
  .sh2 em { font-style:italic;color:var(--gold3); }
  .sp { font-size:.93rem;color:rgba(247,242,234,.48);line-height:1.9;font-weight:300;max-width:460px;margin-top:.9rem; }
  .reveal { opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease); }
  .reveal.on { opacity:1;transform:none; }
  .divbar { width:44px;height:1px;background:var(--gold);margin:1.4rem 0; }
  .alist { list-style:none;margin-top:1.8rem;display:flex;flex-direction:column;gap:.85rem; }
  .alist li { display:flex;align-items:flex-start;gap:.9rem;font-size:.86rem;color:rgba(247,242,234,.5);line-height:1.75;font-weight:300; }
  .alist li::before { content:'';width:5px;height:5px;border-radius:50%;background:var(--gold);margin-top:.6rem;flex-shrink:0; }

  /* ── Hero ── */
  .hero { height:100vh;min-height:700px;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden; }
  .hero-bg { position:absolute;inset:0;z-index:0;background-image:url('../img/banner/banner1.png');background-size:cover;background-position:center;background-repeat:no-repeat;filter:brightness(0.82) saturate(1.08); }
  .hero-overlay { position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgb(29,32,48) 0%,rgba(10,8,6,.45) 40%,rgba(10,8,6,.15) 100%); }
  .hero-overlay2 { position:absolute;inset:0;z-index:1;background:linear-gradient(to right,rgb(54 64 101/65%) 0%,#29355500 55%); }
  .hero-canvas { position:absolute;inset:0;z-index:0;width:100%;height:100%; }
  .hero-content { position:relative;z-index:2;padding:0 4rem 6.5rem;max-width:860px; }
  .eyebrow { display:flex;align-items:center;gap:1rem;font-size:.65rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold2);font-weight:500;margin-bottom:2rem;opacity:0;animation:fu .9s .3s var(--ease) forwards; }
  .eyebrow::before { content:'';width:32px;height:1px;background:var(--gold2);flex-shrink:0; }
  .hero-h1 { font-family:var(--ff-display);font-size:clamp(4.2rem,9vw,8.5rem);font-weight:400;line-height:.95;color:var(--parchment);margin-bottom:1.2rem;opacity:0;animation:fu .9s .5s var(--ease) forwards; }
  .hero-h1 em { font-style:italic;color:var(--gold3); }
  .hero-sub { font-size:.97rem;color:rgba(247,242,234,.58);max-width:460px;line-height:1.9;font-weight:300;margin-bottom:2.8rem;opacity:0;animation:fu .9s .7s var(--ease) forwards; }
  .hero-btns { display:flex;align-items:center;gap:2rem;flex-wrap:wrap;opacity:0;animation:fu .9s .9s var(--ease) forwards; }
  .btn-fill { display:inline-flex;align-items:center;gap:.65rem;background:var(--gold);color:var(--ink);padding:.82rem 2rem;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;font-family:var(--ff-body);text-decoration:none;border:none;cursor:default;transition:background .3s,gap .3s; }
  .btn-fill:hover { background:var(--gold2);gap:1.1rem; }
  .btn-fill svg { width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2; }
  .btn-line { border-bottom:1px solid rgba(28,181,109,.12);padding:.2rem 0;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(247,242,234,.6);text-decoration:none;transition:color .3s,border-color .3s;font-weight:500; }
  .btn-line:hover { color:var(--gold3);border-color:var(--gold2); }
  .scroll-hint { position:absolute;right:4rem;bottom:3rem;z-index:2;display:flex;flex-direction:column;align-items:center;gap:.5rem;opacity:0;animation:fi 1s 1.2s forwards; }
  .scroll-hint span { font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(28,181,109,1);writing-mode:vertical-rl; }
  .scroll-line { width:1px;height:56px;background:linear-gradient(to bottom,var(--gold2),transparent);animation:sp 2s infinite; }

  /* ── Stats ── */
  .stats { display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(28,181,109,.12);border-bottom:1px solid rgba(28,181,109,.12); }
  .stat { padding:2.2rem 3rem;border-right:1px solid rgba(28,181,109,.1);position:relative;overflow:hidden;transition:background .35s; }
  .stat:last-child { border-right:none; }
  .stat:hover { background:rgba(184,144,42,.04); }
  .stat-n { font-family:var(--ff-display);font-size:2.7rem;font-weight:500;color:var(--gold2);line-height:1;display:block;margin-bottom:.3rem; }
  .stat-n sup { font-size:1.3rem;color:var(--gold); }
  .stat-l { font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(247,242,234,.38);font-weight:500; }

  /* ── About ── */
  .about { display:grid;grid-template-columns:1fr 1fr;min-height:82vh; }
  .about-vis { position:relative;overflow:hidden;background:var(--ink2);display:flex;align-items:center;justify-content:center; }
  .about-img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0; }
  .about-aura { position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 80% 60% at 30% 60%,rgba(184,144,42,.18) 0%,transparent 70%),radial-gradient(ellipse 60% 80% at 70% 30%,rgba(10,8,6,.55) 0%,transparent 80%); }
  .about-badge { position:absolute;bottom:2.5rem;right:2.5rem;border:1px solid rgba(28,181,109,.12);padding:1.4rem 1.8rem;text-align:center;background:#1cb56d !important;color:#151a24;backdrop-filter:blur(12px); }
  .about-badge .bn, .about-badge .bt { color:#151a24;font-weight:900; }
  .bn { font-family:var(--ff-display);font-size:2.5rem;font-weight:500;color:var(--gold2);line-height:1;display:block; }
  .bt { font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(247,242,234,.45);margin-top:.35rem;display:block; }
  .about-copy { padding:6rem 5rem;display:flex;flex-direction:column;justify-content:center; }

  /* ── Attractions ── */
  .sec-att { padding:8rem 4rem;max-width:1400px;margin:0 auto; }
  .att-hd { display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:4rem;flex-wrap:wrap;gap:2rem; }
  .tabs { display:flex;gap:0;border-bottom:1px solid rgba(28,181,109,.12); }
  .tab { padding:.55rem 1.3rem;background:none;border:none;border-bottom:1px solid transparent;margin-bottom:-1px;font-family:var(--ff-body);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(247,242,234,.38);cursor:none;transition:all .3s;font-weight:500; }
  .tab.on, .tab:hover { color:var(--gold2);border-bottom-color:var(--gold2); }
  .att-grid { display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:8px;align-items:stretch; }
  .acard { position:relative;overflow:hidden;cursor:pointer;min-height:unset; }
  .acard.big { grid-row:span 2;grid-column:span 2; }
  .att-grid .acard:not(.big) { grid-row:auto;grid-column:auto; }
  .acard:not(.big) { aspect-ratio:1/1;display:flex;flex-direction:column; }
  .acard:not(.big) .acard-img { width:100%;height:100%;object-fit:cover;flex:1 1 auto;display:block; }
  .acard-img { width:100%;height:100%;object-fit:cover;display:block;image-rendering:auto; }
  .abg { position:absolute;inset:0;transition:transform .8s var(--ease); }
  .acard:hover .abg { transform:scale(1.06); }
  .aink { position:absolute;inset:0;background:linear-gradient(to top,rgba(10,8,6,.95) 0%,rgba(10,8,6,.08) 55%);transition:opacity .4s; }
  .acard:hover .aink { opacity:.82; }
  .ainfo { position:absolute;bottom:0;left:0;right:0;padding:2rem;transform:translateY(6px);transition:transform .4s var(--ease); }
  .acard:hover .ainfo { transform:none; }
  .acat { font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold2);font-weight:500;margin-bottom:.45rem;display:block; }
  .aname { font-family:var(--ff-display);font-size:1.35rem;font-weight:400;color:var(--parchment);line-height:1.2; }
  .acard.big .aname { font-size:2.1rem; }
  .adesc { font-size:.78rem;color:rgba(247,242,234,.58);margin-top:.35rem;line-height:1.7;font-weight:300;max-height:0;overflow:hidden;transition:max-height .5s var(--ease); }
  .acard:hover .adesc { max-height:80px; }
  .alink { display:inline-flex;align-items:center;gap:.35rem;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);margin-top:.75rem;font-weight:500;opacity:0;transform:translateY(4px);transition:opacity .4s .1s,transform .4s .1s var(--ease); }
  .acard:hover .alink { opacity:1;transform:none; }
  .alink svg { width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2; }
  .aicon { position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:5rem;opacity:.1;pointer-events:none;transition:opacity .4s; }
  .acard.big .aicon { font-size:9rem; }
  .acard:hover .aicon { opacity:.04; }
  .c-angkor { background:linear-gradient(160deg,#0F1E16,#1B3425 40%,#0A0E0B); }
  .c-bayon { background:linear-gradient(160deg,#1A1208,#2E2010 50%,#0A0806); }
  .c-taprohm { background:linear-gradient(160deg,#0C1A10,#1A2E18 50%,#060D07); }
  .c-tonle { background:linear-gradient(160deg,#080E18,#101828 50%,#040810); }
  .c-apsara { background:linear-gradient(160deg,#180C18,#2A1228 50%,#0A060A); }

  /* ── Food / Activity ── */
  .sec-activity { background:var(--parchment);color:var(--ink);padding:8rem 4rem; }
  .activity-inner { max-width:1200px;margin:0 auto; }
  .activity-stag { display:inline-flex;align-items:center;gap:.8rem;font-size:.63rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);font-weight:500;margin-bottom:1.2rem; }
  .activity-stag::before { content:'';width:24px;height:1px;background:var(--gold); }
  .activity-h2 { font-family:var(--ff-display);font-size:clamp(2.4rem,4.5vw,3.8rem);font-weight:400;line-height:1.1;color:var(--ink); }
  .activity-h2 em { font-style:italic;color:var(--gold); }
  .activity-sub { font-size:.93rem;color:rgba(10,8,6,.48);line-height:1.9;font-weight:300;max-width:460px;margin-top:.9rem; }
  .activity-grid { display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:4rem;border:1px solid rgba(10,8,6,.07); }
  .activity-img { width:100%;height:300px;object-fit:cover;display:block;border-radius:0;margin-bottom:0; }
  .acard2 { padding:0;border-right:1px solid rgba(10,8,6,.07);border-bottom:1px solid rgba(10,8,6,.07);position:relative;overflow:hidden;transition:background .3s;display:flex;flex-direction:column; }
  .acard2:nth-child(2n) { border-right:none; }
  .acard2:nth-child(3), .acard2:nth-child(4) { border-bottom:none; }
  .acard2::after { content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--gold);transition:width .55s var(--ease); }
  .acard2:hover { background:rgba(184,144,42,.04); }
  .acard2:hover::after { width:100%; }
  .acard2-body { padding:16px 20px 20px; }
  .anum { font-family:var(--ff-display);font-size:3.2rem;font-weight:400;color:rgba(155,231,191,1);line-height:1;margin-bottom:.6rem; }
  .aname2 { font-family:var(--ff-display);font-size:1.32rem;font-weight:500;color:var(--ink);margin-bottom:.55rem; }
  .adesc2 { font-size:.83rem;color:rgba(10,8,6,.54);line-height:1.8;font-weight:300; }
  .aprice { display:inline-block;margin-top:1rem;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:500;border-bottom:1px solid rgba(79,209,143,1);padding-bottom:1px; }

  /* ── Tips ── */
  .sec-tips { padding:8rem 4rem;max-width:1400px;margin:0 auto; }
  .tips-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:4rem;border:1px solid rgb(155 231 191/24%); }
  .tcard { padding:2.2rem 2rem;border-right:1px solid rgb(155 231 191/24%);border-bottom:1px solid rgb(155 231 191/24%);position:relative;overflow:hidden;display:flex;flex-direction:column;text-align:center; }
  .tcard:nth-child(3n) { border-right:none; }
  .tcard:nth-child(4), .tcard:nth-child(5), .tcard:nth-child(6) { border-bottom:none; }
  .tcard::before { content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(to right,var(--gold),transparent);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease); }
  .tcard:hover::before { transform:scaleX(1); }
  .ticon { width:60px;height:60px;border:1px solid rgb(155 231 191/24%);display:flex;align-items:center;justify-content:center;margin-bottom:1.4rem;font-size:2.4rem !important;line-height:1.1;margin-left:auto;margin-right:auto; }
  .th { font-family:var(--ff-display);font-size:1.12rem;font-weight:500;color:var(--parchment);margin-bottom:.6rem;display:block;margin-left:auto;margin-right:auto;text-align:center; }
  .tp { font-size:.8rem;color:rgba(247,242,234,.48);line-height:1.8;font-weight:300; }
  .thl { margin-top:1rem;padding:.75rem;background:rgb(155 231 191/24%);border-left:2px solid var(--gold);font-size:.73rem;color:rgba(247,242,234,.55);line-height:1.6;text-align:left; }

  /* ── Weather ── */
  .weather-row { display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:4rem; }
  .wm { padding:1.4rem 1rem;text-align:center;border:1px solid rgb(155 231 191/24%);cursor:default;transition:background .3s,border-color .3s; }
  .wm:hover, .wm.on { background:rgb(155 231 191/24%);border-color:rgb(155 231 191/24%); }
  .wmn { font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(247,242,234,.38); }
  .wic { font-size:1.5rem;margin:.55rem 0; }
  .wt { font-size:.88rem;font-weight:500;color:var(--parchment); }
  .wr { font-size:.65rem;color:rgba(247,242,234,.32); }
  .wb { font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2);margin-top:.4rem; }

  /* ── Map ── */
  .map-wrap { display:grid;grid-template-columns:1fr 370px;height:auto;position:relative;isolation:isolate; }
  .map-vis { background:var(--ink2);position:relative;height:100%; }
  .map-grid { position:absolute;inset:0;width:100%;height:100%;opacity:.055; }
  .angkor-map-svg { display:block;width:100%;height:100%;object-fit:cover; }
  .map-glow { position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(184,144,42,.13) 0%,transparent 70%);animation:gl 4s ease-in-out infinite alternate; }
  .map-lbl { position:relative;z-index:1;text-align:center; }
  .map-lbl p { font-family:var(--ff-display);font-size:1.15rem;font-style:italic;color:var(--gold2); }
  .map-lbl small { font-size:.68rem;letter-spacing:.12em;color:rgba(247,242,234,.28); }
  .map-side { padding:3.5rem 2.8rem;border-left:1px solid rgb(155 231 191/24%); }
  .poi-h { font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold2);margin-bottom:2rem;font-weight:500; }
  .poi-list { list-style:none;display:flex;flex-direction:column;gap:2px; }
  .poi-item { display:flex;align-items:center;gap:.75rem;padding:.8rem .4rem;border-bottom:1px solid rgb(155 231 191/18%);cursor:pointer;transition:background .25s; }
  .poi-item:hover { background:rgba(184,144,42,.06); }
  .poi-top { background:rgba(228,169,60,.04); }
  .poi-top:hover { background:rgba(228,169,60,.09) !important; }
  .poi-top .poi-n { color:var(--gold2); }
  .poi-dot { width:8px;height:8px;border-radius:50%;flex-shrink:0; }
  .poi-top .poi-dot { width:10px;height:10px;box-shadow:0 0 0 3px rgba(228,169,60,.22); }
  .dt { background:#e4a93c; }
  .dn { background:#2aab6d; }
  .dm { background:#e0623a; }
  .du { background:#5a8adf; }
  .poi-n { font-size:.83rem;color:rgba(247,242,234,.65); }
  .poi-badge { font-size:.5rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2);background:rgba(228,169,60,.12);border:1px solid rgba(228,169,60,.28);border-radius:3px;padding:2px 6px;flex-shrink:0;white-space:nowrap; }
  .poi-d { margin-left:auto;font-size:.68rem;color:rgba(247,242,234,.28);letter-spacing:.05em;flex-shrink:0; }
  .leg { display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem;padding-top:1.5rem;border-top:1px solid rgb(155 231 191/24%); }
  .li { display:flex;align-items:center;gap:.4rem;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(247,242,234,.32); }

  /* ── Gallery ── */
  .sec-gal { padding:8rem 4rem;overflow:hidden;max-width:1400px;margin:0 auto;position:relative;isolation:isolate; }
  .gtrack { display:flex;gap:2px;margin-top:4rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;cursor:grab; }
  .gtrack:active { cursor:grabbing; }
  .gtrack::-webkit-scrollbar { display:none; }
  .gi { flex-shrink:0;width:270px;height:390px;scroll-snap-align:start;position:relative;overflow:hidden; }
  .gibg { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;object-fit:cover;border-radius:8px;image-rendering:auto;transition:transform .7s var(--ease); }
  .gi:hover .gibg { transform:scale(1.08); }
  .gcap { position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(10,8,6,.88),transparent);padding:1.8rem 1.1rem .85rem;font-size:.73rem;color:rgba(247,242,234,.55);font-weight:300;letter-spacing:.04em;transform:translateY(4px);transition:transform .4s; }
  .gi:hover .gcap { transform:none; }
  .gi.dragging { opacity:0.7;z-index:2;box-shadow:0 8px 32px rgba(0,0,0,.18);transform:scale(1.04) rotate(-2deg); }
  .gi.drag-over { outline:2px dashed var(--gold2);outline-offset:-4px;transform:scale(1.03) rotate(2deg); }

  /* ── Newsletter ── */
  .sec-nl { padding:8rem 4rem;text-align:center;background:rgb(4 32 19/47%);position:relative;overflow:hidden; }
  .nl-orb { position:absolute;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(184,144,42,.07) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none; }
  .nl-inner { position:relative;z-index:1;max-width:520px;margin:0 auto; }
  .nl-h { font-family:var(--ff-display);font-size:clamp(2.2rem,4vw,3.2rem);font-weight:400;color:var(--parchment);margin:1.2rem 0 .8rem; }
  .nl-h em { font-style:italic;color:var(--gold3); }
  .nl-p { font-size:.85rem;color:rgba(247,242,234,.42);line-height:1.85;font-weight:300; }
  .nl-form { display:flex;margin-top:2.5rem;border:1px solid rgb(155 231 191/24%); }
  .nl-inp { flex:1;padding:.88rem 1.2rem;background:transparent;border:none;outline:none;font-family:var(--ff-body);font-size:.83rem;color:var(--parchment); }
  .nl-inp::placeholder { color:rgba(247,242,234,.28); }
  .nl-btn { padding:.88rem 1.7rem;background:var(--gold);border:none;font-family:var(--ff-body);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);cursor:none;font-weight:500;transition:background .3s; }
  .nl-btn:hover { background:var(--gold2); }
  .nl-ok { display:none;margin-top:1rem;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2); }

  /* ── Instagram ── */
  .sec-insta { background-color:var(--ink2);padding:5.5rem 0 4.5rem; }
  .insta-inner { max-width:1200px;margin:0 auto;padding:0 1.5rem; }
  .insta-hd { text-align:center;margin-bottom:2.8rem; }
  .insta-hd .stag { display:flex;justify-content:center; }
  .insta-brand { display:inline-flex;align-items:center;gap:.75rem;background:rgba(247,242,234,.05);border:1px solid rgba(247,242,234,.1);border-radius:50px;padding:.55rem 1.3rem .55rem .65rem;margin-bottom:1.6rem;text-decoration:none;transition:background .2s,border-color .2s; }
  .insta-brand:hover { background:rgba(247,242,234,.09);border-color:rgba(247,242,234,.22); }
  .insta-icon { width:32px;height:32px;flex-shrink:0; }
  .insta-brand-text { text-align:left; }
  .insta-handle { display:block;font-weight:700;color:#f7f2ea;font-size:.92rem;font-family:'Jost',sans-serif;letter-spacing:.02em; }
  .insta-followers { display:block;font-size:.73rem;color:rgba(247,242,234,.42);font-family:'Jost',sans-serif;margin-top:.1rem; }
  .insta-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:2.4rem; }
  .insta-post { position:relative;aspect-ratio:1/1;overflow:hidden;cursor:pointer;background:#111; }
  .insta-img { width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease; }
  .insta-post:hover .insta-img { transform:scale(1.07); }
  .insta-overlay { position:absolute;inset:0;background:rgba(10,8,6,.58);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;opacity:0;transition:opacity .3s ease;backdrop-filter:blur(3px);padding:1rem; }
  .insta-post:hover .insta-overlay { opacity:1; }
  .insta-stats { display:flex;align-items:center;gap:1.4rem; }
  .insta-stat { display:flex;align-items:center;gap:.3rem;color:#f7f2ea;font-size:1rem;font-weight:700;font-family:'Jost',sans-serif; }
  .insta-stat svg { flex-shrink:0; }
  .insta-cap { color:rgba(247,242,234,.78);font-size:.8rem;text-align:center;font-family:'Jost',sans-serif;line-height:1.45;-webkit-line-clamp:2;line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden; }
  .insta-cta { text-align:center; }
  .insta-btn { display:inline-flex;align-items:center;gap:.6rem;background:linear-gradient(90deg,#833ab4 0%,#fd1d1d 50%,#fcb045 100%);color:#fff;border-radius:10px;padding:.9rem 2.4rem;font-size:.9rem;font-weight:600;letter-spacing:.05em;text-decoration:none;font-family:'Jost',sans-serif;transition:opacity .2s,transform .2s; }
  .insta-btn:hover { opacity:.85;transform:translateY(-2px); }

  /* ── Reviews ── */
  .sec-reviews { padding:5.5rem 0 4.5rem;background-color:var(--ink2); }
  .rv-inner { max-width:1200px;margin:0 auto;padding:0 1.5rem; }
  .rv-hd { text-align:center;margin-bottom:2.8rem; }
  .rv-hd .stag { display:flex;justify-content:center; }
  .ta-badge { display:inline-flex;align-items:center;gap:2rem;background:rgba(28,181,109,.07);border:1px solid rgba(28,181,109,.22);border-radius:16px;padding:1.1rem 2.4rem;margin:1.8rem auto 0;flex-wrap:wrap;justify-content:center; }
  .ta-logo-row { display:flex;align-items:center;gap:.55rem; }
  .ta-owl { width:36px;height:36px;flex-shrink:0; }
  .ta-brand { font-size:1.15rem;font-weight:800;color:#34e0a1;letter-spacing:.04em;font-family:'Jost',sans-serif; }
  .ta-divider { width:1px;height:40px;background:rgba(28,181,109,.2); }
  .ta-score-col { display:flex;flex-direction:column;align-items:center;gap:.3rem; }
  .ta-score { font-size:2.6rem;font-weight:800;color:#f7f2ea;line-height:1;font-family:'Playfair Display',serif; }
  .ta-bubs { display:flex;gap:.28rem; }
  .ta-bub { width:13px;height:13px;border-radius:50%;background:#34e0a1;display:inline-block; }
  .ta-count { font-size:.78rem;color:rgba(247,242,234,.42);letter-spacing:.03em;font-family:'Jost',sans-serif; }
  .rv-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-bottom:2.6rem; }
  .rv-card { background:rgba(247,242,234,.04);border:1px solid rgba(28,181,109,.12);border-radius:16px;padding:1.7rem 1.6rem 1.5rem;display:flex;flex-direction:column;transition:border-color .2s,background .2s,transform .2s; }
  .rv-card:hover { border-color:rgba(28,181,109,.32);background:rgba(247,242,234,.07);transform:translateY(-4px); }
  .rv-card-bubs { display:flex;gap:.25rem;margin-bottom:.9rem; }
  .rv-bub { width:11px;height:11px;border-radius:50%;background:#34e0a1;display:inline-block; }
  .rv-card-title { font-size:1.05rem;font-weight:700;color:#f7f2ea;margin-bottom:.6rem;font-family:'Playfair Display',serif; }
  .rv-card-text { font-size:.92rem;color:rgba(247,242,234,.68);line-height:1.7;flex:1;margin-bottom:1.3rem;font-style:italic; }
  .rv-card-footer { display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(28,181,109,.1);padding-top:1rem; }
  .rv-user-name { font-size:.88rem;font-weight:600;color:#f7f2ea;font-family:'Jost',sans-serif; }
  .rv-user-meta { font-size:.77rem;color:rgba(247,242,234,.38);margin-top:.15rem;font-family:'Jost',sans-serif; }
  .rv-ta-pill { font-size:.7rem;font-weight:700;color:#34e0a1;background:rgba(52,224,161,.1);border:1px solid rgba(52,224,161,.2);border-radius:20px;padding:.22rem .65rem;letter-spacing:.04em;font-family:'Jost',sans-serif;white-space:nowrap; }
  .rv-cta { text-align:center;margin-top:.4rem; }
  .rv-btn { display:inline-flex;align-items:center;gap:.5rem;background:transparent;color:#34e0a1;border:1.5px solid rgba(52,224,161,.4);border-radius:10px;padding:.85rem 2.2rem;font-size:.95rem;font-weight:600;letter-spacing:.04em;text-decoration:none;transition:background .18s,border-color .18s,color .18s;font-family:'Jost',sans-serif; }
  .rv-btn:hover { background:rgba(52,224,161,.1);border-color:#34e0a1;color:#f7f2ea; }

  /* ── Premium Tours ── */
  .sec-premium-tours { background:linear-gradient(120deg,#fffbe6 0%,#f7f3e8 100%);padding:3.5rem 0 2.5rem;margin-bottom:2.5rem;box-shadow:0 4px 32px rgba(184,144,42,.07);position:relative;z-index:1; }
  .sec-premium-tours h2, .sec-premium-tours .sh2 { color:#151a24 !important; }
  .premium-hd .stag { display:flex;justify-content:center;color:var(--gold2,#b8902a);font-weight:500;letter-spacing:.12em;margin-bottom:.5rem; }
  .premium-tour-container { max-width:1320px;margin:0 auto;padding:0 1.5rem; }
  .premium-tour-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:1.5rem; }
  .premium-tour-viewall { display:flex;justify-content:center;margin-top:.5rem; }
  .premium-tour-viewall-btn { background:#151a24;color:#e2c16b;border:1.5px solid rgba(226,193,107,.30);border-radius:10px;padding:.7em 2.2em;font-weight:700;font-size:1.08rem;letter-spacing:.04em;cursor:pointer;transition:background .18s,color .18s,box-shadow .18s,border-color .18s;box-shadow:0 2px 10px rgba(226,193,107,.10);text-decoration:none;display:inline-block;margin:.5em auto 0; }
  .premium-tour-viewall-btn:hover { background:#1e2739;border-color:rgba(226,193,107,.65);color:#f7f2ea;box-shadow:0 4px 20px rgba(226,193,107,.22); }

  /* ptcard (final version) */
  .ptcard { background:linear-gradient(120deg,#fffbe6 60%,#f7f3e8 100%);border-radius:20px;box-shadow:0 4px 32px rgba(184,144,42,.13),0 1.5px 0.5px rgba(0,0,0,.01);overflow:visible;width:340px;display:flex;flex-direction:column;position:relative;transition:transform .22s cubic-bezier(.22,1,.36,1),box-shadow .22s; }
  .ptcard:hover { transform:translateY(-12px) scale(1.045) rotate(-1deg);box-shadow:0 12px 48px rgba(184,144,42,.18);z-index:3; }
  .ptcard-badge { position:absolute;top:0;left:0;background:linear-gradient(90deg,#b8902a 60%,#e2c16b 100%);color:#fff;font-size:1.02rem;font-weight:700;padding:.45em 1.2em .45em 1.1em;border-radius:0 0 16px 0;letter-spacing:.08em;box-shadow:0 2px 8px rgba(184,144,42,.13);z-index:2;text-shadow:0 1px 2px #b8902a44; }
  .ptcard.silver .ptcard-badge { background:linear-gradient(90deg,#b8b8b8 60%,#e2e2e2 100%);color:#444; }
  .ptcard.bronze .ptcard-badge { background:linear-gradient(90deg,#c9a16b 60%,#e2c16b 100%);color:#fff; }
  .ptcard-img { width:100%;height:180px;background:linear-gradient(120deg,#f7e7b8 0%,#fffbe6 100%);display:flex;align-items:flex-end;justify-content:center;overflow:hidden;position:relative;border-radius:20px 20px 0 0; }
  .ptcard-img img { width:100%;height:100%;object-fit:cover;border-radius:0;display:block;filter:brightness(.97) contrast(1.08) saturate(1.08);transition:filter .18s; }
  .ptcard:hover .ptcard-img img { filter:brightness(1.04) contrast(1.13) saturate(1.18); }
  .ptcard-icon { position:absolute;bottom:1.1em;right:1.1em;font-size:2.2em;background:rgba(255,255,255,.82);border-radius:50%;box-shadow:0 2px 8px #b8902a22;padding:.18em .28em;color:#b8902a;z-index:2;pointer-events:none; }
  .ptcard-body { padding:1.5rem 1.3rem 1.2rem;display:flex;flex-direction:column;flex:1 1 auto;position:relative; }
  .ptcard-title { font-family:'Playfair Display',serif;font-size:1.32rem;font-weight:700;margin-bottom:.7rem;color:#b8902a;letter-spacing:.01em;text-shadow:0 1px 0 #fffbe6; }
  .ptcard-list { list-style:none;padding:0;margin:0 0 1.1rem;color:#6d5c2c;font-size:1.04rem;line-height:1.7; }
  .ptcard-list li { margin-bottom:.2rem;position:relative;padding-left:1.3em;font-weight:500; }
  .ptcard-list li::before { content:'⟡';color:#e2c16b;position:absolute;left:0;font-size:1.1em;top:.1em; }
  .ptcard-price-row { display:flex;align-items:baseline;gap:.5em;margin-bottom:1.1rem; }
  .ptcard-price { font-size:1.45rem;font-weight:700;color:#b8902a;letter-spacing:.01em; }
  .ptcard-label { font-size:1.01rem;color:#a89a6a; }
  .ptcard-btn { margin-top:auto;width:100%;text-align:center;font-size:1.09rem;padding:.8rem 0;border-radius:10px;background:linear-gradient(90deg,#b8902a 0%,#e2c16b 100%);color:#fff;font-weight:700;letter-spacing:.04em;box-shadow:0 2px 8px rgba(184,144,42,.10);transition:background .18s,color .18s;border:none;cursor:pointer;text-decoration:none;position:relative;overflow:hidden; }
  .ptcard-btn::after { content:'';position:absolute;left:50%;top:50%;width:0;height:0;background:rgb(155 231 191/24%);border-radius:50%;transform:translate(-50%,-50%);transition:width .3s,height .3s;z-index:0; }
  .ptcard-btn:hover::after { width:220%;height:220%; }
  .ptcard-btn:hover { background:linear-gradient(90deg,#e2c16b 0%,#b8902a 100%);color:#fffbe6; }
  .ptcard.gold { border:2.5px solid #e2c16b; }
  .ptcard.silver { border:2.5px solid #b8b8b8; }
  .ptcard.bronze { border:2.5px solid #c9a16b; }

  /* tourcard */
  .tourcard { background:transparent;box-shadow:0 2px 16px rgba(0,0,0,.28),0 1.5px 0.5px rgba(0,0,0,.1);overflow:hidden;width:100%;display:flex;flex-direction:column;margin:0 auto;border:1.5px solid rgba(184,144,42,.22);transition:box-shadow .18s,transform .18s;position:relative; }
  .tourcard:hover { box-shadow:0 8px 32px rgba(0,0,0,.38),0 0 0 1.5px rgba(184,144,42,.38);transform:translateY(-6px) scale(1.025); }
  .tourcard-img { width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;max-height:210px; }
  .tourcard-content { padding:.7rem 1rem .8rem;display:flex;flex-direction:column;flex:1 1 auto;background:#151a24; }
  .tourcard-title { color:#f7f2ea;font-size:1.22rem;font-weight:800;letter-spacing:.01em;text-shadow:0 1px 6px rgba(0,0,0,.4);margin-bottom:.18em; }
  .tourcard-location { color:rgba(255,255,255,.82);font-size:1.01rem;font-weight:600;letter-spacing:.03em;margin-bottom:.12em;display:flex;align-items:center;gap:.3em; }
  .tourcard-price-row { color:rgba(247,242,234,.72);font-size:1.04rem;font-weight:700;margin-bottom:.18em; }
  .tourcard-price-row .price { color:#e2c16b;font-weight:700;font-size:1.13em;margin-left:.2em; }
  .tourcard-meta-row { color:rgba(255,255,255,.82);font-size:.98rem;font-weight:600;letter-spacing:.04em;margin-bottom:.12em; }
  .tourcard-meta-row .meta { display:flex;align-items:center;gap:.3em; }
  .tourcard-rating-row { color:rgba(247,242,234,.82);font-size:1.01rem;font-weight:600;margin-bottom:.12em;display:flex;align-items:center;gap:.18em; }
  .tourcard-rating-row .star { color:#e2c16b;font-size:1.1em;margin-right:.08em; }
  .tourcard-explore-btn { margin-top:.7em;background:transparent;color:#f7f2ea;border:1.5px solid rgba(247,242,234,.2);border-radius:10px;padding:8px 12px;font-weight:700;font-size:1.08rem;letter-spacing:.04em;cursor:pointer;transition:background .16s,color .16s,box-shadow .16s,border-color .16s;box-shadow:none;text-decoration:none;display:block;width:90%;margin-left:auto;margin-right:auto;text-align:left; }
  .tourcard-explore-btn:hover { background:rgba(28,181,109,.12);color:#9be7bf;box-shadow:0 2px 8px rgba(28,181,109,.12);border:1.5px solid rgba(28,181,109,.45); }
}


/* ================================================================
   PAGE: ABOUT — #page-about
   ================================================================ */#page-about {

  /* ── Custom Properties ── */
  --tp-bg: #f7faf8;
  --tp-ink: #151a24;
  --tp-accent: #1cb56d;
  --tp-accent-soft: #9be7bf;
  --tp-gold: #b8902a;
  --tp-line: rgba(21,26,36,.1);

  /* ── Hero Mini ── */
  .hero-mini {
    width: 100%;
    min-height: 30vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 0 3rem;
    background:
      linear-gradient(to top, rgba(10,8,6,.92) 0%, rgba(10,8,6,.45) 45%, rgba(10,8,6,.18) 100%),
      linear-gradient(to right, rgba(29,32,48,.7) 0%, transparent 55%),
      url("../img/banner/banner1.png") center/cover no-repeat;
    color: #fff;
    position: relative;

    .eyebrow-tp {
      display: flex;
      align-items: center;
      gap: 1rem;
      font-size: .6rem;
      letter-spacing: .28em;
      text-transform: uppercase;
      color: #4fd18f;
      font-weight: 500;
      margin-bottom: .7rem;

      &::before {
        content: '';
        width: 32px;
        height: 1px;
        background: #4fd18f;
        flex-shrink: 0;
      }
    }

    h1 {
      margin: 0 0 .55rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(1.8rem, 4vw, 3rem);
      font-weight: 400;
      line-height: 1.05;
      color: #F7F2EA;
      letter-spacing: -.01em;

      em { font-style: italic; color: #9be7bf; }
    }

    .hero-sub-tp {
      margin: 0;
      font-size: .82rem;
      color: rgba(247,242,234,.52);
      max-width: 480px;
      line-height: 1.75;
      font-weight: 300;
      letter-spacing: .01em;
    }
  }

  /* ── Layout ── */
  .sec-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 4rem;
  }
  .sec-about   { padding: 6rem 0; }
  .sec-values  { padding: 0 0 6rem; }
  .sec-team    { padding: 0 0 6rem; }
  .sec-cta-band { padding: 0 0 6rem; }

  /* ── Section Label ── */
  .stag-ab {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    font-size: .63rem;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: 1rem;

    &::before {
      content: '';
      width: 24px;
      height: 1px;
      background: #4fd18f;
    }
  }

  .sh2-ab {
    margin: 0 0 1.4rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 400;
    line-height: 1.1;
    color: #F7F2EA;

    em { font-style: italic; color: #9be7bf; }
  }

  /* ── Story Grid ── */
  .story-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
  }

  .story-img-wrap {
    position: relative;
    border-radius: 18px;
    overflow: hidden;

    img {
      width: 100%;
      height: 440px;
      object-fit: cover;
      display: block;
      border-radius: 18px;
    }

    &::after {
      content: '';
      position: absolute;
      inset: 0;
      border-radius: 18px;
      border: 1px solid rgba(28,181,109,.18);
      pointer-events: none;
    }
  }

  .story-badge {
    position: absolute;
    bottom: 1.6rem;
    left: 1.6rem;
    background: #1cb56d;
    color: #151a24;
    border-radius: 10px;
    padding: .55rem 1rem;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
  }

  .story-copy p {
    color: rgba(247,242,234,.55);
    font-size: .92rem;
    line-height: 1.85;
    margin: 0 0 1.2rem;

    &:last-of-type { margin-bottom: 0; }
  }

  .divbar-ab {
    width: 40px;
    height: 2px;
    background: #1cb56d;
    margin-bottom: 1.8rem;
  }

  /* ── Values Grid ── */
  .values-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
  }

  .vcard {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    padding: 2rem 1.8rem;
    transition: transform .22s cubic-bezier(.22,1,.36,1), box-shadow .22s;

    &:hover {
      transform: translateY(-5px);
      box-shadow: 0 10px 30px rgba(28,181,109,.1);
    }

    h3 {
      margin: 0 0 .65rem;
      font-family: "Playfair Display", serif;
      font-size: 1.15rem;
      font-weight: 500;
      color: #F7F2EA;
    }

    p {
      margin: 0;
      font-size: .88rem;
      color: rgba(247,242,234,.48);
      line-height: 1.75;
    }
  }

  .vicon {
    font-size: 2.2rem;
    margin-bottom: 1rem;
    display: block;
  }

  /* ── Team Grid ── */
  .team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
  }

  .tcard-ab {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    overflow: hidden;
    transition: transform .22s cubic-bezier(.22,1,.36,1);

    &:hover { transform: translateY(-5px); }
  }

  .tcard-ab-img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
  }

  .tcard-ab-body {
    padding: 1.3rem 1.4rem;

    h4 {
      margin: 0 0 .2rem;
      font-family: "Playfair Display", serif;
      font-size: 1.1rem;
      font-weight: 500;
      color: #F7F2EA;
    }

    p {
      margin: 0;
      font-size: .86rem;
      color: rgba(247,242,234,.45);
      line-height: 1.75;
    }
  }

  .tcard-ab-role {
    font-size: .68rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #4fd18f;
    margin-bottom: .65rem;
    display: block;
  }

  /* ── Stats Bar ── */
  .stats-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: rgba(28,181,109,.06);
    border: 1px solid rgba(28,181,109,.14);
    border-radius: 16px;
    margin-bottom: 5rem;
    overflow: hidden;
  }

  .stat-ab {
    padding: 2rem 1.6rem;
    text-align: center;
    border-right: 1px solid rgba(28,181,109,.1);

    &:last-child { border-right: none; }
  }

  .stat-ab-n {
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 2.4rem;
    font-weight: 700;
    color: #9be7bf;
    line-height: 1;
    margin-bottom: .35rem;
  }

  .stat-ab-l {
    font-size: .72rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(247,242,234,.42);
  }

  /* ── CTA Band ── */
  .cta-band {
    background: rgba(28,181,109,.08);
    border: 1px solid rgba(28,181,109,.18);
    border-radius: 20px;
    padding: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;

    h3 {
      margin: 0 0 .5rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(1.5rem, 3vw, 2.2rem);
      font-weight: 400;
      color: #F7F2EA;

      em { font-style: italic; color: #9be7bf; }
    }

    p {
      margin: 0;
      font-size: .9rem;
      color: rgba(247,242,234,.48);
      max-width: 400px;
      line-height: 1.75;
    }
  }

  .cta-band-btns {
    display: flex;
    gap: 1rem;
    flex-shrink: 0;
  }

  .btn-fill-ab {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: #1cb56d;
    color: #151a24;
    border: none;
    border-radius: 6px;
    padding: .8rem 1.8rem;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background .2s;
    font-family: "Jost", sans-serif;

    &:hover { background: #4fd18f; }
  }

  .btn-line-ab {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: transparent;
    color: #9be7bf;
    border: 1px solid rgba(28,181,109,.4);
    border-radius: 6px;
    padding: .8rem 1.8rem;
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: border-color .2s, background .2s;
    font-family: "Jost", sans-serif;

    &:hover { background: rgba(28,181,109,.08); border-color: #9be7bf; }
  }
}


/* ================================================================
   PAGE: CONTACT — #page-contact
   ================================================================ */#page-contact {

  /* ── Custom Properties ── */
  --tp-ink: #151a24;
  --tp-accent: #1cb56d;
  --tp-accent-soft: #9be7bf;
  --tp-gold: #b8902a;

  /* ── Hero Mini ── */
  .hero-mini {
    width: 100%;
    min-height: 30vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 0 3rem;
    background:
      linear-gradient(to top, rgba(10,8,6,.92) 0%, rgba(10,8,6,.45) 45%, rgba(10,8,6,.18) 100%),
      linear-gradient(to right, rgba(29,32,48,.7) 0%, transparent 55%),
      url("../img/banner/banner1.png") center/cover no-repeat;
    color: #fff;
    position: relative;

    .eyebrow-tp {
      display: flex;
      align-items: center;
      gap: 1rem;
      font-size: .6rem;
      letter-spacing: .28em;
      text-transform: uppercase;
      color: #4fd18f;
      font-weight: 500;
      margin-bottom: .7rem;

      &::before {
        content: '';
        width: 32px;
        height: 1px;
        background: #4fd18f;
        flex-shrink: 0;
      }
    }

    h1 {
      margin: 0 0 .55rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(1.8rem, 4vw, 3rem);
      font-weight: 400;
      line-height: 1.05;
      color: #F7F2EA;
      letter-spacing: -.01em;

      em { font-style: italic; color: #9be7bf; }
    }

    .hero-sub-tp {
      margin: 0;
      font-size: .82rem;
      color: rgba(247,242,234,.52);
      max-width: 480px;
      line-height: 1.75;
      font-weight: 300;
      letter-spacing: .01em;
    }
  }

  /* ── Layout ── */
  .sec-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 4rem;
  }
  .sec-contact { padding: 6rem 0; }
  .sec-faq     { padding: 0 0 6rem; }

  /* ── Section Label ── */
  .stag-ct {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    font-size: .63rem;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: 1rem;

    &::before {
      content: '';
      width: 24px;
      height: 1px;
      background: #4fd18f;
    }
  }

  .sh2-ct {
    margin: 0 0 1.4rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 400;
    line-height: 1.1;
    color: #F7F2EA;

    em { font-style: italic; color: #9be7bf; }
  }

  /* ── Contact Layout ── */
  .contact-layout {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 4rem;
    align-items: start;
  }

  /* ── Info Cards ── */
  .info-cards {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
  }

  .info-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 14px;
    padding: 1.5rem 1.6rem;
    display: flex;
    gap: 1.2rem;
    align-items: flex-start;
    transition: border-color .2s;

    &:hover { border-color: rgba(28,181,109,.35); }
  }

  .info-card-icon {
    font-size: 1.8rem;
    flex-shrink: 0;
    line-height: 1;
    margin-top: .1rem;
  }

  .info-card-body {
    h4 {
      margin: 0 0 .3rem;
      font-size: .65rem;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: #4fd18f;
      font-weight: 500;
    }

    p {
      margin: 0;
      font-size: .9rem;
      color: rgba(247,242,234,.65);
      line-height: 1.6;
    }

    a {
      color: #9be7bf;
      text-decoration: none;

      &:hover { text-decoration: underline; }
    }
  }

  /* ── Response Note ── */
  .resp-note {
    margin-top: 1.8rem;
    padding: 1.2rem 1.4rem;
    border-radius: 12px;
    background: rgba(28,181,109,.06);
    border-left: 3px solid #1cb56d;
    font-size: .84rem;
    color: rgba(247,242,234,.5);
    line-height: 1.7;

    strong { color: #9be7bf; font-weight: 600; }
  }

  /* ── Contact Form ── */
  .form-panel {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.14);
    border-radius: 20px;
    padding: 2.5rem;

    h3 {
      margin: 0 0 .4rem;
      font-family: "Playfair Display", serif;
      font-size: 1.5rem;
      font-weight: 400;
      color: #F7F2EA;
    }

    .form-sub {
      margin: 0 0 2rem;
      font-size: .88rem;
      color: rgba(247,242,234,.4);
      line-height: 1.6;
    }
  }

  .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
  }

  .form-group {
    display: flex;
    flex-direction: column;
    gap: .45rem;
    margin-bottom: 1rem;

    label {
      font-size: .68rem;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(247,242,234,.45);
      font-weight: 500;
    }

    input,
    select,
    textarea {
      background: rgba(247,242,234,.06);
      border: 1px solid rgba(28,181,109,.18);
      border-radius: 8px;
      padding: .85rem 1rem;
      font-size: .9rem;
      color: #F7F2EA;
      font-family: "Jost", sans-serif;
      outline: none;
      transition: border-color .2s, background .2s;
      width: 100%;
      box-sizing: border-box;

      &:focus {
        border-color: #1cb56d;
        background: rgba(28,181,109,.06);
      }
    }

    select option { background: #151a24; color: #F7F2EA; }
    textarea { resize: vertical; min-height: 130px; }
  }

  .form-submit {
    width: 100%;
    background: #1cb56d;
    color: #151a24;
    border: none;
    border-radius: 8px;
    padding: 1rem;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    cursor: pointer;
    transition: background .2s;
    margin-top: .5rem;

    &:hover { background: #4fd18f; }
  }

  .form-ok {
    display: none;
    margin-top: 1rem;
    text-align: center;
    color: #9be7bf;
    font-size: .88rem;
  }

  /* ── FAQ ── */
  .faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2rem;
  }

  .faq-item {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 14px;
    padding: 1.6rem 1.8rem;
    cursor: pointer;
    transition: border-color .2s;

    &:hover { border-color: rgba(28,181,109,.3); }

    &.open {
      .faq-arrow { transform: rotate(180deg); border-color: #1cb56d; }
      .faq-a { display: block; }
    }
  }

  .faq-q {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    font-family: "Playfair Display", serif;
    font-size: 1rem;
    font-weight: 500;
    color: #F7F2EA;
    margin-bottom: 0;
  }

  .faq-arrow {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border: 1px solid rgba(28,181,109,.3);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .25s, border-color .2s;
    margin-top: .1rem;
  }

  .faq-a {
    display: none;
    margin-top: .9rem;
    font-size: .88rem;
    color: rgba(247,242,234,.48);
    line-height: 1.75;
  }
}


/* ================================================================
   PAGE: INFORMATION — #page-information
   ================================================================ */#page-information {

  /* ── Hero Mini ── */
  .hero-mini {
    width: 100%;
    min-height: 30vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 0 3.5rem;
    background:
      linear-gradient(to top, rgba(10,8,6,.96) 0%, rgba(10,8,6,.55) 45%, rgba(10,8,6,.2) 100%),
      linear-gradient(to right, rgba(29,32,48,.72) 0%, transparent 60%),
      url("../img/information/Bon%20Om%20Touk.jpg") center 40%/cover no-repeat;
    color: #fff;
    position: relative;

    h1 {
      margin: 0 0 .6rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(2.2rem, 5.5vw, 3.8rem);
      font-weight: 400;
      line-height: 1.05;
      color: #F7F2EA;
      letter-spacing: -.01em;

      em { font-style: italic; color: #9be7bf; }
    }
  }

  .eyebrow-tp {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: .6rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: .7rem;

    &::before {
      content: '';
      width: 32px;
      height: 1px;
      background: #4fd18f;
      flex-shrink: 0;
    }
  }

  .hero-sub-tp {
    margin: 0;
    font-size: .85rem;
    color: rgba(247,242,234,.52);
    max-width: 560px;
    line-height: 1.8;
    font-weight: 300;
  }

  /* ── Layout ── */
  .sec-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 4rem;
  }
  .sec-blog { padding: 6rem 0 8rem; }

  /* ── Section Label ── */
  .blog-stag {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    font-size: .63rem;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: 1rem;

    &::before {
      content: '';
      width: 24px;
      height: 1px;
      background: #4fd18f;
    }
  }

  .blog-h2 {
    margin: 0;
    font-family: "Playfair Display", serif;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 400;
    line-height: 1.1;
    color: #F7F2EA;

    em { font-style: italic; color: #9be7bf; }
  }

  .blog-lead {
    margin: .9rem 0 0;
    font-size: .9rem;
    color: rgba(247,242,234,.45);
    max-width: 560px;
    line-height: 1.85;
  }

  /* ── Filter Tabs ── */
  .filter-bar {
    display: flex;
    gap: .6rem;
    flex-wrap: wrap;
    margin-top: 2.4rem;
  }

  .ftab {
    background: transparent;
    border: 1px solid rgba(28,181,109,.22);
    color: rgba(247,242,234,.55);
    border-radius: 999px;
    padding: .45rem 1.3rem;
    font-size: .72rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    font-weight: 500;
    cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;

    &:hover { border-color: rgba(28,181,109,.5); color: #9be7bf; }
    &.on { background: #1cb56d; color: #151a24; border-color: #1cb56d; font-weight: 600; }
  }

  /* ── Featured Post ── */
  .featured-post {
    display: grid;
    grid-template-columns: 1.45fr 1fr;
    gap: 0;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(28,181,109,.14);
    background: rgba(247,242,234,.03);
    margin-top: 3.2rem;
    cursor: pointer;
    transition: box-shadow .28s, border-color .28s, transform .28s cubic-bezier(.22,1,.36,1);

    &:hover {
      box-shadow: 0 20px 50px rgba(28,181,109,.15);
      border-color: rgba(28,181,109,.3);
      transform: translateY(-5px);
    }

    &:hover .fp-img-wrap img { transform: scale(1.05); }
  }

  .fp-img-wrap {
    position: relative;
    overflow: hidden;
    min-height: 380px;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform .6s cubic-bezier(.22,1,.36,1);
    }
  }

  .fp-tag {
    position: absolute;
    top: 1.2rem;
    left: 1.2rem;
    background: #1cb56d;
    color: #151a24;
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    border-radius: 999px;
    padding: .3rem .85rem;
    font-family: "Jost", sans-serif;
  }

  .fp-featured-badge {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    background: rgba(10,8,6,.7);
    backdrop-filter: blur(8px);
    color: rgba(247,242,234,.6);
    font-size: .58rem;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    border-radius: 6px;
    padding: .28rem .7rem;
    font-family: "Jost", sans-serif;
    border: 1px solid rgba(247,242,234,.1);
  }

  .fp-body {
    padding: 2.8rem 2.8rem 2.4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .fp-meta {
    display: flex;
    align-items: center;
    gap: .8rem;
    font-size: .68rem;
    color: rgba(247,242,234,.35);
    letter-spacing: .06em;
    margin-bottom: 1.2rem;
    font-family: "Jost", sans-serif;
  }

  .fp-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(247,242,234,.2); flex-shrink: 0; }

  .fp-title {
    margin: 0 0 1rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    font-weight: 500;
    color: #F7F2EA;
    line-height: 1.2;

    em { font-style: italic; color: #9be7bf; }
  }

  .fp-excerpt {
    margin: 0 0 1.8rem;
    font-size: .88rem;
    color: rgba(247,242,234,.48);
    line-height: 1.85;
    flex: 1;
  }

  .fp-read-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border: 1px solid rgba(28,181,109,.4);
    background: transparent;
    color: #4fd18f;
    border-radius: 8px;
    padding: .6rem 1.3rem;
    font-size: .7rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    transition: background .22s, color .22s, border-color .22s;
    align-self: flex-start;

    &:hover { background: #1cb56d; color: #151a24; border-color: #1cb56d; }

    svg { transition: transform .22s; }
    &:hover svg { transform: translateX(4px); }
  }

  /* ── Blog Grid ── */
  .blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 1.5rem;
  }

  /* ── Blog Card ── */
  .blog-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s, border-color .25s;

    &:hover {
      transform: translateY(-7px);
      box-shadow: 0 16px 40px rgba(28,181,109,.13);
      border-color: rgba(28,181,109,.3);
    }

    &[data-hidden="true"] { display: none; }

    &:hover .bc-img-wrap img { transform: scale(1.06); filter: brightness(1); }
    &:hover .bc-arrow { background: #1cb56d; color: #151a24; border-color: #1cb56d; }
  }

  .bc-img-wrap {
    position: relative;
    overflow: hidden;

    img {
      width: 100%;
      height: 210px;
      object-fit: cover;
      display: block;
      filter: brightness(.85);
      transition: transform .45s cubic-bezier(.22,1,.36,1), filter .35s;
    }
  }

  .bc-cat {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background: #1cb56d;
    color: #151a24;
    font-size: .58rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    border-radius: 999px;
    padding: .26rem .75rem;
    font-family: "Jost", sans-serif;
  }

  .bc-read-time {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: rgba(10,8,6,.65);
    backdrop-filter: blur(6px);
    color: rgba(247,242,234,.55);
    font-size: .6rem;
    font-weight: 500;
    letter-spacing: .1em;
    border-radius: 6px;
    padding: .26rem .6rem;
    font-family: "Jost", sans-serif;
  }

  .bc-body {
    padding: 1.4rem 1.5rem;
    flex: 1;
    display: flex;
    flex-direction: column;
  }

  .bc-date {
    font-size: .65rem;
    color: rgba(247,242,234,.3);
    letter-spacing: .1em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    margin-bottom: .55rem;
  }

  .bc-title {
    margin: 0 0 .65rem;
    font-family: "Playfair Display", serif;
    font-size: 1.12rem;
    font-weight: 500;
    color: #F7F2EA;
    line-height: 1.3;
  }

  .bc-excerpt {
    margin: 0 0 1.2rem;
    font-size: .84rem;
    color: rgba(247,242,234,.42);
    line-height: 1.78;
    flex: 1;
  }

  .bc-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(28,181,109,.1);
    padding-top: 1rem;
    margin-top: auto;
  }

  .bc-author {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .7rem;
    color: rgba(247,242,234,.35);
    font-family: "Jost", sans-serif;
  }

  .bc-author-dot {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(28,181,109,.18);
    border: 1px solid rgba(28,181,109,.25);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .6rem;
    color: #4fd18f;
    font-weight: 600;
  }

  .bc-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid rgba(28,181,109,.22);
    color: rgba(28,181,109,.5);
    transition: background .2s, color .2s, border-color .2s;
  }

  /* ── Newsletter Band ── */
  .newsletter-band {
    margin-top: 5rem;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(28,181,109,.1) 0%, rgba(28,181,109,.04) 100%);
    border: 1px solid rgba(28,181,109,.18);
    padding: 3.5rem 4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
  }

  .nl-text {
    h3 {
      margin: 0 0 .5rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(1.4rem, 3vw, 2rem);
      font-weight: 400;
      color: #F7F2EA;

      em { font-style: italic; color: #9be7bf; }
    }

    p {
      margin: 0;
      font-size: .85rem;
      color: rgba(247,242,234,.42);
      line-height: 1.75;
      max-width: 440px;
    }
  }

  .nl-form {
    display: flex;
    gap: .7rem;
    flex-shrink: 0;
  }

  .nl-input {
    background: rgba(247,242,234,.06);
    border: 1px solid rgba(28,181,109,.2);
    border-radius: 8px;
    padding: .75rem 1.2rem;
    font-size: .82rem;
    color: #F7F2EA;
    font-family: "Jost", sans-serif;
    width: 260px;
    outline: none;
    transition: border-color .2s;

    &::placeholder { color: rgba(247,242,234,.28); }
    &:focus { border-color: rgba(28,181,109,.5); }
  }

  .nl-btn {
    background: #1cb56d;
    color: #151a24;
    border: none;
    border-radius: 8px;
    padding: .75rem 1.5rem;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    cursor: pointer;
    transition: background .2s, transform .15s;
    white-space: nowrap;

    &:hover { background: #4fd18f; transform: translateY(-2px); }
  }
}


/* ================================================================
   PAGE: INFORMATION DETAIL — #page-information-detail
   ================================================================ */#page-information-detail {

  /* ── Read Progress Bar ── */
  .read-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(to right, #1cb56d, #9be7bf);
    z-index: 9999;
    width: 0%;
    transition: width .1s linear;
  }

  /* ── Article Hero ── */
  .art-hero {
    position: relative;
    width: 100%;
    height: 72vh;
    min-height: 480px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    h1 {
      margin: 0 0 1rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(2.2rem, 5vw, 3.8rem);
      font-weight: 400;
      color: #F7F2EA;
      line-height: 1.07;
      max-width: 820px;

      em { font-style: italic; color: #9be7bf; }
    }
  }

  .art-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  .art-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to top,
      rgba(10,8,6,1) 0%,
      rgba(10,8,6,.75) 38%,
      rgba(10,8,6,.25) 70%,
      rgba(10,8,6,.1) 100%
    );
  }

  .art-hero-content {
    position: relative;
    z-index: 2;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    padding: 0 4rem 3.5rem;
  }

  .art-breadcrumb {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .65rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(247,242,234,.38);
    margin-bottom: 1.4rem;
    flex-wrap: wrap;
    font-family: "Jost", sans-serif;

    a { color: rgba(247,242,234,.38); text-decoration: none; transition: color .2s; }
    a:hover { color: #9be7bf; }
    .sep { opacity: .3; }
  }

  .art-cat-row {
    display: flex;
    align-items: center;
    gap: .9rem;
    margin-bottom: 1rem;
  }

  .art-cat-pill {
    background: #1cb56d;
    color: #151a24;
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    border-radius: 999px;
    padding: .3rem .9rem;
    font-family: "Jost", sans-serif;
  }

  .art-meta-row {
    display: flex;
    align-items: center;
    gap: .8rem;
    font-size: .7rem;
    color: rgba(247,242,234,.4);
    font-family: "Jost", sans-serif;
    letter-spacing: .05em;
  }

  .art-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(247,242,234,.22); flex-shrink: 0; }

  /* ── Layout ── */
  .sec-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 4rem;
  }

  .art-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 4rem;
    padding: 5rem 0 8rem;
    align-items: start;
  }

  /* ── Article Body ── */
  .art-body {
    min-width: 0;

    p {
      margin: 0 0 1.6rem;
      font-size: .96rem;
      color: rgba(247,242,234,.65);
      line-height: 2;
      font-weight: 300;
    }

    p:first-of-type::first-letter {
      font-family: "Playfair Display", serif;
      font-size: 3.8rem;
      font-weight: 500;
      color: #4fd18f;
      float: left;
      line-height: .78;
      margin: .08em .14em 0 0;
    }

    h2 {
      margin: 3rem 0 1.1rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(1.5rem, 2.8vw, 2rem);
      font-weight: 500;
      color: #F7F2EA;
      line-height: 1.2;

      em { font-style: italic; color: #9be7bf; }
    }

    h3 {
      margin: 2.2rem 0 .9rem;
      font-family: "Jost", sans-serif;
      font-size: 1rem;
      font-weight: 600;
      color: #F7F2EA;
      letter-spacing: .06em;
      text-transform: uppercase;
    }
  }

  .art-divider {
    width: 40px;
    height: 2px;
    background: #1cb56d;
    margin: 0 0 2.8rem;
    border: none;
  }

  /* ── Block Quote ── */
  .art-quote {
    margin: 2.5rem 0;
    padding: 1.8rem 2rem 1.8rem 2.4rem;
    border-left: 3px solid #1cb56d;
    background: rgba(28,181,109,.06);
    border-radius: 0 12px 12px 0;

    p {
      margin: 0 0 .6rem;
      font-family: "Playfair Display", serif;
      font-size: 1.22rem;
      font-style: italic;
      color: rgba(247,242,234,.82);
      line-height: 1.7;

      &:last-of-type { margin: 0; }
    }

    cite {
      font-size: .72rem;
      color: rgba(247,242,234,.35);
      font-style: normal;
      letter-spacing: .1em;
      text-transform: uppercase;
      font-family: "Jost", sans-serif;
    }
  }

  /* ── Inline Images ── */
  .art-img-block {
    margin: 2.8rem 0;
    border-radius: 14px;
    overflow: hidden;

    img {
      width: 100%;
      height: 380px;
      object-fit: cover;
      display: block;
    }
  }

  .art-img-caption {
    display: block;
    font-size: .72rem;
    color: rgba(247,242,234,.3);
    letter-spacing: .08em;
    margin-top: .7rem;
    font-family: "Jost", sans-serif;
    text-align: center;
  }

  .art-img-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin: 2.8rem 0;

    .art-img-block { margin: 0; }
    .art-img-block img { height: 240px; }
  }

  /* ── Callout ── */
  .art-callout {
    margin: 2.5rem 0;
    padding: 1.8rem 2rem;
    background: rgba(28,181,109,.07);
    border: 1px solid rgba(28,181,109,.2);
    border-radius: 14px;
  }

  .art-callout-title {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #4fd18f;
    font-family: "Jost", sans-serif;
    margin-bottom: 1rem;
  }

  .art-callout ul {
    margin: 0;
    padding: 0;
    list-style: none;

    li {
      display: flex;
      align-items: flex-start;
      gap: .7rem;
      font-size: .88rem;
      color: rgba(247,242,234,.6);
      line-height: 1.75;
      margin-bottom: .55rem;
      font-weight: 300;

      &::before {
        content: '';
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #1cb56d;
        flex-shrink: 0;
        margin-top: .55em;
      }
    }
  }

  /* ── Month Grid ── */
  .month-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin: 2rem 0;
  }

  .month-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 12px;
    padding: 1.1rem 1.2rem;
  }

  .month-name {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #4fd18f;
    font-family: "Jost", sans-serif;
    margin-bottom: .45rem;
  }

  .month-desc {
    font-size: .8rem;
    color: rgba(247,242,234,.45);
    line-height: 1.65;
    font-weight: 300;
  }

  /* ── Tags ── */
  .art-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 3.5rem 0 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(28,181,109,.1);
  }

  .art-tag {
    background: rgba(247,242,234,.05);
    border: 1px solid rgba(28,181,109,.15);
    color: rgba(247,242,234,.45);
    border-radius: 999px;
    padding: .32rem 1rem;
    font-size: .68rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;
    text-decoration: none;

    &:hover { background: rgba(28,181,109,.12); color: #9be7bf; border-color: rgba(28,181,109,.35); }
  }

  /* ── Author Bio ── */
  .art-author-bio {
    display: flex;
    gap: 1.4rem;
    padding: 2rem;
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.14);
    border-radius: 16px;
    margin-bottom: 4rem;
  }

  .author-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(28,181,109,.3), rgba(28,181,109,.08));
    border: 2px solid rgba(28,181,109,.3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Playfair Display", serif;
    font-size: 1.6rem;
    color: #4fd18f;
    flex-shrink: 0;
  }

  .author-bio-text {
    h4 {
      margin: 0 0 .3rem;
      font-family: "Jost", sans-serif;
      font-size: .9rem;
      font-weight: 600;
      color: #F7F2EA;
    }

    span {
      display: block;
      font-size: .7rem;
      color: #4fd18f;
      letter-spacing: .1em;
      text-transform: uppercase;
      font-family: "Jost", sans-serif;
      margin-bottom: .6rem;
    }

    p {
      margin: 0;
      font-size: .83rem;
      color: rgba(247,242,234,.42);
      line-height: 1.75;
    }
  }

  /* ── Prev / Next Navigation ── */
  .art-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 5rem;
  }

  .art-nav-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 14px;
    padding: 1.4rem 1.6rem;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: .45rem;
    transition: border-color .22s, background .22s, transform .22s cubic-bezier(.22,1,.36,1);

    &:hover { border-color: rgba(28,181,109,.3); background: rgba(28,181,109,.05); transform: translateY(-3px); }

    &.next .art-nav-dir  { text-align: right; }
    &.next .art-nav-title { text-align: right; }
  }

  .art-nav-dir {
    font-size: .62rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: rgba(247,242,234,.28);
    font-family: "Jost", sans-serif;
  }

  .art-nav-title {
    font-family: "Playfair Display", serif;
    font-size: 1rem;
    color: #F7F2EA;
    font-weight: 500;
    line-height: 1.3;
  }

  /* ── Related Articles ── */
  .related-h2 {
    margin: 0 0 2rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(1.4rem, 3vw, 1.8rem);
    font-weight: 400;
    color: #F7F2EA;

    em { font-style: italic; color: #9be7bf; }
  }

  .related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.2rem;
  }

  .rel-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s, border-color .25s;

    &:hover { transform: translateY(-6px); box-shadow: 0 14px 36px rgba(28,181,109,.12); border-color: rgba(28,181,109,.28); }
    &:hover .rel-img img { transform: scale(1.07); filter: brightness(1); }
  }

  .rel-img {
    position: relative;
    overflow: hidden;

    img { width: 100%; height: 170px; object-fit: cover; display: block; filter: brightness(.82); transition: transform .4s cubic-bezier(.22,1,.36,1), filter .3s; }
  }

  .rel-cat { position: absolute; top: .8rem; left: .8rem; background: #1cb56d; color: #151a24; font-size: .56rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; border-radius: 999px; padding: .24rem .7rem; font-family: "Jost", sans-serif; }

  .rel-body { padding: 1.1rem 1.2rem; flex: 1; }
  .rel-date { font-size: .62rem; color: rgba(247,242,234,.28); letter-spacing: .1em; text-transform: uppercase; font-family: "Jost", sans-serif; margin-bottom: .45rem; }
  .rel-title { font-family: "Playfair Display", serif; font-size: .98rem; font-weight: 500; color: #F7F2EA; line-height: 1.35; }

  /* ── Sidebar ── */
  .art-sidebar { position: sticky; top: 100px; }

  .sidebar-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    padding: 1.6rem;
    margin-bottom: 1.4rem;
  }

  .sidebar-title {
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: #4fd18f;
    font-family: "Jost", sans-serif;
    margin: 0 0 1.2rem;
    display: flex;
    align-items: center;
    gap: .6rem;

    &::before {
      content: '';
      width: 18px;
      height: 1px;
      background: #1cb56d;
      flex-shrink: 0;
    }
  }

  /* ── Table of Contents ── */
  .toc-list {
    list-style: none;
    padding: 0;
    margin: 0;

    li { margin-bottom: .1rem; }

    a {
      display: flex;
      align-items: center;
      gap: .6rem;
      font-size: .8rem;
      color: rgba(247,242,234,.42);
      text-decoration: none;
      padding: .45rem .5rem;
      border-radius: 7px;
      line-height: 1.4;
      transition: background .18s, color .18s;
      font-family: "Jost", sans-serif;

      &:hover { background: rgba(28,181,109,.08); color: #9be7bf; }
      &.active { color: #4fd18f; background: rgba(28,181,109,.1); }

      &::before {
        content: '';
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: rgba(28,181,109,.3);
        flex-shrink: 0;
        transition: background .18s;
      }

      &.active::before,
      &:hover::before { background: #1cb56d; }
    }
  }

  /* ── Quick Facts ── */
  .qf-row {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    padding: .7rem 0;
    border-bottom: 1px solid rgba(28,181,109,.08);

    &:last-child { border-bottom: none; padding-bottom: 0; }
  }

  .qf-icon { font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
  .qf-label { font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(247,242,234,.3); font-family: "Jost", sans-serif; margin-bottom: .15rem; }
  .qf-val { font-size: .82rem; color: rgba(247,242,234,.7); font-family: "Jost", sans-serif; line-height: 1.4; }

  /* ── Share Buttons ── */
  .share-btns {
    display: flex;
    gap: .6rem;
    flex-wrap: wrap;
  }

  .share-btn {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    background: rgba(247,242,234,.05);
    border: 1px solid rgba(28,181,109,.15);
    border-radius: 8px;
    padding: .6rem .5rem;
    font-size: .65rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(247,242,234,.45);
    font-family: "Jost", sans-serif;
    cursor: pointer;
    text-decoration: none;
    transition: background .2s, color .2s, border-color .2s;

    &:hover { background: rgba(28,181,109,.12); color: #9be7bf; border-color: rgba(28,181,109,.35); }
  }

  /* ── Back Link ── */
  .back-link {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .7rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(247,242,234,.35);
    font-family: "Jost", sans-serif;
    text-decoration: none;
    transition: color .2s;
    margin-bottom: 1.4rem;

    &:hover { color: #4fd18f; }
    svg { transition: transform .2s; }
    &:hover svg { transform: translateX(-4px); }
  }
}


/* ================================================================
   PAGE: NOS PROJETS — #page-nos-projets
   ================================================================ */
#page-nos-projets {

  .sec-inner { max-width: 1400px; margin: 0 auto; padding: 0 4rem; }

  .art-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 4rem;
    align-items: start;
  }

  .art-body { min-width: 0; }

  .art-sidebar { position: sticky; top: 100px; }

  .sidebar-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    padding: 1.6rem;
    margin-bottom: 1.4rem;
  }

  .sidebar-title {
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: #4fd18f;
    font-family: "Jost", sans-serif;
    margin: 0 0 1.2rem;
    display: flex;
    align-items: center;
    gap: .6rem;

    &::before { content: ''; width: 18px; height: 1px; background: #1cb56d; flex-shrink: 0; }
  }

  .toc-list {
    list-style: none;
    padding: 0;
    margin: 0;

    li { margin-bottom: .1rem; }

    a {
      display: flex;
      align-items: center;
      gap: .6rem;
      font-size: .8rem;
      color: rgba(247,242,234,.42);
      text-decoration: none;
      padding: .45rem .5rem;
      border-radius: 7px;
      line-height: 1.4;
      transition: background .18s, color .18s;
      font-family: "Jost", sans-serif;

      &:hover { background: rgba(28,181,109,.08); color: #9be7bf; }
      &.active { color: #4fd18f; background: rgba(28,181,109,.1); }

      &::before {
        content: '';
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: rgba(28,181,109,.3);
        flex-shrink: 0;
        transition: background .18s;
      }

      &.active::before,
      &:hover::before { background: #1cb56d; }
    }
  }

  .qf-row {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    padding: .7rem 0;
    border-bottom: 1px solid rgba(28,181,109,.08);

    &:last-child { border-bottom: none; padding-bottom: 0; }
  }

  .qf-icon  { font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
  .qf-label { font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(247,242,234,.3); font-family: "Jost", sans-serif; margin-bottom: .15rem; }
  .qf-val   { font-size: .82rem; color: rgba(247,242,234,.7); font-family: "Jost", sans-serif; line-height: 1.4; }

  .share-btns { display: flex; gap: .6rem; flex-wrap: wrap; }

  .share-btn {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    background: rgba(247,242,234,.05);
    border: 1px solid rgba(28,181,109,.15);
    border-radius: 8px;
    padding: .6rem .5rem;
    font-size: .65rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(247,242,234,.45);
    font-family: "Jost", sans-serif;
    cursor: pointer;
    text-decoration: none;
    transition: background .2s, color .2s, border-color .2s;

    &:hover { background: rgba(28,181,109,.12); color: #9be7bf; border-color: rgba(28,181,109,.35); }
  }

  .back-link {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .7rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(247,242,234,.35);
    font-family: "Jost", sans-serif;
    text-decoration: none;
    transition: color .2s;
    margin-bottom: 1.4rem;

    &:hover { color: #4fd18f; }
    svg { transition: transform .2s; }
    &:hover svg { transform: translateX(-4px); }
  }
}


/* ================================================================
   PAGE: ACTIVITIES — #page-activities
   ================================================================ */#page-activities {

  /* ── Hero Mini ── */
  .hero-mini {
    width: 100%;
    min-height: 34vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 0 3.5rem;
    background:
      linear-gradient(to top, rgba(10,8,6,.95) 0%, rgba(10,8,6,.5) 50%, rgba(10,8,6,.2) 100%),
      linear-gradient(to right, rgba(29,32,48,.75) 0%, transparent 60%),
      url("../img/banner/banner1.png") center/cover no-repeat;
    color: #fff;
    position: relative;

    h1 {
      margin: 0 0 .6rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(2rem, 5vw, 3.4rem);
      font-weight: 400;
      line-height: 1.05;
      color: #F7F2EA;
      letter-spacing: -.01em;

      em { font-style: italic; color: #9be7bf; }
    }
  }

  .eyebrow-tp {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: .6rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: .7rem;

    &::before {
      content: '';
      width: 32px;
      height: 1px;
      background: #4fd18f;
      flex-shrink: 0;
    }
  }

  .hero-sub-tp {
    margin: 0;
    font-size: .85rem;
    color: rgba(247,242,234,.52);
    max-width: 540px;
    line-height: 1.8;
    font-weight: 300;
  }

  /* ── Layout ── */
  .sec-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 4rem;
  }
  .sec-activities  { padding: 6rem 0 4rem; }
  .sec-highlights  { padding: 0 0 6rem; }

  /* ── Section Label ── */
  .stag-td {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    font-size: .63rem;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: 1rem;

    &::before {
      content: '';
      width: 24px;
      height: 1px;
      background: #4fd18f;
    }
  }

  .sh2-td {
    margin: 0;
    font-family: "Playfair Display", serif;
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 400;
    line-height: 1.1;
    color: #F7F2EA;

    em { font-style: italic; color: #9be7bf; }
  }

  .sp-td {
    margin: .9rem 0 0;
    font-size: .92rem;
    color: rgba(247,242,234,.45);
    max-width: 560px;
    line-height: 1.85;
  }

  /* ── Filter Tabs ── */
  .filter-bar {
    display: flex;
    gap: .6rem;
    flex-wrap: wrap;
    margin-top: 2.4rem;
  }

  .ftab {
    background: transparent;
    border: 1px solid rgba(28,181,109,.22);
    color: rgba(247,242,234,.55);
    border-radius: 999px;
    padding: .45rem 1.3rem;
    font-size: .72rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    font-weight: 500;
    cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;

    &:hover { border-color: rgba(28,181,109,.5); color: #9be7bf; }
    &.on { background: #1cb56d; color: #151a24; border-color: #1cb56d; font-weight: 600; }
  }

  /* ── Activity Grid ── */
  .act-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
  }

  /* ── Activity Card ── */
  .act-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s, border-color .25s;
    cursor: pointer;

    &:hover {
      transform: translateY(-7px);
      box-shadow: 0 16px 40px rgba(28,181,109,.13);
      border-color: rgba(28,181,109,.3);
    }

    &[data-hidden="true"] { display: none; }
    &:hover .act-img-wrap img { transform: scale(1.06); }
  }

  .act-img-wrap {
    position: relative;
    overflow: hidden;

    img {
      width: 100%;
      height: 220px;
      object-fit: cover;
      display: block;
      transition: transform .4s cubic-bezier(.22,1,.36,1);
    }
  }

  .act-num {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background: rgba(10,8,6,.65);
    backdrop-filter: blur(6px);
    color: rgba(247,242,234,.5);
    font-size: .64rem;
    font-weight: 600;
    letter-spacing: .18em;
    border-radius: 6px;
    padding: .28rem .6rem;
    font-family: "Jost", sans-serif;
  }

  .act-cat-badge {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: #1cb56d;
    color: #151a24;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    border-radius: 6px;
    padding: .28rem .7rem;
    font-family: "Jost", sans-serif;
  }

  .act-body {
    padding: 1.4rem 1.5rem;
    flex: 1;
    display: flex;
    flex-direction: column;
  }

  .act-name {
    margin: 0 0 .5rem;
    font-family: "Playfair Display", serif;
    font-size: 1.18rem;
    font-weight: 500;
    color: #F7F2EA;
    line-height: 1.25;
  }

  .act-desc {
    margin: 0 0 1.1rem;
    font-size: .88rem;
    color: rgba(247,242,234,.48);
    line-height: 1.75;
    flex: 1;
  }

  .act-meta {
    display: flex;
    gap: .7rem;
    flex-wrap: wrap;
    margin-bottom: 1.2rem;

    span {
      display: inline-flex;
      align-items: center;
      gap: .35rem;
      font-size: .72rem;
      color: rgba(247,242,234,.4);
      letter-spacing: .04em;

      svg { opacity: .5; flex-shrink: 0; }
    }
  }

  .act-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(28,181,109,.1);
    padding: 1rem 1.5rem;
    margin-top: auto;
  }

  .act-price {
    font-size: 1rem;
    font-weight: 600;
    color: #4fd18f;
    font-family: "Jost", sans-serif;

    small {
      font-size: .68rem;
      font-weight: 400;
      color: rgba(247,242,234,.35);
      margin-left: .3rem;
    }
  }

  .act-btn {
    border: 1px solid rgba(28,181,109,.45);
    background: transparent;
    color: #9be7bf;
    border-radius: 6px;
    padding: .45rem 1.1rem;
    font-size: .68rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    font-weight: 500;
    cursor: pointer;
    transition: background .22s, color .22s, border-color .22s;
    text-decoration: none;
    display: inline-block;

    &:hover { background: #1cb56d; color: #151a24; border-color: #1cb56d; }
  }

  /* ── No Results ── */
  .no-results {
    display: none;
    grid-column: 1 / -1;
    text-align: center;
    padding: 4rem 0;
    color: rgba(247,242,234,.3);
    font-size: .95rem;
    font-style: italic;
  }

  /* ── Result Count ── */
  .result-count {
    font-size: .78rem;
    color: rgba(247,242,234,.3);
    letter-spacing: .08em;
    margin-top: 1rem;

    span { color: #4fd18f; }
  }

  /* ── Highlights Strip ── */
  .highlights-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.2rem;
  }

  .hl-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 14px;
    padding: 1.8rem 1.5rem;
    text-align: center;

    h4 {
      margin: 0 0 .4rem;
      font-family: "Playfair Display", serif;
      font-size: 1rem;
      font-weight: 500;
      color: #F7F2EA;
    }

    p {
      margin: 0;
      font-size: .84rem;
      color: rgba(247,242,234,.42);
      line-height: 1.7;
    }
  }

  .hl-icon { font-size: 2.2rem; margin-bottom: .8rem; display: block; }

  /* ── CTA Band ── */
  .cta-band {
    background: rgba(28,181,109,.08);
    border: 1px solid rgba(28,181,109,.18);
    border-radius: 20px;
    padding: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    margin-top: 5rem;

    h3 {
      margin: 0 0 .5rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(1.5rem, 3vw, 2.2rem);
      font-weight: 400;
      color: #F7F2EA;

      em { font-style: italic; color: #9be7bf; }
    }

    p {
      margin: 0;
      font-size: .9rem;
      color: rgba(247,242,234,.45);
      max-width: 420px;
      line-height: 1.75;
    }
  }

  .cta-btns { display: flex; gap: 1rem; flex-shrink: 0; }

  .btn-fill-td {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: #1cb56d;
    color: #151a24;
    border: none;
    border-radius: 6px;
    padding: .85rem 2rem;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background .2s;
    font-family: "Jost", sans-serif;

    &:hover { background: #4fd18f; }
  }

  .btn-line-td {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: transparent;
    color: #9be7bf;
    border: 1px solid rgba(28,181,109,.4);
    border-radius: 6px;
    padding: .85rem 2rem;
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: border-color .2s, background .2s;
    font-family: "Jost", sans-serif;

    &:hover { background: rgba(28,181,109,.08); border-color: #9be7bf; }
  }
}


/* ================================================================
   PAGE: ACTIVITIES DETAIL  — #page-activities-detail
   PAGE: CIRCUIT DETAIL     — #page-les-circuit-detail
   ================================================================ */#page-activities-detail, #page-les-circuit-detail {

  /* ── Detail Hero (draggable slider) ── */
  .detail-hero {
    position: relative;
    width: 100%;
    height: 48vh;
    min-height: 300px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    user-select: none;
  }

  /* ── Slider ── */
  .hero-slider { position: absolute; inset: 0; overflow: hidden; }

  .hero-slides {
    display: flex;
    height: 100%;
    will-change: transform;
    transition: transform .5s cubic-bezier(.22,1,.36,1);

    &.dragging { transition: none; }
  }

  .hero-slide {
    flex: 0 0 calc(100% / 3);
    height: 100%;
    position: relative;
    padding: 0 3px;
    box-sizing: border-box;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      display: block;
      pointer-events: none;
    }
  }

  .detail-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to top,
      rgba(10,8,6,.95) 0%,
      rgba(10,8,6,.65) 38%,
      rgba(10,8,6,.25) 70%,
      rgba(10,8,6,.1) 100%
    );
    pointer-events: none;
    z-index: 1;
  }

  /* ── Hero Arrows ── */
  .hero-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(10,8,6,.55);
    border: 1px solid rgba(247,242,234,.15);
    color: #F7F2EA;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s, border-color .2s;
    padding: 0;

    &:hover { background: #1cb56d; border-color: #1cb56d; }
    &.prev { left: 1.5rem; }
    &.next { right: 1.5rem; }
  }

  /* ── Slide Dots ── */
  .hero-dots {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    display: flex;
    gap: .45rem;
    align-items: center;
  }

  .hero-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(247,242,234,.35);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: background .2s, transform .2s;

    &.on { background: #1cb56d; transform: scale(1.45); }
  }

  /* ── Slide Counter ── */
  .hero-counter {
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    z-index: 4;
    background: rgba(10,8,6,.55);
    border: 1px solid rgba(247,242,234,.12);
    border-radius: 999px;
    padding: .28rem .85rem;
    font-size: .68rem;
    color: rgba(247,242,234,.6);
    letter-spacing: .1em;
    font-family: "Jost", sans-serif;
  }

  .detail-hero-content {
    position: relative;
    z-index: 3;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    padding: 0 4rem 2.5rem;
    pointer-events: none;

    a, button { pointer-events: auto; }

    h1 {
      margin: 0 0 .6rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(2.2rem, 5vw, 3.8rem);
      font-weight: 400;
      color: #F7F2EA;
      line-height: 1.05;
      max-width: 700px;

      em { font-style: italic; color: #9be7bf; }
    }
  }

  /* ── Breadcrumb ── */
  .breadcrumb {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .68rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(247,242,234,.38);
    margin-bottom: 1.4rem;
    flex-wrap: wrap;

    a { color: rgba(247,242,234,.38); text-decoration: none; transition: color .2s; }
    a:hover { color: #9be7bf; }
    .sep { opacity: .3; }
    .current { color: #4fd18f; }
  }

  .hero-cat-row {
    display: flex;
    align-items: center;
    gap: .8rem;
    margin-bottom: .9rem;
  }

  .hero-cat-pill {
    background: #1cb56d;
    color: #151a24;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    border-radius: 999px;
    padding: .28rem .9rem;
    font-family: "Jost", sans-serif;
  }

  .hero-rating {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .78rem;
    color: rgba(247,242,234,.55);

    .stars { color: #ffb400; letter-spacing: .05em; }
    strong { color: #F7F2EA; }
  }

  .detail-hero-sub {
    margin: 0;
    font-size: .88rem;
    color: rgba(247,242,234,.5);
    max-width: 540px;
    line-height: 1.8;
    font-weight: 300;
  }

  /* ── Quick Info Strip ── */
  .info-strip {
    background: rgba(247,242,234,.04);
    border-bottom: 1px solid rgba(28,181,109,.1);
  }

  .info-strip-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 4rem;
    display: flex;
    align-items: stretch;
    gap: 0;
  }

  .istrip-item {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1.2rem 2rem 1.2rem 0;
    margin-right: 2rem;
    border-right: 1px solid rgba(28,181,109,.1);
    flex-shrink: 0;

    &:last-child { border-right: none; margin-right: 0; }
  }

  .istrip-icon { font-size: 1.4rem; line-height: 1; flex-shrink: 0; }
  .istrip-text { display: flex; flex-direction: column; gap: .1rem; }
  .istrip-label { font-size: .6rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(247,242,234,.35); font-weight: 500; }
  .istrip-val { font-size: .88rem; color: #F7F2EA; font-weight: 500; }

  /* ── Page Layout ── */
  .sec-inner { max-width: 1400px; margin: 0 auto; padding: 0 4rem; }

  .detail-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 3.5rem;
    align-items: start;
    padding: 4rem 0 6rem;
  }

  /* ── Content Labels ── */
  .content-label {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    font-size: .6rem;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: 1rem;

    &::before { content: ''; width: 20px; height: 1px; background: #4fd18f; }
  }

  .content-block { margin-bottom: 3.5rem; }

  /* ── Overview ── */
  .overview-text p {
    font-size: .95rem;
    color: rgba(247,242,234,.6);
    line-height: 1.9;
    margin: 0 0 1.1rem;

    &:last-child { margin-bottom: 0; }
  }

  /* ── Highlights List ── */
  .highlights-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .85rem;

    li {
      display: flex;
      align-items: flex-start;
      gap: 1rem;
      font-size: .92rem;
      color: rgba(247,242,234,.62);
      line-height: 1.6;
    }
  }

  .hl-check {
    width: 22px;
    height: 22px;
    background: rgba(28,181,109,.15);
    border: 1px solid rgba(28,181,109,.35);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: .1rem;

    svg { display: block; }
  }

  /* ── Gallery Mosaic ── */
  .gallery-mosaic {
    display: grid;
    grid-template-columns: 1.55fr 1fr 1fr;
    grid-template-rows: 198px 198px;
    gap: 5px;
    border-radius: 18px;
    overflow: hidden;
  }

  .gm-item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background: rgba(247,242,234,.04);

    &.gm-main { grid-row: 1 / 3; }

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform .55s cubic-bezier(.22,1,.36,1), filter .35s;
      filter: brightness(.88);
    }

    &:hover img { transform: scale(1.07); filter: brightness(1.02); }

    &::after {
      content: '';
      position: absolute;
      inset: 0;
      border: 1px solid rgba(28,181,109,.1);
      pointer-events: none;
      z-index: 2;
    }
  }

  .gm-badge {
    position: absolute;
    bottom: 1.1rem;
    left: 1.1rem;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    background: rgba(10,8,6,.58);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(247,242,234,.14);
    border-radius: 999px;
    padding: .32rem .85rem;
    font-size: .68rem;
    font-weight: 500;
    color: rgba(247,242,234,.85);
    letter-spacing: .07em;
    font-family: "Jost", sans-serif;

    svg { opacity: .7; }
  }

  .gm-tag {
    position: absolute;
    top: 1.1rem;
    left: 1.1rem;
    z-index: 3;
    background: #1cb56d;
    color: #151a24;
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    border-radius: 6px;
    padding: .28rem .75rem;
    font-family: "Jost", sans-serif;
  }

  .gm-viewall {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    background: rgba(10,8,6,.52);
    backdrop-filter: blur(3px);
    transition: background .25s;

    &:hover { background: rgba(10,8,6,.64); }

    span {
      font-size: .72rem;
      font-weight: 600;
      color: #F7F2EA;
      letter-spacing: .12em;
      text-transform: uppercase;
      font-family: "Jost", sans-serif;
    }

    svg { opacity: .75; }
  }

  /* ── Itinerary ── */
  .itinerary { display: flex; flex-direction: column; gap: 0; }

  .itin-step {
    display: flex;
    gap: 1.4rem;
    padding-bottom: 1.8rem;
    position: relative;

    &:last-child { padding-bottom: 0; }

    &:not(:last-child)::before {
      content: '';
      position: absolute;
      left: 15px;
      top: 32px;
      bottom: 0;
      width: 1px;
      background: rgba(28,181,109,.2);
    }
  }

  .itin-dot {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(28,181,109,.12);
    border: 2px solid rgba(28,181,109,.4);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: .7rem;
    font-weight: 700;
    color: #4fd18f;
    font-family: "Jost", sans-serif;
    z-index: 1;
    position: relative;
  }

  .itin-body { flex: 1; }
  .itin-time { font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: #4fd18f; font-weight: 500; margin-bottom: .25rem; }
  .itin-title { font-family: "Playfair Display", serif; font-size: 1.02rem; font-weight: 500; color: #F7F2EA; margin-bottom: .4rem; }
  .itin-desc { font-size: .86rem; color: rgba(247,242,234,.45); line-height: 1.75; margin: 0; }

  /* ── Included / Not Included ── */
  .incl-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.4rem;
  }

  .incl-col {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 14px;
    padding: 1.6rem;

    h4 {
      margin: 0 0 1rem;
      font-size: .65rem;
      letter-spacing: .2em;
      text-transform: uppercase;
      font-weight: 600;
      font-family: "Jost", sans-serif;
    }

    &.yes h4 { color: #4fd18f; }
    &.no  h4 { color: rgba(247,100,80,.8); }
  }

  .incl-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .65rem;

    li {
      display: flex;
      align-items: flex-start;
      gap: .7rem;
      font-size: .86rem;
      color: rgba(247,242,234,.52);
      line-height: 1.55;
    }
  }

  .dot-yes {
    width: 16px; height: 16px;
    border-radius: 50%;
    background: rgba(28,181,109,.18);
    border: 1px solid #1cb56d;
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    margin-top: .1rem;
  }

  .dot-no {
    width: 16px; height: 16px;
    border-radius: 50%;
    background: rgba(247,100,80,.12);
    border: 1px solid rgba(247,100,80,.5);
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    margin-top: .1rem;
  }

  /* ── Meeting Point ── */
  .meet-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 14px;
    padding: 1.8rem;
    display: flex;
    gap: 1.4rem;
    align-items: flex-start;
  }

  .meet-icon { font-size: 2rem; flex-shrink: 0; line-height: 1; }

  .meet-body {
    h4 {
      margin: 0 0 .35rem;
      font-family: "Playfair Display", serif;
      font-size: 1rem;
      font-weight: 500;
      color: #F7F2EA;
    }

    p {
      margin: 0;
      font-size: .88rem;
      color: rgba(247,242,234,.48);
      line-height: 1.7;
    }

    .map-link {
      display: inline-flex;
      align-items: center;
      gap: .4rem;
      font-size: .75rem;
      color: #4fd18f;
      text-decoration: none;
      margin-top: .55rem;
      letter-spacing: .06em;
      transition: color .2s;

      &:hover { color: #9be7bf; }
    }
  }

  /* ── Reviews ── */
  .reviews-grid { display: flex; flex-direction: column; gap: 1.2rem; }

  .review-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.1);
    border-radius: 14px;
    padding: 1.6rem;
  }

  .review-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .9rem;
  }

  .reviewer { display: flex; align-items: center; gap: .85rem; }

  .reviewer-avatar {
    width: 42px; height: 42px;
    border-radius: 50%;
    background: rgba(28,181,109,.18);
    border: 1px solid rgba(28,181,109,.3);
    display: flex; align-items: center; justify-content: center;
    font-family: "Playfair Display", serif;
    font-size: 1.05rem; color: #9be7bf; font-weight: 700;
    flex-shrink: 0;
  }

  .reviewer-info {
    h5 { margin: 0 0 .15rem; font-size: .9rem; font-weight: 600; color: #F7F2EA; }
    span { font-size: .72rem; color: rgba(247,242,234,.35); }
  }

  .review-stars { color: #ffb400; font-size: .9rem; letter-spacing: .1em; }

  .review-text {
    font-size: .88rem;
    color: rgba(247,242,234,.52);
    line-height: 1.78;
    margin: 0;
    font-style: italic;

    &::before { content: '\201C'; color: #1cb56d; font-size: 1.2rem; line-height: 0; vertical-align: -.25em; margin-right: .2rem; }
    &::after  { content: '\201D'; color: #1cb56d; font-size: 1.2rem; line-height: 0; vertical-align: -.25em; margin-left:  .2rem; }
  }

  /* ── Sidebar ── */
  .detail-sidebar {
    position: sticky;
    top: 100px;
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
  }

  /* ── Booking Card ── */
  .book-card {
    background: rgba(247,242,234,.05);
    border: 1px solid rgba(28,181,109,.2);
    border-radius: 18px;
    overflow: hidden;
  }

  .book-card-top {
    padding: 1.6rem 1.8rem 1.4rem;
    border-bottom: 1px solid rgba(28,181,109,.1);
  }

  .book-price-row { display: flex; align-items: baseline; gap: .5rem; margin-bottom: .25rem; }

  .book-price {
    font-family: "Playfair Display", serif;
    font-size: 2.2rem;
    font-weight: 700;
    color: #4fd18f;
    line-height: 1;
  }

  .book-price-from { font-size: .75rem; color: rgba(247,242,234,.35); letter-spacing: .06em; }
  .book-price-per { font-size: .78rem; color: rgba(247,242,234,.4); margin-left: auto; }

  .book-rating-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .78rem;
    color: rgba(247,242,234,.45);

    .stars { color: #ffb400; }
    strong { color: #F7F2EA; }
  }

  .book-card-form {
    padding: 1.4rem 1.8rem 1.8rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  .bform-group {
    display: flex;
    flex-direction: column;
    gap: .4rem;

    label {
      font-size: .62rem;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: rgba(247,242,234,.4);
      font-weight: 500;
    }

    input, select {
      background: rgba(247,242,234,.07);
      border: 1px solid rgba(28,181,109,.18);
      border-radius: 8px;
      padding: .75rem 1rem;
      font-size: .88rem;
      color: #F7F2EA;
      font-family: "Jost", sans-serif;
      outline: none;
      transition: border-color .2s, background .2s;
      width: 100%;
      box-sizing: border-box;

      &:focus { border-color: #1cb56d; background: rgba(28,181,109,.06); }
    }

    select option { background: #151a24; }
  }

  /* ── Guest Counter ── */
  .guest-counter-wrap {
    background: rgba(247,242,234,.06);
    border: 1px solid rgba(28,181,109,.18);
    border-radius: 8px;
    overflow: hidden;
  }

  .guest-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .75rem 1rem;
    gap: .75rem;

    & + .guest-row { border-top: 1px solid rgba(28,181,109,.1); }
  }

  .guest-info { flex: 1; min-width: 0; }

  .guest-type {
    font-size: .86rem;
    font-weight: 500;
    color: #F7F2EA;
    display: flex;
    align-items: center;
    gap: .4rem;
    line-height: 1.2;
  }

  .guest-age { font-size: .7rem; color: rgba(247,242,234,.32); margin-top: .12rem; letter-spacing: .03em; }

  .guest-stepper { display: flex; align-items: center; gap: .55rem; flex-shrink: 0; }

  .gs-btn {
    width: 30px; height: 30px;
    border-radius: 50%;
    border: 1px solid rgba(28,181,109,.35);
    background: transparent;
    color: rgba(247,242,234,.7);
    font-size: 1.1rem;
    font-weight: 300;
    line-height: 1;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background .18s, border-color .18s, color .18s;
    padding: 0;
    font-family: "Jost", sans-serif;
    flex-shrink: 0;

    &:hover:not(:disabled) { background: #1cb56d; border-color: #1cb56d; color: #151a24; }
    &:disabled { opacity: .28; cursor: not-allowed; }
  }

  .gs-count {
    min-width: 28px;
    text-align: center;
    font-size: .98rem;
    font-weight: 600;
    color: #F7F2EA;
    font-family: "Jost", sans-serif;
    line-height: 1;
  }

  .guest-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem 1rem;
    background: rgba(28,181,109,.06);
    border-top: 1px solid rgba(28,181,109,.1);
  }

  .guest-total-label { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(247,242,234,.38); font-family: "Jost", sans-serif; }
  .guest-total-val { font-size: .8rem; font-weight: 600; color: #4fd18f; font-family: "Jost", sans-serif; }

  .book-submit {
    width: 100%;
    background: #1cb56d;
    color: #151a24;
    border: none;
    border-radius: 10px;
    padding: 1rem;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    cursor: pointer;
    transition: background .2s;
    margin-top: .6rem;

    &:hover { background: #4fd18f; }
  }

  .book-wa {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    box-sizing: border-box;
    background: transparent;
    color: rgba(247,242,234,.55);
    border: 1px solid rgba(28,181,109,.2);
    border-radius: 10px;
    padding: .78rem 1rem;
    font-size: .76rem;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    cursor: pointer;
    text-decoration: none;
    margin-top: .55rem;
    transition: border-color .2s, color .2s;

    &:hover { border-color: #25d366; color: #25d366; }
  }

  .book-note { font-size: .72rem; color: rgba(247,242,234,.28); text-align: center; line-height: 1.6; }
  .book-ok { display: none; text-align: center; color: #9be7bf; font-size: .85rem; padding: .5rem 0; }

  /* ── Facts Card ── */
  .facts-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    padding: 1.5rem 1.6rem;

    h4 { margin: 0 0 1rem; font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; color: #4fd18f; font-weight: 600; }
  }

  .facts-list { display: flex; flex-direction: column; gap: .7rem; }

  .fact-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    font-size: .85rem;
    padding-bottom: .7rem;
    border-bottom: 1px solid rgba(28,181,109,.07);

    &:last-child { border-bottom: none; padding-bottom: 0; }
  }

  .fact-key { color: rgba(247,242,234,.38); flex-shrink: 0; }
  .fact-val { color: #F7F2EA; text-align: right; font-weight: 500; }

  /* ── Guide Card ── */
  .guide-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    padding: 1.5rem 1.6rem;
    display: flex;
    gap: 1rem;
    align-items: center;
  }

  .guide-avatar {
    width: 52px; height: 52px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid rgba(28,181,109,.3);

    img { width: 100%; height: 100%; object-fit: cover; }
  }

  .guide-info {
    h5 { margin: 0 0 .15rem; font-family: "Playfair Display", serif; font-size: .98rem; font-weight: 500; color: #F7F2EA; }
    span { font-size: .7rem; color: rgba(247,242,234,.38); letter-spacing: .06em; }

    .guide-rating {
      display: flex;
      align-items: center;
      gap: .3rem;
      margin-top: .3rem;
      font-size: .76rem;
      color: rgba(247,242,234,.5);

      .stars { color: #ffb400; }
    }
  }

  /* ── Related Activities ── */
  .sec-related { padding: 0 0 6rem; }

  .stag-rel {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    font-size: .63rem;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: 1rem;

    &::before { content: ''; width: 24px; height: 1px; background: #4fd18f; }
  }

  .sh2-rel {
    margin: 0 0 2.5rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 400;
    color: #F7F2EA;

    em { font-style: italic; color: #9be7bf; }
  }

  .related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
  }

  .rel-card {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s, border-color .25s;

    &:hover { transform: translateY(-6px); box-shadow: 0 14px 36px rgba(28,181,109,.12); border-color: rgba(28,181,109,.3); }
    &:hover .rel-img-wrap img { transform: scale(1.07); }
  }

  .rel-img-wrap {
    position: relative;
    overflow: hidden;

    img {
      width: 100%; height: 190px;
      object-fit: cover; display: block;
      transition: transform .4s cubic-bezier(.22,1,.36,1);
    }
  }

  .rel-cat {
    position: absolute; top: .85rem; left: .85rem;
    background: #1cb56d; color: #151a24;
    font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
    border-radius: 5px; padding: .22rem .6rem;
    font-family: "Jost", sans-serif;
  }

  .rel-body {
    padding: 1.2rem 1.3rem;
    flex: 1;
    display: flex;
    flex-direction: column;

    h3 { margin: 0 0 .45rem; font-family: "Playfair Display", serif; font-size: 1.05rem; font-weight: 500; color: #F7F2EA; }
    p { margin: 0 0 1rem; font-size: .84rem; color: rgba(247,242,234,.44); line-height: 1.7; flex: 1; }
  }

  .rel-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(28,181,109,.1);
    padding: .9rem 1.3rem;
    margin-top: auto;
  }

  .rel-price { font-size: .9rem; font-weight: 600; color: #4fd18f; }

  .rel-link {
    font-size: .68rem; letter-spacing: .12em; text-transform: uppercase;
    color: rgba(247,242,234,.4); transition: color .2s;
    display: flex; align-items: center; gap: .3rem;
  }

  .rel-card:hover .rel-link { color: #9be7bf; }

  /* ── Lightbox ── */
  .lb-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: rgba(5,4,3,.97);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease;

    &.open { opacity: 1; pointer-events: all; }
  }

  .lb-topbar {
    position: absolute;
    top: 0; left: 0; right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.2rem 1.6rem;
    z-index: 4;
    background: linear-gradient(to bottom, rgba(5,4,3,.7) 0%, transparent 100%);
  }

  .lb-counter-text { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(247,242,234,.45); font-family: "Jost", sans-serif; }

  .lb-caption-top {
    font-size: .82rem;
    color: rgba(247,242,234,.55);
    font-family: "Jost", sans-serif;
    font-weight: 300;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 50vw;
  }

  .lb-close {
    background: rgba(247,242,234,.08);
    border: 1px solid rgba(247,242,234,.14);
    border-radius: 50%;
    width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    color: rgba(247,242,234,.7);
    transition: background .2s, color .2s;
    flex-shrink: 0;

    &:hover { background: #1cb56d; color: #151a24; border-color: #1cb56d; }
  }

  .lb-stage {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 4rem 6rem;
    box-sizing: border-box;
    position: relative;
  }

  .lb-img-wrap {
    position: relative;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lb-img {
    max-width: 100%;
    max-height: calc(100vh - 200px);
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 10px;
    display: block;
    transition: opacity .22s ease, transform .22s ease;
    box-shadow: 0 24px 80px rgba(0,0,0,.6);

    &.switching { opacity: 0; transform: scale(.97); }
  }

  .lb-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    width: 52px; height: 52px;
    border-radius: 50%;
    background: rgba(247,242,234,.07);
    border: 1px solid rgba(247,242,234,.12);
    color: rgba(247,242,234,.75);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background .2s, border-color .2s, color .2s;
    padding: 0;

    &:hover { background: #1cb56d; border-color: #1cb56d; color: #151a24; }
    &.lb-prev { left: 1.2rem; }
    &.lb-next { right: 1.2rem; }
  }

  .lb-thumbs-wrap {
    width: 100%;
    padding: 0 1.5rem 1.4rem;
    box-sizing: border-box;
    background: linear-gradient(to top, rgba(5,4,3,.8) 0%, transparent 100%);
    position: absolute;
    bottom: 0; left: 0; right: 0;
  }

  .lb-thumbs {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    scroll-behavior: smooth;
    padding: .3rem .2rem;
    scrollbar-width: none;

    &::-webkit-scrollbar { display: none; }
  }

  .lb-thumb {
    flex: 0 0 64px;
    height: 46px;
    border-radius: 6px;
    overflow: hidden;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color .2s, opacity .2s;
    opacity: .45;
    padding: 0;
    background: none;

    img { width: 100%; height: 100%; object-fit: cover; display: block; }

    &.on { border-color: #1cb56d; opacity: 1; }
    &:hover { opacity: .85; }
  }
}


/* ================================================================
   PAGE: LES CIRCUIT — #page-les-circuit
   ================================================================ */#page-les-circuit {

  /* ── Hero Mini ── */
  .hero-mini {
    width: 100%;
    min-height: 36vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 0 3.5rem;
    background:
      linear-gradient(to top, rgba(10,8,6,.96) 0%, rgba(10,8,6,.5) 50%, rgba(10,8,6,.18) 100%),
      linear-gradient(to right, rgba(29,32,48,.75) 0%, transparent 60%),
      url("../img/banner/banner1.png") center/cover no-repeat;
    position: relative;

    h1 {
      margin: 0 0 .6rem;
      font-family: "Playfair Display", serif;
      font-size: clamp(2rem, 5vw, 3.4rem);
      font-weight: 400;
      line-height: 1.05;
      color: #F7F2EA;
      letter-spacing: -.01em;

      em { font-style: italic; color: #9be7bf; }
    }
  }

  .eyebrow-tp {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: .6rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: #4fd18f;
    font-weight: 500;
    margin-bottom: .7rem;

    &::before { content: ''; width: 32px; height: 1px; background: #4fd18f; flex-shrink: 0; }
  }

  .hero-sub-tp {
    margin: 0;
    font-size: .85rem;
    color: rgba(247,242,234,.5);
    max-width: 520px;
    line-height: 1.8;
    font-weight: 300;
  }

  /* ── Layout ── */
  .sec-inner { max-width: 1400px; margin: 0 auto; padding: 0 4rem; }

  .page-wrap {
    display: grid;
    grid-template-columns: 284px 1fr;
    gap: 2.8rem;
    padding: 4rem 0 7rem;
    align-items: start;
  }

  /* ── Filter Sidebar ── */
  .filter-sidebar {
    position: sticky;
    top: 92px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  .fs-panel {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.13);
    border-radius: 16px;
    overflow: hidden;

    &.open .fs-chevron { transform: rotate(180deg); }
    &.open .fs-body    { display: block; }
  }

  .fs-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 1.4rem .9rem;
    cursor: pointer;
    user-select: none;
  }

  .fs-head-label {
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #4fd18f;
    font-family: "Jost", sans-serif;
    display: flex;
    align-items: center;
    gap: .55rem;

    &::before { content: ''; width: 14px; height: 1px; background: #1cb56d; flex-shrink: 0; }
  }

  .fs-chevron {
    width: 16px; height: 16px;
    color: rgba(247,242,234,.3);
    transition: transform .25s;
    flex-shrink: 0;
  }

  .fs-body {
    padding: 0 1.4rem 1.3rem;
    display: none;
  }

  /* ── Search Box ── */
  .search-wrap {
    position: relative;
    margin-bottom: .2rem;

    svg {
      position: absolute;
      left: .9rem;
      top: 50%;
      transform: translateY(-50%);
      color: rgba(28,181,109,.5);
      pointer-events: none;
    }
  }

  .search-input {
    width: 100%;
    box-sizing: border-box;
    background: rgba(247,242,234,.05);
    border: 1px solid rgba(28,181,109,.18);
    border-radius: 10px;
    padding: .7rem .9rem .7rem 2.4rem;
    font-size: .82rem;
    color: #F7F2EA;
    font-family: "Jost", sans-serif;
    outline: none;
    transition: border-color .2s;

    &::placeholder { color: rgba(247,242,234,.25); }
    &:focus { border-color: rgba(28,181,109,.5); }
  }

  /* ── Price Range ── */
  .price-inputs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .6rem;
    margin-bottom: .8rem;
  }

  .price-field {
    display: flex;
    flex-direction: column;
    gap: .3rem;

    label {
      font-size: .6rem;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: rgba(247,242,234,.3);
      font-family: "Jost", sans-serif;
    }

    input {
      background: rgba(247,242,234,.05);
      border: 1px solid rgba(28,181,109,.18);
      border-radius: 8px;
      padding: .55rem .75rem;
      font-size: .82rem;
      color: #F7F2EA;
      font-family: "Jost", sans-serif;
      outline: none;
      width: 100%;
      box-sizing: border-box;
      transition: border-color .2s;

      &:focus { border-color: rgba(28,181,109,.5); }
    }
  }

  .price-slider-wrap { margin-top: .3rem; }

  .price-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 3px;
    background: linear-gradient(to right, #1cb56d var(--pct,100%), rgba(28,181,109,.18) var(--pct,100%));
    border-radius: 999px;
    outline: none;
    cursor: pointer;

    &::-webkit-slider-thumb {
      -webkit-appearance: none;
      width: 16px; height: 16px;
      border-radius: 50%;
      background: #1cb56d;
      border: 2px solid rgba(10,8,6,.8);
      box-shadow: 0 0 0 3px rgba(28,181,109,.2);
      cursor: pointer;
      transition: box-shadow .18s;
    }

    &::-webkit-slider-thumb:hover { box-shadow: 0 0 0 5px rgba(28,181,109,.25); }
  }

  /* ── Location Select ── */
  .filter-select {
    width: 100%;
    box-sizing: border-box;
    background: rgba(247,242,234,.05);
    border: 1px solid rgba(28,181,109,.18);
    border-radius: 10px;
    padding: .65rem .85rem;
    font-size: .82rem;
    color: #F7F2EA;
    font-family: "Jost", sans-serif;
    outline: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%234fd18f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .85rem center;
    cursor: pointer;
    transition: border-color .2s;

    &:focus { border-color: rgba(28,181,109,.5); }
    option { background: #151a24; color: #F7F2EA; }
  }

  /* ── Checkbox Group ── */
  .cb-group {
    display: flex;
    flex-direction: column;
    gap: .3rem;
  }

  .cb-item {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .42rem .3rem;
    border-radius: 7px;
    cursor: pointer;
    transition: background .15s;

    &:hover { background: rgba(28,181,109,.06); }
    input[type="checkbox"] { display: none; }
  }

  .cb-box {
    width: 17px; height: 17px;
    border-radius: 5px;
    border: 1.5px solid rgba(28,181,109,.3);
    background: transparent;
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    transition: background .18s, border-color .18s;
  }

  .cb-item input:checked ~ .cb-box {
    background: #1cb56d;
    border-color: #1cb56d;

    &::after {
      content: '';
      width: 9px; height: 5px;
      border-left: 2px solid #151a24;
      border-bottom: 2px solid #151a24;
      transform: rotate(-45deg) translateY(-1px);
      display: block;
    }
  }

  .cb-label {
    font-size: .8rem;
    color: rgba(247,242,234,.55);
    font-family: "Jost", sans-serif;
    line-height: 1;
    flex: 1;
    transition: color .15s;
  }

  .cb-item:has(input:checked) .cb-label { color: #F7F2EA; }

  .cb-count {
    font-size: .65rem;
    color: rgba(247,242,234,.25);
    font-family: "Jost", sans-serif;
    background: rgba(247,242,234,.06);
    border-radius: 999px;
    padding: .12rem .5rem;
    min-width: 22px;
    text-align: center;
  }

  /* ── Star Rating Filter ── */
  .star-group { display: flex; flex-direction: column; gap: .25rem; }

  .star-row {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .38rem .3rem;
    border-radius: 7px;
    cursor: pointer;
    transition: background .15s;

    &:hover { background: rgba(28,181,109,.06); }
    input[type="radio"] { display: none; }

    .stars { color: rgba(255,180,0,.35); font-size: .85rem; letter-spacing: .06em; transition: color .18s; }
    input:checked ~ .stars { color: #ffb400; }
  }

  .star-row-label {
    font-size: .75rem;
    color: rgba(247,242,234,.35);
    font-family: "Jost", sans-serif;
    transition: color .18s;
  }

  .star-row input:checked ~ .stars + .star-row-label { color: rgba(247,242,234,.7); }

  /* ── Clear Button ── */
  .clear-btn {
    width: 100%;
    background: transparent;
    border: 1px solid rgba(247,242,234,.1);
    color: rgba(247,242,234,.35);
    border-radius: 9px;
    padding: .65rem 1rem;
    font-size: .68rem;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    cursor: pointer;
    transition: border-color .2s, color .2s;
    margin-top: .4rem;

    &:hover { border-color: rgba(247,242,234,.25); color: rgba(247,242,234,.6); }
  }

  /* ── Results Area ── */
  .results-area { min-width: 0; }

  .results-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.8rem;
    flex-wrap: wrap;
  }

  .results-count {
    font-size: .78rem;
    color: rgba(247,242,234,.38);
    font-family: "Jost", sans-serif;

    strong { color: #F7F2EA; font-weight: 600; }
  }

  /* ── Sort Tabs ── */
  .sort-tabs { display: flex; gap: .35rem; flex-wrap: wrap; }

  .sort-tab {
    background: transparent;
    border: 1px solid rgba(28,181,109,.2);
    color: rgba(247,242,234,.45);
    border-radius: 999px;
    padding: .38rem 1rem;
    font-size: .68rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-family: "Jost", sans-serif;
    font-weight: 500;
    cursor: pointer;
    transition: background .18s, color .18s, border-color .18s;
    white-space: nowrap;

    &:hover { border-color: rgba(28,181,109,.4); color: #9be7bf; }
    &.on { background: #1cb56d; color: #151a24; border-color: #1cb56d; font-weight: 600; }
  }

  /* ── View Toggle ── */
  .view-toggle {
    display: flex;
    gap: .3rem;
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.13);
    border-radius: 9px;
    padding: .25rem;
  }

  .vt-btn {
    width: 32px; height: 32px;
    border: none;
    background: transparent;
    border-radius: 6px;
    display: flex; align-items: center; justify-content: center;
    color: rgba(247,242,234,.3);
    cursor: pointer;
    transition: background .18s, color .18s;

    &.on { background: rgba(28,181,109,.18); color: #4fd18f; }
    &:hover:not(.on) { color: rgba(247,242,234,.6); }
  }

  /* ── Cards Grid ── */
  .cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.3rem;

    &.list-mode { grid-template-columns: 1fr; }
  }

  /* ── No Results ── */
  .no-results-msg {
    display: none;
    grid-column: 1 / -1;
    text-align: center;
    padding: 4rem 2rem;
    color: rgba(247,242,234,.3);
    font-family: "Jost", sans-serif;
    font-size: .9rem;

    svg { opacity: .2; margin-bottom: 1rem; }
  }

  /* ── Grid Card (gc) ── */
  .gc {
    background: rgba(247,242,234,.04);
    border: 1px solid rgba(28,181,109,.12);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s, border-color .25s;

    &:hover {
      transform: translateY(-8px);
      box-shadow: 0 20px 48px rgba(28,181,109,.14);
      border-color: rgba(28,181,109,.32);
    }

    &[data-hidden="true"] { display: none; }
    &:hover .gc-img img { transform: scale(1.07); filter: brightness(.95); }
  }

  .gc-img {
    position: relative;
    overflow: hidden;

    img {
      width: 100%;
      height: 195px;
      object-fit: cover;
      display: block;
      filter: brightness(.8);
      transition: transform .5s cubic-bezier(.22,1,.36,1), filter .35s;
    }
  }

  .gc-badge-day {
    position: absolute; top: .9rem; left: .9rem;
    background: #1cb56d; color: #151a24;
    font-size: .58rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase;
    border-radius: 999px; padding: .25rem .75rem;
    font-family: "Jost", sans-serif;
  }

  .gc-badge-pop {
    position: absolute; top: .9rem; right: .9rem;
    background: rgba(10,8,6,.65); backdrop-filter: blur(8px);
    border: 1px solid rgba(247,242,234,.1);
    color: rgba(247,242,234,.65);
    font-size: .58rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
    border-radius: 6px; padding: .25rem .65rem;
    font-family: "Jost", sans-serif;

    &.hot { border-color: rgba(255,100,60,.3); color: #ff7a54; }
    &.new { border-color: rgba(28,181,109,.3); color: #4fd18f; }
  }

  .gc-rating-bar {
    position: absolute; bottom: 0; left: 0; right: 0;
    padding: .6rem .9rem;
    background: linear-gradient(to top, rgba(10,8,6,.75), transparent);
    display: flex; align-items: center; gap: .4rem;
  }

  .gc-stars { color: #ffb400; font-size: .75rem; letter-spacing: .04em; }
  .gc-rating-num { font-size: .72rem; font-weight: 600; color: #F7F2EA; font-family: "Jost", sans-serif; }
  .gc-review-count { font-size: .65rem; color: rgba(247,242,234,.38); font-family: "Jost", sans-serif; }

  .gc-body {
    padding: 1.15rem 1.2rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: .55rem;
  }

  .gc-chips { display: flex; flex-wrap: wrap; gap: .3rem; }

  .gc-chips span {
    font-size: .6rem; font-weight: 500; letter-spacing: .07em;
    border-radius: 999px;
    background: rgba(28,181,109,.12); color: #9be7bf;
    padding: .18rem .6rem; font-family: "Jost", sans-serif;
  }

  .gc-title {
    margin: 0;
    font-family: "Playfair Display", serif;
    font-size: 1.05rem; font-weight: 500; color: #F7F2EA; line-height: 1.25;

    em { font-style: italic; color: #9be7bf; }
  }

  .gc-desc {
    font-size: .8rem; color: rgba(247,242,234,.4);
    line-height: 1.7; font-weight: 300; flex: 1;
    display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden;
  }

  .gc-meta { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }

  .gc-meta-item {
    display: flex; align-items: center; gap: .3rem;
    font-size: .68rem; color: rgba(247,242,234,.35); font-family: "Jost", sans-serif;

    svg { opacity: .5; }
  }

  .gc-foot {
    display: flex; align-items: center; justify-content: space-between;
    border-top: 1px solid rgba(28,181,109,.1);
    padding: .9rem 1.2rem;
    margin-top: auto;
  }

  .gc-price {
    display: flex; flex-direction: column; gap: .05rem;

    span { font-size: .58rem; color: rgba(247,242,234,.28); text-transform: uppercase; letter-spacing: .1em; font-family: "Jost", sans-serif; }
    strong { font-size: 1.05rem; font-weight: 600; color: #4fd18f; font-family: "Jost", sans-serif; }
  }

  .gc-btn {
    border: 1px solid rgba(28,181,109,.4);
    background: transparent; color: #9be7bf;
    border-radius: 7px; padding: .42rem 1rem;
    font-size: .65rem; letter-spacing: .12em; text-transform: uppercase;
    font-family: "Jost", sans-serif; font-weight: 500; cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;

    &:hover { background: #1cb56d; color: #151a24; border-color: #1cb56d; }
  }

  /* ── List Mode ── */
  .list-mode {
    .gc {
      flex-direction: row;
      border-radius: 16px;
    }

    .gc-img {
      flex: 0 0 260px;

      img { width: 100%; height: 100%; min-height: 200px; }
    }

    .gc-body { padding: 1.4rem 1.5rem; gap: .5rem; flex: 1; }

    .gc-desc { -webkit-line-clamp: 3; line-clamp: 3; }

    .gc-title { font-size: 1.18rem; }

    .gc-foot {
      flex: 0 0 160px;
      flex-direction: column;
      align-items: stretch;
      justify-content: center;
      gap: .7rem;
      border-top: none;
      border-left: 1px solid rgba(28,181,109,.1);
      padding: 1.6rem 1.4rem;
      margin-top: 0;
    }

    .gc-price {
      flex-direction: column;
      align-items: center;
      gap: .15rem;
      text-align: center;

      span { display: block; }
      strong { font-size: 1.75rem; line-height: 1; }
    }

    .gc-btn { width: 100%; text-align: center; justify-content: center; }
    .gc-btn-book { display: block; }
  }

  .gc-btn-book {
    background: #1cb56d; color: #151a24; border: none;
    border-radius: 7px; padding: .55rem 1rem;
    font-size: .65rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    font-family: "Jost", sans-serif; cursor: pointer;
    transition: background .2s, transform .15s;
    display: none;
    width: 100%; text-align: center;

    &:hover { background: #4fd18f; transform: translateY(-1px); }
  }

  /* ── Active Filter Chips ── */
  .active-filters { display: flex; gap: .45rem; flex-wrap: wrap; margin-bottom: 1.4rem; }

  .af-chip {
    display: inline-flex; align-items: center; gap: .4rem;
    background: rgba(28,181,109,.1); border: 1px solid rgba(28,181,109,.22);
    color: #9be7bf; border-radius: 999px;
    padding: .28rem .75rem .28rem .85rem;
    font-size: .65rem; letter-spacing: .08em; font-family: "Jost", sans-serif;

    button {
      background: none; border: none; cursor: pointer; color: rgba(28,181,109,.55);
      padding: 0; display: flex; align-items: center; transition: color .15s;
      font-size: .85rem; line-height: 1;

      &:hover { color: #4fd18f; }
    }
  }
}


/* ════════════════════════════════════════
   customize-tour.html
   ════════════════════════════════════════ */
#page-customize-tour {

  /* Hero */
  .itnb-hero {
    padding: 5rem 1.5rem 3rem;
    text-align: center;
    max-width: 700px;
    margin: 0 auto;

    .eyebrow { font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #4fd18f; margin-bottom: 1rem; }
    h1 { font-family: "Playfair Display", serif; font-size: clamp(2rem,5vw,3.2rem); line-height: 1.15; margin-bottom: 1rem; }
    h1 em { color: #4fd18f; font-style: italic; }
    p { font-size: .92rem; color: rgba(247,242,234,.6); line-height: 1.7; max-width: 520px; margin: 0 auto; }
  }

  /* Layout */
  .itnb-wrap { display: grid; grid-template-columns: 1fr 380px; gap: 2rem; max-width: 1180px; margin: 0 auto; padding: 0 1.5rem 5rem; align-items: start; }

  /* Picker — left */
  .itnb-section { margin-bottom: 2.2rem; }

  .itnb-section-label {
    font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    color: rgba(247,242,234,.38); margin-bottom: .9rem; display: flex; align-items: center; gap: .5rem;
    &::before { content: ""; display: inline-block; width: 18px; height: 1.5px; background: #1cb56d; }
  }

  /* Day buttons */
  .day-btns { display: flex; gap: .4rem; flex-wrap: wrap; }
  .day-btn {
    padding: .45rem 1.05rem; border-radius: 8px; background: transparent;
    border: 1.5px solid rgba(247,242,234,.12); color: rgba(247,242,234,.45);
    font-family: inherit; font-size: .76rem; font-weight: 700; letter-spacing: .05em; cursor: pointer; transition: all .15s;
    &:hover { border-color: rgba(247,242,234,.3); color: rgba(247,242,234,.8); }
    &.on { background: rgba(28,181,109,.13); border-color: #1cb56d; color: #4fd18f; }
  }

  /* Filter tabs */
  .itnb-filters { display: flex; gap: .35rem; flex-wrap: wrap; margin-bottom: 1.2rem; }
  .itnb-ftab {
    padding: .38rem .9rem; border-radius: 20px; background: transparent;
    border: 1.5px solid rgba(247,242,234,.1); color: rgba(247,242,234,.4);
    font-family: inherit; font-size: .72rem; font-weight: 600; cursor: pointer; transition: all .15s;
    &:hover { border-color: rgba(247,242,234,.25); color: rgba(247,242,234,.7); }
    &.on { background: rgba(247,242,234,.08); border-color: rgba(247,242,234,.3); color: rgba(247,242,234,.9); }
  }

  /* Activities grid */
  .itnb-acts-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; }
  .itnb-act {
    border-radius: 12px; overflow: hidden; border: 1.5px solid rgba(247,242,234,.08);
    background: rgba(247,242,234,.03); cursor: pointer; transition: border-color .15s,background .15s; position: relative;
    &:hover { border-color: rgba(247,242,234,.2); background: rgba(247,242,234,.06); }
    &.added { border-color: rgba(28,181,109,.5); background: rgba(28,181,109,.06); }
    &.added .itnb-act-check { background: #1cb56d; border-color: #1cb56d; }
    &.added .itnb-act-check svg { opacity: 1; }
    .itnb-act-img { width: 100%; height: 100px; object-fit: cover; display: block; }
    .itnb-act-check {
      position: absolute; top: 7px; right: 7px; width: 22px; height: 22px; border-radius: 50%;
      background: rgba(15,20,30,.7); border: 1.5px solid rgba(247,242,234,.3);
      display: flex; align-items: center; justify-content: center; transition: all .15s;
      svg { opacity: 0; transition: opacity .15s; }
    }
    .itnb-act-body { padding: .6rem .65rem .7rem; }
    .itnb-act-cat { font-size: .58rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4fd18f; margin-bottom: .25rem; }
    .itnb-act-name { font-size: .78rem; font-weight: 600; color: rgba(247,242,234,.9); line-height: 1.3; margin-bottom: .25rem; }
    .itnb-act-dur { font-size: .65rem; color: rgba(247,242,234,.35); display: flex; align-items: center; gap: .3rem; }
    .itnb-act-price { font-size: .65rem; font-weight: 700; color: #4fd18f; margin-top: .18rem; }
  }
  .itnb-item-price { font-size: .6rem; font-weight: 700; color: #4fd18f; margin-left: .35rem; }

  /* Panel — right */
  .itnb-panel { position: sticky; top: 90px; border: 1.5px solid rgba(247,242,234,.1); border-radius: 16px; overflow: hidden; background: rgba(247,242,234,.02); }
  .itnb-panel-head { padding: .9rem 1.1rem; border-bottom: 1px solid rgba(247,242,234,.08); display: flex; align-items: center; justify-content: space-between; }
  .itnb-panel-title { font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(247,242,234,.7); }
  .itnb-count-badge { font-size: .65rem; font-weight: 700; background: rgba(28,181,109,.15); border: 1px solid rgba(28,181,109,.3); color: #4fd18f; border-radius: 20px; padding: .18rem .6rem; }
  .itnb-panel-days { display: flex; align-items: center; gap: .3rem; padding: .6rem .9rem; border-bottom: 1px solid rgba(247,242,234,.06); flex-wrap: wrap; }
  .itnb-pday-label { font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(247,242,234,.28); margin-right: .2rem; white-space: nowrap; }
  .itnb-pday-tab {
    padding: .28rem .7rem; border-radius: 6px; background: transparent;
    border: 1px solid rgba(247,242,234,.1); color: rgba(247,242,234,.38);
    font-family: inherit; font-size: .67rem; font-weight: 700; cursor: pointer; transition: all .12s;
    &:hover { border-color: rgba(247,242,234,.22); color: rgba(247,242,234,.65); }
    &.on { background: rgba(28,181,109,.12); border-color: rgba(28,181,109,.4); color: #4fd18f; }
  }
  .itnb-panel-body { padding: .6rem .9rem; min-height: 160px; }
  .itnb-empty { text-align: center; padding: 2rem 1rem; color: rgba(247,242,234,.25); font-size: .78rem; line-height: 1.6;
    svg { display: block; margin: 0 auto .6rem; opacity: .3; }
  }

  /* Day groups */
  .itnb-day-group { margin-bottom: .9rem; &:last-child { margin-bottom: 0; } }
  .itnb-day-group-head { display: flex; align-items: center; justify-content: space-between; padding: .35rem .1rem; border-bottom: 1px solid rgba(247,242,234,.07); margin-bottom: .45rem; }
  .itnb-day-group-label { font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #4fd18f; }
  .itnb-day-group-count { font-size: .62rem; color: rgba(247,242,234,.28); }
  .itnb-day-clear { background: none; border: none; color: rgba(247,242,234,.22); cursor: pointer; padding: .15rem .2rem; border-radius: 4px; line-height: 1; transition: color .12s; margin-left: .4rem;
    &:hover { color: rgba(247,100,80,.75); }
  }
  .itnb-empty-day { font-size: .72rem; color: rgba(247,242,234,.2); padding: .3rem .1rem .4rem; font-style: italic; }

  /* Items */
  .itnb-item { display: flex; align-items: center; gap: .6rem; padding: .55rem .5rem; border-radius: 8px; background: rgba(247,242,234,.04); border: 1px solid rgba(247,242,234,.07); margin-bottom: .45rem;
    &:last-child { margin-bottom: 0; }
  }
  .itnb-item-img { width: 36px; height: 36px; border-radius: 6px; object-fit: cover; flex-shrink: 0; }
  .itnb-item-prov { width: 36px; height: 36px; border-radius: 6px; background: rgba(28,181,109,.12); border: 1px solid rgba(28,181,109,.2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #4fd18f; }
  .itnb-item-info { flex: 1; min-width: 0; }
  .itnb-item-name { font-size: .74rem; font-weight: 600; color: rgba(247,242,234,.85); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .itnb-item-dur { font-size: .62rem; color: rgba(247,242,234,.32); }
  .itnb-item-rm { background: none; border: none; color: rgba(247,242,234,.25); cursor: pointer; padding: .2rem; border-radius: 4px; line-height: 1; transition: color .12s; flex-shrink: 0;
    &:hover { color: rgba(247,100,80,.8); }
  }

  /* Panel footer & editor */
  .itnb-panel-foot { padding: .85rem 1rem; border-top: 1px solid rgba(247,242,234,.07); }
  .itnb-editor {
    border: 1.5px solid rgba(247,242,234,.1); border-radius: 9px; overflow: hidden; margin-bottom: .75rem; transition: border-color .15s;
    &:focus-within { border-color: rgba(28,181,109,.42); }
    .itnb-editor-toolbar { display: flex; align-items: center; gap: .1rem; padding: .38rem .5rem; background: rgba(247,242,234,.04); border-bottom: 1px solid rgba(247,242,234,.07); flex-wrap: wrap; }
    .itnb-tb-btn { background: none; border: none; color: rgba(247,242,234,.45); cursor: pointer; padding: .22rem .42rem; border-radius: 4px; font-family: inherit; font-size: .73rem; line-height: 1; transition: background .12s,color .12s; min-width: 24px; text-align: center;
      &:hover { background: rgba(247,242,234,.1); color: rgba(247,242,234,.9); }
    }
    .itnb-tb-sep { width: 1px; height: 13px; background: rgba(247,242,234,.1); margin: 0 .25rem; flex-shrink: 0; }
    .itnb-editor-body {
      min-height: 72px; padding: .6rem .75rem; color: rgba(247,242,234,.8); font-family: inherit; font-size: .76rem; line-height: 1.6; outline: none;
      &:empty::before { content: attr(data-placeholder); color: rgba(247,242,234,.22); pointer-events: none; display: block; }
      ul, ol { padding-left: 1.3rem; margin: .2rem 0; }
      b, strong { color: rgba(247,242,234,.95); }
      a { color: #4fd18f; }
    }
    .itnb-resize-handle {
      height: 9px; background: rgba(247,242,234,.02); border-top: 1px solid rgba(247,242,234,.07); cursor: ns-resize; display: flex; align-items: center; justify-content: center;
      &::after { content: ""; display: block; width: 28px; height: 2.5px; border-radius: 2px; background: rgba(247,242,234,.14); transition: background .15s; }
      &:hover::after { background: rgba(247,242,234,.38); }
    }
  }
  .itnb-summary { font-size: .72rem; color: rgba(247,242,234,.35); margin-bottom: .75rem; line-height: 1.5;
    span { color: #4fd18f; font-weight: 600; }
  }
  .itnb-cta-row { display: flex; gap: .5rem; }
  .itnb-btn-send { flex: 1; padding: .65rem .8rem; border-radius: 9px; background: #1cb56d; border: none; color: #fff; font-family: inherit; font-size: .75rem; font-weight: 700; letter-spacing: .04em; cursor: pointer; transition: background .15s;
    &:hover { background: #18a460; }
  }
  .itnb-btn-reset { padding: .65rem .8rem; border-radius: 9px; background: transparent; border: 1.5px solid rgba(247,242,234,.12); color: rgba(247,242,234,.4); font-family: inherit; font-size: .72rem; font-weight: 600; cursor: pointer; transition: all .15s;
    &:hover { border-color: rgba(247,100,80,.4); color: rgba(247,100,80,.7); }
  }

  /* Province explorer */
  .itnb-prov-hint { font-size: .72rem; color: rgba(247,242,234,.3); margin-bottom: .9rem; line-height: 1.5; }
  .itnb-prov-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .45rem; margin-bottom: 1rem; }
  .prov-card {
    padding: .55rem .7rem; border-radius: 10px; border: 1.5px solid rgba(247,242,234,.08);
    background: rgba(247,242,234,.03); cursor: pointer; transition: border-color .15s,background .15s; position: relative;
    &:hover { border-color: rgba(247,242,234,.22); background: rgba(247,242,234,.07); }
    &.selected { border-color: #1cb56d; background: rgba(28,181,109,.07); }
    &.selected .prov-card-added { display: block; }
    .prov-card-name { font-size: .75rem; font-weight: 600; color: rgba(247,242,234,.85); margin-bottom: .18rem; }
    .prov-card-region { font-size: .6rem; letter-spacing: .05em; color: rgba(247,242,234,.3); text-transform: uppercase; }
    .prov-card-added { position: absolute; top: 5px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: #1cb56d; display: none; }
  }

  /* Places timeline */
  .prov-places-wrap { border: 1.5px solid rgba(247,242,234,.08); border-radius: 12px; margin-top: .6rem; overflow: hidden; }
  .prov-places-header { display: flex; align-items: center; justify-content: space-between; padding: .6rem .9rem .5rem; border-bottom: 1px solid rgba(247,242,234,.07); }
  .prov-places-pname { font-size: .8rem; font-weight: 700; color: rgba(247,242,234,.88); }
  .prov-places-label { font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(247,242,234,.28); }
  .prov-places-timeline { padding: .5rem .9rem .7rem; position: relative; }
  .prov-place-row {
    display: flex; align-items: flex-start; gap: .75rem; padding: .55rem 0; position: relative;
    &:not(:last-child)::before { content: ""; position: absolute; left: 7px; top: 22px; bottom: -10px; width: 1.5px; background: rgba(247,242,234,.08); }
    &.added .prov-place-dot { background: #1cb56d; border-color: #1cb56d; }
    &.added .prov-place-add { border-color: rgba(28,181,109,.5); background: rgba(28,181,109,.12); color: #4fd18f; }
    &.added .prov-place-name { color: rgba(247,242,234,.95); }
  }
  .prov-place-dot { width: 15px; height: 15px; border-radius: 50%; border: 2px solid rgba(247,242,234,.18); background: rgba(247,242,234,.05); flex-shrink: 0; margin-top: 3px; transition: all .18s; }
  .prov-place-info { flex: 1; min-width: 0; }
  .prov-place-name { font-size: .76rem; font-weight: 600; color: rgba(247,242,234,.82); margin-bottom: .18rem; line-height: 1.3; }
  .prov-place-desc { font-size: .65rem; color: rgba(247,242,234,.35); line-height: 1.4; }
  .prov-place-add { flex-shrink: 0; padding: .26rem .65rem; border-radius: 6px; border: 1.5px solid rgba(247,242,234,.14); background: transparent; color: rgba(247,242,234,.45); font-family: inherit; font-size: .65rem; font-weight: 700; cursor: pointer; transition: all .15s; white-space: nowrap;
    &:hover { border-color: rgba(28,181,109,.45); color: #4fd18f; background: rgba(28,181,109,.07); }
  }
  .prov-place-time { display: inline-block; font-size: .58rem; font-weight: 700; letter-spacing: .04em; color: rgba(247,242,234,.38); background: rgba(247,242,234,.06); border-radius: 4px; padding: .1rem .42rem; margin-left: .4rem; vertical-align: middle; white-space: nowrap;
    &.matin   { color: #f9c74f; background: rgba(249,199,79,.08); }
    &.soir    { color: #a78bfa; background: rgba(167,139,250,.08); }
    &.journee { color: #4fd18f; background: rgba(28,181,109,.08); }
    &.aprem   { color: #f4845f; background: rgba(244,132,95,.08); }
  }
  .prov-place-pin { flex-shrink: 0; width: 26px; height: 26px; border-radius: 6px; border: 1.5px solid rgba(247,242,234,.1); background: transparent; color: rgba(247,242,234,.35); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .15s; margin-right: .25rem;
    &:hover { border-color: rgba(66,153,225,.5); color: #63b3ed; background: rgba(66,153,225,.08); }
  }
  .prov-place-actions { display: flex; align-items: center; flex-shrink: 0; gap: .2rem; }

  /* Map modal */
  .map-modal-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,.72); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
  .map-modal-panel { background: #0f141e; border: 1.5px solid rgba(247,242,234,.12); border-radius: 16px; overflow: hidden; width: min(580px,94vw); display: flex; flex-direction: column; box-shadow: 0 32px 80px #000c; animation: modalIn .18s ease; }
  @keyframes modalIn { from { opacity: 0; transform: scale(.95) translateY(12px); } to { opacity: 1; transform: none; } }
  .map-modal-head { display: flex; align-items: center; justify-content: space-between; padding: .7rem 1rem; border-bottom: 1px solid rgba(247,242,234,.08); flex-shrink: 0; }
  .map-modal-title { font-size: .82rem; font-weight: 700; color: rgba(247,242,234,.9); display: flex; align-items: center; gap: .5rem;
    svg { color: #63b3ed; flex-shrink: 0; }
  }
  .map-modal-close { background: none; border: none; color: rgba(247,242,234,.35); cursor: pointer; padding: .28rem; border-radius: 6px; line-height: 0; transition: color .12s;
    &:hover { color: rgba(247,242,234,.9); }
  }
  .map-modal-frame { width: 100%; height: 360px; border: none; display: block; filter: invert(92%) hue-rotate(180deg) brightness(.85) saturate(.85); }
  .map-modal-sub { font-size: .65rem; color: rgba(247,242,234,.38); margin-top: .15rem; }
  .map-modal-foot { padding: .55rem 1rem; border-top: 1px solid rgba(247,242,234,.07); display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
  .map-modal-foot-note { font-size: .6rem; color: rgba(247,242,234,.25); }
  .map-modal-gmaps { display: inline-flex; align-items: center; gap: .35rem; padding: .32rem .75rem; border-radius: 7px; background: #1a73e8; border: none; color: #fff; font-family: inherit; font-size: .68rem; font-weight: 700; cursor: pointer; text-decoration: none; transition: background .15s;
    &:hover { background: #1557b0; }
  }
}


/* ════════════════════════════════════════
   les-circuit-detail.html
   ════════════════════════════════════════ */
#page-les-circuit-detail {

  /* Group type picker */
  .group-type-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .45rem; margin-top: .5rem; }
  .gtype-btn {
    display: flex; flex-direction: column; align-items: center; gap: .22rem;
    padding: .65rem .3rem .6rem; background: rgba(247,242,234,.04);
    border: 1.5px solid rgba(247,242,234,.1); border-radius: 10px; cursor: pointer;
    transition: background .15s,border-color .15s; color: var(--parchment,#f7f2ea);
    font-family: inherit; text-align: center;
    &:hover { background: rgba(247,242,234,.09); border-color: rgba(247,242,234,.22); }
    &.on { background: rgba(28,181,109,.13); border-color: #1cb56d; }
  }
  .gtype-icon  { font-size: 1.35rem; line-height: 1; }
  .gtype-label { font-size: .62rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: rgba(247,242,234,.78); line-height: 1.2; }
  .gtype-price { font-size: .66rem; color: #4fd18f; font-weight: 500; }

  /* Count wrap */
  .group-count-wrap {
    display: none; align-items: center; justify-content: space-between; margin-top: .75rem;
    background: rgba(247,242,234,.05); border: 1px solid rgba(247,242,234,.1);
    border-radius: 9px; padding: .6rem 1rem;
    &.show { display: flex; }
  }
  .group-count-label { font-size: .78rem; color: rgba(247,242,234,.55); }
  .group-count-hint  { font-size: .65rem; color: rgba(247,242,234,.28); display: block; margin-top: .1rem; }
  .group-count-row   { display: flex; align-items: center; gap: .55rem; }

  /* Price summary */
  .group-price-summary {
    display: none; margin-top: .75rem; background: rgba(28,181,109,.07);
    border: 1px solid rgba(28,181,109,.18); border-radius: 10px; padding: .85rem 1rem;
    &.show { display: block; }
  }
  .gps-row   { display: flex; justify-content: space-between; align-items: center; font-size: .82rem; color: rgba(247,242,234,.6); padding: .18rem 0; }
  .gps-total { margin-top: .45rem; padding-top: .5rem; border-top: 1px solid rgba(28,181,109,.18); font-weight: 700; font-size: .96rem; color: #f7f2ea;
    span:last-child { color: #4fd18f; font-size: 1.08rem; }
  }

  /* Date range */
  .date-range-wrap { display: flex; align-items: center; gap: .4rem; margin-top: .4rem; width: 100%; box-sizing: border-box; }
  .date-field {
    flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .25rem; overflow: hidden;
    input[type=date] {
      width: 100%; min-width: 0; background: rgba(247,242,234,.05); border: 1.5px solid rgba(247,242,234,.12);
      border-radius: 8px; padding: .6rem .4rem; font-family: inherit; font-size: .78rem; color: #f7f2ea;
      cursor: pointer; box-sizing: border-box;
      &:focus { outline: none; border-color: rgba(28,181,109,.5); }
      &::-webkit-calendar-picker-indicator { filter: invert(.6); flex-shrink: 0; }
    }
  }
  .date-field-label  { font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(247,242,234,.38); font-weight: 500; }
  .date-range-arrow  { color: rgba(247,242,234,.3); font-size: .9rem; flex-shrink: 0; margin-top: 1.1rem; }
  .date-duration {
    display: none; margin-top: .6rem; background: rgba(226,193,107,.08); border: 1px solid rgba(226,193,107,.22);
    border-radius: 8px; padding: .5rem .85rem; font-size: .82rem; color: #e2c16b; font-weight: 600; text-align: center;
    &.show { display: block; }
  }

  /* Transport select */
  .transport-wrap { margin-top: .5rem; position: relative; }
  .transport-select {
    width: 100%; background: rgba(247,242,234,.05); border: 1.5px solid rgba(247,242,234,.12);
    border-radius: 9px; padding: .72rem 2.4rem .72rem .9rem; font-family: inherit;
    font-size: .84rem; color: #f7f2ea; cursor: pointer; appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(247,242,234,.45)' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right .85rem center;
    &:focus { outline: none; border-color: rgba(28,181,109,.5); }
    option { background: #151a24; color: #f7f2ea; }
  }
  .transport-suggest { font-size: .68rem; color: #4fd18f; margin-top: .35rem; min-height: 1.1em; letter-spacing: .02em; }

  /* Add-on items */
  .addon-item { display: flex; align-items: center; gap: .5rem; padding: .42rem .72rem; background: rgba(247,242,234,.04); border: 1px solid rgba(247,242,234,.1); border-radius: 8px; margin-bottom: .35rem; font-size: .8rem; }
  .addon-item-name   { flex: 1; color: #f7f2ea; }
  .addon-item-price  { color: #4fd18f; font-weight: 600; white-space: nowrap; }
  .addon-remove-btn  { background: none; border: none; color: rgba(247,242,234,.28); font-size: 1.1rem; cursor: pointer; padding: 0 .15rem; line-height: 1; flex-shrink: 0;
    &:hover { color: rgba(247,100,80,.75); }
  }
  .addon-empty  { font-size: .78rem; color: rgba(247,242,234,.28); margin: .3rem 0 .5rem; display: block; }
  .addon-browse { display: block; font-size: .71rem; color: rgba(247,242,234,.28); text-decoration: none; margin-top: .45rem; letter-spacing: .04em; transition: color .15s;
    &:hover { color: #4fd18f; }
  }

  /* Activity add-on section */
  .sec-addon-acts  { padding: 3.5rem 0 4rem; border-top: 1px solid rgba(247,242,234,.07); }
  .addon-acts-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .85rem; margin-top: 1.2rem; }
  .addon-card {
    background: rgba(247,242,234,.04); border: 1.5px solid rgba(247,242,234,.08); border-radius: 12px; overflow: hidden; transition: border-color .15s,background .15s;
    &:hover { border-color: rgba(247,242,234,.18); }
    &.added { border-color: rgba(28,181,109,.45); background: rgba(28,181,109,.05); }
    &:hover .addon-card-img img { transform: scale(1.06); }
    &.added .act-check { background: #1cb56d; border-color: #1cb56d; }
    &.added .act-check .ck-plus { display: none; }
    &.added .act-check .ck-tick { display: block; }
  }
  .addon-card-img { position: relative; height: 120px; overflow: hidden;
    img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
  }
  .addon-card-body  { padding: .65rem .85rem .8rem; }
  .addon-card-name  { font-size: .79rem; font-weight: 600; color: #f7f2ea; margin: 0 0 .18rem; line-height: 1.35; }
  .addon-card-price { font-size: .68rem; color: #4fd18f; margin: 0; }

  /* Circle checkbox */
  .act-check {
    position: absolute; top: 7px; right: 7px; z-index: 4; width: 26px; height: 26px;
    border-radius: 50%; background: rgba(15,20,30,.72); border: 2px solid rgba(247,242,234,.35);
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    transition: background .18s,border-color .18s,transform .12s;
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); padding: 0;
    &:hover { border-color: #4fd18f; background: rgba(28,181,109,.28); transform: scale(1.1); }
    .ck-plus { display: block; }
    .ck-tick  { display: none; }
  }

  /* Day-accordion itinerary */
  .itin-day-tabs  { display: none; }
  .itin-day-panel {
    display: block; border: 1.5px solid rgba(247,242,234,.08); border-radius: 12px; overflow: hidden; margin-bottom: .6rem;
    &:last-child { margin-bottom: 0; }
    &.closed .itin-day-chevron { transform: rotate(-90deg); }
    &.closed .itin-day-body { display: none; }
  }
  .itin-day-head {
    display: flex; align-items: center; justify-content: space-between; gap: .7rem;
    padding: .85rem 1rem; cursor: pointer; user-select: none;
    background: rgba(247,242,234,.03); transition: background .15s;
    &:hover { background: rgba(247,242,234,.07); }
  }
  .itin-day-num     { font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #4fd18f; background: rgba(28,181,109,.1); border: 1.5px solid rgba(28,181,109,.28); border-radius: 7px; padding: .3rem .85rem; }
  .itin-day-chevron { font-size: .75rem; color: rgba(247,242,234,.35); transition: transform .22s; line-height: 1; }
  .itin-day-body    { padding: 1.2rem 1rem; }

  .itin-period { margin-bottom: 1.8rem; &:last-child { margin-bottom: 0; } }
  .itin-period-head { display: flex; align-items: center; gap: .55rem; margin-bottom: 1rem; padding-bottom: .55rem; border-bottom: 1px solid rgba(247,242,234,.08); }
  .itin-period-icon  { line-height: 0; color: rgba(247,242,234,.38); }
  .itin-period-label { font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(247,242,234,.42); }
  .itin-period .itinerary { margin-top: 0; }
}


/* ════════════════════════════════════════
   Theme switch — dark / light
   ════════════════════════════════════════ */

/* Light mode variable overrides */
html[data-theme="light"] {
  --ink:  #f5f0e8;
  --ink2: #ede6d8;
  --parchment:  #1a1e2e;
  --parchment2: #2a2e40;
  --color-footer-bg:          #e0d9cc;
  --color-footer-link:        rgba(26,30,46,.42);
  --color-footer-link-hover:  var(--color-accent);
  --color-footer-desc:        rgba(26,30,46,.45);
  --color-footer-bot:         rgba(26,30,46,.18);
}

/* Nav overrides (hardcoded colours) */
html[data-theme="light"] nav.solid {
  background: rgba(245,240,232,.96);
  border-bottom-color: rgba(28,181,109,.18);
}
html[data-theme="light"] .dropdown-menu {
  background: rgba(248,244,237,.98);
  border-color: rgba(28,181,109,.18);
  box-shadow: 0 8px 24px rgba(26,30,46,.1);
}
html[data-theme="light"] .nav-links a { color: rgba(26,30,46,.55); }
html[data-theme="light"] .nav-cta       { color: rgba(26,30,46,.75); border-color: rgba(26,30,46,.3); }
html[data-theme="light"] .nav-cta:hover { background: #1a1e2e; color: #f5f0e8; border-color: #1a1e2e; }
html[data-theme="light"] .nav-links a:hover { color: var(--gold); }
html[data-theme="light"] .dropdown-menu a { color: rgba(26,30,46,.82); }
html[data-theme="light"] .dropdown-menu a:hover { background: rgba(28,181,109,.1); }
html[data-theme="light"] .burger span { background: var(--parchment); }

/* Theme toggle button */
.theme-toggle {
  width: 34px; height: 34px; border-radius: 50%;
  background: transparent; border: 1px solid rgba(247,242,234,.22);
  color: rgba(247,242,234,.6); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: border-color .3s, color .3s, background .3s;
  flex-shrink: 0; margin-left: .25rem; padding: 0; line-height: 0;
}
.theme-toggle:hover {
  border-color: var(--gold2); color: var(--gold2);
  background: rgba(28,181,109,.08);
}
.theme-toggle .icon-sun  { display: none; }
.theme-toggle .icon-moon { display: block; }

html[data-theme="light"] .theme-toggle {
  border-color: rgba(26,30,46,.22); color: rgba(26,30,46,.55);
}
html[data-theme="light"] .theme-toggle:hover {
  border-color: var(--gold); color: var(--gold); background: rgba(28,181,109,.08);
}
html[data-theme="light"] .theme-toggle .icon-sun  { display: block; }
html[data-theme="light"] .theme-toggle .icon-moon { display: none; }


/* ════════════════════════════════════════
   Light mode — text readability overrides
   ════════════════════════════════════════ */

/* ── Global: social icon default text (footer) ── */
html[data-theme="light"] .social-icon { color: rgba(26,30,46,.42); }

/* ── Shared detail pages: info strip ── */
html[data-theme="light"] #page-activities-detail .istrip-label,
html[data-theme="light"] #page-les-circuit-detail .istrip-label { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-activities-detail .istrip-val,
html[data-theme="light"] #page-les-circuit-detail .istrip-val   { color: #1a1e2e; }

/* ── Shared detail pages: hero rating ── */
html[data-theme="light"] #page-activities-detail .hero-rating,
html[data-theme="light"] #page-les-circuit-detail .hero-rating { color: rgba(26,30,46,.5); }
html[data-theme="light"] #page-activities-detail .hero-rating strong,
html[data-theme="light"] #page-les-circuit-detail .hero-rating strong { color: #1a1e2e; }

/* ── Shared detail pages: overview & highlights ── */
html[data-theme="light"] #page-activities-detail .overview-text p,
html[data-theme="light"] #page-les-circuit-detail .overview-text p { color: rgba(26,30,46,.62); }
html[data-theme="light"] #page-activities-detail .highlights-list li,
html[data-theme="light"] #page-les-circuit-detail .highlights-list li { color: rgba(26,30,46,.65); }

/* ── Shared detail pages: itinerary steps ── */
html[data-theme="light"] #page-activities-detail .itin-title,
html[data-theme="light"] #page-les-circuit-detail .itin-title { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .itin-desc,
html[data-theme="light"] #page-les-circuit-detail .itin-desc  { color: rgba(26,30,46,.5); }

/* ── Shared detail pages: incl/excl list ── */
html[data-theme="light"] #page-activities-detail .incl-list li,
html[data-theme="light"] #page-les-circuit-detail .incl-list li { color: rgba(26,30,46,.58); }

/* ── Shared detail pages: meet card ── */
html[data-theme="light"] #page-activities-detail .meet-body h4,
html[data-theme="light"] #page-les-circuit-detail .meet-body h4 { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .meet-body p,
html[data-theme="light"] #page-les-circuit-detail .meet-body p  { color: rgba(26,30,46,.52); }

/* ── Shared detail pages: review cards ── */
html[data-theme="light"] #page-activities-detail .reviewer-avatar,
html[data-theme="light"] #page-les-circuit-detail .reviewer-avatar    { color: #1a1e2e; background: rgba(26,30,46,.1); border-color: rgba(26,30,46,.2); }
html[data-theme="light"] #page-activities-detail .reviewer-info h5,
html[data-theme="light"] #page-les-circuit-detail .reviewer-info h5   { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .reviewer-info span,
html[data-theme="light"] #page-les-circuit-detail .reviewer-info span { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-activities-detail .review-text,
html[data-theme="light"] #page-les-circuit-detail .review-text        { color: rgba(26,30,46,.55); }

/* ── Shared detail pages: facts card ── */
html[data-theme="light"] #page-activities-detail .fact-key,
html[data-theme="light"] #page-les-circuit-detail .fact-key { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-activities-detail .fact-val,
html[data-theme="light"] #page-les-circuit-detail .fact-val { color: #1a1e2e; }

/* ── Shared detail pages: guide card ── */
html[data-theme="light"] #page-activities-detail .guide-body h4,
html[data-theme="light"] #page-les-circuit-detail .guide-body h4 { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .guide-body p,
html[data-theme="light"] #page-les-circuit-detail .guide-body p  { color: rgba(26,30,46,.5); }
html[data-theme="light"] #page-activities-detail .guide-card,
html[data-theme="light"] #page-les-circuit-detail .guide-card      { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }
html[data-theme="light"] #page-activities-detail .guide-info h5,
html[data-theme="light"] #page-les-circuit-detail .guide-info h5   { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .guide-info span,
html[data-theme="light"] #page-les-circuit-detail .guide-info span { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-activities-detail .guide-rating,
html[data-theme="light"] #page-les-circuit-detail .guide-rating    { color: rgba(26,30,46,.55); }

/* ── Shared detail pages: booking card ── */
html[data-theme="light"] #page-activities-detail .book-price-from,
html[data-theme="light"] #page-les-circuit-detail .book-price-from,
html[data-theme="light"] #page-activities-detail .book-price-per,
html[data-theme="light"] #page-les-circuit-detail .book-price-per { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-activities-detail .book-rating-row,
html[data-theme="light"] #page-les-circuit-detail .book-rating-row { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-activities-detail .book-rating-row strong,
html[data-theme="light"] #page-les-circuit-detail .book-rating-row strong { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .bform-group label,
html[data-theme="light"] #page-les-circuit-detail .bform-group label { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-activities-detail .bform-group input,
html[data-theme="light"] #page-les-circuit-detail .bform-group input,
html[data-theme="light"] #page-activities-detail .bform-group select,
html[data-theme="light"] #page-les-circuit-detail .bform-group select { color: #1a1e2e; background: rgba(26,30,46,.05); }
html[data-theme="light"] #page-activities-detail .bform-group input::placeholder,
html[data-theme="light"] #page-les-circuit-detail .bform-group input::placeholder { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-activities-detail .guest-type,
html[data-theme="light"] #page-les-circuit-detail .guest-type { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .guest-age-hint,
html[data-theme="light"] #page-les-circuit-detail .guest-age-hint  { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-activities-detail .gs-count,
html[data-theme="light"] #page-les-circuit-detail .gs-count         { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .gs-btn,
html[data-theme="light"] #page-les-circuit-detail .gs-btn            { color: rgba(26,30,46,.7); border-color: rgba(26,30,46,.25); }
html[data-theme="light"] #page-activities-detail .gs-btn:hover,
html[data-theme="light"] #page-les-circuit-detail .gs-btn:hover      { background: rgba(26,30,46,.08); border-color: rgba(26,30,46,.4); color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .book-note,
html[data-theme="light"] #page-les-circuit-detail .book-note { color: rgba(26,30,46,.35); }

/* ── Shared detail pages: related cards ── */
html[data-theme="light"] #page-activities-detail .rel-body h3,
html[data-theme="light"] #page-les-circuit-detail .rel-body h3 { color: #1a1e2e; }
html[data-theme="light"] #page-activities-detail .rel-body p,
html[data-theme="light"] #page-les-circuit-detail .rel-body p  { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-activities-detail .rel-link,
html[data-theme="light"] #page-les-circuit-detail .rel-link    { color: rgba(26,30,46,.42); }

/* ── Les-circuit-detail: booking form specifics ── */
html[data-theme="light"] #page-les-circuit-detail .gtype-label       { color: rgba(26,30,46,.78); }
html[data-theme="light"] #page-les-circuit-detail .group-count-label { color: rgba(26,30,46,.58); }
html[data-theme="light"] #page-les-circuit-detail .group-count-hint  { color: rgba(26,30,46,.32); }
html[data-theme="light"] #page-les-circuit-detail .gps-row           { color: rgba(26,30,46,.62); }
html[data-theme="light"] #page-les-circuit-detail .gps-total         { color: #1a1e2e; }
html[data-theme="light"] #page-les-circuit-detail .date-field input[type=date] { color: #1a1e2e; background: rgba(26,30,46,.05); }
html[data-theme="light"] #page-les-circuit-detail .transport-select  { color: #1a1e2e; background: rgba(26,30,46,.05); }
html[data-theme="light"] #page-les-circuit-detail .addon-item-name   { color: #1a1e2e; }
html[data-theme="light"] #page-les-circuit-detail .addon-empty       { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-les-circuit-detail .addon-browse      { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-les-circuit-detail .addon-card-name   { color: #1a1e2e; }
html[data-theme="light"] #page-les-circuit-detail .itin-period-label { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-les-circuit-detail .itin-day-chevron  { color: rgba(26,30,46,.4); }

/* ── Home page body-level text ── */
html[data-theme="light"] #page-home .sp     { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-home .alist li { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-home .tab    { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-home .stat-l { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-home .bt     { color: rgba(26,30,46,.45); }

/* ── Home page tips section ── */
html[data-theme="light"] #page-home .tp  { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-home .thl { color: rgba(26,30,46,.58); background: rgba(26,30,46,.06); border-left-color: var(--gold); }

/* ── Home page weather section ── */
html[data-theme="light"] #page-home .wmn { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-home .wr  { color: rgba(26,30,46,.38); }

/* ── Home page map section ── */
html[data-theme="light"] #page-home .poi-n   { color: rgba(26,30,46,.65); }
html[data-theme="light"] #page-home .poi-d   { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-home .li      { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-home .map-lbl small { color: rgba(26,30,46,.32); }

/* ── Home page map section ── */
/* Keep .map-vis dark so the SVG map (designed for dark bg) stays readable */
html[data-theme="light"] #page-home .map-vis      { background: #1a1e2e; }
/* Sidebar on light bg: darken dividers and hover state */
html[data-theme="light"] #page-home .map-side     { border-left-color: rgba(26,30,46,.12); }
html[data-theme="light"] #page-home .poi-item     { border-bottom-color: rgba(26,30,46,.08); }
html[data-theme="light"] #page-home .poi-item:hover { background: rgba(26,30,46,.05); }
html[data-theme="light"] #page-home .poi-top      { background: rgba(26,30,46,.04); }
html[data-theme="light"] #page-home .leg          { border-top-color: rgba(26,30,46,.1); }

/* ── Home page newsletter section ── */
html[data-theme="light"] #page-home .nl-p { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-home .nl-inp::placeholder { color: rgba(26,30,46,.38); }

/* ── Home page instagram section (on --ink2 bg = light) ── */
html[data-theme="light"] #page-home .insta-handle    { color: #1a1e2e; }
html[data-theme="light"] #page-home .insta-followers { color: rgba(26,30,46,.48); }

/* ── Home page reviews section (on --ink2 bg = light) ── */
html[data-theme="light"] #page-home .ta-score     { color: #1a1e2e; }
html[data-theme="light"] #page-home .ta-count     { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-home .rv-card-title { color: #1a1e2e; }
html[data-theme="light"] #page-home .rv-user-name  { color: #1a1e2e; }
html[data-theme="light"] #page-home .rv-card       { color: rgba(26,30,46,.58); }
html[data-theme="light"] #page-home .rv-card-text  { color: rgba(26,30,46,.62); }
html[data-theme="light"] #page-home .rv-user-meta  { color: rgba(26,30,46,.42); }

/* ── Home page sec-activity (--parchment bg becomes dark in light mode → keep light text) ── */
html[data-theme="light"] #page-home .activity-sub { color: rgba(247,242,234,.6); }
html[data-theme="light"] #page-home .adesc2       { color: rgba(247,242,234,.62); }

/* ── About page body text ── */
html[data-theme="light"] #page-about .sh2-ab   { color: #1a1e2e; }
html[data-theme="light"] #page-about .story-body p { color: rgba(26,30,46,.55); }
html[data-theme="light"] #page-about .sp-ab    { color: rgba(26,30,46,.52); }

/* ── Les-circuit listing page: filter sidebar & cards ── */
html[data-theme="light"] #page-les-circuit .hero-sub-tp { color: rgba(26,30,46,.55); }
html[data-theme="light"] #page-les-circuit .fs-chevron  { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-les-circuit .cb-label    { color: rgba(26,30,46,.65); }
html[data-theme="light"] #page-les-circuit .cb-count    { color: rgba(26,30,46,.38); }

/* ── Activities listing page ── */
html[data-theme="light"] #page-activities .hero-sub-tp  { color: rgba(26,30,46,.55); }

/* ── Information detail page ── */
html[data-theme="light"] #page-information-detail .overview-text p    { color: rgba(26,30,46,.62); }
html[data-theme="light"] #page-information-detail .highlights-list li { color: rgba(26,30,46,.65); }
html[data-theme="light"] #page-information-detail .itin-title { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .itin-desc  { color: rgba(26,30,46,.5); }
html[data-theme="light"] #page-information-detail .fact-key   { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-information-detail .fact-val   { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .rel-body h3 { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .rel-body p  { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-information-detail .rel-link    { color: rgba(26,30,46,.42); }

/* ── Customize tour page card/panel text ── */
html[data-theme="light"] #page-customize-tour .itnb-section-label { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-customize-tour .itnb-panel-title   { color: rgba(26,30,46,.7); }
html[data-theme="light"] #page-customize-tour .itnb-act-name      { color: rgba(26,30,46,.9); }
html[data-theme="light"] #page-customize-tour .itnb-act-dur       { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-customize-tour .itnb-item-name     { color: rgba(26,30,46,.85); }
html[data-theme="light"] #page-customize-tour .itnb-item-dur      { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-customize-tour .itnb-empty         { color: rgba(26,30,46,.28); }
html[data-theme="light"] #page-customize-tour .itnb-empty-day     { color: rgba(26,30,46,.22); }
html[data-theme="light"] #page-customize-tour .itnb-day-group-count { color: rgba(26,30,46,.32); }
html[data-theme="light"] #page-customize-tour .itnb-summary       { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-customize-tour .itnb-prov-hint     { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-customize-tour .prov-card-name     { color: rgba(26,30,46,.85); }
html[data-theme="light"] #page-customize-tour .prov-card-region   { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-customize-tour .prov-places-pname  { color: rgba(26,30,46,.88); }
html[data-theme="light"] #page-customize-tour .prov-places-label  { color: rgba(26,30,46,.32); }
html[data-theme="light"] #page-customize-tour .prov-place-name    { color: rgba(26,30,46,.82); }
html[data-theme="light"] #page-customize-tour .prov-place-desc    { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-customize-tour .itnb-editor-body   { color: rgba(26,30,46,.8); }
html[data-theme="light"] #page-customize-tour .itnb-tb-btn        { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-customize-tour .itnb-panel { background: rgba(26,30,46,.03); border-color: rgba(26,30,46,.1); }
html[data-theme="light"] #page-customize-tour .prov-places-wrap   { border-color: rgba(26,30,46,.1); }
html[data-theme="light"] #page-customize-tour .itnb-item { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.08); }
html[data-theme="light"] #page-customize-tour .prov-place-dot { border-color: rgba(26,30,46,.2); background: rgba(26,30,46,.05); }
html[data-theme="light"] #page-customize-tour .itnb-editor { border-color: rgba(26,30,46,.12); }
html[data-theme="light"] #page-customize-tour .itnb-editor-toolbar { background: rgba(26,30,46,.04); border-bottom-color: rgba(26,30,46,.08); }
html[data-theme="light"] #page-customize-tour .itnb-btn-reset { border-color: rgba(26,30,46,.15); color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-customize-tour .day-btn { border-color: rgba(26,30,46,.15); color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-customize-tour .itnb-ftab { border-color: rgba(26,30,46,.12); color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-customize-tour .itnb-ftab.on { background: rgba(26,30,46,.08); border-color: rgba(26,30,46,.28); color: rgba(26,30,46,.9); }
html[data-theme="light"] #page-customize-tour .itnb-act { border-color: rgba(26,30,46,.1); background: rgba(26,30,46,.03); }
html[data-theme="light"] #page-customize-tour .itnb-act:hover { border-color: rgba(26,30,46,.22); background: rgba(26,30,46,.07); }
html[data-theme="light"] #page-customize-tour .prov-card { border-color: rgba(26,30,46,.1); background: rgba(26,30,46,.03); }
html[data-theme="light"] #page-customize-tour .prov-card:hover { border-color: rgba(26,30,46,.22); background: rgba(26,30,46,.07); }
html[data-theme="light"] #page-customize-tour .prov-place-add { border-color: rgba(26,30,46,.18); color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-customize-tour .prov-place-pin { border-color: rgba(26,30,46,.18); color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-customize-tour .prov-place-pin:hover { border-color: rgba(66,153,225,.5); color: #2b6cb0; background: rgba(66,153,225,.1); }
html[data-theme="light"] #page-customize-tour .itnb-pday-tab { border-color: rgba(26,30,46,.12); color: rgba(26,30,46,.4); }

/* ════════════════════════════════════════════════════════════════════
   Light mode — text readability overrides — ROUND 2
   Fixes remaining white-on-light and uncovered elements across all pages
   ════════════════════════════════════════════════════════════════════ */

/* ── #page-about — correct story copy class (Round 1 used wrong name) ── */
html[data-theme="light"] #page-about .story-copy p { color: rgba(26,30,46,.58); }

/* ── #page-about — values & team cards ── */
html[data-theme="light"] #page-about .vcard h3      { color: #1a1e2e; }
html[data-theme="light"] #page-about .vcard p        { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-about .vcard          { background: rgba(26,30,46,.05); border-color: rgba(26,30,46,.12); }
html[data-theme="light"] #page-about .tcard-ab-body h4 { color: #1a1e2e; }
html[data-theme="light"] #page-about .tcard-ab-body p  { color: rgba(26,30,46,.5); }
html[data-theme="light"] #page-about .tcard-ab         { border-color: rgba(26,30,46,.12); }

/* ── #page-about — stats bar & CTA band ── */
html[data-theme="light"] #page-about .stat-ab-l   { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-about .cta-band h3    { color: #1a1e2e; }
html[data-theme="light"] #page-about .cta-band p     { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-about .btn-line-ab    { color: rgba(26,30,46,.65); border-color: rgba(26,30,46,.28); }
html[data-theme="light"] #page-about .btn-line-ab:hover { background: #1a1e2e; color: #f5f0e8; border-color: #1a1e2e; }

/* ── #page-contact — section heading ── */
html[data-theme="light"] #page-contact .sh2-ct          { color: #1a1e2e; }

/* ── #page-contact — info cards ── */
html[data-theme="light"] #page-contact .info-card-body p { color: rgba(26,30,46,.65); }
html[data-theme="light"] #page-contact .resp-note        { color: rgba(26,30,46,.55); }

/* ── #page-contact — contact form (CRITICAL: form fields invisible without this) ── */
html[data-theme="light"] #page-contact .form-panel h3      { color: #1a1e2e; }
html[data-theme="light"] #page-contact .form-panel .form-sub { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-contact .form-group label    { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-contact .form-group input,
html[data-theme="light"] #page-contact .form-group select,
html[data-theme="light"] #page-contact .form-group textarea { color: #1a1e2e; background: rgba(26,30,46,.05); border-color: rgba(26,30,46,.18); }
html[data-theme="light"] #page-contact .form-group input::placeholder,
html[data-theme="light"] #page-contact .form-group textarea::placeholder { color: rgba(26,30,46,.38); }

/* ── #page-contact — FAQ ── */
html[data-theme="light"] #page-contact .faq-q { color: #1a1e2e; }
html[data-theme="light"] #page-contact .faq-a { color: rgba(26,30,46,.55); }
html[data-theme="light"] #page-contact .faq-item { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ── #page-information — section header & filter tabs ── */
html[data-theme="light"] #page-information .blog-h2   { color: #1a1e2e; }
html[data-theme="light"] #page-information .blog-lead { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-information .ftab      { color: rgba(26,30,46,.52); }

/* ── #page-information — featured post ── */
html[data-theme="light"] #page-information .fp-meta     { color: rgba(26,30,46,.4); }
html[data-theme="light"] #page-information .fp-title    { color: #1a1e2e; }
html[data-theme="light"] #page-information .fp-excerpt  { color: rgba(26,30,46,.52); }

/* ── #page-information — blog cards ── */
html[data-theme="light"] #page-information .bc-title   { color: #1a1e2e; }
html[data-theme="light"] #page-information .bc-excerpt { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-information .bc-date    { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-information .bc-author  { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-information .blog-card  { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ── #page-information-detail — article body (CRITICAL) ── */
html[data-theme="light"] #page-information-detail .art-body p  { color: rgba(26,30,46,.65); }
html[data-theme="light"] #page-information-detail .art-body h2 { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .art-body h3 { color: #1a1e2e; }

/* ── #page-information-detail — blockquote ── */
html[data-theme="light"] #page-information-detail .art-quote p    { color: rgba(26,30,46,.72); }
html[data-theme="light"] #page-information-detail .art-quote cite { color: rgba(26,30,46,.42); }

/* ── #page-information-detail — captions, callout, tags ── */
html[data-theme="light"] #page-information-detail .art-img-caption { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-information-detail .art-callout ul li { color: rgba(26,30,46,.62); }
html[data-theme="light"] #page-information-detail .month-desc      { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-information-detail .art-tag         { color: rgba(26,30,46,.5); background: rgba(26,30,46,.05); border-color: rgba(26,30,46,.14); }

/* ── #page-information-detail — author bio ── */
html[data-theme="light"] #page-information-detail .author-bio-text h4 { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .author-bio-text p  { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-information-detail .art-author-bio      { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ── #page-information-detail — prev/next nav ── */
html[data-theme="light"] #page-information-detail .art-nav-dir   { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-information-detail .art-nav-title { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .art-nav-card  { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ── #page-information-detail — sidebar TOC, quick facts, share ── */
html[data-theme="light"] #page-information-detail .toc-list a  { color: rgba(26,30,46,.48); }
html[data-theme="light"] #page-information-detail .qf-label    { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-information-detail .qf-val      { color: rgba(26,30,46,.72); }
html[data-theme="light"] #page-information-detail .share-btn   { color: rgba(26,30,46,.5); background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.14); }
html[data-theme="light"] #page-information-detail .back-link   { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-information-detail .sidebar-card { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ── #page-information-detail — related articles section ── */
html[data-theme="light"] #page-information-detail .related-h2  { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .rel-date    { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-information-detail .rel-title   { color: #1a1e2e; }
html[data-theme="light"] #page-information-detail .rel-card    { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ── #page-activities — section headings & filter tabs ── */
html[data-theme="light"] #page-activities .sh2-td { color: #1a1e2e; }
html[data-theme="light"] #page-activities .sp-td  { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-activities .ftab   { color: rgba(26,30,46,.52); }

/* ── #page-activities — activity cards ── */
html[data-theme="light"] #page-activities .act-name      { color: #1a1e2e; }
html[data-theme="light"] #page-activities .act-desc      { color: rgba(26,30,46,.52); }
html[data-theme="light"] #page-activities .act-meta span { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-activities .act-price small { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-activities .act-card      { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }
html[data-theme="light"] #page-activities .act-btn       { color: rgba(26,30,46,.65); border-color: rgba(26,30,46,.28); }
html[data-theme="light"] #page-activities .act-btn:hover       { background: #1a1e2e; color: #f5f0e8; border-color: #1a1e2e; }
html[data-theme="light"] #page-activities .btn-line-td        { color: rgba(26,30,46,.65); border-color: rgba(26,30,46,.28); }
html[data-theme="light"] #page-activities .btn-line-td:hover  { background: #1a1e2e; color: #f5f0e8; border-color: #1a1e2e; }

/* ── #page-activities — highlights & CTA band ── */
html[data-theme="light"] #page-activities .hl-card h4 { color: #1a1e2e; }
html[data-theme="light"] #page-activities .hl-card p  { color: rgba(26,30,46,.5); }
html[data-theme="light"] #page-activities .hl-card    { background: rgba(26,30,46,.05); border-color: rgba(26,30,46,.12); }
html[data-theme="light"] #page-activities .cta-band h3 { color: #1a1e2e; }
html[data-theme="light"] #page-activities .cta-band p  { color: rgba(26,30,46,.52); }

/* ── #page-les-circuit — filter sidebar form fields ── */
html[data-theme="light"] #page-les-circuit .search-input        { color: #1a1e2e; background: rgba(26,30,46,.05); border-color: rgba(26,30,46,.18); }
html[data-theme="light"] #page-les-circuit .search-input::placeholder { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-les-circuit .price-field label   { color: rgba(26,30,46,.38); }
html[data-theme="light"] #page-les-circuit .price-field input   { color: #1a1e2e; background: rgba(26,30,46,.05); border-color: rgba(26,30,46,.18); }
html[data-theme="light"] #page-les-circuit .filter-select       { color: #1a1e2e; background-color: rgba(26,30,46,.05); border-color: rgba(26,30,46,.18); }
html[data-theme="light"] #page-les-circuit .star-row-label      { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-les-circuit .clear-btn           { color: rgba(26,30,46,.42); border-color: rgba(26,30,46,.15); }
html[data-theme="light"] #page-les-circuit .fs-panel            { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ── #page-les-circuit — results area & sort tabs ── */
html[data-theme="light"] #page-les-circuit .results-count        { color: rgba(26,30,46,.45); }
html[data-theme="light"] #page-les-circuit .results-count strong { color: #1a1e2e; }
html[data-theme="light"] #page-les-circuit .sort-tab             { color: rgba(26,30,46,.5); }
html[data-theme="light"] #page-les-circuit .vt-btn               { color: rgba(26,30,46,.35); }
html[data-theme="light"] #page-les-circuit .no-results-msg       { color: rgba(26,30,46,.35); }

/* ── #page-les-circuit — circuit grid cards ── */
html[data-theme="light"] #page-les-circuit .gc-title     { color: #1a1e2e; }
html[data-theme="light"] #page-les-circuit .gc-desc      { color: rgba(26,30,46,.5); }
html[data-theme="light"] #page-les-circuit .gc-meta-item { color: rgba(26,30,46,.42); }
html[data-theme="light"] #page-les-circuit .gc-price span { color: rgba(26,30,46,.4); }
html[data-theme="light"] #page-les-circuit .gc-chips span { color: rgba(26,30,46,.7); background: rgba(26,30,46,.08); }
html[data-theme="light"] #page-les-circuit .gc-foot       { border-top-color: rgba(26,30,46,.1); }
html[data-theme="light"] #page-les-circuit .gc-btn        { color: rgba(26,30,46,.65); border-color: rgba(26,30,46,.25); }
html[data-theme="light"] #page-les-circuit .gc-btn:hover  { background: #1a1e2e; color: #f5f0e8; border-color: #1a1e2e; }
html[data-theme="light"] #page-les-circuit .gc            { background: rgba(26,30,46,.04); border-color: rgba(26,30,46,.12); }

/* ════════════════════════════════════════════════════════════════════
   Typography scale — description / paragraph text size boost
   Base html raised 16px → 17px; these rules further boost body copy
   ════════════════════════════════════════════════════════════════════ */

/* ── Global footer description ── */
.fdesc2 { font-size: .9rem; }

/* ── Home page — hero & section body copy ── */
#page-home .sp            { font-size: 1.03rem; }
#page-home .hero-sub      { font-size: 1.07rem; }
#page-home .alist li      { font-size: .96rem; }
#page-home .adesc         { font-size: .9rem; }
#page-home .adesc2        { font-size: .93rem; }
#page-home .activity-sub  { font-size: 1.03rem; }
#page-home .nl-p          { font-size: .96rem; }
#page-home .rv-card-text  { font-size: 1.02rem; }
#page-home .rv-user-meta  { font-size: .87rem; }
#page-home .thl           { font-size: .84rem; }

/* ── About page ── */
#page-about .story-copy p     { font-size: 1.02rem; }
#page-about .vcard p          { font-size: .98rem; }
#page-about .tcard-ab-body p  { font-size: .96rem; }
#page-about .cta-band p       { font-size: 1rem; }

/* ── Contact page ── */
#page-contact .info-card-body p { font-size: 1rem; }
#page-contact .resp-note        { font-size: .94rem; }
#page-contact .form-panel .form-sub { font-size: .98rem; }
#page-contact .faq-a            { font-size: .98rem; }

/* ── Information listing page ── */
#page-information .blog-lead   { font-size: 1rem; }
#page-information .fp-excerpt  { font-size: .98rem; }
#page-information .bc-excerpt  { font-size: .94rem; }

/* ── Information detail page — article body ── */
#page-information-detail .art-body p { font-size: 1.06rem; }

/* ── Activities listing page ── */
#page-activities .sp-td       { font-size: 1.02rem; }
#page-activities .act-desc    { font-size: .98rem; }
#page-activities .hl-card p   { font-size: .94rem; }
#page-activities .cta-band p  { font-size: 1rem; }

/* ── Activities-detail & Les-circuit-detail (shared) — body content ── */
#page-activities-detail .overview-text p,
#page-les-circuit-detail .overview-text p  { font-size: 1.05rem; }
#page-activities-detail .highlights-list li,
#page-les-circuit-detail .highlights-list li { font-size: 1.02rem; }
#page-activities-detail .itin-desc,
#page-les-circuit-detail .itin-desc          { font-size: .96rem; }
#page-activities-detail .review-text,
#page-les-circuit-detail .review-text        { font-size: .98rem; }
#page-activities-detail .meet-body p,
#page-les-circuit-detail .meet-body p        { font-size: .98rem; }

/* ── Les-circuit listing page — cards ── */
#page-les-circuit .gc-desc  { font-size: .92rem; }
