*{
    box-sizing:border-box;
}

:root{
    --earth:#efe4d0;
    --paper:#fbf7ef;
    --ink:#221e19;
    --indigo:#18263c;
    --palm:#46684f;
    --clay:#b94f3e;
    --brass:#b88631;
    --muted:#786f64;
    --line:rgba(35,28,22,.09);
}

body{
    margin:0;
    min-height:100vh;

    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    color:var(--ink);

    background:
        radial-gradient(
            circle at 100% 0,
            rgba(184,134,49,.18),
            transparent 26rem
        ),
        radial-gradient(
            circle at 0 100%,
            rgba(70,104,79,.11),
            transparent 30rem
        ),
        var(--earth);
}

.air-shell{
    width:min(
        1080px,
        calc(100% - 28px)
    );

    margin:auto;

    padding:28px 0 110px;
}

.air-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;

    font-size:10px;
    letter-spacing:.13em;
}

.air-top nav{
    display:flex;
    gap:16px;
}

.air-top a{
    color:var(--ink);
    text-decoration:none;
    letter-spacing:0;
}

.air-hero{
    margin-top:68px;
    max-width:820px;
}

.air-hero small{
    color:var(--brass);

    font-weight:900;
    letter-spacing:.17em;
}

.air-hero h1{
    margin:10px 0 13px;

    font-size:
        clamp(
            55px,
            9vw,
            100px
        );

    line-height:.86;
    letter-spacing:-.075em;
}

.air-hero p{
    max-width:590px;

    color:var(--muted);
    line-height:1.65;
}

.air-list{
    margin-top:32px;

    display:grid;
    gap:10px;
}

.air-card{
    padding:22px;

    border-radius:29px;

    border:
        1px solid var(--line);

    background:
        rgba(251,247,239,.95);

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        auto;

    align-items:center;

    gap:20px;
}

.air-state{
    color:var(--palm);

    font-size:8px;
    font-weight:900;

    letter-spacing:.13em;
}

.air-title{
    margin:7px 0 9px;

    font-size:18px;

    letter-spacing:-.03em;
}

.air-meta{
    display:flex;
    flex-wrap:wrap;

    gap:6px;
}

.air-pill{
    padding:6px 9px;

    border-radius:999px;

    background:#e8dfd0;

    color:#6f675e;

    font-size:8px;
    font-weight:800;
}

.air-button{
    min-width:138px;
    min-height:52px;

    border:0;
    border-radius:18px;

    background:var(--indigo);
    color:#fff;

    cursor:pointer;

    font-weight:900;

    transition:
        transform .10s ease,
        opacity .15s ease;
}

.air-button:active{
    transform:scale(.95);
}

.air-button:disabled{
    cursor:not-allowed;
    opacity:.48;
}

.air-button.busy{
    background:var(--brass);
}

.air-empty{
    padding:32px;

    border-radius:29px;

    background:var(--paper);

    color:var(--muted);

    line-height:1.7;
}

.air-principle{
    margin-top:35px;

    padding:18px;

    border-left:
        3px solid var(--brass);

    color:var(--muted);

    line-height:1.7;

    font-size:11px;
}

.air-principle strong{
    color:var(--indigo);
}

.air-toast{
    position:fixed;

    left:50%;
    bottom:28px;

    z-index:2000;

    transform:
        translate(-50%,20px);

    max-width:
        calc(100% - 30px);

    padding:12px 16px;

    border-radius:999px;

    background:var(--indigo);
    color:#fff;

    opacity:0;

    pointer-events:none;

    font-size:10px;

    transition:
        opacity .18s ease,
        transform .18s ease;
}

.air-toast.show{
    opacity:1;

    transform:
        translate(-50%,0);
}


/* T2 launcher used on radio.php */

.v407-air-launcher{
    position:fixed;

    left:18px;
    bottom:108px;

    z-index:1080;

    min-height:46px;

    display:flex;
    align-items:center;
    gap:8px;

    padding:7px 13px 7px 8px;

    border-radius:999px;

    background:
        rgba(24,38,60,.94);

    color:white;

    text-decoration:none;

    box-shadow:
        0 15px 42px
        rgba(25,20,16,.18);
}

.v407-air-dot{
    width:31px;
    height:31px;

    border-radius:50%;

    display:grid;
    place-items:center;

    background:var(--clay);
}

.v407-air-label{
    font-size:9px;
    font-weight:900;
    letter-spacing:.07em;
}

html[data-template="T1"]
.v407-air-launcher{
    display:none;
}


@media(max-width:650px){

    .air-card{
        grid-template-columns:1fr;
    }

    .air-button{
        width:100%;
    }

    .air-hero{
        margin-top:48px;
    }

    .v407-air-launcher{
        left:12px;
        bottom:92px;
    }

    .v407-air-label{
        display:none;
    }
}
