/* ==========================================================
   AURORA THEME
   Fresh Turquoise Premium Theme
========================================================== */

:root,
.theme-aurora{

    /* ======================================================
       BRAND
    ====================================================== */

    --brand-primary:#06b6b8;
    --brand-secondary:#0f8b8d;
    --brand-accent:#15d4c7;

   /* ======================================================
      SURFACE
   ====================================================== */

   --surface-primary:#f8fcfc;

   --surface-secondary:#ffffff;

   --surface-tertiary:#eef9f9;

   --surface-dark:#0d3d42;

   --surface-gradient:linear-gradient(135deg, #1b4c4d 0%, #4e9192 50%, #195f5a 100%);

   --surface-highlight:linear-gradient(
       135deg,
       #e9fffe,
       #d7feff
   );

   --surface-glass:rgba(255,255,255,.72);


   /* ======================================================
      ON SURFACE (Text according to Background)
   ====================================================== */
   
   --on-surface-primary:#12353a;
   
   --on-surface-secondary:#35595f;
   
   --on-surface-tertiary:#5b7a80;
   
   --on-surface-dark:#ffffff;
   
   /* For Hero Gradient (DON'T CHANGE GRADIENT) */
   --on-surface-gradient:#ffffff;
   
   --on-surface-glass:#17353d;
   
   
   /* ======================================================
      TEXT (Backward Compatibility)
   ====================================================== */
   
   --text-primary:var(--on-surface-primary);
   
   --text-secondary:#527178;
   
   --text-muted:#78949a;
   
   --text-light:#ffffff;
   
   --text-accent:#9ef8ef;
   
   
   /* ======================================================
      BORDER
   ====================================================== */
   
   --border-light:rgba(255,255,255,.16);
   
   --border-primary:#d7eceb;
   
   --border-secondary:rgba(6,182,184,.14);
   
   
   /* ======================================================
      ICON
   ====================================================== */
   
   --icon-bg:rgba(255,255,255,.14);
   
   --icon-color:#ffffff;
   
   --icon-hover-color:#17353d;
   
   
   /* ======================================================
      BUTTON
   ====================================================== */
   
   --button-primary-bg:linear-gradient(
       135deg,
       #06b6b8,
       #0f8b8d
   );
   
   --button-primary-hover:linear-gradient(
       135deg,
       #08989a,
       #0a7677
   );
   
   --button-primary-text:#ffffff;
   
   
   /* ======================================================
      SHADOW
   ====================================================== */
   
   --shadow-sm:
       0 6px 16px rgba(9,98,103,.10);
   
   --shadow-md:
       0 14px 36px rgba(9,98,103,.16);
   
   --shadow-lg:
       0 24px 60px rgba(9,98,103,.22);
   
   
   /* ======================================================
      SECTION
   ====================================================== */
   
   --section-feature-bg:var(--surface-gradient);
   
   /* Hero Text */
   --on-section-feature:#ffffff;
   
   --section-primary-bg:var(--surface-primary);
   
   --section-secondary-bg:var(--surface-tertiary);
   
   --section-dark-bg:var(--surface-dark);
   
   --section-glass-bg:var(--surface-glass);
   
   
   /* ======================================================
      NAVBAR
   ====================================================== */
   
   --navbar-background:rgba(255,255,255,.94);
   
   --navbar-border:rgba(6,182,184,.10);
   
   
   /* ======================================================
      DESTINATION
   ====================================================== */
   
   --destination-title-color:#ffffff;
   
   --destination-title-shadow:
       0 3px 14px rgba(0,0,0,.45),
       0 8px 28px rgba(0,0,0,.28);
   
    /* Glass */
    --surface-glass:rgba(255,255,255,.72);

    /* ======================================================
       TEXT
    ====================================================== */

    --border-light:rgba(255,255,255,.18);

    /* ======================================================
       ICON
    ====================================================== */
    --icon-bg:rgba(255,255,255,.10);
    --icon-color:#ffffff;
    --icon-hover-color:#17353d;



    /* ======================================================
       BUTTON
    ====================================================== */

    --button-primary-bg:linear-gradient(
        135deg,
        #06b6b8,
        #0f8b8d
    );

    --button-primary-hover:linear-gradient(
        135deg,
        #0f8b8d,
        #067b7d
    );

    --button-primary-text:#ffffff;

    /* ======================================================
       BORDER
    ====================================================== */

    --border-primary:#d7eceb;

    --border-secondary:rgba(15,139,141,.15);

    /* ======================================================
       SHADOW
    ====================================================== */

    --shadow-sm:
        0 4px 12px rgba(15,139,141,.08);

    --shadow-md:
        0 10px 30px rgba(15,139,141,.15);

    --shadow-lg:
        0 20px 50px rgba(15,139,141,.22);

    /* ======================================================
       RADIUS
    ====================================================== */

    --radius-sm:8px;

    --radius-md:14px;

    --radius-lg:22px;

    /* ======================================================
       SECTIONS
    ====================================================== */

    /* Hero / Travel Style / Premium Banner */
    --section-feature-bg:var(--surface-gradient);

    /* Light Sections */
    --section-primary-bg:var(--surface-primary);

    /* Alternate Sections */
    --section-secondary-bg:var(--surface-tertiary);

    /* Dark Sections */
    --section-dark-bg:var(--surface-dark);

    /* Glass Overlay */
    --section-glass-bg:var(--surface-glass);


    --radius-section-top:100px 100px 0 0;
    --section-feature-padding:10px 50px 70px;
    --section-overlap:-91px;

    /* ======================================================
       LAYOUT
    ====================================================== */
    /* ==========================
       TRANSITION
    ========================== */

    --transition:.35s ease;

    /* ======================================================
       SPACING
    ====================================================== */

    --space-0:0px;
    --space-1:4px;
    --space-2:8px;
    --space-3:12px;
    --space-4:16px;
    --space-5:20px;
    --space-6:24px;
    --space-7:32px;
    --space-8:40px;

    /* ======================================================
       RADIUS
    ====================================================== */

    --radius-none:0px;
    --radius-sm:8px;
    --radius-md:12px;
    --radius-lg:16px;
    --radius-xl:24px;
    --radius-full:9999px;


    /* ======================================================
       NAVBAR
    ====================================================== */

    --navbar-height:76px;
    --navbar-radius:10px;
    --navbar-margin-top:0px;
    --navbar-padding:0px;
    --navbar-left:50%;
    --navbar-max-width:1400px;

    /* ======================================================
       CONTAINER
    ====================================================== */

    --container-width:1320px;
    --container-padding:0 20px;
    --section-padding:90px;
    

    --destination-title-color:#fff;
   --destination-title-shadow:
       0 2px 10px rgba(0,0,0,.45),
       0 5px 18px rgba(0,0,0,.35);

   --destination-title-size:24px;

   --destination-title-weight:700;

   --destination-title-bottom:20px;

   --destination-title-left:20px;

}