/* "Plan your trip" — the destination guide on country pages.
   Brand: navy #093e59, gold #e8b341. No libraries; motion is CSS + a little JS
   and switches off for visitors who ask for reduced motion. */
.guide { --navy:#093e59; --navy2:#0d5379; --gold:#e8b341; --ink:#1d2b34; background:linear-gradient(180deg,#f7fafc 0%,#fff 100%); }
.guide-head { margin-bottom:1.6rem; }
.guide-eyebrow { display:inline-flex; align-items:center; gap:.4rem; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--navy); background:rgba(232,179,65,.22); padding:.3rem .7rem; border-radius:99px; margin-bottom:.6rem; }

/* ---- tiles ---- */
.guide-tiles { display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem; }
@media (min-width:768px)  { .guide-tiles { grid-template-columns:repeat(3,1fr); } }
@media (min-width:1200px) { .guide-tiles { grid-template-columns:repeat(4,1fr); } }
.guide-tile { position:relative; background:#fff; border:1px solid #e3ebf0; border-radius:1rem; padding:1rem 1rem .9rem; box-shadow:0 1px 2px rgba(9,62,89,.05); transition:transform .25s ease, box-shadow .25s ease, border-color .25s; overflow:hidden; }
.guide-tile:hover { transform:translateY(-3px); box-shadow:0 .9rem 1.6rem rgba(9,62,89,.12); border-color:rgba(232,179,65,.7); }
.guide-tile::after { content:""; position:absolute; inset:auto -30% -55% auto; width:70%; aspect-ratio:1; border-radius:50%; background:radial-gradient(closest-side,rgba(232,179,65,.18),transparent); pointer-events:none; }
.guide-tile__icon { width:2.3rem; height:2.3rem; display:grid; place-items:center; border-radius:.7rem; background:var(--navy); color:var(--gold); font-size:1.15rem; margin-bottom:.55rem; }
.guide-tile__label { font-size:.72rem; letter-spacing:.09em; text-transform:uppercase; color:#6a7a86; font-weight:600; }
.guide-tile__big { font-size:2rem; line-height:1.1; font-weight:800; color:var(--navy); font-variant-numeric:tabular-nums; }
.guide-tile__big small { font-size:.9rem; font-weight:600; color:#6a7a86; margin-left:.2rem; }
.guide-tile__big--sm { font-size:1.35rem; }
.guide-tile__sub { font-size:.85rem; color:#4a5760; margin-top:.1rem; }
.guide-tile__sub--lead { font-size:1rem; font-weight:600; color:var(--ink); line-height:1.3; }
.guide-tile--flight .guide-tile__icon i { display:inline-block; animation:g-fly 3.6s ease-in-out infinite; }
@keyframes g-fly { 0%,100% { transform:translate(-2px,2px) rotate(0); } 50% { transform:translate(3px,-3px) rotate(-8deg); } }
.guide-tile--money:hover .guide-tile__icon { animation:g-flip .8s ease; }
@keyframes g-flip { 50% { transform:rotateY(180deg) scale(1.08); } 100% { transform:rotateY(360deg); } }
.guide-tile--sos .guide-tile__icon { animation:g-pulse 2.4s ease-out infinite; }
@keyframes g-pulse { 0% { box-shadow:0 0 0 0 rgba(232,179,65,.55); } 70%,100% { box-shadow:0 0 0 .7rem rgba(232,179,65,0); } }

/* two analogue clocks under the time-difference tile */
.guide-clocks { display:flex; gap:1rem; margin-top:.6rem; }
.guide-clocks > div { display:flex; flex-direction:column; align-items:center; font-size:.68rem; color:#6a7a86; }
.gclock { width:2.5rem; height:2.5rem; }
.gclock circle { fill:#fff; stroke:var(--navy); stroke-width:2; }
.gclock line { stroke:var(--navy); stroke-linecap:round; transform-origin:20px 20px; transition:transform .5s cubic-bezier(.4,2,.5,1); }
.gclock .h { stroke-width:2.6; } .gclock .m { stroke-width:1.8; stroke:var(--gold); }

/* road-side arrows */
.guide-road { display:inline-flex; gap:2px; margin-right:.35rem; vertical-align:middle; }
.guide-road i { width:.45rem; height:.45rem; border-top:2px solid var(--gold); border-right:2px solid var(--gold); transform:rotate(45deg); animation:g-chev 1.4s infinite; opacity:.25; }
.guide-road--left i { transform:rotate(-135deg); }
.guide-road i:nth-child(2) { animation-delay:.18s; } .guide-road i:nth-child(3) { animation-delay:.36s; }
.guide-road--left i:nth-child(1) { animation-delay:.36s; } .guide-road--left i:nth-child(3) { animation-delay:0s; }
@keyframes g-chev { 0%,100% { opacity:.2; } 40% { opacity:1; } }

/* ---- cards ---- */
.guide-card { background:#fff; border:1px solid #e3ebf0; border-radius:1.1rem; padding:1.3rem 1.3rem 1.1rem; box-shadow:0 1px 3px rgba(9,62,89,.06); }
.guide-card--dark { background:linear-gradient(145deg,var(--navy) 0%,var(--navy2) 100%); color:#fff; border-color:transparent; }
.guide-card--dark .text-primary, .guide-card--dark h3 i { color:var(--gold) !important; }

/* ---- best-time ribbon ---- */
.guide-ribbon { display:grid; grid-template-columns:repeat(12,1fr); gap:.35rem; align-items:end; height:9.5rem; padding:.2rem 0 0; }
.guide-month { display:flex; flex-direction:column; justify-content:flex-end; align-items:center; height:100%; position:relative; }
.guide-month__bar { width:100%; border-radius:.5rem .5rem .25rem .25rem; height:0; transition:height .8s cubic-bezier(.2,.9,.3,1.1); transition-delay:calc(var(--i) * 45ms); }
.guide-month--good .guide-month__bar { background:linear-gradient(180deg,#f3c964,var(--gold)); }
.guide-month--ok .guide-month__bar { background:linear-gradient(180deg,#8fb3c6,#6f9bb2); }
.guide-month--avoid .guide-month__bar { background:repeating-linear-gradient(135deg,#dde5ea 0 5px,#eef2f5 5px 10px); }
.guide.is-in .guide-month--good .guide-month__bar { height:100%; }
.guide.is-in .guide-month--ok .guide-month__bar { height:62%; }
.guide.is-in .guide-month--avoid .guide-month__bar { height:26%; }
.guide-month__name { font-size:.72rem; font-weight:700; color:#6a7a86; margin-top:.35rem; }
.guide-month.is-now .guide-month__name { color:var(--navy); }
.guide-month.is-now::before { content:"\ea4a"; font-family:remixicon; position:absolute; top:-.9rem; color:var(--navy); font-size:.95rem; animation:g-bob 1.6s ease-in-out infinite; }
@keyframes g-bob { 50% { transform:translateY(3px); } }
.guide-legend { display:flex; flex-wrap:wrap; gap:.4rem 1rem; margin-top:.9rem; color:#4a5760; }
.guide-legend .lg { display:inline-block; width:.8rem; height:.8rem; border-radius:.25rem; margin-right:.3rem; vertical-align:-1px; }
.lg--good { background:var(--gold); } .lg--ok { background:#6f9bb2; } .lg--avoid { background:repeating-linear-gradient(135deg,#cdd8df 0 3px,#eef2f5 3px 6px); }

/* ---- route map ---- */
.guide-pills { display:inline-flex; background:rgba(255,255,255,.12); border-radius:99px; padding:.2rem; }
.guide-pill { border:0; background:transparent; color:#cfe0ea; font-size:.8rem; font-weight:600; padding:.3rem .8rem; border-radius:99px; transition:background .2s,color .2s; }
.guide-pill:hover { color:#fff; }
.guide-pill.is-on { background:var(--gold); color:var(--navy); }
.guide-map { width:100%; height:auto; display:block; margin:.4rem 0 .2rem; }
.guide-path { fill:none; stroke-width:2.5; stroke-linecap:round; }
.guide-path--base { stroke:rgba(255,255,255,.18); }
.guide-path--fly { stroke:var(--gold); stroke-dasharray:6 9; animation:g-dash 1.4s linear infinite; }
@keyframes g-dash { to { stroke-dashoffset:-30; } }
.guide-node circle { fill:#fff; stroke:var(--gold); stroke-width:3; }
.guide-node--end circle:first-child { fill:var(--gold); stroke:#fff; }
.guide-node .pulse { fill:none; stroke:var(--gold); stroke-width:2; transform-box:fill-box; transform-origin:center; animation:g-ring 2.4s ease-out infinite; animation-delay:calc(var(--k) * .5s); }
@keyframes g-ring { from { transform:scale(1); opacity:.9; } to { transform:scale(3); opacity:0; } }
.guide-node text { fill:#fff; font-size:13px; font-weight:600; }
.guide-route__text { font-size:.95rem; }
.guide-fine { color:#a9c2d1; margin-top:.4rem; }
.guide-fine a { color:var(--gold); }

@media (max-width:575.98px) { .guide-node text { font-size:21px; } .guide-map { margin:.2rem -.4rem; width:calc(100% + .8rem); } }

/* ---- visa ---- */
.guide-visa { display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.3rem; background:#fff; border:1px dashed rgba(9,62,89,.35); border-radius:1.1rem; padding:1.1rem 1.3rem; position:relative; }
.guide-visa__stamp { width:3.4rem; height:3.4rem; flex:0 0 auto; border-radius:50%; display:grid; place-items:center; font-size:1.6rem; color:var(--navy); border:2px solid var(--gold); background:rgba(232,179,65,.16); transform:rotate(-8deg); }
.guide-visa__label { font-size:.72rem; letter-spacing:.09em; text-transform:uppercase; color:#6a7a86; font-weight:700; }

/* ---- reveal on scroll ---- */
.guide [data-reveal] { opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.guide.is-in [data-reveal] { opacity:1; transform:none; }
.guide.is-in .guide-tile:nth-child(2) { transition-delay:.05s; } .guide.is-in .guide-tile:nth-child(3) { transition-delay:.1s; }
.guide.is-in .guide-tile:nth-child(4) { transition-delay:.15s; } .guide.is-in .guide-tile:nth-child(5) { transition-delay:.2s; }
.guide.is-in .guide-tile:nth-child(6) { transition-delay:.25s; } .guide.is-in .guide-tile:nth-child(7) { transition-delay:.3s; }
.guide-sources a { color:var(--navy); }

/* no JS: show everything, no motion */
.no-js .guide [data-reveal] { opacity:1; transform:none; }
.no-js .guide .guide-month--good .guide-month__bar { height:100%; } .no-js .guide .guide-month--ok .guide-month__bar { height:62%; } .no-js .guide .guide-month--avoid .guide-month__bar { height:26%; }

@media (prefers-reduced-motion:reduce) {
  .guide *, .guide *::before, .guide *::after { animation:none !important; transition:none !important; }
  .guide [data-reveal] { opacity:1; transform:none; }
  .guide .guide-month--good .guide-month__bar { height:100%; } .guide .guide-month--ok .guide-month__bar { height:62%; } .guide .guide-month--avoid .guide-month__bar { height:26%; }
  .guide .guide-plane { display:none; }
}
@media print { .guide [data-reveal] { opacity:1; transform:none; } .guide .guide-month__bar { height:60% !important; } .guide-plane { display:none; } }