/* =====================================================================
   GALAPAGOS PRISTINE — Brand skin over Travelik
   Loads LAST. Recolors the template to the logo palette and adapts
   a few components for a boutique Galapagos expedition operator.
   Palette (from logo):
     teal/navy  #0E4C5A   turquoise #12A6A0   sun orange #F49A2B
     leaf green #5FA83D   sand #F7F3EC
   ===================================================================== */

/* Fonts: Bebas Neue + Inter + Satisfy come from the template (custom.css) */

:root {
    /* accents */
    --color-btn: #12A6A0;
    --primary-color: #12A6A0;
    --color-btn1: #0E4C5A;
    --gp-teal: #0E4C5A;
    --gp-turq: #12A6A0;
    --gp-orange: #F49A2B;
    --gp-green: #5FA83D;
    --gp-sand: #F7F3EC;

    /* text / titles */
    --title-color: #ffffff;
    --text-color: #9FB2B5;

    /* dark backgrounds -> deep teal */
    --theme-bg-color: #103138;
    --theme-bg-color2: #0A2329;
    --theme-bg-color5: #16454E;

    /* light backgrounds -> soft sand/ice */
    --theme-bg-color3: #DCEEEF;
    --theme-bg-color4: #F2F7F6;
    --color-white2: #F2F7F6;
    --title-color2: #0E3138;

}

/* Typography reverted to template defaults (Bebas Neue / Inter / Satisfy) */

/* ---- fix inline-SVG cyan accents in header ---- */
.header-sidbar-button svg line { stroke: var(--gp-turq) !important; }
.header-call-info svg path { fill: var(--gp-turq) !important; }

/* ---- keep sticky header on brand dark so the white logo always reads ---- */
#sticky-header,
#sticky-header.sticky,
.travelik-header-area.sticky {
    background: rgba(10, 35, 41, 0.92) !important;
    backdrop-filter: blur(8px);
}
.header-logo img,
.mobile-logo img { height: 46px; width: auto; }

/* =====================================================================
   HERO
   ===================================================================== */
.hero-section-1 { position: relative; }
.hero-section-1::before {
    content: "";
    position: absolute; inset: 0;
    background:
        linear-gradient(180deg, rgba(8,30,36,.55) 0%, rgba(8,30,36,.25) 40%, rgba(8,30,36,.75) 100%),
        radial-gradient(120% 80% at 20% 30%, rgba(8,30,36,.25), transparent 60%);
    z-index: 0; pointer-events: none;
}
.hero-section-1 .container { position: relative; z-index: 2; }
/* the template ships a cut-out person + a plane graphic — not on brand */
.hero-thumb, .hero-plane { display: none !important; }
.hero_content .style-font,
.hero-content .style-font { color: #fff; }

/* the big hero word */
.hero_content h1, .hero-wrapper h1 { text-shadow: 0 8px 40px rgba(0,0,0,.35); }

/* journey card */
.hero-journey-box {
    background: rgba(10,35,41,.55) !important;
    border: 1px solid rgba(255,255,255,.14);
    backdrop-filter: blur(10px);
    border-radius: 18px;
}

/* =====================================================================
   BUTTONS / ACCENTS
   ===================================================================== */
.header-btn a,
.theme-btn,
.btn-style-two,
.destination-btn a,
.hero-btn a {
    background: var(--gp-turq);
}
.header-btn a:hover,
.theme-btn:hover,
.hero-btn a:hover { background: var(--gp-orange) !important; }

a { color: inherit; }
a:hover { color: var(--gp-turq); }

/* swiper pagination / nav accents */
.swiper-pagination-bullet-active,
.swiper-pagination-bullet:hover { background: var(--gp-turq) !important; }
.destination__arrow__bx .swiper-button-next:hover,
.destination__arrow__bx .swiper-button-prev:hover { background: var(--gp-orange) !important; }

/* eyebrow / small section script titles */
.section-main-title span,
.sub-title,
.section-subtitle { color: var(--gp-turq) !important; }

/* counters */
.counter-title, .counter-title span, .odometer { color: var(--gp-orange) !important; }

/* =====================================================================
   HIDE template blocks that don't apply to a real tour operator (draft)
   (team uses placeholder guide portraits we don't have; brand strip is
   generic partner logos)
   ===================================================================== */
.team-sectoin,
.brand-warrper { display: none !important; }

/* =====================================================================
   Footer polish
   ===================================================================== */
.main-footer-section { background-color: var(--theme-bg-color2); }
.footer-social a:hover { color: var(--gp-orange); }

/* =====================================================================
   WhatsApp floating button + trip badge
   ===================================================================== */
.gp-whatsapp {
    position: fixed; right: 22px; bottom: 22px; z-index: 9999;
    width: 60px; height: 60px; border-radius: 50%;
    background: #25D366; color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 10px 30px rgba(0,0,0,.28);
    transition: transform .25s ease, box-shadow .25s ease;
    animation: gp-pulse 2.4s infinite;
}
.gp-whatsapp:hover { transform: scale(1.08); color:#fff; box-shadow: 0 14px 40px rgba(37,211,102,.45); }
.gp-whatsapp svg { width: 32px; height: 32px; fill: #fff; }
@keyframes gp-pulse {
    0%   { box-shadow: 0 10px 30px rgba(0,0,0,.28), 0 0 0 0 rgba(37,211,102,.45); }
    70%  { box-shadow: 0 10px 30px rgba(0,0,0,.28), 0 0 0 16px rgba(37,211,102,0); }
    100% { box-shadow: 0 10px 30px rgba(0,0,0,.28), 0 0 0 0 rgba(37,211,102,0); }
}
@media (max-width: 575px){ .gp-whatsapp{ width:54px;height:54px; right:16px; bottom:16px } .gp-whatsapp svg{width:28px;height:28px} }

/* scroll-up */
.progress-wrap::after { color: var(--gp-turq); }
.progress-wrap svg.progress-circle path { stroke: var(--gp-turq); }

/* selection */
::selection { background: var(--gp-turq); color:#fff; }

/* =====================================================================
   INNER-PAGE HERO (breadcrumb) — cinematic / "wow"
   ===================================================================== */
.breadcumb-section {
    position: relative;
    min-height: 60vh;
    display: flex; align-items: center;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    animation: gp-hero-zoom 22s ease-out both;
}
@keyframes gp-hero-zoom { from { background-size: 118%; } to { background-size: 104%; } }
.breadcumb-section::before {
    content: ""; position: absolute; inset: 0; z-index: 1;
    background:
        linear-gradient(180deg, rgba(8,30,36,.48) 0%, rgba(8,30,36,.26) 42%, rgba(8,30,36,.88) 100%),
        radial-gradient(120% 90% at 50% 20%, rgba(8,30,36,.15), transparent 55%);
}
.breadcumb-section > *,
.breadcumb-section .container,
.breadcumb-section .auto-container,
.breadcumb-section .row { position: relative; z-index: 2; }
.breadcumb-content { text-align: center; }
.breadcumb-content h1 {
    color: #ffffff !important;
    font-size: clamp(46px, 7.5vw, 104px);
    line-height: 1.02;
    text-shadow: 0 14px 50px rgba(0,0,0,.5);
    margin-bottom: 14px;
}
.breadcumb-content h1::before {
    content: "Galapagos Pristine";
    display: block;
    font-family: var(--style-font);
    font-size: clamp(17px, 2vw, 28px);
    font-weight: 600; letter-spacing: .5px;
    color: var(--gp-turq);
    text-transform: none;
    text-shadow: none;
    margin-bottom: 8px;
}
.breadcumb-item { display: flex; justify-content: center; gap: 6px; }
.breadcumb-item li, .breadcumb-item a, .breadcumb-item span { color: rgba(255,255,255,.92) !important; }
.breadcumb-item a:hover { color: var(--gp-turq) !important; }

/* reviews carousel */
.reviews-swiper { padding-bottom: 46px; }
.reviews-swiper .swiper-pagination { bottom: 6px; }
.reviews-swiper .single-testi-box { height: auto; }

/* =====================================================================
   FULL BRANDING — soft rounded corners (no hard square edges/photos)
   ===================================================================== */
/* literal radii below */

/* image cards & thumbnails */
.destination-single-box,
.destination-thumb, .destination-thumb figure,
.populer-single-box, .populer-thumb, .populer-thumb figure,
.about-thumb figure, .about-img2, .about-shape img,
.single-blog-box, .blog-single-box, .blog-thumb, .blog-thumb.reveal,
.single-testi-box,
.donation-img, .donation-img img,
.blog-dtls-img, .blog-details_itm .blog-dtls-img,
.tour-sidebar-items, .travel-boking, .booking-box,
.hero-journey-box,
.testi-bg-box, .testi-img,
figure.reveal { border-radius: 20px !important; overflow: hidden; }

.destination-thumb img, .destination-thumb figure img,
.populer-thumb img, .populer-thumb figure img,
.about-thumb img, .about-img2 img,
.blog-thumb img, .single-blog-box img,
.donation-img img, .blog-dtls-img img,
.popular-thumb img,
figure.reveal img { border-radius: 20px !important; }

/* gallery images */
[class*="gelary"] img, [class*="gallery"] img, .galery-thumb img,
.gallery-single-box, .gallery-single-box img { border-radius: 20px !important; overflow: hidden; }

/* small / secondary images */
.blog-img1, .blog-img2, .blog-img3,
.testi-inner-bx, .boking-author img, .travellling-img img,
.travelling-img img { border-radius: 14px !important; overflow: hidden; }

/* circular avatars */
.testi-autor img, .testi-autor,
.client-avatars .avatar, .client-avatars .avatar img,
.blog-details-comment-thumb img,
.avatar img, .about-author img { border-radius: 50% !important; overflow: hidden; }

/* soft corners on hero media + input pills */
.hero-thumb, .single-testi-box .testi-inner-bx { border-radius: 20px !important; }
.booking-input-box, .booking-input-box select, .booking-input-box input,
.form-input-bx, .form-input-bx input { border-radius: 12px !important; }

/* footer instagram grid */
.footer-instagram img, .instagram-post img, .footer-widget-content .instagram img,
[class*="insta"] img { border-radius: 12px !important; overflow: hidden; }

/* ============================================================
   INCLUDED / NOT INCLUDED — two-column trust block (tour details)
   Foreign travellers scan this before booking; the "not included"
   side gets equal visual weight on purpose.
   ============================================================ */
.gp-incl-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin: 10px 0 30px;
}
.gp-incl-col {
    background: #0F3A43;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    padding: 26px 28px;
}
/* cards are dark; the theme's h3 colour is meant for light backgrounds */
.gp-incl-col .blog-dtls-title3 {
    color: #FFFFFF !important;
    margin-bottom: 16px !important;
    font-size: 26px;
    letter-spacing: .5px;
}
.gp-incl-list { list-style: none; margin: 0; padding: 0; }
.gp-incl-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    color: #C9D8DA;
    line-height: 1.55;
}
.gp-incl-list li:last-child { margin-bottom: 0; }
.gp-incl-list li::before {
    position: absolute;
    left: 0; top: 1px;
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free", "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 14px;
}
/* included = green check */
.gp-incl-yes { border-left: 3px solid #5FA83D; }
.gp-incl-yes .gp-incl-list li::before { content: "\f058"; color: #5FA83D; }
/* not included = muted orange minus (informative, not alarming) */
.gp-incl-no { border-left: 3px solid #F49A2B; }
.gp-incl-no .gp-incl-list li::before { content: "\f056"; color: #F49A2B; }
.gp-incl-note {
    display: block;
    font-size: 13px;
    color: #8FA3A6;
    font-style: italic;
    margin-top: 2px;
}
@media (max-width: 767px) {
    .gp-incl-grid { grid-template-columns: 1fr; gap: 18px; }
    .gp-incl-col { padding: 22px 20px; }
}

/* ============================================================
   PAGE GROUNDS + READABLE INK
   The theme never declares a body background, so both pages sat on
   Bootstrap white while --text-color had been retuned to #9FB2B5 for
   dark cards — body copy was rendering at ~2.2:1. Grounds are declared
   here and the light reading column gets its own ink token.
   ============================================================ */
body { background: #FFFFFF; }

/* /tours/ — deep expedition ground so the dark hero, the cards and the
   dark footer read as one piece instead of dark/white/dark banding */
.tour__section {
    background-color: #0A2329;
    background-image:
        radial-gradient(80% 55% at 50% 0%, rgba(18,166,160,.15) 0%, rgba(10,35,41,0) 60%),
        linear-gradient(180deg, #0A2329 0%, #0C272E 55%, #0A2329 100%);
    padding: 96px 0 104px;
}

/* /tour-details/ — brand sand, the one palette colour never used until now */
.blog-list.donation-details { background: #F7F3EC; padding: 72px 0 104px; }

/* ink for the LIGHT reading column (9.9:1 on sand) */
.blog-list.donation-details .blog-content-text p,
.blog-list.donation-details p.qouik,
.blog-list.donation-details p.desc-style1,
.blog-list.donation-details .tour-itinerary p,
.blog-list.donation-details .blog-details-comment-content p,
.blog-list.donation-details .blog-details-list li {
    color: #24424A !important;
    font-size: 17px;
    line-height: 1.75;
}
.blog-list.donation-details .tour-itinerary p strong { color: #0E4C5A !important; }
.blog-list.donation-details h2,
.blog-list.donation-details .blog-content-text > h3 { color: #0E3138 !important; }

/* dark panels keep the light token — never touches .gp-incl-list */
.gp-panel p, .gp-panel li,
.populer-single-box p,
.breadcumb-section p { color: #C9D8DA; }

/* ============================================================
   FLOATING CONTROLS — the scroll-up FAB (z-index 9999999999) was
   sitting on top of the WhatsApp bubble and eating the tap.
   ============================================================ */
.prgoress_indicator { right: 22px !important; bottom: 96px !important; z-index: 9998 !important; }
.gp-whatsapp { z-index: 10000; bottom: calc(22px + env(safe-area-inset-bottom)); }
@media (max-width: 575px) {
    .prgoress_indicator { right: 16px !important; bottom: 82px !important; }
    .gp-whatsapp { bottom: calc(16px + env(safe-area-inset-bottom)) !important; }
}

/* ============================================================
   KEYBOARD FOCUS — custom.css kills the outline site-wide with
   a:focus{outline:none}. :focus-visible keeps mouse clicks clean.
   ============================================================ */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
    outline: 3px solid #0E4C5A !important;
    outline-offset: 3px !important;
    border-radius: 6px;
}
/* dark surfaces need the light ring — #0E4C5A on #0A2329 is only 1.7:1 */
.tour__section a:focus-visible,
.populer-single-box a:focus-visible,
.gp-panel a:focus-visible,
.gp-incl-col a:focus-visible,
.breadcumb-section a:focus-visible,
.main-footer-section a:focus-visible { outline: 3px solid #FFFFFF !important; }

/* ============================================================
   TOUR CARD — rebuilt. Same panel language as .gp-incl-*:
   dark surface, generous radius, semantic colour, FA element icons.
   ============================================================ */
.tour__section .populer-single-box.style-classic,
.populer-section .populer-single-box.style-classic {
    background: #0F3A43 !important;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 18px 44px rgba(4,20,24,.45);
    transition: transform .4s ease, box-shadow .4s ease, border-color .4s ease;
    position: relative;
}
.tour__section .populer-single-box.style-classic:hover {
    border-color: #12A6A0 !important;
    transform: translateY(-6px);
    box-shadow: 0 26px 60px rgba(4,20,24,.60);
}

/* locked 3:2 photo crop so the grid stays even whatever the client sends */
.populer-single-box.style-classic .populer-thumb { position: relative; overflow: hidden; border-radius: 20px; }
.populer-single-box.style-classic .populer-thumb figure {
    aspect-ratio: 3/2; border-radius: 20px; overflow: hidden; margin: 0;
}
.populer-single-box.style-classic .populer-thumb figure img {
    width: 100%; height: 100%; object-fit: cover; object-position: center;
    transition: transform 1.2s cubic-bezier(.2,.7,.3,1);
}
.populer-single-box.style-classic:hover .populer-thumb figure img { transform: scale(1.06); }

/* the grey 312x270 template dummy that used to cover the card on hover */
.tour__section .about-sp,
.populer-section .about-sp,
.populer-single-box.style-classic .about-sp { display: none !important; }
/* replaced by a light-through-water glow */
.populer-single-box.style-classic::after {
    content: ""; position: absolute; right: -28%; bottom: -28%;
    width: 320px; height: 320px; border-radius: 50%;
    background: radial-gradient(circle, rgba(18,166,160,.28) 0%, rgba(18,166,160,0) 70%);
    opacity: 0; transform: scale(.82);
    transition: opacity .5s ease, transform .5s ease;
    pointer-events: none; z-index: 0;
}
.populer-single-box.style-classic:hover::after { opacity: 1; transform: scale(1); }
.populer-single-box.style-classic .populer-thumb,
.populer-single-box.style-classic .populer-contnet { position: relative; z-index: 1; }

/* category badge */
.gp-card-badge {
    position: absolute; top: 14px; left: 14px; z-index: 2;
    font-family: "Inter", sans-serif; font-size: 11px; font-weight: 700;
    letter-spacing: 1.6px; text-transform: uppercase;
    padding: 7px 14px; border-radius: 999px; color: #08252B;
}
.gp-badge-day   { background: #12A6A0; }
.gp-badge-multi { background: #F49A2B; }
.gp-badge-water { background: #5FA83D; }

/* price: a DARKENING scrim. The template used a lightening blur that put
   white text at ~1.3:1 over a bright sky. */
.populer-single-box.style-classic .populer-thumb .populer-price {
    bottom: 0 !important; top: auto !important;
    background: linear-gradient(180deg, rgba(10,35,41,0) 0%, rgba(10,35,41,.60) 36%, rgba(10,35,41,.92) 100%) !important;
    backdrop-filter: none !important;
    padding: 48px 22px 16px !important;
    border-radius: 0 0 20px 20px !important;
}
.populer-single-box.style-classic .populer-price h2 { color: #FFFFFF !important; margin: 0; }
.populer-single-box.style-classic .populer-price h2 span {
    font-family: "Inter", sans-serif; font-size: 13px; font-weight: 500;
    color: #C9D8DA !important; letter-spacing: .3px;
}

/* island chip + fact row */
.gp-island {
    font-family: "Inter", sans-serif; font-size: 11px; font-weight: 600;
    letter-spacing: 1.6px; text-transform: uppercase; color: #12A6A0;
    border: 1px solid rgba(18,166,160,.4); border-radius: 999px;
    padding: 5px 13px; display: inline-block; margin: 10px 0 4px;
}
.gp-card-meta { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; }
.gp-card-meta li { display: inline-flex; align-items: center; gap: 8px; color: #C9D8DA; font-size: 14.5px; }
.gp-card-meta li i { color: #12A6A0; font-size: 14px; }
.tour__section .populer-list, .tour__section .populer-days,
.populer-section .populer-list, .populer-section .populer-days { display: none !important; }
.tour__section .popular-ratting,
.populer-section .popular-ratting { display: none !important; }

/* CTA row — filled controls use dark ink; white on #12A6A0 is only 3.01:1 */
.gp-card-cta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 18px; position: relative; z-index: 3; }
.tour__section .gp-card-view,
.populer-section .gp-card-view {
    flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 9px;
    min-height: 48px; padding: 12px 26px !important;
    background: #12A6A0 !important; color: #08252B !important; border: 0 !important;
    border-radius: 999px !important;
    font-family: "Bebas Neue", sans-serif; font-size: 20px; letter-spacing: 1.5px;
    transition: background .3s ease, transform .3s ease;
}
.tour__section .populer-single-box.style-classic:hover .gp-card-view,
.populer-section .populer-single-box.style-classic:hover .gp-card-view { background: #F49A2B !important; transform: translateX(3px); }
.gp-card-wa {
    flex: 0 0 48px; width: 48px; height: 48px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; background: rgba(37,211,102,.14);
    border: 1px solid rgba(37,211,102,.45); color: #25D366; font-size: 19px;
    transition: background .25s ease, color .25s ease;
}
.gp-card-wa:hover { background: #25D366; color: #08252B; }
.tour__section .popular-title a,
.populer-section .popular-title a { color: #FFFFFF; transition: color .3s ease; }
.tour__section .populer-single-box.style-classic:hover .popular-title a,
.populer-section .populer-single-box.style-classic:hover .popular-title a { color: #12A6A0; }
/* the stretched link covers the card, so the focus ring goes on the card */
.populer-single-box.style-classic:focus-within { outline: 3px solid #FFFFFF; outline-offset: 3px; border-radius: 20px; }
.populer-single-box.style-classic .stretched-link:focus-visible { outline: none !important; }

/* ============================================================
   .gp-panel — the shared panel primitive, promoted out of the
   Included/Not-Included block so every module speaks one language.
   ============================================================ */
.gp-panel {
    background: #0F3A43;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px !important;
    padding: 26px 28px;
    overflow: hidden;
}
.gp-panel h3 { color: #FFFFFF !important; margin-bottom: 14px !important; }

/* ---------- key-facts strip on /tour-details/ ---------- */
.gp-facts {
    list-style: none; margin: 0 0 40px; padding: 24px 8px;
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px;
    background: #FFFFFF; border: 1px solid rgba(14,76,90,.12);
    border-radius: 18px; box-shadow: 0 10px 30px rgba(14,76,90,.07);
}
.gp-facts li {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: 3px; padding: 0 10px;
    border-right: 1px solid rgba(14,76,90,.10);
}
.gp-facts li:last-child { border-right: 0; }
.gp-facts-k {
    font-family: "Inter", sans-serif; font-size: 10.5px; font-weight: 700;
    letter-spacing: 1.6px; text-transform: uppercase; color: #6B8288;
}
.gp-facts-v {
    font-family: "Bebas Neue", sans-serif; font-size: 30px; line-height: 1.05; color: #0E3138;
}
.gp-facts-price { color: #F49A2B; }
.gp-facts-s { font-family: "Inter", sans-serif; font-size: 12.5px; color: #5C7378; line-height: 1.35; }

@media (max-width: 991px) {
    .gp-facts { grid-template-columns: repeat(3, 1fr); gap: 18px 8px; }
    .gp-facts li:nth-child(3) { border-right: 0; }
}
@media (max-width: 575px) {
    .gp-facts { grid-template-columns: repeat(2, 1fr); padding: 20px 6px; }
    .gp-facts li { border-right: 0; }
    .gp-facts-v { font-size: 26px; }
}

/* ---------- booking panel ---------- */
.gp-book-panel { padding: 30px 28px 28px; }
.gp-book-eyebrow {
    font-family: "Inter", sans-serif; font-size: 11px; font-weight: 700;
    letter-spacing: 1.8px; text-transform: uppercase; color: #8FA3A6;
}
.gp-book-price {
    font-family: "Bebas Neue", sans-serif; font-size: 52px; line-height: 1;
    color: #F49A2B; margin: 4px 0 20px;
}
.gp-book-price span {
    display: block; font-family: "Inter", sans-serif; font-size: 13px;
    font-weight: 500; letter-spacing: .3px; color: #C9D8DA; margin-top: 6px;
}
.gp-book-facts { list-style: none; margin: 0 0 24px; padding: 0; }
.gp-book-facts li {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.07);
    color: #C9D8DA; font-size: 15px;
}
.gp-book-facts li:last-child { border-bottom: 0; }
.gp-book-facts li i { color: #12A6A0; font-size: 15px; margin-top: 3px; flex: 0 0 18px; }

/* filled CTA uses dark ink — white on #25D366 is ~2.3:1 */
.gp-book-cta, .gp-band-cta {
    display: flex !important; align-items: center; justify-content: center; gap: 10px;
    min-height: 54px; padding: 14px 26px !important;
    background: #25D366 !important; color: #08252B !important;
    border: 0 !important; border-radius: 999px !important;
    font-weight: 700; font-size: 16px; letter-spacing: .02em;
    transition: transform .2s ease, box-shadow .2s ease;
}
.gp-book-cta:hover, .gp-band-cta:hover {
    background: #25D366 !important; color: #08252B !important;
    transform: translateY(-2px); box-shadow: 0 12px 30px rgba(37,211,102,.35);
}
.gp-book-cta i, .gp-band-cta i { font-size: 20px; }
.gp-book-alt { margin-top: 14px; text-align: center; font-size: 14px; color: #8FA3A6; }
.gp-book-alt a { color: #12A6A0; text-decoration: underline; }

.gp-book-trust { list-style: none; margin: 22px 0 0; padding: 20px 0 0; border-top: 1px solid rgba(255,255,255,.08); }
.gp-book-trust li { display: flex; align-items: flex-start; gap: 10px; color: #A9BEC1; font-size: 13.5px; line-height: 1.5; margin-bottom: 10px; }
.gp-book-trust li:last-child { margin-bottom: 0; }
.gp-book-trust li i { color: #5FA83D; font-size: 14px; margin-top: 2px; flex: 0 0 16px; }

/* ---------- cross-sell panel ---------- */
.gp-crosssell { margin-top: 26px; }
.gp-crosssell p { color: #C9D8DA; font-size: 15px; line-height: 1.6; margin-bottom: 18px; }
.gp-crosssell-btn {
    display: inline-flex; align-items: center; gap: 9px;
    min-height: 46px; padding: 11px 24px;
    background: #12A6A0; color: #08252B !important;
    border-radius: 999px;
    font-family: "Bebas Neue", sans-serif; font-size: 19px; letter-spacing: 1.4px;
    transition: background .3s ease;
}
.gp-crosssell-btn:hover { background: #F49A2B; color: #08252B !important; }

/* ---------- CTA band (replaces the newsletter that went nowhere) ---------- */
.gp-band-alt { margin-top: 12px; font-size: 14px; color: #C9D8DA; }
.gp-band-alt a { color: #12A6A0; text-decoration: underline; }

/* ---------- sticky booking rail on desktop ---------- */
@media (min-width: 992px) {
    .blog-list.donation-details > .container > .row { align-items: flex-start; }
    .tour-details-side { position: sticky; top: 110px; }
}

/* the island already lives in .gp-island, so the meta row carries duration
   (and, once the client confirms them, departure days) */
.gp-card-meta li { font-size: 15px; }
.gp-card-meta li i { font-size: 15px; }

/* ============================================================
   ITINERARY TIMELINE — six flat paragraphs turned into a day-by-day
   spine. Same panel language, light skin on the sand ground.
   ============================================================ */
.gp-itinerary { list-style: none; margin: 0 0 10px; padding: 0; position: relative; counter-reset: gpday; }
/* the spine */
.gp-itinerary::before {
    content: ""; position: absolute; left: 23px; top: 12px; bottom: 12px;
    width: 2px; background: linear-gradient(180deg, #12A6A0 0%, rgba(18,166,160,.18) 100%);
}
.gp-itin-day { position: relative; display: flex; gap: 22px; padding: 0 0 26px 0; }
.gp-itin-day:last-child { padding-bottom: 0; }

.gp-itin-num {
    flex: 0 0 48px; width: 48px; height: 48px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; background: #0E4C5A; color: #FFFFFF;
    font-family: "Bebas Neue", sans-serif; font-size: 22px; letter-spacing: 1px;
    position: relative; z-index: 1;
    box-shadow: 0 0 0 5px #F7F3EC;
}
.gp-itin-day:first-child .gp-itin-num { background: #12A6A0; }
.gp-itin-day:last-child  .gp-itin-num { background: #F49A2B; }

.gp-itin-body {
    flex: 1 1 auto;
    background: #FFFFFF;
    border: 1px solid rgba(14,76,90,.10);
    border-left: 3px solid #12A6A0;
    border-radius: 18px;
    padding: 20px 24px;
    box-shadow: 0 8px 24px rgba(14,76,90,.06);
}
.gp-itin-day:last-child .gp-itin-body { border-left-color: #F49A2B; }

.gp-itin-title {
    font-family: "Bebas Neue", sans-serif;
    font-size: 25px; line-height: 1.15; letter-spacing: .6px;
    color: #0E3138 !important; margin: 0 0 8px;
}
.gp-itin-label {
    display: inline-block; margin-right: 10px; padding: 3px 11px;
    background: rgba(18,166,160,.12); color: #0E4C5A;
    border-radius: 999px;
    font-family: "Inter", sans-serif; font-size: 11px; font-weight: 700;
    letter-spacing: 1.4px; text-transform: uppercase; vertical-align: middle;
}
.blog-list.donation-details .gp-itin-body p {
    margin: 0; color: #24424A !important; font-size: 16px; line-height: 1.7;
}

@media (max-width: 575px) {
    .gp-itinerary::before { left: 18px; }
    .gp-itin-day { gap: 14px; }
    .gp-itin-num { flex: 0 0 38px; width: 38px; height: 38px; font-size: 18px; box-shadow: 0 0 0 4px #F7F3EC; }
    .gp-itin-body { padding: 16px 18px; }
    .gp-itin-title { font-size: 22px; }
    .gp-itin-label { display: table; margin: 0 0 8px; }
}

/* ============================================================
   CASCADE FIX — style.css:6911 `.tour-details-side .tour-sidebar-items`
   (0,2,0) beats `.gp-panel` (0,1,0) and repainted the booking rail
   near-white (#F2F7F6) while its text kept the dark-panel ink,
   measuring 1.08:1. Same file also adds a light-panel drop-shadow
   that reads as haze on a dark surface, and a 10px radius.
   ============================================================ */
.tour-details-side .tour-sidebar-items.gp-panel {
    background: #0F3A43 !important;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px !important;
    filter: none !important;
}
.tour-details-side .tour-sidebar-items.gp-panel h3 { color: #FFFFFF !important; }
.tour-details-side .tour-sidebar-items.gp-panel p  { color: #C9D8DA; }

/* ============================================================
   FILLED BRAND CONTROLS — the dark-ink rule never reached the
   template's older button family, so the site's most prominent CTA
   (header BOOK NOW) was still white on #12A6A0 = 3.01:1.
   ============================================================ */
.header-btn a,
.theme-btn,
.btn-style-two,
.destination-btn a,
.hero-btn a { color: #08252B !important; }
.header-btn a svg path,
.theme-btn svg path,
.hero-btn a svg path { fill: #08252B; }
/* the WhatsApp CTAs are already dark-ink on green — keep them white-free */
.gp-book-cta, .gp-band-cta { color: #08252B !important; }

/* itinerary: first/last markers changed background but kept white ink
   (3.01:1 on turquoise, 2.21:1 on orange) */
.gp-itin-day:first-child .gp-itin-num { color: #08252B; }
.gp-itin-day:last-child  .gp-itin-num { color: #08252B; }

/* key-facts: orange price was 2.21:1 on its own white panel */
.gp-facts-price { color: #B4670C; }
.gp-facts-k { color: #5C7378; }

/* island chip was 4.09:1 at 11px on the card ground */
.gp-island { color: #35C7C1; }

/* #12A6A0 on the dark panel is 4.09:1 at 14px — lift to the same
   brighter turquoise used by the island chip */
.gp-book-alt a { color: #35C7C1; }

/* ============================================================
   CATALOG — new pages driven by inc/tours-data.php
   ============================================================ */
.gp-section-intro { max-width: 760px; margin: 0 auto 44px; text-align: center; }
.gp-section-intro p { color: #C9D8DA; font-size: 17px; line-height: 1.7; }

.gp-subsection { max-width: 760px; margin: 60px auto 34px; text-align: center; }
.gp-subsection-title { color: #FFFFFF !important; font-size: 38px; margin-bottom: 10px; }
.gp-subsection p { color: #C9D8DA; font-size: 16px; }
.gp-empty { color: #C9D8DA; text-align: center; padding: 40px 0; }

/* card summary + requirement line */
.gp-card-summary {
    color: #A9BEC1 !important; font-size: 14.5px; line-height: 1.6;
    margin: 14px 0 0;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.gp-card-req {
    display: flex; gap: 9px; align-items: flex-start;
    margin: 12px 0 0; padding: 10px 12px;
    background: rgba(244,154,43,.10); border-left: 2px solid #F49A2B; border-radius: 8px;
    color: #E8C79A !important; font-size: 12.5px; line-height: 1.45;
}
.gp-card-req i { color: #F49A2B; margin-top: 2px; flex: 0 0 13px; font-size: 12px; }

/* "Price on request" reads as a label, not a number */
.populer-price h2.gp-price-tbc { font-size: 30px; letter-spacing: .5px; }

/* single tour page */
.gp-facts-v-sm { font-size: 17px !important; line-height: 1.25; }
.blog-list.donation-details .gp-h3 { color: #0E3138 !important; margin: 38px 0 16px; }

.gp-requirement {
    display: flex; gap: 14px; align-items: flex-start;
    background: #FFF6E9; border: 1px solid rgba(244,154,43,.35); border-left: 4px solid #F49A2B;
    border-radius: 14px; padding: 18px 20px; margin: 0 0 34px;
}
.gp-requirement i { color: #B4670C; font-size: 19px; margin-top: 2px; }
.gp-requirement strong { display: block; color: #0E3138; font-size: 15px; margin-bottom: 4px; }
.blog-list.donation-details .gp-requirement p { margin: 0; color: #5A4526 !important; font-size: 15px; line-height: 1.6; }

.gp-highlights { list-style: none; margin: 0 0 10px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 26px; }
.gp-highlights li { position: relative; padding-left: 26px; color: #24424A; font-size: 16px; line-height: 1.55; }
.gp-highlights li::before {
    content: "\f058"; position: absolute; left: 0; top: 2px;
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free", "Font Awesome 5 Free";
    font-weight: 900; font-size: 14px; color: #5FA83D;
}
.gp-wildlife-note { font-size: 14px; color: #6B8288 !important; font-style: italic; margin: -8px 0 14px; }
.gp-wildlife { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.gp-wildlife li {
    background: #FFFFFF; border: 1px solid rgba(14,76,90,.14); border-radius: 999px;
    padding: 6px 14px; font-size: 13.5px; color: #24424A;
}
.gp-incl-pending { color: #A9BEC1 !important; font-size: 14.5px; line-height: 1.6; font-style: italic; }

.gp-related { list-style: none; margin: 0; padding: 0; }
.gp-related li { border-bottom: 1px solid rgba(255,255,255,.08); }
.gp-related li:last-child { border-bottom: 0; }
.gp-related a { display: block; padding: 11px 0; color: #C9D8DA; font-size: 15px; line-height: 1.4; transition: color .25s ease; }
.gp-related a:hover { color: #35C7C1; }
.gp-book-facts li em { color: #8FA3A6; font-style: normal; font-size: 13.5px; }

/* current page in the nav */
.gp-nav-current > a { color: #12A6A0 !important; }

@media (max-width: 767px) {
    .gp-highlights { grid-template-columns: 1fr; }
    .gp-subsection-title { font-size: 30px; }
}

/* an entry the operator has not finalised — honest, not alarming */
.gp-pending {
    display: flex; gap: 14px; align-items: flex-start;
    background: #EAF4F5; border: 1px solid rgba(14,76,90,.18); border-left: 4px solid #12A6A0;
    border-radius: 14px; padding: 18px 20px; margin: 34px 0 0;
}
.gp-pending i { color: #0E4C5A; font-size: 18px; margin-top: 2px; }
.gp-pending strong { display: block; color: #0E3138; font-size: 15px; margin-bottom: 4px; }
.blog-list.donation-details .gp-pending p { margin: 0; color: #24424A !important; font-size: 15px; line-height: 1.6; }

/* the first section heading sits right under the page intro */
.gp-subsection.gp-subsection-first { margin-top: 10px; }
.gp-jump { margin-top: 18px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.gp-jump a {
    display: inline-block; padding: 8px 18px; min-height: 40px; line-height: 24px;
    border: 1px solid rgba(18,166,160,.45); border-radius: 999px;
    color: #35C7C1; font-size: 14px; letter-spacing: .3px;
    transition: background .25s ease, color .25s ease;
}
.gp-jump a:hover { background: #12A6A0; color: #08252B; }

/* ============================================================
   TEXT OVER PHOTOGRAPHY
   Client feedback: "se pierde las letras con el fondo, podemos
   probar letras blancas con sombra?" — correct. These sections sit
   on photographic grounds while their copy still used #9FB2B5,
   a token meant for flat dark panels. Measured 1.79:1.
   White + a shadow that tracks the text keeps it legible over any
   frame of the photo, light or dark.
   ============================================================ */
.section-desc,
.about-icon-box-content p,
.single-testi-box .desc,
.single-testi-box .autor-desi,
.testi-autor-content p,
.travelling-offer-section p,
.counter-des p {
    color: #FFFFFF !important;
    text-shadow: 0 1px 2px rgba(4,20,24,.85), 0 2px 12px rgba(4,20,24,.55);
}
.about-icon-box-content h1,
.testi-autor-content h2,
.testi-autor-content h3,
.single-testi-box h2, .single-testi-box h3 {
    color: #FFFFFF !important;
    text-shadow: 0 2px 4px rgba(4,20,24,.8), 0 3px 16px rgba(4,20,24,.5);
}
/* the counter numerals sit on the same photographic band */
.counter-title h2, .counter-title .odometer {
    text-shadow: 0 2px 6px rgba(4,20,24,.8);
}
/* the homepage card price sits on the photo itself */
.populer-section .populer-price h2,
.tour__section .populer-price h2 {
    text-shadow: 0 1px 3px rgba(4,20,24,.7);
}