html { scroll-behavior: smooth; }
    :root {
    --charcoal: #202124;
    --gold1: #d4af37;
    --gold2: #f5d77c;
    --gold3: #f2e6c2;
    --white: #fff;
    }
    body {
    background-image:
    linear-gradient(180deg, rgba(12,12,12,0.7) 0%, rgba(26,26,26,0.7) 100%),
    url('IMG/AIREA%20Website%20images.png');
    background-size: cover, cover;
    background-repeat: no-repeat, no-repeat;
    background-position: top, top;
    background-attachment: fixed, fixed;
}
    .btn-ghost { border: 1px solid rgba(255,255,255,.18); background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); }
    .locked { cursor: not-allowed; opacity: .6; }
}
    .font-serif { font-family: 'Playfair Display', serif; }
    .gradient-text {
    background: linear-gradient(135deg, #fff 0%, #d4af37 50%, #fff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    }
    .gold-glow {
    box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);
    }
    .glass, .glass-effect {
    background: rgba(32,33,36,0.7);
    backdrop-filter: blur(14px);
    border-radius: 1.25rem;
    box-shadow: 0 4px 32px 0 rgba(0,0,0,0.18);
    border: 1px solid rgba(255,255,255,0.08);
    position: relative;
    overflow: hidden;
    }
    .glass::before, .glass-effect::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at top, var(--gold1) 0%, transparent 70%);
    opacity: 0.08;
    pointer-events: none;
    z-index: 0;
    }
    .luxury-button {
    background: linear-gradient(135deg, #d4af37 0%, #f4e4a6 50%, #d4af37 100%);
    color: #0a0a0a;
    font-weight: 600;
    border-radius: 9999px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 16px 0 rgba(212,175,55,0.08);
    }
    .luxury-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(212,175,55,0.4);
    background: linear-gradient(135deg, #f4e4a6 0%, #d4af37 100%);
    }
    .luxury-button:focus {
    outline: 2px solid var(--gold1);
    outline-offset: 2px;
    }
    .cost-highlight {
    background: linear-gradient(135deg, rgba(239,68,68,0.10) 0%, rgba(239,68,68,0.05) 100%);
    border-left: 3px solid #ef4444;
    border-radius: 1rem;
    }
    .pulse {
    animation: pulse-gold 2s infinite;
    }
    @keyframes pulse-gold {
    0%, 100% { box-shadow: 0 0 20px rgba(212,175,55,0.3); }
    50% { box-shadow: 0 0 40px rgba(212,175,55,0.6); }
    }
    .scroll-indicator {
    animation: bounce 2s infinite;
    }
    @keyframes bounce {
    0%, 20%, 53%, 80%, 100% { transform: translate3d(0,0,0); }
    40%, 43% { transform: translate3d(0,-30px,0); }
    70% { transform: translate3d(0,-15px,0); }
    90% { transform: translate3d(0,-4px,0); }
    }
    .luxury-nav {
    background: rgba(10,10,10,0.9);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    background-color: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(4px);
    }
    .standout-cta {
    font-size: 2rem;
    font-weight: 700;
    animation: pop-in 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    text-shadow: 0 0 20px rgba(212,175,55,0.5);
    }
    @keyframes pop-in {
    0% { transform: scale(0.8); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
    }
    .counter {
    transition: all 0.3s ease;
    }
    .typewriter {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    }
    .typewriter.visible {
    opacity: 1;
    }
    @media (prefers-reduced-motion: reduce) {
    * {
    animation: none !important;
    transition: none !important;
    }
    /* Section Divider Gold Gradient Line */
    .section-divider {
    width: 100%;
    height: 1px;
    margin: 2.5rem 0 0.5rem 0;
    background: linear-gradient(to right, #bfa76f, #e6d9b0);
    border: none;
    opacity: 0.85;
    pointer-events: none;
    z-index: 0;
    } 
    }    
    
    *, ::before, ::after{
    --tw-border-spacing-x:0;
    --tw-border-spacing-y:0;
    --tw-translate-x:0;
    --tw-translate-y:0;
    --tw-rotate:0;
    --tw-skew-x:0;
    --tw-skew-y:0;
    --tw-scale-x:1;
    --tw-scale-y:1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness:proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width:0px;
    --tw-ring-offset-color:#fff;
    --tw-ring-color:rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow:0 0 #0000;
    --tw-ring-shadow:0 0 #0000;
    --tw-shadow:0 0 #0000;
    --tw-shadow-colored:0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style: 
    }
    
    ::backdrop{
    --tw-border-spacing-x:0;
    --tw-border-spacing-y:0;
    --tw-translate-x:0;
    --tw-translate-y:0;
    --tw-rotate:0;
    --tw-skew-x:0;
    --tw-skew-y:0;
    --tw-scale-x:1;
    --tw-scale-y:1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness:proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width:0px;
    --tw-ring-offset-color:#fff;
    --tw-ring-color:rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow:0 0 #0000;
    --tw-ring-shadow:0 0 #0000;
    --tw-shadow:0 0 #0000;
    --tw-shadow-colored:0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style: 
    }
    
    /* ! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com */
    *,::after,::before{
    box-sizing:border-box;
    border-width:0;
    border-style:solid;
    border-color:#e5e7eb
    }
    
    ::after,::before{
    --tw-content:''
    }
    
    :host,html{
    line-height:1.5;
    -webkit-text-size-adjust:100%;
    -moz-tab-size:4;
    tab-size:4;
    font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-feature-settings:normal;
    font-variation-settings:normal;
    -webkit-tap-highlight-color:transparent
    }
    
    body{
    margin:0;
    line-height:inherit
    }
    
    hr{
    height:0;
    color:inherit;
    border-top-width:1px
    }
    
    abbr:where([title]){
    -webkit-text-decoration:underline dotted;
    text-decoration:underline dotted
    }
    
    h1,h2,h3,h4,h5,h6{
    font-size:inherit;
    font-weight:inherit
    }
    
    a{
    color:inherit;
    text-decoration:inherit
    }
    
    b,strong{
    font-weight:bolder
    }
    
    code,kbd,pre,samp{
    font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-feature-settings:normal;
    font-variation-settings:normal;
    font-size:1em
    }
    
    small{
    font-size:80%
    }
    
    sub,sup{
    font-size:75%;
    line-height:0;
    position:relative;
    vertical-align:baseline
    }
    
    sub{
    bottom:-.25em
    }
    
    sup{
    top:-.5em
    }
    
    table{
    text-indent:0;
    border-color:inherit;
    border-collapse:collapse
    }
    
    button,input,optgroup,select,textarea{
    font-family:inherit;
    font-feature-settings:inherit;
    font-variation-settings:inherit;
    font-size:100%;
    font-weight:inherit;
    line-height:inherit;
    letter-spacing:inherit;
    color:inherit;
    margin:0;
    padding:0
    }
    
    button,select{
    text-transform:none
    }
    
    button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){
    -webkit-appearance:button;
    background-color:transparent;
    background-image:none
    }
    
    :-moz-focusring{
    outline:auto
    }
    
    :-moz-ui-invalid{
    box-shadow:none
    }
    
    progress{
    vertical-align:baseline
    }
    
    ::-webkit-inner-spin-button,::-webkit-outer-spin-button{
    height:auto
    }
    
    [type=search]{
    -webkit-appearance:textfield;
    outline-offset:-2px
    }
    
    ::-webkit-search-decoration{
    -webkit-appearance:none
    }
    
    ::-webkit-file-upload-button{
    -webkit-appearance:button;
    font:inherit
    }
    
    summary{
    display:list-item
    }
    
    blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{
    margin:0
    }
    
    fieldset{
    margin:0;
    padding:0
    }
    
    legend{
    padding:0
    }
    
    menu,ol,ul{
    list-style:none;
    margin:0;
    padding:0
    }
    
    dialog{
    padding:0
    }
    
    textarea{
    resize:vertical
    }
    
    input::placeholder,textarea::placeholder{
    opacity:1;
    color:#9ca3af
    }
    
    [role=button],button{
    cursor:pointer
    }
    
    :disabled{
    cursor:default
    }
    
    audio,canvas,embed,iframe,img,object,svg,video{
    display:block;
    vertical-align:middle
    }
    
    img,video{
    max-width:100%;
    height:auto
    }
    
    [hidden]:where(:not([hidden=until-found])){
    display:none
    }
    
    .pointer-events-none{
    pointer-events:none
    }
    
    .visible{
    visibility:visible
    }
    
    .fixed{
    position:fixed
    }
    
    .absolute{
    position:absolute
    }
    
    .relative{
    position:relative
    }
    
    .inset-0{
    inset:0px
    }
    
    .left-1\/2{
    left:50%
    }
    
    .right-4{
    right:1rem
    }
    
    .top-0{
    top:0px
    }
    
    .top-1\/2{
    top:50%
    }
    
    .top-4{
    top:1rem
    }
    
    .z-10{
    z-index:10
    }
    
    .z-50{
    z-index:50
    }
    
    .mx-auto{
    margin-left:auto;
    margin-right:auto
    }
    
    .mb-0{
    margin-bottom:0px
    }
    
    .mb-10{
    margin-bottom:2.5rem
    }
    
    .mb-12{
    margin-bottom:3rem
    }
    
    .mb-2{
    margin-bottom:0.5rem
    }
    
    .mb-3{
    margin-bottom:0.75rem
    }
    
    .mb-4{
    margin-bottom:1rem
    }
    
    .mb-6{
    margin-bottom:1.5rem
    }
    
    .mb-8{
    margin-bottom:2rem
    }
    
    .ml-2{
    margin-left:0.5rem
    }
    
    .mt-12{
    margin-top:3rem
    }
    
    .mt-16{
    margin-top:4rem
    }
    
    .mt-2{
    margin-top:0.5rem
    }
    
    .mt-4{
    margin-top:1rem
    }
    
    .mt-6{
    margin-top:1.5rem
    }
    
    .mt-8{
    margin-top:2rem
    }
    
    .block{
    display:block
    }
    
    .inline-block{
    display:inline-block
    }
    
    .flex{
    display:flex
    }
    
    .grid{
    display:grid
    }
    
    .hidden{
    display:none
    }
    
    .aspect-video{
    aspect-ratio:16 / 9
    }
    
    .h-2{
    height:0.5rem
    }
    
    .h-3{
    height:0.75rem
    }
    
    .h-8{
    height:2rem
    }
    
    .h-\[600px\]{
    height:600px
    }
    
    .h-full{
    height:100%
    }
    
    .h-screen{
    height:100vh
    }
    
    .h-\[50vh\]{
    height:50vh
    }
    
    .min-h-\[2\.5rem\]{
    min-height:2.5rem
    }
    
    .w-2{
    width:0.5rem
    }
    
    .w-3{
    width:0.75rem
    }
    
    .w-8{
    width:2rem
    }
    
    .w-\[400px\]{
    width:400px
    }
    
    .w-\[500px\]{
    width:500px
    }
    
    .w-full{
    width:100%
    }
    
    .max-w-2xl{
    max-width:42rem
    }
    
    .max-w-3xl{
    max-width:48rem
    }
    
    .max-w-4xl{
    max-width:56rem
    }
    
    .max-w-6xl{
    max-width:72rem
    }
    
    .max-w-7xl{
    max-width:80rem
    }
    
    .max-w-lg{
    max-width:32rem
    }
    
    .max-w-md{
    max-width:28rem
    }
    
    .max-w-xl{
    max-width:36rem
    }
    
    .flex-1{
    flex:1 1 0%
    }
    
    .-translate-x-1\/2{
    --tw-translate-x:-50%;
    transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }
    
    .-translate-y-1\/2{
    --tw-translate-y:-50%;
    transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }
    
    .transform{
    transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }
    
    .cursor-pointer{
    cursor:pointer
    }
    
    .grid-cols-1{
    grid-template-columns:repeat(1, minmax(0, 1fr))
    }
    
    .grid-cols-2{
    grid-template-columns:repeat(2, minmax(0, 1fr))
    }
    
    .flex-col{
    flex-direction:column
    }
    
    .items-start{
    align-items:flex-start
    }
    
    .items-center{
    align-items:center
    }
    
    .justify-center{
    justify-content:center
    }
    
    .justify-between{
    justify-content:space-between
    }
    
    .gap-16{
    gap:4rem
    }
    
    .gap-4{
    gap:1rem
    }
    
    .gap-6{
    gap:1.5rem
    }
    
    .gap-8{
    gap:2rem
    }
    
    .space-x-3 > :not([hidden]) ~ :not([hidden]){
    --tw-space-x-reverse:0;
    margin-right:calc(0.75rem * var(--tw-space-x-reverse));
    margin-left:calc(0.75rem * calc(1 - var(--tw-space-x-reverse)))
    }
    
    .space-x-8 > :not([hidden]) ~ :not([hidden]){
    --tw-space-x-reverse:0;
    margin-right:calc(2rem * var(--tw-space-x-reverse));
    margin-left:calc(2rem * calc(1 - var(--tw-space-x-reverse)))
    }
    
    .space-y-2 > :not([hidden]) ~ :not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))
    }
    
    .overflow-hidden{
    overflow:hidden
    }
    
    .scroll-smooth{
    scroll-behavior:smooth
    }
    
    .whitespace-nowrap{
    white-space:nowrap
    }
    
    .rounded{
    border-radius:0.25rem
    }
    
    .rounded-2xl{
    border-radius:1rem
    }
    
    .rounded-3xl{
    border-radius:1.5rem
    }
    
    .rounded-full{
    border-radius:9999px
    }
    
    .rounded-lg{
    border-radius:0.5rem
    }
    
    .rounded-xl{
    border-radius:0.75rem
    }
    
    .border{
    border-width:1px
    }
    
    .border-t{
    border-top-width:1px
    }
    
    .border-\[var\(--gold1\)\]{
    border-color:var(--gold1)
    }
    
    .border-\[var\(--gold2\)\]{
    border-color:var(--gold2)
    }
    
    .border-gray-800{
    --tw-border-opacity:1;
    border-color:rgb(31 41 55 / var(--tw-border-opacity, 1))
    }
    
    .border-white{
    --tw-border-opacity:1;
    border-color:rgb(255 255 255 / var(--tw-border-opacity, 1))
    }
    
    .bg-\[\#222\]{
    --tw-bg-opacity:1;
    background-color:rgb(34 34 34 / var(--tw-bg-opacity, 1))
    }
    
    .bg-\[var\(--dark-bg\)\]{
    background-color:var(--dark-bg)
    }
    
    .bg-\[var\(--dark-bg-alt\)\]{
    background-color:var(--dark-bg-alt)
    }
    
    .bg-\[var\(--gold1\)\]{
    background-color:var(--gold1)
    }
    
    .bg-black{
    --tw-bg-opacity:1;
    background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))
    }
    
    .bg-transparent{
    background-color:transparent
    }
    
    .bg-opacity-40{
    --tw-bg-opacity:0.4
    }
    
    .bg-\[url\(\'IMG\/AIREA\%20Website\%20images\.png\'\)\]{
    background-image:url('IMG/AIREA%20Website%20images.png')
    }
    
    .bg-\[length\:100\%_auto\]{
    background-size:100% auto
    }
    
    .bg-top{
    background-position:top
    }
    
    .bg-no-repeat{
    background-repeat:no-repeat
    }
    
    .p-4{
    padding:1rem
    }
    
    .p-6{
    padding:1.5rem
    }
    
    .p-8{
    padding:2rem
    }
    
    .px-10{
    padding-left:2.5rem;
    padding-right:2.5rem
    }
    
    .px-2{
    padding-left:0.5rem;
    padding-right:0.5rem
    }
    
    .px-3{
    padding-left:0.75rem;
    padding-right:0.75rem
    }
    
    .px-4{
    padding-left:1rem;
    padding-right:1rem
    }
    
    .px-6{
    padding-left:1.5rem;
    padding-right:1.5rem
    }
    
    .px-8{
    padding-left:2rem;
    padding-right:2rem
    }
    
    .py-1{
    padding-top:0.25rem;
    padding-bottom:0.25rem
    }
    
    .py-2{
    padding-top:0.5rem;
    padding-bottom:0.5rem
    }
    
    .py-20{
    padding-top:5rem;
    padding-bottom:5rem
    }
    
    .py-3{
    padding-top:0.75rem;
    padding-bottom:0.75rem
    }
    
    .py-4{
    padding-top:1rem;
    padding-bottom:1rem
    }
    
    .py-12{
    padding-top:3rem;
    padding-bottom:3rem
    }
    
    .pt-12{
    padding-top:3rem
    }
    
    .text-center{
    text-align:center
    }
    
    .font-mono{
    font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace
    }
    
    .font-serif{
    font-family:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif
    }
    
    .text-2xl{
    font-size:1.5rem;
    line-height:2rem
    }
    
    .text-3xl{
    font-size:1.875rem;
    line-height:2.25rem
    }
    
    .text-4xl{
    font-size:2.25rem;
    line-height:2.5rem
    }
    
    .text-6xl{
    font-size:3.75rem;
    line-height:1
    }
    
    .text-lg{
    font-size:1.125rem;
    line-height:1.75rem
    }
    
    .text-sm{
    font-size:0.875rem;
    line-height:1.25rem
    }
    
    .text-xl{
    font-size:1.25rem;
    line-height:1.75rem
    }
    
    .font-bold{
    font-weight:700
    }
    
    .font-extrabold{
    font-weight:800
    }
    
    .font-light{
    font-weight:300
    }
    
    .font-normal{
    font-weight:400
    }
    
    .font-semibold{
    font-weight:600
    }
    
    .italic{
    font-style:italic
    }
    
    .leading-relaxed{
    line-height:1.625
    }
    
    .leading-snug{
    line-height:1.375
    }
    
    .leading-tight{
    line-height:1.25
    }
    
    .tracking-wide{
    letter-spacing:0.025em
    }
    
    .tracking-wider{
    letter-spacing:0.05em
    }
    
    .tracking-widest{
    letter-spacing:0.1em
    }
    
    .text-\[var\(--gold1\)\]{
    color:var(--gold1)
    }
    
    .text-\[var\(--gold2\)\]{
    color:var(--gold2)
    }
    
    .text-\[var\(--gold3\)\]{
    color:var(--gold3)
    }
    
    .text-black{
    --tw-text-opacity:1;
    color:rgb(0 0 0 / var(--tw-text-opacity, 1))
    }
    
    .text-gray-400{
    --tw-text-opacity:1;
    color:rgb(156 163 175 / var(--tw-text-opacity, 1))
    }
    
    .text-white{
    --tw-text-opacity:1;
    color:rgb(255 255 255 / var(--tw-text-opacity, 1))
    }
    
    .opacity-0{
    opacity:0
    }
    
    .opacity-20{
    opacity:0.2
    }
    
    .opacity-30{
    opacity:0.3
    }
    
    .shadow-lg{
    --tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }
    
    .shadow-md{
    --tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }
    
    .transition{
    transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration:150ms
    }
    
    .transition-colors{
    transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
    transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration:150ms
    }
    
    .hover\:bg-\[var\(--gold1\)\]:hover{
    background-color:var(--gold1)
    }
    
    .hover\:text-black:hover{
    --tw-text-opacity:1;
    color:rgb(0 0 0 / var(--tw-text-opacity, 1))
    }
    
    .hover\:text-\[var\(--gold1\)\]:hover{
    color:var(--gold1)
    }
    
    .hover\:shadow-2xl:hover{
    --tw-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);
    --tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }
    
    .hover\:brightness-110:hover{
    --tw-brightness:brightness(1.1);
    filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
    }
    
    .focus\:outline-none:focus{
    outline:2px solid transparent;
    outline-offset:2px
    }
    
    .focus\:ring-2:focus{
    --tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)
    }
    
    .focus\:ring-\[var\(--gold1\)\]:focus{
    --tw-ring-color:var(--gold1)
    }
    
    @media (min-width: 768px){
    .md\:mb-0{
    margin-bottom:0px
    }
    
    .md\:flex{
    display:flex
    }
    
    .md\:grid-cols-3{
    grid-template-columns:repeat(3, minmax(0, 1fr))
    }
    
    .md\:grid-cols-4{
    grid-template-columns:repeat(4, minmax(0, 1fr))
    }
    
    .md\:flex-row{
    flex-direction:row
    }
    
    .md\:space-x-6 > :not([hidden]) ~ :not([hidden]){
    --tw-space-x-reverse:0;
    margin-right:calc(1.5rem * var(--tw-space-x-reverse));
    margin-left:calc(1.5rem * calc(1 - var(--tw-space-x-reverse)))
    }
    
    .md\:space-y-0 > :not([hidden]) ~ :not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(0px * var(--tw-space-y-reverse))
    }
    
    .md\:py-32{
    padding-top:8rem;
    padding-bottom:8rem
    }
    
    .md\:text-left{
    text-align:left
    }
    
    .md\:text-2xl{
    font-size:1.5rem;
    line-height:2rem
    }
    
    .md\:text-3xl{
    font-size:1.875rem;
    line-height:2.25rem
    }
    
    .md\:text-4xl{
    font-size:2.25rem;
    line-height:2.5rem
    }
    
    .md\:text-8xl{
    font-size:6rem;
    line-height:1
    }
    }
    
    @keyframes float {
    0%, 100% { transform: translateY(0px) translateX(0px); }
    25% { transform: translateY(-20px) translateX(10px); }
    50% { transform: translateY(-10px) translateX(-10px); }
    75% { transform: translateY(-30px) translateX(5px); }
    }
    
    .gradient-text {
    background: linear-gradient(135deg, #fff 0%, #d4af37 50%, #fff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    }
    
    /* Enhanced Orbital System */
    .orbital-container {
    position: relative;
    width: 500px;
    height: 500px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    }
    
    .orbital-center {
    position: absolute;
    width: 120px;
    height: 120px;
    background: radial-gradient(circle, rgba(212,175,55,0.3) 0%, rgba(212,175,55,0.1) 50%, transparent 100%);
    border: 2px solid rgba(212,175,55,0.6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    animation: centerPulse 3s ease-in-out infinite;
    }
    
    .orbital-ring {
    position: absolute;
    border: 1px solid rgba(212,175,55,0.2);
    border-radius: 50%;
    animation: rotateOrbit 20s linear infinite;
    }
    
    .orbital-ring-1 { width: 200px; height: 200px; }
    .orbital-ring-2 { width: 300px; height: 300px; animation-duration: 30s; }
    .orbital-ring-3 { width: 400px; height: 400px; animation-duration: 40s; }
    
    .agent-orb {
    position: absolute;
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, rgba(212,175,55,0.15) 0%, rgba(255,255,255,0.1) 100%);
    backdrop-filter: blur(20px);
    border: 2px solid rgba(212,175,55,0.4);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4,0,0.2,1);
    box-shadow: 0 8px 32px rgba(212,175,55,0.2);
    animation: orbFloat 4s ease-in-out infinite;
    }
    
    .agent-orb:hover {
    transform: scale(1.15);
    background: linear-gradient(135deg, rgba(212,175,55,0.3) 0%, rgba(255,255,255,0.2) 100%);
    border-color: rgba(212,175,55,0.8);
    box-shadow: 0 16px 48px rgba(212,175,55,0.4);
    z-index: 20;
    }
    
    /* Circle center: 200px,200px | Base radius: 180px ±30px */
    .agent-orb-1  { top:   0px; left: 200px; transform: translate(-50%, -50%); animation-delay: 0s; }    /* Monitor - 12 o'clock */
    .agent-orb-2  { top:  27px; left: 300px; transform: translate(-50%, -50%); animation-delay: 0.5s; }  /* Scan - 1 o'clock */
    .agent-orb-3  { top: 100px; left: 373px; transform: translate(-50%, -50%); animation-delay: 1s; }    /* Engage - 2 o'clock */
    .agent-orb-4  { top: 200px; left: 400px; transform: translate(-50%, -50%); animation-delay: 1.5s; }  /* Intake - 3 o'clock */
    .agent-orb-5  { top: 300px; left: 373px; transform: translate(-50%, -50%); animation-delay: 2s; }    /* Qualify - 4 o'clock */
    .agent-orb-6  { top: 373px; left: 300px; transform: translate(-50%, -50%); animation-delay: 2.5s; }  /* Assign - 5 o'clock */
    .agent-orb-7  { top: 400px; left: 200px; transform: translate(-50%, -50%); animation-delay: 3s; }    /* Nurture 6 o'clock */
    .agent-orb-8  { top: 373px; left: 100px; transform: translate(-50%, -50%); animation-delay: 3.5s; }  /* Book - 7 o'clock */
    .agent-orb-9  { top: 300px; left:  27px; transform: translate(-50%, -50%); animation-delay: 4s; }    /* Prepare - 8 o'clock */
    .agent-orb-10 { top: 200px; left:   0px; transform: translate(-50%, -50%); animation-delay: 4.5s; }  /* Close - 9 o'clock */
    .agent-orb-11 { top: 100px; left:  27px; transform: translate(-50%, -50%); animation-delay: 5s; }    /* Analyze - 10 o'clock */
    .agent-orb-12 { top:  27px; left: 100px; transform: translate(-50%, -50%); animation-delay: 5.5s; }  /* Report - 11 o'clock */
    
    .agent-label {
    font-size: 10px;
    font-weight: 600;
    color: white;
    text-align: center;
    line-height: 1.1;
    }
    
    /* Modal Styles */
    .modal {
    display: none;    /* Hidden by default */
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
    backdrop-filter: blur(10px);
    justify-content: center;    /* Center horizontally */
    align-items: flex-start;    /* Align from top */
    padding-top: 50px;    /* Distance from top */
    }
    
    .modal.show {
    display: flex;    /* Only visible when .show is added */
    }
    
    .modal-content {
    background: linear-gradient(135deg, rgba(32,33,36,0.95) 0%, rgba(20,20,20,0.95) 100%);
    backdrop-filter: blur(20px);
    padding: 2rem;
    border: 1px solid rgba(212,175,55,0.3);
    border-radius: 1.5rem;
    width: 90%;
    max-width: 600px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5);
    position: relative;
    margin: 0;    /* Flex handles positioning */
    }
    
    .close {
    color: var(--gold1);
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.3s;
    }
    
    .close:hover {
    color: var(--gold2);
    }
    
    /* Mobile Grid Layout */
    .mobile-grid {
    display: none;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    max-width: 400px;
    margin: 0 auto;
    }
    
    .mobile-agent-card {
    background: linear-gradient(135deg, rgba(212,175,55,0.15) 0%, rgba(255,255,255,0.1) 100%);
    backdrop-filter: blur(20px);
    border: 2px solid rgba(212,175,55,0.4);
    border-radius: 1rem;
    padding: 1.5rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    }
    
    .mobile-agent-card:hover {
    transform: translateY(-4px);
    background: linear-gradient(135deg, rgba(212,175,55,0.25) 0%, rgba(255,255,255,0.15) 100%);
    border-color: rgba(212,175,55,0.6);
    box-shadow: 0 12px 32px rgba(212,175,55,0.3);
    }
    
    /* Animations */
    @keyframes rotateOrbit {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
    }
    
    @keyframes centerPulse {
    0%, 100% { 
    box-shadow: 0 0 20px rgba(212,175,55,0.3);
    transform: scale(1);
    }
    50% { 
    box-shadow: 0 0 40px rgba(212,175,55,0.6);
    transform: scale(1.05);
    }
    }
    
    @keyframes orbFloat {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-8px); }
    }
    
    /* Responsive Design */
    @media (max-width: 768px) {
    .orbital-container {
    display: none;
    }
    
    .mobile-grid {
    display: grid;
    }
    
    .orbital-section-title {
    font-size: 2rem !important;
    }
    
    .orbital-section-subtitle {
    font-size: 1rem !important;
    }
    }
    
    .bottom-8{
    bottom:2rem
    }
    
    .-top-4{
    top:-1rem
    }
    
    .left-8{
    left:2rem
    }
    
    .mb-16{
    margin-bottom:4rem
    }
    
    .-mt-20{
    margin-top:-5rem
    }
    
    .mt-20{
    margin-top:5rem
    }
    
    .mb-20{
    margin-bottom:5rem
    }
    
    .mt-24{
    margin-top:6rem
    }
    
    .h-32{
    height:8rem
    }
    
    .w-1{
    width:0.25rem
    }
    
    .w-32{
    width:8rem
    }
    
    .scroll-mt-24{
    scroll-margin-top:6rem
    }
    
    .flex-wrap{
    flex-wrap:wrap
    }
    
    .items-end{
    align-items:flex-end
    }
    
    .text-right{
    text-align:right
    }
    
    .text-xs{
    font-size:0.75rem;
    line-height:1rem
    }
    
    .uppercase{
    text-transform:uppercase
    }
    
    .tracking-\[0\.25em\]{
    letter-spacing:0.25em
    }
    
    .text-white\/60{
    color:rgb(255 255 255 / 0.6)
    }
    
    .text-white\/70{
    color:rgb(255 255 255 / 0.7)
    }
    
    .underline{
    -webkit-text-decoration-line:underline;
    text-decoration-line:underline
    }
    
    .shadow-2xl{
    --tw-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);
    --tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }
    
    .shadow-xl{
    --tw-shadow:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }
    
    .backdrop-blur-sm{
    --tw-backdrop-blur:blur(4px);
    -webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
    }
    
    .backdrop-filter{
    -webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
    }
    
    .p-12{
    padding:3rem
    }
    
    .pb-6{
    padding-bottom:1.5rem
    }
    
    .pt-6{
    padding-top:1.5rem
    }
    
    .md\:col-span-2{
    grid-column:span 2 / span 2
    }
    
    .md\:grid-cols-2{
    grid-template-columns:repeat(2, minmax(0, 1fr))
    }
    
    .md\:py-5{
    padding-top:1.25rem;
    padding-bottom:1.25rem
    }
    
    .md\:pb-16{
    padding-bottom:4rem
    }
    
    .md\:pt-10{
    padding-top:2.5rem
    }
    
    .md\:text-5xl{
    font-size:3rem;
    line-height:1
    }
    
    .md\:text-6xl{
    font-size:3.75rem;
    line-height:1
    }
    
    .space-y-1 > :not([hidden]) ~ :not([hidden]){
    --tw-space-y-reverse:0;
    margin-top:calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom:calc(0.25rem * var(--tw-space-y-reverse))
    }
    
    .border-white\/10{
    border-color:rgb(255 255 255 / 0.1)
    }
    
    .bg-black\/80{
    background-color:rgb(0 0 0 / 0.8)
    }
    
    .text-gray-300{
    --tw-text-opacity:1;
    color:rgb(209 213 219 / var(--tw-text-opacity, 1))
    }
    .pulse-ring {
  opacity: 0;
  transform: scale(0.5);
  animation: sonar-pulse 3s ease-out infinite;
}

.pulse-ring-1 { animation-delay: 0s; }
.pulse-ring-2 { animation-delay: 0.5s; }
.pulse-ring-3 { animation-delay: 1s; }

@keyframes sonar-pulse {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  20% {
    opacity: 0.8;
    transform: scale(0.8);
  }
  100% {
    opacity: 0;
    transform: scale(1.5);
  }
}

.central-pulse {
  animation: central-glow 2s ease-in-out infinite alternate;
}

@keyframes central-glow {
  0% { opacity: 0.6; transform: scale(1); }
  100% { opacity: 1; transform: scale(1.2); }
}

.signal-lines {
  stroke-dasharray: 5,5;
  animation: signal-flow 4s linear infinite;
}

@keyframes signal-flow {
  0% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 20; }
}

/* Text Animations */
.city-title {
  font-family: 'Playfair Display', serif;
  background: linear-gradient(135deg, #fff 0%, #d4af37 50%, #fff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 30px rgba(212,175,55,0.3);
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.city-title.active {
  opacity: 1 !important;
  transform: translateY(0);
}

.city-coords.active,
.city-status.active {
  opacity: 1 !important;
  transform: translateY(0);
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.city-coords { transition-delay: 0.3s; }
.city-status { transition-delay: 0.6s; }

/* Global Network Animations */
.grid-node {
  animation: node-pulse 3s ease-in-out infinite;
}

@keyframes node-pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 1; }
}

.network-backbone {
  stroke-dasharray: 10,5;
  animation: data-flow 6s linear infinite;
}

@keyframes data-flow {
  0% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 30; }
}

.major-node {
  animation: major-pulse 2s ease-in-out infinite;
}

@keyframes major-pulse {
  0%, 100% { 
    opacity: 0.8; 
    transform: scale(1);
    filter: drop-shadow(0 0 5px #d4af37);
  }
  50% { 
    opacity: 1; 
    transform: scale(1.3);
    filter: drop-shadow(0 0 15px #d4af37);
  }
}

.final-message {
  transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.final-message.active {
  opacity: 1 !important;
  transform: translateY(0);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .city-title {
    font-size: 3rem;
  }
  
  .city-landmark {
    width: 300px;
    height: 450px;
  }
}
/* Mobile: keep the social icons in a horizontal row, left-aligned */
@media (max-width: 768px) {
  #footer-connect .connect-icons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;         /* will wrap to a 2nd line on tiny phones if needed */
    justify-content: flex-start;  /* ⬅️ change this line */
    gap: 1rem;
    white-space: nowrap;
  }
  #footer-connect .connect-icons > a {
    display: inline-flex !important;
    align-items: center;
    flex-shrink: 0;
  }
}

/* Desktop: left align under “Connect” */
@media (min-width: 768px) {
  #footer-connect .connect-icons { justify-content: flex-start !important; }
}
@media (max-width: 768px){
  #eligibility .grid { grid-template-columns: 1fr !important; }
}