/*~~~~~~~~~~~~~~~~ GLOBAL RESET ~~~~~~~~~~~~~~~~*/
*,
::after,
::before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*~~~~~~~~~~~~~~~~ LIGHT MODE GLOBAL VARIABLES ~~~~~~~~~~~~~~~~*/
:root {
    /*-- brand colors --*/
    --kiche-ochre: #fb6837;
    --kiche-yellow: #fac234;
    --kiche-brown: #e28d61;
    --kiche-white: #eeeeee;
    --kiche-dark-green: #0c4c2a;
    --kiche-light-green: #2f9947;
    --kiche-dark-orange: #ea6a24;
    --kiche-light-orange: #f58020;

    /*-- text colors --*/
    --text-main-color: #1f2937;
    --text-muted-color: #6b7280;
    --color-success: #16a34a;
    --color-error: #dc2626;
    --color-info: #2563eb;
    --color-warning: #eab308;

    
    
    /* background colors */    
    --dropdown-bg: #ffffff;
    --hover-bg: #ceaa85;;
    --menubar-bg: #f0e5ca;
    --mega-panel-bg: #ffffff;

    --modal-overlay-bg: rgba(0, 0, 0, 0.4);
    --modal-surface-bg: #ffffff;
    --modal-border-color: #e5e7eb;
    --form-input-bg: #f9fafb;
    --form-input-border: #d1d5db;
    --focus-ring-glow: #eab308;

    /*-- borders colors | shadow --*/    
    --dropdown-border: #6b7280;
    --border-glassy: rgba(255, 255, 255, 0.3);    
    --mega-panel-border: #e5e7eb;
    --shadow-ui-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    
    /*-- transition | animation --*/
    --close-transition-delay: 200ms;

    /*-- gradient | transparency --*/
    --gradient-green-start: #0c4c2a;
    --gradient-green-end: #2f9947;

    
    /*===================== Styling Configurations & Core Theme Tokens =====================*/
    --color-success: #16a34a;
    --color-error: #dc2626;
    --color-info: #2563eb;
    --color-warning: #eab308;
    --text-white: #ffffff;
    --text-main: #111827;
    --text-muted: #737373;
    --border-light: rgba(156, 163, 175, 0.3);

    --font-stack: system-ui, -apple-system, sans-serif;
    --max-width-content: 1280px;

    /*===================== Custom Styling =====================*/
    --accent-orange: #ea580c;
    --ring-focus-color: #fb923c;
    --text-charcoal: #1f2937;
    --text-sub-grey: #4b5563;
    --badge-bg-yellow: #fef9c3;
    --whatsapp-green: #22c55e;


    /*===================== WhatsApp =====================*/
    --wa-brand-green: #25D366;
    --wa-dark-green: #128C7E;
    --wa-light-bg: #E5DDD5;
    --wa-text-dark: #333333;
    --wa-text-muted: #666666;
    --z-index-whatsapp: 9999;

    /*===================== Themes & Forms =====================*/
    --modal-overlay-bg: rgba(0, 0, 0, 0.4);
    --modal-surface-bg: #ffffff;
    --modal-border-color: #e5e7eb;
    --form-input-bg: #f9fafb;
    --form-input-border: #d1d5db;
    --focus-ring-glow: #eab308;
    --text-primary: #111827;
    --text-secondary: #4b5563;

    --notice-bg-green: #f0fdf4;
    --notice-border-green: #bbf7d0;
    --notice-text-green: #166534;

    /*===================== Structural Layout Variables =====================*/
    --drawer-bg: rgba(255, 255, 255, 0.95);
    --drawer-backdrop-color: rgba(0, 0, 0, 0.2);
    --drawer-width: 28rem;

    --color-orange-brand: #f97316;
    --color-orange-hover: #ea580c;
    --color-border-grey: #e5e7eb;
    --input-focus-ring: rgba(251, 146, 60, 0.4);
    --text-drawer-main: #111827;
    --text-drawer-sub: #4b5563;

    /*===================== Parameters and Color Tokens =====================*/
    --card-bg-surface: #ffffff;
    --card-border-color: #e5e7eb;
    --heading-charcoal: #1f2937;
    --body-slate-grey: #374151;
    --text-empty-italic: #6b7280;
    --card-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --card-shadow-hover: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);

    /*=====================Color Tokens and Context Variables =====================*/
    --inclusion-bg: #f0fdf4;
    --inclusion-border: #bbf7d0;
    --inclusion-heading: #15803d;
    --inclusion-text: #166534;

    --exclusion-bg: #fef2f2;
    --exclusion-border: #fca5a5;
    --exclusion-heading: #b91c1c;
    --exclusion-text: #991b1b;

    /*===================== MEGA MENU =====================*/
    --tab-border-active: #f97316;
    --tab-text-active: #ea580c;
    --tab-text-inactive: #6b7280;
    --tab-text-hover: #1f2937;
    --panel-border-color: #f3f4f6;
    --table-header-bg: #f9fafb;
    --text-main-body: #374151;
    --surface-white: #ffffff;

    /*===================== Brand Color Tokens =====================*/
    --bg-surface-card: #ffffff;
    --border-divider-light: #f3f4f6;
    --text-charcoal-main: #111827;
    --text-slate-muted: #4b5563;
    --text-placeholder-grey: #6b7280;
    --transition-timing-standard: cubic-bezier(0.4, 0, 0.2, 1);

    /*===================== Parameters and Design Tokens =====================*/
    --card-surface-color: #ffffff;
    --card-accent-border: #f3f4f6;
    --text-slate-black: #111827;
    --text-grey-paragraphs: #9ca3af;
    --text-badge-yellow: #854d0e;
    --bg-badge-yellow: #fef9c3;
    --primary-orange-glow: rgba(251, 146, 60, 0.2);
    --animation-bezier: cubic-bezier(0.4, 0, 0.2, 1);

    /*===================== Parameters and Color Token =====================*/
    --card-surface-color: #ffffff;
    --card-accent-border: #f3f4f6;
    --text-slate-black: #111827;
    --text-grey-paragraphs: #9ca3af;
    --text-badge-yellow: #854d0e;
    --bg-badge-yellow: #fef9c3;
    --primary-orange-glow: rgba(251, 146, 60, 0.2);
    --animation-bezier: cubic-bezier(0.4, 0, 0.2, 1);

    /*===================== Background Profiles and Tokens =====================*/
    --bg-facebook: #1877f2;
    --bg-x-corp: #111827;
    --bg-linkedin: #0a66c2;
    --bg-tiktok: #000000;
    --bg-youtube: #ff0000;

    --rail-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --animation-duration: 300ms;
    --cubic-bezier: cubic-bezier(0.4, 0, 0.2, 1);

    /*===================== HEAD SECTIOn =====================*/
    --accent-orange: #ea580c;
    --ring-focus-glow: #fb923c;
    --text-charcoal: #111827;
    --text-slate-grey: #4b5563;
    --bg-glassy: rgba(255, 255, 255, 0.7);
    --border-glassy: rgba(255, 255, 255, 0.3);
    --modal-surface: #ffffff;
    --drawer-surface-bg: rgba(255, 255, 255, 0.95);

    --footer-border: #e5e7eb;

    /*===================== MODAL =====================*/
    --modal-bg: #ffffff;
    --modal-backdrop: rgba(15, 23, 42, 0.6);
    --modal-border: #e2e8f0;
    --modal-radius: 16px;
    --modal-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    
    --color-primary: #0f172a;
    --color-primary-hover: #1e293b;
    --color-text-main: #334155;
    --color-text-dark: #0f172a;
    --color-error: #ef4444;
    --color-error-bg: #fef2f2;
    --color-notice-bg: #f8fafc;
    --color-focus: #3b82f6;

    --transition-speed: 0.25s;
    --ease: cubic-bezier(0.4, 0, 0.2, 1);

    --bg-header-light: rgba(255, 255, 255, 0.85);
    --bg-header-dark: rgba(55, 65, 81, 0.9);
    --border-color-default: #d1d5db;
    --text-main: #1f2937;
    --text-muted: #6b7280;
    --gradient-start: #ef4444;
    --gradient-end: #fb923c;
    --shadow-ui-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

body { 
  min-height: 100vh; 
  background: url("../../static/img/hero-images/nws-st-cheetah-trees.jpg") center / cover no-repeat fixed,
              linear-gradient(rgba(247, 248, 245, 0.1), rgba(247, 248, 245, 0.1)); 
  font-family: var(--font-stack); 
  margin: 0; 
  padding: 0; 
  color: var(--text-main); 
}


/*~~~~~~~~~~~~~~~~ SKIP LINK CONFIG ~~~~~~~~~~~~~~~~*/
/* .flight-alert,
.skip-link,
.flight-alert__close {
    transition: none;
} */

.skip-link {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 200;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background: #ffffff;
    color: #0f172a;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 25px rgb(0 0 0 / 15%);

    transform: translateY(-200%);
    transition: transform 180ms ease, opacity 180ms ease;
}
.skip-link:focus {
    transform: translateY(0);
    outline: 3px solid rgb(59 130 246 / 35%);
    outline-offset: 2px;
    top: 0; /*   */
}

/*~~~~~~~~~~~~~~~~ FLIGHT UPDATE ALERT ~~~~~~~~~~~~~~~~*/
.flight-alert {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 50;

    padding: 0.75rem 0;
    color: #ffffff;

    background: linear-gradient(135deg, #ef4444 0%, #fb923c 100%);
    border-top: 1px solid rgb(229 231 235 / 80%);

    box-shadow: 0 -8px 25px rgb(0 0 0 / 12%);

    opacity: 0;
    visibility: hidden;
    transform: translateY(100%);

    transition: opacity 300ms ease, visibility 300ms ease, transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}
.flight-alert.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
} 

.flight-alert__container {
    width: min(100% - 2rem, 1200px);
    margin-inline: auto;

    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    gap: 0.75rem;

 }
.flight-alert__title {
    color: #ffffff;
    font-size: 0.95rem;
    line-height: 1.5;
}
.flight-alert__title strong {
    font-weight: 700;
}
.flight-alert__message {
    min-width: 0;
}
.flight-alert__message p {
    margin: 0;
    color: rgb(255 255 255 / 95%);
    font-size: 0.875rem;
    line-height: 1.6;
}
.flight-alert__message strong {
    color: #ffffff;
    font-weight: 700;
}
.flight-alert__actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.flight-alert__close {
    width: 2rem;
    height: 2rem;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    color: #ffffff;
    background: transparent;

    border: 1px solid rgb(255 255 255 / 70%);
    border-radius: 999px;

    cursor: pointer;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, transform 180ms ease;
}
.flight-alert__close:hover {
    color: #dc2626;
    background: #ffffff;
    border-color: #ffffff;
}
.flight-alert__close:focus-visible {
    outline: 3px solid rgb(255 255 255 / 55%);
    outline-offset: 3px;
}
.flight-alert__close:active {
    transform: scale(0.94);
}
.flight-alert__close svg {
    width: 1rem;
    height: 1rem;
    pointer-events: none;
}

/*~~~~~~~~~~~~~~~~ MOBILE TOP BAR ~~~~~~~~~~~~~~~~*/
.mobile-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 100;
    /* background: #a2a29e; */
    box-shadow: 0 4px 15px rgb(0 0 0 / 10%);
}
.mobile-header__bar {
    /* min-height: 4.5rem;
    padding: 0.75rem 1.5rem;
        
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.75rem; */

    position: fixed;
    inset: 0 0 auto;
    z-index: 100;

    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.2rem 2.5%;
    background: var(--menubar-bg);
    box-shadow: 0 4px 15px rgb(0 0 0 / 50%);
}
/* Hamburger */
.mobile-header__menu-toggle {
    width: 2.75rem;
    height: 2.75rem;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    /*padding: 0.2rem 0.25rem;*/
    border: 0;
    /* border: none;*/
    background: transparent;
    /*background: none;*/
    color: #374151;
    /*color: var(--text-muted);*/

    cursor: pointer;
}

.mobile-header__menu-toggle:hover {
    background-color: rgb(142, 206, 171);
    color: var(--kiche-dark-green);
    transform: scale(1.2);
}

.mobile-header__menu-toggle svg {
    width: 1.65rem;
    height: 1.65rem;
}

/* Logo */
.mobile-header__logo {
    display: flex;
    justify-content: center;
    align-items: center;
}
.mobile-header__logo img {
    display: block;
    height: 2.5rem;
    width: auto;
    padding: 0;
    margin: 0;
    cursor: pointer;
}

/* CTA */
.mobile-header__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0.5rem;

    color: #ffffff;
    background-color: var(--kiche-light-green);
    border-radius: 0.5rem;

    font-size: clamp(0.875rem, 1vw + 0.5rem, 1.25rem);
    font-weight: 800;
    /* line-height: 1.25; */

    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease;
    box-shadow: 0 4px 6px -1px rgba(239, 68, 68, 0.25);
}
.mobile-header__cta:hover {
    opacity: 0.95;
    transform: translateY(-1px);
    box-shadow: 0 5px 15px rgb(239 68 68 / 25%);
    /* background-color: var(--kiche-light-orange); */
    color: var(--kiche-light-orange);
}
    
/*~~~~~~~~~~~~~~~~ HAMBURGER NAVBAR ~~~~~~~~~~~~~~~~*/
.mobile-navigation {
    position: fixed;
    inset: 0;
    z-index: 200;
    visibility: hidden;
}

/* Overlay */
.mobile-navigation__overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    background: rgb(0 0 0 / 45%);
    backdrop-filter: blur(3px);

    opacity: 0;
    cursor: pointer;
    transition: opacity 300ms ease;
}

/* Menu Panel */
.mobile-navigation__panel {
    position: relative;
    z-index: 1;
    width: min(18rem, 88vw);
    height: 100%;
    padding: 1.25rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #ffffff;
    box-shadow: 8px 0 30px rgb(0 0 0 / 15%);

    transform: translateX(-100%);
    transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Navigation header */
.mobile-navigation__header {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;

}
.mobile-navigation__logo img {
    display: block;
    width: auto;
    height: min(1.5rem, 90vw);
}

.mobile-navigation__close {
    width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: #374151;
    cursor: pointer;
}
.mobile-navigation__close :hover {
    color: var(--kiche-ochre)
}
.mobile-navigation__close svg {
    width: 1.65rem;
    height: 1.65rem;
}

/* Navigation Menu */
.mobile-navigation__menu {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Search */
.mobile-navigation__search {
    margin-bottom: 1rem
}
.mobile-search {
    position: relative;
    display: flex;
}
.mobile-search input {
    width: 100%;
    min-height: 3rem;
    padding: 0.75rem 3.25rem 0.75rem 1rem;
    color: #111827;
    background: #f9fafb;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;

    font: inherit;
    font-size: 0.875rem;
}
.mobile-search input:focus {
    outline: none;
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgb(239 68 68 / 15%);
}

.mobile-search button {
    position: absolute;
    top: 50%;
    right: 0.35rem;

    width: 2.4rem;
    height: 2.4rem;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    color: #ffffff;
    background: linear-gradient(135deg, var(--kiche-dark-green), var(--kiche-light-green));

    border: 0;
    border-radius: 0.4rem;

    transform: translateY(-50%);
    cursor: pointer;

    svg {
        width: 1rem;
        height: 1rem;
    }
}
/* Home | About */
.mobile-nav-link {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    color: #111827;
    font-size: 0.95rem;
    font-weight: 500;
    text-decoration: none;
}
.mobile-nav-link:hover {
    color: var(--kiche-ochre);
}

.mobile-nav-link img {
    flex: 0 0 auto;
    object-fit: contain;
}

/* Dropdown Groups */
.mobile-nav-group {
    border-bottom: 1px solid #f1f5f9;
}
.mobile-nav-toggle {
    width: 100%;
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0;
    color: #111827;
    background: transparent;
    border: 0;
    font: inherit;
    font-size: 0.95rem;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
}
.mobile-nav-toggle__label {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.mobile-nav-toggle__label img {
    flex: 0 0 auto;
    object-fit: contain;
}
/* Default state: Arrow points down */
.mobile-nav-toggle__icon {
    width: 1.1rem;
    height: 1.1rem;
    color: #6b7280;
    transform: rotate(0deg);
    /* transition: transform 200ms ease, color 200ms ease; */
    transition: transform 5ms cubic-bezier(0.4, 0, 0.2, 1), color 5ms ease;
}
/* Expanded state: Change color and flip arrow up  */
.mobile-nav-toggle[aria-expanded="true"] {
    color: var(--kiche-dark-orange);
}
.mobile-nav-toggle[aria-expanded="true"] .mobile-nav-toggle__icon {
    transform: rotate(180deg);
    color: var(--kiche-dark-orange);
}

/* Submenus */
.mobile-nav-submenu {
    display: flex;
    flex-direction: column;
    padding: 0 0 0.65rem 2.75rem;
}
.mobile-nav-submenu[hidden] {
    display: none;
}
.mobile-nav-submenu a {
    padding: 0.4rem 0;
    color: #6b7280;
    font-size: 0.875rem;
    font-weight: 400;
    text-decoration: none;
}
.mobile-nav-submenu a:hover {
    color: #dc2626;
    text-decoration: underline;
}

/* Hamburger CTA */
.mobile-navigation__actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid #e5e7eb;
}
.mobile-navigation__plan {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.625rem 1rem;
    color: #ffffff;
    background: linear-gradient(135deg, var(--kiche-dark-green), var(--kiche-brown));

    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease;
}
.mobile-navigation__plan:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 15px rgb(239 68 68 / 25%);
}


/* Get a Quote */
.mobile-navigation__rate {
    display: flex;
    justify-content: center;
    padding: 0.125rem;
    color: var(--kiche-dark-green);
    background: linear-gradient(135deg, var(--kiche-dark-green), var(--kiche-brown));
    border-radius: 0.5rem;
    text-decoration: none;
    transition: background-color 250ms ease, color 250ms ease;
}

.mobile-navigation__rate span {
    width: 100%;
    padding: 0.625rem 1rem;
    background: #ffffff;
    border-radius: 0.4rem;
    text-align: center;
    font-size: 0.875rem;
    font-weight: 600;
}

.mobile-navigation__rate:hover,
.mobile-navigation__rate:focus-visible,
.mobile-navigation__rate:active {
    span {
        color: #ffffff;
        background: transparent;
    }
}


/*~~~~~~~~~~~~~~~~ JAVASCRIPT CONTROLS ~~~~~~~~~~~~~~~~*/
.mobile-navigation.is-open {
    visibility: visible;
}
.mobile-navigation.is-open .mobile-navigation__overlay {
    opacity: 1;
}
.mobile-navigation.is-open .mobile-navigation__panel {
    transform: translateX(0);
}

/*~~~~~~~~~~~~~~~~ VISUALLY HIDDEN ~~~~~~~~~~~~~~~~*/
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;

    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
}

/*~~~~~~~~~~~~~~~~ DESKTOP NAVIGATION TOPBAR ~~~~~~~~~~~~~~~~*/
.site-desktop-topbar-wrapper {
    display: none !important;
    position: relative;
    z-index: 1000;
    width: 100%;
    background: #b9d0f0;/* background: var(--kiche-green); */
    border-bottom: 1px solid #87b7fa;
    padding: 0.25rem 2.5%;
}

.site-desktop-topbar {
    min-height: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    width: 100%;

    /* width: min(100% - 2rem, 1440px);
    min-height: 96px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: 250px minmax(280px, 1fr) auto;
    align-items: center;
    gap: 1.25rem;
    padding-block: 1rem; */
}

/*-- Brand --*/
.site-desktop-brand {
    width: fit-content;
    text-decoration: none;
    color: inherit;
    flex-shrink: 0;

    /* display: inline-flex;
    align-items: center;
    justify-content: flex-start; */
}

.site-desktop-logo {
    display: block;
    /* height: clamp(2.5rem, 0.5vw + 2.5rem, 5rem);  height: 4.5rem; */ 
    /* height: clamp(2.5rem, 15.625vw - 5rem, 5rem);     */
    height: clamp(2.5rem, -1.25rem + 7.813vw, 3.75rem);               
    width: auto;        /* width: 250px; */
    max-width: 100%;
    object-fit: contain;
}

/*-- Search --*/
.site-desktop-search {
    flex: 1;
    min-width: 0;
    display: flex;
    justify-content: center;

    /* width: 100%; */
}

.desktop-search-form {
    position: relative; /* display: block; */
    width: 100%;
    margin: 0;
    max-width: 25rem;
}

.desktop-search-field {
    position: relative;
    width: 100%;
}

/* input field */
.desktop-search-input {
    display: block;
    width: 100%;
    max-width: 25rem;
    min-height: 2.5rem;
    padding: 0.75rem 3.5rem 0.75rem 1rem;
    font-family: inherit;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.5;
    color: #111827;
    background: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 0.625rem;
    outline: none;
    appearance: none;
    transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.desktop-search-input::placeholder {
    color: #6b7280;
    opacity: 1;
}
.desktop-search-input:hover {
    border-color: #9ca3af;
}
.desktop-search-input:focus {
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12);
}
.desktop-search-input::-webkit-search-cancel-button {
    cursor: pointer;
}

/* search button */
.desktop-search-button {
    position: absolute;
    top: 50%;
    right: 0.375rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    transform: translateY(-50%);
    color: #ffffff;
    background: linear-gradient(135deg, var(--kiche-dark-green) 0%, var(--kiche-light-green) 100%);
    border: 0;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: transform 160ms ease, filter 160ms ease, box-shadow 160ms ease;
}

.desktop-search-button:hover {
    filter: brightness(1.05);
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.2);
    background: linear-gradient(135deg, var(--kiche-dark-orange) 0%, var(--kiche-light-orange) 100%);;
}
.desktop-search-button:active {
    transform: translateY(-50%) scale(0.96);
}
.desktop-search-button:focus-visible {
    outline: 3px solid rgba(239, 68, 68, 0.25);
    outline-offset: 2px;
}    
.desktop-search-button .search-icon {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

/* Search dropdowns */
.desktop-search-dropdown {
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 0;
    right: 0;
    z-index: 1100;
    max-height: 420px;
    overflow-y: auto;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    box-shadow: 0 10px 25px rgba(17, 24, 39, 0.10), 0 4px 10px rgba(17, 24, 39, 0.06);
    display: block; 
}
.desktop-search-dropdown[hidden] {
    /* display: none !important; */
    display: none;
}

.search-suggestion-item {
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    color: #374151;
    cursor: pointer;
    transition: background-color 120ms ease, color 120ms ease;
}
.search-suggestion-item:hover, 
.search-suggestion-item.is-active {
    background-color: var(--kiche-dark-green);
    color: var(--kiche-dark-green);   
}

/*-- Call-To-Action Wrapper --*/
.site-desktop-ctas {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    white-space: nowrap;
}

/*-- Plan a Trip --*/
.plan-trip-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    padding: 0.625rem 0.5rem;
    font-family: inherit;
    font-size: clamp(0.875rem, 0.15rem + 0.25vw, 1.25rem);
    /* font-size: clamp(0.875rem, 0.4vw + 0.75rem, 1.25rem); */
    font-weight: 600;
    line-height: 1;
    color: #ffffff;
    text-decoration: none;
    background: linear-gradient(135deg, var(--kiche-dark-green) 0%, var(--kiche-light-green) 100%);
    border: 1px solid transparent;
    border-radius: 0.5rem;
    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.08);
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}



.plan-trip-cta:hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(239, 68, 68, 0.18);
    background: linear-gradient(135deg, var(--kiche-dark-orange) 0%, var(--kiche-light-orange) 100%);
}
.plan-trip-cta:active {
    transform: translateY(0);
}
.plan-trip-cta:focus-visible {
    outline: 3px solid rgba(239, 68, 68, 0.25);
    outline-offset: 2px;
}


/*~~~~~~~~~~~~~~~ Check our Rates ~~~~~~~~~~~~~~~*/
/* .rates-cta {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    padding: 0.3125rem;

    font-size: clamp(0.75rem, 0.5vw + 0.5rem, 1rem);
    font-weight: 600;
    line-height: 1;
    color: var(--kiche-dark-green);
    text-decoration: none;
    background: linear-gradient(135deg, var(--kiche-dark-green) 0%, var(--kiche-light-green) 100%);
    border-radius: 0.5rem;
    overflow: hidden;
    transition: transform 160ms ease, box-shadow 160ms ease; 
} */

.rates-cta {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    padding: 0.15rem;

    /* font-size: clamp(0.75rem, 0.5vw + 0.5rem, 1rem); */
    font-size: clamp(0.875rem, 0.15rem + 0.25vw, 1.25rem);
    font-weight: 600;
    line-height: 1;
    color: var(--kiche-dark-green);
    text-decoration: none;
    background: linear-gradient(135deg, var(--kiche-dark-green) 0%, var(--kiche-light-green) 100%);
    border-radius: 0.5rem;
    overflow: hidden;
    transition: transform 160ms ease, box-shadow 160ms ease; 
}

.rates-cta span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.75rem;;
    /* padding-inline: 0.5rem; */
    padding: 0.625rem 0.5rem;
    color: var(--kiche-dark-green);
    background: #ffffff;
    border-radius: 0.475rem;
    transition: color 160ms ease, background-color 160ms ease;
}

.rates-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(239, 68, 68, 0.16);
}
.rates-cta:hover span {
    color: #ffffff;
    background: transparent;
    /* transform: scale(1.2); */
}
.rates-cta:focus-visible {
    outline: 3px solid rgba(239, 68, 68, 0.25);
    outline-offset: 3px;
}


/*-- Accessibility --*/
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    white-space: nowrap;
    border: 0;

    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
}

/*~~~~~~~~~~~~~~~~ DESKTOP NAVIGATION SECONDARY NAVBAR ~~~~~~~~~~~~~~~~*/
/*-- Secondary Navbar Wrapper --*/
.site-header-sticky {
    display: none;
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 50;
    /* background-color: var(--kiche-light-green, #244ffb); */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    
    box-shadow: var(--navbar-shadow, 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03));
    border-bottom: 1px solid rgba(0, 0, 0, 0.15); 
}

.site-desktop-nav-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  /* max-width: 1280px; */
  /* margin: 0 auto; */
  padding: 0.15rem 2.5%; /* padding: 0.75rem 1rem; */
  
  /* box-sizing: border-box; */

  background-color: var(--menubar-bg, #f0e5ca); 
  box-shadow: rgba(239, 68, 68, 0.25);/* box-shadow: var(--shadow-ui-lg); */

  /* position: relative; */
}

.site-desktop-nav {
    /* display: flex !important;
    position: relative;
    z-index: 1500;
    width: 100%; */
    /* background: #b9d0f0;background: var(--kiche-green); */
    /* border-bottom: 1px solid #e5e7eb; */
    
    display: flex;
    align-items: center;
    gap: 1.25rem;
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: clamp(0.875rem, 0.4vw + 0.5rem, 1.1rem); /* font-size: 0.875rem; */
    /* font-weight: 500; */
    background:transparent;
}

.site-desktop-nav > li {
    display: inline-flex;
    align-items: center;
}

.site-desktop-nav-divider {
    width: 1px;
    /* height: 1.25rem; */
     align-self: stretch; /* align-self: centre; */
    margin-block: 0.5rem;
    background-color: rgba(0, 0, 0, 0.1);
}

/* Mega Menu & Dropdown Items */
.nav-item-wrapper{
    position: relative;
}
/* .nav-item-wrapper.is-active .nav-caret {
  transform: rotate(180deg);
}

.nav-item-wrapper.is-active > .nav-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
} */

.nav-trigger, .nav-trigger-anchor {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    gap: 0.5rem;               /* gap: 0.25rem; */
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    padding: 0.25rem 0.75%;     /* padding: 0.5rem; */
    text-decoration: none;
}

.nav-trigger:hover, .nav-trigger-anchor:hover {
    text-decoration: underline;
    background-color: var(--hover-bg)
}

.nav-icon-inline {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0; 
}

.nav-caret {
    width: clamp(0.75rem, 0.3vw + 0.75rem, 1.15rem);            /* width: 0.85rem; */ 
    height: clamp(0.75rem, 0.3vw + 0.75rem, 1.15rem);           /* height: 0.85rem; */
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);    /* transition: transform 0.2s ease-in-out; */
}

.nav-trigger[aria-expanded="true"] .nav-caret {
  transform: rotate(180deg);
}

.nav-dropdown {
  /* display: flex;  */
  /* flex-direction: column; */
  /* gap: 0.25rem; */
  /* padding: 0.75rem; padding: 0.5rem 0; */
  /* padding-left: 12.5px;  
  text-indent: -12.5px;
  margin-top: 0.5rem;*/

  /* list-style: none; */

  position: absolute;
  left: 0;
  top: 100%;   /* top: calc(100% + 0.5rem);  */
  margin-top: 0.5rem;
  width: 12rem;                               /* width: 16rem !important;  */
  background-color: #ffffff;
  border: 1px solid #6b7280;
  border-radius: 0.375rem;
  box-shadow: var(--shadow-ui-lg);
  z-index: 50;
  
  /* Modern CSS Micro-Transitions Layer */
  opacity: 0;
  visibility: hidden;
  transform: scale(0.95);  /* transform: translateY(-8px); */
  transform-origin: top left;
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease; /* transition: opacity var(--close-delay) ease, transform var(--close-delay) ease, visibility var(--close-delay); */
}
.nav-dropdown.is-open {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}

.nav-dropdown.variant-padded-lg {
  width: 16rem;
  padding: 0.75rem;
  border-color: var(--border-color-default);
  border-radius: 0.5rem;
}

.dropdown-link {
  display: block; 
  padding: 0.5rem 1rem;
  color: var(--text-main);
  text-decoration: none;

  /* border-radius: 0.375rem;  */
  /* font-size: 0.875rem; */
  /* transition: background-color 0.15s ease; */
}


.dropdown-link:hover {
  background-color: #f3f4f6;     /* background-color: var(--hover-bg); */
}

.dropdown-link-rounded {
  display: block;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  color: var(--text-main);
  text-decoration: none;

  border-bottom: 0.05rem solid #f0e9e9; 
}

.dropdown-link-rounded:hover {
  background-color: #f3f4f6;
}

/*  */
.dropdown-footer-action {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid #e5e7eb;
}
/* --> the element is comments --> for future use
.dropdown-footer-action {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid #e5e7eb;
}
.btn-gradient {
  display: block;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  color: #ffffff;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  background: linear-gradient(to right, var(--gradient-start), var(--gradient-end));
  transition: opacity 0.15s ease;
}

.btn-gradient:hover {
  opacity: 0.95;
} */


/* Contact Information */
.site-desktop-contact{
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}
.site-desktop-contact-icon{
    height: clamp(1.5rem, 1vw + 1.25rem, 2.5rem);
    width: auto;
    object-fit: contain;
}

.site-desktop-contact-copy{
    display: flex;
    flex-direction: column;
}

.site-desktop-contact-label{
    margin: 0;
    font-size: 0.875rem;
    /* color: var(--text-muted); */
    color: var(--kiche-light-green);
}

.site-desktop-contact-phone{
    margin: 0;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--kiche-ochre);
}

/* Mega Menu Dropdowns */
.mega-menu-wrapper {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    background-color: #ffffff;
    border-top: 1px solid #e5e7eb;
    box-shadow: var(--shadow-ui-lg);
    z-index: 40;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    will-change: transform, opacity;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}
.mega-menu-wrapper.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.mega-menu-container{
    width: 100%;
    /* max-width: 1280px; */
    margin: 0 auto;
    padding: 2rem 1.5rem;
    /* box-sizing: border-box; */
}
.mega-pane-grid {
    display: none;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}
.mega-pane-grid.pane-active {
    display: grid;
}
.mega-grid-card {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: transform 0.15s ease;
}
.mega-grid-card:hover {
    transform: translateY(-2px);
}
.mega-card-img {
    display: block;
    width: 100%;
    height: 12rem;
    object-fit: cover;
    border-radius: 0.5rem;
}
.mega-card-title {
    font-weight: 700;
    text-align: center;
    margin-top: 0.5rem;
    margin-bottom: 0;
    font-size: clamp(1rem, 0.5vw + 0.85rem, 1.25rem);
}
.mega-card-title.heading-xl {
  font-size: clamp(1.35rem, 0.6vw + 1.1rem, 1.65rem);       /* font-size: 1.35rem; */
}

/*~~~~~~~~~~~~~~~~  ~~~~~~~~~~~~~~~~*/
.main-content {
    min-height: 100dvh;
    
    display: flex;
    flex-direction: column;
}

/*~~~~~~~~~~~~~~~~ FOOTER ~~~~~~~~~~~~~~~~*/
.site-global-footer {
    border-top: 1px solid var(--footer-border);
    /* margin: 0.5rem 0; */
    margin-top: 1.5rem;
    margin-bottom: 0;
    padding: 2.5rem 7.5%; 
    width: 100%;    /* width: 100vw; */

    /* background-color: var(--kiche-green); */
    background-color: var(--badge-bg-yellow);
}

.footer-max-container {
    padding: 1rem 0; /* padding: 1rem 1.5rem; */
    display: grid;
    grid-template-columns: repeat(1, 1fr); /* grid-template-columns: repeat(6, 1fr); */
    gap: 1.5rem;
    align-items: start;
    justify-content: space-between;
}

.footer-columns-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);;
    gap: 1rem;
    align-items: start;
}
.footer-logo-anchor {
    display: inline-block;
    /* margin-bottom: 1.5rem; */
}
.footer-logo-anchor img {
    display: block;
    height: clamp(2.5rem, 4vw + 1rem, 4rem);
    width: auto;
}
/* .profile-group{} */

/* Location | Contact Info */
.footer-block-heading {
    font-size: clamp(0.875rem, 0.5vw + 0.5rem, 1.25rem);
    font-weight: 700;
    font-style: italic;
    color: var(--kiche-dark-green, --kiche-ochre);

}
.footer-address-block {
    font-style: normal;
    font-size: clamp(0.875rem, 0.5vw + 0.5rem, 1.25rem);
    line-height: 1.625;
    color: #6b7280;
    margin-bottom: 0.5rem;
}
.footer-contact-links {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}
.contact-phone-link {
    font-size: clamp(0.875rem, 0.5vw + 0.5rem, 1.25rem);
    color: #6b7280;
    text-decoration: none;
    transition: color 0.15s ease;
}
.contact-phone-link:hover {
    color: var(--kiche-light-orange);
}

/* Services | Regions | Themes */
.footer-nav-title {
    /* font-size: clamp(1rem, 0.5vw + 0.5rem, 1.5rem); */
    font-size: clamp(1rem, 0.4vw + 0.5rem, 1.5rem);
    /* font-size: 1rem; */
    font-weight: 600;
    text-transform: uppercase;
    color: var(--kiche-ochre);
    /* margin: 0 0 0.25rem 0; */
    letter-spacing: 0.05em;
    text-decoration: underline;
}

.footer-links-list {
    list-style-type: none;
    /* padding: 1.5rem 0;          padding-left: 2rem; */
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;

    /* flex-wrap: wrap; */
}

.footer-link {
    display: block;
    font-size: clamp(0.875rem, 0.5vw + 0.5rem, 1.25rem);
    font-weight: 400;
    color: #4b5563;
    text-decoration: none;
    line-height: 1.4;
    word-break: break-word;
    transition: color 0.15s ease, text-decoration 0.15s ease;
}

.footer-link:hover {
    color: #ef4444;
    text-decoration: underline;
}
.footer-links-list.distinct-multiline-list {
    line-height: 1.35;
}
.footer-title-link-wrapper {
    text-decoration: none;
    display: inline-block;
}
.privacy-policy-terms .footer-links-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;

    margin: 0;
    background-color: transparent;
    width: 100%;  /* width: 100vw; */
}

.footer-horizontal-divider {
    display: block;
    clear: both;
    margin: 0.875rem 0; /* margin: 40px 0; */
    border: 0; /* border: none; */
    width: 100%;
    /* border-top-color: var(--kiche-dark-green); border-top: 1px solid var(--kiche-brown); */
    height: 1px;
    background-color: color-mix(in srgb, var(--kiche-dark-green) 25%, transparent);
    opacity: 1;
}

.sub-footer-metadata-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.footer-copyright-text,
.footer-designer-text {
    font-size: 0.875rem;
    color: #6b7280;
    text-decoration: none;
}

.copyright-brand-gradient-anchor, .brand-gradient-text-link {
    font-weight: 600;
    text-decoration: none;
    background: linear-gradient(to right, var(--kiche-dark-orange), var(--kiche-light-green));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.copyright-brand-gradient-anchor:hover, .brand-gradient-text-link:hover {
    text-decoration: underline;
    background-color: var(--kiche-yellow);
}

.sub-footer-social-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}
.sub-social-anchor {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    box-sizing: border-box;
    border-radius: 50%;
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.sub-social-anchor:hover {
    transform: scale(1.1);
}
.sub-social-anchor .sub-vector-svg {
    display: block;
    width: 1rem;
    height: 1rem;
}

/* FB | X | LinkedIn | Tiktok | Youtube | Instagram Icons*/
.brand-facebook {
    background-color: var(--bg-facebook);
}
.brand-x {
    background-color: var(--bg-x-corp);
}
.brand-linkedin {
    background-color: var(--bg-linkedin);
}
.brand-tiktok {
    background-color: var(--bg-tiktok);
}
.brand-youtube {
    background-color: var(--bg-youtube);
}
.brand-instagram {
    background: linear-gradient(45deg, #f9ce34 0%, #ee2a7b 50%, #6228d7 100%);
}

/*~~~~~~~~~~~~~~~~ WHATSAPP FLOATING WIDGET ~~~~~~~~~~~~~~~~*/
/* Main Wrapper */
.whatsapp-widget-wrapper {
    position: fixed;
    bottom: 6.5rem;
    right: 1rem;
    z-index: var(--z-index-whatsapp);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.75rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Chat Popup Frame Box */
.whatsapp-chat-panel {
    width: clamp(300px, 90vw, 360px);   /* var(--wa-panel-width); */
    max-width: calc(100vw - 48px);
    background-color: #edf4f0;        /* var(--wa-bg-panel-body); */
    border: 1px solid #bbf7d0;        /* var(--wa-border-panel); */
    border-radius: 12px;                /* calc(var(--wa-curve-radius) + 4px) */;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    margin-bottom: 1rem;

    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: scale(0.85) translateY(20px);
    opacity: 0;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
        transform  0.3s cubic-bezier(0.4, 0, 0.2, 1),
        visibility  0.3s;
    pointer-events: none;
}
/* Dynamic Injector - reveal frame smoothly */
.whatsapp-chat-panel.is-visible {
    opacity: 1;
    /* visibility: visible; */
    transform: scale(1) translateY(0);
    pointer-events: auto;
}

/* Header Block 
.panel-header-bar {
    background-color: #25d366; background-color: var(--wa-brand-green); 
    background-color: #25d366;
    background-color: var(--wa-dark-green);
    color: #ffffff;
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
*/

.chat-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--wa-dark-green);
    padding: 0.75rem 1rem;
    color: #ffffff;
    width: 100%;
}
/* .header-brand-profile {} */
.header-brand-block {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    /* font-size: 1.25rem;
    font-weight: 700; */
}

.brand-title-text {
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0.3px;
}
/* 
.header-brand-profile img {
    display: block;
    height: auto;
} */

.btn-panel-close-trigger {
    background: rgba(0, 0, 0, 0.15); /* background: transparent; */
    border: none;
    color: #ffffff; /* color: rgba(255, 255, 255, 0.8); */
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 9999px;  /* border-radius: 50%; border-radius: 4px;*/
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    /* padding: 4px 8px; */
    display: inline-flex;  /* display: flex; */
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.btn-panel-close-trigger:hover,
.btn-panel-close-trigger:focus-visible  {
    background-color: rgba(0, 0, 0, 0.25);  /* background-color: rgba(255, 255, 255, 0.1); */
    color: #ffffff;
    outline: none;
}

/* Body Stack */
/* .panel-interface-body {} */
.chat-panel-body {
    /* padding: 1rem; */
    background-color: var(--wa-light-bg);
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.whatsapp-chat-panel.is-open {
    opacity: 1;
    transform: scale(1);
}

/* .header-brand-block {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
} */

.brand-whatsapp-icon {
    display: block;
    width: 2rem;
    height: 2rem;
    object-fit: contain;
    /* display: block;
    height: auto; */
}
.header-brand-block {
    display: flex;
    align-items: center;
    gap: 10px;
}

.brand-title-text {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.3px;
}
/* .chat-panel-body {
    padding: 1rem;
} */

.chat-message-bubble-card {
    border-radius: 1.5rem; /* border-radius: 0 12px 12px 12px; */
    background-color: #ffffff;
    padding: 1rem 1.25rem;  /* padding: 14px; */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);  /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); */
    color: #334155;
    position: relative;
    max-width: 90%;
}

.chat-message-bubble-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 0;
    border-color: transparent #ffffff transparent transparent;
}

.bubble-greeting-heading {
    font-size: 1.25rem;
    font-weight: 600;
    /* margin: 0 0 0.5rem 0; */

    /* font-weight: 700;
    color: var(--wa-dark-green);
    margin: 0 0 6px 0;
    font-size: 14px; */
}

.bubble-body-copy {
    font-size: 1rem;
    line-height: 1.75;
    margin: 0;

    /* color: var(--wa-text-dark);
    margin: 0;
    font-size: 14px;
    line-height: 1.5; */
}
.price-inclexcl-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
.bubble-signature-text {
    font-size: 1.125rem;
    margin: 1rem 0 0 0;

    /*
    display: block;
    text-align: right;
    font-size: 11px;
    color: var(--wa-text-muted);
    margin: 8px 0 0 0;
    font-style: italic;
    */
}
.chat-input-row {
    margin-top: 1rem;
    /* width: 100%; */
}
.chat-input-textarea-control {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border-radius: 1rem;
    border: 1px solid #e2e8f0;
    background-color: #ffffff;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    color: #334155;
    outline: none;
    resize: none;
    font-family: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;

    /* 
    width: 100%;
    padding: 12px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    font-size: 14px;
    resize: none;
    font-family: inherit;
    box-sizing: border-box;
    outline: none;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    */

}
.chat-input-textarea-control:focus {
    border-color: #4ade80;
    box-shadow: 0 0 0 3px rgba(220, 252, 231, 0.5);

    /* 
    border-color: var(--wa-dark-green);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 0 0 3px rgba(18, 140, 126, 0.15); 
    */
}
/* CTA Routing */
.btn-chat-submit-action {
    display: inline-flex; /* display: flex; */
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
    border: none;
    border-radius: 0.5rem;
    background-color: #25d366;
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: background-color 0.2s ease;

    /* 
    background-color: var(--wa-brand-green);
    color: #ffffff;
    border: none;
    border-radius: 8px;
    padding: 12px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 3px 6px rgba(37, 211, 102, 0.3);
    transition: background-color 0.2s ease, transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s ease;
    */
}
.btn-chat-submit-action:hover {
    background-color: var(--kiche-light-green); /* background-color: #20ba5a; */
    box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
}

.btn-chat-submit-action:active {
    transform: scale(0.98);
}

.whatsapp-launcher-trigger-btn {
    position: relative;
    margin-left: auto;
    display: flex;
    width: 4rem;
    height: 4rem;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background-color: #25d366;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    /* animation: whatsapp-cta-bounce 5s infinite ease-in-out; */
    /* transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); */

    /* 
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: var(--wa-brand-green);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
    transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease, visibility 0.2s;

    */
}
.whatsapp-launcher-trigger-btn:hover {
    transform: scale(1.05);
    animation-play-state: paused;
}

.whatsapp-launcher-trigger-btn:active {
    transform: scale(0.95);
}

/* Hide launcher when pane is active */
.whatsapp-launcher-trigger-btn.is-hidden {
    opacity: 0;
    visibility: hidden;
    transform: scale(0.8) rotate(-45deg);
    pointer-events: none;
}

.launcher-icon-img {
    position: relative;
    z-index: 5;
    display: block;
    width: 2.25rem;
    height: 2.25rem;
}

/* Pulse Ring Animations */
.launcher-pulse-ring {
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: 50%;
    background-color: rgba(37, 211, 102, 0.2);
    animation: ring-pulse-grow 2s infinite ease-out;

    /* position: absolute;
    width: 100%;
    height: 100%;
    background-color: var(--wa-brand-green);
    border-radius: 50%;
    z-index: -1;
    animation: wa-ring-pulse-wave 2s cubic-bezier(0.24, 0, 0.38, 1) infinite; */
}

@keyframes wa-ring-pulse-wave {
    0% {
        transform: scale(1);
        opacity: 0.65;
    }
    100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

@keyframes whatsapp-cta-bounce {
    0%, 25%, 33%, 41%, 100% { transform: translateY(0); }
    28% { transform: translateY(-12px); }
    36% { transform: translateY(-6px); }
    42% { transform: translateY(0); }
}

.whatsapp-cta-bounce {
    animation: whatsapp-cta-bounce 9s ease-in-out infinite;
    transform-origin: center bottom;
    will-change: transform;
}

/* Adaptations for Tight Viewports */
@media (max-width: 480px) {
    .whatsapp-widget-wrapper {
        bottom: 16px;
        right: 16px;
    }
    .whatsapp-chat-panel {
        width: calc(100vw - 32px);
    }
}



/*~~~~~~~~~~~~~~~~ MOBILE (Landscape) | SMALL TABLETTablet SCREEN ~~~~~~~~~~~~~~~~*/
@media (min-width: 480px) {
    .form-responsive-grid,
    .form-travellers-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .privacy-policy-terms .footer-links-list {
        flex-direction: row;
        justify-content: space-between;
    }
}

/*~~~~~~~~~~~~~~~~ MOBILE (Landscape) | SMALL TABLETTablet SCREEN ~~~~~~~~~~~~~~~~*/
@media (min-width: 640px) {
    .flight-alert__container {
        grid-template-columns:
            minmax(180px, 0.8fr) minmax(0, 2fr) auto;

        gap: 1rem;
    }
    .packages-responsive-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        /* Clean 2-column layout split on tablet/desktop displays */
    }
    .ribbon-container-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .sub-footer-social-strip {
        gap: 1.5rem;
    }

    .whatsapp-chat-panel {
        width: 22.5rem;
    }

    /* .modal-backdrop, 
    .drawer-backdrop,
    .drawer-surface,*/
    .whatsapp-chat-panel,
    .tab-panel-node {
        background-color: var(--badge-bg-yellow);        /*Placeholder*/
    }

    .cropper-view-box,
    .cropper-face {
        border-radius: 50%;
    }

    /* .privacy-policy-terms .footer-links-list {
        flex-direction: row;
        justify-content: space-between;
    } */
}



/*~~~~~~~~~~~~~~~~ HAMBURGER NAVBAR ~~~~~~~~~~~~~~~~*/
@media (min-width: 768px) {
    
    /* Flight Alerts */
    .flight-alert__container {
        grid-template-columns: auto 1fr auto; 
        gap: 1.5rem;
    }
    .flight-alert {
        left: auto;
        right: 1.5rem;
        bottom: 1.5rem;
        width: 100%;
        /* max-width: 400px; */
        border: 1px solid rgb(229 231 235 / 0.8);
        border-radius: 0.75rem;
        box-shadow: 0 10px 25px rgb(0 0 0 / 0.15);
        transform: translateY(150%); /* Slides up from the corner instead */
    }
    .flight-alert__actions {
        justify-content: center;
    }
    .mobile-header {
        display: none !important;
    }

    .site-desktop-topbar-wrapper {
        display: flex !important;
    }
    .site-header-sticky {
        display: block;
    } 


    /* .site-global-footer {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
    } */

    /* .site-global-footer {
        display: flex;
        align-items: flex-start;
    } */

    
}

/*~~~~~~~~~~~~~~~~  ~~~~~~~~~~~~~~~~*/
@media (min-width: 1024px) {

     /*-- Flight Update Alert --*/
    .flight-alert {
        padding-block: 0.875rem;
    }
    .flight-alert__container {
        width: min(100% - 3rem, 1400px);
        grid-template-columns: minmax(220px, 0.75fr) minmax(0, 2.25fr) auto;
        gap: 1.5rem;
    }
    .flight-alert__title {
        font-size: 1rem;
    }
    .flight-alert__message p {
        font-size: 0.9rem;
    }
    /* .site-header-sticky {
        display: block;
    }  */

    .mobile-header {
        display: none !important;
    }

    /* .site-desktop-contact-icon {
        height: 2rem;
        width: 2rem;
        object-fit: contain;
    } */


    
    .sub-footer-metadata-row {
        flex-direction: row;
        justify-content: space-between;
    }
    
        /*~~~~~~~~~~~~~~~ Top navbar ~~~~~~~~~~~~~~~*/
    

    .footer-max-container {
        /* padding: 2rem 1.5rem; */
        display: grid;

        grid-template-columns: repeat(4, 1fr);
        
        gap: 1.5rem;
        /* align-items: center;
        justify-content: space-between; */
    }

    .footer-horizontal-divider {
        margin: 1.5rem 0;
    }
}

/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Large Desktop / Ultrawide %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/
@media (min-width: 1280px) {


    .flight-alert__container {
        width: min(100% - 4rem, 1500px);
    }

    /* .site-desktop-topbar {
        min-height: 104px;
    } */
/* 
    .footer-columns-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 1.5rem;
    }
    .footer-columns-grid .col-span-double {
        grid-column: span 2 / span 2;
    } */

    .awards-badge-flex-row {
        flex-direction: column;
        align-items: flex-start;
    }


}




/* =========================================================
   EXTRA LARGE SCREENS
   1440px+
   ========================================================= */
/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Large Desktop / Ultrawide %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/
@media (min-width: 1440px) {

    .site-desktop-topbar {
        width: min(100% - 3rem, 1500px);
        gap: 2.5rem;
    }

    /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/


    /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/
}


/* =========================================================
   EXTRA EXTRA LARGE SCREENS
   1920px+
   ========================================================= */

@media (min-width: 1920px) {

    .site-desktop-topbar {
        width: min(100% - 4rem, 1600px);
    }

}



/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/
    .flight-alert,
    .skip-link,
    .flight-alert__close {
        transition: none;
    }


    /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/
    .mobile-navigation__panel,
    .mobile-navigation__overlay,
    .mobile-nav-toggle__icon,
    .mobile-header__cta,
    .mobile-navigation__join {
        transition: none;
    }

    /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/
    .desktop-search-input,
    .desktop-search-button,
    .plan-trip-cta,
    .quote-cta,
    .quote-cta span,
    .search-suggestion {
        transition: none;
    }


    /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/
    /* MAIN Section */
    .whatsapp-cta-bounce {
        animation: none !important;
    }

    /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

    .whatsapp-keyframe-pulse {
        animation: none;
    }
    

}